@flowgram-vue/history-node-plugin 0.2.0

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+Copyright (c) 2026 Crayon
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.cjs

@@ -0,0 +1,127 @@
+'use strict';
+
+var document = require('@flowgram-vue/document');
+var core = require('@flowgram-vue/core');
+var history = require('@flowgram-vue/history');
+var lodashEs = require('lodash-es');
+var node = require('@flowgram-vue/node');
+var formCore = require('@flowgram-vue/form-core');
+var inversify = require('inversify');
+
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(result)) || result;
+  return result;
+};
+function getFormModelV2(node$1) {
+  if (!node$1) {
+    return void 0;
+  }
+  const formModel = node$1?.getData(formCore.FlowNodeFormData)?.getFormModel();
+  if (!formModel || !node.isFormModelV2(formModel)) {
+    return void 0;
+  }
+  return formModel;
+}
+function shouldChangeFormValuesMerge(op, prev, element) {
+  if (!prev) {
+    return false;
+  }
+  if (Date.now() - element.getTimestamp() < 500) {
+    if (op.type === prev.type && // 相同类型
+    op.value?.id === prev.value?.id && // 相同节点
+    op.value?.path === prev.value?.path) {
+      return {
+        type: op.type,
+        value: {
+          ...op.value,
+          value: op.value?.value,
+          oldValue: prev.value?.oldValue
+        }
+      };
+    }
+    return true;
+  }
+  return false;
+}
+function attachFormValuesChange(formModel, node, historyService) {
+  formModel.onFormValuesChange((event) => {
+    historyService.pushOperation(
+      {
+        type: "changeFormValues" /* changeFormValues */,
+        value: {
+          id: node.id,
+          path: event.name,
+          value: event.name ? lodashEs.get(event.values, event.name) : event.values,
+          oldValue: event.name ? lodashEs.get(event.prevValues, event.name) : event.prevValues
+        }
+      },
+      { noApply: true }
+    );
+  });
+}
+var changeFormValueOperationMeta = {
+  type: "changeFormValues" /* changeFormValues */,
+  inverse: (op) => ({
+    ...op,
+    value: {
+      ...op.value,
+      value: op.value.oldValue,
+      oldValue: op.value.value
+    }
+  }),
+  apply: ({ value: { value, path, id } }, ctx) => {
+    const document$1 = ctx.get(document.FlowDocument);
+    const formModel = getFormModelV2(document$1.getNode(id));
+    if (!formModel) {
+      return;
+    }
+    if (!path) {
+      formModel.updateFormValues(value);
+    } else {
+      formModel.setValueIn(path, value);
+    }
+  },
+  shouldMerge: shouldChangeFormValuesMerge
+};
+
+// src/operation-metas/index.ts
+var operationMetas = [changeFormValueOperationMeta];
+
+// src/history-node-registers.ts
+var HistoryNodeRegisters = class {
+  registerOperationMeta(operationRegistry) {
+    operationMetas.forEach((operationMeta) => {
+      operationRegistry.registerOperationMeta(operationMeta);
+    });
+  }
+};
+HistoryNodeRegisters = __decorateClass([
+  inversify.injectable()
+], HistoryNodeRegisters);
+
+// src/create-history-node-plugin.ts
+var createHistoryNodePlugin = core.definePluginCreator({
+  onBind: ({ bind }) => {
+    core.bindContributions(bind, HistoryNodeRegisters, [history.OperationContribution]);
+  },
+  onInit: (ctx, _opts) => {
+    const document$1 = ctx.get(document.FlowDocument);
+    const historyService = ctx.get(history.HistoryService);
+    document$1.onNodeCreate(({ node }) => {
+      const formModel = getFormModelV2(node);
+      if (!formModel) {
+        return;
+      }
+      attachFormValuesChange(formModel, node, historyService);
+    });
+  },
+  containerModules: [history.HistoryContainerModule]
+});
+
+exports.createHistoryNodePlugin = createHistoryNodePlugin;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/index.ts","../src/operation-metas/change-form-values.ts","../src/operation-metas/index.ts","../src/history-node-registers.ts","../src/create-history-node-plugin.ts"],"names":["node","FlowNodeFormData","isFormModelV2","get","document","FlowDocument","injectable","definePluginCreator","bindContributions","OperationContribution","HistoryService","HistoryContainerModule"],"mappings":"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","file":"index.cjs","sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { get } from 'lodash-es';\nimport { FormModelV2, isFormModelV2 } from '@flowgram-vue/node';\nimport { HistoryService, Operation } from '@flowgram-vue/history';\nimport { StackOperation } from '@flowgram-vue/history';\nimport { FlowNodeFormData } from '@flowgram-vue/form-core';\nimport { FlowNodeEntity } from '@flowgram-vue/document';\n\nimport { ChangeFormValuesOperationValue, NodeOperationType } from '../types';\n\n/**\n * 获取v2版本的formModel\n * @param node 节点\n * @returns\n */\nexport function getFormModelV2(node: FlowNodeEntity | undefined): FormModelV2 | undefined {\n  if (!node) {\n    return undefined;\n  }\n\n  const formModel = node?.getData(FlowNodeFormData)?.getFormModel<FormModelV2>();\n\n  if (!formModel || !isFormModelV2(formModel)) {\n    return undefined;\n  }\n\n  return formModel;\n}\n\n/**\n * 表单合并策略\n * @param op 操作\n * @param prev 上一个操作\n * @param element 操作栈元素\n * @returns\n */\nexport function shouldChangeFormValuesMerge(\n  op: Operation<ChangeFormValuesOperationValue | undefined>,\n  prev: Operation<ChangeFormValuesOperationValue | undefined>,\n  element: StackOperation\n) {\n  if (!prev) {\n    return false;\n  }\n\n  if (Date.now() - element.getTimestamp() < 500) {\n    if (\n      op.type === prev.type && // 相同类型\n      op.value?.id === prev.value?.id && // 相同节点\n      op.value?.path === prev.value?.path // 相同路径\n    ) {\n      return {\n        type: op.type,\n        value: {\n          ...op.value,\n          value: op.value?.value,\n          oldValue: prev.value?.oldValue,\n        },\n      };\n    }\n    return true;\n  }\n  return false;\n}\n\n/**\n * 监听表单值变化\n * @param formModel 表单模型\n * @param node 节点\n * @param historyService 历史服务\n */\nexport function attachFormValuesChange(\n  formModel: FormModelV2,\n  node: FlowNodeEntity,\n  historyService: HistoryService\n) {\n  formModel.onFormValuesChange((event) => {\n    historyService.pushOperation(\n      {\n        type: NodeOperationType.changeFormValues,\n        value: {\n          id: node.id,\n          path: event.name,\n          value: event.name ? get(event.values, event.name) : event.values,\n          oldValue: event.name ? get(event.prevValues, event.name) : event.prevValues,\n        },\n      },\n      { noApply: true }\n    );\n  });\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { type OperationMeta } from '@flowgram-vue/history';\nimport { FlowDocument } from '@flowgram-vue/document';\nimport { type PluginContext } from '@flowgram-vue/core';\n\nimport { getFormModelV2, shouldChangeFormValuesMerge } from '../utils';\nimport { ChangeFormValuesOperationValue, NodeOperationType } from '../types';\n\n/**\n * 表单修改操作\n */\nexport const changeFormValueOperationMeta: OperationMeta<\n  ChangeFormValuesOperationValue,\n  PluginContext,\n  void\n> = {\n  type: NodeOperationType.changeFormValues,\n  inverse: (op) => ({\n    ...op,\n    value: {\n      ...op.value,\n      value: op.value.oldValue,\n      oldValue: op.value.value,\n    },\n  }),\n  apply: ({ value: { value, path, id } }, ctx: PluginContext) => {\n    const document = ctx.get<FlowDocument>(FlowDocument);\n    const formModel = getFormModelV2(document.getNode(id));\n\n    if (!formModel) {\n      return;\n    }\n    if (!path) {\n      formModel.updateFormValues(value);\n    } else {\n      formModel.setValueIn(path, value);\n    }\n  },\n  shouldMerge: shouldChangeFormValuesMerge as OperationMeta['shouldMerge'],\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { OperationMeta } from '@flowgram-vue/history';\n\nimport { changeFormValueOperationMeta } from './change-form-values';\n\nexport const operationMetas: OperationMeta[] = [changeFormValueOperationMeta];\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable } from 'inversify';\nimport { type OperationContribution, type OperationRegistry } from '@flowgram-vue/history';\n\nimport { operationMetas } from './operation-metas';\n\n/**\n * 表单历史操作\n */\n@injectable()\nexport class HistoryNodeRegisters implements OperationContribution {\n  registerOperationMeta(operationRegistry: OperationRegistry): void {\n    operationMetas.forEach(operationMeta => {\n      operationRegistry.registerOperationMeta(operationMeta);\n    });\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FlowDocument } from '@flowgram-vue/document';\nimport { bindContributions, definePluginCreator } from '@flowgram-vue/core';\nimport { HistoryContainerModule, HistoryService, OperationContribution } from '@flowgram-vue/history';\n\nimport { attachFormValuesChange, getFormModelV2 } from './utils';\nimport { HistoryNodeRegisters } from './history-node-registers';\n\n/**\n * 表单历史插件\n */\nexport const createHistoryNodePlugin = definePluginCreator({\n  onBind: ({ bind }) => {\n    bindContributions(bind, HistoryNodeRegisters, [OperationContribution]);\n  },\n  onInit: (ctx, _opts) => {\n    const document = ctx.get<FlowDocument>(FlowDocument);\n    const historyService = ctx.get<HistoryService>(HistoryService);\n\n    document.onNodeCreate(({ node }) => {\n      const formModel = getFormModelV2(node);\n\n      if (!formModel) {\n        return;\n      }\n\n      attachFormValuesChange(formModel, node, historyService);\n    });\n  },\n  containerModules: [HistoryContainerModule],\n});\n"]}

package/dist/index.d.ts

@@ -0,0 +1,12 @@
+import * as _flowgram_vue_core from '@flowgram-vue/core';
+
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * 表单历史插件
+ */
+declare const createHistoryNodePlugin: _flowgram_vue_core.PluginCreator<unknown>;
+
+export { createHistoryNodePlugin };

package/dist/index.js

@@ -0,0 +1,125 @@
+import { FlowDocument } from '@flowgram-vue/document';
+import { definePluginCreator, bindContributions } from '@flowgram-vue/core';
+import { HistoryContainerModule, HistoryService, OperationContribution } from '@flowgram-vue/history';
+import { get } from 'lodash-es';
+import { isFormModelV2 } from '@flowgram-vue/node';
+import { FlowNodeFormData } from '@flowgram-vue/form-core';
+import { injectable } from 'inversify';
+
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(result)) || result;
+  return result;
+};
+function getFormModelV2(node) {
+  if (!node) {
+    return void 0;
+  }
+  const formModel = node?.getData(FlowNodeFormData)?.getFormModel();
+  if (!formModel || !isFormModelV2(formModel)) {
+    return void 0;
+  }
+  return formModel;
+}
+function shouldChangeFormValuesMerge(op, prev, element) {
+  if (!prev) {
+    return false;
+  }
+  if (Date.now() - element.getTimestamp() < 500) {
+    if (op.type === prev.type && // 相同类型
+    op.value?.id === prev.value?.id && // 相同节点
+    op.value?.path === prev.value?.path) {
+      return {
+        type: op.type,
+        value: {
+          ...op.value,
+          value: op.value?.value,
+          oldValue: prev.value?.oldValue
+        }
+      };
+    }
+    return true;
+  }
+  return false;
+}
+function attachFormValuesChange(formModel, node, historyService) {
+  formModel.onFormValuesChange((event) => {
+    historyService.pushOperation(
+      {
+        type: "changeFormValues" /* changeFormValues */,
+        value: {
+          id: node.id,
+          path: event.name,
+          value: event.name ? get(event.values, event.name) : event.values,
+          oldValue: event.name ? get(event.prevValues, event.name) : event.prevValues
+        }
+      },
+      { noApply: true }
+    );
+  });
+}
+var changeFormValueOperationMeta = {
+  type: "changeFormValues" /* changeFormValues */,
+  inverse: (op) => ({
+    ...op,
+    value: {
+      ...op.value,
+      value: op.value.oldValue,
+      oldValue: op.value.value
+    }
+  }),
+  apply: ({ value: { value, path, id } }, ctx) => {
+    const document = ctx.get(FlowDocument);
+    const formModel = getFormModelV2(document.getNode(id));
+    if (!formModel) {
+      return;
+    }
+    if (!path) {
+      formModel.updateFormValues(value);
+    } else {
+      formModel.setValueIn(path, value);
+    }
+  },
+  shouldMerge: shouldChangeFormValuesMerge
+};
+
+// src/operation-metas/index.ts
+var operationMetas = [changeFormValueOperationMeta];
+
+// src/history-node-registers.ts
+var HistoryNodeRegisters = class {
+  registerOperationMeta(operationRegistry) {
+    operationMetas.forEach((operationMeta) => {
+      operationRegistry.registerOperationMeta(operationMeta);
+    });
+  }
+};
+HistoryNodeRegisters = __decorateClass([
+  injectable()
+], HistoryNodeRegisters);
+
+// src/create-history-node-plugin.ts
+var createHistoryNodePlugin = definePluginCreator({
+  onBind: ({ bind }) => {
+    bindContributions(bind, HistoryNodeRegisters, [OperationContribution]);
+  },
+  onInit: (ctx, _opts) => {
+    const document = ctx.get(FlowDocument);
+    const historyService = ctx.get(HistoryService);
+    document.onNodeCreate(({ node }) => {
+      const formModel = getFormModelV2(node);
+      if (!formModel) {
+        return;
+      }
+      attachFormValuesChange(formModel, node, historyService);
+    });
+  },
+  containerModules: [HistoryContainerModule]
+});
+
+export { createHistoryNodePlugin };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/index.ts","../src/operation-metas/change-form-values.ts","../src/operation-metas/index.ts","../src/history-node-registers.ts","../src/create-history-node-plugin.ts"],"names":["FlowDocument"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { get } from 'lodash-es';\nimport { FormModelV2, isFormModelV2 } from '@flowgram-vue/node';\nimport { HistoryService, Operation } from '@flowgram-vue/history';\nimport { StackOperation } from '@flowgram-vue/history';\nimport { FlowNodeFormData } from '@flowgram-vue/form-core';\nimport { FlowNodeEntity } from '@flowgram-vue/document';\n\nimport { ChangeFormValuesOperationValue, NodeOperationType } from '../types';\n\n/**\n * 获取v2版本的formModel\n * @param node 节点\n * @returns\n */\nexport function getFormModelV2(node: FlowNodeEntity | undefined): FormModelV2 | undefined {\n  if (!node) {\n    return undefined;\n  }\n\n  const formModel = node?.getData(FlowNodeFormData)?.getFormModel<FormModelV2>();\n\n  if (!formModel || !isFormModelV2(formModel)) {\n    return undefined;\n  }\n\n  return formModel;\n}\n\n/**\n * 表单合并策略\n * @param op 操作\n * @param prev 上一个操作\n * @param element 操作栈元素\n * @returns\n */\nexport function shouldChangeFormValuesMerge(\n  op: Operation<ChangeFormValuesOperationValue | undefined>,\n  prev: Operation<ChangeFormValuesOperationValue | undefined>,\n  element: StackOperation\n) {\n  if (!prev) {\n    return false;\n  }\n\n  if (Date.now() - element.getTimestamp() < 500) {\n    if (\n      op.type === prev.type && // 相同类型\n      op.value?.id === prev.value?.id && // 相同节点\n      op.value?.path === prev.value?.path // 相同路径\n    ) {\n      return {\n        type: op.type,\n        value: {\n          ...op.value,\n          value: op.value?.value,\n          oldValue: prev.value?.oldValue,\n        },\n      };\n    }\n    return true;\n  }\n  return false;\n}\n\n/**\n * 监听表单值变化\n * @param formModel 表单模型\n * @param node 节点\n * @param historyService 历史服务\n */\nexport function attachFormValuesChange(\n  formModel: FormModelV2,\n  node: FlowNodeEntity,\n  historyService: HistoryService\n) {\n  formModel.onFormValuesChange((event) => {\n    historyService.pushOperation(\n      {\n        type: NodeOperationType.changeFormValues,\n        value: {\n          id: node.id,\n          path: event.name,\n          value: event.name ? get(event.values, event.name) : event.values,\n          oldValue: event.name ? get(event.prevValues, event.name) : event.prevValues,\n        },\n      },\n      { noApply: true }\n    );\n  });\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { type OperationMeta } from '@flowgram-vue/history';\nimport { FlowDocument } from '@flowgram-vue/document';\nimport { type PluginContext } from '@flowgram-vue/core';\n\nimport { getFormModelV2, shouldChangeFormValuesMerge } from '../utils';\nimport { ChangeFormValuesOperationValue, NodeOperationType } from '../types';\n\n/**\n * 表单修改操作\n */\nexport const changeFormValueOperationMeta: OperationMeta<\n  ChangeFormValuesOperationValue,\n  PluginContext,\n  void\n> = {\n  type: NodeOperationType.changeFormValues,\n  inverse: (op) => ({\n    ...op,\n    value: {\n      ...op.value,\n      value: op.value.oldValue,\n      oldValue: op.value.value,\n    },\n  }),\n  apply: ({ value: { value, path, id } }, ctx: PluginContext) => {\n    const document = ctx.get<FlowDocument>(FlowDocument);\n    const formModel = getFormModelV2(document.getNode(id));\n\n    if (!formModel) {\n      return;\n    }\n    if (!path) {\n      formModel.updateFormValues(value);\n    } else {\n      formModel.setValueIn(path, value);\n    }\n  },\n  shouldMerge: shouldChangeFormValuesMerge as OperationMeta['shouldMerge'],\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { OperationMeta } from '@flowgram-vue/history';\n\nimport { changeFormValueOperationMeta } from './change-form-values';\n\nexport const operationMetas: OperationMeta[] = [changeFormValueOperationMeta];\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable } from 'inversify';\nimport { type OperationContribution, type OperationRegistry } from '@flowgram-vue/history';\n\nimport { operationMetas } from './operation-metas';\n\n/**\n * 表单历史操作\n */\n@injectable()\nexport class HistoryNodeRegisters implements OperationContribution {\n  registerOperationMeta(operationRegistry: OperationRegistry): void {\n    operationMetas.forEach(operationMeta => {\n      operationRegistry.registerOperationMeta(operationMeta);\n    });\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FlowDocument } from '@flowgram-vue/document';\nimport { bindContributions, definePluginCreator } from '@flowgram-vue/core';\nimport { HistoryContainerModule, HistoryService, OperationContribution } from '@flowgram-vue/history';\n\nimport { attachFormValuesChange, getFormModelV2 } from './utils';\nimport { HistoryNodeRegisters } from './history-node-registers';\n\n/**\n * 表单历史插件\n */\nexport const createHistoryNodePlugin = definePluginCreator({\n  onBind: ({ bind }) => {\n    bindContributions(bind, HistoryNodeRegisters, [OperationContribution]);\n  },\n  onInit: (ctx, _opts) => {\n    const document = ctx.get<FlowDocument>(FlowDocument);\n    const historyService = ctx.get<HistoryService>(HistoryService);\n\n    document.onNodeCreate(({ node }) => {\n      const formModel = getFormModelV2(node);\n\n      if (!formModel) {\n        return;\n      }\n\n      attachFormValuesChange(formModel, node, historyService);\n    });\n  },\n  containerModules: [HistoryContainerModule],\n});\n"]}

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@flowgram-vue/history-node-plugin",
+  "version": "0.2.0",
+  "type": "module",
+  "homepage": "https://flowgram.ai/",
+  "repository": "https://github.com/Crayon-hua/flowgram-vue",
+  "license": "MIT",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "dependencies": {
+    "inversify": "^6.0.1",
+    "lodash-es": "^4.17.21",
+    "reflect-metadata": "~0.2.2",
+    "@flowgram-vue/document": "0.2.0",
+    "@flowgram-vue/core": "0.2.0",
+    "@flowgram-vue/history": "0.2.0",
+    "@flowgram-vue/node": "0.2.0",
+    "@flowgram-vue/form": "0.2.0",
+    "@flowgram-vue/form-core": "0.2.0"
+  },
+  "devDependencies": {
+    "@types/lodash-es": "^4.17.12",
+    "@types/node": "^20",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "@vitest/coverage-v8": "^3.2.4",
+    "eslint": "^9.0.0",
+    "jsdom": "^26.1.0",
+    "typescript": "^5.8.3",
+    "vitest": "^3.2.4",
+    "vue": "^3.5.18",
+    "@flowgram-vue/eslint-config": "0.2.0",
+    "@flowgram-vue/ts-config": "0.2.0",
+    "@flowgram-vue/build-config": "0.2.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "flowgram-build",
+    "test": "vitest run",
+    "test:cov": "vitest run --coverage",
+    "lint": "eslint .",
+    "ts-check": "tsc --noEmit",
+    "type-check": "tsc --noEmit",
+    "build:fast": "flowgram-build --fast",
+    "build:watch": "flowgram-build --watch"
+  }
+}

