@rebasepro/formex 0.5.0 → 0.6.0

package/dist/index.umd.js

@@ -1,506 +1,366 @@
 (function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react-compiler-runtime"), require("react"), require("react/jsx-runtime"), require("fast-equals")) : typeof define === "function" && define.amd ? define(["exports", "react-compiler-runtime", "react", "react/jsx-runtime", "fast-equals"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.Formex = {}, global.reactCompilerRuntime, global.React, global.jsxRuntime, global.fastEquals));
-})(this, (function(exports2, reactCompilerRuntime, React, jsxRuntime, fastEquals) {
-  "use strict";
-  function _interopNamespaceDefault(e) {
-    const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-    if (e) {
-      for (const k in e) {
-        if (k !== "default") {
-          const d = Object.getOwnPropertyDescriptor(e, k);
-          Object.defineProperty(n, k, d.get ? d : {
-            enumerable: true,
-            get: () => e[k]
-          });
-        }
-      }
-    }
-    n.default = e;
-    return Object.freeze(n);
-  }
-  const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-  const FormexContext = React.createContext(null);
-  const useFormex = () => {
-    const ctx = React.useContext(FormexContext);
-    if (!ctx) {
-      throw new Error("useFormex must be used within a Formex provider");
-    }
-    return ctx;
-  };
-  const Formex = (t0) => {
-    const $ = reactCompilerRuntime.c(3);
-    const {
-      value,
-      children
-    } = t0;
-    let t1;
-    if ($[0] !== children || $[1] !== value) {
-      t1 = /* @__PURE__ */ jsxRuntime.jsx(FormexContext.Provider, { value, children });
-      $[0] = children;
-      $[1] = value;
-      $[2] = t1;
-    } else {
-      t1 = $[2];
-    }
-    return t1;
-  };
-  const isEmptyArray = (value) => Array.isArray(value) && value.length === 0;
-  const isFunction = (obj) => typeof obj === "function";
-  const isObject = (obj) => obj !== null && typeof obj === "object";
-  const isInteger = (obj) => String(Math.floor(Number(obj))) === obj;
-  const isNaN = (obj) => obj !== obj;
-  function getIn(obj, key, def, p = 0) {
-    const path = toPath(key);
-    let current = obj;
-    while (current && p < path.length) {
-      current = current[path[p++]];
-    }
-    if (p !== path.length && !current) {
-      return def;
-    }
-    return current === void 0 ? def : current;
-  }
-  function setIn(obj, path, value) {
-    const res = clone(obj);
-    let resVal = res;
-    let i = 0;
-    const pathArray = toPath(path);
-    for (; i < pathArray.length - 1; i++) {
-      const currentPath = pathArray[i];
-      const currentObj = getIn(obj, pathArray.slice(0, i + 1));
-      if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) {
-        resVal = resVal[currentPath] = clone(currentObj);
-      } else {
-        const nextPath = pathArray[i + 1];
-        resVal = resVal[currentPath] = isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {};
-      }
-    }
-    if ((i === 0 ? obj : resVal)[pathArray[i]] === value) {
-      return obj;
-    }
-    if (value === void 0) {
-      delete resVal[pathArray[i]];
-    } else {
-      resVal[pathArray[i]] = value;
-    }
-    if (i === 0 && value === void 0) {
-      delete res[pathArray[i]];
-    }
-    return res;
-  }
-  function clone(value) {
-    if (Array.isArray(value)) {
-      return [...value];
-    } else if (typeof value === "object" && value !== null) {
-      if (Object.getPrototypeOf(value) !== Object.prototype) {
-        return value;
-      }
-      return {
-        ...value
-      };
-    } else {
-      return value;
-    }
-  }
-  function toPath(value) {
-    if (Array.isArray(value)) return value;
-    return value.replace(/\[(\d+)]/g, ".$1").replace(/^\./, "").replace(/\.$/, "").split(".");
-  }
-  function Field(t0) {
-    const $ = reactCompilerRuntime.c(37);
-    let children;
-    let className;
-    let is;
-    let name;
-    let props;
-    if ($[0] !== t0) {
-      const {
-        validate,
-        name: t12,
-        children: t22,
-        as: t3,
-        className: t4,
-        ...t5
-      } = t0;
-      name = t12;
-      children = t22;
-      is = t3;
-      className = t4;
-      props = t5;
-      $[0] = t0;
-      $[1] = children;
-      $[2] = className;
-      $[3] = is;
-      $[4] = name;
-      $[5] = props;
-    } else {
-      children = $[1];
-      className = $[2];
-      is = $[3];
-      name = $[4];
-      props = $[5];
-    }
-    const formex = useFormex();
-    let field;
-    let t1;
-    if ($[6] !== children || $[7] !== formex || $[8] !== name || $[9] !== props) {
-      t1 = /* @__PURE__ */ Symbol.for("react.early_return_sentinel");
-      bb0: {
-        field = getFieldProps({
-          name,
-          ...props
-        }, formex);
-        if (isFunction(children)) {
-          t1 = children({
-            field,
-            form: formex
-          });
-          break bb0;
-        }
-      }
-      $[6] = children;
-      $[7] = formex;
-      $[8] = name;
-      $[9] = props;
-      $[10] = field;
-      $[11] = t1;
-    } else {
-      field = $[10];
-      t1 = $[11];
-    }
-    if (t1 !== /* @__PURE__ */ Symbol.for("react.early_return_sentinel")) {
-      return t1;
-    }
-    const asElement = is || "input";
-    if (typeof asElement === "string") {
-      let innerRef;
-      let rest;
-      if ($[12] !== props) {
-        ({
-          innerRef,
-          ...rest
-        } = props);
-        $[12] = props;
-        $[13] = innerRef;
-        $[14] = rest;
-      } else {
-        innerRef = $[13];
-        rest = $[14];
-      }
-      let t22;
-      if ($[15] !== asElement || $[16] !== children || $[17] !== className || $[18] !== field || $[19] !== innerRef || $[20] !== rest) {
-        let t3;
-        if ($[22] !== className || $[23] !== field || $[24] !== innerRef || $[25] !== rest) {
-          t3 = {
-            ref: innerRef,
-            ...field,
-            ...rest,
-            className
-          };
-          $[22] = className;
-          $[23] = field;
-          $[24] = innerRef;
-          $[25] = rest;
-          $[26] = t3;
-        } else {
-          t3 = $[26];
-        }
-        t22 = React__namespace.createElement(asElement, t3, children);
-        $[15] = asElement;
-        $[16] = children;
-        $[17] = className;
-        $[18] = field;
-        $[19] = innerRef;
-        $[20] = rest;
-        $[21] = t22;
-      } else {
-        t22 = $[21];
-      }
-      return t22;
-    }
-    let t2;
-    if ($[27] !== asElement || $[28] !== children || $[29] !== className || $[30] !== field || $[31] !== props) {
-      let t3;
-      if ($[33] !== className || $[34] !== field || $[35] !== props) {
-        t3 = {
-          ...field,
-          ...props,
-          className
-        };
-        $[33] = className;
-        $[34] = field;
-        $[35] = props;
-        $[36] = t3;
-      } else {
-        t3 = $[36];
-      }
-      t2 = React__namespace.createElement(asElement, t3, children);
-      $[27] = asElement;
-      $[28] = children;
-      $[29] = className;
-      $[30] = field;
-      $[31] = props;
-      $[32] = t2;
-    } else {
-      t2 = $[32];
-    }
-    return t2;
-  }
-  const getFieldProps = (nameOrOptions, formex) => {
-    const name = typeof nameOrOptions === "string" ? nameOrOptions : nameOrOptions.name;
-    const valueState = getIn(formex.values, name);
-    const field = {
-      name,
-      value: valueState,
-      onChange: formex.handleChange,
-      onBlur: formex.handleBlur
-    };
-    if (typeof nameOrOptions !== "string") {
-      const {
-        type,
-        value: valueProp,
-        // value is special for checkboxes
-        as: is,
-        multiple
-      } = nameOrOptions;
-      if (type === "checkbox") {
-        if (valueProp === void 0) {
-          field.checked = !!valueState;
-        } else {
-          field.checked = !!(Array.isArray(valueState) && ~valueState.indexOf(valueProp));
-          field.value = valueProp;
-        }
-      } else if (type === "radio") {
-        field.checked = valueState === valueProp;
-        field.value = valueProp;
-      } else if (is === "select" && multiple) {
-        field.value = field.value || [];
-        field.multiple = true;
-      }
-    }
-    return field;
-  };
-  function useCreateFormex({
-    initialValues,
-    initialErrors,
-    initialDirty,
-    initialTouched,
-    validation,
-    validateOnChange = false,
-    validateOnInitialRender = false,
-    onSubmit,
-    onReset,
-    onValuesChangeDeferred,
-    debugId
-  }) {
-    const initialValuesRef = React.useRef(initialValues);
-    const valuesRef = React.useRef(initialValues);
-    const debugIdRef = React.useRef(debugId);
-    const [values, setValuesInner] = React.useState(initialValues);
-    const [touchedState, setTouchedState] = React.useState(initialTouched ?? {});
-    const [errors, setErrors] = React.useState(initialErrors ?? {});
-    const [dirty, setDirty] = React.useState(initialDirty ?? false);
-    const [submitCount, setSubmitCount] = React.useState(0);
-    const [isSubmitting, setIsSubmitting] = React.useState(false);
-    const [isValidating, setIsValidating] = React.useState(false);
-    const [version, setVersion] = React.useState(0);
-    const onValuesChangeRef = React.useRef(onValuesChangeDeferred);
-    onValuesChangeRef.current = onValuesChangeDeferred;
-    const debounceTimeoutRef = React.useRef(void 0);
-    const callDebouncedOnValuesChange = React.useCallback((values_0) => {
-      if (onValuesChangeRef.current) {
-        if (debounceTimeoutRef.current) {
-          clearTimeout(debounceTimeoutRef.current);
-        }
-        debounceTimeoutRef.current = setTimeout(() => {
-          onValuesChangeRef.current?.(values_0, controllerRef.current);
-        }, 300);
-      }
-    }, []);
-    const historyRef = React.useRef([initialValues]);
-    const historyIndexRef = React.useRef(0);
-    React.useEffect(() => {
-      if (validateOnInitialRender) {
-        validate();
-      }
-    }, []);
-    const setValues = React.useCallback((newValues) => {
-      valuesRef.current = newValues;
-      setValuesInner(newValues);
-      setDirty(!fastEquals.deepEqual(initialValuesRef.current, newValues));
-      const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);
-      newHistory.push(newValues);
-      historyRef.current = newHistory;
-      historyIndexRef.current = newHistory.length - 1;
-      callDebouncedOnValuesChange(newValues);
-    }, [callDebouncedOnValuesChange]);
-    const validate = React.useCallback(async () => {
-      setIsValidating(true);
-      const validationErrors = await validation?.(valuesRef.current);
-      setErrors(validationErrors ?? {});
-      setIsValidating(false);
-      return validationErrors;
-    }, [validation]);
-    const setFieldValue = React.useCallback((key, value, shouldValidate) => {
-      const newValues_0 = setIn(valuesRef.current, key, value);
-      valuesRef.current = newValues_0;
-      setValuesInner(newValues_0);
-      if (!fastEquals.deepEqual(getIn(initialValuesRef.current, key), value)) {
-        setDirty(true);
-      }
-      if (shouldValidate) {
-        validate();
-      }
-      const newHistory_0 = historyRef.current.slice(0, historyIndexRef.current + 1);
-      newHistory_0.push(newValues_0);
-      historyRef.current = newHistory_0;
-      historyIndexRef.current = newHistory_0.length - 1;
-      callDebouncedOnValuesChange(newValues_0);
-    }, [validate, callDebouncedOnValuesChange]);
-    const setFieldError = React.useCallback((key_0, error) => {
-      setErrors((prevErrors) => {
-        const newErrors = {
-          ...prevErrors
-        };
-        if (error) {
-          newErrors[key_0] = error;
-        } else {
-          delete newErrors[key_0];
-        }
-        return newErrors;
-      });
-    }, []);
-    const setFieldTouched = React.useCallback((key_1, touched, shouldValidate_0) => {
-      setTouchedState((prev) => ({
-        ...prev,
-        [key_1]: touched
-      }));
-      if (shouldValidate_0) {
-        validate();
-      }
-    }, [validate]);
-    const handleChange = React.useCallback((event) => {
-      const target = event.target;
-      let value_0;
-      if (target.type === "checkbox") {
-        value_0 = target.checked;
-      } else if (target.type === "number") {
-        value_0 = target.valueAsNumber;
-      } else {
-        value_0 = target.value;
-      }
-      const name = target.name;
-      setFieldValue(name, value_0, validateOnChange);
-      setFieldTouched(name, true);
-    }, [setFieldValue, setFieldTouched, validateOnChange]);
-    const handleBlur = React.useCallback((event_0) => {
-      const target_0 = event_0.target;
-      const name_0 = target_0.name;
-      setFieldTouched(name_0, true);
-    }, [setFieldTouched]);
-    const submit = React.useCallback(async (e) => {
-      e?.preventDefault();
-      e?.stopPropagation();
-      setIsSubmitting(true);
-      setSubmitCount((prev_0) => prev_0 + 1);
-      const validationErrors_0 = await validation?.(valuesRef.current);
-      if (validationErrors_0 && Object.keys(validationErrors_0).length > 0) {
-        setErrors(validationErrors_0);
-      } else {
-        setErrors({});
-        await onSubmit?.(valuesRef.current, controllerRef.current);
-      }
-      setIsSubmitting(false);
-      setVersion((prev_1) => prev_1 + 1);
-    }, [onSubmit, validation]);
-    const resetForm = React.useCallback((props) => {
-      const {
-        submitCount: submitCountProp,
-        values: valuesProp,
-        errors: errorsProp,
-        touched: touchedProp
-      } = props ?? {};
-      valuesRef.current = valuesProp ?? initialValuesRef.current;
-      initialValuesRef.current = valuesProp ?? initialValuesRef.current;
-      setValuesInner(valuesProp ?? initialValuesRef.current);
-      setErrors(errorsProp ?? {});
-      setTouchedState(touchedProp ?? initialTouched ?? {});
-      setDirty(false);
-      setSubmitCount(submitCountProp ?? 0);
-      setVersion((prev_2) => prev_2 + 1);
-      onReset?.(controllerRef.current);
-      historyRef.current = [valuesProp ?? initialValuesRef.current];
-      historyIndexRef.current = 0;
-    }, [onReset, initialTouched]);
-    const undo = React.useCallback(() => {
-      if (historyIndexRef.current > 0) {
-        const newIndex = historyIndexRef.current - 1;
-        const newValues_1 = historyRef.current[newIndex];
-        setValuesInner(newValues_1);
-        valuesRef.current = newValues_1;
-        historyIndexRef.current = newIndex;
-        setDirty(!fastEquals.deepEqual(initialValuesRef.current, newValues_1));
-        callDebouncedOnValuesChange(newValues_1);
-      }
-    }, [callDebouncedOnValuesChange]);
-    const redo = React.useCallback(() => {
-      if (historyIndexRef.current < historyRef.current.length - 1) {
-        const newIndex_0 = historyIndexRef.current + 1;
-        const newValues_2 = historyRef.current[newIndex_0];
-        setValuesInner(newValues_2);
-        valuesRef.current = newValues_2;
-        historyIndexRef.current = newIndex_0;
-        setDirty(!fastEquals.deepEqual(initialValuesRef.current, newValues_2));
-        callDebouncedOnValuesChange(newValues_2);
-      }
-    }, [callDebouncedOnValuesChange]);
-    const controllerRef = React.useRef({});
-    const controller = React.useMemo(() => ({
-      values,
-      initialValues: initialValuesRef.current,
-      handleChange,
-      isSubmitting,
-      setSubmitting: setIsSubmitting,
-      setValues,
-      setFieldValue,
-      errors,
-      setFieldError,
-      touched: touchedState,
-      setFieldTouched,
-      setTouched: setTouchedState,
-      dirty,
-      setDirty,
-      handleSubmit: submit,
-      submitCount,
-      setSubmitCount,
-      handleBlur,
-      validate,
-      isValidating,
-      resetForm,
-      version,
-      debugId: debugIdRef.current,
-      undo,
-      redo,
-      canUndo: historyIndexRef.current > 0,
-      canRedo: historyIndexRef.current < historyRef.current.length - 1
-    }), [values, errors, touchedState, dirty, isSubmitting, submitCount, isValidating, version, handleChange, handleBlur, setValues, setFieldValue, setFieldTouched, setTouchedState, setFieldError, validate, submit, resetForm, undo, redo]);
-    React.useEffect(() => {
-      controllerRef.current = controller;
-    }, [controller]);
-    return controller;
-  }
-  exports2.Field = Field;
-  exports2.Formex = Formex;
-  exports2.clone = clone;
-  exports2.getIn = getIn;
-  exports2.isEmptyArray = isEmptyArray;
-  exports2.isFunction = isFunction;
-  exports2.isInteger = isInteger;
-  exports2.isNaN = isNaN;
-  exports2.isObject = isObject;
-  exports2.setIn = setIn;
-  exports2.useCreateFormex = useCreateFormex;
-  exports2.useFormex = useFormex;
-  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
-}));
-//# sourceMappingURL=index.umd.js.map
+	typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("react/jsx-runtime"), require("fast-equals")) : typeof define === "function" && define.amd ? define([
+		"exports",
+		"react",
+		"react/jsx-runtime",
+		"fast-equals"
+	], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.Formex = {}, global.react, global.react_jsx_runtime, global.fastEquals));
+})(this, function(exports, react, react_jsx_runtime, fast_equals) {
+	Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+	//#region \0rolldown/runtime.js
+	var __create = Object.create;
+	var __defProp = Object.defineProperty;
+	var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+	var __getOwnPropNames = Object.getOwnPropertyNames;
+	var __getProtoOf = Object.getPrototypeOf;
+	var __hasOwnProp = Object.prototype.hasOwnProperty;
+	var __copyProps = (to, from, except, desc) => {
+		if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+			key = keys[i];
+			if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+				get: ((k) => from[k]).bind(null, key),
+				enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+			});
+		}
+		return to;
+	};
+	var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+		value: mod,
+		enumerable: true
+	}) : target, mod));
+	//#endregion
+	react = __toESM(react, 1);
+	//#region src/Formex.tsx
+	var FormexContext = react.default.createContext(null);
+	var useFormex = () => {
+		const ctx = (0, react.useContext)(FormexContext);
+		if (!ctx) throw new Error("useFormex must be used within a Formex provider");
+		return ctx;
+	};
+	var Formex = ({ value, children }) => {
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormexContext.Provider, {
+			value,
+			children
+		});
+	};
+	//#endregion
+	//#region src/utils.ts
+	/** @private is the value an empty array? */
+	var isEmptyArray = (value) => Array.isArray(value) && value.length === 0;
+	/** @private is the given object a Function? */
+	var isFunction = (obj) => typeof obj === "function";
+	/** @private is the given object an Object? */
+	var isObject = (obj) => obj !== null && typeof obj === "object";
+	/** @private is the given object an integer? */
+	var isInteger = (obj) => String(Math.floor(Number(obj))) === obj;
+	/** @private is the given object a NaN? */
+	var isNaN = (obj) => obj !== obj;
+	/**
+	* Deeply get a value from an object via its path.
+	*/
+	function getIn(obj, key, def, p = 0) {
+		const path = toPath(key);
+		let current = obj;
+		while (current && p < path.length) current = current[path[p++]];
+		if (p !== path.length && !current) return def;
+		return current === void 0 ? def : current;
+	}
+	function setIn(obj, path, value) {
+		const res = clone(obj);
+		let resVal = res;
+		let i = 0;
+		const pathArray = toPath(path);
+		for (; i < pathArray.length - 1; i++) {
+			const currentPath = pathArray[i];
+			const currentObj = getIn(obj, pathArray.slice(0, i + 1));
+			if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) resVal = resVal[currentPath] = clone(currentObj);
+			else {
+				const nextPath = pathArray[i + 1];
+				resVal = resVal[currentPath] = isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {};
+			}
+		}
+		if ((i === 0 ? obj : resVal)[pathArray[i]] === value) return obj;
+		if (value === void 0) delete resVal[pathArray[i]];
+		else resVal[pathArray[i]] = value;
+		if (i === 0 && value === void 0) delete res[pathArray[i]];
+		return res;
+	}
+	function clone(value) {
+		if (Array.isArray(value)) return [...value];
+		else if (typeof value === "object" && value !== null) {
+			if (Object.getPrototypeOf(value) !== Object.prototype) return value;
+			return { ...value };
+		} else return value;
+	}
+	function toPath(value) {
+		if (Array.isArray(value)) return value;
+		return value.replace(/\[(\d+)]/g, ".$1").replace(/^\./, "").replace(/\.$/, "").split(".");
+	}
+	//#endregion
+	//#region src/Field.tsx
+	function Field({ validate, name, children, as: is, className, ...props }) {
+		const formex = useFormex();
+		const field = getFieldProps({
+			name,
+			...props
+		}, formex);
+		if (isFunction(children)) return children({
+			field,
+			form: formex
+		});
+		const asElement = is || "input";
+		if (typeof asElement === "string") {
+			const { innerRef, ...rest } = props;
+			return react.createElement(asElement, {
+				ref: innerRef,
+				...field,
+				...rest,
+				className
+			}, children);
+		}
+		return react.createElement(asElement, {
+			...field,
+			...props,
+			className
+		}, children);
+	}
+	var getFieldProps = (nameOrOptions, formex) => {
+		const name = typeof nameOrOptions === "string" ? nameOrOptions : nameOrOptions.name;
+		const valueState = getIn(formex.values, name);
+		const field = {
+			name,
+			value: valueState,
+			onChange: formex.handleChange,
+			onBlur: formex.handleBlur
+		};
+		if (typeof nameOrOptions !== "string") {
+			const { type, value: valueProp, as: is, multiple } = nameOrOptions;
+			if (type === "checkbox") if (valueProp === void 0) field.checked = !!valueState;
+			else {
+				field.checked = !!(Array.isArray(valueState) && ~valueState.indexOf(valueProp));
+				field.value = valueProp;
+			}
+			else if (type === "radio") {
+				field.checked = valueState === valueProp;
+				field.value = valueProp;
+			} else if (is === "select" && multiple) {
+				field.value = field.value || [];
+				field.multiple = true;
+			}
+		}
+		return field;
+	};
+	//#endregion
+	//#region src/useCreateFormex.tsx
+	function useCreateFormex({ initialValues, initialErrors, initialDirty, initialTouched, validation, validateOnChange = false, validateOnInitialRender = false, onSubmit, onReset, onValuesChangeDeferred, debugId }) {
+		const initialValuesRef = (0, react.useRef)(initialValues);
+		const valuesRef = (0, react.useRef)(initialValues);
+		const debugIdRef = (0, react.useRef)(debugId);
+		const [values, setValuesInner] = (0, react.useState)(initialValues);
+		const [touchedState, setTouchedState] = (0, react.useState)(initialTouched ?? {});
+		const [errors, setErrors] = (0, react.useState)(initialErrors ?? {});
+		const [dirty, setDirty] = (0, react.useState)(initialDirty ?? false);
+		const [submitCount, setSubmitCount] = (0, react.useState)(0);
+		const [isSubmitting, setIsSubmitting] = (0, react.useState)(false);
+		const [isValidating, setIsValidating] = (0, react.useState)(false);
+		const [version, setVersion] = (0, react.useState)(0);
+		const onValuesChangeRef = (0, react.useRef)(onValuesChangeDeferred);
+		onValuesChangeRef.current = onValuesChangeDeferred;
+		const debounceTimeoutRef = (0, react.useRef)(void 0);
+		const callDebouncedOnValuesChange = (0, react.useCallback)((values) => {
+			if (onValuesChangeRef.current) {
+				if (debounceTimeoutRef.current) clearTimeout(debounceTimeoutRef.current);
+				debounceTimeoutRef.current = setTimeout(() => {
+					onValuesChangeRef.current?.(values, controllerRef.current);
+				}, 300);
+			}
+		}, []);
+		const historyRef = (0, react.useRef)([initialValues]);
+		const historyIndexRef = (0, react.useRef)(0);
+		(0, react.useEffect)(() => {
+			if (validateOnInitialRender) validate();
+		}, []);
+		const setValues = (0, react.useCallback)((newValues) => {
+			valuesRef.current = newValues;
+			setValuesInner(newValues);
+			setDirty(!(0, fast_equals.deepEqual)(initialValuesRef.current, newValues));
+			const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);
+			newHistory.push(newValues);
+			historyRef.current = newHistory;
+			historyIndexRef.current = newHistory.length - 1;
+			callDebouncedOnValuesChange(newValues);
+		}, [callDebouncedOnValuesChange]);
+		const validate = (0, react.useCallback)(async () => {
+			setIsValidating(true);
+			const validationErrors = await validation?.(valuesRef.current);
+			setErrors(validationErrors ?? {});
+			setIsValidating(false);
+			return validationErrors;
+		}, [validation]);
+		const setFieldValue = (0, react.useCallback)((key, value, shouldValidate) => {
+			const newValues = setIn(valuesRef.current, key, value);
+			valuesRef.current = newValues;
+			setValuesInner(newValues);
+			if (!(0, fast_equals.deepEqual)(getIn(initialValuesRef.current, key), value)) setDirty(true);
+			if (shouldValidate) validate();
+			const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);
+			newHistory.push(newValues);
+			historyRef.current = newHistory;
+			historyIndexRef.current = newHistory.length - 1;
+			callDebouncedOnValuesChange(newValues);
+		}, [validate, callDebouncedOnValuesChange]);
+		const setFieldError = (0, react.useCallback)((key, error) => {
+			setErrors((prevErrors) => {
+				const newErrors = { ...prevErrors };
+				if (error) newErrors[key] = error;
+				else delete newErrors[key];
+				return newErrors;
+			});
+		}, []);
+		const setFieldTouched = (0, react.useCallback)((key, touched, shouldValidate) => {
+			setTouchedState((prev) => ({
+				...prev,
+				[key]: touched
+			}));
+			if (shouldValidate) validate();
+		}, [validate]);
+		const handleChange = (0, react.useCallback)((event) => {
+			const target = event.target;
+			let value;
+			if (target.type === "checkbox") value = target.checked;
+			else if (target.type === "number") value = target.valueAsNumber;
+			else value = target.value;
+			const name = target.name;
+			setFieldValue(name, value, validateOnChange);
+			setFieldTouched(name, true);
+		}, [
+			setFieldValue,
+			setFieldTouched,
+			validateOnChange
+		]);
+		const handleBlur = (0, react.useCallback)((event) => {
+			const name = event.target.name;
+			setFieldTouched(name, true);
+		}, [setFieldTouched]);
+		const submit = (0, react.useCallback)(async (e) => {
+			e?.preventDefault();
+			e?.stopPropagation();
+			setIsSubmitting(true);
+			setSubmitCount((prev) => prev + 1);
+			const validationErrors = await validation?.(valuesRef.current);
+			if (validationErrors && Object.keys(validationErrors).length > 0) setErrors(validationErrors);
+			else {
+				setErrors({});
+				await onSubmit?.(valuesRef.current, controllerRef.current);
+			}
+			setIsSubmitting(false);
+			setVersion((prev) => prev + 1);
+		}, [onSubmit, validation]);
+		const resetForm = (0, react.useCallback)((props) => {
+			const { submitCount: submitCountProp, values: valuesProp, errors: errorsProp, touched: touchedProp } = props ?? {};
+			valuesRef.current = valuesProp ?? initialValuesRef.current;
+			initialValuesRef.current = valuesProp ?? initialValuesRef.current;
+			setValuesInner(valuesProp ?? initialValuesRef.current);
+			setErrors(errorsProp ?? {});
+			setTouchedState(touchedProp ?? initialTouched ?? {});
+			setDirty(false);
+			setSubmitCount(submitCountProp ?? 0);
+			setVersion((prev) => prev + 1);
+			onReset?.(controllerRef.current);
+			historyRef.current = [valuesProp ?? initialValuesRef.current];
+			historyIndexRef.current = 0;
+		}, [onReset, initialTouched]);
+		const undo = (0, react.useCallback)(() => {
+			if (historyIndexRef.current > 0) {
+				const newIndex = historyIndexRef.current - 1;
+				const newValues = historyRef.current[newIndex];
+				setValuesInner(newValues);
+				valuesRef.current = newValues;
+				historyIndexRef.current = newIndex;
+				setDirty(!(0, fast_equals.deepEqual)(initialValuesRef.current, newValues));
+				callDebouncedOnValuesChange(newValues);
+			}
+		}, [callDebouncedOnValuesChange]);
+		const redo = (0, react.useCallback)(() => {
+			if (historyIndexRef.current < historyRef.current.length - 1) {
+				const newIndex = historyIndexRef.current + 1;
+				const newValues = historyRef.current[newIndex];
+				setValuesInner(newValues);
+				valuesRef.current = newValues;
+				historyIndexRef.current = newIndex;
+				setDirty(!(0, fast_equals.deepEqual)(initialValuesRef.current, newValues));
+				callDebouncedOnValuesChange(newValues);
+			}
+		}, [callDebouncedOnValuesChange]);
+		const controllerRef = (0, react.useRef)({});
+		const controller = (0, react.useMemo)(() => ({
+			values,
+			initialValues: initialValuesRef.current,
+			handleChange,
+			isSubmitting,
+			setSubmitting: setIsSubmitting,
+			setValues,
+			setFieldValue,
+			errors,
+			setFieldError,
+			touched: touchedState,
+			setFieldTouched,
+			setTouched: setTouchedState,
+			dirty,
+			setDirty,
+			handleSubmit: submit,
+			submitCount,
+			setSubmitCount,
+			handleBlur,
+			validate,
+			isValidating,
+			resetForm,
+			version,
+			debugId: debugIdRef.current,
+			undo,
+			redo,
+			canUndo: historyIndexRef.current > 0,
+			canRedo: historyIndexRef.current < historyRef.current.length - 1
+		}), [
+			values,
+			errors,
+			touchedState,
+			dirty,
+			isSubmitting,
+			submitCount,
+			isValidating,
+			version,
+			handleChange,
+			handleBlur,
+			setValues,
+			setFieldValue,
+			setFieldTouched,
+			setTouchedState,
+			setFieldError,
+			validate,
+			submit,
+			resetForm,
+			undo,
+			redo
+		]);
+		(0, react.useEffect)(() => {
+			controllerRef.current = controller;
+		}, [controller]);
+		return controller;
+	}
+	//#endregion
+	exports.Field = Field;
+	exports.Formex = Formex;
+	exports.clone = clone;
+	exports.getIn = getIn;
+	exports.isEmptyArray = isEmptyArray;
+	exports.isFunction = isFunction;
+	exports.isInteger = isInteger;
+	exports.isNaN = isNaN;
+	exports.isObject = isObject;
+	exports.setIn = setIn;
+	exports.useCreateFormex = useCreateFormex;
+	exports.useFormex = useFormex;
+});
+
+//# sourceMappingURL=index.umd.js.map