@flowgram.ai/form-core 0.1.0

package/dist/esm/index.js

@@ -0,0 +1,835 @@
+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;
+};
+
+// src/node/node-contribution.ts
+var NodeContribution = Symbol("NodeContribution");
+
+// src/node/node-container-module.ts
+import { ContainerModule } from "inversify";
+
+// src/node/node-manager.ts
+import { flow } from "lodash";
+import { injectable, multiInject, optional, postConstruct } from "inversify";
+var MaterialRenderKey = /* @__PURE__ */ ((MaterialRenderKey2) => {
+  MaterialRenderKey2["CustomNodeError"] = "Material_CustomNodeError";
+  return MaterialRenderKey2;
+})(MaterialRenderKey || {});
+var NodeManager = class {
+  constructor() {
+    this.materialRenderRegistry = /* @__PURE__ */ new Map();
+    this.pluginRenderRegistry = /* @__PURE__ */ new Map();
+    this.nodeRenderHocs = [];
+    this.nodeContributions = [];
+  }
+  registerMaterialRender(key, render) {
+    this.materialRenderRegistry.set(key, render);
+  }
+  getMaterialRender(key) {
+    return this.materialRenderRegistry.get(key);
+  }
+  registerPluginRender(key, render) {
+    this.pluginRenderRegistry.set(key, render);
+  }
+  getPluginRender(key) {
+    return this.pluginRenderRegistry.get(key);
+  }
+  registerNodeErrorRender(render) {
+    this.registerMaterialRender("Material_CustomNodeError" /* CustomNodeError */, render);
+  }
+  get nodeRenderHoc() {
+    return flow(this.nodeRenderHocs);
+  }
+  registerNodeRenderHoc(hoc) {
+    this.nodeRenderHocs.push(hoc);
+  }
+  get nodeErrorRender() {
+    return this.materialRenderRegistry.get("Material_CustomNodeError" /* CustomNodeError */);
+  }
+  init() {
+    this.nodeContributions.forEach((contrib) => contrib.onRegister?.(this));
+  }
+};
+__decorateClass([
+  multiInject(NodeContribution),
+  optional()
+], NodeManager.prototype, "nodeContributions", 2);
+__decorateClass([
+  postConstruct()
+], NodeManager.prototype, "init", 1);
+NodeManager = __decorateClass([
+  injectable()
+], NodeManager);
+
+// src/node/node-engine-context.ts
+import { injectable as injectable2 } from "inversify";
+import { Emitter } from "@flowgram.ai/utils";
+var NodeEngineContext = class {
+  constructor() {
+    this.onChangeEmitter = new Emitter();
+    this.onChange = this.onChangeEmitter.event;
+    this._readonly = NodeEngineContext.DEFAULT_READONLY;
+    this._json = NodeEngineContext.DEFAULT_JSON;
+  }
+  get json() {
+    return this._json;
+  }
+  get readonly() {
+    return this._readonly;
+  }
+  set readonly(value) {
+    this._readonly = value;
+    this.fireChange();
+  }
+  fireChange() {
+    this.updateJSON();
+    this.onChangeEmitter.fire(this);
+  }
+  updateJSON() {
+    this._json = {
+      readonly: this._readonly
+    };
+  }
+};
+NodeEngineContext.DEFAULT_READONLY = false;
+NodeEngineContext.DEFAULT_JSON = { readonly: NodeEngineContext.DEFAULT_READONLY };
+NodeEngineContext = __decorateClass([
+  injectable2()
+], NodeEngineContext);
+
+// src/node/node-engine.ts
+import { injectable as injectable3, inject } from "inversify";
+var NodeEngine = class {
+};
+__decorateClass([
+  inject(NodeManager)
+], NodeEngine.prototype, "nodeManager", 2);
+__decorateClass([
+  inject(NodeEngineContext)
+], NodeEngine.prototype, "context", 2);
+NodeEngine = __decorateClass([
+  injectable3()
+], NodeEngine);
+
+// src/node/node-container-module.ts
+var NodeContainerModule = new ContainerModule((bind, unbind, isBound, rebind) => {
+  bind(NodeEngine).toSelf().inSingletonScope();
+  bind(NodeManager).toSelf().inSingletonScope();
+  bind(NodeEngineContext).toSelf().inSingletonScope();
+});
+
+// src/node/core-plugins.ts
+var PLUGIN_KEY = {
+  FORM: "Plugin_Form",
+  ERROR: "Plugin_Error"
+};
+
+// src/node/core-materials.ts
+var MATERIAL_KEY = {
+  NODE_ERROR_RENDER: "node_error_render",
+  NODE_PLACEHOLDER_RENDER: "node_placeholder_render"
+};
+
+// src/error/flow-node-error-data.ts
+import { EntityData } from "@flowgram.ai/core";
+var FlowNodeErrorData = class extends EntityData {
+  getDefaultData() {
+    return { error: null };
+  }
+  setError(e) {
+    this.update({ error: e });
+  }
+  getError() {
+    return this.data.error;
+  }
+};
+FlowNodeErrorData.type = "FlowNodeErrorData";
+
+// src/error/error-container-module.ts
+import { ContainerModule as ContainerModule2 } from "inversify";
+import { bindContributions } from "@flowgram.ai/utils";
+
+// src/error/error-node-contribution.ts
+import { injectable as injectable4 } from "inversify";
+
+// src/error/renders/error-render.tsx
+import React2, { useCallback, useEffect } from "react";
+import { useRefresh, useService } from "@flowgram.ai/core";
+
+// src/error/renders/default-error-render.tsx
+import React from "react";
+var ERROR_STYLE = {
+  color: "#f54a45"
+};
+var defaultErrorRender = ({ error }) => /* @__PURE__ */ React.createElement("div", { style: ERROR_STYLE }, error.message);
+
+// src/error/renders/error-render.tsx
+var ErrorRender = ({ node, playgroundContext }) => {
+  const refresh = useRefresh();
+  const nodeErrorData = node.getData(FlowNodeErrorData);
+  const nodeError = nodeErrorData.getError();
+  const nodeManager = useService(NodeManager);
+  const nodeErrorRender = nodeManager.getMaterialRender(MATERIAL_KEY.NODE_ERROR_RENDER);
+  const renderError = useCallback(() => {
+    if (!nodeErrorRender) {
+      return defaultErrorRender({
+        error: nodeError,
+        context: { node, playgroundContext }
+      });
+    }
+    return nodeErrorRender({
+      error: nodeError,
+      context: { node, playgroundContext }
+    });
+  }, [nodeError, node, playgroundContext]);
+  useEffect(() => {
+    const disposable = nodeErrorData.onDataChange(() => {
+      refresh();
+    });
+    return () => {
+      disposable.dispose();
+    };
+  }, []);
+  return nodeError ? renderError() : null;
+};
+var errorPluginRender = (props) => /* @__PURE__ */ React2.createElement(ErrorRender, { ...props });
+
+// src/error/error-node-contribution.ts
+var ErrorNodeContribution = class {
+  onRegister(nodeManager) {
+    nodeManager.registerPluginRender(PLUGIN_KEY.ERROR, errorPluginRender);
+  }
+};
+ErrorNodeContribution = __decorateClass([
+  injectable4()
+], ErrorNodeContribution);
+
+// src/error/error-container-module.ts
+var ErrorContainerModule = new ContainerModule2((bind) => {
+  bindContributions(bind, ErrorNodeContribution, [NodeContribution]);
+});
+
+// src/error/client.ts
+function getNodeError(node) {
+  return node.getData(FlowNodeErrorData).getError();
+}
+
+// src/form/form-core-container-module.ts
+import { ContainerModule as ContainerModule3 } from "inversify";
+import { bindContributions as bindContributions2 } from "@flowgram.ai/utils";
+
+// src/form/services/form-context-maker.ts
+import { inject as inject2, injectable as injectable5 } from "inversify";
+import { injectPlaygroundContext } from "@flowgram.ai/core";
+var FormContextMaker = class {
+  makeFormItemMaterialContext(formItem, options) {
+    return {
+      meta: formItem.meta,
+      path: formItem.path,
+      readonly: this.nodeEngineContext.readonly,
+      getFormItemValueByPath: formItem.formModel.getFormItemValueByPath.bind(formItem.formModel),
+      onFormValidate: formItem.formModel.onValidate.bind(formItem.formModel),
+      form: formItem.formModel,
+      node: formItem.formModel.flowNodeEntity,
+      playgroundContext: this.playgroundContext,
+      index: options?.getIndex()
+    };
+  }
+};
+__decorateClass([
+  inject2(NodeEngineContext)
+], FormContextMaker.prototype, "nodeEngineContext", 2);
+__decorateClass([
+  injectPlaygroundContext()
+], FormContextMaker.prototype, "playgroundContext", 2);
+FormContextMaker = __decorateClass([
+  injectable5()
+], FormContextMaker);
+
+// src/form/services/form-path-service.ts
+import { injectable as injectable6 } from "inversify";
+var FormPathService = class {
+  static normalize(path) {
+    if (path === FormPathService.ROOT) {
+      return path;
+    }
+    if (path.endsWith(FormPathService.DIVIDER)) {
+      path = path.slice(0, -1);
+    }
+    return path;
+  }
+  static join(paths) {
+    if (paths[1].startsWith(FormPathService.ROOT)) {
+      throw new Error(
+        `FormPathService Error: join failed, invalid paths[1], paths[1]= ${paths[1]}`
+      );
+    }
+    if (paths[0].endsWith(FormPathService.DIVIDER)) {
+      return `${paths[0]}${paths[1]}`;
+    }
+    return paths.join(FormPathService.DIVIDER);
+  }
+  static toArrayPath(path) {
+    return FormPathService.join([path, FormPathService.ARRAY]);
+  }
+  static parseArrayItemPath(path) {
+    const names = path.split("/");
+    let i = 0;
+    while (i < names.length) {
+      const itemIndex = parseInt(names[i]);
+      if (!isNaN(itemIndex)) {
+        const arrayPath = FormPathService.toArrayPath(
+          names.slice(0, i).join(FormPathService.DIVIDER)
+        );
+        const restPath = names.slice(i + 1).join(FormPathService.DIVIDER);
+        const itemMetaPath = FormPathService.join([arrayPath, restPath]);
+        return { itemIndex, arrayPath, itemMetaPath };
+      }
+      i = i + 1;
+    }
+    return null;
+  }
+  simplify(path) {
+    const segments = path.split(FormPathService.DIVIDER);
+    const resSegments = [];
+    for (let i = 0; i < segments.length; i++) {
+      if (!segments[i]) {
+        throw new Error("FormPathService: join failed");
+      }
+      if (segments[i] === FormPathService.RELATIVE_CURRENT) {
+        continue;
+      }
+      if (segments[i] === FormPathService.RELATIVE_PARENT) {
+        resSegments.pop();
+      }
+      resSegments.push(segments[i]);
+    }
+    return resSegments.join(FormPathService.DIVIDER);
+  }
+};
+FormPathService.ROOT = "/";
+FormPathService.DIVIDER = "/";
+FormPathService.RELATIVE_PARENT = "..";
+FormPathService.RELATIVE_CURRENT = ".";
+FormPathService.ARRAY = "[]";
+FormPathService = __decorateClass([
+  injectable6()
+], FormPathService);
+
+// src/form/services/form-manager.ts
+import { mapValues } from "lodash";
+import { inject as inject3, injectable as injectable9, multiInject as multiInject2, optional as optional2, postConstruct as postConstruct2 } from "inversify";
+import { injectPlaygroundContext as injectPlaygroundContext2 } from "@flowgram.ai/core";
+
+// src/form/models/form-model.ts
+import { injectable as injectable7 } from "inversify";
+import { DisposableCollection } from "@flowgram.ai/utils";
+var FormModelFactory = Symbol("FormModelFactory");
+var FormModelEntity = Symbol("FormModelEntity");
+var FormModel = class {
+  constructor() {
+    this.toDispose = new DisposableCollection();
+  }
+};
+FormModel = __decorateClass([
+  injectable7()
+], FormModel);
+
+// src/form/models/form-item.ts
+import { DisposableCollection as DisposableCollection2, Emitter as Emitter2 } from "@flowgram.ai/utils";
+var FormItem = class {
+  constructor(meta, path, formModel) {
+    this.onInitEventEmitter = new Emitter2();
+    this.onInit = this.onInitEventEmitter.event;
+    this.toDispose = new DisposableCollection2();
+    this.onDispose = this.toDispose.onDispose;
+    this.meta = meta;
+    this.path = path;
+    this.formModel = formModel;
+    this.toDispose.push(this.onInitEventEmitter);
+  }
+  set domRef(domRef) {
+    this._domRef = domRef;
+  }
+  get domRef() {
+    return this._domRef;
+  }
+  dispose() {
+    this.toDispose.dispose();
+  }
+};
+
+// src/form/models/form-meta.ts
+var FormMeta = class {
+  constructor(root, options) {
+    this._root = root;
+    this._options = options;
+  }
+  get root() {
+    return this._root;
+  }
+  get options() {
+    return this._options;
+  }
+  static traverse({ formItemMeta, parentPath = "", handle }) {
+    if (!formItemMeta) {
+      return;
+    }
+    const isRoot = !parentPath;
+    const path = isRoot ? FormPathService.ROOT : formItemMeta.name ? FormPathService.join([parentPath, formItemMeta.name]) : parentPath;
+    handle({ formItemMeta, path });
+    if (formItemMeta.items) {
+      this.traverse({
+        formItemMeta: formItemMeta.items,
+        handle,
+        parentPath: FormPathService.toArrayPath(path)
+      });
+    }
+    if (formItemMeta.children && formItemMeta.children.length) {
+      formItemMeta.children.forEach((child) => {
+        this.traverse({ formItemMeta: child, handle, parentPath: path });
+      });
+    }
+  }
+};
+
+// src/form/models/form-ability-extension-registry.ts
+import { injectable as injectable8 } from "inversify";
+var FormAbilityExtensionRegistry = class {
+  constructor() {
+    this.registry = /* @__PURE__ */ new Map();
+  }
+  register(extension) {
+    this.registry.set(extension.key, extension);
+  }
+  get(key) {
+    return this.registry.get(key);
+  }
+  get objectMap() {
+    return Object.fromEntries(this.registry);
+  }
+  get collection() {
+    return Array.from(this.registry.values());
+  }
+};
+FormAbilityExtensionRegistry = __decorateClass([
+  injectable8()
+], FormAbilityExtensionRegistry);
+
+// src/form/form-contribution.ts
+var FormContribution = Symbol("FormContribution");
+
+// src/form/abilities/setter-ability/setter-ability.ts
+var _SetterAbility = class _SetterAbility {
+  get type() {
+    return _SetterAbility.type;
+  }
+};
+_SetterAbility.type = "setter";
+var SetterAbility = _SetterAbility;
+
+// src/form/abilities/decorator-ability/decorator-ability.ts
+var _DecoratorAbility = class _DecoratorAbility {
+  get type() {
+    return _DecoratorAbility.type;
+  }
+};
+_DecoratorAbility.type = "decorator";
+var DecoratorAbility = _DecoratorAbility;
+
+// src/form/abilities/visibility-ability/visibility-ability.ts
+var _VisibilityAbility = class _VisibilityAbility {
+  get type() {
+    return _VisibilityAbility.type;
+  }
+};
+_VisibilityAbility.type = "visibility";
+var VisibilityAbility = _VisibilityAbility;
+
+// src/form/abilities/effect-ability/effect-ability.ts
+var _EffectAbility = class _EffectAbility {
+  get type() {
+    return _EffectAbility.type;
+  }
+};
+_EffectAbility.type = "effect";
+var EffectAbility = _EffectAbility;
+
+// src/form/abilities/default-ability/default-ability.ts
+var _DefaultAbility = class _DefaultAbility {
+  get type() {
+    return _DefaultAbility.type;
+  }
+};
+_DefaultAbility.type = "default";
+var DefaultAbility = _DefaultAbility;
+
+// src/form/abilities/validation-ability/validation-ability.ts
+var _ValidationAbility = class _ValidationAbility {
+  get type() {
+    return _ValidationAbility.type;
+  }
+};
+_ValidationAbility.type = "validation";
+var ValidationAbility = _ValidationAbility;
+
+// src/form/services/form-manager.ts
+var FormManager = class {
+  constructor() {
+    this.abilityRegistry = /* @__PURE__ */ new Map();
+    this.setterHocs = [];
+    this.extensionRegistryMap = /* @__PURE__ */ new Map();
+    this.formContributions = [];
+  }
+  get components() {
+    return mapValues(
+      this.extensionRegistryMap.get(SetterAbility.type)?.objectMap || {},
+      (setter) => setter.component
+    );
+  }
+  get decorators() {
+    return mapValues(
+      this.extensionRegistryMap.get(DecoratorAbility.type)?.objectMap || {},
+      (decorator) => decorator.component
+    );
+  }
+  registerAbilityExtension(type, extension) {
+    if (!this.extensionRegistryMap.get(type)) {
+      this.extensionRegistryMap.set(type, new FormAbilityExtensionRegistry());
+    }
+    const registry = this.extensionRegistryMap.get(type);
+    if (!registry) {
+      return;
+    }
+    registry.register(extension);
+  }
+  getAbilityExtension(abilityType, extensionKey) {
+    return this.extensionRegistryMap.get(abilityType)?.get(extensionKey);
+  }
+  registerAbility(Ability) {
+    const ability = new Ability();
+    this.abilityRegistry.set(ability.type, ability);
+  }
+  registerAbilities(Abilities) {
+    Abilities.forEach(this.registerAbility.bind(this));
+  }
+  getAbility(type) {
+    return this.abilityRegistry.get(type);
+  }
+  /**
+   * @deprecated
+   * Setter Hoc and setter are no longer supported in NodeEngineV2
+   * @param hoc
+   */
+  registerSetterHoc(hoc) {
+    this.setterHocs.push(hoc);
+  }
+  init() {
+    this.formContributions.forEach((contrib) => contrib.onRegister?.(this));
+  }
+};
+__decorateClass([
+  inject3(FormPathService)
+], FormManager.prototype, "pathManager", 2);
+__decorateClass([
+  inject3(FormContextMaker)
+], FormManager.prototype, "formContextMaker", 2);
+__decorateClass([
+  injectPlaygroundContext2()
+], FormManager.prototype, "playgroundContext", 2);
+__decorateClass([
+  multiInject2(FormContribution),
+  optional2()
+], FormManager.prototype, "formContributions", 2);
+__decorateClass([
+  postConstruct2()
+], FormManager.prototype, "init", 1);
+FormManager = __decorateClass([
+  injectable9()
+], FormManager);
+
+// src/form/form-node-contribution.ts
+import { injectable as injectable10 } from "inversify";
+
+// src/form/form-render.tsx
+import React3, { useEffect as useEffect2 } from "react";
+import { useRefresh as useRefresh2 } from "@flowgram.ai/utils";
+
+// src/form/flow-node-form-data.ts
+import { Disposable, Emitter as Emitter3 } from "@flowgram.ai/utils";
+import { EntityData as EntityData2 } from "@flowgram.ai/core";
+var FlowNodeFormData = class extends EntityData2 {
+  constructor(entity, opts) {
+    super(entity);
+    /**
+     * @deprecated rehaje 版表单form Values change 事件
+     * @protected
+     */
+    this.onDetailChangeEmitter = new Emitter3();
+    /**
+     * @deprecated 该方法为旧版引擎（rehaje）表单数据变更事件, 新版节点引擎请使用
+     * this.getFormModel<FormModelV2>().onFormValuesChange.
+     * @protected
+     */
+    this.onDetailChange = this.onDetailChangeEmitter.event;
+    this.flowNodeEntity = entity;
+    this.formModel = opts.formModelFactory(entity);
+    this.toDispose.push(this.onDetailChangeEmitter);
+    this.toDispose.push(
+      Disposable.create(() => {
+        this.formModel.dispose();
+      })
+    );
+  }
+  getFormModel() {
+    return this.formModel;
+  }
+  getDefaultData() {
+    return {};
+  }
+  createForm(formMetaOrFormMetaGenerator, initialValue) {
+    const errorData = this.flowNodeEntity.getData(FlowNodeErrorData);
+    errorData.setError(null);
+    try {
+      this.formModel.init(formMetaOrFormMetaGenerator, initialValue);
+    } catch (e) {
+      errorData.setError(e);
+    }
+  }
+  recreateForm(formMetaOrFormMetaGenerator, initialValue) {
+    this.createForm(formMetaOrFormMetaGenerator, initialValue);
+  }
+  toJSON() {
+    return this.formModel.toJSON();
+  }
+  dispose() {
+    super.dispose();
+  }
+  /**
+   * @deprecated rehaje 版表单form Values change 事件触发函数
+   * @protected
+   */
+  fireDetaiChange(detailChangeEvent) {
+    this.onDetailChangeEmitter.fire(detailChangeEvent);
+  }
+};
+FlowNodeFormData.type = "FlowNodeEntityFormData";
+
+// src/form/form-render.tsx
+function getFormModelFromNode(node) {
+  return node.getData(FlowNodeFormData)?.getFormModel();
+}
+function FormRender({ node }) {
+  const refresh = useRefresh2();
+  const formModel = getFormModelFromNode(node);
+  useEffect2(() => {
+    const disposable = formModel?.onInitialized(() => {
+      refresh();
+    });
+    return () => {
+      disposable.dispose();
+    };
+  }, [formModel]);
+  return formModel?.initialized ? formModel.render() : null;
+}
+var formPluginRender = (props) => /* @__PURE__ */ React3.createElement(FormRender, { ...props });
+
+// src/form/form-node-contribution.ts
+var FormNodeContribution = class {
+  onRegister(nodeManager) {
+    nodeManager.registerPluginRender(PLUGIN_KEY.FORM, formPluginRender);
+  }
+};
+FormNodeContribution = __decorateClass([
+  injectable10()
+], FormNodeContribution);
+
+// src/form/form-core-container-module.ts
+var FormCoreContainerModule = new ContainerModule3((bind) => {
+  bind(FormManager).toSelf().inSingletonScope();
+  bind(FormPathService).toSelf().inSingletonScope();
+  bind(FormContextMaker).toSelf().inSingletonScope();
+  bindContributions2(bind, FormNodeContribution, [NodeContribution]);
+});
+
+// src/form/types/form-model.types.ts
+var FormItemEventName = /* @__PURE__ */ ((FormItemEventName2) => {
+  FormItemEventName2["onFormValueChange"] = "onFormValueChange";
+  FormItemEventName2["onFormItemInit"] = "onFormItemInit";
+  return FormItemEventName2;
+})(FormItemEventName || {});
+
+// src/form/types/form-meta.types.ts
+var FORM_VOID = "form-void";
+
+// src/form/client/index.ts
+function isNodeFormReady(node) {
+  return node.getData(FlowNodeFormData).getFormModel().initialized;
+}
+function getFormModel(node) {
+  return node.getData(FlowNodeFormData).formModel;
+}
+
+// src/client/create-node-container-modules.ts
+function createNodeContainerModules() {
+  return [NodeContainerModule, FormCoreContainerModule, ErrorContainerModule];
+}
+
+// src/client/node-render.tsx
+import React5, { memo, useCallback as useCallback2, useEffect as useEffect5 } from "react";
+import { PlaygroundContext as PlaygroundContext4, useRefresh as useRefresh5, useService as useService3 } from "@flowgram.ai/core";
+
+// src/node-react/context/node-engine-react-context.ts
+import React4 from "react";
+var NodeEngineReactContext = React4.createContext(
+  NodeEngineContext.DEFAULT_JSON
+);
+
+// src/node-react/hooks/use-node-engine-context.ts
+import { useEffect as useEffect3 } from "react";
+import { useService as useService2, useRefresh as useRefresh3 } from "@flowgram.ai/core";
+function useNodeEngineContext() {
+  const refresh = useRefresh3();
+  const nodeEngineContext = useService2(NodeEngineContext);
+  useEffect3(() => {
+    const disposable = nodeEngineContext.onChange(() => {
+      refresh();
+    });
+    return () => {
+      disposable.dispose();
+    };
+  }, []);
+  return nodeEngineContext;
+}
+
+// src/node-react/hooks/use-form-Item.ts
+import { useEffect as useEffect4 } from "react";
+import { useEntityFromContext, useRefresh as useRefresh4 } from "@flowgram.ai/core";
+function useFormItem(path) {
+  const refresh = useRefresh4();
+  const node = useEntityFromContext();
+  const formData = node.getData(FlowNodeFormData);
+  const formItem = formData.getFormModel().getFormItemByPath(path);
+  useEffect4(() => {
+    const disposable = formData.onDataChange(() => {
+      refresh();
+    });
+    return () => {
+      disposable.dispose();
+    };
+  }, []);
+  return formItem;
+}
+
+// src/client/node-render.tsx
+var PureNodeRender = ({ node }) => {
+  const refresh = useRefresh5();
+  const nodeErrorData = node.getData(FlowNodeErrorData);
+  const formModel = getFormModel(node);
+  const isNodeError = !!getNodeError(node);
+  const isFormReady = isNodeFormReady(node);
+  const playgroundContext = useService3(PlaygroundContext4);
+  const nodeManager = useService3(NodeManager);
+  const nodeFormRender = nodeManager.getPluginRender(PLUGIN_KEY.FORM);
+  const nodeErrorRender = nodeManager.getPluginRender(PLUGIN_KEY.ERROR);
+  const nodePlaceholderRender = nodeManager.getMaterialRender(MATERIAL_KEY.NODE_PLACEHOLDER_RENDER);
+  const nodeEngineContext = useNodeEngineContext();
+  useEffect5(() => {
+    const errorDisposable = nodeErrorData.onDataChange(() => {
+      refresh();
+    });
+    const formDisposable = formModel.onInitialized(() => {
+      refresh();
+    });
+    return () => {
+      errorDisposable.dispose();
+      formDisposable.dispose();
+    };
+  }, []);
+  const renderContent = useCallback2(() => {
+    if (!formModel.formMeta) {
+      return null;
+    }
+    if (isNodeError) {
+      return nodeErrorRender({ node, playgroundContext });
+    }
+    if (isFormReady) {
+      return nodeFormRender({ node, playgroundContext });
+    }
+    return nodePlaceholderRender?.({ node, playgroundContext }) || null;
+  }, [
+    isNodeError,
+    isFormReady,
+    nodeErrorRender,
+    nodeFormRender,
+    nodePlaceholderRender,
+    node,
+    playgroundContext
+  ]);
+  return /* @__PURE__ */ React5.createElement(NodeEngineReactContext.Provider, { value: nodeEngineContext.json }, nodeManager.nodeRenderHoc(renderContent)());
+};
+var NodeRender = memo(PureNodeRender);
+
+// src/client/node-material-client.ts
+function registerNodeErrorRender(nodeManager, render) {
+  nodeManager.registerMaterialRender(MATERIAL_KEY.NODE_ERROR_RENDER, render);
+}
+function registerNodePlaceholderRender(nodeManager, render) {
+  nodeManager.registerMaterialRender(MATERIAL_KEY.NODE_PLACEHOLDER_RENDER, render);
+}
+
+// src/client/create-node-entity-datas.ts
+function createNodeEntityDatas() {
+  return [FlowNodeFormData, FlowNodeErrorData];
+}
+export {
+  DecoratorAbility,
+  DefaultAbility,
+  EffectAbility,
+  ErrorContainerModule,
+  FORM_VOID,
+  FlowNodeErrorData,
+  FlowNodeFormData,
+  FormAbilityExtensionRegistry,
+  FormContextMaker,
+  FormContribution,
+  FormCoreContainerModule,
+  FormItem,
+  FormItemEventName,
+  FormManager,
+  FormMeta,
+  FormModel,
+  FormModelEntity,
+  FormModelFactory,
+  FormPathService,
+  MATERIAL_KEY,
+  MaterialRenderKey,
+  NodeContainerModule,
+  NodeContribution,
+  NodeEngine,
+  NodeEngineContext,
+  NodeEngineReactContext,
+  NodeManager,
+  NodeRender,
+  PLUGIN_KEY,
+  SetterAbility,
+  ValidationAbility,
+  VisibilityAbility,
+  createNodeContainerModules,
+  createNodeEntityDatas,
+  getFormModel,
+  getNodeError,
+  isNodeFormReady,
+  registerNodeErrorRender,
+  registerNodePlaceholderRender,
+  useFormItem,
+  useNodeEngineContext
+};
+//# sourceMappingURL=index.js.map