@firecms/formex 3.0.0-canary.9 → 3.0.0-canary.91

package/README.md

@@ -14,11 +14,11 @@ Formex is a lightweight, flexible library designed to simplify form handling wit
 To install Formex, you can use either npm or yarn:
 
 ```sh
-npm install your-formex-package-name
+npm install @firecms/formex
 
 # or if you're using yarn
 
-yarn add your-formex-package-name
+yarn add @firecms/formex
 ```
 
 ## Quick Start

package/dist/Field.d.ts

@@ -18,7 +18,6 @@ export interface FormexFieldProps<Value = any, FormValues extends object = any>
     field: FieldInputProps<Value>;
     form: FormexController<FormValues>;
 }
-export type FieldValidator = (value: any) => string | void | Promise<string | void>;
 export interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {
     /**
      * Component to render. Can either be a string e.g. 'select', 'input', or 'textarea', or a component.

package/dist/index.es.js

@@ -1,172 +1,296 @@
-import * as x from "react";
-import b, { useContext as Q, useState as h, useEffect as U } from "react";
-import T from "react-fast-compare";
-const D = b.createContext({}), X = () => Q(D), nt = D.Provider, st = (t) => Array.isArray(t) && t.length === 0, M = (t) => typeof t == "function", y = (t) => t !== null && typeof t == "object", Y = (t) => String(Math.floor(Number(t))) === t, ot = (t) => Object.prototype.toString.call(t) === "[object String]", ct = (t) => t !== t, ut = (t) => x.Children.count(t) === 0, it = (t) => y(t) && M(t.then), at = (t) => t && y(t) && y(t.target);
-function lt(t) {
-  if (t = t || (typeof document < "u" ? document : void 0), typeof t > "u")
+import * as React from "react";
+import React__default, { useContext, useState, useEffect } from "react";
+import equal from "react-fast-compare";
+const FormexContext = React__default.createContext({});
+const useFormex = () => useContext(FormexContext);
+const Formex = FormexContext.Provider;
+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 isString = (obj) => Object.prototype.toString.call(obj) === "[object String]";
+const isNaN = (obj) => obj !== obj;
+const isEmptyChildren = (children) => React.Children.count(children) === 0;
+const isPromise = (value) => isObject(value) && isFunction(value.then);
+const isInputEvent = (value) => value && isObject(value) && isObject(value.target);
+function getActiveElement(doc) {
+  doc = doc || (typeof document !== "undefined" ? document : void 0);
+  if (typeof doc === "undefined") {
     return null;
+  }
   try {
-    return t.activeElement || t.body;
-  } catch {
-    return t.body;
+    return doc.activeElement || doc.body;
+  } catch (e) {
+    return doc.body;
   }
 }
-function F(t, a, n, u = 0) {
-  const r = O(a);
-  for (; t && u < r.length; )
-    t = t[r[u++]];
-  return u !== r.length && !t || t === void 0 ? n : t;
+function getIn(obj, key, def, p = 0) {
+  const path = toPath(key);
+  while (obj && p < path.length) {
+    obj = obj[path[p++]];
+  }
+  if (p !== path.length && !obj) {
+    return def;
+  }
+  return obj === void 0 ? def : obj;
 }
-function Z(t, a, n) {
-  const u = V(t);
-  let r = u, e = 0;
-  const i = O(a);
-  for (; e < i.length - 1; e++) {
-    const c = i[e], f = F(t, i.slice(0, e + 1));
-    if (f && (y(f) || Array.isArray(f)))
-      r = r[c] = V(f);
-    else {
-      const d = i[e + 1];
-      r = r[c] = Y(d) && Number(d) >= 0 ? [] : {};
+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 ? [] : {};
     }
   }
-  return (e === 0 ? t : r)[i[e]] === n ? t : (n === void 0 ? delete r[i[e]] : r[i[e]] = n, e === 0 && n === void 0 && delete u[i[e]], u);
+  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 j(t, a, n = /* @__PURE__ */ new WeakMap(), u = {}) {
-  for (const r of Object.keys(t)) {
-    const e = t[r];
-    y(e) ? n.get(e) || (n.set(e, !0), u[r] = Array.isArray(e) ? [] : {}, j(e, a, n, u[r])) : u[r] = a;
+function setNestedObjectValues(object, value, visited = /* @__PURE__ */ new WeakMap(), response = {}) {
+  for (const k of Object.keys(object)) {
+    const val = object[k];
+    if (isObject(val)) {
+      if (!visited.get(val)) {
+        visited.set(val, true);
+        response[k] = Array.isArray(val) ? [] : {};
+        setNestedObjectValues(val, value, visited, response[k]);
+      }
+    } else {
+      response[k] = value;
+    }
   }
-  return u;
+  return response;
 }
-function V(t) {
-  return Array.isArray(t) ? [...t] : typeof t == "object" && t !== null ? { ...t } : t;
+function clone(value) {
+  if (Array.isArray(value)) {
+    return [...value];
+  } else if (typeof value === "object" && value !== null) {
+    return { ...value };
+  } else {
+    return value;
+  }
 }
-function O(t) {
-  return Array.isArray(t) ? t : t.replace(/\[(\d+)]/g, ".$1").replace(/^\./, "").replace(/\.$/, "").split(".");
+function toPath(value) {
+  if (Array.isArray(value)) return value;
+  return value.replace(/\[(\d+)]/g, ".$1").replace(/^\./, "").replace(/\.$/, "").split(".");
 }
-function ft({
-  validate: t,
-  name: a,
-  children: n,
-  as: u,
+function Field({
+  validate,
+  name,
+  children,
+  as: is,
   // `as` is reserved in typescript lol
   // component,
-  className: r,
-  ...e
+  className,
+  ...props
 }) {
-  const i = X(), c = tt({ name: a, ...e }, i);
-  if (M(n))
-    return n({ field: c, form: i });
-  const f = u || "input";
-  if (typeof f == "string") {
-    const { innerRef: d, ...p } = e;
-    return x.createElement(
-      f,
-      { ref: d, ...c, ...p, className: r },
-      n
+  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 x.createElement(f, { ...c, ...e, className: r }, n);
+  return React.createElement(asElement, { ...field, ...props, className }, children);
 }
-const tt = (t, a) => {
-  const n = y(t), u = n ? t.name : t, r = F(a.values, u), e = {
-    name: u,
-    value: r,
-    onChange: a.handleChange,
-    onBlur: a.handleBlur
+const getFieldProps = (nameOrOptions, formex) => {
+  const isAnObject = isObject(nameOrOptions);
+  const name = isAnObject ? nameOrOptions.name : nameOrOptions;
+  const valueState = getIn(formex.values, name);
+  const field = {
+    name,
+    value: valueState,
+    onChange: formex.handleChange,
+    onBlur: formex.handleBlur
   };
-  if (n) {
+  if (isAnObject) {
     const {
-      type: i,
-      value: c,
+      type,
+      value: valueProp,
       // value is special for checkboxes
-      as: f,
-      multiple: d
-    } = t;
-    i === "checkbox" ? c === void 0 ? e.checked = !!r : (e.checked = !!(Array.isArray(r) && ~r.indexOf(c)), e.value = c) : i === "radio" ? (e.checked = r === c, e.value = c) : f === "select" && d && (e.value = e.value || [], e.multiple = !0);
+      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 e;
+  return field;
 };
-function dt({ initialValues: t, initialErrors: a, validation: n, validateOnChange: u = !1, onSubmit: r, validateOnInitialRender: e = !1 }) {
-  const i = b.useRef(t), c = b.useRef(t), [f, d] = h(t), [p, R] = h({}), [k, g] = h(a ?? {}), [_, A] = h(!1), [I, C] = h(0), [$, S] = h(!1), [q, w] = h(!1);
-  U(() => {
-    e && E();
+function useCreateFormex({ initialValues, initialErrors, validation, validateOnChange = false, onSubmit, validateOnInitialRender = false }) {
+  const initialValuesRef = React__default.useRef(initialValues);
+  const valuesRef = React__default.useRef(initialValues);
+  const [values, setValuesInner] = useState(initialValues);
+  const [touchedState, setTouchedState] = useState({});
+  const [errors, setErrors] = useState(initialErrors ?? {});
+  const [dirty, setDirty] = useState(false);
+  const [submitCount, setSubmitCount] = useState(0);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [isValidating, setIsValidating] = useState(false);
+  useEffect(() => {
+    if (validateOnInitialRender) {
+      validate();
+    }
   }, []);
-  const W = (s) => {
-    c.current = s, d(s), A(T(i.current, s));
-  }, E = async () => {
-    w(!0);
-    const s = c.current, o = await n?.(s);
-    return g(o ?? {}), w(!1), o;
-  }, N = (s, o, l) => {
-    const m = Z(c.current, s, o);
-    c.current = m, d(m), T(F(i.current, s), o) || A(!0), l && E();
-  }, z = (s, o) => {
-    const l = { ...k };
-    o ? l[s] = o : delete l[s], g(l);
-  }, v = (s, o, l) => {
-    const m = { ...p };
-    m[s] = o, R(m), l && E();
-  }, G = (s) => {
-    const o = s.target, l = o.type === "checkbox" ? o.checked : o.value, m = o.name;
-    N(m, l, u), v(m, !0);
-  }, H = (s) => {
-    const l = s.target.name;
-    v(l, !0);
-  }, J = async (s) => {
-    s?.preventDefault(), s?.stopPropagation(), S(!0), C(I + 1);
-    const o = await n?.(c.current);
-    o && Object.keys(o).length > 0 ? g(o) : (g({}), await r?.(c.current, B.current)), S(!1);
-  }, K = (s) => {
+  const setValues = (newValues) => {
+    valuesRef.current = newValues;
+    setValuesInner(newValues);
+    setDirty(equal(initialValuesRef.current, newValues));
+  };
+  const validate = async () => {
+    setIsValidating(true);
+    const values2 = valuesRef.current;
+    const validationErrors = await validation?.(values2);
+    setErrors(validationErrors ?? {});
+    setIsValidating(false);
+    return validationErrors;
+  };
+  const setFieldValue = (key, value, shouldValidate) => {
+    const newValues = setIn(valuesRef.current, key, value);
+    valuesRef.current = newValues;
+    setValuesInner(newValues);
+    if (!equal(getIn(initialValuesRef.current, key), value)) {
+      setDirty(true);
+    }
+    if (shouldValidate) {
+      validate();
+    }
+  };
+  const setFieldError = (key, error) => {
+    const newErrors = { ...errors };
+    if (error) {
+      newErrors[key] = error;
+    } else {
+      delete newErrors[key];
+    }
+    setErrors(newErrors);
+  };
+  const setFieldTouched = (key, touched, shouldValidate) => {
+    const newTouched = { ...touchedState };
+    newTouched[key] = touched;
+    setTouchedState(newTouched);
+    if (shouldValidate) {
+      validate();
+    }
+  };
+  const handleChange = (event) => {
+    const target = event.target;
+    const value = target.type === "checkbox" ? target.checked : target.value;
+    const name = target.name;
+    setFieldValue(name, value, validateOnChange);
+    setFieldTouched(name, true);
+  };
+  const handleBlur = (event) => {
+    const target = event.target;
+    const name = target.name;
+    setFieldTouched(name, true);
+  };
+  const submit = async (e) => {
+    e?.preventDefault();
+    e?.stopPropagation();
+    setIsSubmitting(true);
+    setSubmitCount(submitCount + 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);
+  };
+  const resetForm = (props) => {
     const {
-      submitCount: o,
-      values: l,
-      errors: m,
-      touched: L
-    } = s ?? {};
-    i.current = l ?? t, c.current = l ?? t, d(l ?? t), g(m ?? {}), R(L ?? {}), A(!1), C(o ?? 0);
-  }, P = {
-    values: f,
-    initialValues: i.current,
-    handleChange: G,
-    isSubmitting: $,
-    setSubmitting: S,
-    setValues: W,
-    setFieldValue: N,
-    errors: k,
-    setFieldError: z,
-    touched: p,
-    setFieldTouched: v,
-    dirty: _,
-    setDirty: A,
-    handleSubmit: J,
-    submitCount: I,
-    setSubmitCount: C,
-    handleBlur: H,
-    validate: E,
-    isValidating: q,
-    resetForm: K
-  }, B = b.useRef(P);
-  return B.current = P, P;
+      submitCount: submitCountProp,
+      values: valuesProp,
+      errors: errorsProp,
+      touched: touchedProp
+    } = props ?? {};
+    initialValuesRef.current = valuesProp ?? initialValues;
+    valuesRef.current = valuesProp ?? initialValues;
+    setValuesInner(valuesProp ?? initialValues);
+    setErrors(errorsProp ?? {});
+    setTouchedState(touchedProp ?? {});
+    setDirty(false);
+    setSubmitCount(submitCountProp ?? 0);
+  };
+  const controller = {
+    values,
+    initialValues: initialValuesRef.current,
+    handleChange,
+    isSubmitting,
+    setSubmitting: setIsSubmitting,
+    setValues,
+    setFieldValue,
+    errors,
+    setFieldError,
+    touched: touchedState,
+    setFieldTouched,
+    dirty,
+    setDirty,
+    handleSubmit: submit,
+    submitCount,
+    setSubmitCount,
+    handleBlur,
+    validate,
+    isValidating,
+    resetForm
+  };
+  const controllerRef = React__default.useRef(controller);
+  controllerRef.current = controller;
+  return controller;
 }
 export {
-  ft as Field,
-  nt as Formex,
-  lt as getActiveElement,
-  F as getIn,
-  st as isEmptyArray,
-  ut as isEmptyChildren,
-  M as isFunction,
-  at as isInputEvent,
-  Y as isInteger,
-  ct as isNaN,
-  y as isObject,
-  it as isPromise,
-  ot as isString,
-  Z as setIn,
-  j as setNestedObjectValues,
-  dt as useCreateFormex,
-  X as useFormex
+  Field,
+  Formex,
+  getActiveElement,
+  getIn,
+  isEmptyArray,
+  isEmptyChildren,
+  isFunction,
+  isInputEvent,
+  isInteger,
+  isNaN,
+  isObject,
+  isPromise,
+  isString,
+  setIn,
+  setNestedObjectValues,
+  useCreateFormex,
+  useFormex
 };
 //# sourceMappingURL=index.es.js.map

package/dist/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../src/Formex.tsx","../src/utils.ts","../src/Field.tsx","../src/useCreateFormex.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { FormexController } from \"./types\";\n\nconst FormexContext = React.createContext<FormexController<any>>({} as any);\n\nexport const useFormex = <T extends object>() => useContext<FormexController<T>>(FormexContext);\n\nexport const Formex = FormexContext.Provider;\n","import * as React from \"react\";\n\n/** @private is the value an empty array? */\nexport const isEmptyArray = (value?: any) =>\n    Array.isArray(value) && value.length === 0;\n\n/** @private is the given object a Function? */\nexport const isFunction = (obj: any): obj is Function =>\n    typeof obj === \"function\";\n\n/** @private is the given object an Object? */\nexport const isObject = (obj: any): obj is Object =>\n    obj !== null && typeof obj === \"object\";\n\n/** @private is the given object an integer? */\nexport const isInteger = (obj: any): boolean =>\n    String(Math.floor(Number(obj))) === obj;\n\n/** @private is the given object a string? */\nexport const isString = (obj: any): obj is string =>\n    Object.prototype.toString.call(obj) === \"[object String]\";\n\n/** @private is the given object a NaN? */\n// eslint-disable-next-line no-self-compare\nexport const isNaN = (obj: any): boolean => obj !== obj;\n\n/** @private Does a React component have exactly 0 children? */\nexport const isEmptyChildren = (children: any): boolean =>\n    React.Children.count(children) === 0;\n\n/** @private is the given object/value a promise? */\nexport const isPromise = (value: any): value is PromiseLike<any> =>\n    isObject(value) && isFunction(value.then);\n\n/** @private is the given object/value a type of synthetic event? */\nexport const isInputEvent = (value: any): value is React.SyntheticEvent<any> =>\n    value && isObject(value) && isObject(value.target);\n\n/**\n * Same as document.activeElement but wraps in a try-catch block. In IE it is\n * not safe to call document.activeElement if there is nothing focused.\n *\n * The activeElement will be null only if the document or document body is not\n * yet defined.\n *\n * @param {?Document} doc Defaults to current document.\n * @return {Element | null}\n * @see https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/core/dom/getActiveElement.js\n */\nexport function getActiveElement(doc?: Document): Element | null {\n    doc = doc || (typeof document !== \"undefined\" ? document : undefined);\n    if (typeof doc === \"undefined\") {\n        return null;\n    }\n    try {\n        return doc.activeElement || doc.body;\n    } catch (e) {\n        return doc.body;\n    }\n}\n\n/**\n * Deeply get a value from an object via its path.\n */\nexport function getIn(\n    obj: any,\n    key: string | string[],\n    def?: any,\n    p = 0\n) {\n    const path = toPath(key);\n    while (obj && p < path.length) {\n        obj = obj[path[p++]];\n    }\n\n    // check if path is not in the end\n    if (p !== path.length && !obj) {\n        return def;\n    }\n\n    return obj === undefined ? def : obj;\n}\n\nexport function setIn(obj: any, path: string, value: any): any {\n    const res: any = clone(obj); // this keeps inheritance when obj is a class\n    let resVal: any = res;\n    let i = 0;\n    const pathArray = toPath(path);\n\n    for (; i < pathArray.length - 1; i++) {\n        const currentPath: string = pathArray[i];\n        const currentObj: any = getIn(obj, pathArray.slice(0, i + 1));\n\n        if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) {\n            resVal = resVal[currentPath] = clone(currentObj);\n        } else {\n            const nextPath: string = pathArray[i + 1];\n            resVal = resVal[currentPath] =\n                isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {};\n        }\n    }\n\n    // Return original object if new value is the same as current\n    if ((i === 0 ? obj : resVal)[pathArray[i]] === value) {\n        return obj;\n    }\n\n    if (value === undefined) {\n        delete resVal[pathArray[i]];\n    } else {\n        resVal[pathArray[i]] = value;\n    }\n\n    // If the path array has a single element, the loop did not run.\n    // Deleting on `resVal` had no effect in this scenario, so we delete on the result instead.\n    if (i === 0 && value === undefined) {\n        delete res[pathArray[i]];\n    }\n\n    return res;\n}\n\n/**\n * Recursively a set the same value for all keys and arrays nested object, cloning\n * @param object\n * @param value\n * @param visited\n * @param response\n */\nexport function setNestedObjectValues<T>(\n    object: any,\n    value: any,\n    visited: any = new WeakMap(),\n    response: any = {}\n): T {\n    for (const k of Object.keys(object)) {\n        const val = object[k];\n        if (isObject(val)) {\n            if (!visited.get(val)) {\n                visited.set(val, true);\n                // In order to keep array values consistent for both dot path  and\n                // bracket syntax, we need to check if this is an array so that\n                // this will output  { friends: [true] } and not { friends: { \"0\": true } }\n                response[k] = Array.isArray(val) ? [] : {};\n                setNestedObjectValues(val, value, visited, response[k]);\n            }\n        } else {\n            response[k] = value;\n        }\n    }\n\n    return response;\n}\n\nfunction clone(value: any) {\n    if (Array.isArray(value)) {\n        return [...value];\n    } else if (typeof value === \"object\" && value !== null) {\n        return { ...value };\n    } else {\n        return value; // This is for primitive types which do not need cloning.\n    }\n}\n\nfunction toPath(value: string | string[]) {\n    if (Array.isArray(value)) return value; // Already in path array form.\n    // Replace brackets with dots, remove leading/trailing dots, then split by dot.\n    return value.replace(/\\[(\\d+)]/g, \".$1\").replace(/^\\./, \"\").replace(/\\.$/, \"\").split(\".\");\n}\n","import * as React from \"react\";\nimport { useFormex } from \"./Formex\";\nimport { getIn, isFunction, isObject } from \"./utils\";\nimport { FormexController } from \"./types\";\n\nexport interface FieldInputProps<Value> {\n    /** Value of the field */\n    value: Value;\n    /** Name of the field */\n    name: string;\n    /** Multiple select? */\n    multiple?: boolean;\n    /** Is the field checked? */\n    checked?: boolean;\n    /** Change event handler */\n    onChange: (event: React.SyntheticEvent) => void,\n    /** Blur event handler */\n    onBlur: (event: React.FocusEvent) => void,\n}\n\nexport interface FormexFieldProps<Value = any, FormValues extends object = any> {\n    field: FieldInputProps<Value>;\n    form: FormexController<FormValues>;\n}\n\nexport type FieldValidator = (\n    value: any\n) => string | void | Promise<string | void>;\n\nexport interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {\n\n    /**\n     * Component to render. Can either be a string e.g. 'select', 'input', or 'textarea', or a component.\n     */\n    as?:\n        | C\n        | string\n        | React.ForwardRefExoticComponent<any>;\n\n    /**\n     * Children render function <Field name>{props => ...}</Field>)\n     */\n    children?: ((props: FormexFieldProps<Value>) => React.ReactNode) | React.ReactNode;\n\n    /**\n     * Validate a single field value independently\n     */\n    // validate?: FieldValidator;\n\n    /**\n     * Used for 'select' and related input types.\n     */\n    multiple?: boolean;\n\n    /**\n     * Field name\n     */\n    name: string;\n\n    /** HTML input type */\n    type?: string;\n\n    /** Field value */\n    value?: any;\n\n    /** Inner ref */\n    innerRef?: (instance: any) => void;\n\n}\n\nexport type FieldProps<T, C extends React.ElementType | undefined> = {\n    as?: C;\n} & (C extends React.ElementType ? (React.ComponentProps<C> & FieldConfig<T, C>) : FieldConfig<T, C>);\n\nexport function Field<T, C extends React.ElementType | undefined = undefined>({\n                                                                                  validate,\n                                                                                  name,\n                                                                                  children,\n                                                                                  as: is, // `as` is reserved in typescript lol\n                                                                                  // component,\n                                                                                  className,\n                                                                                  ...props\n                                                                              }: FieldProps<T, C>) {\n    const formex = useFormex();\n\n    const field = getFieldProps({ name, ...props }, formex);\n\n    if (isFunction(children)) {\n        return children({ field, form: formex });\n    }\n\n    // if (component) {\n    //     if (typeof component === \"string\") {\n    //         const { innerRef, ...rest } = props;\n    //         return React.createElement(\n    //             component,\n    //             { ref: innerRef, ...field, ...rest, className },\n    //             children\n    //         );\n    //     }\n    //     return React.createElement(\n    //         component,\n    //         { field, form: formex, ...props, className },\n    //         children\n    //     );\n    // }\n\n    // default to input here so we can check for both `as` and `children` above\n    const asElement = is || \"input\";\n\n    if (typeof asElement === \"string\") {\n        const { innerRef, ...rest } = props;\n        return React.createElement(\n            asElement,\n            { ref: innerRef, ...field, ...rest, className },\n            children\n        );\n    }\n\n    return React.createElement(asElement, { ...field, ...props, className }, children);\n}\n\nconst getFieldProps = (nameOrOptions: string | FieldConfig<any>, formex: FormexController<any>): FieldInputProps<any> => {\n    const isAnObject = isObject(nameOrOptions);\n    const name = isAnObject\n        ? (nameOrOptions as FieldConfig<any>).name\n        : nameOrOptions;\n    const valueState = getIn(formex.values, name);\n\n    const field: FieldInputProps<any> = {\n        name,\n        value: valueState,\n        onChange: formex.handleChange,\n        onBlur: formex.handleBlur,\n    };\n    if (isAnObject) {\n        const {\n            type,\n            value: valueProp, // value is special for checkboxes\n            as: is,\n            multiple,\n        } = nameOrOptions as FieldConfig<any>;\n\n        if (type === \"checkbox\") {\n            if (valueProp === undefined) {\n                field.checked = !!valueState;\n            } else {\n                field.checked = !!(\n                    Array.isArray(valueState) && ~valueState.indexOf(valueProp)\n                );\n                field.value = valueProp;\n            }\n        } else if (type === \"radio\") {\n            field.checked = valueState === valueProp;\n            field.value = valueProp;\n        } else if (is === \"select\" && multiple) {\n            field.value = field.value || [];\n            field.multiple = true;\n        }\n    }\n    return field;\n};\n","import React, { FormEvent, useEffect, useState } from \"react\";\nimport { getIn, setIn } from \"./utils\";\nimport equal from \"react-fast-compare\"\n\nimport { FormexController, FormexResetProps } from \"./types\";\n\nexport function useCreateFormex<T extends object>({ initialValues, initialErrors, validation, validateOnChange = false, onSubmit, validateOnInitialRender = false }: {\n    initialValues: T,\n    initialErrors?: Record<string, string>,\n    validateOnChange?: boolean,\n    validateOnInitialRender?: boolean,\n    validation?: (values: T) => Record<string, string> | Promise<Record<string, string>> | undefined | void,\n    onSubmit?: (values: T, controller: FormexController<T>) => void | Promise<void>\n}): FormexController<T> {\n\n    const initialValuesRef = React.useRef<T>(initialValues);\n    const valuesRef = React.useRef<T>(initialValues);\n\n    const [values, setValuesInner] = useState<T>(initialValues);\n    const [touchedState, setTouchedState] = useState<Record<string, boolean>>({});\n    const [errors, setErrors] = useState<Record<string, string>>(initialErrors ?? {});\n    const [dirty, setDirty] = useState(false);\n    const [submitCount, setSubmitCount] = useState(0);\n    const [isSubmitting, setIsSubmitting] = useState(false);\n    const [isValidating, setIsValidating] = useState(false);\n\n    useEffect(() => {\n        if (validateOnInitialRender) {\n            validate();\n        }\n    }, []);\n\n    const setValues = (newValues: T) => {\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        setDirty(equal(initialValuesRef.current, newValues));\n    }\n\n    const validate = async () => {\n        setIsValidating(true);\n        const values = valuesRef.current;\n        const validationErrors = await validation?.(values);\n        setErrors(validationErrors ?? {});\n        setIsValidating(false);\n        return validationErrors;\n    }\n\n    const setFieldValue = (key: string, value: any, shouldValidate?: boolean) => {\n        const newValues = setIn(valuesRef.current, key, value);\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        if (!equal(getIn(initialValuesRef.current, key), value)) {\n            setDirty(true);\n        }\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const setFieldError = (key: string, error: string | undefined) => {\n        const newErrors = { ...errors };\n        if (error) {\n            newErrors[key] = error;\n        } else {\n            delete newErrors[key];\n        }\n        setErrors(newErrors);\n    }\n\n    const setFieldTouched = (key: string, touched: boolean, shouldValidate?: boolean | undefined) => {\n        const newTouched = { ...touchedState };\n        newTouched[key] = touched;\n        setTouchedState(newTouched);\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const handleChange = (event: React.SyntheticEvent) => {\n        const target = event.target as HTMLInputElement;\n        const value = target.type === \"checkbox\" ? target.checked : target.value;\n        const name = target.name;\n        setFieldValue(name, value, validateOnChange);\n        setFieldTouched(name, true);\n    }\n\n    const handleBlur = (event: React.FocusEvent) => {\n        const target = event.target as HTMLInputElement;\n        const name = target.name;\n        setFieldTouched(name, true);\n    }\n\n    const submit = async (e?: FormEvent<HTMLFormElement>) => {\n        e?.preventDefault();\n        e?.stopPropagation();\n        setIsSubmitting(true);\n        setSubmitCount(submitCount + 1);\n        const validationErrors = await validation?.(valuesRef.current);\n        if (validationErrors && Object.keys(validationErrors).length > 0) {\n            setErrors(validationErrors);\n        } else {\n            setErrors({});\n            await onSubmit?.(valuesRef.current, controllerRef.current);\n        }\n        setIsSubmitting(false);\n    }\n\n    const resetForm = (props?: FormexResetProps<T>) => {\n        const {\n            submitCount: submitCountProp,\n            values: valuesProp,\n            errors: errorsProp,\n            touched: touchedProp\n        } = props ?? {};\n        initialValuesRef.current = valuesProp ?? initialValues;\n        valuesRef.current = valuesProp ?? initialValues;\n        setValuesInner(valuesProp ?? initialValues);\n        setErrors(errorsProp ?? {});\n        setTouchedState(touchedProp ?? {});\n        setDirty(false);\n        setSubmitCount(submitCountProp ?? 0);\n    }\n\n    const controller: FormexController<T> = {\n        values,\n        initialValues: initialValuesRef.current,\n        handleChange,\n        isSubmitting,\n        setSubmitting: setIsSubmitting,\n        setValues,\n        setFieldValue,\n        errors,\n        setFieldError,\n        touched: touchedState,\n        setFieldTouched,\n        dirty,\n        setDirty,\n        handleSubmit: submit,\n        submitCount,\n        setSubmitCount,\n        handleBlur,\n        validate,\n        isValidating,\n        resetForm\n    };\n\n    const controllerRef = React.useRef<FormexController<T>>(controller);\n    controllerRef.current = controller;\n    return controller\n}\n"],"names":["FormexContext","React","useFormex","useContext","Formex","isEmptyArray","value","isFunction","obj","isObject","isInteger","isString","isNaN","isEmptyChildren","children","isPromise","isInputEvent","getActiveElement","doc","getIn","key","def","p","path","toPath","setIn","res","clone","resVal","i","pathArray","currentPath","currentObj","nextPath","setNestedObjectValues","object","visited","response","k","val","Field","validate","name","is","className","props","formex","field","getFieldProps","asElement","innerRef","rest","nameOrOptions","isAnObject","valueState","type","valueProp","multiple","useCreateFormex","initialValues","initialErrors","validation","validateOnChange","onSubmit","validateOnInitialRender","initialValuesRef","valuesRef","values","setValuesInner","useState","touchedState","setTouchedState","errors","setErrors","dirty","setDirty","submitCount","setSubmitCount","isSubmitting","setIsSubmitting","isValidating","setIsValidating","useEffect","setValues","newValues","equal","validationErrors","setFieldValue","shouldValidate","setFieldError","error","newErrors","setFieldTouched","touched","newTouched","handleChange","event","target","handleBlur","submit","e","controllerRef","resetForm","submitCountProp","valuesProp","errorsProp","touchedProp","controller"],"mappings":";;;AAGA,MAAMA,IAAgBC,EAAM,cAAqC,CAAA,CAAS,GAE7DC,IAAY,MAAwBC,EAAgCH,CAAa,GAEjFI,KAASJ,EAAc,UCJvBK,KAAe,CAACC,MACzB,MAAM,QAAQA,CAAK,KAAKA,EAAM,WAAW,GAGhCC,IAAa,CAACC,MACvB,OAAOA,KAAQ,YAGNC,IAAW,CAACD,MACrBA,MAAQ,QAAQ,OAAOA,KAAQ,UAGtBE,IAAY,CAACF,MACtB,OAAO,KAAK,MAAM,OAAOA,CAAG,CAAC,CAAC,MAAMA,GAG3BG,KAAW,CAACH,MACrB,OAAO,UAAU,SAAS,KAAKA,CAAG,MAAM,mBAI/BI,KAAQ,CAACJ,MAAsBA,MAAQA,GAGvCK,KAAkB,CAACC,MAC5Bb,EAAM,SAAS,MAAMa,CAAQ,MAAM,GAG1BC,KAAY,CAACT,MACtBG,EAASH,CAAK,KAAKC,EAAWD,EAAM,IAAI,GAG/BU,KAAe,CAACV,MACzBA,KAASG,EAASH,CAAK,KAAKG,EAASH,EAAM,MAAM;AAa9C,SAASW,GAAiBC,GAAgC;AAEzD,MADJA,IAAMA,MAAQ,OAAO,WAAa,MAAc,WAAW,SACvD,OAAOA,IAAQ;AACR,WAAA;AAEP,MAAA;AACO,WAAAA,EAAI,iBAAiBA,EAAI;AAAA,UACxB;AACR,WAAOA,EAAI;AAAA,EACf;AACJ;AAKO,SAASC,EACZX,GACAY,GACAC,GACAC,IAAI,GACN;AACQ,QAAAC,IAAOC,EAAOJ,CAAG;AAChB,SAAAZ,KAAOc,IAAIC,EAAK;AACb,IAAAf,IAAAA,EAAIe,EAAKD,GAAG,CAAC;AAIvB,SAAIA,MAAMC,EAAK,UAAU,CAACf,KAInBA,MAAQ,SAHJa,IAGsBb;AACrC;AAEgB,SAAAiB,EAAMjB,GAAUe,GAAcjB,GAAiB;AACrD,QAAAoB,IAAWC,EAAMnB,CAAG;AAC1B,MAAIoB,IAAcF,GACdG,IAAI;AACF,QAAAC,IAAYN,EAAOD,CAAI;AAE7B,SAAOM,IAAIC,EAAU,SAAS,GAAGD,KAAK;AAC5B,UAAAE,IAAsBD,EAAUD,CAAC,GACjCG,IAAkBb,EAAMX,GAAKsB,EAAU,MAAM,GAAGD,IAAI,CAAC,CAAC;AAE5D,QAAIG,MAAevB,EAASuB,CAAU,KAAK,MAAM,QAAQA,CAAU;AAC/D,MAAAJ,IAASA,EAAOG,CAAW,IAAIJ,EAAMK,CAAU;AAAA,SAC5C;AACG,YAAAC,IAAmBH,EAAUD,IAAI,CAAC;AACxC,MAAAD,IAASA,EAAOG,CAAW,IACvBrB,EAAUuB,CAAQ,KAAK,OAAOA,CAAQ,KAAK,IAAI,CAAA,IAAK,CAAA;AAAA,IAC5D;AAAA,EACJ;AAGK,UAAAJ,MAAM,IAAIrB,IAAMoB,GAAQE,EAAUD,CAAC,CAAC,MAAMvB,IACpCE,KAGPF,MAAU,SACH,OAAAsB,EAAOE,EAAUD,CAAC,CAAC,IAEnBD,EAAAE,EAAUD,CAAC,CAAC,IAAIvB,GAKvBuB,MAAM,KAAKvB,MAAU,UACd,OAAAoB,EAAII,EAAUD,CAAC,CAAC,GAGpBH;AACX;AASgB,SAAAQ,EACZC,GACA7B,GACA8B,wBAAmB,QAAQ,GAC3BC,IAAgB,IACf;AACD,aAAWC,KAAK,OAAO,KAAKH,CAAM,GAAG;AAC3B,UAAAI,IAAMJ,EAAOG,CAAC;AAChB,IAAA7B,EAAS8B,CAAG,IACPH,EAAQ,IAAIG,CAAG,MACRH,EAAA,IAAIG,GAAK,EAAI,GAIZF,EAAAC,CAAC,IAAI,MAAM,QAAQC,CAAG,IAAI,KAAK,IACxCL,EAAsBK,GAAKjC,GAAO8B,GAASC,EAASC,CAAC,CAAC,KAG1DD,EAASC,CAAC,IAAIhC;AAAA,EAEtB;AAEO,SAAA+B;AACX;AAEA,SAASV,EAAMrB,GAAY;AACnB,SAAA,MAAM,QAAQA,CAAK,IACZ,CAAC,GAAGA,CAAK,IACT,OAAOA,KAAU,YAAYA,MAAU,OACvC,EAAE,GAAGA,MAELA;AAEf;AAEA,SAASkB,EAAOlB,GAA0B;AAClC,SAAA,MAAM,QAAQA,CAAK,IAAUA,IAE1BA,EAAM,QAAQ,aAAa,KAAK,EAAE,QAAQ,OAAO,EAAE,EAAE,QAAQ,OAAO,EAAE,EAAE,MAAM,GAAG;AAC5F;AC9FO,SAASkC,GAA8D;AAAA,EACI,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAA5B;AAAA,EACA,IAAI6B;AAAA;AAAA;AAAA,EAEJ,WAAAC;AAAA,EACA,GAAGC;AACP,GAAqB;AAC/F,QAAMC,IAAS5C,KAET6C,IAAQC,GAAc,EAAE,MAAAN,GAAM,GAAGG,EAAA,GAASC,CAAM;AAElD,MAAAvC,EAAWO,CAAQ;AACnB,WAAOA,EAAS,EAAE,OAAAiC,GAAO,MAAMD,EAAQ,CAAA;AAoB3C,QAAMG,IAAYN,KAAM;AAEpB,MAAA,OAAOM,KAAc,UAAU;AAC/B,UAAM,EAAE,UAAAC,GAAU,GAAGC,EAAA,IAASN;AAC9B,WAAO5C,EAAM;AAAA,MACTgD;AAAA,MACA,EAAE,KAAKC,GAAU,GAAGH,GAAO,GAAGI,GAAM,WAAAP,EAAU;AAAA,MAC9C9B;AAAA,IAAA;AAAA,EAER;AAEO,SAAAb,EAAM,cAAcgD,GAAW,EAAE,GAAGF,GAAO,GAAGF,GAAO,WAAAD,KAAa9B,CAAQ;AACrF;AAEA,MAAMkC,KAAgB,CAACI,GAA0CN,MAAwD;AAC/G,QAAAO,IAAa5C,EAAS2C,CAAa,GACnCV,IAAOW,IACND,EAAmC,OACpCA,GACAE,IAAanC,EAAM2B,EAAO,QAAQJ,CAAI,GAEtCK,IAA8B;AAAA,IAChC,MAAAL;AAAA,IACA,OAAOY;AAAA,IACP,UAAUR,EAAO;AAAA,IACjB,QAAQA,EAAO;AAAA,EAAA;AAEnB,MAAIO,GAAY;AACN,UAAA;AAAA,MACF,MAAAE;AAAA,MACA,OAAOC;AAAA;AAAA,MACP,IAAIb;AAAA,MACJ,UAAAc;AAAA,IACA,IAAAL;AAEJ,IAAIG,MAAS,aACLC,MAAc,SACRT,EAAA,UAAU,CAAC,CAACO,KAEZP,EAAA,UAAU,CAAC,EACb,MAAM,QAAQO,CAAU,KAAK,CAACA,EAAW,QAAQE,CAAS,IAE9DT,EAAM,QAAQS,KAEXD,MAAS,WAChBR,EAAM,UAAUO,MAAeE,GAC/BT,EAAM,QAAQS,KACPb,MAAO,YAAYc,MACpBV,EAAA,QAAQA,EAAM,SAAS,CAAA,GAC7BA,EAAM,WAAW;AAAA,EAEzB;AACO,SAAAA;AACX;AC3JgB,SAAAW,GAAkC,EAAE,eAAAC,GAAe,eAAAC,GAAe,YAAAC,GAAY,kBAAAC,IAAmB,IAAO,UAAAC,GAAU,yBAAAC,IAA0B,MAOpI;AAEd,QAAAC,IAAmBhE,EAAM,OAAU0D,CAAa,GAChDO,IAAYjE,EAAM,OAAU0D,CAAa,GAEzC,CAACQ,GAAQC,CAAc,IAAIC,EAAYV,CAAa,GACpD,CAACW,GAAcC,CAAe,IAAIF,EAAkC,CAAE,CAAA,GACtE,CAACG,GAAQC,CAAS,IAAIJ,EAAiCT,KAAiB,CAAA,CAAE,GAC1E,CAACc,GAAOC,CAAQ,IAAIN,EAAS,EAAK,GAClC,CAACO,GAAaC,CAAc,IAAIR,EAAS,CAAC,GAC1C,CAACS,GAAcC,CAAe,IAAIV,EAAS,EAAK,GAChD,CAACW,GAAcC,CAAe,IAAIZ,EAAS,EAAK;AAEtD,EAAAa,EAAU,MAAM;AACZ,IAAIlB,KACSvB;EAEjB,GAAG,CAAE,CAAA;AAEC,QAAA0C,IAAY,CAACC,MAAiB;AAChC,IAAAlB,EAAU,UAAUkB,GACpBhB,EAAegB,CAAS,GACxBT,EAASU,EAAMpB,EAAiB,SAASmB,CAAS,CAAC;AAAA,EAAA,GAGjD3C,IAAW,YAAY;AACzB,IAAAwC,EAAgB,EAAI;AACpB,UAAMd,IAASD,EAAU,SACnBoB,IAAmB,MAAMzB,IAAaM,CAAM;AACxC,WAAAM,EAAAa,KAAoB,CAAA,CAAE,GAChCL,EAAgB,EAAK,GACdK;AAAA,EAAA,GAGLC,IAAgB,CAACnE,GAAad,GAAYkF,MAA6B;AACzE,UAAMJ,IAAY3D,EAAMyC,EAAU,SAAS9C,GAAKd,CAAK;AACrD,IAAA4D,EAAU,UAAUkB,GACpBhB,EAAegB,CAAS,GACnBC,EAAMlE,EAAM8C,EAAiB,SAAS7C,CAAG,GAAGd,CAAK,KAClDqE,EAAS,EAAI,GAEba,KACS/C;EACb,GAGEgD,IAAgB,CAACrE,GAAasE,MAA8B;AACxD,UAAAC,IAAY,EAAE,GAAGnB;AACvB,IAAIkB,IACAC,EAAUvE,CAAG,IAAIsE,IAEjB,OAAOC,EAAUvE,CAAG,GAExBqD,EAAUkB,CAAS;AAAA,EAAA,GAGjBC,IAAkB,CAACxE,GAAayE,GAAkBL,MAAyC;AACvF,UAAAM,IAAa,EAAE,GAAGxB;AACxB,IAAAwB,EAAW1E,CAAG,IAAIyE,GAClBtB,EAAgBuB,CAAU,GACtBN,KACS/C;EACb,GAGEsD,IAAe,CAACC,MAAgC;AAClD,UAAMC,IAASD,EAAM,QACf1F,IAAQ2F,EAAO,SAAS,aAAaA,EAAO,UAAUA,EAAO,OAC7DvD,IAAOuD,EAAO;AACN,IAAAV,EAAA7C,GAAMpC,GAAOwD,CAAgB,GAC3C8B,EAAgBlD,GAAM,EAAI;AAAA,EAAA,GAGxBwD,IAAa,CAACF,MAA4B;AAE5C,UAAMtD,IADSsD,EAAM,OACD;AACpB,IAAAJ,EAAgBlD,GAAM,EAAI;AAAA,EAAA,GAGxByD,IAAS,OAAOC,MAAmC;AACrD,IAAAA,GAAG,eAAe,GAClBA,GAAG,gBAAgB,GACnBrB,EAAgB,EAAI,GACpBF,EAAeD,IAAc,CAAC;AAC9B,UAAMU,IAAmB,MAAMzB,IAAaK,EAAU,OAAO;AAC7D,IAAIoB,KAAoB,OAAO,KAAKA,CAAgB,EAAE,SAAS,IAC3Db,EAAUa,CAAgB,KAE1Bb,EAAU,CAAE,CAAA,GACZ,MAAMV,IAAWG,EAAU,SAASmC,EAAc,OAAO,IAE7DtB,EAAgB,EAAK;AAAA,EAAA,GAGnBuB,IAAY,CAACzD,MAAgC;AACzC,UAAA;AAAA,MACF,aAAa0D;AAAA,MACb,QAAQC;AAAA,MACR,QAAQC;AAAA,MACR,SAASC;AAAA,IAAA,IACT7D,KAAS,CAAA;AACb,IAAAoB,EAAiB,UAAUuC,KAAc7C,GACzCO,EAAU,UAAUsC,KAAc7C,GAClCS,EAAeoC,KAAc7C,CAAa,GAChCc,EAAAgC,KAAc,CAAA,CAAE,GACVlC,EAAAmC,KAAe,CAAA,CAAE,GACjC/B,EAAS,EAAK,GACdE,EAAe0B,KAAmB,CAAC;AAAA,EAAA,GAGjCI,IAAkC;AAAA,IACpC,QAAAxC;AAAA,IACA,eAAeF,EAAiB;AAAA,IAChC,cAAA8B;AAAA,IACA,cAAAjB;AAAA,IACA,eAAeC;AAAA,IACf,WAAAI;AAAA,IACA,eAAAI;AAAA,IACA,QAAAf;AAAA,IACA,eAAAiB;AAAA,IACA,SAASnB;AAAA,IACT,iBAAAsB;AAAA,IACA,OAAAlB;AAAA,IACA,UAAAC;AAAA,IACA,cAAcwB;AAAA,IACd,aAAAvB;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAqB;AAAA,IACA,UAAAzD;AAAA,IACA,cAAAuC;AAAA,IACA,WAAAsB;AAAA,EAAA,GAGED,IAAgBpG,EAAM,OAA4B0G,CAAU;AAClE,SAAAN,EAAc,UAAUM,GACjBA;AACX;"}
+{"version":3,"file":"index.es.js","sources":["../src/Formex.tsx","../src/utils.ts","../src/Field.tsx","../src/useCreateFormex.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { FormexController } from \"./types\";\n\nconst FormexContext = React.createContext<FormexController<any>>({} as any);\n\nexport const useFormex = <T extends object>() => useContext<FormexController<T>>(FormexContext);\n\nexport const Formex = FormexContext.Provider;\n","import * as React from \"react\";\n\n/** @private is the value an empty array? */\nexport const isEmptyArray = (value?: any) =>\n    Array.isArray(value) && value.length === 0;\n\n/** @private is the given object a Function? */\nexport const isFunction = (obj: any): obj is Function =>\n    typeof obj === \"function\";\n\n/** @private is the given object an Object? */\nexport const isObject = (obj: any): obj is Object =>\n    obj !== null && typeof obj === \"object\";\n\n/** @private is the given object an integer? */\nexport const isInteger = (obj: any): boolean =>\n    String(Math.floor(Number(obj))) === obj;\n\n/** @private is the given object a string? */\nexport const isString = (obj: any): obj is string =>\n    Object.prototype.toString.call(obj) === \"[object String]\";\n\n/** @private is the given object a NaN? */\n// eslint-disable-next-line no-self-compare\nexport const isNaN = (obj: any): boolean => obj !== obj;\n\n/** @private Does a React component have exactly 0 children? */\nexport const isEmptyChildren = (children: any): boolean =>\n    React.Children.count(children) === 0;\n\n/** @private is the given object/value a promise? */\nexport const isPromise = (value: any): value is PromiseLike<any> =>\n    isObject(value) && isFunction(value.then);\n\n/** @private is the given object/value a type of synthetic event? */\nexport const isInputEvent = (value: any): value is React.SyntheticEvent<any> =>\n    value && isObject(value) && isObject(value.target);\n\n/**\n * Same as document.activeElement but wraps in a try-catch block. In IE it is\n * not safe to call document.activeElement if there is nothing focused.\n *\n * The activeElement will be null only if the document or document body is not\n * yet defined.\n *\n * @param {?Document} doc Defaults to current document.\n * @return {Element | null}\n * @see https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/core/dom/getActiveElement.js\n */\nexport function getActiveElement(doc?: Document): Element | null {\n    doc = doc || (typeof document !== \"undefined\" ? document : undefined);\n    if (typeof doc === \"undefined\") {\n        return null;\n    }\n    try {\n        return doc.activeElement || doc.body;\n    } catch (e) {\n        return doc.body;\n    }\n}\n\n/**\n * Deeply get a value from an object via its path.\n */\nexport function getIn(\n    obj: any,\n    key: string | string[],\n    def?: any,\n    p = 0\n) {\n    const path = toPath(key);\n    while (obj && p < path.length) {\n        obj = obj[path[p++]];\n    }\n\n    // check if path is not in the end\n    if (p !== path.length && !obj) {\n        return def;\n    }\n\n    return obj === undefined ? def : obj;\n}\n\nexport function setIn(obj: any, path: string, value: any): any {\n    const res: any = clone(obj); // this keeps inheritance when obj is a class\n    let resVal: any = res;\n    let i = 0;\n    const pathArray = toPath(path);\n\n    for (; i < pathArray.length - 1; i++) {\n        const currentPath: string = pathArray[i];\n        const currentObj: any = getIn(obj, pathArray.slice(0, i + 1));\n\n        if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) {\n            resVal = resVal[currentPath] = clone(currentObj);\n        } else {\n            const nextPath: string = pathArray[i + 1];\n            resVal = resVal[currentPath] =\n                isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {};\n        }\n    }\n\n    // Return original object if new value is the same as current\n    if ((i === 0 ? obj : resVal)[pathArray[i]] === value) {\n        return obj;\n    }\n\n    if (value === undefined) {\n        delete resVal[pathArray[i]];\n    } else {\n        resVal[pathArray[i]] = value;\n    }\n\n    // If the path array has a single element, the loop did not run.\n    // Deleting on `resVal` had no effect in this scenario, so we delete on the result instead.\n    if (i === 0 && value === undefined) {\n        delete res[pathArray[i]];\n    }\n\n    return res;\n}\n\n/**\n * Recursively a set the same value for all keys and arrays nested object, cloning\n * @param object\n * @param value\n * @param visited\n * @param response\n */\nexport function setNestedObjectValues<T>(\n    object: any,\n    value: any,\n    visited: any = new WeakMap(),\n    response: any = {}\n): T {\n    for (const k of Object.keys(object)) {\n        const val = object[k];\n        if (isObject(val)) {\n            if (!visited.get(val)) {\n                visited.set(val, true);\n                // In order to keep array values consistent for both dot path  and\n                // bracket syntax, we need to check if this is an array so that\n                // this will output  { friends: [true] } and not { friends: { \"0\": true } }\n                response[k] = Array.isArray(val) ? [] : {};\n                setNestedObjectValues(val, value, visited, response[k]);\n            }\n        } else {\n            response[k] = value;\n        }\n    }\n\n    return response;\n}\n\nfunction clone(value: any) {\n    if (Array.isArray(value)) {\n        return [...value];\n    } else if (typeof value === \"object\" && value !== null) {\n        return { ...value };\n    } else {\n        return value; // This is for primitive types which do not need cloning.\n    }\n}\n\nfunction toPath(value: string | string[]) {\n    if (Array.isArray(value)) return value; // Already in path array form.\n    // Replace brackets with dots, remove leading/trailing dots, then split by dot.\n    return value.replace(/\\[(\\d+)]/g, \".$1\").replace(/^\\./, \"\").replace(/\\.$/, \"\").split(\".\");\n}\n","import * as React from \"react\";\nimport { useFormex } from \"./Formex\";\nimport { getIn, isFunction, isObject } from \"./utils\";\nimport { FormexController } from \"./types\";\n\nexport interface FieldInputProps<Value> {\n    /** Value of the field */\n    value: Value;\n    /** Name of the field */\n    name: string;\n    /** Multiple select? */\n    multiple?: boolean;\n    /** Is the field checked? */\n    checked?: boolean;\n    /** Change event handler */\n    onChange: (event: React.SyntheticEvent) => void,\n    /** Blur event handler */\n    onBlur: (event: React.FocusEvent) => void,\n}\n\nexport interface FormexFieldProps<Value = any, FormValues extends object = any> {\n    field: FieldInputProps<Value>;\n    form: FormexController<FormValues>;\n}\n\nexport interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {\n\n    /**\n     * Component to render. Can either be a string e.g. 'select', 'input', or 'textarea', or a component.\n     */\n    as?:\n        | C\n        | string\n        | React.ForwardRefExoticComponent<any>;\n\n    /**\n     * Children render function <Field name>{props => ...}</Field>)\n     */\n    children?: ((props: FormexFieldProps<Value>) => React.ReactNode) | React.ReactNode;\n\n    /**\n     * Validate a single field value independently\n     */\n    // validate?: FieldValidator;\n\n    /**\n     * Used for 'select' and related input types.\n     */\n    multiple?: boolean;\n\n    /**\n     * Field name\n     */\n    name: string;\n\n    /** HTML input type */\n    type?: string;\n\n    /** Field value */\n    value?: any;\n\n    /** Inner ref */\n    innerRef?: (instance: any) => void;\n\n}\n\nexport type FieldProps<T, C extends React.ElementType | undefined> = {\n    as?: C;\n} & (C extends React.ElementType ? (React.ComponentProps<C> & FieldConfig<T, C>) : FieldConfig<T, C>);\n\nexport function Field<T, C extends React.ElementType | undefined = undefined>({\n                                                                                  validate,\n                                                                                  name,\n                                                                                  children,\n                                                                                  as: is, // `as` is reserved in typescript lol\n                                                                                  // component,\n                                                                                  className,\n                                                                                  ...props\n                                                                              }: FieldProps<T, C>) {\n    const formex = useFormex();\n\n    const field = getFieldProps({ name, ...props }, formex);\n\n    if (isFunction(children)) {\n        return children({ field, form: formex });\n    }\n\n    // if (component) {\n    //     if (typeof component === \"string\") {\n    //         const { innerRef, ...rest } = props;\n    //         return React.createElement(\n    //             component,\n    //             { ref: innerRef, ...field, ...rest, className },\n    //             children\n    //         );\n    //     }\n    //     return React.createElement(\n    //         component,\n    //         { field, form: formex, ...props, className },\n    //         children\n    //     );\n    // }\n\n    // default to input here so we can check for both `as` and `children` above\n    const asElement = is || \"input\";\n\n    if (typeof asElement === \"string\") {\n        const { innerRef, ...rest } = props;\n        return React.createElement(\n            asElement,\n            { ref: innerRef, ...field, ...rest, className },\n            children\n        );\n    }\n\n    return React.createElement(asElement, { ...field, ...props, className }, children);\n}\n\nconst getFieldProps = (nameOrOptions: string | FieldConfig<any>, formex: FormexController<any>): FieldInputProps<any> => {\n    const isAnObject = isObject(nameOrOptions);\n    const name = isAnObject\n        ? (nameOrOptions as FieldConfig<any>).name\n        : nameOrOptions;\n    const valueState = getIn(formex.values, name);\n\n    const field: FieldInputProps<any> = {\n        name,\n        value: valueState,\n        onChange: formex.handleChange,\n        onBlur: formex.handleBlur,\n    };\n    if (isAnObject) {\n        const {\n            type,\n            value: valueProp, // value is special for checkboxes\n            as: is,\n            multiple,\n        } = nameOrOptions as FieldConfig<any>;\n\n        if (type === \"checkbox\") {\n            if (valueProp === undefined) {\n                field.checked = !!valueState;\n            } else {\n                field.checked = !!(\n                    Array.isArray(valueState) && ~valueState.indexOf(valueProp)\n                );\n                field.value = valueProp;\n            }\n        } else if (type === \"radio\") {\n            field.checked = valueState === valueProp;\n            field.value = valueProp;\n        } else if (is === \"select\" && multiple) {\n            field.value = field.value || [];\n            field.multiple = true;\n        }\n    }\n    return field;\n};\n","import React, { FormEvent, useEffect, useState } from \"react\";\nimport { getIn, setIn } from \"./utils\";\nimport equal from \"react-fast-compare\"\n\nimport { FormexController, FormexResetProps } from \"./types\";\n\nexport function useCreateFormex<T extends object>({ initialValues, initialErrors, validation, validateOnChange = false, onSubmit, validateOnInitialRender = false }: {\n    initialValues: T,\n    initialErrors?: Record<string, string>,\n    validateOnChange?: boolean,\n    validateOnInitialRender?: boolean,\n    validation?: (values: T) => Record<string, string> | Promise<Record<string, string>> | undefined | void,\n    onSubmit?: (values: T, controller: FormexController<T>) => void | Promise<void>\n}): FormexController<T> {\n\n    const initialValuesRef = React.useRef<T>(initialValues);\n    const valuesRef = React.useRef<T>(initialValues);\n\n    const [values, setValuesInner] = useState<T>(initialValues);\n    const [touchedState, setTouchedState] = useState<Record<string, boolean>>({});\n    const [errors, setErrors] = useState<Record<string, string>>(initialErrors ?? {});\n    const [dirty, setDirty] = useState(false);\n    const [submitCount, setSubmitCount] = useState(0);\n    const [isSubmitting, setIsSubmitting] = useState(false);\n    const [isValidating, setIsValidating] = useState(false);\n\n    useEffect(() => {\n        if (validateOnInitialRender) {\n            validate();\n        }\n    }, []);\n\n    const setValues = (newValues: T) => {\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        setDirty(equal(initialValuesRef.current, newValues));\n    }\n\n    const validate = async () => {\n        setIsValidating(true);\n        const values = valuesRef.current;\n        const validationErrors = await validation?.(values);\n        setErrors(validationErrors ?? {});\n        setIsValidating(false);\n        return validationErrors;\n    }\n\n    const setFieldValue = (key: string, value: any, shouldValidate?: boolean) => {\n        const newValues = setIn(valuesRef.current, key, value);\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        if (!equal(getIn(initialValuesRef.current, key), value)) {\n            setDirty(true);\n        }\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const setFieldError = (key: string, error: string | undefined) => {\n        const newErrors = { ...errors };\n        if (error) {\n            newErrors[key] = error;\n        } else {\n            delete newErrors[key];\n        }\n        setErrors(newErrors);\n    }\n\n    const setFieldTouched = (key: string, touched: boolean, shouldValidate?: boolean | undefined) => {\n        const newTouched = { ...touchedState };\n        newTouched[key] = touched;\n        setTouchedState(newTouched);\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const handleChange = (event: React.SyntheticEvent) => {\n        const target = event.target as HTMLInputElement;\n        const value = target.type === \"checkbox\" ? target.checked : target.value;\n        const name = target.name;\n        setFieldValue(name, value, validateOnChange);\n        setFieldTouched(name, true);\n    }\n\n    const handleBlur = (event: React.FocusEvent) => {\n        const target = event.target as HTMLInputElement;\n        const name = target.name;\n        setFieldTouched(name, true);\n    }\n\n    const submit = async (e?: FormEvent<HTMLFormElement>) => {\n        e?.preventDefault();\n        e?.stopPropagation();\n        setIsSubmitting(true);\n        setSubmitCount(submitCount + 1);\n        const validationErrors = await validation?.(valuesRef.current);\n        if (validationErrors && Object.keys(validationErrors).length > 0) {\n            setErrors(validationErrors);\n        } else {\n            setErrors({});\n            await onSubmit?.(valuesRef.current, controllerRef.current);\n        }\n        setIsSubmitting(false);\n    }\n\n    const resetForm = (props?: FormexResetProps<T>) => {\n        const {\n            submitCount: submitCountProp,\n            values: valuesProp,\n            errors: errorsProp,\n            touched: touchedProp\n        } = props ?? {};\n        initialValuesRef.current = valuesProp ?? initialValues;\n        valuesRef.current = valuesProp ?? initialValues;\n        setValuesInner(valuesProp ?? initialValues);\n        setErrors(errorsProp ?? {});\n        setTouchedState(touchedProp ?? {});\n        setDirty(false);\n        setSubmitCount(submitCountProp ?? 0);\n    }\n\n    const controller: FormexController<T> = {\n        values,\n        initialValues: initialValuesRef.current,\n        handleChange,\n        isSubmitting,\n        setSubmitting: setIsSubmitting,\n        setValues,\n        setFieldValue,\n        errors,\n        setFieldError,\n        touched: touchedState,\n        setFieldTouched,\n        dirty,\n        setDirty,\n        handleSubmit: submit,\n        submitCount,\n        setSubmitCount,\n        handleBlur,\n        validate,\n        isValidating,\n        resetForm\n    };\n\n    const controllerRef = React.useRef<FormexController<T>>(controller);\n    controllerRef.current = controller;\n    return controller\n}\n"],"names":["React","values"],"mappings":"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"}

package/dist/index.umd.js

@@ -1,2 +1,314 @@
-(function(s,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react"),require("react-fast-compare")):typeof define=="function"&&define.amd?define(["exports","react","react-fast-compare"],f):(s=typeof globalThis<"u"?globalThis:s||self,f(s.Formex={},s.React,s.equal))})(this,function(s,f,k){"use strict";function x(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const c=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(a,n,c.get?c:{enumerable:!0,get:()=>e[n]})}}return a.default=e,Object.freeze(a)}const F=x(f),N=f.createContext({}),w=()=>f.useContext(N),G=N.Provider,H=e=>Array.isArray(e)&&e.length===0,v=e=>typeof e=="function",h=e=>e!==null&&typeof e=="object",T=e=>String(Math.floor(Number(e)))===e,J=e=>Object.prototype.toString.call(e)==="[object String]",K=e=>e!==e,L=e=>F.Children.count(e)===0,Q=e=>h(e)&&v(e.then),U=e=>e&&h(e)&&h(e.target);function X(e){if(e=e||(typeof document<"u"?document:void 0),typeof e>"u")return null;try{return e.activeElement||e.body}catch{return e.body}}function b(e,a,n,c=0){const r=V(a);for(;e&&c<r.length;)e=e[r[c++]];return c!==r.length&&!e||e===void 0?n:e}function j(e,a,n){const c=M(e);let r=c,t=0;const l=V(a);for(;t<l.length-1;t++){const u=l[t],m=b(e,l.slice(0,t+1));if(m&&(h(m)||Array.isArray(m)))r=r[u]=M(m);else{const y=l[t+1];r=r[u]=T(y)&&Number(y)>=0?[]:{}}}return(t===0?e:r)[l[t]]===n?e:(n===void 0?delete r[l[t]]:r[l[t]]=n,t===0&&n===void 0&&delete c[l[t]],c)}function D(e,a,n=new WeakMap,c={}){for(const r of Object.keys(e)){const t=e[r];h(t)?n.get(t)||(n.set(t,!0),c[r]=Array.isArray(t)?[]:{},D(t,a,n,c[r])):c[r]=a}return c}function M(e){return Array.isArray(e)?[...e]:typeof e=="object"&&e!==null?{...e}:e}function V(e){return Array.isArray(e)?e:e.replace(/\[(\d+)]/g,".$1").replace(/^\./,"").replace(/\.$/,"").split(".")}function Y({validate:e,name:a,children:n,as:c,className:r,...t}){const l=w(),u=Z({name:a,...t},l);if(v(n))return n({field:u,form:l});const m=c||"input";if(typeof m=="string"){const{innerRef:y,...p}=t;return F.createElement(m,{ref:y,...u,...p,className:r},n)}return F.createElement(m,{...u,...t,className:r},n)}const Z=(e,a)=>{const n=h(e),c=n?e.name:e,r=b(a.values,c),t={name:c,value:r,onChange:a.handleChange,onBlur:a.handleBlur};if(n){const{type:l,value:u,as:m,multiple:y}=e;l==="checkbox"?u===void 0?t.checked=!!r:(t.checked=!!(Array.isArray(r)&&~r.indexOf(u)),t.value=u):l==="radio"?(t.checked=r===u,t.value=u):m==="select"&&y&&(t.value=t.value||[],t.multiple=!0)}return t};function R({initialValues:e,initialErrors:a,validation:n,validateOnChange:c=!1,onSubmit:r,validateOnInitialRender:t=!1}){const l=f.useRef(e),u=f.useRef(e),[m,y]=f.useState(e),[p,B]=f.useState({}),[_,S]=f.useState(a??{}),[ee,A]=f.useState(!1),[q,P]=f.useState(0),[te,C]=f.useState(!1),[ne,$]=f.useState(!1);f.useEffect(()=>{t&&E()},[]);const re=o=>{u.current=o,y(o),A(k(l.current,o))},E=async()=>{$(!0);const o=u.current,i=await n?.(o);return S(i??{}),$(!1),i},z=(o,i,d)=>{const g=j(u.current,o,i);u.current=g,y(g),k(b(l.current,o),i)||A(!0),d&&E()},se=(o,i)=>{const d={..._};i?d[o]=i:delete d[o],S(d)},I=(o,i,d)=>{const g={...p};g[o]=i,B(g),d&&E()},ce=o=>{const i=o.target,d=i.type==="checkbox"?i.checked:i.value,g=i.name;z(g,d,c),I(g,!0)},oe=o=>{const d=o.target.name;I(d,!0)},ie=async o=>{o?.preventDefault(),o?.stopPropagation(),C(!0),P(q+1);const i=await n?.(u.current);i&&Object.keys(i).length>0?S(i):(S({}),await r?.(u.current,W.current)),C(!1)},ue=o=>{const{submitCount:i,values:d,errors:g,touched:ae}=o??{};l.current=d??e,u.current=d??e,y(d??e),S(g??{}),B(ae??{}),A(!1),P(i??0)},O={values:m,initialValues:l.current,handleChange:ce,isSubmitting:te,setSubmitting:C,setValues:re,setFieldValue:z,errors:_,setFieldError:se,touched:p,setFieldTouched:I,dirty:ee,setDirty:A,handleSubmit:ie,submitCount:q,setSubmitCount:P,handleBlur:oe,validate:E,isValidating:ne,resetForm:ue},W=f.useRef(O);return W.current=O,O}s.Field=Y,s.Formex=G,s.getActiveElement=X,s.getIn=b,s.isEmptyArray=H,s.isEmptyChildren=L,s.isFunction=v,s.isInputEvent=U,s.isInteger=T,s.isNaN=K,s.isObject=h,s.isPromise=Q,s.isString=J,s.setIn=j,s.setNestedObjectValues=D,s.useCreateFormex=R,s.useFormex=w,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});
+(function(global, factory) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("react-fast-compare")) : typeof define === "function" && define.amd ? define(["exports", "react", "react-fast-compare"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.Formex = {}, global.React, global.equal));
+})(this, function(exports2, React, equal) {
+  "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({});
+  const useFormex = () => React.useContext(FormexContext);
+  const Formex = FormexContext.Provider;
+  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 isString = (obj) => Object.prototype.toString.call(obj) === "[object String]";
+  const isNaN = (obj) => obj !== obj;
+  const isEmptyChildren = (children) => React__namespace.Children.count(children) === 0;
+  const isPromise = (value) => isObject(value) && isFunction(value.then);
+  const isInputEvent = (value) => value && isObject(value) && isObject(value.target);
+  function getActiveElement(doc) {
+    doc = doc || (typeof document !== "undefined" ? document : void 0);
+    if (typeof doc === "undefined") {
+      return null;
+    }
+    try {
+      return doc.activeElement || doc.body;
+    } catch (e) {
+      return doc.body;
+    }
+  }
+  function getIn(obj, key, def, p = 0) {
+    const path = toPath(key);
+    while (obj && p < path.length) {
+      obj = obj[path[p++]];
+    }
+    if (p !== path.length && !obj) {
+      return def;
+    }
+    return obj === void 0 ? def : obj;
+  }
+  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 setNestedObjectValues(object, value, visited = /* @__PURE__ */ new WeakMap(), response = {}) {
+    for (const k of Object.keys(object)) {
+      const val = object[k];
+      if (isObject(val)) {
+        if (!visited.get(val)) {
+          visited.set(val, true);
+          response[k] = Array.isArray(val) ? [] : {};
+          setNestedObjectValues(val, value, visited, response[k]);
+        }
+      } else {
+        response[k] = value;
+      }
+    }
+    return response;
+  }
+  function clone(value) {
+    if (Array.isArray(value)) {
+      return [...value];
+    } else if (typeof value === "object" && value !== null) {
+      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({
+    validate,
+    name,
+    children,
+    as: is,
+    // `as` is reserved in typescript lol
+    // component,
+    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__namespace.createElement(
+        asElement,
+        { ref: innerRef, ...field, ...rest, className },
+        children
+      );
+    }
+    return React__namespace.createElement(asElement, { ...field, ...props, className }, children);
+  }
+  const getFieldProps = (nameOrOptions, formex) => {
+    const isAnObject = isObject(nameOrOptions);
+    const name = isAnObject ? nameOrOptions.name : nameOrOptions;
+    const valueState = getIn(formex.values, name);
+    const field = {
+      name,
+      value: valueState,
+      onChange: formex.handleChange,
+      onBlur: formex.handleBlur
+    };
+    if (isAnObject) {
+      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, validation, validateOnChange = false, onSubmit, validateOnInitialRender = false }) {
+    const initialValuesRef = React.useRef(initialValues);
+    const valuesRef = React.useRef(initialValues);
+    const [values, setValuesInner] = React.useState(initialValues);
+    const [touchedState, setTouchedState] = React.useState({});
+    const [errors, setErrors] = React.useState(initialErrors ?? {});
+    const [dirty, setDirty] = React.useState(false);
+    const [submitCount, setSubmitCount] = React.useState(0);
+    const [isSubmitting, setIsSubmitting] = React.useState(false);
+    const [isValidating, setIsValidating] = React.useState(false);
+    React.useEffect(() => {
+      if (validateOnInitialRender) {
+        validate();
+      }
+    }, []);
+    const setValues = (newValues) => {
+      valuesRef.current = newValues;
+      setValuesInner(newValues);
+      setDirty(equal(initialValuesRef.current, newValues));
+    };
+    const validate = async () => {
+      setIsValidating(true);
+      const values2 = valuesRef.current;
+      const validationErrors = await validation?.(values2);
+      setErrors(validationErrors ?? {});
+      setIsValidating(false);
+      return validationErrors;
+    };
+    const setFieldValue = (key, value, shouldValidate) => {
+      const newValues = setIn(valuesRef.current, key, value);
+      valuesRef.current = newValues;
+      setValuesInner(newValues);
+      if (!equal(getIn(initialValuesRef.current, key), value)) {
+        setDirty(true);
+      }
+      if (shouldValidate) {
+        validate();
+      }
+    };
+    const setFieldError = (key, error) => {
+      const newErrors = { ...errors };
+      if (error) {
+        newErrors[key] = error;
+      } else {
+        delete newErrors[key];
+      }
+      setErrors(newErrors);
+    };
+    const setFieldTouched = (key, touched, shouldValidate) => {
+      const newTouched = { ...touchedState };
+      newTouched[key] = touched;
+      setTouchedState(newTouched);
+      if (shouldValidate) {
+        validate();
+      }
+    };
+    const handleChange = (event) => {
+      const target = event.target;
+      const value = target.type === "checkbox" ? target.checked : target.value;
+      const name = target.name;
+      setFieldValue(name, value, validateOnChange);
+      setFieldTouched(name, true);
+    };
+    const handleBlur = (event) => {
+      const target = event.target;
+      const name = target.name;
+      setFieldTouched(name, true);
+    };
+    const submit = async (e) => {
+      e?.preventDefault();
+      e?.stopPropagation();
+      setIsSubmitting(true);
+      setSubmitCount(submitCount + 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);
+    };
+    const resetForm = (props) => {
+      const {
+        submitCount: submitCountProp,
+        values: valuesProp,
+        errors: errorsProp,
+        touched: touchedProp
+      } = props ?? {};
+      initialValuesRef.current = valuesProp ?? initialValues;
+      valuesRef.current = valuesProp ?? initialValues;
+      setValuesInner(valuesProp ?? initialValues);
+      setErrors(errorsProp ?? {});
+      setTouchedState(touchedProp ?? {});
+      setDirty(false);
+      setSubmitCount(submitCountProp ?? 0);
+    };
+    const controller = {
+      values,
+      initialValues: initialValuesRef.current,
+      handleChange,
+      isSubmitting,
+      setSubmitting: setIsSubmitting,
+      setValues,
+      setFieldValue,
+      errors,
+      setFieldError,
+      touched: touchedState,
+      setFieldTouched,
+      dirty,
+      setDirty,
+      handleSubmit: submit,
+      submitCount,
+      setSubmitCount,
+      handleBlur,
+      validate,
+      isValidating,
+      resetForm
+    };
+    const controllerRef = React.useRef(controller);
+    controllerRef.current = controller;
+    return controller;
+  }
+  exports2.Field = Field;
+  exports2.Formex = Formex;
+  exports2.getActiveElement = getActiveElement;
+  exports2.getIn = getIn;
+  exports2.isEmptyArray = isEmptyArray;
+  exports2.isEmptyChildren = isEmptyChildren;
+  exports2.isFunction = isFunction;
+  exports2.isInputEvent = isInputEvent;
+  exports2.isInteger = isInteger;
+  exports2.isNaN = isNaN;
+  exports2.isObject = isObject;
+  exports2.isPromise = isPromise;
+  exports2.isString = isString;
+  exports2.setIn = setIn;
+  exports2.setNestedObjectValues = setNestedObjectValues;
+  exports2.useCreateFormex = useCreateFormex;
+  exports2.useFormex = useFormex;
+  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
+});
 //# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.umd.js","sources":["../src/Formex.tsx","../src/utils.ts","../src/Field.tsx","../src/useCreateFormex.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { FormexController } from \"./types\";\n\nconst FormexContext = React.createContext<FormexController<any>>({} as any);\n\nexport const useFormex = <T extends object>() => useContext<FormexController<T>>(FormexContext);\n\nexport const Formex = FormexContext.Provider;\n","import * as React from \"react\";\n\n/** @private is the value an empty array? */\nexport const isEmptyArray = (value?: any) =>\n    Array.isArray(value) && value.length === 0;\n\n/** @private is the given object a Function? */\nexport const isFunction = (obj: any): obj is Function =>\n    typeof obj === \"function\";\n\n/** @private is the given object an Object? */\nexport const isObject = (obj: any): obj is Object =>\n    obj !== null && typeof obj === \"object\";\n\n/** @private is the given object an integer? */\nexport const isInteger = (obj: any): boolean =>\n    String(Math.floor(Number(obj))) === obj;\n\n/** @private is the given object a string? */\nexport const isString = (obj: any): obj is string =>\n    Object.prototype.toString.call(obj) === \"[object String]\";\n\n/** @private is the given object a NaN? */\n// eslint-disable-next-line no-self-compare\nexport const isNaN = (obj: any): boolean => obj !== obj;\n\n/** @private Does a React component have exactly 0 children? */\nexport const isEmptyChildren = (children: any): boolean =>\n    React.Children.count(children) === 0;\n\n/** @private is the given object/value a promise? */\nexport const isPromise = (value: any): value is PromiseLike<any> =>\n    isObject(value) && isFunction(value.then);\n\n/** @private is the given object/value a type of synthetic event? */\nexport const isInputEvent = (value: any): value is React.SyntheticEvent<any> =>\n    value && isObject(value) && isObject(value.target);\n\n/**\n * Same as document.activeElement but wraps in a try-catch block. In IE it is\n * not safe to call document.activeElement if there is nothing focused.\n *\n * The activeElement will be null only if the document or document body is not\n * yet defined.\n *\n * @param {?Document} doc Defaults to current document.\n * @return {Element | null}\n * @see https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/core/dom/getActiveElement.js\n */\nexport function getActiveElement(doc?: Document): Element | null {\n    doc = doc || (typeof document !== \"undefined\" ? document : undefined);\n    if (typeof doc === \"undefined\") {\n        return null;\n    }\n    try {\n        return doc.activeElement || doc.body;\n    } catch (e) {\n        return doc.body;\n    }\n}\n\n/**\n * Deeply get a value from an object via its path.\n */\nexport function getIn(\n    obj: any,\n    key: string | string[],\n    def?: any,\n    p = 0\n) {\n    const path = toPath(key);\n    while (obj && p < path.length) {\n        obj = obj[path[p++]];\n    }\n\n    // check if path is not in the end\n    if (p !== path.length && !obj) {\n        return def;\n    }\n\n    return obj === undefined ? def : obj;\n}\n\nexport function setIn(obj: any, path: string, value: any): any {\n    const res: any = clone(obj); // this keeps inheritance when obj is a class\n    let resVal: any = res;\n    let i = 0;\n    const pathArray = toPath(path);\n\n    for (; i < pathArray.length - 1; i++) {\n        const currentPath: string = pathArray[i];\n        const currentObj: any = getIn(obj, pathArray.slice(0, i + 1));\n\n        if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) {\n            resVal = resVal[currentPath] = clone(currentObj);\n        } else {\n            const nextPath: string = pathArray[i + 1];\n            resVal = resVal[currentPath] =\n                isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {};\n        }\n    }\n\n    // Return original object if new value is the same as current\n    if ((i === 0 ? obj : resVal)[pathArray[i]] === value) {\n        return obj;\n    }\n\n    if (value === undefined) {\n        delete resVal[pathArray[i]];\n    } else {\n        resVal[pathArray[i]] = value;\n    }\n\n    // If the path array has a single element, the loop did not run.\n    // Deleting on `resVal` had no effect in this scenario, so we delete on the result instead.\n    if (i === 0 && value === undefined) {\n        delete res[pathArray[i]];\n    }\n\n    return res;\n}\n\n/**\n * Recursively a set the same value for all keys and arrays nested object, cloning\n * @param object\n * @param value\n * @param visited\n * @param response\n */\nexport function setNestedObjectValues<T>(\n    object: any,\n    value: any,\n    visited: any = new WeakMap(),\n    response: any = {}\n): T {\n    for (const k of Object.keys(object)) {\n        const val = object[k];\n        if (isObject(val)) {\n            if (!visited.get(val)) {\n                visited.set(val, true);\n                // In order to keep array values consistent for both dot path  and\n                // bracket syntax, we need to check if this is an array so that\n                // this will output  { friends: [true] } and not { friends: { \"0\": true } }\n                response[k] = Array.isArray(val) ? [] : {};\n                setNestedObjectValues(val, value, visited, response[k]);\n            }\n        } else {\n            response[k] = value;\n        }\n    }\n\n    return response;\n}\n\nfunction clone(value: any) {\n    if (Array.isArray(value)) {\n        return [...value];\n    } else if (typeof value === \"object\" && value !== null) {\n        return { ...value };\n    } else {\n        return value; // This is for primitive types which do not need cloning.\n    }\n}\n\nfunction toPath(value: string | string[]) {\n    if (Array.isArray(value)) return value; // Already in path array form.\n    // Replace brackets with dots, remove leading/trailing dots, then split by dot.\n    return value.replace(/\\[(\\d+)]/g, \".$1\").replace(/^\\./, \"\").replace(/\\.$/, \"\").split(\".\");\n}\n","import * as React from \"react\";\nimport { useFormex } from \"./Formex\";\nimport { getIn, isFunction, isObject } from \"./utils\";\nimport { FormexController } from \"./types\";\n\nexport interface FieldInputProps<Value> {\n    /** Value of the field */\n    value: Value;\n    /** Name of the field */\n    name: string;\n    /** Multiple select? */\n    multiple?: boolean;\n    /** Is the field checked? */\n    checked?: boolean;\n    /** Change event handler */\n    onChange: (event: React.SyntheticEvent) => void,\n    /** Blur event handler */\n    onBlur: (event: React.FocusEvent) => void,\n}\n\nexport interface FormexFieldProps<Value = any, FormValues extends object = any> {\n    field: FieldInputProps<Value>;\n    form: FormexController<FormValues>;\n}\n\nexport type FieldValidator = (\n    value: any\n) => string | void | Promise<string | void>;\n\nexport interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {\n\n    /**\n     * Component to render. Can either be a string e.g. 'select', 'input', or 'textarea', or a component.\n     */\n    as?:\n        | C\n        | string\n        | React.ForwardRefExoticComponent<any>;\n\n    /**\n     * Children render function <Field name>{props => ...}</Field>)\n     */\n    children?: ((props: FormexFieldProps<Value>) => React.ReactNode) | React.ReactNode;\n\n    /**\n     * Validate a single field value independently\n     */\n    // validate?: FieldValidator;\n\n    /**\n     * Used for 'select' and related input types.\n     */\n    multiple?: boolean;\n\n    /**\n     * Field name\n     */\n    name: string;\n\n    /** HTML input type */\n    type?: string;\n\n    /** Field value */\n    value?: any;\n\n    /** Inner ref */\n    innerRef?: (instance: any) => void;\n\n}\n\nexport type FieldProps<T, C extends React.ElementType | undefined> = {\n    as?: C;\n} & (C extends React.ElementType ? (React.ComponentProps<C> & FieldConfig<T, C>) : FieldConfig<T, C>);\n\nexport function Field<T, C extends React.ElementType | undefined = undefined>({\n                                                                                  validate,\n                                                                                  name,\n                                                                                  children,\n                                                                                  as: is, // `as` is reserved in typescript lol\n                                                                                  // component,\n                                                                                  className,\n                                                                                  ...props\n                                                                              }: FieldProps<T, C>) {\n    const formex = useFormex();\n\n    const field = getFieldProps({ name, ...props }, formex);\n\n    if (isFunction(children)) {\n        return children({ field, form: formex });\n    }\n\n    // if (component) {\n    //     if (typeof component === \"string\") {\n    //         const { innerRef, ...rest } = props;\n    //         return React.createElement(\n    //             component,\n    //             { ref: innerRef, ...field, ...rest, className },\n    //             children\n    //         );\n    //     }\n    //     return React.createElement(\n    //         component,\n    //         { field, form: formex, ...props, className },\n    //         children\n    //     );\n    // }\n\n    // default to input here so we can check for both `as` and `children` above\n    const asElement = is || \"input\";\n\n    if (typeof asElement === \"string\") {\n        const { innerRef, ...rest } = props;\n        return React.createElement(\n            asElement,\n            { ref: innerRef, ...field, ...rest, className },\n            children\n        );\n    }\n\n    return React.createElement(asElement, { ...field, ...props, className }, children);\n}\n\nconst getFieldProps = (nameOrOptions: string | FieldConfig<any>, formex: FormexController<any>): FieldInputProps<any> => {\n    const isAnObject = isObject(nameOrOptions);\n    const name = isAnObject\n        ? (nameOrOptions as FieldConfig<any>).name\n        : nameOrOptions;\n    const valueState = getIn(formex.values, name);\n\n    const field: FieldInputProps<any> = {\n        name,\n        value: valueState,\n        onChange: formex.handleChange,\n        onBlur: formex.handleBlur,\n    };\n    if (isAnObject) {\n        const {\n            type,\n            value: valueProp, // value is special for checkboxes\n            as: is,\n            multiple,\n        } = nameOrOptions as FieldConfig<any>;\n\n        if (type === \"checkbox\") {\n            if (valueProp === undefined) {\n                field.checked = !!valueState;\n            } else {\n                field.checked = !!(\n                    Array.isArray(valueState) && ~valueState.indexOf(valueProp)\n                );\n                field.value = valueProp;\n            }\n        } else if (type === \"radio\") {\n            field.checked = valueState === valueProp;\n            field.value = valueProp;\n        } else if (is === \"select\" && multiple) {\n            field.value = field.value || [];\n            field.multiple = true;\n        }\n    }\n    return field;\n};\n","import React, { FormEvent, useEffect, useState } from \"react\";\nimport { getIn, setIn } from \"./utils\";\nimport equal from \"react-fast-compare\"\n\nimport { FormexController, FormexResetProps } from \"./types\";\n\nexport function useCreateFormex<T extends object>({ initialValues, initialErrors, validation, validateOnChange = false, onSubmit, validateOnInitialRender = false }: {\n    initialValues: T,\n    initialErrors?: Record<string, string>,\n    validateOnChange?: boolean,\n    validateOnInitialRender?: boolean,\n    validation?: (values: T) => Record<string, string> | Promise<Record<string, string>> | undefined | void,\n    onSubmit?: (values: T, controller: FormexController<T>) => void | Promise<void>\n}): FormexController<T> {\n\n    const initialValuesRef = React.useRef<T>(initialValues);\n    const valuesRef = React.useRef<T>(initialValues);\n\n    const [values, setValuesInner] = useState<T>(initialValues);\n    const [touchedState, setTouchedState] = useState<Record<string, boolean>>({});\n    const [errors, setErrors] = useState<Record<string, string>>(initialErrors ?? {});\n    const [dirty, setDirty] = useState(false);\n    const [submitCount, setSubmitCount] = useState(0);\n    const [isSubmitting, setIsSubmitting] = useState(false);\n    const [isValidating, setIsValidating] = useState(false);\n\n    useEffect(() => {\n        if (validateOnInitialRender) {\n            validate();\n        }\n    }, []);\n\n    const setValues = (newValues: T) => {\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        setDirty(equal(initialValuesRef.current, newValues));\n    }\n\n    const validate = async () => {\n        setIsValidating(true);\n        const values = valuesRef.current;\n        const validationErrors = await validation?.(values);\n        setErrors(validationErrors ?? {});\n        setIsValidating(false);\n        return validationErrors;\n    }\n\n    const setFieldValue = (key: string, value: any, shouldValidate?: boolean) => {\n        const newValues = setIn(valuesRef.current, key, value);\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        if (!equal(getIn(initialValuesRef.current, key), value)) {\n            setDirty(true);\n        }\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const setFieldError = (key: string, error: string | undefined) => {\n        const newErrors = { ...errors };\n        if (error) {\n            newErrors[key] = error;\n        } else {\n            delete newErrors[key];\n        }\n        setErrors(newErrors);\n    }\n\n    const setFieldTouched = (key: string, touched: boolean, shouldValidate?: boolean | undefined) => {\n        const newTouched = { ...touchedState };\n        newTouched[key] = touched;\n        setTouchedState(newTouched);\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const handleChange = (event: React.SyntheticEvent) => {\n        const target = event.target as HTMLInputElement;\n        const value = target.type === \"checkbox\" ? target.checked : target.value;\n        const name = target.name;\n        setFieldValue(name, value, validateOnChange);\n        setFieldTouched(name, true);\n    }\n\n    const handleBlur = (event: React.FocusEvent) => {\n        const target = event.target as HTMLInputElement;\n        const name = target.name;\n        setFieldTouched(name, true);\n    }\n\n    const submit = async (e?: FormEvent<HTMLFormElement>) => {\n        e?.preventDefault();\n        e?.stopPropagation();\n        setIsSubmitting(true);\n        setSubmitCount(submitCount + 1);\n        const validationErrors = await validation?.(valuesRef.current);\n        if (validationErrors && Object.keys(validationErrors).length > 0) {\n            setErrors(validationErrors);\n        } else {\n            setErrors({});\n            await onSubmit?.(valuesRef.current, controllerRef.current);\n        }\n        setIsSubmitting(false);\n    }\n\n    const resetForm = (props?: FormexResetProps<T>) => {\n        const {\n            submitCount: submitCountProp,\n            values: valuesProp,\n            errors: errorsProp,\n            touched: touchedProp\n        } = props ?? {};\n        initialValuesRef.current = valuesProp ?? initialValues;\n        valuesRef.current = valuesProp ?? initialValues;\n        setValuesInner(valuesProp ?? initialValues);\n        setErrors(errorsProp ?? {});\n        setTouchedState(touchedProp ?? {});\n        setDirty(false);\n        setSubmitCount(submitCountProp ?? 0);\n    }\n\n    const controller: FormexController<T> = {\n        values,\n        initialValues: initialValuesRef.current,\n        handleChange,\n        isSubmitting,\n        setSubmitting: setIsSubmitting,\n        setValues,\n        setFieldValue,\n        errors,\n        setFieldError,\n        touched: touchedState,\n        setFieldTouched,\n        dirty,\n        setDirty,\n        handleSubmit: submit,\n        submitCount,\n        setSubmitCount,\n        handleBlur,\n        validate,\n        isValidating,\n        resetForm\n    };\n\n    const controllerRef = React.useRef<FormexController<T>>(controller);\n    controllerRef.current = controller;\n    return controller\n}\n"],"names":["FormexContext","React","useFormex","useContext","Formex","isEmptyArray","value","isFunction","obj","isObject","isInteger","isString","isNaN","isEmptyChildren","children","isPromise","isInputEvent","getActiveElement","doc","getIn","key","def","p","path","toPath","setIn","res","clone","resVal","i","pathArray","currentPath","currentObj","nextPath","setNestedObjectValues","object","visited","response","k","val","Field","validate","name","is","className","props","formex","field","getFieldProps","asElement","innerRef","rest","nameOrOptions","isAnObject","valueState","type","valueProp","multiple","useCreateFormex","initialValues","initialErrors","validation","validateOnChange","onSubmit","validateOnInitialRender","initialValuesRef","valuesRef","values","setValuesInner","useState","touchedState","setTouchedState","errors","setErrors","dirty","setDirty","submitCount","setSubmitCount","isSubmitting","setIsSubmitting","isValidating","setIsValidating","useEffect","setValues","newValues","equal","validationErrors","setFieldValue","shouldValidate","setFieldError","error","newErrors","setFieldTouched","touched","newTouched","handleChange","event","target","handleBlur","submit","e","controllerRef","resetForm","submitCountProp","valuesProp","errorsProp","touchedProp","controller"],"mappings":"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"}
+{"version":3,"file":"index.umd.js","sources":["../src/Formex.tsx","../src/utils.ts","../src/Field.tsx","../src/useCreateFormex.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { FormexController } from \"./types\";\n\nconst FormexContext = React.createContext<FormexController<any>>({} as any);\n\nexport const useFormex = <T extends object>() => useContext<FormexController<T>>(FormexContext);\n\nexport const Formex = FormexContext.Provider;\n","import * as React from \"react\";\n\n/** @private is the value an empty array? */\nexport const isEmptyArray = (value?: any) =>\n    Array.isArray(value) && value.length === 0;\n\n/** @private is the given object a Function? */\nexport const isFunction = (obj: any): obj is Function =>\n    typeof obj === \"function\";\n\n/** @private is the given object an Object? */\nexport const isObject = (obj: any): obj is Object =>\n    obj !== null && typeof obj === \"object\";\n\n/** @private is the given object an integer? */\nexport const isInteger = (obj: any): boolean =>\n    String(Math.floor(Number(obj))) === obj;\n\n/** @private is the given object a string? */\nexport const isString = (obj: any): obj is string =>\n    Object.prototype.toString.call(obj) === \"[object String]\";\n\n/** @private is the given object a NaN? */\n// eslint-disable-next-line no-self-compare\nexport const isNaN = (obj: any): boolean => obj !== obj;\n\n/** @private Does a React component have exactly 0 children? */\nexport const isEmptyChildren = (children: any): boolean =>\n    React.Children.count(children) === 0;\n\n/** @private is the given object/value a promise? */\nexport const isPromise = (value: any): value is PromiseLike<any> =>\n    isObject(value) && isFunction(value.then);\n\n/** @private is the given object/value a type of synthetic event? */\nexport const isInputEvent = (value: any): value is React.SyntheticEvent<any> =>\n    value && isObject(value) && isObject(value.target);\n\n/**\n * Same as document.activeElement but wraps in a try-catch block. In IE it is\n * not safe to call document.activeElement if there is nothing focused.\n *\n * The activeElement will be null only if the document or document body is not\n * yet defined.\n *\n * @param {?Document} doc Defaults to current document.\n * @return {Element | null}\n * @see https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/core/dom/getActiveElement.js\n */\nexport function getActiveElement(doc?: Document): Element | null {\n    doc = doc || (typeof document !== \"undefined\" ? document : undefined);\n    if (typeof doc === \"undefined\") {\n        return null;\n    }\n    try {\n        return doc.activeElement || doc.body;\n    } catch (e) {\n        return doc.body;\n    }\n}\n\n/**\n * Deeply get a value from an object via its path.\n */\nexport function getIn(\n    obj: any,\n    key: string | string[],\n    def?: any,\n    p = 0\n) {\n    const path = toPath(key);\n    while (obj && p < path.length) {\n        obj = obj[path[p++]];\n    }\n\n    // check if path is not in the end\n    if (p !== path.length && !obj) {\n        return def;\n    }\n\n    return obj === undefined ? def : obj;\n}\n\nexport function setIn(obj: any, path: string, value: any): any {\n    const res: any = clone(obj); // this keeps inheritance when obj is a class\n    let resVal: any = res;\n    let i = 0;\n    const pathArray = toPath(path);\n\n    for (; i < pathArray.length - 1; i++) {\n        const currentPath: string = pathArray[i];\n        const currentObj: any = getIn(obj, pathArray.slice(0, i + 1));\n\n        if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) {\n            resVal = resVal[currentPath] = clone(currentObj);\n        } else {\n            const nextPath: string = pathArray[i + 1];\n            resVal = resVal[currentPath] =\n                isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {};\n        }\n    }\n\n    // Return original object if new value is the same as current\n    if ((i === 0 ? obj : resVal)[pathArray[i]] === value) {\n        return obj;\n    }\n\n    if (value === undefined) {\n        delete resVal[pathArray[i]];\n    } else {\n        resVal[pathArray[i]] = value;\n    }\n\n    // If the path array has a single element, the loop did not run.\n    // Deleting on `resVal` had no effect in this scenario, so we delete on the result instead.\n    if (i === 0 && value === undefined) {\n        delete res[pathArray[i]];\n    }\n\n    return res;\n}\n\n/**\n * Recursively a set the same value for all keys and arrays nested object, cloning\n * @param object\n * @param value\n * @param visited\n * @param response\n */\nexport function setNestedObjectValues<T>(\n    object: any,\n    value: any,\n    visited: any = new WeakMap(),\n    response: any = {}\n): T {\n    for (const k of Object.keys(object)) {\n        const val = object[k];\n        if (isObject(val)) {\n            if (!visited.get(val)) {\n                visited.set(val, true);\n                // In order to keep array values consistent for both dot path  and\n                // bracket syntax, we need to check if this is an array so that\n                // this will output  { friends: [true] } and not { friends: { \"0\": true } }\n                response[k] = Array.isArray(val) ? [] : {};\n                setNestedObjectValues(val, value, visited, response[k]);\n            }\n        } else {\n            response[k] = value;\n        }\n    }\n\n    return response;\n}\n\nfunction clone(value: any) {\n    if (Array.isArray(value)) {\n        return [...value];\n    } else if (typeof value === \"object\" && value !== null) {\n        return { ...value };\n    } else {\n        return value; // This is for primitive types which do not need cloning.\n    }\n}\n\nfunction toPath(value: string | string[]) {\n    if (Array.isArray(value)) return value; // Already in path array form.\n    // Replace brackets with dots, remove leading/trailing dots, then split by dot.\n    return value.replace(/\\[(\\d+)]/g, \".$1\").replace(/^\\./, \"\").replace(/\\.$/, \"\").split(\".\");\n}\n","import * as React from \"react\";\nimport { useFormex } from \"./Formex\";\nimport { getIn, isFunction, isObject } from \"./utils\";\nimport { FormexController } from \"./types\";\n\nexport interface FieldInputProps<Value> {\n    /** Value of the field */\n    value: Value;\n    /** Name of the field */\n    name: string;\n    /** Multiple select? */\n    multiple?: boolean;\n    /** Is the field checked? */\n    checked?: boolean;\n    /** Change event handler */\n    onChange: (event: React.SyntheticEvent) => void,\n    /** Blur event handler */\n    onBlur: (event: React.FocusEvent) => void,\n}\n\nexport interface FormexFieldProps<Value = any, FormValues extends object = any> {\n    field: FieldInputProps<Value>;\n    form: FormexController<FormValues>;\n}\n\nexport interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {\n\n    /**\n     * Component to render. Can either be a string e.g. 'select', 'input', or 'textarea', or a component.\n     */\n    as?:\n        | C\n        | string\n        | React.ForwardRefExoticComponent<any>;\n\n    /**\n     * Children render function <Field name>{props => ...}</Field>)\n     */\n    children?: ((props: FormexFieldProps<Value>) => React.ReactNode) | React.ReactNode;\n\n    /**\n     * Validate a single field value independently\n     */\n    // validate?: FieldValidator;\n\n    /**\n     * Used for 'select' and related input types.\n     */\n    multiple?: boolean;\n\n    /**\n     * Field name\n     */\n    name: string;\n\n    /** HTML input type */\n    type?: string;\n\n    /** Field value */\n    value?: any;\n\n    /** Inner ref */\n    innerRef?: (instance: any) => void;\n\n}\n\nexport type FieldProps<T, C extends React.ElementType | undefined> = {\n    as?: C;\n} & (C extends React.ElementType ? (React.ComponentProps<C> & FieldConfig<T, C>) : FieldConfig<T, C>);\n\nexport function Field<T, C extends React.ElementType | undefined = undefined>({\n                                                                                  validate,\n                                                                                  name,\n                                                                                  children,\n                                                                                  as: is, // `as` is reserved in typescript lol\n                                                                                  // component,\n                                                                                  className,\n                                                                                  ...props\n                                                                              }: FieldProps<T, C>) {\n    const formex = useFormex();\n\n    const field = getFieldProps({ name, ...props }, formex);\n\n    if (isFunction(children)) {\n        return children({ field, form: formex });\n    }\n\n    // if (component) {\n    //     if (typeof component === \"string\") {\n    //         const { innerRef, ...rest } = props;\n    //         return React.createElement(\n    //             component,\n    //             { ref: innerRef, ...field, ...rest, className },\n    //             children\n    //         );\n    //     }\n    //     return React.createElement(\n    //         component,\n    //         { field, form: formex, ...props, className },\n    //         children\n    //     );\n    // }\n\n    // default to input here so we can check for both `as` and `children` above\n    const asElement = is || \"input\";\n\n    if (typeof asElement === \"string\") {\n        const { innerRef, ...rest } = props;\n        return React.createElement(\n            asElement,\n            { ref: innerRef, ...field, ...rest, className },\n            children\n        );\n    }\n\n    return React.createElement(asElement, { ...field, ...props, className }, children);\n}\n\nconst getFieldProps = (nameOrOptions: string | FieldConfig<any>, formex: FormexController<any>): FieldInputProps<any> => {\n    const isAnObject = isObject(nameOrOptions);\n    const name = isAnObject\n        ? (nameOrOptions as FieldConfig<any>).name\n        : nameOrOptions;\n    const valueState = getIn(formex.values, name);\n\n    const field: FieldInputProps<any> = {\n        name,\n        value: valueState,\n        onChange: formex.handleChange,\n        onBlur: formex.handleBlur,\n    };\n    if (isAnObject) {\n        const {\n            type,\n            value: valueProp, // value is special for checkboxes\n            as: is,\n            multiple,\n        } = nameOrOptions as FieldConfig<any>;\n\n        if (type === \"checkbox\") {\n            if (valueProp === undefined) {\n                field.checked = !!valueState;\n            } else {\n                field.checked = !!(\n                    Array.isArray(valueState) && ~valueState.indexOf(valueProp)\n                );\n                field.value = valueProp;\n            }\n        } else if (type === \"radio\") {\n            field.checked = valueState === valueProp;\n            field.value = valueProp;\n        } else if (is === \"select\" && multiple) {\n            field.value = field.value || [];\n            field.multiple = true;\n        }\n    }\n    return field;\n};\n","import React, { FormEvent, useEffect, useState } from \"react\";\nimport { getIn, setIn } from \"./utils\";\nimport equal from \"react-fast-compare\"\n\nimport { FormexController, FormexResetProps } from \"./types\";\n\nexport function useCreateFormex<T extends object>({ initialValues, initialErrors, validation, validateOnChange = false, onSubmit, validateOnInitialRender = false }: {\n    initialValues: T,\n    initialErrors?: Record<string, string>,\n    validateOnChange?: boolean,\n    validateOnInitialRender?: boolean,\n    validation?: (values: T) => Record<string, string> | Promise<Record<string, string>> | undefined | void,\n    onSubmit?: (values: T, controller: FormexController<T>) => void | Promise<void>\n}): FormexController<T> {\n\n    const initialValuesRef = React.useRef<T>(initialValues);\n    const valuesRef = React.useRef<T>(initialValues);\n\n    const [values, setValuesInner] = useState<T>(initialValues);\n    const [touchedState, setTouchedState] = useState<Record<string, boolean>>({});\n    const [errors, setErrors] = useState<Record<string, string>>(initialErrors ?? {});\n    const [dirty, setDirty] = useState(false);\n    const [submitCount, setSubmitCount] = useState(0);\n    const [isSubmitting, setIsSubmitting] = useState(false);\n    const [isValidating, setIsValidating] = useState(false);\n\n    useEffect(() => {\n        if (validateOnInitialRender) {\n            validate();\n        }\n    }, []);\n\n    const setValues = (newValues: T) => {\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        setDirty(equal(initialValuesRef.current, newValues));\n    }\n\n    const validate = async () => {\n        setIsValidating(true);\n        const values = valuesRef.current;\n        const validationErrors = await validation?.(values);\n        setErrors(validationErrors ?? {});\n        setIsValidating(false);\n        return validationErrors;\n    }\n\n    const setFieldValue = (key: string, value: any, shouldValidate?: boolean) => {\n        const newValues = setIn(valuesRef.current, key, value);\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        if (!equal(getIn(initialValuesRef.current, key), value)) {\n            setDirty(true);\n        }\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const setFieldError = (key: string, error: string | undefined) => {\n        const newErrors = { ...errors };\n        if (error) {\n            newErrors[key] = error;\n        } else {\n            delete newErrors[key];\n        }\n        setErrors(newErrors);\n    }\n\n    const setFieldTouched = (key: string, touched: boolean, shouldValidate?: boolean | undefined) => {\n        const newTouched = { ...touchedState };\n        newTouched[key] = touched;\n        setTouchedState(newTouched);\n        if (shouldValidate) {\n            validate();\n        }\n    }\n\n    const handleChange = (event: React.SyntheticEvent) => {\n        const target = event.target as HTMLInputElement;\n        const value = target.type === \"checkbox\" ? target.checked : target.value;\n        const name = target.name;\n        setFieldValue(name, value, validateOnChange);\n        setFieldTouched(name, true);\n    }\n\n    const handleBlur = (event: React.FocusEvent) => {\n        const target = event.target as HTMLInputElement;\n        const name = target.name;\n        setFieldTouched(name, true);\n    }\n\n    const submit = async (e?: FormEvent<HTMLFormElement>) => {\n        e?.preventDefault();\n        e?.stopPropagation();\n        setIsSubmitting(true);\n        setSubmitCount(submitCount + 1);\n        const validationErrors = await validation?.(valuesRef.current);\n        if (validationErrors && Object.keys(validationErrors).length > 0) {\n            setErrors(validationErrors);\n        } else {\n            setErrors({});\n            await onSubmit?.(valuesRef.current, controllerRef.current);\n        }\n        setIsSubmitting(false);\n    }\n\n    const resetForm = (props?: FormexResetProps<T>) => {\n        const {\n            submitCount: submitCountProp,\n            values: valuesProp,\n            errors: errorsProp,\n            touched: touchedProp\n        } = props ?? {};\n        initialValuesRef.current = valuesProp ?? initialValues;\n        valuesRef.current = valuesProp ?? initialValues;\n        setValuesInner(valuesProp ?? initialValues);\n        setErrors(errorsProp ?? {});\n        setTouchedState(touchedProp ?? {});\n        setDirty(false);\n        setSubmitCount(submitCountProp ?? 0);\n    }\n\n    const controller: FormexController<T> = {\n        values,\n        initialValues: initialValuesRef.current,\n        handleChange,\n        isSubmitting,\n        setSubmitting: setIsSubmitting,\n        setValues,\n        setFieldValue,\n        errors,\n        setFieldError,\n        touched: touchedState,\n        setFieldTouched,\n        dirty,\n        setDirty,\n        handleSubmit: submit,\n        submitCount,\n        setSubmitCount,\n        handleBlur,\n        validate,\n        isValidating,\n        resetForm\n    };\n\n    const controllerRef = React.useRef<FormexController<T>>(controller);\n    controllerRef.current = controller;\n    return controller\n}\n"],"names":["useContext","React","useState","useEffect","values"],"mappings":"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"}

package/dist/utils.d.ts

@@ -16,7 +16,7 @@ export declare const isEmptyChildren: (children: any) => boolean;
 /** @private is the given object/value a promise? */
 export declare const isPromise: (value: any) => value is PromiseLike<any>;
 /** @private is the given object/value a type of synthetic event? */
-export declare const isInputEvent: (value: any) => value is React.SyntheticEvent<any, Event>;
+export declare const isInputEvent: (value: any) => value is React.SyntheticEvent<any>;
 /**
  * Same as document.activeElement but wraps in a try-catch block. In IE it is
  * not safe to call document.activeElement if there is nothing focused.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/formex",
   "type": "module",
-  "version": "3.0.0-canary.9",
+  "version": "3.0.0-canary.91",
   "publishConfig": {
     "access": "public"
   },
@@ -24,38 +24,33 @@
     },
     "./package.json": "./package.json"
   },
-  "packageManager": "yarn@4.1.0",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "peerDependencies": {
-    "firebase": "^10.7.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "dependencies": {
     "react-fast-compare": "^3.2.2"
   },
   "devDependencies": {
-    "@types/node": "^20.11.30",
-    "@types/react": "^18.2.67",
-    "@types/react-dom": "^18.2.22",
-    "@typescript-eslint/parser": "^7.3.1",
-    "eslint": "^8.57.0",
-    "eslint-config-standard": "^17.1.0",
-    "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-n": "^16.6.2",
-    "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-react": "^7.34.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "typescript": "^5.4.2",
-    "vite": "^5.1.6"
+    "@jest/globals": "^29.7.0",
+    "@types/jest": "^29.5.12",
+    "@types/node": "^20.14.12",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "jest": "^29.7.0",
+    "ts-jest": "^29.2.3",
+    "typescript": "^5.5.4",
+    "vite": "^5.3.4"
   },
   "scripts": {
     "dev": "vite",
     "build": "vite build && tsc --emitDeclarationOnly -p tsconfig.prod.json",
-    "clean": "rm -rf dist && find ./src -name '*.js' -type f | xargs rm -f"
+    "clean": "rm -rf dist && find ./src -name '*.js' -type f | xargs rm -f",
+    "test": "jest"
   },
   "files": [
     "dist",
@@ -63,11 +58,19 @@
     "tailwind.config.js",
     "bin"
   ],
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
+  "jest": {
+    "transform": {
+      "^.+\\.tsx?$": "ts-jest"
+    },
+    "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
+    "moduleFileExtensions": [
+      "ts",
+      "tsx",
+      "js",
+      "jsx",
+      "json",
+      "node"
     ]
   },
-  "gitHead": "5bd7f971be5956d225835af3b6cbe9f71d3e7e50"
+  "gitHead": "fc773194d8166c27d04bc69fec41b171a5b3e2df"
 }

package/src/Field.tsx

@@ -23,10 +23,6 @@ export interface FormexFieldProps<Value = any, FormValues extends object = any>
     form: FormexController<FormValues>;
 }
 
-export type FieldValidator = (
-    value: any
-) => string | void | Promise<string | void>;
-
 export interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {
 
     /**