package/src/create-history-node-plugin.ts

@@ -0,0 +1,35 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { FlowDocument } from '@flowgram-vue/document';
+import { bindContributions, definePluginCreator } from '@flowgram-vue/core';
+import { HistoryContainerModule, HistoryService, OperationContribution } from '@flowgram-vue/history';
+
+import { attachFormValuesChange, getFormModelV2 } from './utils';
+import { HistoryNodeRegisters } from './history-node-registers';
+
+/**
+ * 表单历史插件
+ */
+export const createHistoryNodePlugin = definePluginCreator({
+  onBind: ({ bind }) => {
+    bindContributions(bind, HistoryNodeRegisters, [OperationContribution]);
+  },
+  onInit: (ctx, _opts) => {
+    const document = ctx.get<FlowDocument>(FlowDocument);
+    const historyService = ctx.get<HistoryService>(HistoryService);
+
+    document.onNodeCreate(({ node }) => {
+      const formModel = getFormModelV2(node);
+
+      if (!formModel) {
+        return;
+      }
+
+      attachFormValuesChange(formModel, node, historyService);
+    });
+  },
+  containerModules: [HistoryContainerModule],
+});

package/src/env.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue';
+  const component: DefineComponent<object, object, unknown>;
+  export default component;
+}

package/src/history-node-registers.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { injectable } from 'inversify';
+import { type OperationContribution, type OperationRegistry } from '@flowgram-vue/history';
+
+import { operationMetas } from './operation-metas';
+
+/**
+ * 表单历史操作
+ */
+@injectable()
+export class HistoryNodeRegisters implements OperationContribution {
+  registerOperationMeta(operationRegistry: OperationRegistry): void {
+    operationMetas.forEach(operationMeta => {
+      operationRegistry.registerOperationMeta(operationMeta);
+    });
+  }
+}

