@flowgram.ai/node 0.1.0-alpha.2 → 0.1.0-alpha.21

package/dist/index.js

@@ -28,8 +28,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.ts
-var src_exports = {};
-__export(src_exports, {
+var index_exports = {};
+__export(index_exports, {
   DataEvent: () => DataEvent,
   FormModelV2: () => FormModelV2,
   FormPlugin: () => FormPlugin,
@@ -46,7 +46,7 @@ __export(src_exports, {
   useWatchFormValues: () => useWatchFormValues,
   useWatchFormWarnings: () => useWatchFormWarnings
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(index_exports);
 
 // src/types.ts
 var DataEvent = /* @__PURE__ */ ((DataEvent2) => {
@@ -65,14 +65,14 @@ function isFormMetaV2(formMeta) {
 }
 
 // src/form-model-v2.ts
-var import_lodash2 = require("lodash");
+var import_lodash_es2 = require("lodash-es");
 var import_utils = require("@flowgram.ai/utils");
 var import_form_core2 = require("@flowgram.ai/form-core");
 var import_form2 = require("@flowgram.ai/form");
 var import_core = require("@flowgram.ai/core");
 
 // src/utils.ts
-var import_lodash = require("lodash");
+var import_lodash_es = require("lodash-es");
 var import_form_core = require("@flowgram.ai/form-core");
 function findMatchedInMap(field, validateMap) {
   if (!validateMap) {
@@ -81,7 +81,7 @@ function findMatchedInMap(field, validateMap) {
   if (validateMap[field.name]) {
     return validateMap[field.name];
   }
-  const found = (0, import_lodash.find)(Object.keys(validateMap), (key) => {
+  const found = (0, import_lodash_es.find)(Object.keys(validateMap), (key) => {
     if (key.startsWith("regex:")) {
       const regex = RegExp(key.split(":")[1]);
       return regex.test(field.name);
@@ -109,10 +109,25 @@ function convertGlobPath(path) {
   return path;
 }
 function mergeEffectMap(origin, source) {
-  return (0, import_lodash.mergeWith)(origin, source, function(objValue, srcValue) {
+  return (0, import_lodash_es.mergeWith)(origin, source, function(objValue, srcValue) {
     return (objValue || []).concat(srcValue);
   });
 }
+function mergeEffectReturn(origin, source) {
+  return () => {
+    origin?.();
+    source?.();
+  };
+}
+function runAndDeleteEffectReturn(effectReturnMap, name, events) {
+  events.forEach((event) => {
+    const eventMap = effectReturnMap.get(event);
+    if (eventMap?.[name]) {
+      eventMap[name]();
+      delete eventMap[name];
+    }
+  });
+}
 
 // src/form-render.tsx
 var import_react = __toESM(require("react"));
@@ -124,24 +139,25 @@ function renderForm(formModel) {
 
 // src/form-model-v2.ts
 var DEFAULT = {
-  EFFECT_MAP: {},
-  EFFECT_RETURN_MAP: /* @__PURE__ */ new Map([
+  // Different formModel should have different reference
+  EFFECT_MAP: () => ({}),
+  EFFECT_RETURN_MAP: () => /* @__PURE__ */ new Map([
     ["onValueInitOrChange" /* onValueInitOrChange */, {}],
     ["onValueChange" /* onValueChange */, {}],
     ["onValueInit" /* onValueInit */, {}],
     ["onArrayAppend" /* onArrayAppend */, {}],
     ["onArrayDelete" /* onArrayDelete */, {}]
   ]),
-  FORM_FEEDBACKS: [],
+  FORM_FEEDBACKS: () => [],
   VALID: null
 };
 var FormModelV2 = class extends import_form_core2.FormModel {
   constructor(node) {
     super();
-    this.effectMap = DEFAULT.EFFECT_MAP;
-    this.effectReturnMap = DEFAULT.EFFECT_RETURN_MAP;
+    this.effectMap = DEFAULT.EFFECT_MAP();
+    this.effectReturnMap = DEFAULT.EFFECT_RETURN_MAP();
     this.plugins = [];
-    this.formFeedbacks = DEFAULT.FORM_FEEDBACKS;
+    this.formFeedbacks = DEFAULT.FORM_FEEDBACKS();
     this.onInitializedEmitter = new import_utils.Emitter();
     this.onValidateEmitter = new import_utils.Emitter();
     this.onValidate = this.onValidateEmitter.event;
@@ -184,11 +200,20 @@ var FormModelV2 = class extends import_form_core2.FormModel {
     return this._formControl;
   }
   get formMeta() {
-    return this.node.getNodeRegistry().formMeta;
+    return this._formMeta || this.node.getNodeRegistry().formMeta;
+  }
+  get values() {
+    return this.nativeFormModel?.values;
   }
   get feedbacks() {
     return this._feedbacks;
   }
+  updateFormValues(value) {
+    if (this.nativeFormModel) {
+      const finalValue = this.formMeta.formatOnInit ? this.formMeta.formatOnInit(value, this.nodeContext) : value;
+      this.nativeFormModel.values = finalValue;
+    }
+  }
   set feedbacks(feedbacks) {
     this._feedbacks = feedbacks;
     this.onFeedbacksChangeEmitter.fire(feedbacks);
@@ -202,7 +227,8 @@ var FormModelV2 = class extends import_form_core2.FormModel {
   get nodeContext() {
     return {
       node: this.node,
-      playgroundContext: this.node.getService(import_core.PlaygroundContext)
+      playgroundContext: this.node.getService(import_core.PlaygroundContext),
+      clientContext: this.node.getService(import_core.PluginContext)
     };
   }
   get nativeFormModel() {
@@ -218,9 +244,6 @@ var FormModelV2 = class extends import_form_core2.FormModel {
     this.plugins = plugins;
     plugins.forEach((plugin) => {
       plugin.init(this);
-      if (plugin.config?.effect) {
-        mergeEffectMap(this.effectMap, plugin.config.effect);
-      }
     });
   }
   init(formMeta, rawInitialValues) {
@@ -229,11 +252,17 @@ var FormModelV2 = class extends import_form_core2.FormModel {
       this._valid = null;
       formData.fireChange();
     });
+    (formMeta.plugins || [])?.forEach((_plugin) => {
+      if (_plugin.setupFormMeta) {
+        formMeta = _plugin.setupFormMeta(formMeta, this.nodeContext);
+      }
+    });
+    this._formMeta = formMeta;
     const { validateTrigger, validate, effect } = formMeta;
     if (effect) {
       this.effectMap = effect;
     }
-    const defaultValues = typeof formMeta.defaultValues === "function" ? formMeta.defaultValues() : formMeta.defaultValues;
+    const defaultValues = typeof formMeta.defaultValues === "function" ? formMeta.defaultValues(this.nodeContext) : formMeta.defaultValues;
     const initialValues = formMeta.formatOnInit ? formMeta.formatOnInit(rawInitialValues, this.nodeContext) : rawInitialValues;
     const { control } = (0, import_form2.createForm)({
       initialValues: initialValues || defaultValues,
@@ -251,31 +280,51 @@ var FormModelV2 = class extends import_form_core2.FormModel {
     if (formMeta.plugins) {
       this.initPlugins(formMeta.plugins);
     }
-    nativeFormModel.onFormValuesChange(({ values, prevValues, name }) => {
-      const effectKeys = Object.keys(this.effectMap).filter(
-        (pattern) => import_form2.Glob.isMatchOrParent(pattern, name)
-      );
-      effectKeys.forEach((effectKey) => {
-        const effectOptionsArr = this.effectMap[effectKey];
-        effectOptionsArr.forEach(({ effect: effect2, event }) => {
-          if (event === "onValueChange" /* onValueChange */ || event === "onValueInitOrChange" /* onValueInitOrChange */) {
-            const currentName = import_form2.Glob.getParentPathByPattern(effectKey, name);
-            const prevEffectReturn = this.effectReturnMap.get(event)?.[currentName];
-            if (prevEffectReturn) {
-              prevEffectReturn();
-            }
-            const effectReturn = effect2({
-              name: currentName,
-              value: (0, import_lodash2.get)(values, currentName),
-              prevValue: (0, import_lodash2.get)(prevValues, currentName),
-              formValues: values,
-              context: this.nodeContext
-            });
-            if (effectReturn && typeof effectReturn === "function" && this.effectReturnMap.has(event)) {
-              const eventMap = this.effectReturnMap.get(event);
-              eventMap[currentName] = effectReturn;
+    nativeFormModel.onFormValuesChange(({ values, prevValues, name, options }) => {
+      Object.keys(this.effectMap).forEach((pattern) => {
+        const paths = (0, import_lodash_es2.uniq)([
+          ...import_form2.Glob.findMatchPaths(values, pattern),
+          ...import_form2.Glob.findMatchPaths(prevValues, pattern)
+        ]).filter(
+          (path) => (
+            // trigger effect by compare if value changed
+            (0, import_lodash_es2.get)(values, path) !== (0, import_lodash_es2.get)(prevValues, path)
+          )
+        );
+        if (import_form2.Glob.isMatchOrParent(pattern, name)) {
+          const currentName = import_form2.Glob.getParentPathByPattern(pattern, name);
+          if (!paths.includes(currentName)) {
+            paths.push(currentName);
+          }
+        }
+        const effectOptionsArr = this.effectMap[pattern];
+        paths.forEach((path) => {
+          let eventList = ["onValueChange" /* onValueChange */, "onValueInitOrChange" /* onValueInitOrChange */];
+          const isPrevNil = (0, import_lodash_es2.isNil)((0, import_lodash_es2.get)(prevValues, path));
+          if (isPrevNil) {
+            if (options?.action === "array-append" && import_form2.Glob.isMatch(`${name}.*`, path)) {
+              eventList = [];
+            } else {
+              eventList = ["onValueInit" /* onValueInit */, "onValueInitOrChange" /* onValueInitOrChange */];
             }
           }
+          runAndDeleteEffectReturn(this.effectReturnMap, path, eventList);
+          effectOptionsArr.forEach(({ effect: effect2, event }) => {
+            if (eventList.includes(event)) {
+              const effectReturn = effect2({
+                name: path,
+                value: (0, import_lodash_es2.get)(values, path),
+                prevValue: (0, import_lodash_es2.get)(prevValues, path),
+                formValues: values,
+                form: (0, import_form2.toForm)(this.nativeFormModel),
+                context: this.nodeContext
+              });
+              if (effectReturn && typeof effectReturn === "function" && this.effectReturnMap.has(event)) {
+                const eventMap = this.effectReturnMap.get(event);
+                eventMap[path] = mergeEffectReturn(eventMap[path], effectReturn);
+              }
+            }
+          });
         });
       });
     });
@@ -283,24 +332,25 @@ var FormModelV2 = class extends import_form_core2.FormModel {
       Object.keys(this.effectMap).forEach((pattern) => {
         const paths = import_form2.Glob.findMatchPaths(values, pattern);
         const effectOptionsArr = this.effectMap[pattern];
-        effectOptionsArr.forEach(({ event, effect: effect2 }) => {
-          if (event === "onValueInit" /* onValueInit */ || event === "onValueInitOrChange" /* onValueInitOrChange */) {
-            paths.forEach((path) => {
-              if (import_form2.Glob.isMatchOrParent(name, path) || name === path) {
-                const prevEffectReturn = this.effectReturnMap.get(event)?.[path];
-                if (prevEffectReturn) {
-                  prevEffectReturn();
-                }
+        paths.forEach((path) => {
+          if (import_form2.Glob.isMatchOrParent(name, path) || name === path) {
+            runAndDeleteEffectReturn(this.effectReturnMap, path, [
+              "onValueInit" /* onValueInit */,
+              "onValueInitOrChange" /* onValueInitOrChange */
+            ]);
+            effectOptionsArr.forEach(({ event, effect: effect2 }) => {
+              if (event === "onValueInit" /* onValueInit */ || event === "onValueInitOrChange" /* onValueInitOrChange */) {
                 const effectReturn = effect2({
                   name: path,
-                  value: (0, import_lodash2.get)(values, path),
+                  value: (0, import_lodash_es2.get)(values, path),
                   formValues: values,
-                  prevValue: (0, import_lodash2.get)(prevValues, path),
+                  prevValue: (0, import_lodash_es2.get)(prevValues, path),
+                  form: (0, import_form2.toForm)(this.nativeFormModel),
                   context: this.nodeContext
                 });
                 if (effectReturn && typeof effectReturn === "function" && this.effectReturnMap.has(event)) {
                   const eventMap = this.effectReturnMap.get(event);
-                  eventMap[path] = effectReturn;
+                  eventMap[path] = mergeEffectReturn(eventMap[path], effectReturn);
                 }
               }
             });
@@ -311,13 +361,14 @@ var FormModelV2 = class extends import_form_core2.FormModel {
     nativeFormModel.onFieldModelCreate((field) => {
       const effectOptionsArr = findMatchedInMap(field, this.effectMap);
       if (effectOptionsArr?.length) {
-        const eventMap = (0, import_lodash2.groupBy)(effectOptionsArr, "event");
-        (0, import_lodash2.mapKeys)(eventMap, (optionsArr, event) => {
+        const eventMap = (0, import_lodash_es2.groupBy)(effectOptionsArr, "event");
+        (0, import_lodash_es2.mapKeys)(eventMap, (optionsArr, event) => {
           const combinedEffect = (props) => {
             optionsArr.forEach(
               ({ effect: effect2 }) => effect2({
                 ...props,
                 formValues: nativeFormModel.values,
+                form: (0, import_form2.toForm)(this.nativeFormModel),
                 context: this.nodeContext
               })
             );
@@ -353,13 +404,10 @@ var FormModelV2 = class extends import_form_core2.FormModel {
     return this.nativeFormModel?.values;
   }
   clearValid() {
-    if (this.valid !== null) {
-      this.valid = null;
-    }
   }
   async validate() {
     this.formFeedbacks = await this.nativeFormModel?.validate();
-    this.valid = (0, import_lodash2.isEmpty)(this.formFeedbacks?.filter((f) => f.level === "error"));
+    this.valid = (0, import_lodash_es2.isEmpty)(this.formFeedbacks?.filter((f) => f.level === "error"));
     this.onValidateEmitter.fire(this);
     return this.valid;
   }
@@ -389,16 +437,18 @@ var FormModelV2 = class extends import_form_core2.FormModel {
         `[NodeEngine] FormModel Error: onFormValueChangeIn can not be called before initialized`
       );
     }
-    this.formControl._formModel.onFormValuesChange(({ name: changedName, values, prevValues }) => {
-      if (changedName === name) {
-        callback({
-          value: (0, import_lodash2.get)(values, name),
-          prevValue: (0, import_lodash2.get)(prevValues, name),
-          formValues: values,
-          prevFormValues: prevValues
-        });
+    return this.formControl._formModel.onFormValuesChange(
+      ({ name: changedName, values, prevValues }) => {
+        if (changedName === name) {
+          callback({
+            value: (0, import_lodash_es2.get)(values, name),
+            prevValue: (0, import_lodash_es2.get)(prevValues, name),
+            formValues: values,
+            prevFormValues: prevValues
+          });
+        }
       }
-    });
+    );
   }
   /**
    * @deprecated 该方法用于兼容 V1 版本 FormModel接口，如果确定是FormModelV2 请使用 FormModel.getValueIn
@@ -455,13 +505,13 @@ var FormModelV2 = class extends import_form_core2.FormModel {
         effectReturn();
       });
     });
-    this.effectMap = DEFAULT.EFFECT_MAP;
-    this.effectReturnMap = DEFAULT.EFFECT_RETURN_MAP;
+    this.effectMap = DEFAULT.EFFECT_MAP();
+    this.effectReturnMap = DEFAULT.EFFECT_RETURN_MAP();
     this.plugins.forEach((p) => {
       p.dispose();
     });
     this.plugins = [];
-    this.formFeedbacks = DEFAULT.FORM_FEEDBACKS;
+    this.formFeedbacks = DEFAULT.FORM_FEEDBACKS();
     this._valid = DEFAULT.VALID;
     this._formControl = void 0;
     this._initialized = false;
@@ -537,9 +587,9 @@ function useWatchFormWarnings(node) {
 // src/form-plugin.ts
 var import_nanoid = require("nanoid");
 var FormPlugin = class {
-  constructor(name, config, opts) {
-    this.name = name;
-    this.pluginId = `${name}__${(0, import_nanoid.nanoid)()}`;
+  constructor(config, opts) {
+    this.name = config?.name || "";
+    this.pluginId = `${this.name}__${(0, import_nanoid.nanoid)()}`;
     this.config = config;
     this.opts = opts;
   }
@@ -549,10 +599,46 @@ var FormPlugin = class {
   get ctx() {
     return {
       formModel: this.formModel,
-      node: this.formModel.nodeContext.node,
-      playgroundContext: this.formModel.nodeContext.playgroundContext
+      ...this.formModel.nodeContext
     };
   }
+  setupFormMeta(formMeta, nodeContext) {
+    const nextFormMeta = {
+      ...formMeta
+    };
+    this.config.onSetupFormMeta?.(
+      {
+        mergeEffect: (effect) => {
+          nextFormMeta.effect = mergeEffectMap(nextFormMeta.effect || {}, effect);
+        },
+        mergeValidate: (validate) => {
+          nextFormMeta.validate = {
+            ...nextFormMeta.validate || {},
+            ...validate
+          };
+        },
+        addFormatOnInit: (formatOnInit) => {
+          if (!nextFormMeta.formatOnInit) {
+            nextFormMeta.formatOnInit = formatOnInit;
+            return;
+          }
+          const legacyFormatOnInit = nextFormMeta.formatOnInit;
+          nextFormMeta.formatOnInit = (v, c) => formatOnInit?.(legacyFormatOnInit(v, c), c);
+        },
+        addFormatOnSubmit: (formatOnSubmit) => {
+          if (!nextFormMeta.formatOnSubmit) {
+            nextFormMeta.formatOnSubmit = formatOnSubmit;
+            return;
+          }
+          const legacyFormatOnSubmit = nextFormMeta.formatOnSubmit;
+          nextFormMeta.formatOnSubmit = (v, c) => formatOnSubmit?.(legacyFormatOnSubmit(v, c), c);
+        },
+        ...nodeContext
+      },
+      this.opts
+    );
+    return nextFormMeta;
+  }
   init(formModel) {
     this._formModel = formModel;
     this.config?.onInit?.(this.ctx, this.opts);
@@ -563,9 +649,9 @@ var FormPlugin = class {
     }
   }
 };
-function defineFormPluginCreator(name, config) {
+function defineFormPluginCreator(config) {
   return function(opts) {
-    return new FormPlugin(name, config, opts);
+    return new FormPlugin(config, opts);
   };
 }
 
@@ -584,6 +670,9 @@ function getNodeForm(node) {
     state: nativeFormModel.state,
     getValueIn: (name) => nativeFormModel.getValueIn(name),
     setValueIn: (name, value) => nativeFormModel.setValueIn(name, value),
+    updateFormValues: (values) => {
+      formModel.updateFormValues(values);
+    },
     render: () => /* @__PURE__ */ import_react3.default.createElement(import_form_core5.NodeRender, { node }),
     onFormValuesChange: formModel.onFormValuesChange.bind(formModel),
     onFormValueChangeIn: formModel.onFormValueChangeIn.bind(formModel),