@flowgram.ai/editor 0.1.0-alpha.3 → 0.1.0-alpha.30

package/dist/esm/index.js

@@ -20,7 +20,26 @@ export * from "@flowgram.ai/variable-plugin";
 export * from "@flowgram.ai/shortcuts-plugin";
 export * from "@flowgram.ai/node-core-plugin";
 export * from "@flowgram.ai/i18n-plugin";
-import { FlowNodeFormData as FlowNodeFormData2, NodeRender } from "@flowgram.ai/form-core";
+import {
+  ReactiveState,
+  ReactiveBaseState,
+  Tracker,
+  useReactiveState,
+  useReadonlyReactiveState,
+  useObserve,
+  observe
+} from "@flowgram.ai/reactive";
+import {
+  injectable as injectable4,
+  postConstruct,
+  named,
+  Container,
+  ContainerModule,
+  AsyncContainerModule,
+  inject as inject4,
+  multiInject
+} from "inversify";
+import { FlowNodeFormData, NodeRender } from "@flowgram.ai/form-core";
 import {
   Form,
   Field,
@@ -31,86 +50,32 @@ import {
   useCurrentFieldState,
   useFieldValidate,
   useWatch,
-  ValidateTrigger
+  ValidateTrigger,
+  FeedbackLevel
 } from "@flowgram.ai/form";
 export * from "@flowgram.ai/node";
 
-// src/preset/editor-props.ts
-import { FlowNodeFormData } from "@flowgram.ai/form-core";
-
-// src/constants.ts
-var EditorOptions = Symbol("EditorOptions");
-
 // src/preset/editor-props.ts
 var EditorProps;
 ((EditorProps3) => {
   EditorProps3.DEFAULT = {
-    background: {},
-    fromNodeJSON(node, json) {
-      const formData = node.getData(FlowNodeFormData);
-      if (!formData) {
-        if (json.data) {
-          node.updateExtInfo(json.data);
-        }
-      } else {
-        const defaultFormMeta = node.getService(EditorOptions).nodeEngine?.createDefaultFormMeta?.(node);
-        const formMeta = node.getNodeRegistry()?.formMeta || defaultFormMeta;
-        if (formMeta) {
-          formData.createForm(formMeta, json.data);
-        }
-      }
-    },
-    toNodeJSON(node) {
-      const nodesMap = {};
-      let startNodeJSON;
-      node.document.traverse((node2) => {
-        const isSystemNode = node2.id.startsWith("$");
-        if (isSystemNode) return;
-        const formData = node2.getData(FlowNodeFormData);
-        let formJSON = formData && formData.formModel && formData.formModel.initialized ? formData.toJSON() : void 0;
-        const nodeJSON = {
-          id: node2.id,
-          type: node2.flowNodeType,
-          data: formData ? formJSON : node2.getExtInfo(),
-          blocks: []
-        };
-        if (!startNodeJSON) startNodeJSON = nodeJSON;
-        let { parent } = node2;
-        if (parent && parent.id.startsWith("$")) {
-          parent = parent.originParent;
-        }
-        const parentJSON = parent ? nodesMap[parent.id] : void 0;
-        if (parentJSON) {
-          parentJSON.blocks?.push(nodeJSON);
-        }
-        nodesMap[node2.id] = nodeJSON;
-      }, node);
-      return startNodeJSON;
-    }
+    background: {}
   };
 })(EditorProps || (EditorProps = {}));
 
 // src/preset/editor-default-preset.ts
+import { getNodePrivateScope, getNodeScope } from "@flowgram.ai/variable-plugin";
 import { FlowRendererContainerModule, FlowRendererRegistry } from "@flowgram.ai/renderer";
 import { createReduxDevToolPlugin } from "@flowgram.ai/redux-devtool-plugin";
-import { createPlaygroundReactPreset } from "@flowgram.ai/playground-react";
 import { createNodeVariablePlugin } from "@flowgram.ai/node-variable-plugin";
 import { createNodeCorePlugin } from "@flowgram.ai/node-core-plugin";
+import { getNodeForm } from "@flowgram.ai/node";
 import { createMaterialsPlugin } from "@flowgram.ai/materials-plugin";
 import { createI18nPlugin } from "@flowgram.ai/i18n-plugin";
 import { createHistoryNodePlugin } from "@flowgram.ai/history-node-plugin";
 import { FlowDocumentContainerModule } from "@flowgram.ai/document";
 import { createPlaygroundPlugin } from "@flowgram.ai/core";
 
-// src/utils/compose.ts
-var compose = (fnList) => (node, data) => {
-  const list = fnList.filter(Boolean);
-  if (!list.length) {
-    return data;
-  }
-  return list.reduce((acc, fn) => fn(node, acc), data);
-};
-
 // src/clients/flow-editor-client-plugins.ts
 import { definePluginCreator as definePluginCreator3 } from "@flowgram.ai/core";
 
@@ -305,7 +270,6 @@ var createFlowEditorClientPlugins = () => [
 function createDefaultPreset(opts, plugins = []) {
   return (ctx) => {
     opts = { ...EditorProps.DEFAULT, ...opts };
-    ctx.container.bind(EditorOptions).toConstantValue(opts);
     if (opts.i18n) {
       plugins.push(createI18nPlugin(opts.i18n));
     }
@@ -325,7 +289,7 @@ function createDefaultPreset(opts, plugins = []) {
       if (opts.variableEngine?.enable) {
         plugins.push(createNodeVariablePlugin({}));
       }
-      if (opts.history?.enable) {
+      if (opts.history?.enable && opts.history?.enableChangeNode !== false) {
         plugins.push(createHistoryNodePlugin({}));
       }
     }
@@ -338,21 +302,39 @@ function createDefaultPreset(opts, plugins = []) {
           if (opts.constants) {
             ctx2.document.options.constants = opts.constants;
           }
-          if (opts.formatNodeLines) {
-            ctx2.document.options.formatNodeLines = compose([
-              ctx2.document.options.formatNodeLines,
-              opts.formatNodeLines
-            ]);
-          }
-          if (opts.formatNodeLabels) {
-            ctx2.document.options.formatNodeLabels = compose([
-              ctx2.document.options.formatNodeLabels,
-              opts.formatNodeLabels
-            ]);
-          }
           if (opts.getNodeDefaultRegistry) {
             ctx2.document.options.getNodeDefaultRegistry = opts.getNodeDefaultRegistry;
           }
+          ctx2.document.options.preNodeCreate = (node) => {
+            if (opts.nodeEngine && opts.nodeEngine.enable !== false) {
+              let cache;
+              Object.defineProperty(node, "form", {
+                get: () => {
+                  if (cache) return cache;
+                  cache = getNodeForm(node);
+                  return cache;
+                }
+              });
+            }
+            if (opts.variableEngine && opts.variableEngine.enable !== false) {
+              let cache;
+              let privateCache;
+              Object.defineProperty(node, "scope", {
+                get: () => {
+                  if (cache) return cache;
+                  cache = getNodeScope(node);
+                  return cache;
+                }
+              });
+              Object.defineProperty(node, "privateScope", {
+                get: () => {
+                  if (privateCache) return privateCache;
+                  privateCache = getNodePrivateScope(node);
+                  return privateCache;
+                }
+              });
+            }
+          };
           ctx2.get(FlowRendererRegistry).init();
         },
         onReady(ctx2) {
@@ -372,7 +354,7 @@ function createDefaultPreset(opts, plugins = []) {
         containerModules: defaultContainerModules
       })
     );
-    return createPlaygroundReactPreset(opts, plugins)(ctx);
+    return plugins;
   };
 }
 
@@ -420,25 +402,40 @@ function useFlowEditor() {
 
 // src/index.ts
 export * from "@flowgram.ai/node-variable-plugin";
+import { createPlaygroundReactPreset } from "@flowgram.ai/playground-react";
 export {
+  AsyncContainerModule,
+  Container,
+  ContainerModule,
   Editor,
   EditorProps,
   EditorProvider,
   PlaygroundReactRenderer as EditorRenderer,
+  FeedbackLevel,
   Field,
   FieldArray,
   FlowEditorClient,
-  FlowNodeFormData2 as FlowNodeFormData,
+  FlowNodeFormData,
   Form,
   FormModelV2 as FormModel,
   NodeClient,
   NodeFocusService,
   NodeRender,
+  ReactiveBaseState,
+  ReactiveState,
+  Tracker,
   ValidateTrigger,
   createDefaultPreset,
   createFlowEditorClientPlugin,
   createFlowEditorClientPlugins,
+  createPlaygroundReactPreset,
   highlightFormItem,
+  inject4 as inject,
+  injectable4 as injectable,
+  multiInject,
+  named,
+  observe,
+  postConstruct,
   useCurrentField,
   useCurrentFieldState,
   useField,
@@ -446,6 +443,9 @@ export {
   useFlowEditor,
   useForm,
   useHighlight,
+  useObserve,
+  useReactiveState,
+  useReadonlyReactiveState,
   useWatch
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts","../../src/preset/editor-props.ts","../../src/constants.ts","../../src/preset/editor-default-preset.ts","../../src/utils/compose.ts","../../src/clients/flow-editor-client-plugins.ts","../../src/clients/node-client/create-node-client-plugins.ts","../../src/clients/node-client/node-focus-service.ts","../../src/clients/node-client/highlight/highlight-form-item.ts","../../src/clients/node-client/highlight/highlight-style.ts","../../src/clients/node-client/highlight/constants.ts","../../src/clients/node-client/highlight/use-highlight.ts","../../src/clients/node-client/node-client.ts","../../src/clients/node-client/highlight/create-node-highlight-plugin.ts","../../src/clients/flow-editor-client.ts","../../src/components/editor-provider.tsx","../../src/components/editor-renderer.tsx","../../src/components/editor.tsx","../../src/hooks/use-flow-editor.ts"],"sourcesContent":["import 'reflect-metadata';\nimport { FormModelV2 } from '@flowgram.ai/node';\n\n/* 核心 模块导出 */\nexport * from '@flowgram.ai/utils';\nexport * from '@flowgram.ai/core';\nexport * from '@flowgram.ai/document';\nexport * from '@flowgram.ai/renderer';\nexport * from '@flowgram.ai/variable-plugin';\nexport * from '@flowgram.ai/shortcuts-plugin';\nexport * from '@flowgram.ai/node-core-plugin';\nexport * from '@flowgram.ai/i18n-plugin';\n\nexport { FlowNodeFormData, NodeRender, type NodeRenderProps } from '@flowgram.ai/form-core';\n\nexport type {\n  FormState,\n  FieldState,\n  FieldArrayRenderProps,\n  FieldRenderProps,\n  FormRenderProps,\n  Validate,\n  FormControl,\n  FieldName,\n  FieldError,\n  FieldWarning,\n  IField,\n  IFieldArray,\n  IForm,\n  Errors,\n  Warnings\n} from '@flowgram.ai/form';\n\nexport {\n  Form,\n  Field,\n  FieldArray,\n  useForm,\n  useField,\n  useCurrentField,\n  useCurrentFieldState,\n  useFieldValidate,\n  useWatch,\n  ValidateTrigger,\n} from '@flowgram.ai/form';\nexport * from '@flowgram.ai/node';\nexport { FormModelV2 as FormModel };\n\n/**\n * 固定布局模块导出\n */\nexport * from './preset';\nexport * from './components';\nexport * from './hooks';\nexport * from './clients';\n\n/**\n * Plugin 导出\n */\n\nexport * from '@flowgram.ai/node-variable-plugin';\n","import { VariablePluginOptions } from '@flowgram.ai/variable-plugin';\nimport { ReduxDevToolPluginOptions } from '@flowgram.ai/redux-devtool-plugin';\nimport { PlaygroundReactProps, SelectionService } from '@flowgram.ai/playground-react';\nimport { NodeCorePluginOptions } from '@flowgram.ai/node-core-plugin';\nimport { MaterialsPluginOptions } from '@flowgram.ai/materials-plugin';\nimport { I18nPluginOptions } from '@flowgram.ai/i18n-plugin';\nimport { HistoryPluginOptions } from '@flowgram.ai/history';\nimport { FlowNodeFormData, FormMetaOrFormMetaGenerator } from '@flowgram.ai/form-core';\nimport {\n  FlowDocument,\n  FlowDocumentJSON,\n  FlowNodeEntity,\n  type FlowNodeJSON,\n  FlowNodeRegistry,\n  FlowNodeType,\n  FlowTransitionLabel,\n  FlowTransitionLine,\n} from '@flowgram.ai/document';\nimport { PluginContext } from '@flowgram.ai/core';\n\nimport { EditorOptions } from '../constants';\n\nexport interface EditorPluginContext extends PluginContext {\n  document: FlowDocument;\n  selection: SelectionService;\n}\n\n/**\n * 固定布局配置\n */\nexport interface EditorProps<\n  CTX extends EditorPluginContext = EditorPluginContext,\n  JSON = FlowDocumentJSON\n> extends PlaygroundReactProps<CTX> {\n  /**\n   * 初始化数据\n   */\n  initialData?: JSON;\n  /**\n   * 是否为 readonly\n   */\n  readonly?: boolean;\n  /**\n   * 节点定义\n   */\n  nodeRegistries?: FlowNodeRegistry[];\n  /**\n   * 获取默认的节点配置\n   */\n  getNodeDefaultRegistry?: (type: FlowNodeType) => FlowNodeRegistry;\n  /**\n   * 节点引擎配置\n   */\n  nodeEngine?: NodeCorePluginOptions & {\n    /**\n     * 默认FormMeta\n     */\n    createDefaultFormMeta?: (node: FlowNodeEntity) => FormMetaOrFormMetaGenerator;\n    /**\n     * 开启\n     */\n    enable?: boolean;\n  };\n  /**\n   * 默认是否展开所有节点\n   */\n  allNodesDefaultExpanded?: boolean;\n  /**\n   * 画布物料\n   */\n  materials?: MaterialsPluginOptions;\n  /**\n   * 画布数据加载完成, 请使用 onAllLayersRendered 替代\n   * @deprecated\n   * */\n  onLoad?: (ctx: CTX) => void;\n  /**\n   * 是否开启变量引擎\n   */\n  variableEngine?: VariablePluginOptions;\n  /**\n   * 是否开启历史\n   */\n  history?: HistoryPluginOptions<CTX> & { disableShortcuts?: boolean };\n\n  /**\n   * redux 开发者工具配置\n   */\n  reduxDevTool?: ReduxDevToolPluginOptions;\n\n  scroll?: {\n    disableScrollLimit?: boolean; // 关闭滚动限制\n    disableScrollBar?: boolean; //  关闭滚动条\n  };\n\n  /**\n   * 节点转\n   * @param node\n   */\n  toNodeJSON?(node: FlowNodeEntity): FlowNodeJSON;\n  fromNodeJSON?(node: FlowNodeEntity, json: FlowNodeJSON): void;\n\n  /**\n   * 画布内部常量自定义\n   */\n  constants?: Record<string, any>;\n  /**\n   * 自定义节点线条\n   */\n  formatNodeLines?: (node: FlowNodeEntity, lines: FlowTransitionLine[]) => FlowTransitionLine[];\n  /**\n   * 自定义节点 label\n   */\n  formatNodeLabels?: (node: FlowNodeEntity, lines: FlowTransitionLabel[]) => FlowTransitionLabel[];\n  /**\n   * 国际化\n   */\n  i18n?: I18nPluginOptions;\n}\n\nexport namespace EditorProps {\n  /**\n   * 默认配置\n   */\n  export const DEFAULT: EditorProps = {\n    background: {},\n    fromNodeJSON(node: FlowNodeEntity, json: FlowNodeJSON) {\n      const formData = node.getData(FlowNodeFormData)!;\n      // 如果没有使用表单引擎，将 data 数据填入 extInfo\n      if (!formData) {\n        if (json.data) {\n          node.updateExtInfo(json.data);\n        }\n      } else {\n        const defaultFormMeta = node\n          .getService<EditorProps>(EditorOptions)\n          .nodeEngine?.createDefaultFormMeta?.(node);\n\n        const formMeta = node.getNodeRegistry()?.formMeta || defaultFormMeta;\n\n        if (formMeta) {\n          formData.createForm(formMeta, json.data);\n        }\n      }\n    },\n    toNodeJSON(node: FlowNodeEntity): FlowNodeJSON {\n      const nodesMap: Record<string, FlowNodeJSON> = {};\n      let startNodeJSON: FlowNodeJSON;\n      node.document.traverse((node) => {\n        const isSystemNode = node.id.startsWith('$');\n        if (isSystemNode) return;\n        const formData = node.getData(FlowNodeFormData);\n        let formJSON =\n          formData && formData.formModel && formData.formModel.initialized\n            ? formData.toJSON()\n            : undefined;\n        const nodeJSON = {\n          id: node.id,\n          type: node.flowNodeType,\n          data: formData ? formJSON : node.getExtInfo(),\n          blocks: [],\n        };\n        if (!startNodeJSON) startNodeJSON = nodeJSON;\n        let { parent } = node;\n        if (parent && parent.id.startsWith('$')) {\n          parent = parent.originParent;\n        }\n        const parentJSON = parent ? nodesMap[parent.id] : undefined;\n        if (parentJSON) {\n          parentJSON.blocks?.push(nodeJSON);\n        }\n        nodesMap[node.id] = nodeJSON;\n      }, node);\n      return startNodeJSON!;\n    },\n  };\n}\n","export const EditorOptions = Symbol('EditorOptions');\n","import { interfaces } from 'inversify';\nimport { FlowRendererContainerModule, FlowRendererRegistry } from '@flowgram.ai/renderer';\nimport { createReduxDevToolPlugin } from '@flowgram.ai/redux-devtool-plugin';\nimport { createPlaygroundReactPreset } from '@flowgram.ai/playground-react';\nimport { createNodeVariablePlugin } from '@flowgram.ai/node-variable-plugin';\nimport { createNodeCorePlugin } from '@flowgram.ai/node-core-plugin';\nimport { createMaterialsPlugin } from '@flowgram.ai/materials-plugin';\nimport { createI18nPlugin } from '@flowgram.ai/i18n-plugin';\nimport { createHistoryNodePlugin } from '@flowgram.ai/history-node-plugin';\nimport { FlowDocumentContainerModule } from '@flowgram.ai/document';\nimport { createPlaygroundPlugin, Plugin, PluginsProvider } from '@flowgram.ai/core';\n\nimport { compose } from '../utils/compose';\nimport { EditorOptions } from '../constants';\nimport { createFlowEditorClientPlugins } from '../clients/flow-editor-client-plugins';\nimport { EditorPluginContext, EditorProps } from './editor-props';\n\nexport function createDefaultPreset<CTX extends EditorPluginContext = EditorPluginContext>(\n  opts: EditorProps<CTX>,\n  plugins: Plugin[] = []\n): PluginsProvider<CTX> {\n  return (ctx: CTX) => {\n    opts = { ...EditorProps.DEFAULT, ...opts };\n    ctx.container.bind(EditorOptions).toConstantValue(opts);\n    /**\n     * i18n support\n     */\n    if (opts.i18n) {\n      plugins.push(createI18nPlugin(opts.i18n));\n    }\n    /**\n     * 默认注册顶层 flow editor client plugin\n     */\n    plugins.push(...createFlowEditorClientPlugins());\n\n    /**\n     * 注册 Redux 开发者工具\n     */\n    if (opts.reduxDevTool?.enable) {\n      plugins.push(createReduxDevToolPlugin(opts.reduxDevTool));\n    }\n\n    /**\n     * 注册画布模块\n     */\n    const defaultContainerModules: interfaces.ContainerModule[] = [\n      FlowDocumentContainerModule, // 默认文档\n      FlowRendererContainerModule, // 默认渲染\n    ];\n    /**\n     * 注册物料\n     */\n    plugins.push(createMaterialsPlugin(opts.materials || {}));\n\n    /**\n     * 注册节点引擎\n     */\n    if (opts.nodeEngine && opts.nodeEngine.enable !== false) {\n      plugins.push(createNodeCorePlugin({ materials: opts.nodeEngine.materials }));\n\n      if (opts.variableEngine?.enable) {\n        plugins.push(createNodeVariablePlugin({}));\n      }\n\n      if (opts.history?.enable) {\n        plugins.push(createHistoryNodePlugin({}));\n      }\n    }\n    /**\n     * 画布生命周期注册\n     */\n    plugins.push(\n      createPlaygroundPlugin<CTX>({\n        onInit: (ctx) => {\n          if (opts.nodeRegistries) {\n            ctx.document.registerFlowNodes(...opts.nodeRegistries);\n          }\n          // 自定义画布内部常量\n          if (opts.constants) {\n            ctx.document.options.constants = opts.constants;\n          }\n          // 劫持节点线条\n          if (opts.formatNodeLines) {\n            ctx.document.options.formatNodeLines = compose([\n              ctx.document.options.formatNodeLines,\n              opts.formatNodeLines,\n            ]);\n          }\n          // 劫持节点 label\n          if (opts.formatNodeLabels) {\n            ctx.document.options.formatNodeLabels = compose([\n              ctx.document.options.formatNodeLabels,\n              opts.formatNodeLabels,\n            ]);\n          }\n          if (opts.getNodeDefaultRegistry) {\n            ctx.document.options.getNodeDefaultRegistry = opts.getNodeDefaultRegistry;\n          }\n          // TODO\n          // if (opts.onContentChange) {\n          //   ctx.document.onContentChange(event => opts.onContentChange!(ctx, event));\n          // }\n          // TODO 这个会触发组件注册，后续要废弃这个，通过 materials 插件来做\n          ctx.get<FlowRendererRegistry>(FlowRendererRegistry).init();\n        },\n        onReady(ctx) {\n          if (opts.initialData) {\n            ctx.document.fromJSON(opts.initialData);\n          }\n          if (opts.readonly) {\n            ctx.playground.config.readonly = opts.readonly;\n          }\n          ctx.document.load().then(() => {\n            if (opts.onLoad) opts.onLoad(ctx);\n          });\n        },\n        onDispose(ctx) {\n          ctx.document.dispose();\n        },\n        containerModules: defaultContainerModules,\n      })\n    );\n\n    return createPlaygroundReactPreset<CTX>(opts, plugins)(ctx);\n  };\n}\n","import { FlowNodeEntity } from '@flowgram.ai/document';\n\nexport type ComposeListItem<T> = (node: FlowNodeEntity, data: T[]) => T[];\n\nexport const compose =\n  <T>(fnList: (ComposeListItem<T> | undefined)[]) =>\n  (node: FlowNodeEntity, data: T[]): T[] => {\n    const list = fnList.filter(Boolean) as ComposeListItem<T>[];\n    if (!list.length) {\n      return data;\n    }\n    return list.reduce((acc: T[], fn) => fn(node, acc), data);\n  };\n","import { definePluginCreator } from '@flowgram.ai/core';\n\nimport { createNodeClientPlugins } from './node-client/create-node-client-plugins';\nimport { FlowEditorClient } from './flow-editor-client';\n\nexport const createFlowEditorClientPlugin = definePluginCreator<{}>({\n  onBind({ bind }) {\n    bind(FlowEditorClient).toSelf().inSingletonScope();\n  },\n});\n\nexport const createFlowEditorClientPlugins = () => [\n  ...createNodeClientPlugins(),\n  createFlowEditorClientPlugin({}),\n];\n","import { definePluginCreator } from '@flowgram.ai/core';\n\nimport { NodeFocusService } from './node-focus-service';\nimport { NodeClient } from './node-client';\nimport { createNodeHighlightPlugin } from './highlight/create-node-highlight-plugin';\n\nexport const createNodeClientPlugin = definePluginCreator<{}>({\n  onBind({ bind }) {\n    bind(NodeFocusService).toSelf().inSingletonScope();\n    bind(NodeClient).toSelf().inSingletonScope();\n  },\n});\n\nexport const createNodeClientPlugins = () => [\n  createNodeHighlightPlugin({}),\n  createNodeClientPlugin({}),\n];\n","import { injectable, inject } from 'inversify';\nimport { type FormItem } from '@flowgram.ai/form-core';\nimport { Playground, PlaygroundConfigRevealOpts } from '@flowgram.ai/core';\n\nimport { highlightFormItem, HighLightOptions } from './highlight';\n\nexport type FocusNodeCanvasOptions = PlaygroundConfigRevealOpts;\n\nexport interface FocusNodeFormItemOptions {\n  canvas?: FocusNodeCanvasOptions;\n  highlight?: boolean | HighLightOptions;\n}\n\n@injectable()\nexport class NodeFocusService {\n  @inject(Playground) readonly playground: Playground;\n\n  protected previousOverlay: HTMLDivElement | undefined;\n\n  protected currentPromise: Promise<void> | undefined;\n\n  highlightNodeFormItem(formItem: FormItem, options?: HighLightOptions) {\n    this.previousOverlay = highlightFormItem(formItem, options);\n  }\n\n  focusNodeFormItem(formItem: FormItem, options?: FocusNodeFormItemOptions): Promise<void> {\n    const node = formItem.formModel.flowNodeEntity;\n    const { canvas = {}, highlight } = options || {};\n    if (this.previousOverlay) {\n      this.previousOverlay.remove();\n      this.previousOverlay = undefined;\n    }\n    const currentPromise = this.playground\n      .scrollToView({ entities: [node], scrollToCenter: true, ...canvas })\n      .then(() => {\n        if (!formItem || !highlight || this.currentPromise !== currentPromise) {\n          return;\n        }\n        this.highlightNodeFormItem(formItem, typeof highlight === 'boolean' ? {} : highlight);\n      });\n    this.currentPromise = currentPromise;\n    return this.currentPromise;\n  }\n}\n","import { FormItem } from '@flowgram.ai/form-core';\nimport { FlowNodeRenderData } from '@flowgram.ai/document';\n\nimport { HIGHLIGHT_CLASSNAME } from './highlight-style';\nimport { DEFAULT_HIGHLIGHT_PADDING } from './constants';\n\nexport interface HighLightOptions {\n  padding?: number;\n  overlayClassName?: string;\n}\n\nexport function highlightFormItem(\n  formItem: FormItem,\n  options?: HighLightOptions,\n): HTMLDivElement | undefined {\n  const parent =\n    formItem.formModel.flowNodeEntity.getData<FlowNodeRenderData>(FlowNodeRenderData).node;\n  const target = formItem.domRef.current;\n\n  if (!target) {\n    return undefined;\n  }\n\n  const overlay = document.createElement('div');\n\n  const { padding = DEFAULT_HIGHLIGHT_PADDING, overlayClassName } = options || {};\n\n  overlay.style.position = 'absolute';\n  overlay.style.top = '0';\n  overlay.style.left = '0';\n  overlay.style.width = '100%';\n  overlay.style.height = '100%';\n  overlay.style.zIndex = '9999';\n\n  parent.appendChild(overlay);\n\n  const parentRect = parent.getBoundingClientRect();\n  const targetRect = target.getBoundingClientRect();\n\n  overlay.style.top = targetRect.top - parentRect.top - padding + 'px';\n  overlay.style.left = targetRect.left - parentRect.left - padding + 'px';\n  overlay.style.width = targetRect.width + padding * 2 + 'px';\n  overlay.style.height = targetRect.height + padding * 2 + 'px';\n\n  overlay.className = overlayClassName || HIGHLIGHT_CLASSNAME;\n  setTimeout(() => {\n    overlay.remove();\n  }, 2000);\n  return overlay;\n}\n","export const HIGHLIGHT_CLASSNAME = 'flowide-highlight';\n\nconst styleText = `\n@keyframes flowide-fade {\n  from {\n   opacity: 1.0;\n  }\n  to {\n    opacity: 0;\n  }\n}\n@-webkit-keyframes flowide-fade {\n  from {\n   opacity: 1.0;\n  }\n  to {\n    opacity: 0;\n  }\n}\n.${HIGHLIGHT_CLASSNAME} {\n  background-color: rgba(238, 245, 40, 0.5);\n  animation: flowide-fade 2s 1 forwards;\n  -webkit-animation: flowide-fade 2s 1 forwards;\n}\n`;\n\nlet styleDom: HTMLStyleElement | undefined;\n\nexport function createHighlightStyle(): void {\n  if (styleDom) return;\n  styleDom = document.createElement('style');\n  styleDom.innerHTML = styleText;\n  document.head.appendChild(styleDom);\n}\n\nexport function removeHighlightStyle(): void {\n  styleDom?.remove();\n  styleDom = undefined;\n}\n","export const DEFAULT_HIGHLIGHT_COLOR = 'rgba(238, 245, 40, 0.5)';\nexport const DEFAULT_HIGHLIGHT_PADDING = 0;\n","import { useRef } from 'react';\n\nimport { FormModel } from '@flowgram.ai/form-core';\n\ninterface HighlightProps {\n  form: FormModel;\n  path: string;\n}\n\nexport function useHighlight(props: HighlightProps) {\n  const ref = useRef<any>(null);\n  const { form, path } = props;\n  const formItem = form.getFormItemByPath(path);\n  if (!formItem) {\n    return null;\n  }\n  formItem.domRef = ref;\n  return ref;\n}\n","import { injectable, inject } from 'inversify';\n\nimport { NodeFocusService } from './node-focus-service';\n\n@injectable()\nexport class NodeClient {\n  @inject(NodeFocusService) nodeFocusService: NodeFocusService;\n}\n","import { definePluginCreator } from '@flowgram.ai/core';\n\nimport { createHighlightStyle, removeHighlightStyle } from './highlight-style';\n\nexport const createNodeHighlightPlugin = definePluginCreator<{}>({\n  onInit() {\n    createHighlightStyle();\n  },\n  onDispose() {\n    removeHighlightStyle();\n  },\n});\n","import { injectable, inject } from 'inversify';\nimport { type FormItem } from '@flowgram.ai/form-core';\nimport { FlowNodeEntity } from '@flowgram.ai/document';\nimport { Playground, PlaygroundConfigRevealOpts } from '@flowgram.ai/core';\n\nimport { FocusNodeFormItemOptions, NodeClient } from './node-client';\n\ninterface FocusNodeOptions {\n  zoom?: PlaygroundConfigRevealOpts['zoom'];\n  easing?: PlaygroundConfigRevealOpts['easing']; // 是否开启缓动，默认开启\n  easingDuration?: PlaygroundConfigRevealOpts['easingDuration']; // 默认 500 ms\n  scrollToCenter?: PlaygroundConfigRevealOpts['scrollToCenter']; // 是否滚动到中心\n}\n\n@injectable()\nexport class FlowEditorClient {\n  @inject(NodeClient) readonly nodeClient: NodeClient;\n\n  @inject(Playground) readonly playground: Playground;\n\n  focusNodeFormItem(formItem: FormItem, options?: FocusNodeFormItemOptions) {\n    this.nodeClient.nodeFocusService.focusNodeFormItem(formItem, options);\n  }\n\n  focusNode(node: FlowNodeEntity, options?: FocusNodeOptions) {\n    this.playground.scrollToView({ entities: [node], ...options });\n  }\n}\n","import React, { useMemo, useCallback } from 'react';\n\nimport { interfaces } from 'inversify';\nimport { FlowDocument } from '@flowgram.ai/document';\nimport {\n  PlaygroundReactProvider,\n  createPluginContextDefault,\n  SelectionService,\n} from '@flowgram.ai/core';\n\nimport { EditorPluginContext, EditorProps, createDefaultPreset } from '../preset';\n\nexport const EditorProvider: React.FC<EditorProps> = (props: EditorProps) => {\n  const { children, ...others } = props;\n  const preset = useMemo(() => createDefaultPreset(others), []);\n  const customPluginContext = useCallback(\n    (container: interfaces.Container) =>\n      ({\n        ...createPluginContextDefault(container),\n        get document(): FlowDocument {\n          return container.get<FlowDocument>(FlowDocument);\n        },\n        get selection(): SelectionService {\n          return container.get<SelectionService>(SelectionService);\n        },\n      } as EditorPluginContext),\n    []\n  );\n  return (\n    <PlaygroundReactProvider plugins={preset} customPluginContext={customPluginContext}>\n      {children}\n    </PlaygroundReactProvider>\n  );\n};\n","export { PlaygroundReactRenderer as EditorRenderer } from '@flowgram.ai/core';\n","import React from 'react';\n\nimport { EditorProps } from '../preset';\nimport { EditorRenderer } from './editor-renderer';\nimport { EditorProvider } from './editor-provider';\n\n/**\n * 画布编辑器\n * @param props\n * @constructor\n */\nexport const Editor: React.FC<EditorProps> = (props: EditorProps) => {\n  const { children, ...otherProps } = props;\n  return (\n    <EditorProvider {...otherProps}>\n      <EditorRenderer>{children}</EditorRenderer>\n    </EditorProvider>\n  );\n};\n","import { useService } from '@flowgram.ai/core';\n\nimport { FlowEditorClient } from '../clients';\n\nexport function useFlowEditor(): FlowEditorClient {\n  return useService(FlowEditorClient);\n}\n"],"mappings":"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","names":["FlowNodeFormData","EditorProps","node","definePluginCreator","definePluginCreator","injectable","inject","inject","injectable","definePluginCreator","injectable","inject","Playground","inject","Playground","injectable","definePluginCreator","ctx","React","React"]}
+{"version":3,"sources":["../../src/index.ts","../../src/preset/editor-props.ts","../../src/preset/editor-default-preset.ts","../../src/clients/flow-editor-client-plugins.ts","../../src/clients/node-client/create-node-client-plugins.ts","../../src/clients/node-client/node-focus-service.ts","../../src/clients/node-client/highlight/highlight-form-item.ts","../../src/clients/node-client/highlight/highlight-style.ts","../../src/clients/node-client/highlight/constants.ts","../../src/clients/node-client/highlight/use-highlight.ts","../../src/clients/node-client/node-client.ts","../../src/clients/node-client/highlight/create-node-highlight-plugin.ts","../../src/clients/flow-editor-client.ts","../../src/components/editor-provider.tsx","../../src/components/editor-renderer.tsx","../../src/components/editor.tsx","../../src/hooks/use-flow-editor.ts"],"sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport 'reflect-metadata';\nimport { FormModelV2 } from '@flowgram.ai/node';\n\n/* 核心 模块导出 */\nexport * from '@flowgram.ai/utils';\nexport * from '@flowgram.ai/core';\nexport * from '@flowgram.ai/document';\nexport * from '@flowgram.ai/renderer';\nexport * from '@flowgram.ai/variable-plugin';\nexport * from '@flowgram.ai/shortcuts-plugin';\nexport * from '@flowgram.ai/node-core-plugin';\nexport * from '@flowgram.ai/i18n-plugin';\nexport {\n  ReactiveState,\n  ReactiveBaseState,\n  Tracker,\n  useReactiveState,\n  useReadonlyReactiveState,\n  useObserve,\n  observe,\n} from '@flowgram.ai/reactive';\nexport {\n  type interfaces,\n  injectable,\n  postConstruct,\n  named,\n  Container,\n  ContainerModule,\n  AsyncContainerModule,\n  inject,\n  multiInject,\n} from 'inversify';\n\nexport { FlowNodeFormData, NodeRender, type NodeRenderProps } from '@flowgram.ai/form-core';\n\nexport type {\n  FormState,\n  FieldState,\n  FieldArrayRenderProps,\n  FieldRenderProps,\n  FormRenderProps,\n  Validate,\n  FormControl,\n  FieldName,\n  FieldError,\n  FieldWarning,\n  IField,\n  IFieldArray,\n  IForm,\n  Errors,\n  Warnings,\n} from '@flowgram.ai/form';\n\nexport {\n  Form,\n  Field,\n  FieldArray,\n  useForm,\n  useField,\n  useCurrentField,\n  useCurrentFieldState,\n  useFieldValidate,\n  useWatch,\n  ValidateTrigger,\n  FeedbackLevel,\n} from '@flowgram.ai/form';\nexport * from '@flowgram.ai/node';\nexport { FormModelV2 as FormModel };\n\n/**\n * 固定布局模块导出\n */\nexport * from './preset';\nexport * from './components';\nexport * from './hooks';\nexport * from './clients';\n\n/**\n * Plugin 导出\n */\n\nexport * from '@flowgram.ai/node-variable-plugin';\n\nexport { createPlaygroundReactPreset } from '@flowgram.ai/playground-react';\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FlowNodeScope, VariablePluginOptions } from '@flowgram.ai/variable-plugin';\nimport { ReduxDevToolPluginOptions } from '@flowgram.ai/redux-devtool-plugin';\nimport { PlaygroundReactProps, SelectionService } from '@flowgram.ai/playground-react';\nimport { NodeCorePluginOptions } from '@flowgram.ai/node-core-plugin';\nimport { type NodeFormProps } from '@flowgram.ai/node';\nimport { MaterialsPluginOptions } from '@flowgram.ai/materials-plugin';\nimport { I18nPluginOptions } from '@flowgram.ai/i18n-plugin';\nimport { HistoryPluginOptions } from '@flowgram.ai/history';\nimport { FormMetaOrFormMetaGenerator } from '@flowgram.ai/form-core';\nimport {\n  FlowDocument,\n  FlowDocumentJSON,\n  FlowNodeEntity,\n  type FlowNodeJSON,\n  FlowNodeRegistry,\n  FlowNodeType,\n} from '@flowgram.ai/document';\nimport { PluginContext } from '@flowgram.ai/core';\n\ndeclare module '@flowgram.ai/document' {\n  interface FlowNodeEntity {\n    form: NodeFormProps<any> | undefined;\n    scope: FlowNodeScope | undefined;\n    privateScope: FlowNodeScope | undefined;\n  }\n}\n\nexport interface EditorPluginContext extends PluginContext {\n  document: FlowDocument;\n  selection: SelectionService;\n}\n\nexport interface EditorProps<\n  CTX extends EditorPluginContext = EditorPluginContext,\n  JSON = FlowDocumentJSON\n> extends PlaygroundReactProps<CTX> {\n  /**\n   * Initialize data\n   * 初始化数据\n   */\n  initialData?: JSON;\n  /**\n   * whether it is readonly\n   * 是否为 readonly\n   */\n  readonly?: boolean;\n  /**\n   * node registries\n   * 节点定义\n   */\n  nodeRegistries?: FlowNodeRegistry[];\n  /**\n   * Get the default node registry, which will be merged with the 'nodeRegistries'\n   * 提供默认的节点注册，这个会和 nodeRegistries 做合并\n   */\n  getNodeDefaultRegistry?: (type: FlowNodeType) => FlowNodeRegistry;\n  /**\n   * Node engine configuration\n   */\n  nodeEngine?: NodeCorePluginOptions & {\n    /**\n     * Default formMeta\n     */\n    createDefaultFormMeta?: (node: FlowNodeEntity) => FormMetaOrFormMetaGenerator;\n    /**\n     * Enable node engine\n     */\n    enable?: boolean;\n  };\n  /**\n   * By default, all nodes are expanded\n   * 默认是否展开所有节点\n   */\n  allNodesDefaultExpanded?: boolean;\n  /**\n   * Canvas material, Used to customize react components\n   * 画布物料, 用于自定义 react 组件\n   */\n  materials?: MaterialsPluginOptions;\n  /**\n   * 画布数据加载完成, 请使用 onAllLayersRendered 替代\n   * @deprecated\n   * */\n  onLoad?: (ctx: CTX) => void;\n  /**\n   * 是否开启变量引擎\n   * Variable engine enable\n   */\n  variableEngine?: VariablePluginOptions;\n  /**\n   * Redo/Undo enable\n   */\n  history?: HistoryPluginOptions<CTX> & { disableShortcuts?: boolean };\n\n  /**\n   * redux devtool configuration\n   */\n  reduxDevTool?: ReduxDevToolPluginOptions;\n\n  /**\n   * Scroll configuration\n   * 滚动配置\n   */\n  scroll?: {\n    enableScrollLimit?: boolean; // 开启滚动限制\n    disableScrollBar?: boolean; //  关闭滚动条\n    disableScroll?: boolean; // 禁止滚动\n  };\n\n  /**\n   * Node data transformation, called by ctx.document.fromJSON\n   * 节点数据转换, 由 ctx.document.fromJSON 调用\n   * @param node - current node\n   * @param json - Current node json data\n   */\n  toNodeJSON?(node: FlowNodeEntity, json: FlowNodeJSON): FlowNodeJSON;\n  /**\n   * Node data transformation, called by ctx.document.toJSON\n   * 节点数据转换, 由 ctx.document.toJSON 调用\n   * @param node - current node\n   * @param json - Current node json data\n   * @param isFirstCreate - Whether it is created for the first time, If document.fromJSON is recalled, but the node already exists, isFirstCreate is false\n   */\n  fromNodeJSON?(node: FlowNodeEntity, json: FlowNodeJSON, isFirstCreate: boolean): FlowNodeJSON;\n  /**\n   * Canvas internal constant customization\n   * 画布内部常量自定义\n   */\n  constants?: Record<string, any>;\n  /**\n   * i18n\n   * 国际化\n   */\n  i18n?: I18nPluginOptions;\n}\n\nexport namespace EditorProps {\n  /**\n   * 默认配置\n   */\n  export const DEFAULT: EditorProps = {\n    background: {},\n  };\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { interfaces } from 'inversify';\nimport { FlowNodeScope, getNodePrivateScope, getNodeScope } from '@flowgram.ai/variable-plugin';\nimport { FlowRendererContainerModule, FlowRendererRegistry } from '@flowgram.ai/renderer';\nimport { createReduxDevToolPlugin } from '@flowgram.ai/redux-devtool-plugin';\nimport { createNodeVariablePlugin } from '@flowgram.ai/node-variable-plugin';\nimport { createNodeCorePlugin } from '@flowgram.ai/node-core-plugin';\nimport { getNodeForm, NodeFormProps } from '@flowgram.ai/node';\nimport { createMaterialsPlugin } from '@flowgram.ai/materials-plugin';\nimport { createI18nPlugin } from '@flowgram.ai/i18n-plugin';\nimport { createHistoryNodePlugin } from '@flowgram.ai/history-node-plugin';\nimport { FlowDocumentContainerModule } from '@flowgram.ai/document';\nimport { createPlaygroundPlugin, Plugin, PluginsProvider } from '@flowgram.ai/core';\n\nimport { createFlowEditorClientPlugins } from '../clients/flow-editor-client-plugins';\nimport { EditorPluginContext, EditorProps } from './editor-props';\n\nexport function createDefaultPreset<CTX extends EditorPluginContext = EditorPluginContext>(\n  opts: EditorProps<CTX>,\n  plugins: Plugin[] = []\n): PluginsProvider<CTX> {\n  return (ctx: CTX) => {\n    opts = { ...EditorProps.DEFAULT, ...opts };\n    /**\n     * i18n support\n     */\n    if (opts.i18n) {\n      plugins.push(createI18nPlugin(opts.i18n));\n    }\n    /**\n     * 默认注册顶层 flow editor client plugin\n     */\n    plugins.push(...createFlowEditorClientPlugins());\n\n    /**\n     * 注册 Redux 开发者工具\n     */\n    if (opts.reduxDevTool?.enable) {\n      plugins.push(createReduxDevToolPlugin(opts.reduxDevTool));\n    }\n\n    /**\n     * 注册画布模块\n     */\n    const defaultContainerModules: interfaces.ContainerModule[] = [\n      FlowDocumentContainerModule, // 默认文档\n      FlowRendererContainerModule, // 默认渲染\n    ];\n    /**\n     * 注册物料\n     */\n    plugins.push(createMaterialsPlugin(opts.materials || {}));\n\n    /**\n     * 注册节点引擎\n     */\n    if (opts.nodeEngine && opts.nodeEngine.enable !== false) {\n      plugins.push(createNodeCorePlugin({ materials: opts.nodeEngine.materials }));\n\n      if (opts.variableEngine?.enable) {\n        plugins.push(createNodeVariablePlugin({}));\n      }\n\n      if (opts.history?.enable && opts.history?.enableChangeNode !== false) {\n        plugins.push(createHistoryNodePlugin({}));\n      }\n    }\n    /**\n     * 画布生命周期注册\n     */\n    plugins.push(\n      createPlaygroundPlugin<CTX>({\n        onInit: (ctx) => {\n          if (opts.nodeRegistries) {\n            ctx.document.registerFlowNodes(...opts.nodeRegistries);\n          }\n          // 自定义画布内部常量\n          if (opts.constants) {\n            ctx.document.options.constants = opts.constants;\n          }\n          if (opts.getNodeDefaultRegistry) {\n            ctx.document.options.getNodeDefaultRegistry = opts.getNodeDefaultRegistry;\n          }\n          ctx.document.options.preNodeCreate = (node) => {\n            /**\n             * Define node.form\n             */\n            if (opts.nodeEngine && opts.nodeEngine.enable !== false) {\n              let cache: NodeFormProps<any> | undefined;\n              Object.defineProperty(node, 'form', {\n                get: () => {\n                  if (cache) return cache;\n                  cache = getNodeForm(node);\n                  return cache;\n                },\n              });\n            }\n\n            /**\n             * Define node.scope & node.privateScope\n             */\n            if (opts.variableEngine && opts.variableEngine.enable !== false) {\n              let cache: FlowNodeScope | undefined;\n              let privateCache: FlowNodeScope | undefined;\n\n              Object.defineProperty(node, 'scope', {\n                get: () => {\n                  if (cache) return cache;\n                  cache = getNodeScope(node);\n                  return cache;\n                },\n              });\n              Object.defineProperty(node, 'privateScope', {\n                get: () => {\n                  if (privateCache) return privateCache;\n                  privateCache = getNodePrivateScope(node);\n                  return privateCache;\n                },\n              });\n            }\n          };\n          ctx.get<FlowRendererRegistry>(FlowRendererRegistry).init();\n        },\n        onReady(ctx) {\n          if (opts.initialData) {\n            ctx.document.fromJSON(opts.initialData);\n          }\n          if (opts.readonly) {\n            ctx.playground.config.readonly = opts.readonly;\n          }\n          ctx.document.load().then(() => {\n            if (opts.onLoad) opts.onLoad(ctx);\n          });\n        },\n        onDispose(ctx) {\n          ctx.document.dispose();\n        },\n        containerModules: defaultContainerModules,\n      })\n    );\n\n    return plugins;\n  };\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport { createNodeClientPlugins } from './node-client/create-node-client-plugins';\nimport { FlowEditorClient } from './flow-editor-client';\n\nexport const createFlowEditorClientPlugin = definePluginCreator<{}>({\n  onBind({ bind }) {\n    bind(FlowEditorClient).toSelf().inSingletonScope();\n  },\n});\n\nexport const createFlowEditorClientPlugins = () => [\n  ...createNodeClientPlugins(),\n  createFlowEditorClientPlugin({}),\n];\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport { NodeFocusService } from './node-focus-service';\nimport { NodeClient } from './node-client';\nimport { createNodeHighlightPlugin } from './highlight/create-node-highlight-plugin';\n\nexport const createNodeClientPlugin = definePluginCreator<{}>({\n  onBind({ bind }) {\n    bind(NodeFocusService).toSelf().inSingletonScope();\n    bind(NodeClient).toSelf().inSingletonScope();\n  },\n});\n\nexport const createNodeClientPlugins = () => [\n  createNodeHighlightPlugin({}),\n  createNodeClientPlugin({}),\n];\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, inject } from 'inversify';\nimport { type FormItem } from '@flowgram.ai/form-core';\nimport { Playground, PlaygroundConfigRevealOpts } from '@flowgram.ai/core';\n\nimport { highlightFormItem, HighLightOptions } from './highlight';\n\nexport type FocusNodeCanvasOptions = PlaygroundConfigRevealOpts;\n\nexport interface FocusNodeFormItemOptions {\n  canvas?: FocusNodeCanvasOptions;\n  highlight?: boolean | HighLightOptions;\n}\n\n@injectable()\nexport class NodeFocusService {\n  @inject(Playground) readonly playground: Playground;\n\n  protected previousOverlay: HTMLDivElement | undefined;\n\n  protected currentPromise: Promise<void> | undefined;\n\n  highlightNodeFormItem(formItem: FormItem, options?: HighLightOptions) {\n    this.previousOverlay = highlightFormItem(formItem, options);\n  }\n\n  focusNodeFormItem(formItem: FormItem, options?: FocusNodeFormItemOptions): Promise<void> {\n    const node = formItem.formModel.flowNodeEntity;\n    const { canvas = {}, highlight } = options || {};\n    if (this.previousOverlay) {\n      this.previousOverlay.remove();\n      this.previousOverlay = undefined;\n    }\n    const currentPromise = this.playground\n      .scrollToView({ entities: [node], scrollToCenter: true, ...canvas })\n      .then(() => {\n        if (!formItem || !highlight || this.currentPromise !== currentPromise) {\n          return;\n        }\n        this.highlightNodeFormItem(formItem, typeof highlight === 'boolean' ? {} : highlight);\n      });\n    this.currentPromise = currentPromise;\n    return this.currentPromise;\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { FormItem } from '@flowgram.ai/form-core';\nimport { FlowNodeRenderData } from '@flowgram.ai/document';\n\nimport { HIGHLIGHT_CLASSNAME } from './highlight-style';\nimport { DEFAULT_HIGHLIGHT_PADDING } from './constants';\n\nexport interface HighLightOptions {\n  padding?: number;\n  overlayClassName?: string;\n}\n\nexport function highlightFormItem(\n  formItem: FormItem,\n  options?: HighLightOptions,\n): HTMLDivElement | undefined {\n  const parent =\n    formItem.formModel.flowNodeEntity.getData<FlowNodeRenderData>(FlowNodeRenderData).node;\n  const target = formItem.domRef.current;\n\n  if (!target) {\n    return undefined;\n  }\n\n  const overlay = document.createElement('div');\n\n  const { padding = DEFAULT_HIGHLIGHT_PADDING, overlayClassName } = options || {};\n\n  overlay.style.position = 'absolute';\n  overlay.style.top = '0';\n  overlay.style.left = '0';\n  overlay.style.width = '100%';\n  overlay.style.height = '100%';\n  overlay.style.zIndex = '9999';\n\n  parent.appendChild(overlay);\n\n  const parentRect = parent.getBoundingClientRect();\n  const targetRect = target.getBoundingClientRect();\n\n  overlay.style.top = targetRect.top - parentRect.top - padding + 'px';\n  overlay.style.left = targetRect.left - parentRect.left - padding + 'px';\n  overlay.style.width = targetRect.width + padding * 2 + 'px';\n  overlay.style.height = targetRect.height + padding * 2 + 'px';\n\n  overlay.className = overlayClassName || HIGHLIGHT_CLASSNAME;\n  setTimeout(() => {\n    overlay.remove();\n  }, 2000);\n  return overlay;\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const HIGHLIGHT_CLASSNAME = 'flowide-highlight';\n\nconst styleText = `\n@keyframes flowide-fade {\n  from {\n   opacity: 1.0;\n  }\n  to {\n    opacity: 0;\n  }\n}\n@-webkit-keyframes flowide-fade {\n  from {\n   opacity: 1.0;\n  }\n  to {\n    opacity: 0;\n  }\n}\n.${HIGHLIGHT_CLASSNAME} {\n  background-color: rgba(238, 245, 40, 0.5);\n  animation: flowide-fade 2s 1 forwards;\n  -webkit-animation: flowide-fade 2s 1 forwards;\n}\n`;\n\nlet styleDom: HTMLStyleElement | undefined;\n\nexport function createHighlightStyle(): void {\n  if (styleDom) return;\n  styleDom = document.createElement('style');\n  styleDom.innerHTML = styleText;\n  document.head.appendChild(styleDom);\n}\n\nexport function removeHighlightStyle(): void {\n  styleDom?.remove();\n  styleDom = undefined;\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const DEFAULT_HIGHLIGHT_COLOR = 'rgba(238, 245, 40, 0.5)';\nexport const DEFAULT_HIGHLIGHT_PADDING = 0;\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useRef } from 'react';\n\nimport { FormModel } from '@flowgram.ai/form-core';\n\ninterface HighlightProps {\n  form: FormModel;\n  path: string;\n}\n\nexport function useHighlight(props: HighlightProps) {\n  const ref = useRef<any>(null);\n  const { form, path } = props;\n  const formItem = form.getFormItemByPath(path);\n  if (!formItem) {\n    return null;\n  }\n  formItem.domRef = ref;\n  return ref;\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, inject } from 'inversify';\n\nimport { NodeFocusService } from './node-focus-service';\n\n@injectable()\nexport class NodeClient {\n  @inject(NodeFocusService) nodeFocusService: NodeFocusService;\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport { createHighlightStyle, removeHighlightStyle } from './highlight-style';\n\nexport const createNodeHighlightPlugin = definePluginCreator<{}>({\n  onInit() {\n    createHighlightStyle();\n  },\n  onDispose() {\n    removeHighlightStyle();\n  },\n});\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, inject } from 'inversify';\nimport { type FormItem } from '@flowgram.ai/form-core';\nimport { FlowNodeEntity } from '@flowgram.ai/document';\nimport { Playground, PlaygroundConfigRevealOpts } from '@flowgram.ai/core';\n\nimport { FocusNodeFormItemOptions, NodeClient } from './node-client';\n\ninterface FocusNodeOptions {\n  zoom?: PlaygroundConfigRevealOpts['zoom'];\n  easing?: PlaygroundConfigRevealOpts['easing']; // 是否开启缓动，默认开启\n  easingDuration?: PlaygroundConfigRevealOpts['easingDuration']; // 默认 500 ms\n  scrollToCenter?: PlaygroundConfigRevealOpts['scrollToCenter']; // 是否滚动到中心\n}\n\n@injectable()\nexport class FlowEditorClient {\n  @inject(NodeClient) readonly nodeClient: NodeClient;\n\n  @inject(Playground) readonly playground: Playground;\n\n  focusNodeFormItem(formItem: FormItem, options?: FocusNodeFormItemOptions) {\n    this.nodeClient.nodeFocusService.focusNodeFormItem(formItem, options);\n  }\n\n  focusNode(node: FlowNodeEntity, options?: FocusNodeOptions) {\n    this.playground.scrollToView({ entities: [node], ...options });\n  }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport React, { useMemo, useCallback } from 'react';\n\nimport { interfaces } from 'inversify';\nimport { FlowDocument } from '@flowgram.ai/document';\nimport {\n  PlaygroundReactProvider,\n  createPluginContextDefault,\n  SelectionService,\n} from '@flowgram.ai/core';\n\nimport { EditorPluginContext, EditorProps, createDefaultPreset } from '../preset';\n\nexport const EditorProvider: React.FC<EditorProps> = (props: EditorProps) => {\n  const { children, ...others } = props;\n  const preset = useMemo(() => createDefaultPreset(others), []);\n  const customPluginContext = useCallback(\n    (container: interfaces.Container) =>\n      ({\n        ...createPluginContextDefault(container),\n        get document(): FlowDocument {\n          return container.get<FlowDocument>(FlowDocument);\n        },\n        get selection(): SelectionService {\n          return container.get<SelectionService>(SelectionService);\n        },\n      } as EditorPluginContext),\n    []\n  );\n  return (\n    <PlaygroundReactProvider plugins={preset} customPluginContext={customPluginContext}>\n      {children}\n    </PlaygroundReactProvider>\n  );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport { PlaygroundReactRenderer as EditorRenderer } from '@flowgram.ai/core';\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport React from 'react';\n\nimport { EditorProps } from '../preset';\nimport { EditorRenderer } from './editor-renderer';\nimport { EditorProvider } from './editor-provider';\n\n/**\n * 画布编辑器\n * @param props\n * @constructor\n */\nexport const Editor: React.FC<EditorProps> = (props: EditorProps) => {\n  const { children, ...otherProps } = props;\n  return (\n    <EditorProvider {...otherProps}>\n      <EditorRenderer>{children}</EditorRenderer>\n    </EditorProvider>\n  );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useService } from '@flowgram.ai/core';\n\nimport { FlowEditorClient } from '../clients';\n\nexport function useFlowEditor(): FlowEditorClient {\n  return useService(FlowEditorClient);\n}\n"],"mappings":";;;;;;;;;;;;AAKA,OAAO;AACP,SAAS,mBAAmB;AAG5B,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EAEE,cAAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAAC;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB,kBAAwC;AAoBnE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,cAAc;;;ACsEP,IAAU;AAAA,CAAV,CAAUC,iBAAV;AAIE,EAAMA,aAAA,UAAuB;AAAA,IAClC,YAAY,CAAC;AAAA,EACf;AAAA,GANe;;;ACvIjB,SAAwB,qBAAqB,oBAAoB;AACjE,SAAS,6BAA6B,4BAA4B;AAClE,SAAS,gCAAgC;AACzC,SAAS,gCAAgC;AACzC,SAAS,4BAA4B;AACrC,SAAS,mBAAkC;AAC3C,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AACjC,SAAS,+BAA+B;AACxC,SAAS,mCAAmC;AAC5C,SAAS,8BAAuD;;;ACXhE,SAAS,uBAAAC,4BAA2B;;;ACApC,SAAS,uBAAAC,4BAA2B;;;ACApC,SAAS,YAAY,cAAc;AAEnC,SAAS,kBAA8C;;;ACDvD,SAAS,0BAA0B;;;ACD5B,IAAM,sBAAsB;AAEnC,IAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAiBf,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAOtB,IAAI;AAEG,SAAS,uBAA6B;AAC3C,MAAI,SAAU;AACd,aAAW,SAAS,cAAc,OAAO;AACzC,WAAS,YAAY;AACrB,WAAS,KAAK,YAAY,QAAQ;AACpC;AAEO,SAAS,uBAA6B;AAC3C,YAAU,OAAO;AACjB,aAAW;AACb;;;ACrCO,IAAM,4BAA4B;;;AFUlC,SAAS,kBACd,UACA,SAC4B;AAC5B,QAAM,SACJ,SAAS,UAAU,eAAe,QAA4B,kBAAkB,EAAE;AACpF,QAAM,SAAS,SAAS,OAAO;AAE/B,MAAI,CAAC,QAAQ;AACX,WAAO;AAAA,EACT;AAEA,QAAM,UAAU,SAAS,cAAc,KAAK;AAE5C,QAAM,EAAE,UAAU,2BAA2B,iBAAiB,IAAI,WAAW,CAAC;AAE9E,UAAQ,MAAM,WAAW;AACzB,UAAQ,MAAM,MAAM;AACpB,UAAQ,MAAM,OAAO;AACrB,UAAQ,MAAM,QAAQ;AACtB,UAAQ,MAAM,SAAS;AACvB,UAAQ,MAAM,SAAS;AAEvB,SAAO,YAAY,OAAO;AAE1B,QAAM,aAAa,OAAO,sBAAsB;AAChD,QAAM,aAAa,OAAO,sBAAsB;AAEhD,UAAQ,MAAM,MAAM,WAAW,MAAM,WAAW,MAAM,UAAU;AAChE,UAAQ,MAAM,OAAO,WAAW,OAAO,WAAW,OAAO,UAAU;AACnE,UAAQ,MAAM,QAAQ,WAAW,QAAQ,UAAU,IAAI;AACvD,UAAQ,MAAM,SAAS,WAAW,SAAS,UAAU,IAAI;AAEzD,UAAQ,YAAY,oBAAoB;AACxC,aAAW,MAAM;AACf,YAAQ,OAAO;AAAA,EACjB,GAAG,GAAI;AACP,SAAO;AACT;;;AGjDA,SAAS,cAAc;AAShB,SAAS,aAAa,OAAuB;AAClD,QAAM,MAAM,OAAY,IAAI;AAC5B,QAAM,EAAE,MAAM,KAAK,IAAI;AACvB,QAAM,WAAW,KAAK,kBAAkB,IAAI;AAC5C,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AACA,WAAS,SAAS;AAClB,SAAO;AACT;;;AJJO,IAAM,mBAAN,MAAuB;AAAA,EAO5B,sBAAsB,UAAoB,SAA4B;AACpE,SAAK,kBAAkB,kBAAkB,UAAU,OAAO;AAAA,EAC5D;AAAA,EAEA,kBAAkB,UAAoB,SAAmD;AACvF,UAAM,OAAO,SAAS,UAAU;AAChC,UAAM,EAAE,SAAS,CAAC,GAAG,UAAU,IAAI,WAAW,CAAC;AAC/C,QAAI,KAAK,iBAAiB;AACxB,WAAK,gBAAgB,OAAO;AAC5B,WAAK,kBAAkB;AAAA,IACzB;AACA,UAAM,iBAAiB,KAAK,WACzB,aAAa,EAAE,UAAU,CAAC,IAAI,GAAG,gBAAgB,MAAM,GAAG,OAAO,CAAC,EAClE,KAAK,MAAM;AACV,UAAI,CAAC,YAAY,CAAC,aAAa,KAAK,mBAAmB,gBAAgB;AACrE;AAAA,MACF;AACA,WAAK,sBAAsB,UAAU,OAAO,cAAc,YAAY,CAAC,IAAI,SAAS;AAAA,IACtF,CAAC;AACH,SAAK,iBAAiB;AACtB,WAAO,KAAK;AAAA,EACd;AACF;AA5B+B;AAAA,EAA5B,OAAO,UAAU;AAAA,GADP,iBACkB;AADlB,mBAAN;AAAA,EADN,WAAW;AAAA,GACC;;;AKdb,SAAS,cAAAC,aAAY,UAAAC,eAAc;AAK5B,IAAM,aAAN,MAAiB;AAExB;AAD4B;AAAA,EAAzBC,QAAO,gBAAgB;AAAA,GADb,WACe;AADf,aAAN;AAAA,EADNC,YAAW;AAAA,GACC;;;ACLb,SAAS,2BAA2B;AAI7B,IAAM,4BAA4B,oBAAwB;AAAA,EAC/D,SAAS;AACP,yBAAqB;AAAA,EACvB;AAAA,EACA,YAAY;AACV,yBAAqB;AAAA,EACvB;AACF,CAAC;;;APLM,IAAM,yBAAyBC,qBAAwB;AAAA,EAC5D,OAAO,EAAE,KAAK,GAAG;AACf,SAAK,gBAAgB,EAAE,OAAO,EAAE,iBAAiB;AACjD,SAAK,UAAU,EAAE,OAAO,EAAE,iBAAiB;AAAA,EAC7C;AACF,CAAC;AAEM,IAAM,0BAA0B,MAAM;AAAA,EAC3C,0BAA0B,CAAC,CAAC;AAAA,EAC5B,uBAAuB,CAAC,CAAC;AAC3B;;;AQhBA,SAAS,cAAAC,aAAY,UAAAC,eAAc;AAGnC,SAAS,cAAAC,mBAA8C;AAYhD,IAAM,mBAAN,MAAuB;AAAA,EAK5B,kBAAkB,UAAoB,SAAoC;AACxE,SAAK,WAAW,iBAAiB,kBAAkB,UAAU,OAAO;AAAA,EACtE;AAAA,EAEA,UAAU,MAAsB,SAA4B;AAC1D,SAAK,WAAW,aAAa,EAAE,UAAU,CAAC,IAAI,GAAG,GAAG,QAAQ,CAAC;AAAA,EAC/D;AACF;AAX+B;AAAA,EAA5BC,QAAO,UAAU;AAAA,GADP,iBACkB;AAEA;AAAA,EAA5BA,QAAOC,WAAU;AAAA,GAHP,iBAGkB;AAHlB,mBAAN;AAAA,EADNC,YAAW;AAAA,GACC;;;ATVN,IAAM,+BAA+BC,qBAAwB;AAAA,EAClE,OAAO,EAAE,KAAK,GAAG;AACf,SAAK,gBAAgB,EAAE,OAAO,EAAE,iBAAiB;AAAA,EACnD;AACF,CAAC;AAEM,IAAM,gCAAgC,MAAM;AAAA,EACjD,GAAG,wBAAwB;AAAA,EAC3B,6BAA6B,CAAC,CAAC;AACjC;;;ADEO,SAAS,oBACd,MACA,UAAoB,CAAC,GACC;AACtB,SAAO,CAAC,QAAa;AACnB,WAAO,EAAE,GAAG,YAAY,SAAS,GAAG,KAAK;AAIzC,QAAI,KAAK,MAAM;AACb,cAAQ,KAAK,iBAAiB,KAAK,IAAI,CAAC;AAAA,IAC1C;AAIA,YAAQ,KAAK,GAAG,8BAA8B,CAAC;AAK/C,QAAI,KAAK,cAAc,QAAQ;AAC7B,cAAQ,KAAK,yBAAyB,KAAK,YAAY,CAAC;AAAA,IAC1D;AAKA,UAAM,0BAAwD;AAAA,MAC5D;AAAA;AAAA,MACA;AAAA;AAAA,IACF;AAIA,YAAQ,KAAK,sBAAsB,KAAK,aAAa,CAAC,CAAC,CAAC;AAKxD,QAAI,KAAK,cAAc,KAAK,WAAW,WAAW,OAAO;AACvD,cAAQ,KAAK,qBAAqB,EAAE,WAAW,KAAK,WAAW,UAAU,CAAC,CAAC;AAE3E,UAAI,KAAK,gBAAgB,QAAQ;AAC/B,gBAAQ,KAAK,yBAAyB,CAAC,CAAC,CAAC;AAAA,MAC3C;AAEA,UAAI,KAAK,SAAS,UAAU,KAAK,SAAS,qBAAqB,OAAO;AACpE,gBAAQ,KAAK,wBAAwB,CAAC,CAAC,CAAC;AAAA,MAC1C;AAAA,IACF;AAIA,YAAQ;AAAA,MACN,uBAA4B;AAAA,QAC1B,QAAQ,CAACC,SAAQ;AACf,cAAI,KAAK,gBAAgB;AACvB,YAAAA,KAAI,SAAS,kBAAkB,GAAG,KAAK,cAAc;AAAA,UACvD;AAEA,cAAI,KAAK,WAAW;AAClB,YAAAA,KAAI,SAAS,QAAQ,YAAY,KAAK;AAAA,UACxC;AACA,cAAI,KAAK,wBAAwB;AAC/B,YAAAA,KAAI,SAAS,QAAQ,yBAAyB,KAAK;AAAA,UACrD;AACA,UAAAA,KAAI,SAAS,QAAQ,gBAAgB,CAAC,SAAS;AAI7C,gBAAI,KAAK,cAAc,KAAK,WAAW,WAAW,OAAO;AACvD,kBAAI;AACJ,qBAAO,eAAe,MAAM,QAAQ;AAAA,gBAClC,KAAK,MAAM;AACT,sBAAI,MAAO,QAAO;AAClB,0BAAQ,YAAY,IAAI;AACxB,yBAAO;AAAA,gBACT;AAAA,cACF,CAAC;AAAA,YACH;AAKA,gBAAI,KAAK,kBAAkB,KAAK,eAAe,WAAW,OAAO;AAC/D,kBAAI;AACJ,kBAAI;AAEJ,qBAAO,eAAe,MAAM,SAAS;AAAA,gBACnC,KAAK,MAAM;AACT,sBAAI,MAAO,QAAO;AAClB,0BAAQ,aAAa,IAAI;AACzB,yBAAO;AAAA,gBACT;AAAA,cACF,CAAC;AACD,qBAAO,eAAe,MAAM,gBAAgB;AAAA,gBAC1C,KAAK,MAAM;AACT,sBAAI,aAAc,QAAO;AACzB,iCAAe,oBAAoB,IAAI;AACvC,yBAAO;AAAA,gBACT;AAAA,cACF,CAAC;AAAA,YACH;AAAA,UACF;AACA,UAAAA,KAAI,IAA0B,oBAAoB,EAAE,KAAK;AAAA,QAC3D;AAAA,QACA,QAAQA,MAAK;AACX,cAAI,KAAK,aAAa;AACpB,YAAAA,KAAI,SAAS,SAAS,KAAK,WAAW;AAAA,UACxC;AACA,cAAI,KAAK,UAAU;AACjB,YAAAA,KAAI,WAAW,OAAO,WAAW,KAAK;AAAA,UACxC;AACA,UAAAA,KAAI,SAAS,KAAK,EAAE,KAAK,MAAM;AAC7B,gBAAI,KAAK,OAAQ,MAAK,OAAOA,IAAG;AAAA,UAClC,CAAC;AAAA,QACH;AAAA,QACA,UAAUA,MAAK;AACb,UAAAA,KAAI,SAAS,QAAQ;AAAA,QACvB;AAAA,QACA,kBAAkB;AAAA,MACpB,CAAC;AAAA,IACH;AAEA,WAAO;AAAA,EACT;AACF;;;AW9IA,OAAO,SAAS,SAAS,mBAAmB;AAG5C,SAAS,oBAAoB;AAC7B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAIA,IAAM,iBAAwC,CAAC,UAAuB;AAC3E,QAAM,EAAE,UAAU,GAAG,OAAO,IAAI;AAChC,QAAM,SAAS,QAAQ,MAAM,oBAAoB,MAAM,GAAG,CAAC,CAAC;AAC5D,QAAM,sBAAsB;AAAA,IAC1B,CAAC,eACE;AAAA,MACC,GAAG,2BAA2B,SAAS;AAAA,MACvC,IAAI,WAAyB;AAC3B,eAAO,UAAU,IAAkB,YAAY;AAAA,MACjD;AAAA,MACA,IAAI,YAA8B;AAChC,eAAO,UAAU,IAAsB,gBAAgB;AAAA,MACzD;AAAA,IACF;AAAA,IACF,CAAC;AAAA,EACH;AACA,SACE,oCAAC,2BAAwB,SAAS,QAAQ,uBACvC,QACH;AAEJ;;;ACjCA,SAAoC,+BAAsB;;;ACA1D,OAAOC,YAAW;AAWX,IAAM,SAAgC,CAAC,UAAuB;AACnE,QAAM,EAAE,UAAU,GAAG,WAAW,IAAI;AACpC,SACE,gBAAAC,OAAA,cAAC,kBAAgB,GAAG,cAClB,gBAAAA,OAAA,cAAC,+BAAgB,QAAS,CAC5B;AAEJ;;;AClBA,SAAS,kBAAkB;AAIpB,SAAS,gBAAkC;AAChD,SAAO,WAAW,gBAAgB;AACpC;;;AhB2EA,cAAc;AAEd,SAAS,mCAAmC;","names":["injectable","inject","EditorProps","definePluginCreator","definePluginCreator","injectable","inject","inject","injectable","definePluginCreator","injectable","inject","Playground","inject","Playground","injectable","definePluginCreator","ctx","React","React"]}

package/dist/index.d.mts

@@ -1,74 +1,93 @@
+import { NodeFormProps } from '@flowgram.ai/node';
 export * from '@flowgram.ai/node';
 export { FormModelV2 as FormModel } from '@flowgram.ai/node';
 export * from '@flowgram.ai/utils';
 import * as _flowgram_ai_core from '@flowgram.ai/core';
-import { PluginContext, Plugin, PluginsProvider, PlaygroundConfigRevealOpts, Playground } from '@flowgram.ai/core';
+import { PluginContext, Plugin, PluginsProvider, Playground, PlaygroundConfigRevealOpts } from '@flowgram.ai/core';
 export * from '@flowgram.ai/core';
 export { PlaygroundReactRenderer as EditorRenderer } from '@flowgram.ai/core';
-import { FlowDocument, FlowDocumentJSON, FlowNodeRegistry, FlowNodeType, FlowNodeEntity, FlowNodeJSON, FlowTransitionLine, FlowTransitionLabel } from '@flowgram.ai/document';
+import { FlowDocument, FlowDocumentJSON, FlowNodeRegistry, FlowNodeType, FlowNodeEntity, FlowNodeJSON } from '@flowgram.ai/document';
 export * from '@flowgram.ai/document';
 export * from '@flowgram.ai/renderer';
-import { VariablePluginOptions } from '@flowgram.ai/variable-plugin';
+import { FlowNodeScope, VariablePluginOptions } from '@flowgram.ai/variable-plugin';
 export * from '@flowgram.ai/variable-plugin';
 export * from '@flowgram.ai/shortcuts-plugin';
 import { NodeCorePluginOptions } from '@flowgram.ai/node-core-plugin';
 export * from '@flowgram.ai/node-core-plugin';
 import { I18nPluginOptions } from '@flowgram.ai/i18n-plugin';
 export * from '@flowgram.ai/i18n-plugin';
+export { ReactiveBaseState, ReactiveState, Tracker, observe, useObserve, useReactiveState, useReadonlyReactiveState } from '@flowgram.ai/reactive';
+export { AsyncContainerModule, Container, ContainerModule, inject, injectable, interfaces, multiInject, named, postConstruct } from 'inversify';
 import { FormMetaOrFormMetaGenerator, FormItem, FormModel } from '@flowgram.ai/form-core';
 export { FlowNodeFormData, NodeRender, NodeRenderProps } from '@flowgram.ai/form-core';
-export { Errors, Field, FieldArray, FieldArrayRenderProps, FieldError, FieldName, FieldRenderProps, FieldState, FieldWarning, Form, FormControl, FormRenderProps, FormState, IField, IFieldArray, IForm, Validate, ValidateTrigger, Warnings, useCurrentField, useCurrentFieldState, useField, useFieldValidate, useForm, useWatch } from '@flowgram.ai/form';
+export { Errors, FeedbackLevel, Field, FieldArray, FieldArrayRenderProps, FieldError, FieldName, FieldRenderProps, FieldState, FieldWarning, Form, FormControl, FormRenderProps, FormState, IField, IFieldArray, IForm, Validate, ValidateTrigger, Warnings, useCurrentField, useCurrentFieldState, useField, useFieldValidate, useForm, useWatch } from '@flowgram.ai/form';
 import { ReduxDevToolPluginOptions } from '@flowgram.ai/redux-devtool-plugin';
 import { SelectionService, PlaygroundReactProps } from '@flowgram.ai/playground-react';
+export { createPlaygroundReactPreset } from '@flowgram.ai/playground-react';
 import { MaterialsPluginOptions } from '@flowgram.ai/materials-plugin';
 import { HistoryPluginOptions } from '@flowgram.ai/history';
 import * as React from 'react';
 import React__default from 'react';
 export * from '@flowgram.ai/node-variable-plugin';
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+declare module '@flowgram.ai/document' {
+    interface FlowNodeEntity {
+        form: NodeFormProps<any> | undefined;
+        scope: FlowNodeScope | undefined;
+        privateScope: FlowNodeScope | undefined;
+    }
+}
 interface EditorPluginContext extends PluginContext {
     document: FlowDocument;
     selection: SelectionService;
 }
-/**
- * 固定布局配置
- */
 interface EditorProps<CTX extends EditorPluginContext = EditorPluginContext, JSON = FlowDocumentJSON> extends PlaygroundReactProps<CTX> {
     /**
+     * Initialize data
      * 初始化数据
      */
     initialData?: JSON;
     /**
+     * whether it is readonly
      * 是否为 readonly
      */
     readonly?: boolean;
     /**
+     * node registries
      * 节点定义
      */
     nodeRegistries?: FlowNodeRegistry[];
     /**
-     * 获取默认的节点配置
+     * Get the default node registry, which will be merged with the 'nodeRegistries'
+     * 提供默认的节点注册，这个会和 nodeRegistries 做合并
      */
     getNodeDefaultRegistry?: (type: FlowNodeType) => FlowNodeRegistry;
     /**
-     * 节点引擎配置
+     * Node engine configuration
      */
     nodeEngine?: NodeCorePluginOptions & {
         /**
-         * 默认FormMeta
+         * Default formMeta
          */
         createDefaultFormMeta?: (node: FlowNodeEntity) => FormMetaOrFormMetaGenerator;
         /**
-         * 开启
+         * Enable node engine
          */
         enable?: boolean;
     };
     /**
+     * By default, all nodes are expanded
      * 默认是否展开所有节点
      */
     allNodesDefaultExpanded?: boolean;
     /**
-     * 画布物料
+     * Canvas material, Used to customize react components
+     * 画布物料, 用于自定义 react 组件
      */
     materials?: MaterialsPluginOptions;
     /**
@@ -78,41 +97,50 @@ interface EditorProps<CTX extends EditorPluginContext = EditorPluginContext, JSO
     onLoad?: (ctx: CTX) => void;
     /**
      * 是否开启变量引擎
+     * Variable engine enable
      */
     variableEngine?: VariablePluginOptions;
     /**
-     * 是否开启历史
+     * Redo/Undo enable
      */
     history?: HistoryPluginOptions<CTX> & {
         disableShortcuts?: boolean;
     };
     /**
-     * redux 开发者工具配置
+     * redux devtool configuration
      */
     reduxDevTool?: ReduxDevToolPluginOptions;
+    /**
+     * Scroll configuration
+     * 滚动配置
+     */
     scroll?: {
-        disableScrollLimit?: boolean;
+        enableScrollLimit?: boolean;
         disableScrollBar?: boolean;
+        disableScroll?: boolean;
     };
     /**
-     * 节点转
-     * @param node
-     */
-    toNodeJSON?(node: FlowNodeEntity): FlowNodeJSON;
-    fromNodeJSON?(node: FlowNodeEntity, json: FlowNodeJSON): void;
-    /**
-     * 画布内部常量自定义
+     * Node data transformation, called by ctx.document.fromJSON
+     * 节点数据转换, 由 ctx.document.fromJSON 调用
+     * @param node - current node
+     * @param json - Current node json data
      */
-    constants?: Record<string, any>;
+    toNodeJSON?(node: FlowNodeEntity, json: FlowNodeJSON): FlowNodeJSON;
     /**
-     * 自定义节点线条
+     * Node data transformation, called by ctx.document.toJSON
+     * 节点数据转换, 由 ctx.document.toJSON 调用
+     * @param node - current node
+     * @param json - Current node json data
+     * @param isFirstCreate - Whether it is created for the first time, If document.fromJSON is recalled, but the node already exists, isFirstCreate is false
      */
-    formatNodeLines?: (node: FlowNodeEntity, lines: FlowTransitionLine[]) => FlowTransitionLine[];
+    fromNodeJSON?(node: FlowNodeEntity, json: FlowNodeJSON, isFirstCreate: boolean): FlowNodeJSON;
     /**
-     * 自定义节点 label
+     * Canvas internal constant customization
+     * 画布内部常量自定义
      */
-    formatNodeLabels?: (node: FlowNodeEntity, lines: FlowTransitionLabel[]) => FlowTransitionLabel[];
+    constants?: Record<string, any>;
     /**
+     * i18n
      * 国际化
      */
     i18n?: I18nPluginOptions;
@@ -124,10 +152,25 @@ declare namespace EditorProps {
     const DEFAULT: EditorProps;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare function createDefaultPreset<CTX extends EditorPluginContext = EditorPluginContext>(opts: EditorProps<CTX>, plugins?: Plugin[]): PluginsProvider<CTX>;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare const EditorProvider: React__default.FC<EditorProps>;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 /**
  * 画布编辑器
  * @param props
@@ -135,6 +178,11 @@ declare const EditorProvider: React__default.FC<EditorProps>;
  */
 declare const Editor: React__default.FC<EditorProps>;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 interface HighLightOptions {
     padding?: number;
     overlayClassName?: string;
@@ -147,6 +195,11 @@ interface HighlightProps {
 }
 declare function useHighlight(props: HighlightProps): React.MutableRefObject<any> | null;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 type FocusNodeCanvasOptions = PlaygroundConfigRevealOpts;
 interface FocusNodeFormItemOptions {
     canvas?: FocusNodeCanvasOptions;
@@ -160,10 +213,20 @@ declare class NodeFocusService {
     focusNodeFormItem(formItem: FormItem, options?: FocusNodeFormItemOptions): Promise<void>;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare class NodeClient {
     nodeFocusService: NodeFocusService;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 interface FocusNodeOptions {
     zoom?: PlaygroundConfigRevealOpts['zoom'];
     easing?: PlaygroundConfigRevealOpts['easing'];
@@ -177,9 +240,18 @@ declare class FlowEditorClient {
     focusNode(node: FlowNodeEntity, options?: FocusNodeOptions): void;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
 declare const createFlowEditorClientPlugin: _flowgram_ai_core.PluginCreator<{}>;
 declare const createFlowEditorClientPlugins: () => _flowgram_ai_core.Plugin<{}>[];
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare function useFlowEditor(): FlowEditorClient;
 
 export { Editor, type EditorPluginContext, EditorProps, EditorProvider, FlowEditorClient, type FocusNodeCanvasOptions, type FocusNodeFormItemOptions, type HighLightOptions, NodeClient, NodeFocusService, createDefaultPreset, createFlowEditorClientPlugin, createFlowEditorClientPlugins, highlightFormItem, useFlowEditor, useHighlight };