@plasmicpkgs/antd5 0.0.83 → 0.0.85

package/dist/index.d.ts

@@ -2,7 +2,8 @@ import { InputType } from "./registerForm";
 import { Registerable } from "./utils";
 export declare function registerAll(loader?: Registerable): void;
 export { buttonComponentName } from "./registerButton";
-export { formComponentName, formGroupComponentName, formItemComponentName, formListComponentName, InputType, } from "./registerForm";
+export { FormType, formTypeDescription, formComponentName, formGroupComponentName, formItemComponentName, formListComponentName, InputType, } from "./registerForm";
+export { registerForm, registerFormGroup, registerFormItem, } from "./registerForm";
 export type { SimplifiedFormItemsProp } from "./registerForm";
 export declare const componentNameToInputType: {
     "plasmic-antd5-input": InputType;

package/dist/index.js

@@ -10,6 +10,7 @@ var query = require('@plasmicapp/query');
 var enUS = require('antd/lib/locale/en_US.js');
 var equal = require('fast-deep-equal');
 var classNames = require('classnames');
+var dataSources = require('@plasmicapp/data-sources');
 var dayjs = require('dayjs');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -81,6 +82,16 @@ function capitalize(value) {
 function ensureArray(x) {
   return Array.isArray(x) ? x : [x];
 }
+function setFieldsToUndefined(obj) {
+  if (typeof obj === "object" && obj !== null) {
+    for (const key in obj) {
+      if (typeof obj[key] === "object") {
+        setFieldsToUndefined(obj[key]);
+      }
+      obj[key] = void 0;
+    }
+  }
+}
 
 var __defProp$e = Object.defineProperty;
 var __defProps$b = Object.defineProperties;
@@ -2412,96 +2423,196 @@ var InputType = /* @__PURE__ */ ((InputType2) => {
   InputType2["DatePicker"] = "DatePicker";
   return InputType2;
 })(InputType || {});
+var FormType = /* @__PURE__ */ ((FormType2) => {
+  FormType2[FormType2["NewEntry"] = 0] = "NewEntry";
+  FormType2[FormType2["UpdateEntry"] = 1] = "UpdateEntry";
+  return FormType2;
+})(FormType || {});
 const PathContext = React__default.default.createContext({ relativePath: [], fullPath: [] });
 const InternalFormInstanceContext = React__default.default.createContext(void 0);
 const FormLayoutContext = React__default.default.createContext(void 0);
-const Internal = (props) => {
-  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, setRemountKey } = _a, rest = __objRest$3(_a, ["extendedOnValuesChange", "setRemountKey"]);
-  let childrenNode;
-  if (props.mode !== "simplified") {
-    childrenNode = typeof props.children === "function" ? props.children(values, form) : props.children;
-  } else {
-    childrenNode = /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, ((_b = props.formItems) != null ? _b : []).map((formItem) => /* @__PURE__ */ React__default.default.createElement(
-      FormItemWrapper,
-      __spreadProps$3(__spreadValues$4({}, formItem), {
-        noLabel: formItem.inputType === "Checkbox" /* Checkbox */ || formItem.noLabel,
-        style: { width: "100%" }
-      }),
-      formItem.inputType === "Text" /* Text */ ? /* @__PURE__ */ React__default.default.createElement(antd.Input, null) : formItem.inputType === "Password" /* Password */ ? /* @__PURE__ */ React__default.default.createElement(antd.Input.Password, null) : formItem.inputType === "Text Area" /* TextArea */ ? /* @__PURE__ */ React__default.default.createElement(antd.Input.TextArea, null) : formItem.inputType === "Number" /* Number */ ? /* @__PURE__ */ React__default.default.createElement(antd.InputNumber, null) : formItem.inputType === "Checkbox" /* Checkbox */ ? /* @__PURE__ */ React__default.default.createElement(antd.Checkbox, null, formItem.label) : formItem.inputType === "Select" /* Select */ ? /* @__PURE__ */ React__default.default.createElement(antd.Select, { options: formItem.options }) : formItem.inputType === "DatePicker" /* DatePicker */ ? /* @__PURE__ */ React__default.default.createElement(antd.DatePicker, null) : formItem.inputType === "Radio Group" /* RadioGroup */ ? /* @__PURE__ */ React__default.default.createElement(
-        antd.Radio.Group,
-        {
-          options: formItem.options,
-          optionType: formItem.optionType,
-          style: { padding: "8px" }
-        }
-      ) : null
-    )), props.submitSlot);
-  }
-  const fireOnValuesChange = React__default.default.useCallback(() => {
-    const values2 = form.getFieldsValue(true);
-    if (!equal__default.default(values2, lastValue.current)) {
-      extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(values2);
-      lastValue.current = values2;
+const Internal = React__default.default.forwardRef(
+  (props, ref) => {
+    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, setRemountKey } = _a, rest = __objRest$3(_a, ["extendedOnValuesChange", "setRemountKey"]);
+    let childrenNode;
+    if (props.mode === "advanced") {
+      childrenNode = typeof props.children === "function" ? props.children(values, form) : props.children;
+    } else {
+      childrenNode = /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, ((_b = props.formItems) != null ? _b : []).map((formItem) => /* @__PURE__ */ React__default.default.createElement(
+        FormItemWrapper,
+        __spreadProps$3(__spreadValues$4({}, formItem), {
+          noLabel: formItem.inputType === "Checkbox" /* Checkbox */ || formItem.noLabel,
+          style: { width: "100%" }
+        }),
+        formItem.inputType === "Text" /* Text */ ? /* @__PURE__ */ React__default.default.createElement(antd.Input, null) : formItem.inputType === "Password" /* Password */ ? /* @__PURE__ */ React__default.default.createElement(antd.Input.Password, null) : formItem.inputType === "Text Area" /* TextArea */ ? /* @__PURE__ */ React__default.default.createElement(antd.Input.TextArea, null) : formItem.inputType === "Number" /* Number */ ? /* @__PURE__ */ React__default.default.createElement(antd.InputNumber, null) : formItem.inputType === "Checkbox" /* Checkbox */ ? /* @__PURE__ */ React__default.default.createElement(antd.Checkbox, null, formItem.label) : formItem.inputType === "Select" /* Select */ ? /* @__PURE__ */ React__default.default.createElement(antd.Select, { options: formItem.options }) : formItem.inputType === "DatePicker" /* DatePicker */ ? /* @__PURE__ */ React__default.default.createElement(antd.DatePicker, null) : formItem.inputType === "Radio Group" /* RadioGroup */ ? /* @__PURE__ */ React__default.default.createElement(
+          antd.Radio.Group,
+          {
+            options: formItem.options,
+            optionType: formItem.optionType,
+            style: { padding: "8px" }
+          }
+        ) : null
+      )), props.submitSlot);
     }
-  }, [form, lastValue]);
-  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]
-  );
-  return /* @__PURE__ */ React__default.default.createElement(
-    InternalFormInstanceContext.Provider,
-    {
-      value: {
-        layout: formLayout,
-        fireOnValuesChange,
-        forceRemount: () => setRemountKey((k) => k + 1)
+    const fireOnValuesChange = React__default.default.useCallback(() => {
+      const values2 = form.getFieldsValue(true);
+      if (!equal__default.default(values2, lastValue.current)) {
+        extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(values2);
+        lastValue.current = values2;
       }
-    },
-    /* @__PURE__ */ React__default.default.createElement(FormLayoutContext.Provider, { value: formLayout }, /* @__PURE__ */ React__default.default.createElement(
-      antd.Form,
-      __spreadProps$3(__spreadValues$4({}, rest), {
-        key: props.initialValues ? JSON.stringify(props.initialValues) : void 0,
-        onValuesChange: (...args) => {
-          var _a2;
-          (_a2 = props.onValuesChange) == null ? void 0 : _a2.call(props, ...args);
-          extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(args[1]);
-        },
-        form,
-        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, `
+    }, [form, lastValue]);
+    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) => {
+        form.setFieldsValue(newValues);
+        extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(form.getFieldsValue(true));
+      },
+      setFieldValue: (namePath, value) => {
+        form.setFieldValue(namePath, value);
+        extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(form.getFieldsValue(true));
+      },
+      resetFields: () => {
+        form.resetFields();
+        extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(form.getFieldsValue(true));
+      },
+      clearFields: () => {
+        const values2 = form.getFieldsValue(true);
+        setFieldsToUndefined(values2);
+        form.setFieldsValue(values2);
+        extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(form.getFieldsValue(true));
+      }
+    }));
+    return /* @__PURE__ */ React__default.default.createElement(
+      InternalFormInstanceContext.Provider,
+      {
+        value: {
+          layout: formLayout,
+          fireOnValuesChange,
+          forceRemount: () => setRemountKey((k) => k + 1)
+        }
+      },
+      /* @__PURE__ */ React__default.default.createElement(FormLayoutContext.Provider, { value: formLayout }, /* @__PURE__ */ React__default.default.createElement(
+        antd.Form,
+        __spreadProps$3(__spreadValues$4({}, rest), {
+          key: props.initialValues ? JSON.stringify(props.initialValues) : void 0,
+          onValuesChange: (...args) => {
+            var _a2;
+            (_a2 = props.onValuesChange) == null ? void 0 : _a2.call(props, ...args);
+            extendedOnValuesChange == null ? void 0 : extendedOnValuesChange(args[1]);
+          },
+          form,
+          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 {
             display: none;
           }
           `),
-      childrenNode
-    ))
-  );
-};
-function FormWrapper(props) {
-  const [remountKey, setRemountKey] = React__default.default.useState(0);
-  const previousInitialValues = usePrevious(props.initialValues);
-  React__default.default.useEffect(() => {
-    if (previousInitialValues !== props.initialValues && JSON.stringify(previousInitialValues) !== JSON.stringify(props.initialValues)) {
-      setRemountKey((k) => k + 1);
+        childrenNode
+      ))
+    );
+  }
+);
+function useFormItemDefinitions(rawData, props, formRef) {
+  const { mode, formItems, setControlContextData } = props;
+  return React__default.default.useMemo(() => {
+    if (mode !== "simplified" || !formRef || !rawData || rawData.error) {
+      return void 0;
+    }
+    const data = dataSources.normalizeData(rawData);
+    const schema = data == null ? void 0 : data.schema;
+    if (!data || !schema || !data.data) {
+      return void 0;
     }
-  }, [previousInitialValues, props.initialValues]);
-  return /* @__PURE__ */ React__default.default.createElement(Internal, __spreadProps$3(__spreadValues$4({ key: remountKey }, props), { setRemountKey }));
+    const row = data.data.length > 0 ? data.data[0] : void 0;
+    const { mergedFields, minimalFullLengthFields } = dataSources.deriveFieldConfigs(
+      formItems != null ? formItems : [],
+      schema,
+      (field) => __spreadValues$4({
+        inputType: "Text" /* Text */
+      }, field && {
+        key: field.id,
+        fieldId: field.id,
+        label: field.label,
+        name: field.id,
+        inputType: field.type === "string" ? "Text" /* Text */ : field.type === "number" ? "Number" /* Number */ : field.type === "boolean" ? "Checkbox" /* Checkbox */ : "Text" /* Text */,
+        //missing date and date-time
+        initialValue: row ? row[field.id] : void 0,
+        hidden: field.primaryKey
+      })
+    );
+    setControlContextData == null ? void 0 : setControlContextData({
+      schema: data.schema,
+      minimalFullLengthFields,
+      mergedFields,
+      formInstance: formRef.formInstance
+    });
+    return mergedFields;
+  }, [mode, setControlContextData, formItems, rawData, formRef]);
 }