package/src/index.ts

@@ -0,0 +1,6 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export * from './create-history-node-plugin';

package/src/operation-metas/change-form-values.ts

@@ -0,0 +1,44 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { type OperationMeta } from '@flowgram-vue/history';
+import { FlowDocument } from '@flowgram-vue/document';
+import { type PluginContext } from '@flowgram-vue/core';
+
+import { getFormModelV2, shouldChangeFormValuesMerge } from '../utils';
+import { ChangeFormValuesOperationValue, NodeOperationType } from '../types';
+
+/**
+ * 表单修改操作
+ */
+export const changeFormValueOperationMeta: OperationMeta<
+  ChangeFormValuesOperationValue,
+  PluginContext,
+  void
+> = {
+  type: NodeOperationType.changeFormValues,
+  inverse: (op) => ({
+    ...op,
+    value: {
+      ...op.value,
+      value: op.value.oldValue,
+      oldValue: op.value.value,
+    },
+  }),
+  apply: ({ value: { value, path, id } }, ctx: PluginContext) => {
+    const document = ctx.get<FlowDocument>(FlowDocument);
+    const formModel = getFormModelV2(document.getNode(id));
+
+    if (!formModel) {
+      return;
+    }
+    if (!path) {
+      formModel.updateFormValues(value);
+    } else {
+      formModel.setValueIn(path, value);
+    }
+  },
+  shouldMerge: shouldChangeFormValuesMerge as OperationMeta['shouldMerge'],
+};

