@flowgram-vue/redux-devtool-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,136 @@
+'use strict';
+
+var core = require('@flowgram-vue/core');
+var inversify = require('inversify');
+var variableCore = require('@flowgram-vue/variable-core');
+
+var __defProp = Object.defineProperty;
+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 = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+var BaseConnector = class {
+  constructor() {
+    this.devTools = window.__REDUX_DEVTOOLS_EXTENSION__?.connect({
+      name: this.getName()
+    });
+  }
+  init() {
+    if (this.devTools) {
+      this.devTools.init(this.getState());
+      this.devTools.subscribe((_msg) => {
+        if (_msg?.payload?.type === "COMMIT") {
+          this.devTools.init(this.getState());
+        }
+      });
+      this.onInit();
+    }
+  }
+  send(action, state) {
+    if (this.devTools) {
+      this.devTools.send(action, state || this.getState());
+    }
+  }
+};
+__decorateClass([
+  inversify.postConstruct()
+], BaseConnector.prototype, "init", 1);
+BaseConnector = __decorateClass([
+  inversify.injectable()
+], BaseConnector);
+
+// src/connectors/ecs-connector.ts
+exports.ECSConnector = class ECSConnector extends BaseConnector {
+  getName() {
+    return "@flowgram-vue/EntityManager";
+  }
+  getState() {
+    return this.entityManager.storeState({ configOnly: false });
+  }
+  onInit() {
+    this.entityManager.onEntityLifeCycleChange((action) => {
+      this.send(`${action.type}/${action.entity.type}/${action.entity.id}`);
+    });
+  }
+};
+__decorateClass([
+  inversify.inject(core.EntityManager)
+], exports.ECSConnector.prototype, "entityManager", 2);
+exports.ECSConnector = __decorateClass([
+  inversify.injectable()
+], exports.ECSConnector);
+var VariableConnector = class extends BaseConnector {
+  constructor() {
+    super(...arguments);
+    /**
+     * 缓存变量状态
+     */
+    this.scopes = {};
+  }
+  getName() {
+    return "@flowgram-vue/VariableEngine";
+  }
+  getState() {
+    return { scopes: this.scopes, variables: this.variableEngine.globalVariableTable.variables };
+  }
+  getScopeState(scope) {
+    return {
+      ast: scope?.ast.toJSON(),
+      output: scope.output.variables,
+      available: scope.available.variables
+    };
+  }
+  onInit() {
+    this.variableEngine.onScopeChange((action) => {
+      const { scope, type } = action;
+      if (type === "delete") {
+        delete this.scopes[String(scope.id)];
+      } else {
+        this.scopes = {
+          ...this.scopes,
+          [scope.id]: this.getScopeState(scope)
+        };
+      }
+      this.send(`${type}/${String(scope.id)}`);
+    });
+  }
+};
+__decorateClass([
+  inversify.inject(variableCore.VariableEngine)
+], VariableConnector.prototype, "variableEngine", 2);
+VariableConnector = __decorateClass([
+  inversify.injectable()
+], VariableConnector);
+
+// src/create-redux-devtool-plugin.ts
+var createReduxDevToolPlugin = core.definePluginCreator({
+  onBind({ bind }, opts) {
+    const { enable } = opts;
+    if (!enable) {
+      return;
+    }
+    bind(exports.ECSConnector).toSelf().inSingletonScope();
+    bind(VariableConnector).toSelf().inSingletonScope();
+  },
+  onInit(ctx, opts) {
+    const { enable, ecs = true, variable = false } = opts;
+    if (!enable) {
+      return;
+    }
+    if (ecs) {
+      ctx.get(exports.ECSConnector);
+    }
+    if (variable) {
+      ctx.get(VariableConnector);
+    }
+  }
+});
+
+exports.createReduxDevToolPlugin = createReduxDevToolPlugin;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/connectors/base.ts","../src/connectors/ecs-connector.ts","../src/connectors/variable-connector.ts","../src/create-redux-devtool-plugin.ts"],"names":["postConstruct","injectable","ECSConnector","inject","EntityManager","VariableEngine","definePluginCreator"],"mappings":";;;;;;;;;;;;;;;;AAWO,IAAe,gBAAf,MAA6B;AAAA,EASlC,WAAA,GAAc;AACZ,IAAA,IAAA,CAAK,QAAA,GAAY,MAAA,CAAe,4BAAA,EAA8B,OAAA,CAAQ;AAAA,MACpE,IAAA,EAAM,KAAK,OAAA;AAAQ,KACpB,CAAA;AAAA,EACH;AAAA,EAGA,IAAA,GAAO;AACL,IAAA,IAAI,KAAK,QAAA,EAAU;AACjB,MAAA,IAAA,CAAK,QAAA,CAAS,IAAA,CAAK,IAAA,CAAK,QAAA,EAAU,CAAA;AAClC,MAAA,IAAA,CAAK,QAAA,CAAS,SAAA,CAAU,CAAC,IAAA,KAAc;AAErC,QAAA,IAAI,IAAA,EAAM,OAAA,EAAS,IAAA,KAAS,QAAA,EAAU;AACpC,UAAA,IAAA,CAAK,QAAA,CAAS,IAAA,CAAK,IAAA,CAAK,QAAA,EAAU,CAAA;AAAA,QACpC;AAAA,MACF,CAAC,CAAA;AACD,MAAA,IAAA,CAAK,MAAA,EAAO;AAAA,IACd;AAAA,EACF;AAAA,EAEU,IAAA,CAAK,QAAa,KAAA,EAAa;AACvC,IAAA,IAAI,KAAK,QAAA,EAAU;AACjB,MAAA,IAAA,CAAK,SAAS,IAAA,CAAK,MAAA,EAAQ,KAAA,IAAS,IAAA,CAAK,UAAU,CAAA;AAAA,IACrD;AAAA,EACF;AACF,CAAA;AAlBE,eAAA,CAAA;AAAA,EADCA,uBAAA;AAAc,CAAA,EAfK,aAAA,CAgBpB,SAAA,EAAA,MAAA,EAAA,CAAA,CAAA;AAhBoB,aAAA,GAAf,eAAA,CAAA;AAAA,EADNC,oBAAA;AAAW,CAAA,EACU,aAAA,CAAA;;;ACATC,oBAAA,GAAN,2BAA2B,aAAA,CAAc;AAAA,EAG9C,OAAA,GAAkB;AAChB,IAAA,OAAO,6BAAA;AAAA,EACT;AAAA,EAEA,QAAA,GAAW;AACT,IAAA,OAAO,KAAK,aAAA,CAAc,UAAA,CAAW,EAAE,UAAA,EAAY,OAAO,CAAA;AAAA,EAC5D;AAAA,EAEA,MAAA,GAAS;AACP,IAAA,IAAA,CAAK,aAAA,CAAc,wBAAwB,CAAA,MAAA,KAAU;AACnD,MAAA,IAAA,CAAK,IAAA,CAAK,CAAA,EAAG,MAAA,CAAO,IAAI,CAAA,CAAA,EAAI,MAAA,CAAO,MAAA,CAAO,IAAI,CAAA,CAAA,EAAI,MAAA,CAAO,MAAA,CAAO,EAAE,CAAA,CAAE,CAAA;AAAA,IACtE,CAAC,CAAA;AAAA,EACH;AACF;AAfmC,eAAA,CAAA;AAAA,EAAhCC,iBAAOC,kBAAa;AAAA,CAAA,EADVF,oBAAA,CACsB,SAAA,EAAA,eAAA,EAAA,CAAA,CAAA;AADtBA,oBAAA,GAAN,eAAA,CAAA;AAAA,EADND,oBAAAA;AAAW,CAAA,EACCC,oBAAA,CAAA;ACAN,IAAM,iBAAA,GAAN,cAAgC,aAAA,CAAc;AAAA,EAA9C,WAAA,GAAA;AAAA,IAAA,KAAA,CAAA,GAAA,SAAA,CAAA;AAML;AAAA;AAAA;AAAA,IAAA,IAAA,CAAA,MAAA,GAA8B,EAAC;AAAA,EAAA;AAAA,EAE/B,OAAA,GAAkB;AAChB,IAAA,OAAO,8BAAA;AAAA,EACT;AAAA,EAEA,QAAA,GAAW;AACT,IAAA,OAAO,EAAE,QAAQ,IAAA,CAAK,MAAA,EAAQ,WAAW,IAAA,CAAK,cAAA,CAAe,oBAAoB,SAAA,EAAU;AAAA,EAC7F;AAAA,EAEA,cAAc,KAAA,EAAc;AAC1B,IAAA,OAAO;AAAA,MACL,GAAA,EAAK,KAAA,EAAO,GAAA,CAAI,MAAA,EAAO;AAAA,MACvB,MAAA,EAAQ,MAAM,MAAA,CAAO,SAAA;AAAA,MACrB,SAAA,EAAW,MAAM,SAAA,CAAU;AAAA,KAC7B;AAAA,EACF;AAAA,EAEA,MAAA,GAAS;AACP,IAAA,IAAA,CAAK,cAAA,CAAe,aAAA,CAAc,CAAC,MAAA,KAAW;AAC5C,MAAA,MAAM,EAAE,KAAA,EAAO,IAAA,EAAK,GAAI,MAAA;AAExB,MAAA,IAAI,SAAS,QAAA,EAAU;AACrB,QAAA,OAAO,IAAA,CAAK,MAAA,CAAO,MAAA,CAAO,KAAA,CAAM,EAAE,CAAC,CAAA;AAAA,MACrC,CAAA,MAAO;AACL,QAAA,IAAA,CAAK,MAAA,GAAS;AAAA,UACZ,GAAG,IAAA,CAAK,MAAA;AAAA,UACR,CAAC,KAAA,CAAM,EAAE,GAAG,IAAA,CAAK,cAAc,KAAK;AAAA,SACtC;AAAA,MACF;AAEA,MAAA,IAAA,CAAK,IAAA,CAAK,GAAG,IAAI,CAAA,CAAA,EAAI,OAAO,KAAA,CAAM,EAAE,CAAC,CAAA,CAAE,CAAA;AAAA,IACzC,CAAC,CAAA;AAAA,EACH;AACF,CAAA;AAvCoC,eAAA,CAAA;AAAA,EAAjCC,iBAAOE,2BAAc;AAAA,CAAA,EADX,iBAAA,CACuB,SAAA,EAAA,gBAAA,EAAA,CAAA,CAAA;AADvB,iBAAA,GAAN,eAAA,CAAA;AAAA,EADNJ,oBAAAA;AAAW,CAAA,EACC,iBAAA,CAAA;;;ACKN,IAAM,2BAA2BK,wBAAA,CAA+C;AAAA,EACrF,MAAA,CAAO,EAAE,IAAA,EAAK,EAAG,IAAA,EAAM;AACrB,IAAA,MAAM,EAAE,QAAO,GAAI,IAAA;AACnB,IAAA,IAAI,CAAC,MAAA,EAAQ;AACX,MAAA;AAAA,IACF;AAEA,IAAA,IAAA,CAAKJ,oBAAY,CAAA,CAAE,MAAA,EAAO,CAAE,gBAAA,EAAiB;AAE7C,IAAA,IAAA,CAAK,iBAAiB,CAAA,CAAE,MAAA,EAAO,CAAE,gBAAA,EAAiB;AAAA,EACpD,CAAA;AAAA,EACA,MAAA,CAAO,KAAK,IAAA,EAAM;AAChB,IAAA,MAAM,EAAE,MAAA,EAAQ,GAAA,GAAM,IAAA,EAAM,QAAA,GAAW,OAAM,GAAI,IAAA;AACjD,IAAA,IAAI,CAAC,MAAA,EAAQ;AACX,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,GAAA,EAAK;AACP,MAAA,GAAA,CAAI,IAAIA,oBAAY,CAAA;AAAA,IACtB;AAEA,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA,GAAA,CAAI,IAAI,iBAAiB,CAAA;AAAA,IAC3B;AAAA,EACF;AACF,CAAC","file":"index.cjs","sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, postConstruct } from 'inversify';\n\n/**\n * 参考：https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Methods.md\n */\n@injectable()\nexport abstract class BaseConnector {\n  devTools;\n\n  abstract getName(): string;\n\n  abstract getState(): any;\n\n  abstract onInit(): any;\n\n  constructor() {\n    this.devTools = (window as any).__REDUX_DEVTOOLS_EXTENSION__?.connect({\n      name: this.getName(),\n    });\n  }\n\n  @postConstruct()\n  init() {\n    if (this.devTools) {\n      this.devTools.init(this.getState());\n      this.devTools.subscribe((_msg: any) => {\n        // COMMIT 清空数据\n        if (_msg?.payload?.type === 'COMMIT') {\n          this.devTools.init(this.getState());\n        }\n      });\n      this.onInit();\n    }\n  }\n\n  protected send(action: any, state?: any) {\n    if (this.devTools) {\n      this.devTools.send(action, state || this.getState());\n    }\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { inject, injectable } from 'inversify';\nimport { EntityManager } from '@flowgram-vue/core';\n\nimport { BaseConnector } from './base';\n\n@injectable()\nexport class ECSConnector extends BaseConnector {\n  @inject(EntityManager) protected entityManager: EntityManager;\n\n  getName(): string {\n    return '@flowgram-vue/EntityManager';\n  }\n\n  getState() {\n    return this.entityManager.storeState({ configOnly: false });\n  }\n\n  onInit() {\n    this.entityManager.onEntityLifeCycleChange(action => {\n      this.send(`${action.type}/${action.entity.type}/${action.entity.id}`);\n    });\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { inject, injectable } from 'inversify';\nimport { Scope, VariableEngine } from '@flowgram-vue/variable-core';\n\nimport { BaseConnector } from './base';\n\n@injectable()\nexport class VariableConnector extends BaseConnector {\n  @inject(VariableEngine) protected variableEngine: VariableEngine;\n\n  /**\n   * 缓存变量状态\n   */\n  scopes: Record<string, any> = {};\n\n  getName(): string {\n    return '@flowgram-vue/VariableEngine';\n  }\n\n  getState() {\n    return { scopes: this.scopes, variables: this.variableEngine.globalVariableTable.variables };\n  }\n\n  getScopeState(scope: Scope) {\n    return {\n      ast: scope?.ast.toJSON(),\n      output: scope.output.variables,\n      available: scope.available.variables,\n    };\n  }\n\n  onInit() {\n    this.variableEngine.onScopeChange((action) => {\n      const { scope, type } = action;\n\n      if (type === 'delete') {\n        delete this.scopes[String(scope.id)];\n      } else {\n        this.scopes = {\n          ...this.scopes,\n          [scope.id]: this.getScopeState(scope),\n        };\n      }\n\n      this.send(`${type}/${String(scope.id)}`);\n    });\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram-vue/core';\n\nimport { ECSConnector, VariableConnector } from './connectors';\n\nexport interface ReduxDevToolPluginOptions {\n  enable?: boolean;\n  // 需要监听的内容\n  ecs?: boolean;\n  variable?: boolean;\n}\n\nexport const createReduxDevToolPlugin = definePluginCreator<ReduxDevToolPluginOptions>({\n  onBind({ bind }, opts) {\n    const { enable } = opts;\n    if (!enable) {\n      return;\n    }\n\n    bind(ECSConnector).toSelf().inSingletonScope();\n\n    bind(VariableConnector).toSelf().inSingletonScope();\n  },\n  onInit(ctx, opts) {\n    const { enable, ecs = true, variable = false } = opts;\n    if (!enable) {\n      return;\n    }\n\n    if (ecs) {\n      ctx.get(ECSConnector);\n    }\n\n    if (variable) {\n      ctx.get(VariableConnector);\n    }\n  },\n});\n"]}

package/dist/index.d.ts

@@ -0,0 +1,39 @@
+import * as _flowgram_vue_core from '@flowgram-vue/core';
+import { EntityManager } from '@flowgram-vue/core';
+
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+interface ReduxDevToolPluginOptions {
+    enable?: boolean;
+    ecs?: boolean;
+    variable?: boolean;
+}
+declare const createReduxDevToolPlugin: _flowgram_vue_core.PluginCreator<ReduxDevToolPluginOptions>;
+
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * 参考：https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Methods.md
+ */
+declare abstract class BaseConnector {
+    devTools: any;
+    abstract getName(): string;
+    abstract getState(): any;
+    abstract onInit(): any;
+    constructor();
+    init(): void;
+    protected send(action: any, state?: any): void;
+}
+
+declare class ECSConnector extends BaseConnector {
+    protected entityManager: EntityManager;
+    getName(): string;
+    getState(): _flowgram_vue_core.EntityJSON[];
+    onInit(): void;
+}
+
+export { ECSConnector, type ReduxDevToolPluginOptions, createReduxDevToolPlugin };

package/dist/index.js

@@ -0,0 +1,134 @@
+import { EntityManager, definePluginCreator } from '@flowgram-vue/core';
+import { postConstruct, injectable, inject } from 'inversify';
+import { VariableEngine } from '@flowgram-vue/variable-core';
+
+var __defProp = Object.defineProperty;
+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 = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+var BaseConnector = class {
+  constructor() {
+    this.devTools = window.__REDUX_DEVTOOLS_EXTENSION__?.connect({
+      name: this.getName()
+    });
+  }
+  init() {
+    if (this.devTools) {
+      this.devTools.init(this.getState());
+      this.devTools.subscribe((_msg) => {
+        if (_msg?.payload?.type === "COMMIT") {
+          this.devTools.init(this.getState());
+        }
+      });
+      this.onInit();
+    }
+  }
+  send(action, state) {
+    if (this.devTools) {
+      this.devTools.send(action, state || this.getState());
+    }
+  }
+};
+__decorateClass([
+  postConstruct()
+], BaseConnector.prototype, "init", 1);
+BaseConnector = __decorateClass([
+  injectable()
+], BaseConnector);
+
+// src/connectors/ecs-connector.ts
+var ECSConnector = class extends BaseConnector {
+  getName() {
+    return "@flowgram-vue/EntityManager";
+  }
+  getState() {
+    return this.entityManager.storeState({ configOnly: false });
+  }
+  onInit() {
+    this.entityManager.onEntityLifeCycleChange((action) => {
+      this.send(`${action.type}/${action.entity.type}/${action.entity.id}`);
+    });
+  }
+};
+__decorateClass([
+  inject(EntityManager)
+], ECSConnector.prototype, "entityManager", 2);
+ECSConnector = __decorateClass([
+  injectable()
+], ECSConnector);
+var VariableConnector = class extends BaseConnector {
+  constructor() {
+    super(...arguments);
+    /**
+     * 缓存变量状态
+     */
+    this.scopes = {};
+  }
+  getName() {
+    return "@flowgram-vue/VariableEngine";
+  }
+  getState() {
+    return { scopes: this.scopes, variables: this.variableEngine.globalVariableTable.variables };
+  }
+  getScopeState(scope) {
+    return {
+      ast: scope?.ast.toJSON(),
+      output: scope.output.variables,
+      available: scope.available.variables
+    };
+  }
+  onInit() {
+    this.variableEngine.onScopeChange((action) => {
+      const { scope, type } = action;
+      if (type === "delete") {
+        delete this.scopes[String(scope.id)];
+      } else {
+        this.scopes = {
+          ...this.scopes,
+          [scope.id]: this.getScopeState(scope)
+        };
+      }
+      this.send(`${type}/${String(scope.id)}`);
+    });
+  }
+};
+__decorateClass([
+  inject(VariableEngine)
+], VariableConnector.prototype, "variableEngine", 2);
+VariableConnector = __decorateClass([
+  injectable()
+], VariableConnector);
+
+// src/create-redux-devtool-plugin.ts
+var createReduxDevToolPlugin = definePluginCreator({
+  onBind({ bind }, opts) {
+    const { enable } = opts;
+    if (!enable) {
+      return;
+    }
+    bind(ECSConnector).toSelf().inSingletonScope();
+    bind(VariableConnector).toSelf().inSingletonScope();
+  },
+  onInit(ctx, opts) {
+    const { enable, ecs = true, variable = false } = opts;
+    if (!enable) {
+      return;
+    }
+    if (ecs) {
+      ctx.get(ECSConnector);
+    }
+    if (variable) {
+      ctx.get(VariableConnector);
+    }
+  }
+});
+
+export { ECSConnector, createReduxDevToolPlugin };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/connectors/base.ts","../src/connectors/ecs-connector.ts","../src/connectors/variable-connector.ts","../src/create-redux-devtool-plugin.ts"],"names":["injectable","inject"],"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 { injectable, postConstruct } from 'inversify';\n\n/**\n * 参考：https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Methods.md\n */\n@injectable()\nexport abstract class BaseConnector {\n  devTools;\n\n  abstract getName(): string;\n\n  abstract getState(): any;\n\n  abstract onInit(): any;\n\n  constructor() {\n    this.devTools = (window as any).__REDUX_DEVTOOLS_EXTENSION__?.connect({\n      name: this.getName(),\n    });\n  }\n\n  @postConstruct()\n  init() {\n    if (this.devTools) {\n      this.devTools.init(this.getState());\n      this.devTools.subscribe((_msg: any) => {\n        // COMMIT 清空数据\n        if (_msg?.payload?.type === 'COMMIT') {\n          this.devTools.init(this.getState());\n        }\n      });\n      this.onInit();\n    }\n  }\n\n  protected send(action: any, state?: any) {\n    if (this.devTools) {\n      this.devTools.send(action, state || this.getState());\n    }\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { inject, injectable } from 'inversify';\nimport { EntityManager } from '@flowgram-vue/core';\n\nimport { BaseConnector } from './base';\n\n@injectable()\nexport class ECSConnector extends BaseConnector {\n  @inject(EntityManager) protected entityManager: EntityManager;\n\n  getName(): string {\n    return '@flowgram-vue/EntityManager';\n  }\n\n  getState() {\n    return this.entityManager.storeState({ configOnly: false });\n  }\n\n  onInit() {\n    this.entityManager.onEntityLifeCycleChange(action => {\n      this.send(`${action.type}/${action.entity.type}/${action.entity.id}`);\n    });\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { inject, injectable } from 'inversify';\nimport { Scope, VariableEngine } from '@flowgram-vue/variable-core';\n\nimport { BaseConnector } from './base';\n\n@injectable()\nexport class VariableConnector extends BaseConnector {\n  @inject(VariableEngine) protected variableEngine: VariableEngine;\n\n  /**\n   * 缓存变量状态\n   */\n  scopes: Record<string, any> = {};\n\n  getName(): string {\n    return '@flowgram-vue/VariableEngine';\n  }\n\n  getState() {\n    return { scopes: this.scopes, variables: this.variableEngine.globalVariableTable.variables };\n  }\n\n  getScopeState(scope: Scope) {\n    return {\n      ast: scope?.ast.toJSON(),\n      output: scope.output.variables,\n      available: scope.available.variables,\n    };\n  }\n\n  onInit() {\n    this.variableEngine.onScopeChange((action) => {\n      const { scope, type } = action;\n\n      if (type === 'delete') {\n        delete this.scopes[String(scope.id)];\n      } else {\n        this.scopes = {\n          ...this.scopes,\n          [scope.id]: this.getScopeState(scope),\n        };\n      }\n\n      this.send(`${type}/${String(scope.id)}`);\n    });\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram-vue/core';\n\nimport { ECSConnector, VariableConnector } from './connectors';\n\nexport interface ReduxDevToolPluginOptions {\n  enable?: boolean;\n  // 需要监听的内容\n  ecs?: boolean;\n  variable?: boolean;\n}\n\nexport const createReduxDevToolPlugin = definePluginCreator<ReduxDevToolPluginOptions>({\n  onBind({ bind }, opts) {\n    const { enable } = opts;\n    if (!enable) {\n      return;\n    }\n\n    bind(ECSConnector).toSelf().inSingletonScope();\n\n    bind(VariableConnector).toSelf().inSingletonScope();\n  },\n  onInit(ctx, opts) {\n    const { enable, ecs = true, variable = false } = opts;\n    if (!enable) {\n      return;\n    }\n\n    if (ecs) {\n      ctx.get(ECSConnector);\n    }\n\n    if (variable) {\n      ctx.get(VariableConnector);\n    }\n  },\n});\n"]}

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@flowgram-vue/redux-devtool-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",
+    "reflect-metadata": "~0.2.2",
+    "@flowgram-vue/core": "0.2.0",
+    "@flowgram-vue/variable-core": "0.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@vitest/coverage-v8": "^3.2.4",
+    "eslint": "^9.0.0",
+    "typescript": "^5.8.3",
+    "vitest": "^3.2.4",
+    "@flowgram-vue/ts-config": "0.2.0",
+    "@flowgram-vue/build-config": "0.2.0",
+    "@flowgram-vue/eslint-config": "0.2.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "flowgram-build",
+    "test": "vitest run --passWithNoTests",
+    "lint": "eslint .",
+    "ts-check": "tsc --noEmit",
+    "type-check": "tsc --noEmit",
+    "build:fast": "flowgram-build --fast",
+    "build:watch": "flowgram-build --watch"
+  }
+}

package/src/connectors/base.ts

@@ -0,0 +1,46 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { injectable, postConstruct } from 'inversify';
+
+/**
+ * 参考：https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Methods.md
+ */
+@injectable()
+export abstract class BaseConnector {
+  devTools;
+
+  abstract getName(): string;
+
+  abstract getState(): any;
+
+  abstract onInit(): any;
+
+  constructor() {
+    this.devTools = (window as any).__REDUX_DEVTOOLS_EXTENSION__?.connect({
+      name: this.getName(),
+    });
+  }
+
+  @postConstruct()
+  init() {
+    if (this.devTools) {
+      this.devTools.init(this.getState());
+      this.devTools.subscribe((_msg: any) => {
+        // COMMIT 清空数据
+        if (_msg?.payload?.type === 'COMMIT') {
+          this.devTools.init(this.getState());
+        }
+      });
+      this.onInit();
+    }
+  }
+
+  protected send(action: any, state?: any) {
+    if (this.devTools) {
+      this.devTools.send(action, state || this.getState());
+    }
+  }
+}

package/src/connectors/ecs-connector.ts

@@ -0,0 +1,28 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { inject, injectable } from 'inversify';
+import { EntityManager } from '@flowgram-vue/core';
+
+import { BaseConnector } from './base';
+
+@injectable()
+export class ECSConnector extends BaseConnector {
+  @inject(EntityManager) protected entityManager: EntityManager;
+
+  getName(): string {
+    return '@flowgram-vue/EntityManager';
+  }
+
+  getState() {
+    return this.entityManager.storeState({ configOnly: false });
+  }
+
+  onInit() {
+    this.entityManager.onEntityLifeCycleChange(action => {
+      this.send(`${action.type}/${action.entity.type}/${action.entity.id}`);
+    });
+  }
+}

package/src/connectors/index.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export { ECSConnector } from './ecs-connector';
+export { VariableConnector } from './variable-connector';

package/src/connectors/variable-connector.ts

@@ -0,0 +1,52 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { inject, injectable } from 'inversify';
+import { Scope, VariableEngine } from '@flowgram-vue/variable-core';
+
+import { BaseConnector } from './base';
+
+@injectable()
+export class VariableConnector extends BaseConnector {
+  @inject(VariableEngine) protected variableEngine: VariableEngine;
+
+  /**
+   * 缓存变量状态
+   */
+  scopes: Record<string, any> = {};
+
+  getName(): string {
+    return '@flowgram-vue/VariableEngine';
+  }
+
+  getState() {
+    return { scopes: this.scopes, variables: this.variableEngine.globalVariableTable.variables };
+  }
+
+  getScopeState(scope: Scope) {
+    return {
+      ast: scope?.ast.toJSON(),
+      output: scope.output.variables,
+      available: scope.available.variables,
+    };
+  }
+
+  onInit() {
+    this.variableEngine.onScopeChange((action) => {
+      const { scope, type } = action;
+
+      if (type === 'delete') {
+        delete this.scopes[String(scope.id)];
+      } else {
+        this.scopes = {
+          ...this.scopes,
+          [scope.id]: this.getScopeState(scope),
+        };
+      }
+
+      this.send(`${type}/${String(scope.id)}`);
+    });
+  }
+}

package/src/create-redux-devtool-plugin.ts

@@ -0,0 +1,42 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { definePluginCreator } from '@flowgram-vue/core';
+
+import { ECSConnector, VariableConnector } from './connectors';
+
+export interface ReduxDevToolPluginOptions {
+  enable?: boolean;
+  // 需要监听的内容
+  ecs?: boolean;
+  variable?: boolean;
+}
+
+export const createReduxDevToolPlugin = definePluginCreator<ReduxDevToolPluginOptions>({
+  onBind({ bind }, opts) {
+    const { enable } = opts;
+    if (!enable) {
+      return;
+    }
+
+    bind(ECSConnector).toSelf().inSingletonScope();
+
+    bind(VariableConnector).toSelf().inSingletonScope();
+  },
+  onInit(ctx, opts) {
+    const { enable, ecs = true, variable = false } = opts;
+    if (!enable) {
+      return;
+    }
+
+    if (ecs) {
+      ctx.get(ECSConnector);
+    }
+
+    if (variable) {
+      ctx.get(VariableConnector);
+    }
+  },
+});

package/src/env.d.ts

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

package/src/index.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export * from './create-redux-devtool-plugin';
+export * from './connectors/ecs-connector';