react-f0rm 0.2.2 → 0.3.0

package/dist/index.mjs

@@ -0,0 +1,1676 @@
+import * as React from 'react';
+import React__default, { useState, useRef, useEffect, useCallback, useMemo, useContext, useReducer, createContext, createElement } from 'react';
+
+function getSet(ee, key) {
+  var set = ee.get(key);
+  if (set) return set;
+  var newSet = new Set();
+  ee.set(key, newSet);
+  return newSet;
+}
+function create$2() {
+  return new Map();
+}
+function emit$1(ee, key) {
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+  (ee.get(key) || []).forEach(function (h) {
+    return h.apply(void 0, args);
+  });
+}
+function on(ee, key, handler) {
+  var set = getSet(ee, key);
+  set.add(handler);
+  return function () {
+    return set.delete(handler);
+  };
+}
+
+const pathCache = /* @__PURE__ */ new Map();
+function normalizePath(path) {
+  if (Array.isArray(path)) return path;
+  const cached = pathCache.get(path);
+  if (cached) return cached;
+  const value = parsePath(path);
+  pathCache.set(path, value);
+  return value;
+}
+function parsePath(path) {
+  const result = [];
+  let identifier = "";
+  const flushIdentifier = () => {
+    result.push(identifier);
+    identifier = "";
+  };
+  for (let i = 0; i < path.length; i++) {
+    const char = path[i];
+    if (char === ".") {
+      if (identifier !== "") flushIdentifier();
+    } else if (char === "[") {
+      if (identifier !== "") flushIdentifier();
+      const quote = path[i + 1];
+      if (quote === '"' || quote === "'") {
+        const close = path.indexOf(quote, i + 2);
+        if (close === -1) {
+          throw new TypeError(`Unterminated quote in path: ${path}`);
+        }
+        if (path[close + 1] !== "]") {
+          throw new TypeError(
+            `Expected "]" after quoted segment in path: ${path}`
+          );
+        }
+        result.push(path.slice(i + 2, close));
+        i = close + 1;
+      } else {
+        const close = path.indexOf("]", i + 1);
+        if (close === -1) {
+          throw new TypeError(`Unterminated bracket in path: ${path}`);
+        }
+        const content = path.slice(i + 1, close);
+        result.push(/^-?\d+$/.test(content) ? Number(content) : content);
+        i = close;
+      }
+    } else {
+      identifier += char;
+    }
+  }
+  if (identifier !== "" || result.length === 0) flushIdentifier();
+  return result;
+}
+function get(values, path) {
+  return path.reduce((current, p) => {
+    if (current == null) return void 0;
+    return current[p];
+  }, values);
+}
+function unset(values, path) {
+  if (!path.length || values == null) return values;
+  const [prop, ...props] = path;
+  if (props.length) {
+    const next = unset(values[prop], props);
+    return next === values[prop] ? values : set(values, path, next);
+  }
+  if (Array.isArray(values)) {
+    if (!(prop in values)) return values;
+    const arr = values.slice();
+    delete arr[prop];
+    return arr;
+  }
+  if (typeof values !== "object" || !(prop in values)) return values;
+  const copy = { ...values };
+  delete copy[prop];
+  return copy;
+}
+function set(values, path, value) {
+  if (!path.length) return value;
+  const [prop, ...props] = path;
+  if (typeof prop === "number") {
+    const arr = Array.isArray(values) ? values.slice() : [];
+    arr[prop] = set(arr[prop], props, value);
+    return arr;
+  }
+  return { ...values, [prop]: set(values && values[prop], props, value) };
+}
+function setOwned(root, path, value, owned) {
+  if (!path.length) return value;
+  let container = root;
+  let parent = null;
+  let parentProp = "";
+  for (let i = 0; i < path.length; i++) {
+    const prop = path[i];
+    if (!owned.has(container)) {
+      let copy;
+      if (typeof prop === "number") {
+        copy = Array.isArray(container) ? container.slice() : [];
+      } else {
+        copy = { ...container };
+      }
+      owned.add(copy);
+      if (i === 0) root = copy;
+      else parent[parentProp] = copy;
+      container = copy;
+    }
+    if (i === path.length - 1) {
+      container[prop] = value;
+    } else {
+      parent = container;
+      parentProp = prop;
+      container = container[prop];
+    }
+  }
+  return root;
+}
+function isPromise(value) {
+  return value && typeof value.then === "function";
+}
+function waitUntil(emitter, event, isResolve, isReject) {
+  return new Promise((resolve, reject) => {
+    if (isReject()) return void reject();
+    if (isResolve()) return void resolve();
+    const off = on(emitter, event, () => {
+      if (isReject()) {
+        off();
+        reject();
+        return;
+      }
+      if (!isResolve()) return;
+      off();
+      resolve();
+    });
+  });
+}
+
+function create$1(name) {
+  const value = normalizePath(name);
+  return { value, key: JSON.stringify(value) };
+}
+
+const emit = emit$1;
+const VALIDATION_OUTCOME = /* @__PURE__ */ Symbol("validation-outcome");
+function create(options) {
+  const emitter = create$2();
+  return {
+    emitter,
+    ...options,
+    mode: options?.mode ?? "onSubmit",
+    reValidateMode: options?.reValidateMode ?? "onChange",
+    disabled: options?.disabled ?? false,
+    initialValues: options?.initialValues ?? {},
+    values: /* @__PURE__ */ new Map(),
+    deleted: /* @__PURE__ */ new Set(),
+    errors: /* @__PURE__ */ new Map(),
+    touched: /* @__PURE__ */ new Set(),
+    validators: /* @__PURE__ */ new Map(),
+    validating: /* @__PURE__ */ new Set(),
+    parsedValues: void 0,
+    isSubmitting: false,
+    submitCount: 0,
+    isSubmitSuccessful: void 0
+  };
+}
+function getValues(form) {
+  const { initialValues, parsedValues, values, deleted } = form;
+  const owned = /* @__PURE__ */ new Set();
+  let merged = parsedValues ?? initialValues;
+  for (const [key, value] of values) {
+    merged = setOwned(merged, JSON.parse(key), value, owned);
+  }
+  for (const key of deleted) {
+    merged = unset(merged, JSON.parse(key));
+  }
+  return merged;
+}
+function getValue(form, name) {
+  return getValueByPath(form, create$1(name));
+}
+function getValueByPath({ initialValues, parsedValues, values, deleted }, path) {
+  if (values.has(path.key)) return values.get(path.key);
+  if (deleted.has(path.key)) return void 0;
+  return get(parsedValues ?? initialValues, path.value);
+}
+function setValue(form, name, value, options) {
+  setValueByPath(form, create$1(name), value, options);
+}
+function setValueByPath(form, path, value, options) {
+  const { emitter, values, deleted } = form;
+  values.set(path.key, value);
+  reviveBranch(deleted, path);
+  bumpDirtyVersion(form);
+  if (options?.shouldTouch) setTouchedByPath(form, path);
+  if (options?.shouldValidate) form.validators.get(path.key)?.();
+  emit(emitter, "change", path);
+}
+function getError(form, name) {
+  return getErrorByPath(form, create$1(name));
+}
+function getErrorByPath({ errors }, path) {
+  return errors.get(path.key)?.[0];
+}
+const NO_ERRORS = [];
+function getFieldErrors(form, name) {
+  return getFieldErrorsByPath(form, create$1(name));
+}
+function getFieldErrorsByPath({ errors }, path) {
+  return errors.get(path.key) ?? NO_ERRORS;
+}
+function getErrors({ errors }) {
+  const entries = [];
+  for (const [key, list] of errors) {
+    const path = JSON.parse(key).join(".");
+    for (const { type, message } of list) entries.push({ path, type, message });
+  }
+  return entries;
+}
+function getFirstError({ errors }) {
+  return errors.values().next().value?.[0]?.message;
+}
+function getFieldState(form, name) {
+  const path = create$1(name);
+  const { initialValues, values, touched, validating } = form;
+  const live = values.get(path.key);
+  return {
+    value: getValueByPath(form, path),
+    error: getErrorByPath(form, path),
+    errors: getFieldErrorsByPath(form, path),
+    isDirty: values.has(path.key) && get(initialValues, path.value) !== live,
+    isTouched: touched.has(path.key),
+    isValidating: validating.has(path.key)
+  };
+}
+function unsetValidatingByPath({ emitter, validating }, path) {
+  validating.delete(path.key);
+  emit(emitter, "validating", path);
+}
+function setValidatingByPath({ emitter, validating }, path) {
+  validating.add(path.key);
+  emit(emitter, "validating", path);
+}
+function setError(form, name, error) {
+  setErrorByPath(form, create$1(name), error);
+}
+function setErrorByPath({ emitter, errors }, path, error) {
+  const list = normalizeErrors(error);
+  if (list) errors.set(path.key, list);
+  else errors.delete(path.key);
+  emit(emitter, "errors", path);
+}
+function normalizeErrors(error) {
+  if (typeof error === "string") {
+    return error ? [{ type: "custom", message: error }] : void 0;
+  }
+  if (isFieldError(error)) return [error];
+  if (!error) return void 0;
+  const list = [];
+  error.forEach((item) => {
+    if (typeof item === "string" && item) {
+      list.push({ type: "custom", message: item });
+    } else if (isFieldError(item)) {
+      list.push(item);
+    }
+  });
+  return list.length ? list : void 0;
+}
+function clearErrors(form, name) {
+  const { emitter, errors } = form;
+  if (name === void 0) {
+    errors.clear();
+    emit(emitter, "errors");
+    return;
+  }
+  const paths = typeof name === "string" || isSegmentsPath(name) ? [create$1(name)] : name.map((one) => create$1(one));
+  for (const { key } of paths) errors.delete(key);
+  for (const path of paths) emit(emitter, "errors", path);
+}
+function setTouched(form, name) {
+  setTouchedByPath(form, create$1(name));
+}
+function setTouchedByPath({ emitter, touched }, path) {
+  if (touched.has(path.key)) return;
+  touched.add(path.key);
+  emit(emitter, "touched", path);
+}
+function hasTouched(form, name) {
+  return hasTouchedByPath(form, create$1(name));
+}
+function hasTouchedByPath({ touched }, path) {
+  return touched.has(path.key);
+}
+function isDirty(form) {
+  let dirty = false;
+  forEachDirtyField(form, () => {
+    dirty = true;
+  });
+  return dirty;
+}
+function forEachDirtyField({ initialValues, values }, fn) {
+  for (const [key, value] of values) {
+    const path = JSON.parse(key);
+    if (get(initialValues, path) !== value) fn(path.join("."));
+  }
+}
+const dirtyFieldsCaches = /* @__PURE__ */ new WeakMap();
+function bumpDirtyVersion(form) {
+  const cache = dirtyFieldsCaches.get(form);
+  if (cache) cache.version++;
+}
+function computeDirtyFields(form) {
+  const dirtyFields = {};
+  forEachDirtyField(form, (key) => {
+    dirtyFields[key] = true;
+  });
+  return dirtyFields;
+}
+function sameDirtyKeys(a, b) {
+  const aKeys = Object.keys(a);
+  if (aKeys.length !== Object.keys(b).length) return false;
+  return aKeys.every((key) => b[key] === true);
+}
+function getDirtyFields(form) {
+  let cache = dirtyFieldsCaches.get(form);
+  if (!cache) {
+    cache = { version: 0, result: computeDirtyFields(form) };
+    dirtyFieldsCaches.set(form, cache);
+  } else if (cache.version > 0) {
+    const result = computeDirtyFields(form);
+    if (!sameDirtyKeys(cache.result, result)) cache.result = result;
+    cache.version = 0;
+  }
+  return cache.result;
+}
+function getTouchedFields({ touched }) {
+  return Array.from(
+    touched,
+    (key) => JSON.parse(key).join(".")
+  );
+}
+function isTouched({ touched }) {
+  return touched.size > 0;
+}
+function removeField(form, name) {
+  removeFieldByPath(form, create$1(name));
+}
+function removeFieldByPath(form, { key, value: segments }) {
+  const { emitter, values, touched, errors, validating, deleted } = form;
+  values.delete(key);
+  touched.delete(key);
+  errors.delete(key);
+  validating.delete(key);
+  if (!hasLiveBranch(values, segments)) deleted.add(key);
+  bumpDirtyVersion(form);
+  emit(emitter, "change");
+  emit(emitter, "touched");
+  emit(emitter, "errors");
+  emit(emitter, "validating");
+}
+function hasLiveBranch(values, segments) {
+  for (let i = 1; i < segments.length; i++) {
+    if (values.has(JSON.stringify(segments.slice(0, i)))) return true;
+  }
+  const stem = `${JSON.stringify(segments).slice(0, -1)},`;
+  for (const key of values.keys()) {
+    if (key.startsWith(stem)) return true;
+  }
+  return false;
+}
+function reviveBranch(deleted, { key }) {
+  if (!deleted.size) return;
+  for (const tombstone of deleted) {
+    if (tombstone === key || tombstone.startsWith(`${key.slice(0, -1)},`) || key.startsWith(`${tombstone.slice(0, -1)},`)) {
+      deleted.delete(tombstone);
+    }
+  }
+}
+function setInitialValues(form, initialValues) {
+  if (form.initialValues === initialValues) return;
+  form.initialValues = initialValues;
+  form.parsedValues = void 0;
+  form.values.clear();
+  form.deleted.clear();
+  bumpDirtyVersion(form);
+  emit(form.emitter, "change");
+}
+function reset(form, initialValues, options) {
+  const dirtyValues = options?.keepDirtyValues ? Object.keys(getDirtyFields(form)).map((key) => ({
+    key,
+    value: getValue(form, key)
+  })) : [];
+  form.initialValues = initialValues;
+  form.parsedValues = void 0;
+  if (!options?.keepErrors) clearErrors(form);
+  const { emitter, touched, values, deleted, validating } = form;
+  values.clear();
+  deleted.clear();
+  if (!options?.keepTouched) touched.clear();
+  validating.clear();
+  if (!options?.keepIsSubmitting) form.isSubmitting = false;
+  if (!options?.keepSubmitCount) form.submitCount = 0;
+  if (!options?.keepIsSubmitted) form.isSubmitSuccessful = void 0;
+  bumpDirtyVersion(form);
+  for (const { key, value } of dirtyValues) {
+    setValueByPath(form, create$1(key), value);
+  }
+  emit(emitter, "change");
+  emit(emitter, "touched");
+  emit(emitter, "validating");
+  emit(emitter, "submitting");
+  emit(emitter, "submitCount");
+  emit(emitter, "submitSuccessful");
+  emit(emitter, "reset");
+}
+function resetField(form, name, options) {
+  const path = create$1(name);
+  const { emitter, values, touched, errors, deleted } = form;
+  values.delete(path.key);
+  if (form.parsedValues !== void 0) {
+    form.parsedValues = unset(form.parsedValues, path.value);
+    const initial = get(form.initialValues, path.value);
+    if (initial !== void 0) values.set(path.key, initial);
+  }
+  if (options && "value" in options) {
+    values.set(path.key, options.value);
+  }
+  reviveBranch(deleted, path);
+  emit(emitter, "change");
+  if (!options?.keepTouched && touched.delete(path.key)) {
+    emit(emitter, "touched", path);
+  }
+  if (!options?.keepErrors && errors.delete(path.key)) {
+    emit(emitter, "errors", path);
+  }
+  bumpDirtyVersion(form);
+}
+function hasErrors({ errors }) {
+  return errors.size > 0;
+}
+async function trigger(form, name) {
+  const settle = () => waitUntil(
+    form.emitter,
+    "validating",
+    () => !form.validating.size,
+    () => false
+  );
+  if (name === void 0) {
+    form.validators.forEach((validator) => validator());
+    await settle();
+    if (form.validate) {
+      const result = await form.validate(getValues(form));
+      applyValidateResult(form, result);
+    }
+    return !hasErrors(form);
+  }
+  const keys = typeof name === "string" || isSegmentsPath(name) ? [create$1(name).key] : name.map((one) => create$1(one).key);
+  keys.forEach((key) => form.validators.get(key)?.());
+  await settle();
+  return keys.every((key) => !form.errors.has(key));
+}
+function isSegmentsPath(name) {
+  return name.some((part) => typeof part === "number");
+}
+function isFieldError(value) {
+  return !!value && typeof value === "object" && typeof value.type === "string" && typeof value.message === "string";
+}
+function setFormErrors(form, result, segments = []) {
+  Object.entries(result).forEach(([key, value]) => {
+    const path = [...segments, ...normalizePath(key)];
+    if (typeof value === "string") {
+      if (value) setError(form, path, value);
+    } else if (Array.isArray(value)) {
+      setError(form, path, value);
+    } else if (isFieldError(value)) {
+      setError(form, path, value);
+    } else if (value && typeof value === "object") {
+      setFormErrors(form, value, path);
+    }
+  });
+}
+function setParsedValues(form, values) {
+  if (values === void 0 || values === form.parsedValues) return;
+  form.parsedValues = values;
+  emit(form.emitter, "change");
+}
+function applyValidateResult(form, result) {
+  if (!result) return;
+  if (typeof result === "object" && VALIDATION_OUTCOME in result) {
+    const outcome = result;
+    if (outcome.errors) setFormErrors(form, outcome.errors);
+    setParsedValues(form, outcome.values);
+    return;
+  }
+  setFormErrors(form, result);
+}
+async function ensureValidate(form) {
+  form.validators.forEach((validator) => validator());
+  await waitUntil(
+    form.emitter,
+    "validating",
+    () => !form.validating.size,
+    () => hasErrors(form)
+  ).catch(() => {
+    throw new Error(getFirstError(form));
+  });
+  if (form.validate) {
+    const result = await form.validate(getValues(form));
+    applyValidateResult(form, result);
+    if (hasErrors(form)) throw new Error(getFirstError(form));
+  }
+}
+async function validate(form) {
+  return ensureValidate(form).catch((e) => e.message);
+}
+function setIsSubmitting(form, value) {
+  form.isSubmitting = value;
+  emit(form.emitter, "submitting");
+}
+function incrementSubmitCount(form) {
+  form.submitCount++;
+  emit(form.emitter, "submitCount");
+}
+function setSubmitSuccessful(form, value) {
+  form.isSubmitSuccessful = value;
+  emit(form.emitter, "submitSuccessful");
+}
+function setDisabled(form, value) {
+  form.disabled = value;
+  emit(form.emitter, "disabled");
+}
+function nameToPath(name) {
+  if (name.startsWith("[")) {
+    try {
+      const segments = JSON.parse(name);
+      if (Array.isArray(segments)) return segments.join(".");
+    } catch {
+    }
+  }
+  return name;
+}
+function getNativeErrors(formEl) {
+  const errors = [];
+  const { elements } = formEl;
+  for (let i = 0; i < elements.length; i++) {
+    const el = elements[i];
+    if (el.name && typeof el.checkValidity === "function" && !el.checkValidity()) {
+      errors.push({
+        path: nameToPath(el.name),
+        type: "native",
+        message: el.validationMessage
+      });
+    }
+  }
+  return errors;
+}
+function handleSubmit(form, options) {
+  const {
+    onSubmit,
+    onValidSubmit,
+    onInvalidSubmit,
+    shouldFocusError = true
+  } = options ?? {};
+  return async (e) => {
+    if (e && typeof e.preventDefault === "function") {
+      e.preventDefault();
+    }
+    const formEl = e?.currentTarget;
+    setIsSubmitting(form, true);
+    incrementSubmitCount(form);
+    const values = getValues(form);
+    if (formEl && typeof formEl.checkValidity === "function" && formEl.checkValidity() === false) {
+      formEl.reportValidity();
+      if (shouldFocusError && typeof formEl.querySelector === "function") {
+        const invalid = formEl.querySelector(":invalid");
+        if (invalid && typeof invalid.focus === "function") invalid.focus();
+      }
+      setIsSubmitting(form, false);
+      setSubmitSuccessful(form, false);
+      if (onInvalidSubmit) onInvalidSubmit(getNativeErrors(formEl), values);
+      return;
+    }
+    const error = await validate(form);
+    if (error) {
+      setIsSubmitting(form, false);
+      setSubmitSuccessful(form, false);
+      if (shouldFocusError) {
+        const firstKey = form.errors.keys().next().value;
+        if (firstKey !== void 0) emit(form.emitter, "focusError", firstKey);
+      }
+      if (onInvalidSubmit) onInvalidSubmit(getErrors(form), values);
+      return;
+    }
+    try {
+      const submitted = getValues(form);
+      if (onSubmit) await onSubmit(submitted, e);
+      if (onValidSubmit) await onValidSubmit(submitted, e);
+      setSubmitSuccessful(form, true);
+    } catch {
+      setSubmitSuccessful(form, false);
+    } finally {
+      setIsSubmitting(form, false);
+    }
+  };
+}
+function setFocus(form, name, options) {
+  const { key } = create$1(name);
+  if (options) emit(form.emitter, "focusError", key, options);
+  else emit(form.emitter, "focusError", key);
+}
+
+function defaultMessage(type, bound) {
+  switch (type) {
+    case "required":
+      return "This field is required";
+    case "min":
+      return `Must be at least ${bound}`;
+    case "max":
+      return `Must be at most ${bound}`;
+    case "minLength":
+      return `Must be at least ${bound} characters`;
+    case "maxLength":
+      return `Must be at most ${bound} characters`;
+    case "pattern":
+      return "Invalid format";
+    default:
+      return "Invalid value";
+  }
+}
+function rulesToValidator(rules) {
+  return (value) => {
+    if (rules.required) {
+      if (value === "" || value === void 0 || value === null) {
+        return [
+          {
+            type: "required",
+            message: typeof rules.required === "string" ? rules.required : defaultMessage("required")
+          }
+        ];
+      }
+    }
+    const errors = [];
+    const message = (type, bound) => rules.messages?.[type] ?? defaultMessage(type, bound);
+    if (rules.min !== void 0) {
+      const n = Number(value);
+      if (!Number.isNaN(n) && n < rules.min) {
+        errors.push({ type: "min", message: message("min", rules.min) });
+      }
+    }
+    if (rules.max !== void 0) {
+      const n = Number(value);
+      if (!Number.isNaN(n) && n > rules.max) {
+        errors.push({ type: "max", message: message("max", rules.max) });
+      }
+    }
+    if (rules.minLength !== void 0 && typeof value === "string" && value.length < rules.minLength) {
+      errors.push({
+        type: "minLength",
+        message: message("minLength", rules.minLength)
+      });
+    }
+    if (rules.maxLength !== void 0 && typeof value === "string" && value.length > rules.maxLength) {
+      errors.push({
+        type: "maxLength",
+        message: message("maxLength", rules.maxLength)
+      });
+    }
+    if (rules.pattern && !rules.pattern.value.test(value)) {
+      errors.push({
+        type: "pattern",
+        // pattern.message is type-required but JS consumers may omit it.
+        message: rules.messages?.pattern ?? rules.pattern.message ?? defaultMessage("pattern")
+      });
+    }
+    return errors.length ? errors : void 0;
+  };
+}
+
+var shim = {exports: {}};
+
+var useSyncExternalStoreShim_production = {};
+
+/**
+ * @license React
+ * use-sync-external-store-shim.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+var hasRequiredUseSyncExternalStoreShim_production;
+
+function requireUseSyncExternalStoreShim_production () {
+	if (hasRequiredUseSyncExternalStoreShim_production) return useSyncExternalStoreShim_production;
+	hasRequiredUseSyncExternalStoreShim_production = 1;
+	var React = React__default;
+	function is(x, y) {
+	  return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
+	}
+	var objectIs = "function" === typeof Object.is ? Object.is : is,
+	  useState = React.useState,
+	  useEffect = React.useEffect,
+	  useLayoutEffect = React.useLayoutEffect,
+	  useDebugValue = React.useDebugValue;
+	function useSyncExternalStore$2(subscribe, getSnapshot) {
+	  var value = getSnapshot(),
+	    _useState = useState({ inst: { value: value, getSnapshot: getSnapshot } }),
+	    inst = _useState[0].inst,
+	    forceUpdate = _useState[1];
+	  useLayoutEffect(
+	    function () {
+	      inst.value = value;
+	      inst.getSnapshot = getSnapshot;
+	      checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+	    },
+	    [subscribe, value, getSnapshot]
+	  );
+	  useEffect(
+	    function () {
+	      checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+	      return subscribe(function () {
+	        checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+	      });
+	    },
+	    [subscribe]
+	  );
+	  useDebugValue(value);
+	  return value;
+	}
+	function checkIfSnapshotChanged(inst) {
+	  var latestGetSnapshot = inst.getSnapshot;
+	  inst = inst.value;
+	  try {
+	    var nextValue = latestGetSnapshot();
+	    return !objectIs(inst, nextValue);
+	  } catch (error) {
+	    return !0;
+	  }
+	}
+	function useSyncExternalStore$1(subscribe, getSnapshot) {
+	  return getSnapshot();
+	}
+	var shim =
+	  "undefined" === typeof window ||
+	  "undefined" === typeof window.document ||
+	  "undefined" === typeof window.document.createElement
+	    ? useSyncExternalStore$1
+	    : useSyncExternalStore$2;
+	useSyncExternalStoreShim_production.useSyncExternalStore =
+	  void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
+	return useSyncExternalStoreShim_production;
+}
+
+var useSyncExternalStoreShim_development = {};
+
+/**
+ * @license React
+ * use-sync-external-store-shim.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+var hasRequiredUseSyncExternalStoreShim_development;
+
+function requireUseSyncExternalStoreShim_development () {
+	if (hasRequiredUseSyncExternalStoreShim_development) return useSyncExternalStoreShim_development;
+	hasRequiredUseSyncExternalStoreShim_development = 1;
+	"production" !== process.env.NODE_ENV &&
+	  (function () {
+	    function is(x, y) {
+	      return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
+	    }
+	    function useSyncExternalStore$2(subscribe, getSnapshot) {
+	      didWarnOld18Alpha ||
+	        void 0 === React.startTransition ||
+	        ((didWarnOld18Alpha = !0),
+	        console.error(
+	          "You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."
+	        ));
+	      var value = getSnapshot();
+	      if (!didWarnUncachedGetSnapshot) {
+	        var cachedValue = getSnapshot();
+	        objectIs(value, cachedValue) ||
+	          (console.error(
+	            "The result of getSnapshot should be cached to avoid an infinite loop"
+	          ),
+	          (didWarnUncachedGetSnapshot = !0));
+	      }
+	      cachedValue = useState({
+	        inst: { value: value, getSnapshot: getSnapshot }
+	      });
+	      var inst = cachedValue[0].inst,
+	        forceUpdate = cachedValue[1];
+	      useLayoutEffect(
+	        function () {
+	          inst.value = value;
+	          inst.getSnapshot = getSnapshot;
+	          checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+	        },
+	        [subscribe, value, getSnapshot]
+	      );
+	      useEffect(
+	        function () {
+	          checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+	          return subscribe(function () {
+	            checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+	          });
+	        },
+	        [subscribe]
+	      );
+	      useDebugValue(value);
+	      return value;
+	    }
+	    function checkIfSnapshotChanged(inst) {
+	      var latestGetSnapshot = inst.getSnapshot;
+	      inst = inst.value;
+	      try {
+	        var nextValue = latestGetSnapshot();
+	        return !objectIs(inst, nextValue);
+	      } catch (error) {
+	        return !0;
+	      }
+	    }
+	    function useSyncExternalStore$1(subscribe, getSnapshot) {
+	      return getSnapshot();
+	    }
+	    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
+	      "function" ===
+	        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart &&
+	      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
+	    var React = React__default,
+	      objectIs = "function" === typeof Object.is ? Object.is : is,
+	      useState = React.useState,
+	      useEffect = React.useEffect,
+	      useLayoutEffect = React.useLayoutEffect,
+	      useDebugValue = React.useDebugValue,
+	      didWarnOld18Alpha = !1,
+	      didWarnUncachedGetSnapshot = !1,
+	      shim =
+	        "undefined" === typeof window ||
+	        "undefined" === typeof window.document ||
+	        "undefined" === typeof window.document.createElement
+	          ? useSyncExternalStore$1
+	          : useSyncExternalStore$2;
+	    useSyncExternalStoreShim_development.useSyncExternalStore =
+	      void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
+	    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
+	      "function" ===
+	        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
+	      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
+	  })();
+	return useSyncExternalStoreShim_development;
+}
+
+if (process.env.NODE_ENV === 'production') {
+  shim.exports = requireUseSyncExternalStoreShim_production();
+} else {
+  shim.exports = requireUseSyncExternalStoreShim_development();
+}
+
+var shimExports = shim.exports;
+
+function isDescendant(key, ancestorKey) {
+  return key.startsWith(`${ancestorKey.slice(0, -1)},`);
+}
+function onPathEvent(emitter, event, path, scope, cb) {
+  const { key } = path;
+  return on(emitter, event, (changed) => {
+    if (changed === void 0 || changed.key === key || isDescendant(key, changed.key) || scope === "branch" && isDescendant(changed.key, key)) {
+      cb();
+    }
+  });
+}
+function onKeyEvent(emitter, event, key, cb) {
+  return on(emitter, event, (changed) => {
+    if (changed === void 0 || changed.key === key) cb();
+  });
+}
+function isNameList(name) {
+  return Array.isArray(name) && name.every((part) => typeof part !== "number");
+}
+function subscribe(form, options) {
+  const { name, event = "change", scope = "branch", callback } = options;
+  if (name === void 0) return on(form.emitter, event, callback);
+  const names = isNameList(name) ? name : [name];
+  const unsubscribes = names.map((one) => {
+    const path = create$1(one);
+    return event === "errors" || event === "touched" ? onKeyEvent(form.emitter, event, path.key, callback) : onPathEvent(form.emitter, event, path, scope, callback);
+  });
+  return unsubscribes.length === 1 ? unsubscribes[0] : () => unsubscribes.forEach((unsubscribe) => unsubscribe());
+}
+
+function useForm(options) {
+  const [form] = useState(() => {
+    const created = create(options);
+    if (options && options.values !== void 0) {
+      setInitialValues(created, options.values);
+    }
+    return created;
+  });
+  const initialValues = options && options.initialValues;
+  const values = options && options.values;
+  const seededRef = useRef(null);
+  if (seededRef.current === null)
+    seededRef.current = { done: false, source: void 0 };
+  useEffect(() => {
+    const seeded = seededRef.current;
+    if (seeded.done && (seeded.source === initialValues || isEqual(seeded.source, initialValues))) {
+      return;
+    }
+    seeded.done = true;
+    seeded.source = initialValues;
+    setInitialValues(form, initialValues);
+  }, [form, initialValues]);
+  const controlledRef = useRef(null);
+  if (controlledRef.current === null) {
+    controlledRef.current = { done: false, source: void 0 };
+  }
+  useEffect(() => {
+    if (values === void 0) return;
+    const seeded = controlledRef.current;
+    if (seeded.done && (seeded.source === values || isEqual(seeded.source, values))) {
+      return;
+    }
+    seeded.done = true;
+    seeded.source = values;
+    setInitialValues(form, values);
+  }, [form, values]);
+  return form;
+}
+function useWatchCore(subscribeFactory, getter) {
+  const cacheRef = useRef(null);
+  if (cacheRef.current === null) cacheRef.current = { hasValue: false };
+  const cache = cacheRef.current;
+  const getterRef = useRef(getter);
+  getterRef.current = getter;
+  const getSnapshot = useCallback(() => {
+    if (!cache.hasValue) {
+      cache.value = getterRef.current();
+      cache.hasValue = true;
+    }
+    return cache.value;
+  }, [cache]);
+  const subscribe = useCallback(
+    (notify) => {
+      cache.hasValue = false;
+      const invalidate = () => {
+        cache.hasValue = false;
+        notify();
+      };
+      return subscribeFactory(invalidate);
+    },
+    [subscribeFactory, cache]
+  );
+  return shimExports.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+}
+function useWatch(emitter, event, getter) {
+  const subscribeFactory = useCallback(
+    (invalidate) => on(emitter, event, invalidate),
+    [emitter, event]
+  );
+  return useWatchCore(subscribeFactory, getter);
+}
+function useValue(form, name) {
+  return useValueByPath(form, create$1(name));
+}
+function useValueByPath(form, path) {
+  const { emitter } = form;
+  const { key } = path;
+  const subscribeFactory = useCallback(
+    (invalidate) => onPathEvent(emitter, "change", path, "leaf", invalidate),
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- deps are `key` on purpose: useValue creates a fresh Path per render, so the object must stay out of the deps while the key string pins the subscription
+    [emitter, key]
+  );
+  return useWatchCore(subscribeFactory, getValueByPath.bind(null, form, path));
+}
+function useTouched(form, name) {
+  return useTouchedByPath(form, create$1(name));
+}
+function useTouchedByPath(form, path) {
+  const { emitter } = form;
+  const { key } = path;
+  const subscribeFactory = useCallback(
+    (invalidate) => onKeyEvent(emitter, "touched", key, invalidate),
+    [emitter, key]
+  );
+  return useWatchCore(
+    subscribeFactory,
+    hasTouchedByPath.bind(null, form, path)
+  );
+}
+function useError(form, name) {
+  return useErrorByPath(form, create$1(name))?.message;
+}
+function useErrorByPath(form, path) {
+  const { emitter } = form;
+  const { key } = path;
+  const subscribeFactory = useCallback(
+    (invalidate) => onKeyEvent(emitter, "errors", key, invalidate),
+    [emitter, key]
+  );
+  return useWatchCore(subscribeFactory, getErrorByPath.bind(null, form, path));
+}
+function useFieldErrors(form, name) {
+  return useFieldErrorsByPath(form, create$1(name));
+}
+function useFieldErrorsByPath(form, path) {
+  const { emitter } = form;
+  const { key } = path;
+  const subscribeFactory = useCallback(
+    (invalidate) => onKeyEvent(emitter, "errors", key, invalidate),
+    [emitter, key]
+  );
+  return useWatchCore(
+    subscribeFactory,
+    getFieldErrorsByPath.bind(null, form, path)
+  );
+}
+function useIsDirty(form) {
+  return useWatch(form.emitter, "change", isDirty.bind(null, form));
+}
+function useDirtyFields(form) {
+  return useWatch(form.emitter, "change", getDirtyFields.bind(null, form));
+}
+function useTouchedFields(form) {
+  return useWatch(form.emitter, "touched", getTouchedFields.bind(null, form));
+}
+function useHasErrors(form) {
+  return useWatch(form.emitter, "errors", hasErrors.bind(null, form));
+}
+function useIsSubmitting(form) {
+  return useWatch(form.emitter, "submitting", () => form.isSubmitting);
+}
+function useSubmitCount(form) {
+  return useWatch(form.emitter, "submitCount", () => form.submitCount);
+}
+function isEqual(a, b) {
+  if (Object.is(a, b)) return true;
+  if (a instanceof Date && b instanceof Date)
+    return a.getTime() === b.getTime();
+  if (!a || !b || typeof a !== "object" || typeof b !== "object") return false;
+  const isArray = Array.isArray(a);
+  if (isArray !== Array.isArray(b)) return false;
+  if (isArray) {
+    if (a.length !== b.length) return false;
+    for (let i = 0; i < a.length; i++) {
+      if (!isEqual(a[i], b[i])) return false;
+    }
+    return true;
+  }
+  const proto = Object.getPrototypeOf(a);
+  if (proto !== Object.prototype && proto !== null) return false;
+  if (Object.getPrototypeOf(b) !== proto) return false;
+  const keysA = Object.keys(a);
+  const keysB = Object.keys(b);
+  if (keysA.length !== keysB.length) return false;
+  for (const key of keysA) {
+    if (!isEqual(a[key], b[key])) return false;
+  }
+  return true;
+}
+
+function usePath(name) {
+  const path = useMemo(() => create$1(normalizePath(name)), [name]);
+  return useMemo(() => path, [path.key]);
+}
+
+function useStage(value) {
+  const ref = useRef(value);
+  ref.current = value;
+  return ref;
+}
+function useStageFn(fn) {
+  const ref = useStage(fn);
+  return useCallback(
+    (...params) => ref.current(...params),
+    [ref]
+  );
+}
+
+function useValidate(validate, path, formProp, options) {
+  const contextForm = useContext(FormContext);
+  const form = formProp || contextForm;
+  if (!form) throw new Error("no form provided");
+  const lockRef = useRef(null);
+  const validateRef = useRef(validate);
+  validateRef.current = validate;
+  const debounceRef = useRef(options?.debounce ?? 0);
+  debounceRef.current = options?.debounce ?? 0;
+  useEffect(() => {
+    let timer = null;
+    let controller = null;
+    let marked = false;
+    const mark = () => {
+      if (marked) return;
+      marked = true;
+      setValidatingByPath(form, path);
+    };
+    const unmark = () => {
+      if (!marked) return;
+      marked = false;
+      unsetValidatingByPath(form, path);
+    };
+    const run = () => {
+      timer = null;
+      const fn = validateRef.current;
+      if (!fn) {
+        unmark();
+        return;
+      }
+      controller?.abort();
+      controller = new AbortController();
+      const lock = lockRef.current = {};
+      let result;
+      try {
+        result = fn(getValueByPath(form, path), {
+          form,
+          path,
+          signal: controller.signal
+        });
+      } catch (e) {
+        unmark();
+        throw e;
+      }
+      if (!isPromise(result)) {
+        setErrorByPath(form, path, result);
+        unmark();
+        return;
+      }
+      mark();
+      result.then(
+        (error) => {
+          if (lock === lockRef.current) {
+            setErrorByPath(form, path, error);
+          }
+        }
+      ).catch(() => {
+      }).finally(() => {
+        if (lock === lockRef.current) {
+          unmark();
+          lockRef.current = null;
+        }
+      });
+    };
+    const validator = () => {
+      const debounce = debounceRef.current;
+      if (debounce > 0) {
+        if (timer !== null) clearTimeout(timer);
+        else mark();
+        timer = setTimeout(run, debounce);
+        return;
+      }
+      run();
+    };
+    form.validators.set(path.key, validator);
+    return () => {
+      form.validators.delete(path.key);
+      if (timer !== null) {
+        clearTimeout(timer);
+        timer = null;
+      }
+      unmark();
+      controller?.abort();
+    };
+  }, [form, path.key]);
+  return useStageFn(() => form.validators.get(path.key)?.());
+}
+
+function combineRulesAndValidate(rules, validate) {
+  if (!rules) return validate;
+  const ruleValidator = rulesToValidator(rules);
+  if (!validate) return ruleValidator;
+  return (value, meta) => {
+    const ruleErrors = ruleValidator(value, meta);
+    const merge = (other) => {
+      const list = [...ruleErrors ?? []];
+      if (Array.isArray(other)) list.push(...other);
+      else if (other) list.push(other);
+      return list.length ? list : void 0;
+    };
+    const result = validate(value, meta);
+    return isPromise(result) ? result.then(merge) : merge(result);
+  };
+}
+function useDelayedErrors(errors, delay) {
+  const [shown, setShown] = useState(errors);
+  useEffect(() => {
+    if (delay === void 0) return;
+    if (errors.length === 0) {
+      setShown(errors);
+      return;
+    }
+    if (shown.length > 0) {
+      setShown(errors);
+      return;
+    }
+    const timer = setTimeout(() => setShown(errors), delay);
+    return () => clearTimeout(timer);
+  }, [errors, delay, shown]);
+  return delay === void 0 ? errors : shown;
+}
+function useFieldCore({
+  form: f1,
+  name,
+  initialValue,
+  shouldUnregister,
+  validate,
+  rules,
+  validateDebounce,
+  delayError,
+  disabled
+}, Context) {
+  const contextForm = useContext(Context);
+  const form = f1 || contextForm;
+  if (!form) throw new Error("no form provided");
+  const path = usePath(name);
+  const validator = useValidate(
+    combineRulesAndValidate(rules, validate),
+    path,
+    form,
+    {
+      debounce: validateDebounce
+    }
+  );
+  const liveErrors = useFieldErrorsByPath(form, path);
+  const errors = useDelayedErrors(liveErrors, delayError);
+  const errorObject = errors[0];
+  const error = errorObject?.message;
+  const value = useValueByPath(form, path);
+  const formDisabled = useWatch(form.emitter, "disabled", () => form.disabled);
+  useEffect(() => {
+    if (initialValue === void 0) return;
+    if (getValueByPath(form, path) === void 0) {
+      setValueByPath(form, path, initialValue);
+    }
+  }, [form, path, initialValue]);
+  const onChange = useStageFn((v) => {
+    setValueByPath(form, path, v);
+    if (form.mode === "onChange" || form.mode === "all" || form.mode === "onTouched" && hasTouchedByPath(form, path) || liveErrors.length > 0 && form.reValidateMode === "onChange")
+      validator();
+  });
+  const onBlur = useStageFn(() => {
+    setTouchedByPath(form, path);
+    if (form.mode === "onBlur" || form.mode === "onTouched" || form.mode === "all" || liveErrors.length > 0 && form.reValidateMode === "onBlur")
+      validator();
+  });
+  useEffect(
+    () => () => {
+      if (shouldUnregister !== false) {
+        removeFieldByPath(form, path);
+      }
+    },
+    [path, form, shouldUnregister]
+  );
+  return {
+    form,
+    value,
+    error,
+    errorObject,
+    errors,
+    onChange,
+    onBlur,
+    name: path.key,
+    disabled: formDisabled || !!disabled
+  };
+}
+function useField(options) {
+  return useFieldCore(options, FormContext);
+}
+
+let idCounter = 0;
+function generateId() {
+  return `_${++idCounter}`;
+}
+function useFieldArrayCore(options, Context) {
+  const contextForm = useContext(Context);
+  const form = options.form || contextForm;
+  if (!form) throw new Error("no form provided");
+  const path = usePath(options.name);
+  const idsRef = useRef([]);
+  const getArray = useCallback(
+    () => getValueByPath(form, path) || [],
+    [form, path]
+  );
+  const setArray = useCallback(
+    (arr) => {
+      setValueByPath(form, path, arr);
+    },
+    [form, path]
+  );
+  const computeFields = useCallback(() => {
+    const arr = getArray();
+    while (idsRef.current.length < arr.length) {
+      idsRef.current.push(generateId());
+    }
+    while (idsRef.current.length > arr.length) {
+      idsRef.current.pop();
+    }
+    return idsRef.current.map((id, index) => ({ id, index }));
+  }, [getArray]);
+  const [fields, syncFields] = useReducer(
+    computeFields,
+    void 0,
+    computeFields
+  );
+  useEffect(
+    () => onPathEvent(form.emitter, "change", path, "branch", syncFields),
+    [form.emitter, path]
+  );
+  const append = useStageFn((value) => {
+    const arr = getArray();
+    idsRef.current.push(generateId());
+    setArray([...arr, value]);
+  });
+  const prepend = useStageFn((value) => {
+    const arr = getArray();
+    idsRef.current.unshift(generateId());
+    setArray([value, ...arr]);
+  });
+  const insert = useStageFn((index, value) => {
+    const arr = getArray();
+    idsRef.current.splice(index, 0, generateId());
+    const newArr = [...arr.slice(0, index), value, ...arr.slice(index)];
+    setArray(newArr);
+  });
+  const remove = useStageFn((index) => {
+    const arr = getArray();
+    idsRef.current.splice(index, 1);
+    const newArr = arr.filter((_, i) => i !== index);
+    setArray(newArr);
+  });
+  const swap = useStageFn((from, to) => {
+    const arr = getArray();
+    [idsRef.current[from], idsRef.current[to]] = [
+      idsRef.current[to],
+      idsRef.current[from]
+    ];
+    const newArr = [...arr];
+    [newArr[from], newArr[to]] = [newArr[to], newArr[from]];
+    setArray(newArr);
+  });
+  const move = useStageFn((from, to) => {
+    const arr = getArray();
+    const [id] = idsRef.current.splice(from, 1);
+    idsRef.current.splice(to, 0, id);
+    const newArr = [...arr];
+    const [item] = newArr.splice(from, 1);
+    newArr.splice(to, 0, item);
+    setArray(newArr);
+  });
+  const replace = useStageFn((values) => {
+    idsRef.current = values.map(() => generateId());
+    setArray([...values]);
+  });
+  const update = useStageFn((index, value) => {
+    const arr = getArray();
+    if (index < 0 || index >= arr.length) return;
+    const newArr = [...arr];
+    newArr[index] = value;
+    setArray(newArr);
+  });
+  return { fields, append, prepend, insert, remove, swap, move, replace, update };
+}
+function useFieldArray(options) {
+  return useFieldArrayCore(options, FormContext);
+}
+
+const FormContext = createContext(null);
+const FormProvider = FormContext.Provider;
+function useFormContext() {
+  const form = useContext(FormContext);
+  if (!form) throw new Error("no form provided");
+  return form;
+}
+function createFormContext() {
+  const Context = createContext(null);
+  function FormProvider2({
+    form,
+    children
+  }) {
+    return createElement(Context.Provider, { value: form }, children);
+  }
+  function useFormContext2() {
+    const form = useContext(Context);
+    if (!form) throw new Error("no form provided");
+    return form;
+  }
+  function useField(options) {
+    return useFieldCore(options, Context);
+  }
+  function useFieldArray(options) {
+    return useFieldArrayCore(options, Context);
+  }
+  return { FormProvider: FormProvider2, useFormContext: useFormContext2, useField, useFieldArray };
+}
+const CheckboxGroupContext = createContext(null);
+const CheckboxGroupProvider = CheckboxGroupContext.Provider;
+function useCheckboxGroupContext() {
+  const group = useContext(CheckboxGroupContext);
+  if (!group) throw new Error("no group provided");
+  return group;
+}
+
+function Form({
+  form: f1,
+  initialValues,
+  values,
+  onSubmit,
+  onValidSubmit,
+  onInvalidSubmit,
+  shouldFocusError,
+  ...props
+}) {
+  const f2 = useForm({ initialValues, values });
+  const form = f1 || f2;
+  const submit = handleSubmit(form, {
+    onSubmit,
+    onValidSubmit,
+    onInvalidSubmit,
+    shouldFocusError
+  });
+  return /* @__PURE__ */ React.createElement(FormProvider, { value: form }, /* @__PURE__ */ React.createElement("form", { ...props, noValidate: true, onSubmit: submit }));
+}
+
+function setRef(ref, value) {
+  if (typeof ref === "function") {
+    ref(value);
+  } else if (ref) {
+    ref.current = value;
+  }
+}
+function errorIdFromKey(key) {
+  const id = key.replace(/["'[\],\s]+/g, "-").replace(/^-+|-+$/g, "");
+  return id || "field";
+}
+const Field = React.forwardRef(
+  ({
+    validate,
+    eventToValue,
+    initialValue,
+    name,
+    asProps,
+    renderError,
+    as,
+    valueToProps,
+    form: formProp,
+    shouldUnregister,
+    rules,
+    validateDebounce,
+    disabled,
+    delayError,
+    ...props
+  }, ref) => {
+    const innerRef = React.useRef(null);
+    const [nativeInvalidCount, setNativeInvalidCount] = React.useState(0);
+    const mergedRef = React.useCallback(
+      (node) => {
+        innerRef.current = node;
+        setRef(ref, node);
+      },
+      [ref]
+    );
+    const {
+      value,
+      onChange,
+      onBlur,
+      error,
+      form,
+      name: fieldKey,
+      disabled: isDisabled
+    } = useField({
+      name,
+      form: formProp,
+      initialValue,
+      shouldUnregister,
+      rules,
+      validateDebounce,
+      delayError,
+      disabled,
+      validate: (...params) => {
+        const el = innerRef.current;
+        if (el && typeof el.checkValidity === "function") {
+          el.setCustomValidity("");
+          if (el.checkValidity() === false) {
+            setNativeInvalidCount((count) => count + 1);
+            return void 0;
+          }
+        }
+        if (validate) return validate(...params);
+      }
+    });
+    const Component = as || "input";
+    React.useEffect(() => {
+      const el = innerRef.current;
+      if (!el || typeof el.setCustomValidity !== "function") return;
+      if (typeof error === "string") {
+        el.setCustomValidity(error);
+        el.reportValidity();
+      } else {
+        el.setCustomValidity("");
+      }
+    }, [error]);
+    React.useEffect(() => {
+      if (nativeInvalidCount > 0) innerRef.current?.reportValidity();
+    }, [nativeInvalidCount]);
+    React.useEffect(
+      () => on(
+        form.emitter,
+        "focusError",
+        (key, options) => {
+          if (key !== fieldKey) return;
+          const el = innerRef.current;
+          if (!el || typeof el.focus !== "function") return;
+          el.focus();
+          if (options?.shouldSelect && typeof el.select === "function") {
+            el.select();
+          }
+        }
+      ),
+      [form, fieldKey]
+    );
+    const toValue = eventToValue ?? ((e) => e.target.value);
+    const errorId = errorIdFromKey(fieldKey);
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+      Component,
+      {
+        "aria-invalid": error ? true : void 0,
+        "aria-describedby": error && renderError ? errorId : void 0,
+        ...props,
+        name: fieldKey,
+        onBlur,
+        ...asProps,
+        ...valueToProps ? valueToProps(value) : { value },
+        disabled: isDisabled,
+        onChange: (e) => onChange(toValue(e)),
+        ref: mergedRef
+      }
+    ), error && renderError ? /* @__PURE__ */ React.createElement("span", { id: errorId, role: "alert" }, renderError(error, errorId)) : null);
+  }
+);
+const Checkbox = React.forwardRef(
+  ({
+    name,
+    form,
+    initialValue,
+    shouldUnregister,
+    validate,
+    rules,
+    validateDebounce,
+    disabled,
+    delayError,
+    ...props
+  }, ref) => {
+    const {
+      value,
+      onChange,
+      onBlur,
+      error,
+      name: fieldKey,
+      disabled: isDisabled
+    } = useField({
+      name,
+      form,
+      initialValue,
+      shouldUnregister,
+      validate,
+      rules,
+      validateDebounce,
+      delayError,
+      disabled
+    });
+    return /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        "aria-invalid": error ? true : void 0,
+        ...props,
+        name: fieldKey,
+        onBlur,
+        type: "checkbox",
+        checked: !!value,
+        disabled: isDisabled,
+        onChange: (e) => onChange(e.target.checked),
+        ref
+      }
+    );
+  }
+);
+function toSelectValue(multiple, value) {
+  if (multiple) return Array.isArray(value) ? value : [];
+  return value ?? "";
+}
+const Select = React.forwardRef(
+  ({
+    name,
+    multiple,
+    children,
+    form,
+    initialValue,
+    shouldUnregister,
+    validate,
+    rules,
+    validateDebounce,
+    disabled,
+    delayError,
+    ...props
+  }, ref) => {
+    const {
+      value,
+      onChange,
+      onBlur,
+      error,
+      name: fieldKey,
+      disabled: isDisabled
+    } = useField({
+      name,
+      form,
+      initialValue,
+      shouldUnregister,
+      validate,
+      rules,
+      validateDebounce,
+      delayError,
+      disabled
+    });
+    return /* @__PURE__ */ React.createElement(
+      "select",
+      {
+        "aria-invalid": error ? true : void 0,
+        ...props,
+        name: fieldKey,
+        onBlur,
+        multiple,
+        value: toSelectValue(multiple, value),
+        disabled: isDisabled,
+        onChange: (e) => onChange(
+          multiple ? Array.from(e.target.selectedOptions, (option) => option.value) : e.target.value
+        ),
+        ref
+      },
+      children
+    );
+  }
+);
+
+export { Checkbox, CheckboxGroupContext, CheckboxGroupProvider, Field, Form, FormContext, FormProvider, Select, VALIDATION_OUTCOME, clearErrors, create as createForm, createFormContext, ensureValidate, getDirtyFields, getError, getErrorByPath, getErrors, getFieldErrors, getFieldErrorsByPath, getFieldState, getFirstError, getTouchedFields, getValue, getValueByPath, getValues, handleSubmit, hasErrors, hasTouched, hasTouchedByPath, incrementSubmitCount, isDirty, isTouched, removeField, removeFieldByPath, reset, resetField, setDisabled, setError, setErrorByPath, setFocus, setInitialValues, setIsSubmitting, setSubmitSuccessful, setTouched, setTouchedByPath, setValidatingByPath, setValue, setValueByPath, subscribe, trigger, unsetValidatingByPath, useCheckboxGroupContext, useDirtyFields, useError, useErrorByPath, useField, useFieldArray, useFieldErrors, useFieldErrorsByPath, useForm, useFormContext, useHasErrors, useIsDirty, useIsSubmitting, useSubmitCount, useTouched, useTouchedByPath, useTouchedFields, useValue, useValueByPath, useWatch, validate };
+//# sourceMappingURL=index.mjs.map