package/src/operation-metas/index.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { OperationMeta } from '@flowgram-vue/history';
+
+import { changeFormValueOperationMeta } from './change-form-values';
+
+export const operationMetas: OperationMeta[] = [changeFormValueOperationMeta];

package/src/types.ts

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export enum NodeOperationType {
+  changeFormValues = 'changeFormValues',
+}
+
+export interface ChangeFormValuesOperationValue {
+  id: string;
+  path: string;
+  value: unknown;
+  oldValue: unknown;
+}

package/src/utils/index.ts

@@ -0,0 +1,95 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { get } from 'lodash-es';
+import { FormModelV2, isFormModelV2 } from '@flowgram-vue/node';
+import { HistoryService, Operation } from '@flowgram-vue/history';
+import { StackOperation } from '@flowgram-vue/history';
+import { FlowNodeFormData } from '@flowgram-vue/form-core';
+import { FlowNodeEntity } from '@flowgram-vue/document';
+
+import { ChangeFormValuesOperationValue, NodeOperationType } from '../types';
+
+/**
+ * 获取v2版本的formModel
+ * @param node 节点
+ * @returns
+ */
+export function getFormModelV2(node: FlowNodeEntity | undefined): FormModelV2 | undefined {
+  if (!node) {
+    return undefined;
+  }
+
+  const formModel = node?.getData(FlowNodeFormData)?.getFormModel<FormModelV2>();
+
+  if (!formModel || !isFormModelV2(formModel)) {
+    return undefined;
+  }
+
+  return formModel;
+}
+
+/**
+ * 表单合并策略
+ * @param op 操作
+ * @param prev 上一个操作
+ * @param element 操作栈元素
+ * @returns
+ */
+export function shouldChangeFormValuesMerge(
+  op: Operation<ChangeFormValuesOperationValue | undefined>,
+  prev: Operation<ChangeFormValuesOperationValue | undefined>,
+  element: StackOperation
+) {
+  if (!prev) {
+    return false;
+  }
+
+  if (Date.now() - element.getTimestamp() < 500) {
+    if (
+      op.type === prev.type && // 相同类型
+      op.value?.id === prev.value?.id && // 相同节点
+      op.value?.path === prev.value?.path // 相同路径
+    ) {
+      return {
+        type: op.type,
+        value: {
+          ...op.value,
+          value: op.value?.value,
+          oldValue: prev.value?.oldValue,
+        },
+      };
+    }
+    return true;
+  }
+  return false;
+}
+
+/**
+ * 监听表单值变化
+ * @param formModel 表单模型
+ * @param node 节点
+ * @param historyService 历史服务
+ */
+export function attachFormValuesChange(
+  formModel: FormModelV2,
+  node: FlowNodeEntity,
+  historyService: HistoryService
+) {
+  formModel.onFormValuesChange((event) => {
+    historyService.pushOperation(
+      {
+        type: NodeOperationType.changeFormValues,
+        value: {
+          id: node.id,
+          path: event.name,
+          value: event.name ? get(event.values, event.name) : event.values,
+          oldValue: event.name ? get(event.prevValues, event.name) : event.prevValues,
+        },
+      },
+      { noApply: true }
+    );
+  });
+}