@connect-soft/form-generator 1.1.0-alpha2 → 1.1.0-alpha4

package/dist/index.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var compilerRuntime = require('react/compiler-runtime');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var n$1 = require('zod/v4/core');
+var compilerRuntime = require('react/compiler-runtime');
 var zod = require('zod');
 
 function _interopNamespaceDefault(e) {
@@ -3130,6 +3130,105 @@ function clearAllRegistries() {
   clearLayoutRegistry();
 }
 
+const RESERVED_PROPS = new Set(['all', 'remaining', 'names', 'has', 'render']);
+function createTemplateFields(fieldEntries) {
+  const accessedFields = new Set();
+  const handler = {
+    get(_, prop) {
+      if (typeof prop === 'symbol') {
+        return undefined;
+      }
+      if (prop === 'all') {
+        return Array.from(fieldEntries.values()).map(entry => entry.element);
+      }
+      if (prop === 'remaining') {
+        return Array.from(fieldEntries.entries()).filter(([name]) => !accessedFields.has(name)).map(([, entry]) => entry.element);
+      }
+      if (prop === 'names') {
+        return Array.from(fieldEntries.keys());
+      }
+      if (prop === 'has') {
+        return name => fieldEntries.has(name);
+      }
+      if (prop === 'render') {
+        return (...names) => {
+          return names.filter(name => fieldEntries.has(name)).map(name => {
+            accessedFields.add(name);
+            return fieldEntries.get(name).element;
+          });
+        };
+      }
+      if (fieldEntries.has(prop)) {
+        accessedFields.add(prop);
+        return fieldEntries.get(prop).element;
+      }
+      return undefined;
+    },
+    has(_, prop) {
+      if (typeof prop === 'symbol') {
+        return false;
+      }
+      return RESERVED_PROPS.has(prop) || fieldEntries.has(prop);
+    },
+    ownKeys() {
+      return [...RESERVED_PROPS, ...fieldEntries.keys()];
+    },
+    getOwnPropertyDescriptor(_, prop) {
+      if (typeof prop === 'symbol') {
+        return undefined;
+      }
+      if (RESERVED_PROPS.has(prop) || fieldEntries.has(prop)) {
+        return {
+          configurable: true,
+          enumerable: true,
+          value: this.get(_, prop, {})
+        };
+      }
+      return undefined;
+    }
+  };
+  return new Proxy({}, handler);
+}
+function createTemplateLayouts(layoutEntries) {
+  const handler = {
+    get(_, prop) {
+      if (typeof prop === 'symbol') {
+        return undefined;
+      }
+      if (prop === 'all') {
+        return Array.from(layoutEntries.values()).map(entry => entry.element);
+      }
+      if (layoutEntries.has(prop)) {
+        return layoutEntries.get(prop).element;
+      }
+      return undefined;
+    },
+    has(_, prop) {
+      if (typeof prop === 'symbol') {
+        return false;
+      }
+      return prop === 'all' || layoutEntries.has(prop);
+    },
+    ownKeys() {
+      return ['all', ...layoutEntries.keys()];
+    },
+    getOwnPropertyDescriptor(_, prop) {
+      if (typeof prop === 'symbol') {
+        return undefined;
+      }
+      if (prop === 'all' || layoutEntries.has(prop)) {
+        return {
+          configurable: true,
+          enumerable: true,
+          value: this.get(_, prop, {})
+        };
+      }
+      return undefined;
+    }
+  };
+  return new Proxy({}, handler);
+}
+
 const FieldRenderer = /*#__PURE__*/React.memo(t0 => {
   const $ = compilerRuntime.c(5);
   const {
@@ -3375,8 +3474,9 @@ const defaultValidators = {
   tel: stringValidator,
   number: field => {
     let schema = zod.z.coerce.number();
-    if (field.min !== undefined) schema = schema.min(field.min);
-    if (field.max !== undefined) schema = schema.max(field.max);
+    const numberField = field;
+    if (numberField.min !== undefined) schema = schema.min(numberField.min);
+    if (numberField.max !== undefined) schema = schema.max(numberField.max);
     return schema;
   },
   checkbox: () => zod.z.coerce.boolean(),
@@ -3462,116 +3562,221 @@ function getItemKey(item, index) {
   }
   return item.name;
 }
+function extractFields(items) {
+  const fields = [];
+  for (const item of items) {
+    if (isLayoutBlock(item)) {
+      let childItems = [];
+      if (item.type === 'columns') {
+        for (const column of item.columns) {
+          childItems.push(...column.children);
+        }
+      } else if (item.type === 'section') {
+        childItems = item.children;
+      }
+      fields.push(...extractFields(childItems));
+    } else {
+      fields.push(item);
+    }
+  }
+  return fields;
+}
+function extractLayouts(items) {
+  const layouts = [];
+  items.forEach((item, index) => {
+    if (isLayoutBlock(item)) {
+      layouts.push({
+        layout: item,
+        index
+      });
+    }
+  });
+  return layouts;
+}
+
 function hasSchema(props) {
   return props.schema !== undefined;
 }
-function FormGenerator(props) {
-  const $ = compilerRuntime.c(20);
+function FormGeneratorImpl(props) {
   const {
     fields,
     defaultValues,
     className,
-    submitText: t0,
+    submitText = 'Submit',
     disabled,
-    mode: t1
+    mode = 'onChange',
+    title,
+    description,
+    showReset = false,
+    resetText = 'Reset',
+    children,
+    ref
   } = props;
-  const submitText = t0 === undefined ? "Submit" : t0;
-  const mode = t1 === undefined ? "onChange" : t1;
   const userSchema = hasSchema(props) ? props.schema : undefined;
   const onSubmit = props.onSubmit;
-  let t2;
-  bb0: {
+  const formRef = React.useRef(null);
+  const schema = React.useMemo(() => {
     if (userSchema) {
-      t2 = userSchema;
-      break bb0;
-    }
-    let t3;
-    if ($[0] !== fields) {
-      t3 = buildSchema(fields);
-      $[0] = fields;
-      $[1] = t3;
-    } else {
-      t3 = $[1];
+      return userSchema;
     }
-    t2 = t3;
-  }
-  const schema = t2;
-  let t3;
-  if ($[2] !== defaultValues || $[3] !== fields) {
+    return buildSchema(fields);
+  }, [fields, userSchema]);
+  const mergedDefaultValues = React.useMemo(() => {
     const builtDefaults = buildDefaultValues(fields);
-    t3 = defaultValues ? deepMerge(builtDefaults, defaultValues) : builtDefaults;
-    $[2] = defaultValues;
-    $[3] = fields;
-    $[4] = t3;
-  } else {
-    t3 = $[4];
-  }
-  const mergedDefaultValues = t3;
-  let t4;
-  if ($[5] !== schema) {
-    t4 = a(schema);
-    $[5] = schema;
-    $[6] = t4;
-  } else {
-    t4 = $[6];
-  }
-  let t5;
-  if ($[7] !== mergedDefaultValues || $[8] !== mode || $[9] !== t4) {
-    t5 = {
-      resolver: t4,
-      defaultValues: mergedDefaultValues,
-      mode
-    };
-    $[7] = mergedDefaultValues;
-    $[8] = mode;
-    $[9] = t4;
-    $[10] = t5;
-  } else {
-    t5 = $[10];
-  }
-  const form = useForm(t5);
-  let t6;
-  if ($[11] !== className || $[12] !== disabled || $[13] !== fields || $[14] !== form || $[15] !== onSubmit || $[16] !== submitText) {
-    let t7;
-    if ($[18] !== onSubmit) {
-      t7 = async data => {
-        await onSubmit(data);
-      };
-      $[18] = onSubmit;
-      $[19] = t7;
-    } else {
-      t7 = $[19];
+    return defaultValues ? deepMerge(builtDefaults, defaultValues) : builtDefaults;
+  }, [fields, defaultValues]);
+  const form = useForm({
+    resolver: a(schema),
+    defaultValues: mergedDefaultValues,
+    mode
+  });
+  const handleSubmit = form.handleSubmit(async data => {
+    await onSubmit(data);
+  });
+  const handleReset = React.useCallback(() => {
+    form.reset(mergedDefaultValues);
+  }, [form, mergedDefaultValues]);
+  React.useImperativeHandle(ref, () => ({
+    setValues: values => {
+      Object.entries(values).forEach(([key, value]) => {
+        form.setValue(key, value, {
+          shouldValidate: true,
+          shouldDirty: true
+        });
+      });
+    },
+    getValues: () => form.getValues(),
+    reset: values_0 => {
+      if (values_0) {
+        form.reset(deepMerge(mergedDefaultValues, values_0));
+      } else {
+        form.reset(mergedDefaultValues);
+      }
+    },
+    submit: async () => {
+      await handleSubmit();
+    },
+    clearErrors: () => form.clearErrors(),
+    setError: (name, error) => form.setError(name, error),
+    isValid: () => form.formState.isValid,
+    isDirty: () => form.formState.isDirty,
+    form: form
+  }), [form, handleSubmit, mergedDefaultValues]);
+  const SubmitButton = getFormComponent('SubmitButton');
+  const fieldEntries = React.useMemo(() => {
+    const entries = new Map();
+    const allFields = extractFields(fields);
+    allFields.forEach((field, index) => {
+      if (!field.hidden) {
+        const element = jsxRuntime.jsx(FieldRenderer, {
+          field: field
+        }, field.name || `field-${index}`);
+        entries.set(field.name, {
+          field,
+          element,
+          accessed: false
+        });
+      }
+    });
+    return entries;
+  }, [fields]);
+  const layoutEntries = React.useMemo(() => {
+    const entries_0 = new Map();
+    const allLayouts = extractLayouts(fields);
+    allLayouts.forEach(({
+      layout,
+      index: index_0
+    }) => {
+      if (!layout.hidden) {
+        const key_0 = layout.name || `layout-${layout.type}-${index_0}`;
+        const element_0 = jsxRuntime.jsx(FormItemRenderer, {
+          item: layout
+        }, key_0);
+        if (layout.name) {
+          entries_0.set(layout.name, {
+            layout,
+            element: element_0
+          });
+        }
+      }
+    });
+    return entries_0;
+  }, [fields]);
+  const templateFields = React.useMemo(() => createTemplateFields(fieldEntries), [fieldEntries]);
+  const templateLayouts = React.useMemo(() => createTemplateLayouts(layoutEntries), [layoutEntries]);
+  const buttons = React.useMemo(() => {
+    const result = {
+      submit: jsxRuntime.jsx(SubmitButton, {
+        disabled: disabled || form.formState.isSubmitting,
+        isSubmitting: form.formState.isSubmitting,
+        children: submitText
+      }, "submit")
+    };
+    if (showReset) {
+      result.reset = jsxRuntime.jsx("button", {
+        type: "button",
+        onClick: handleReset,
+        disabled: disabled,
+        children: resetText
+      }, "reset");
     }
-    const handleSubmit = form.handleSubmit(t7);
-    const SubmitButton = getFormComponent("SubmitButton");
-    t6 = jsxRuntime.jsx(FormProvider, {
+    return result;
+  }, [SubmitButton, disabled, form.formState.isSubmitting, submitText, showReset, resetText, handleReset]);
+  const renderField = React.useCallback((field_0, options) => {
+    return jsxRuntime.jsx(FieldRenderer, {
+      field: field_0,
+      namePrefix: options === null || options === void 0 ? void 0 : options.namePrefix
+    });
+  }, []);
+  const renderLayout = React.useCallback((layout_0, options_0) => {
+    return jsxRuntime.jsx(FormItemRenderer, {
+      item: layout_0,
+      namePrefix: options_0 === null || options_0 === void 0 ? void 0 : options_0.namePrefix
+    });
+  }, []);
+  if (!children) {
+    return jsxRuntime.jsx(FormProvider, {
       ...form,
       children: jsxRuntime.jsxs("form", {
+        ref: formRef,
         onSubmit: handleSubmit,
-        className,
-        children: [fields.map(_temp), jsxRuntime.jsx(SubmitButton, {
+        className: className,
+        children: [fields.map((item, index_1) => jsxRuntime.jsx(FormItemRenderer, {
+          item: item
+        }, getItemKey(item, index_1))), jsxRuntime.jsx(SubmitButton, {
           disabled: disabled || form.formState.isSubmitting,
           isSubmitting: form.formState.isSubmitting,
           children: submitText
         })]
       })
     });
-    $[11] = className;
-    $[12] = disabled;
-    $[13] = fields;
-    $[14] = form;
-    $[15] = onSubmit;
-    $[16] = submitText;
-    $[17] = t6;
-  } else {
-    t6 = $[17];
   }
-  return t6;
+  const renderProps = {
+    fields: templateFields,
+    layouts: templateLayouts,
+    buttons,
+    title,
+    description,
+    form: form,
+    isSubmitting: form.formState.isSubmitting,
+    isValid: form.formState.isValid,
+    isDirty: form.formState.isDirty,
+    renderField,
+    renderLayout
+  };
+  const renderFn = children;
+  return jsxRuntime.jsx(FormProvider, {
+    ...form,
+    children: jsxRuntime.jsx("form", {
+      ref: formRef,
+      onSubmit: handleSubmit,
+      className: className,
+      children: renderFn(renderProps)
+    })
+  });
 }
-function _temp(item, index) {
-  return jsxRuntime.jsx(FormItemRenderer, {
-    item
-  }, getItemKey(item, index));
+function FormGenerator(props) {
+  return FormGeneratorImpl(props);
 }
 
 Object.defineProperty(exports, "z", {