+const useRawData = (connection) => {
+  const rawDataSchema = dataSources.usePlasmicDataOp(connection == null ? void 0 : connection.dataSchema);
+  const rawDataEntry = dataSources.usePlasmicDataOp(connection == null ? void 0 : connection.dataEntry);
+  if (!connection) {
+    return void 0;
+  }
+  return 0 /* NewEntry */ === connection.formType ? rawDataSchema : rawDataEntry;
+};
+const FormWrapper = React__default.default.forwardRef(
+  (props, ref) => {
+    const [remountKey, setRemountKey] = React__default.default.useState(0);
+    const previousInitialValues = usePrevious(props.initialValues);
+    const wrapperRef = React__default.default.useRef(null);
+    React__default.default.useEffect(() => {
+      if (previousInitialValues !== props.initialValues && JSON.stringify(previousInitialValues) !== JSON.stringify(props.initialValues)) {
+        setRemountKey((k) => k + 1);
+      }
+    }, [previousInitialValues, props.initialValues]);
+    React__default.default.useImperativeHandle(
+      ref,
+      () => wrapperRef.current ? __spreadValues$4({}, wrapperRef.current) : {}
+    );
+    const rawData = useRawData(props.data);
+    const formItemDefinitions = useFormItemDefinitions(
+      rawData,
+      props,
+      wrapperRef.current
+    );
+    const _a = props, { formItems } = _a, rest = __objRest$3(_a, ["formItems"]);
+    const actualFormItems = props.mode === "simplified" && formItemDefinitions ? formItemDefinitions : formItems;
+    if (props.mode === "simplified" && rawData && "error" in rawData) {
+      return /* @__PURE__ */ React__default.default.createElement("div", null, "Error when fetching data: ", rawData.error.message);
+    }
+    return /* @__PURE__ */ React__default.default.createElement(
+      Internal,
+      __spreadProps$3(__spreadValues$4({
+        key: remountKey
+      }, rest), {
+        setRemountKey,
+        formItems: actualFormItems,
+        ref: wrapperRef
+      })
+    );
+  }
+);
 const COMMON_ACTIONS = [
   {
     type: "button-action",
@@ -2515,7 +2626,7 @@ const COMMON_ACTIONS = [
         "children"
       );
     },
-    hidden: (props) => props.mode === "simplified"
+    hidden: (props) => props.mode !== "advanced"
   }
   // {
   //   type: "button-action" as const,
