@plasmicpkgs/antd5 0.0.124 → 0.0.126

package/dist/index.js

@@ -140,12 +140,44 @@ class ErrorBoundary extends React__default.default.Component {
     return this.props.children;
   }
 }
-function get(obj, key, def, undef) {
-  key = key.split ? key.split(".") : key;
-  for (let p = 0; p < key.length; p++) {
-    obj = obj ? obj[key[p]] : undef;
+var hasOwnProp = Object.prototype.hasOwnProperty;
+function isSafeKey(key) {
+  return key !== "__proto__" && key !== "prototype" && key !== "constructor";
+}
+function get(obj, path) {
+  var keys = Array.isArray(path) ? path : path.split(".");
+  for (var i = 0; i < keys.length; i++) {
+    var key = keys[i];
+    if (!obj || !hasOwnProp.call(obj, key) || !isSafeKey(key)) {
+      obj = void 0;
+      break;
+    }
+    obj = obj[key];
+  }
+  return obj;
+}
+function set(obj, path, value) {
+  var keys = Array.isArray(path) ? path : path.split(".");
+  for (var i = 0; i < keys.length - 1; i++) {
+    var key = keys[i];
+    if (!isSafeKey(key))
+      return;
+    if (hasOwnProp.call(obj, key))
+      obj[key] = {};
+    obj = obj[key];
+  }
+  obj[keys[i]] = value;
+  return value;
+}
+function pick(obj, ...paths) {
+  if (Object.keys(obj).length === 0) {
+    return obj;
+  }
+  const res = {};
+  for (const path of paths) {
+    set(res, path, get(obj, path));
   }
-  return obj === undef ? def : obj;
+  return res;
 }
 
 var __defProp$o = Object.defineProperty;
@@ -2777,20 +2809,22 @@ const InternalFormInstanceContext = React__default.default.createContext(void 0)
 const FormLayoutContext = React__default.default.createContext(void 0);
 const Internal = React__default.default.forwardRef(
   (props, ref) => {
-    var _b, _c, _d, _e, _f;
+    var _b, _c, _d, _e;
     const [form] = antd.Form.useForm();
     const values = form.getFieldsValue(true);
     const lastValue = React__default.default.useRef(values);
     const _a = props, {
       extendedOnValuesChange,
       forceRemount,
-      setRegisteredFields,
-      registeredFields
+      formLayout,
+      internalFieldCtx,
+      setInternalFieldCtx
     } = _a, rest = __objRest$a(_a, [
       "extendedOnValuesChange",
       "forceRemount",
-      "setRegisteredFields",
-      "registeredFields"
+      "formLayout",
+      "internalFieldCtx",
+      "setInternalFieldCtx"
     ]);
     let childrenNode;
     if (props.mode !== "simplified") {
@@ -2833,16 +2867,6 @@ const Internal = React__default.default.forwardRef(
     React__default.default.useEffect(() => {
       fireOnValuesChange();
     }, []);
-    const formLayout = React__default.default.useMemo(
-      () => {
-        var _a2;
-        return {
-          layout: props.layout,
-          labelSpan: (_a2 = props.labelCol) == null ? void 0 : _a2.span
-        };
-      },
-      [props.layout, (_c = props.labelCol) == null ? void 0 : _c.span]
-    );
     React__default.default.useImperativeHandle(ref, () => ({
       formInstance: form,
       setFieldsValue: (newValues) => {
@@ -2871,12 +2895,28 @@ const Internal = React__default.default.forwardRef(
         extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(form.getFieldsValue(true));
       }
     }));
-    const registerField = React__default.default.useCallback((fieldEntity) => {
-      setRegisteredFields((f) => [...f, fieldEntity]);
-      return () => {
-        setRegisteredFields((f) => f.filter((ent) => ent !== fieldEntity));
-      };
-    }, []);
+    const registerField = React__default.default.useCallback(
+      (fieldEntity) => {
+        setInternalFieldCtx((ctx) => ({
+          registeredFields: [...ctx.registeredFields, fieldEntity],
+          preservedRegisteredFields: [
+            ...ctx.preservedRegisteredFields,
+            fieldEntity
+          ]
+        }));
+        return () => {
+          setInternalFieldCtx((ctx) => ({
+            registeredFields: ctx.registeredFields.filter(
+              (ent) => ent !== fieldEntity
+            ),
+            preservedRegisteredFields: ctx.preservedRegisteredFields.filter(
+              (ent) => ent !== fieldEntity || fieldEntity.preserve
+            )
+          }));
+        };
+      },
+      [setInternalFieldCtx]
+    );
     return /* @__PURE__ */ React__default.default.createElement(
       InternalFormInstanceContext.Provider,
       {
@@ -2885,8 +2925,8 @@ const Internal = React__default.default.forwardRef(
           fireOnValuesChange,
           forceRemount,
           registerField,
-          registeredFields,
-          initialValues: (_d = props.initialValues) != null ? _d : {}
+          internalFieldCtx,
+          initialValues: (_c = props.initialValues) != null ? _c : {}
         }
       },
       /* @__PURE__ */ React__default.default.createElement(FormLayoutContext.Provider, { value: formLayout }, /* @__PURE__ */ React__default.default.createElement(
@@ -2900,11 +2940,19 @@ const Internal = React__default.default.forwardRef(
           },
           onFinish: () => {
             var _a2;
-            (_a2 = props.onFinish) == null ? void 0 : _a2.call(props, form.getFieldsValue(true));
+            (_a2 = props.onFinish) == null ? void 0 : _a2.call(
+              props,
+              pick(
+                form.getFieldsValue(true),
+                ...internalFieldCtx.preservedRegisteredFields.map(
+                  (field) => field.fullPath
+                )
+              )
+            );
           },
           form,
-          labelCol: ((_e = props.labelCol) == null ? void 0 : _e.horizontalOnly) && props.layout !== "horizontal" ? void 0 : props.labelCol,
-          wrapperCol: ((_f = props.wrapperCol) == null ? void 0 : _f.horizontalOnly) && props.layout !== "horizontal" ? void 0 : props.wrapperCol
+          labelCol: ((_d = props.labelCol) == null ? void 0 : _d.horizontalOnly) && props.layout !== "horizontal" ? void 0 : props.labelCol,
+          wrapperCol: ((_e = props.wrapperCol) == null ? void 0 : _e.horizontalOnly) && props.layout !== "horizontal" ? void 0 : props.wrapperCol
         }),
         /* @__PURE__ */ React__default.default.createElement("style", null, `
           .ant-form-item-explain + div, .ant-form-item-margin-offset {
@@ -2916,17 +2964,16 @@ const Internal = React__default.default.forwardRef(
     );
   }
 );
-function useFormItemDefinitions(rawData, props, formRef, registeredFields) {
+function useFormItemDefinitions(rawData, props, formRef, commonFormCtxData) {
   const { mode, dataFormItems, setControlContextData } = props;
   const formInstance = formRef == null ? void 0 : formRef.formInstance;
   return React__default.default.useMemo(() => {
     const data = rawData && dataSources.normalizeData(rawData);
     const schema = data && (data == null ? void 0 : data.schema);
     if (mode !== "simplified" || !rawData || rawData.isLoading || rawData.error || !data || !schema || !data.data) {
-      setControlContextData == null ? void 0 : setControlContextData({
-        formInstance,
-        registeredFields
-      });
+      setControlContextData == null ? void 0 : setControlContextData(__spreadValues$d({
+        formInstance
+      }, commonFormCtxData));
       return void 0;
     }
     const row = data.data.length > 0 ? data.data[0] : void 0;
@@ -2948,15 +2995,21 @@ function useFormItemDefinitions(rawData, props, formRef, registeredFields) {
         });
       }
     );
-    setControlContextData == null ? void 0 : setControlContextData({
+    setControlContextData == null ? void 0 : setControlContextData(__spreadValues$d({
       schema: data.schema,
       minimalFullLengthFields,
       mergedFields,
-      formInstance,
-      registeredFields
-    });
+      formInstance
+    }, commonFormCtxData));
     return mergedFields;
-  }, [mode, setControlContextData, dataFormItems, rawData, formInstance]);
+  }, [
+    mode,
+    setControlContextData,
+    dataFormItems,
+    rawData,
+    formInstance,
+    commonFormCtxData
+  ]);
 }
 const useRawData = (props) => {
   const rawData = dataSources.usePlasmicDataOp(props.data);
@@ -2964,6 +3017,7 @@ const useRawData = (props) => {
 };
 const FormWrapper = React__default.default.forwardRef(
   (props, ref) => {
+    var _a;
     const [remountKey, setRemountKey] = React__default.default.useState(0);
     const forceRemount = React__default.default.useCallback(
       () => setRemountKey((k) => k + 1),
@@ -2976,17 +3030,37 @@ const FormWrapper = React__default.default.forwardRef(
         forceRemount();
       }
     }, [previousInitialValues, props.initialValues]);
-    const [registeredFields, setRegisteredFields] = React__default.default.useState([]);
+    const [internalFieldCtx, setInternalFieldCtx] = React__default.default.useState({
+      registeredFields: [],
+      preservedRegisteredFields: []
+    });
     React__default.default.useImperativeHandle(
       ref,
       () => wrapperRef.current ? __spreadValues$d({}, wrapperRef.current) : {}
     );
+    const formLayout = React__default.default.useMemo(
+      () => {
+        var _a2;
+        return {
+          layout: props.layout,
+          labelSpan: (_a2 = props.labelCol) == null ? void 0 : _a2.span
+        };
+      },
+      [props.layout, (_a = props.labelCol) == null ? void 0 : _a.span]
+    );
+    const commonFormCtxData = React__default.default.useMemo(
+      () => ({
+        layout: formLayout,
+        internalFieldCtx
+      }),
+      [formLayout, internalFieldCtx]
+    );
     const rawData = useRawData(props);
     const formItemDefinitions = useFormItemDefinitions(
       rawData,
       props,
       wrapperRef.current,
-      registeredFields
+      commonFormCtxData
     );
     React__default.default.useEffect(() => {
       if (rawData && !rawData.isLoading) {
@@ -2999,7 +3073,7 @@ const FormWrapper = React__default.default.forwardRef(
         forceRemount();
       }
     }, [props.data]);
-    const _a = props, { dataFormItems, formItems, data } = _a, rest = __objRest$a(_a, ["dataFormItems", "formItems", "data"]);
+    const _b = props, { dataFormItems, formItems, data } = _b, rest = __objRest$a(_b, ["dataFormItems", "formItems", "data"]);
     const actualFormItems = props.mode === "simplified" && formItemDefinitions ? formItemDefinitions : data ? dataFormItems : formItems;
     const previousFormItems = React__default.default.useRef([]);
     React__default.default.useEffect(() => {
@@ -3018,8 +3092,9 @@ const FormWrapper = React__default.default.forwardRef(
         key: remountKey
       }, rest), {
         forceRemount,
-        setRegisteredFields,
-        registeredFields,
+        formLayout,
+        internalFieldCtx,
+        setInternalFieldCtx,
         formItems: rawData && rawData.isLoading ? previousFormItems.current : actualFormItems,
         ref: wrapperRef,
         style: isSchemaForm && isLoadingData ? {
@@ -3492,7 +3567,7 @@ function useFormInstanceMaybe() {
   return antd.Form.useFormInstance();
 }
 function FormItemWrapper(props) {
-  var _b;
+  var _b, _c, _d;
   const _a = props, {
     rules: plasmicRules,
     description,
@@ -3516,6 +3591,7 @@ function FormItemWrapper(props) {
   const fullFormItemName = useFormItemFullName(name);
   const pathCtx = React__default.default.useContext(PathContext);
   const fieldEntity = React__default.default.useRef({
+    preserve: (_b = props.preserve) != null ? _b : true,
     fullPath: pathCtx.fullPath,
     name
   }).current;
@@ -3526,30 +3602,26 @@ function FormItemWrapper(props) {
   ) : void 0;
   const layoutContext = React__default.default.useContext(FormLayoutContext);
   const inCanvas = !!host.usePlasmicCanvasContext();
+  const {
+    fireOnValuesChange,
+    forceRemount,
+    registerField,
+    initialValues,
+    internalFieldCtx
+  } = (_c = React__default.default.useContext(InternalFormInstanceContext)) != null ? _c : {};
   if (inCanvas) {
     const form = useFormInstanceMaybe();
     const prevPropValues = React__default.default.useRef({
       initialValue: props.initialValue,
       name: props.name
     });
-    const fullPath = React__default.default.useContext(PathContext).fullPath;
-    const internalFormCtx = React__default.default.useContext(InternalFormInstanceContext);
-    const { fireOnValuesChange, forceRemount, registerField, initialValues } = internalFormCtx != null ? internalFormCtx : {};
-    (_b = props.setControlContextData) == null ? void 0 : _b.call(props, {
-      internalFormCtx,
+    (_d = props.setControlContextData) == null ? void 0 : _d.call(props, {
+      internalFieldCtx,
       formInstance: form,
-      parentFormItemPath: fullPath
+      parentFormItemPath: pathCtx.fullPath,
+      layout: layoutContext
     });
     React__default.default.useEffect(() => {
-      const unregister = registerField == null ? void 0 : registerField(fieldEntity);
-      return () => unregister == null ? void 0 : unregister();
-    }, []);
-    React__default.default.useEffect(() => {
-      fieldEntity.fullPath = [
-        ...pathCtx.fullPath,
-        ...props.name != null ? [props.name] : []
-      ];
-      fieldEntity.name = props.name;
       if (prevPropValues.current.name !== props.name) {
         forceRemount == null ? void 0 : forceRemount();
       }
@@ -3559,8 +3631,27 @@ function FormItemWrapper(props) {
       form == null ? void 0 : form.setFieldValue(fullFormItemName, props.initialValue);
       prevPropValues.current.initialValue = props.initialValue;
       fireOnValuesChange == null ? void 0 : fireOnValuesChange();
-    }, [form, props.initialValue, fullFormItemName]);
+    }, [
+      form,
+      props.initialValue,
+      pathCtx.fullPath,
+      props.name,
+      props.preserve
+    ]);
   }
+  React__default.default.useEffect(() => {
+    var _a2;
+    fieldEntity.fullPath = [
+      ...pathCtx.fullPath,
+      ...props.name != null ? [props.name] : []
+    ];
+    fieldEntity.name = props.name;
+    fieldEntity.preserve = (_a2 = props.preserve) != null ? _a2 : true;
+  }, [pathCtx.fullPath, props.name, props.preserve]);
+  React__default.default.useEffect(() => {
+    const unregister = registerField == null ? void 0 : registerField(fieldEntity);
+    return () => unregister == null ? void 0 : unregister();
+  }, []);
   return /* @__PURE__ */ React__default.default.createElement(
     FormItem,
     __spreadProps$9(__spreadValues$d({}, rest), {
@@ -3685,185 +3776,200 @@ const mapPlumeTypeToInputType = /* @__PURE__ */ new Map([
   ["checkbox", "Checkbox" /* Checkbox */],
   ["switch", "Checkbox" /* Checkbox */]
 ]);
-const commonFormItemProps = (usage) => ({
-  name: {
-    type: "string",
-    required: true,
-    validator: (value, _props, ctx) => {
-      var _a, _b, _c;
-      const currFullPath = [...(_a = ctx == null ? void 0 : ctx.parentFormItemPath) != null ? _a : [], value];
-      const nameCounter = ((_c = (_b = ctx == null ? void 0 : ctx.internalFormCtx) == null ? void 0 : _b.registeredFields) != null ? _c : []).filter(
-        (formItem) => arrayEq(formItem.fullPath, currFullPath)
-      ).length;
-      return nameCounter === 1 ? true : `Repeated form item name: ${currFullPath.join(" \u2192 ")}`;
+function commonFormItemProps(usage) {
+  const getFormItemProps = (ps, _ctx, { item }) => {
+    if (usage === "simplified-form-item") {
+      return item;
+    } else {
+      return ps;
+    }
+  };
+  return {
+    name: {
+      type: "string",
+      required: true,
+      validator: (value, _ps, ctx) => {
+        var _a, _b, _c;
+        let currFullPath = [];
+        if (usage === "simplified-form-item") {
+          currFullPath = [value];
+        } else {
+          const formItemCtx = ctx;
+          currFullPath = [...(_a = formItemCtx == null ? void 0 : formItemCtx.parentFormItemPath) != null ? _a : [], value];
+        }
+        const nameCounter = ((_c = (_b = ctx == null ? void 0 : ctx.internalFieldCtx) == null ? void 0 : _b.registeredFields) != null ? _c : []).filter((formItem) => arrayEq(formItem.fullPath, currFullPath)).length;
+        return nameCounter === 1 ? true : `Repeated form item name: ${currFullPath.join(" \u2192 ")}`;
+      },
+      defaultValueHint: getDefaultValueHint("name")
     },
-    defaultValueHint: getDefaultValueHint("name")
-  },
-  initialValue: {
-    type: "dynamic",
-    control: (ps, ctx, {
-      item,
-      path
-    }) => {
-      var _a, _b, _c, _d;
-      let inputType = "Unkown" /* Unknown */;
-      if (usage === "simplified-form-item") {
-        inputType = item.inputType;
-        if (!ps.data) {
+    initialValue: {
+      type: "dynamic",
+      control: (ps, ctx, {
+        item,
+        path
+      }) => {
+        var _a, _b, _c, _d;
+        let inputType = "Unkown" /* Unknown */;
+        if (usage === "simplified-form-item") {
           inputType = item.inputType;
-        } else if (path != null && typeof path[1] === "number") {
-          inputType = (_b = (_a = ctx == null ? void 0 : ctx.mergedFields) == null ? void 0 : _a[path[1]].inputType) != null ? _b : "Unkown" /* Unknown */;
-        }
-      } else {
-        if (!React__default.default.isValidElement(ps.children) || typeof ps.children.type === "string") {
-          inputType = "Unkown" /* Unknown */;
+          if (!ps.data) {
+            inputType = item.inputType;
+          } else if (path != null && typeof path[1] === "number") {
+            inputType = (_b = (_a = ctx == null ? void 0 : ctx.mergedFields) == null ? void 0 : _a[path[1]].inputType) != null ? _b : "Unkown" /* Unknown */;
+          }
         } else {
-          if (mapAntdComponentToInputType.has(ps.children.type)) {
-            inputType = (_c = mapAntdComponentToInputType.get(ps.children.type)) != null ? _c : "Unkown" /* Unknown */;
-          } else if ("__plumeType" in ps.children.type) {
-            inputType = (_d = mapPlumeTypeToInputType.get(
-              ps.children.type.__plumeType
-            )) != null ? _d : "Unkown" /* Unknown */;
+          if (!React__default.default.isValidElement(ps.children) || typeof ps.children.type === "string") {
+            inputType = "Unkown" /* Unknown */;
+          } else {
+            if (mapAntdComponentToInputType.has(ps.children.type)) {
+              inputType = (_c = mapAntdComponentToInputType.get(ps.children.type)) != null ? _c : "Unkown" /* Unknown */;
+            } else if ("__plumeType" in ps.children.type) {
+              inputType = (_d = mapPlumeTypeToInputType.get(
+                ps.children.type.__plumeType
+              )) != null ? _d : "Unkown" /* Unknown */;
+            }
           }
         }
+        if ([
+          "Text" /* Text */,
+          "Text Area" /* TextArea */,
+          "Password" /* Password */,
+          "Select" /* Select */,
+          "Radio Group" /* RadioGroup */
+        ].includes(inputType)) {
+          return {
+            type: "string",
+            defaultValueHint: getDefaultValueHint("initialValue")
+          };
+        } else if ("Number" /* Number */ === inputType) {
+          return {
+            type: "number",
+            defaultValueHint: getDefaultValueHint("initialValue")
+          };
+        } else if ("Checkbox" /* Checkbox */ === inputType) {
+          return {
+            type: "boolean",
+            defaultValueHint: getDefaultValueHint("initialValue")
+          };
+        } else if ("DatePicker" /* DatePicker */ === inputType) {
+          return {
+            type: "dateString",
+            defaultValueHint: getDefaultValueHint("initialValue")
+          };
+        } else {
+          return {
+            type: "exprEditor",
+            defaultValueHint: getDefaultValueHint("initialValue")
+          };
+        }
       }
-      if ([
-        "Text" /* Text */,
-        "Text Area" /* TextArea */,
-        "Password" /* Password */,
-        "Select" /* Select */,
-        "Radio Group" /* RadioGroup */
-      ].includes(inputType)) {
-        return {
-          type: "string",
-          defaultValueHint: getDefaultValueHint("initialValue")
-        };
-      } else if ("Number" /* Number */ === inputType) {
-        return {
-          type: "number",
-          defaultValueHint: getDefaultValueHint("initialValue")
-        };
-      } else if ("Checkbox" /* Checkbox */ === inputType) {
-        return {
-          type: "boolean",
-          defaultValueHint: getDefaultValueHint("initialValue")
-        };
-      } else if ("DatePicker" /* DatePicker */ === inputType) {
-        return {
-          type: "dateString",
-          defaultValueHint: getDefaultValueHint("initialValue")
-        };
-      } else {
-        return {
-          type: "exprEditor",
-          defaultValueHint: getDefaultValueHint("initialValue")
-        };
+    },
+    rules: {
+      displayName: "Validation rules",
+      type: "formValidationRules"
+    },
+    valuePropName: {
+      type: "string",
+      advanced: true,
+      defaultValueHint: "value",
+      description: "The prop name for specifying the value of the form control component"
+    },
+    trigger: {
+      type: "string",
+      displayName: "Trigger prop name",
+      advanced: true,
+      defaultValueHint: "onChange",
+      description: "The prop name of event handler that is called when value is changed"
+    },
+    noLabel: {
+      type: "boolean",
+      advanced: true
+    },
+    alignLabellessWithControls: {
+      type: "boolean",
+      displayName: "Align with controls?",
+      description: "Aligns the content with form controls in the grid",
+      hidden: (ps, ctx, extras) => {
+        var _a;
+        const formItem = getFormItemProps(ps, ctx, extras);
+        return !(formItem == null ? void 0 : formItem.noLabel) || ((_a = ctx == null ? void 0 : ctx.layout) == null ? void 0 : _a.layout) !== "horizontal";
+      },
+      defaultValueHint: true
+    },
+    colon: {
+      type: "boolean",
+      defaultValueHint: true,
+      advanced: true,
+      hidden: () => true
+    },
+    labelAlign: {
+      type: "choice",
+      options: ["left", "right"],
+      advanced: true,
+      hidden: (ps, ctx, extras) => {
+        var _a;
+        const formItem = getFormItemProps(ps, ctx, extras);
+        return !!(formItem == null ? void 0 : formItem.noLabel) || ((_a = ctx == null ? void 0 : ctx.layout) == null ? void 0 : _a.layout) !== "horizontal";
       }
-    }
-  },
-  rules: {
-    displayName: "Validation rules",
-    type: "formValidationRules"
-  },
-  valuePropName: {
-    type: "string",
-    advanced: true,
-    defaultValueHint: "value",
-    description: "The prop name for specifying the value of the form control component"
-  },
-  trigger: {
-    type: "string",
-    displayName: "Trigger prop name",
-    advanced: true,
-    defaultValueHint: "onChange",
-    description: "The prop name of event handler that is called when value is changed"
-  },
-  noLabel: {
-    type: "boolean",
-    advanced: true
-  },
-  alignLabellessWithControls: {
-    type: "boolean",
-    displayName: "Align with controls?",
-    description: "Aligns the content with form controls in the grid",
-    hidden: (ps, ctx) => {
-      var _a;
-      return !ps.noLabel || ((_a = ctx == null ? void 0 : ctx.internalFormCtx) == null ? void 0 : _a.layout.layout) !== "horizontal";
     },
-    defaultValueHint: true
-  },
-  colon: {
-    type: "boolean",
-    defaultValueHint: true,
-    advanced: true,
-    hidden: () => true
-  },
-  labelAlign: {
-    type: "choice",
-    options: ["left", "right"],
-    advanced: true,
-    hidden: (ps, ctx) => {
-      var _a;
-      return !!ps.noLabel || ((_a = ctx == null ? void 0 : ctx.internalFormCtx) == null ? void 0 : _a.layout.layout) !== "horizontal";
-    }
-  },
-  hidden: {
-    type: "boolean",
-    advanced: true,
-    defaultValueHint: getDefaultValueHint("hidden")
-  },
-  validateTrigger: {
-    type: "choice",
-    options: ["onSubmit", "onChange", "onBlur"],
-    multiSelect: true,
-    advanced: true
-  },
-  shouldUpdate: {
-    type: "boolean",
-    advanced: true,
-    displayName: "Always re-render",
-    description: "Form fields normally only re-render when the corresponding form value changes, for performance. This forces it to always re-render."
-  },
-  dependencies: {
-    type: "array",
-    advanced: true,
-    displayName: "Dependencies",
-    description: "Form fields can depend on other form fields. This forces it to re-evaluate the validation rules when the other form fields changes."
-  },
-  hideValidationMessage: {
-    type: "boolean",
-    displayName: "Hide validation message?",
-    description: "If true, will hide the validation error message",
-    defaultValueHint: false,
-    advanced: true
-  },
-  customizeProps: {
-    type: "function",
-    description: "Customize the props passed into the wrapped field component. Takes the current status ('success', 'warning', 'error', or 'validating').)",
-    argNames: ["fieldData"],
-    argValues: (_ps, ctx) => {
-      var _a;
-      return [
-        {
-          status: (_a = ctx == null ? void 0 : ctx.status) == null ? void 0 : _a.status
-        }
-      ];
+    hidden: {
+      type: "boolean",
+      advanced: true,
+      defaultValueHint: getDefaultValueHint("hidden")
     },
-    advanced: true
-  },
-  noStyle: {
-    type: "boolean",
-    displayName: "Field control only",
-    description: "Don't render anything but the field control - so no label, help text, validation error, etc.",
-    advanced: true
-  },
-  preserve: {
-    type: "boolean",
-    advanced: true,
-    defaultValueHint: true,
-    description: "Keep field value even when field removed."
-  }
-});
+    validateTrigger: {
+      type: "choice",
+      options: ["onSubmit", "onChange", "onBlur"],
+      multiSelect: true,
+      advanced: true
+    },
+    shouldUpdate: {
+      type: "boolean",
+      advanced: true,
+      displayName: "Always re-render",
+      description: "Form fields normally only re-render when the corresponding form value changes, for performance. This forces it to always re-render."
+    },
+    dependencies: {
+      type: "array",
+      advanced: true,
+      displayName: "Dependencies",
+      description: "Form fields can depend on other form fields. This forces it to re-evaluate the validation rules when the other form fields changes."
+    },
+    hideValidationMessage: {
+      type: "boolean",
+      displayName: "Hide validation message?",
+      description: "If true, will hide the validation error message",
+      defaultValueHint: false,
+      advanced: true
+    },
+    customizeProps: {
+      type: "function",
+      description: "Customize the props passed into the wrapped field component. Takes the current status ('success', 'warning', 'error', or 'validating').)",
+      argNames: ["fieldData"],
+      argValues: (_ps, ctx) => {
+        var _a;
+        return [
+          {
+            status: (_a = ctx == null ? void 0 : ctx.status) == null ? void 0 : _a.status
+          }
+        ];
+      },
+      advanced: true
+    },
+    noStyle: {
+      type: "boolean",
+      displayName: "Field control only",
+      description: "Don't render anything but the field control - so no label, help text, validation error, etc.",
+      advanced: true
+    },
+    preserve: {
+      type: "boolean",
+      advanced: true,
+      defaultValueHint: true,
+      description: "Keep field value even when field removed."
+    }
+  };
+}
 const commonSimplifiedFormArrayItemType = (propName) => ({
   type: "object",
   fields: __spreadValues$d({