@@ -2572,7 +2683,71 @@ const colProp = (displayName, defaultValue, description) => ({
   description,
   defaultValue
 });
+const formHelpers = {
+  states: {
+    value: {
+      onMutate: (value, $ref) => {
+        var _a;
+        (_a = $ref == null ? void 0 : $ref.formInstance) == null ? void 0 : _a.setFieldsValue(value);
+      }
+    }
+  }
+};
 const formComponentName = "plasmic-antd5-form";
+const formTypeDescription = `
+  You can create form with two different behaviors:
+  
+
+
+  1. Create a new entry: The form will be created empty and it will create a new row when submitted.
+  2. Update an entry: The form will be pre-filled with the row values and it will update the table entry when submitted.
+  
+
+
+  For both options, you can customize later.
+`;
+const getConnectionDBPropRegistration = () => ({
+  formType: {
+    type: "choice",
+    options: [
+      { label: "New entry", value: 0 /* NewEntry */ },
+      { label: "Update entry", value: 1 /* UpdateEntry */ }
+    ],
+    displayName: "Form Type",
+    disableDynamicValue: true,
+    defaultValueHint: "Select the form type...",
+    description: `
+    You can create form with two different behaviors:
+    
+
+
+    1. Create a new entry: The form will be created empty and it will create a new row when submitted.
+    2. Update an entry: The form will be pre-filled with the row values and it will update the table entry when submitted.
+    
+
+
+    For both options, you can customize later.
+    `
+  },
+  dataSchema: {
+    type: "dataSourceOp",
+    description: "The data to generate the form",
+    hidden: (_ps, _ctx, { item }) => item.formType !== 0 /* NewEntry */,
+    displayName: "",
+    disableDynamicValue: true,
+    allowedOps: () => ["getTableSchema"],
+    hideCacheKey: true
+  },
+  dataEntry: {
+    type: "dataSourceOp",
+    description: "The data to generate the form",
+    hidden: (_ps, _ctx, { item }) => item.formType !== 1 /* UpdateEntry */,
+    displayName: "",
+    disableDynamicValue: true,
+    allowedOps: () => ["getOne"],
+    hideCacheKey: true
+  }
+});
 function registerForm(loader) {
   registerComponentHelper(loader, FormWrapper, {
     name: formComponentName,
@@ -2586,13 +2761,22 @@ function registerForm(loader) {
         type: "controlMode",
         defaultValue: "simplified"
       },
+      data: {
+        type: "object",
+        fields: getConnectionDBPropRegistration(),
+        hidden: (ps) => ps.mode !== "simplified" || !ps.data,
+        nameFunc: () => "DB Connection"
+      },
       formItems: {
         displayName: "Fields",
         type: "array",
         itemType: {
           type: "object",
           fields: __spreadValues$4({
-            label: "string",
+            label: {
+              type: "string",
+              defaultValueHint: getDefaultValueHint("label")
+            },
             inputType: {
               type: "choice",
               options: Object.values(InputType).filter(
@@ -2602,7 +2786,8 @@ function registerForm(loader) {
                   "Radio" /* Radio */
                 ].includes(inputType)
               ),
-              defaultValue: "Text" /* Text */
+              defaultValue: "Text" /* Text */,
+              defaultValueHint: getDefaultValueHint("inputType")
             },
             options: {
               type: "array",
@@ -2671,7 +2856,10 @@ function registerForm(loader) {
               displayName: "Option Type"
             }
           }, commonFormItemProps),
-          nameFunc: (item) => item.label
+          nameFunc: (item) => {
+            var _a, _b;
+            return (_b = (_a = item.fieldId) != null ? _a : item.label) != null ? _b : item.name;
+          }
         },
         defaultValue: [
           {
@@ -2685,7 +2873,31 @@ function registerForm(loader) {
             inputType: "Text Area" /* TextArea */
           }
         ],
-        hidden: (props) => props.mode !== "simplified"
+        hidden: (ps) => {
+          if (ps.mode === "advanced") {
+            return true;
+          }
+          if (ps.mode === "simplified") {
+            return false;
+          }
+          return !ps.data || !ps.formType;
+        },
+        unstable__keyFunc: (x) => x.key,
+        unstable__minimalValue: (ps, contextData) => {
+          return ps.mode === "simplified" ? ps.formItems : contextData == null ? void 0 : contextData.minimalFullLengthFields;
+        },
+        unstable__canDelete: (item, ps, ctx) => {
+          if (ps.mode !== "database-schema-driven") {
+            return true;
+          }
+          if (!(ctx == null ? void 0 : ctx.schema)) {
+            return false;
+          }
+          if (item.fieldId && ctx.schema.fields.some((f) => f.id === item.fieldId)) {
+            return false;
+          }
+          return true;
+        }
       },
       submitSlot: __spreadValues$4({
         type: "slot",
@@ -2708,7 +2920,7 @@ function registerForm(loader) {
       }),
       children: {
         type: "slot",
-        hidden: (props) => props.mode === "simplified"
+        hidden: (props) => props.mode !== "advanced"
       },
       initialValues: {
         displayName: "Initial field values",
@@ -2821,7 +3033,13 @@ function registerForm(loader) {
         advanced: true
       }
     },
-    actions: COMMON_ACTIONS,
+    actions: [
+      ...COMMON_ACTIONS,
+      {
+        type: "form-schema",
+        hidden: (ps) => ps.mode !== "simplified" || !!ps.data
+      }
+    ],
     states: {
       value: {
         type: "readonly",
@@ -2829,6 +3047,54 @@ function registerForm(loader) {
         onChangeProp: "extendedOnValuesChange"
       }
     },
+    componentHelpers: {
+      helpers: formHelpers,
+      importName: "formHelpers",
+      importPath: "@plasmicpkgs/antd5/skinny/registerForm"
+    },
+    refActions: {
+      setFieldsValue: {
+        displayName: "Set multiple fields",
+        argTypes: [
+          {
+            name: "newValues",
+            displayName: "New Values",
+            type: "exprEditor"
+          }
+        ]
+      },
+      setFieldValue: {
+        displayName: "Set field",
+        argTypes: [
+          {
+            name: "namePath",
+            displayName: "Name Path",
+            type: {
+              type: "dataSelector",
+              data: (_, ctx) => {
+                if (!(ctx == null ? void 0 : ctx.formInstance)) {
+                  return {};
+                }
+                return ctx.formInstance.getFieldsValue(true);
+              }
+            }
+          },
+          {
+            name: "value",
+            displayName: "New Value",
+            type: "exprEditor"
+          }
+        ]
+      },
+      resetFields: {
+        displayName: "Reset fields to initial value",
+        argTypes: []
+      },
+      clearFields: {
+        displayName: "Clear fields",
+        argTypes: []
+      }
+    },
     importPath: "@plasmicpkgs/antd5/skinny/registerForm",
     importName: "FormWrapper"
   });
@@ -2935,10 +3201,13 @@ function FormItemWrapper(props) {
       initialValue: props.initialValue,
       name: props.name
     });
+    const fullPath = React__default.default.useContext(PathContext).fullPath;
     const internalFormCtx = React__default.default.useContext(InternalFormInstanceContext);
     const { fireOnValuesChange, forceRemount } = internalFormCtx != null ? internalFormCtx : {};
     (_b = props.setControlContextData) == null ? void 0 : _b.call(props, {
-      internalFormCtx
+      internalFormCtx,
+      formInstance: form,
+      parentFormItemPath: fullPath
     });
     React__default.default.useEffect(() => {
       if (prevPropValues.current.name !== props.name) {
@@ -2968,15 +3237,16 @@ function FormItemWrapper(props) {
   );
 }
 function deriveValuePropName(props) {
+  var _a;
   if (props.valuePropName) {
     return props.valuePropName;
   }
-  const valueProps = React__default.default.Children.map(props.children, (child) => {
-    var _a;
+  const valueProps = ((_a = React__default.default.Children.map(props.children, (child) => {
+    var _a2;
     if (React__default.default.isValidElement(child)) {
       const childType = child.type;
       if (childType) {
-        const x = (_a = childType.__plasmicFormFieldMeta) == null ? void 0 : _a.valueProp;
+        const x = (_a2 = childType.__plasmicFormFieldMeta) == null ? void 0 : _a2.valueProp;
         if (x) {
           return x;
         }
@@ -2987,7 +3257,7 @@ function deriveValuePropName(props) {
       }
     }
     return void 0;
-  }).filter((x) => !!x);
+  })) != null ? _a : []).filter((x) => !!x);
   if (valueProps.length > 0) {
     return valueProps[0];
   }
@@ -3019,12 +3289,29 @@ function FormItemForwarder(_a) {
     return i === 0 && React.isValidElement(child) ? React.cloneElement(child, newProps) : child;
   });
 }
+function getDefaultValueHint(field) {
+  return (_props, contextData, { item }) => {
+    if (!contextData || !("mergedFields" in contextData)) {
+      return void 0;
+    }
+    if (item == null ? void 0 : item.fieldId) {
+      const fieldSetting = contextData.mergedFields.find(
+        (f) => f.fieldId === item.fieldId
+      );
+      return fieldSetting == null ? void 0 : fieldSetting[field];
+    }
+    return void 0;
+  };
+}
 const commonFormItemProps = {
   name: {
-    type: "string"
+    type: "string",
+    required: true,
+    defaultValueHint: getDefaultValueHint("name")
   },
   initialValue: {
-    type: "string"
+    type: "string",
+    defaultValueHint: getDefaultValueHint("initialValue")
   },
   rules: {
     displayName: "Validation rules",
@@ -3067,7 +3354,8 @@ const commonFormItemProps = {
   },
   hidden: {
     type: "boolean",
-    advanced: true
+    advanced: true,
+    defaultValueHint: getDefaultValueHint("hidden")
   },
   validateTrigger: {
     type: "choice",
@@ -4225,6 +4513,7 @@ const inputTypeToComponentName = Object.fromEntries(
   Object.entries(componentNameToInputType).map((kv) => kv.reverse())
 );
 
+exports.FormType = FormType;
 exports.InputType = InputType;
 exports.buttonComponentName = buttonComponentName;
 exports.componentNameToInputType = componentNameToInputType;
@@ -4232,7 +4521,11 @@ exports.formComponentName = formComponentName;
 exports.formGroupComponentName = formGroupComponentName;
 exports.formItemComponentName = formItemComponentName;
 exports.formListComponentName = formListComponentName;
+exports.formTypeDescription = formTypeDescription;
 exports.inputTypeToComponentName = inputTypeToComponentName;
 exports.registerAll = registerAll;
+exports.registerForm = registerForm;
+exports.registerFormGroup = registerFormGroup;
+exports.registerFormItem = registerFormItem;
 exports.useFormInstanceMaybe = useFormInstanceMaybe;
 //# sourceMappingURL=index.js.map