react-simple-formkit 2.4.5 → 2.4.6

package/README.md

@@ -1,12 +1,17 @@
 # React Simple FormKit
 
+[![npm version](https://img.shields.io/npm/v/react-simple-formkit.svg)](https://www.npmjs.com/package/react-simple-formkit)
+[![bundle size](https://img.shields.io/bundlephobia/minzip/react-simple-formkit)](https://bundlephobia.com/package/react-simple-formkit)
+[![license](https://img.shields.io/npm/l/react-simple-formkit.svg)](https://github.com/huynguyen294/react-simple-formkit/blob/main/LICENSE)
+[![npm downloads](https://img.shields.io/npm/dm/react-simple-formkit.svg)](https://www.npmjs.com/package/react-simple-formkit)
+
 A lightweight library for managing forms as uncontrolled. State updates only when actively watched. Simple and quick to configure with outstanding efficiency.
 
 # Table of Contents
 
-- [Peer dependencies](#peer-dependencies)
-- [Features](#features)
 - [Quick start](#quick-start)
+- [Highlights](#highlights)
+- [Features](#features)
 - [Core concepts](#core-concepts)
   - [Input Field Modes](#input-field-modes)
   - [Watching for updates](#watching-for-updates)
@@ -39,30 +44,11 @@ A lightweight library for managing forms as uncontrolled. State updates only whe
 - [Examples](#examples)
 - [Contact](#contact)
 
-# Peer dependencies
-
-```
-"peerDependencies": {
-  "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
-  "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
-},
-```
-
-# Features
-
-- **Lightweight**: Only ~**15KB**
-- **Easy setup**: Simple and quick configuration
-- **Optimized for uncontrolled forms**: No unnecessary re-renders
-- Comprehensive form management:
-  - [Managing values](#managing-values): get/set values, defaults, reset, ...
-  - [Managing form state](#managing-form-state): isDirty, isError, dirtyFields, touchedFields, errorFields, ...
-  - [Managing field states](#managing-field-states): isDirty, isTouched, isError, custom states, ...
-  - [Managing errors](#managing-errors): form errors, field errors, ...
-  - [Grouping fields (nested object)](#grouping-fields-nested-object): Supports nested fields with dot notation.
-
 # Quick start
 
-```
+```jsx
+import { useForm } from "react-simple-formkit";
+
 const { control } = useForm();
 
 const handleSubmit = (data) => {
@@ -81,6 +67,62 @@ return (
 );
 ```
 
+# Highlights
+
+- 🪶 **Lightweight** — ~20KB, zero dependencies, supports React 17, 18, and 19
+- 📦 **Easy data collection** — Automatically collects all input values including nested objects, just by using the `name` attribute
+- 📊 **Comprehensive state management** — Track isDirty, isTouched, errors at both form level and individual field level
+- 🧠 **Unified Observation** — One `watch()` API for values, errors, formState, and fieldStates using dot-notation syntax
+- 👀 **Flexible watching** — `watch()`, `useWatch()`, and `subscribe()` all share the same name format, with support for both `onChange` and `onBlur` modes
+- 🏷️ **Unlimited custom states** — Add any custom state to fields and forms (hidden, disabled, verificationStatus, ...)
+- 🔄 **Flexible set & reset** — Set/get individual field values, reset the entire form or per field, supports callback in setValue
+- 🌳 **Nested objects** — Group fields into nested structures with dot-notation (`address.line1`), with event bubble & trickle support
+
+# Features
+
+## [Managing Values](#managing-values)
+
+- **Auto collection** — All `<input>`, `<select>`, `<textarea>` with a `name` attribute are automatically collected on change, blur, submit.
+- **Flexible get/set** — `actions.getValues()`, `actions.setValue("field", value)`, or `actions.setValue("field", prev => prev + 1)` with callback support
+- **Default values** — Pass `defaultValues` on initialization, automatically populates into inputs
+- **Reset** — `actions.reset()` to default values, or `actions.reset(newValues)` to update defaults (e.g. after a successful save)
+
+## [Managing Form State](#managing-form-state)
+
+- `isDirty` — Has the form changed from its default values?
+- `isError` — Does the form have any validation errors?
+- `dirtyFields` — List of fields that have been modified
+- `touchedFields` — List of fields that have been interacted with
+- `errorFields` — List of fields that currently have errors
+- **Custom form states** — Add any custom state: `actions.setFormState("step", 2)`, `actions.setFormState("lastSaved", new Date())`
+
+## [Managing Field States](#managing-field-states)
+
+- `isDirty`, `isTouched`, `error` for each individual field
+- **Custom field states** — Unlimited: `actions.setFieldState("email", "hidden", true)`, `actions.setFieldState("email", "verificationStatus", "pending")`
+- **Lazy subscription** — [`Controller`](#controller) only subscribes to fieldState when you actually access it in the render function
+
+## [Managing Errors](#managing-errors)
+
+- **Custom errors** — `actions.setError("email", "Email already exists")`
+- **Clear errors** — `actions.clearError("email")` or `actions.clearErrors()` to clear all
+
+## [Watching](#watching-for-updates)
+
+Three ways to observe, all sharing the **same name format**, with support for both `onChange` and `onBlur` modes:
+| Method | Re-render | Best for |
+|:-------|:----------|:---------|
+| `watch(name, mode)` | At the component containing `useForm` | Simple, quick access |
+| `useWatch({ name, mode })` | Only at the component calling the hook | Performance isolation |
+| `subscribe(name, callback, mode)` | **No re-render** | Side effects |
+All three use the same unified dot-notation name format to observe values, errors, form state, and field states. See [The Power of watch (Unified Observation)](#the-power-of-watch-unified-observation) for details.
+
+## [Grouping Fields (Nested Object)](#grouping-fields-nested-object)
+
+- Automatically groups fields into nested structures using dot-notation: `<input name="address.line1" />`
+- `watch`, `setValue`, `setError`, `setFieldState` all work seamlessly with nested paths
+- Supports event **bubble** (propagate to parent watchers)
+
 # Core concepts
 
 ## Input Field Modes
@@ -118,7 +160,7 @@ By using `Controller`, you can transform the value in both directions:
 
 Example:
 
-```
+```jsx
 <Controller
   name="multipleSelect"
   render={({ value = "", onChange, onBlur, name }) => {
@@ -148,11 +190,11 @@ Example `fieldState`:
 - Only when you get `fieldState` from render props, `Controller` will auto subscribe to fieldState changes.
 - If you need to set custom `fieldState`, you can use [`actions.setFieldState`](#useform).
 
-```
+```jsx
 <Controller
   name="multipleSelect"
   render={({ value = "", onChange, onBlur, name, fieldState }) => {
-    if(fieldState.hidden) return null
+    if (fieldState.hidden) return null;
     return (
       <FormControl error={Boolean(fieldState.error)}>
         <Select
@@ -182,9 +224,9 @@ Example `fieldState`:
 
 State updates only when observed via `watch()`, `useWatch()`, `subscribe()`, or by tracking changes through the Form component's `onChange`, `onBlur` callbacks. You can watch Values, Form States, Field States, and Errors through the same name interface.
 
-- [watch(name)](#watch) will trigger a re-render at the form level.
-- [useWatch({ name })](#usewatch) will trigger a re-render only in the component where it is called.
-- [actions.subscribe(name, callback)](#subscribe) is just a handler callback that is called when watched values change.
+- [watch(name, mode)](#watch) will trigger a re-render at the form level.
+- [useWatch({ name, mode })](#usewatch) will trigger a re-render only in the component where it is called.
+- [actions.subscribe(name, callback, mode)](#subscribe) is just a handler callback that is called when watched values change.
 - [onChange](#form) is just a handler callback that is called when field values change.
 - [onBlur](#form) is just a handler callback that is called when field blurred.
 - [actions.subscribe('onChange', callback)](#useform) subscribe onChange callback instead of passing `onChange` in [Form](#form) component.
@@ -206,6 +248,7 @@ The `watch` function (and `useWatch`, `subscribe`) is the "brain" of your form.
 | **Field States**    | `watch("fieldStates")` <br/> `watch("fieldStates.email")` <br/> `watch("fieldStates.email.isDirty")` <br/> `watch("fieldStates.email.isTouched")` <br/> `watch("fieldStates.email.isError")` <br/> `watch("fieldStates.email.customState")` <br/> |
 | **Errors**          | `watch("errors")` <br/> `watch("errors.email")` <br/>                                                                                                                                                                                             |
 | **Multiple values** | `watch(["email", "errors.email", "fieldStates.email", "formState.isDirty"])` <br/>                                                                                                                                                                |
+| **onBlur mode**     | `watch("email", "onBlur")` <br/>                                                                                                                                                                                                                  |
 
 > **💡Why it matters\*:** This unified approach ensures you only need to learn one API to track the entire lifecycle of your form.
 
@@ -213,22 +256,22 @@ The `watch` function (and `useWatch`, `subscribe`) is the "brain" of your form.
 
 ## Get value
 
-```
-const fieldName = watch("fieldName")
-const fieldName2 = watch("fieldName2")
+```jsx
+const fieldName = watch("fieldName");
+const fieldName2 = watch("fieldName2");
 // Or
-const { fieldName2, fieldName } = watch(["fieldName", "fieldName2"])
+const { fieldName2, fieldName } = watch(["fieldName", "fieldName2"]);
 // Or
-const values = watch()
+const values = watch();
 
 // useWatch
-useWatch({ name: "fieldName" })
-useWatch({ name: ["fieldName", "fieldName2"] })
-useWatch({ compute: (values) => values.number > 10 ? true : false })
+useWatch({ name: "fieldName" });
+useWatch({ name: ["fieldName", "fieldName2"] });
+useWatch({ compute: (values) => (values.number > 10 ? true : false) });
 
 // actions.getValues()
-const { actions } = useForm()
-console.log(actions.getValues())
+const { actions } = useForm();
+console.log(actions.getValues());
 ```
 
 > **Note\*:** watch(), useWatch(), and subscribe() share the same name format.
@@ -237,9 +280,9 @@ console.log(actions.getValues())
 
 actions.setValue() can help to control value of a field. But that field must be controlled by Controller.
 
-```
-const { control, actions, watch } = useForm()
-const number = watch("number")
+```jsx
+const { control, actions, watch } = useForm();
+const number = watch("number");
 
 return (
   <Form control={control} onChange={console.log}>
@@ -249,32 +292,32 @@ return (
         <input name={name} value={value} onChange={(e) => onChange(e.target.value)} />
       )}
     />
-    <button type="button" onClick={() => actions.setValue("number", Number(number || 0) + 1 )}>
+    <button type="button" onClick={() => actions.setValue("number", Number(number || 0) + 1)}>
       Increase
     </button>
     <button type="submit" disabled={!isDirty}>
       Submit
     </button>
   </Form>
-)
+);
 ```
 
 ## Default values and reset
 
-```
+```jsx
 const dummyFields = Array.from({ length: 10 }).reduce(
   (acc, _, index) => ({ ...acc, [`input${index + 1}`]: `input${index + 1}` }),
-  {}
+  {},
 );
 
 const { control, watch, actions } = useForm({ defaultValues: dummyFields });
 
 const handleSubmit = async (newValues) => {
   // update to server
-  await new Promise(res => setTimeout(res, 1000))
+  await new Promise((res) => setTimeout(res, 1000));
   // reset with new defaultValues
-  actions.reset(newValues)
-}
+  actions.reset(newValues);
+};
 
 return (
   <Form control={control} onSubmit={handleSubmit} onChange={console.log}>
@@ -295,26 +338,26 @@ return (
 
 ## Set form state
 
-```
-actions.setFormState("custom", { hello: "world" })
-actions.setFormState("custom.hello", "world2")
+```jsx
+actions.setFormState("step", 2);
+actions.setFormState("lastSaved", new Date());
 ```
 
 ## Get form state
 
-```
-const isFormDirty = watch("formState.isDirty")
-const isFormError = watch("formState.isError")
-const dirtyFields = watch("formState.dirtyFields")
-const touchedFields = watch("formState.touchedFields")
-const errorFields = watch("formState.errorFields")
-const customFormState = watch("formState.custom.hello")
+```jsx
+const isFormDirty = watch("formState.isDirty");
+const isFormError = watch("formState.isError");
+const dirtyFields = watch("formState.dirtyFields");
+const touchedFields = watch("formState.touchedFields");
+const errorFields = watch("formState.errorFields");
+const customFormState = watch("formState.custom.hello");
 // actions.getFormState()
-const { actions } = useForm()
-console.log(actions.getFormState())
-console.log(actions.getFormState("isDirty"))
-console.log(actions.getFormState("custom.hello"))
-console.log(actions.getFormState(["isDirty", "isError"]))
+const { actions } = useForm();
+console.log(actions.getFormState());
+console.log(actions.getFormState("isDirty"));
+console.log(actions.getFormState("custom.hello"));
+console.log(actions.getFormState(["isDirty", "isError"]));
 ```
 
 > **Note\*:** watch(), useWatch(), and subscribe() share the same name format.
@@ -323,23 +366,23 @@ console.log(actions.getFormState(["isDirty", "isError"]))
 
 ## Set field states
 
-```
-actions.setFieldState('fieldName', 'custom', { hello: "world" })
-actions.setFieldState('fieldName', 'custom.hello', "world2")
+```jsx
+actions.setFieldState("email", "hidden", true);
+actions.setFieldState("email", "verificationStatus", "pending");
 ```
 
 ## Get field states
 
-```
+```jsx
 const { fieldName: {...}, fieldName2: {...} } = watch("fieldStates")
 const { isDirty, isTouched } = watch("fieldStates.fieldName")
 const isFieldDirty = watch("fieldStates.fieldName.isDirty")
-const fieldCustomState = watch("fieldStates.fieldName.custom.hello")
+const fieldCustomState = watch("fieldStates.fieldName.hidden")
 // actions.getFieldStates()
 const { actions } = useForm()
 console.log(actions.getFieldStates())
 console.log(actions.getFieldStates("fieldStates.fieldName.isDirty"))
-console.log(actions.getFieldStates("fieldStates.fieldName.custom.hello"))
+console.log(actions.getFieldStates("fieldStates.fieldName.hidden"))
 console.log(actions.getFieldStates(["fieldStates.fieldName.isDirty", "fieldStates.fieldName.isError"]))
 ```
 
@@ -349,23 +392,23 @@ console.log(actions.getFieldStates(["fieldStates.fieldName.isDirty", "fieldState
 
 ## Get field error
 
-```
-const isFormError = watch("formState.isError")
-const { fieldName, fieldName2 } = watch("errors")
-const fieldError = watch("errors.fieldName")
+```jsx
+const isFormError = watch("formState.isError");
+const { fieldName, fieldName2 } = watch("errors");
+const fieldError = watch("errors.fieldName");
 // actions.getErrors()
-const { actions } = useForm()
-console.log(actions.getErrors())
+const { actions } = useForm();
+console.log(actions.getErrors());
 ```
 
 > **Note\*:** watch(), useWatch(), and subscribe() share the same name format.
 
 ## Set field error
 
-```
+```jsx
 // actions.setError()
-const { control, actions, watch } = useForm()
-const { isError, "errors.input1": input1Error  } = watch(["isError", "errors.input1"])
+const { control, actions, watch } = useForm();
+const { isError, "errors.input1": input1Error } = watch(["isError", "errors.input1"]);
 
 return (
   <Form control={control} onChange={console.log}>
@@ -378,7 +421,7 @@ return (
       Submit
     </button>
   </Form>
-)
+);
 ```
 
 # Grouping fields (nested object)
@@ -391,7 +434,7 @@ return (
 
 - Auto register when using inputs or controllers with dot notation
 
-```
+```jsx
 // uncontrolled
 <input name="address.line1" />
 <input name="address.line2" />
@@ -407,33 +450,33 @@ return (
 
 - Register manually
 
-```
+```jsx
 // 'groups' option
-const { control, actions } = useForm({ groups: ["address"] })
+const { control, actions } = useForm({ groups: ["address"] });
 // actions.addGroups
-actions.addGroups(["address"])
+actions.addGroups(["address"]);
 ```
 
 > **Rule\***: If a group isn't registered, the field will be treated as a regular field with an object type value.
 
 ## Watching
 
-```
-const addressValue = watch("address")
-const addressLine1 = watch("address.line1")
-const addressLine1Error = watch("errors.address.line1")
-const addressLine1FieldState = watch("fieldStates.address.line1")
+```jsx
+const addressValue = watch("address");
+const addressLine1 = watch("address.line1");
+const addressLine1Error = watch("errors.address.line1");
+const addressLine1FieldState = watch("fieldStates.address.line1");
 ```
 
 ## Updating
 
-```
-const { actions } = useForm()
-actions.setValue("address.line1", "hello")
-actions.setError("address.line1", "error message")
-actions.setFieldState("address.line1", "hidden", true)
-actions.setFieldState("address.line1", "disabled", true)
-actions.setFieldState("address.line1", "custom", { hello: "world" })
+```jsx
+const { actions } = useForm();
+actions.setValue("address.line1", "hello");
+actions.setError("address.line1", "error message");
+actions.setFieldState("address.line1", "hidden", true);
+actions.setFieldState("address.line1", "disabled", true);
+actions.setFieldState("address.line1", "custom", { hello: "world" });
 ```
 
 > **Rule\***: If a `group` is registered, all the fieldState, error, and value will be stored in the bottom level fields (leaf nodes). You cannot set fieldState, error, and value for a `group` (e.g. "address").
@@ -444,11 +487,11 @@ actions.setFieldState("address.line1", "custom", { hello: "world" })
 
 Convert dot notation objects to nested objects
 
-```
+```jsx
 import { restoreFromDotNotation } from "react-simple-formkit";
 
-const dotNotationObject = watch(["errors.email", "errors.password"])
-const nestedObject = restoreFromDotNotation(dotNotationObject)
+const dotNotationObject = watch(["errors.email", "errors.password"]);
+const nestedObject = restoreFromDotNotation(dotNotationObject);
 // Output:
 // {
 //   "errors": {

package/dist/react-simple-formkit.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react");var ae={exports:{}},re={};/**
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react");var ae={exports:{}},ee={};/**
  * @license React
  * react-jsx-runtime.production.js
  *
@@ -6,7 +6,7 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var ge;function Ae(){if(ge)return re;ge=1;var o=Symbol.for("react.transitional.element"),t=Symbol.for("react.fragment");function c(i,a,d){var u=null;if(d!==void 0&&(u=""+d),a.key!==void 0&&(u=""+a.key),"key"in a){d={};for(var m in a)m!=="key"&&(d[m]=a[m])}else d=a;return a=d.ref,{$$typeof:o,type:i,key:u,ref:a!==void 0?a:null,props:d}}return re.Fragment=t,re.jsx=c,re.jsxs=c,re}var te={};/**
+ */var ge;function Ae(){if(ge)return ee;ge=1;var o=Symbol.for("react.transitional.element"),t=Symbol.for("react.fragment");function c(i,a,f){var u=null;if(f!==void 0&&(u=""+f),a.key!==void 0&&(u=""+a.key),"key"in a){f={};for(var h in a)h!=="key"&&(f[h]=a[h])}else f=a;return a=f.ref,{$$typeof:o,type:i,key:u,ref:a!==void 0?a:null,props:f}}return ee.Fragment=t,ee.jsx=c,ee.jsxs=c,ee}var re={};/**
  * @license React
  * react-jsx-runtime.development.js
  *
@@ -14,9 +14,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var Ee;function _e(){return Ee||(Ee=1,process.env.NODE_ENV!=="production"&&function(){function o(r){if(r==null)return null;if(typeof r=="function")return r.$$typeof===se?null:r.displayName||r.name||null;if(typeof r=="string")return r;switch(r){case v:return"Fragment";case j:return"Profiler";case N:return"StrictMode";case x:return"Suspense";case Y:return"SuspenseList";case F:return"Activity"}if(typeof r=="object")switch(typeof r.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),r.$$typeof){case y:return"Portal";case p:return(r.displayName||"Context")+".Provider";case k:return(r._context.displayName||"Context")+".Consumer";case O:var g=r.render;return r=r.displayName,r||(r=g.displayName||g.name||"",r=r!==""?"ForwardRef("+r+")":"ForwardRef"),r;case z:return g=r.displayName||null,g!==null?g:o(r.type)||"Memo";case G:g=r._payload,r=r._init;try{return o(r(g))}catch{}}return null}function t(r){return""+r}function c(r){try{t(r);var g=!1}catch{g=!0}if(g){g=console;var T=g.error,P=typeof Symbol=="function"&&Symbol.toStringTag&&r[Symbol.toStringTag]||r.constructor.name||"Object";return T.call(g,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",P),t(r)}}function i(r){if(r===v)return"<>";if(typeof r=="object"&&r!==null&&r.$$typeof===G)return"<...>";try{var g=o(r);return g?"<"+g+">":"<...>"}catch{return"<...>"}}function a(){var r=K.A;return r===null?null:r.getOwner()}function d(){return Error("react-stack-top-frame")}function u(r){if(ne.call(r,"key")){var g=Object.getOwnPropertyDescriptor(r,"key").get;if(g&&g.isReactWarning)return!1}return r.key!==void 0}function m(r,g){function T(){J||(J=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",g))}T.isReactWarning=!0,Object.defineProperty(r,"key",{get:T,configurable:!0})}function C(){var r=o(this.type);return oe[r]||(oe[r]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),r=this.props.ref,r!==void 0?r:null}function E(r,g,T,P,L,M,X,Q){return T=M.ref,r={$$typeof:A,type:r,key:g,props:M,_owner:L},(T!==void 0?T:null)!==null?Object.defineProperty(r,"ref",{enumerable:!1,get:C}):Object.defineProperty(r,"ref",{enumerable:!1,value:null}),r._store={},Object.defineProperty(r._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(r,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(r,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:X}),Object.defineProperty(r,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:Q}),Object.freeze&&(Object.freeze(r.props),Object.freeze(r)),r}function h(r,g,T,P,L,M,X,Q){var w=g.children;if(w!==void 0)if(P)if(le(w)){for(P=0;P<w.length;P++)l(w[P]);Object.freeze&&Object.freeze(w)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else l(w);if(ne.call(g,"key")){w=o(r);var V=Object.keys(g).filter(function(ie){return ie!=="key"});P=0<V.length?"{key: someKey, "+V.join(": ..., ")+": ...}":"{key: someKey}",ce[w+P]||(V=0<V.length?"{"+V.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+ */var he;function _e(){return he||(he=1,process.env.NODE_ENV!=="production"&&function(){function o(r){if(r==null)return null;if(typeof r=="function")return r.$$typeof===te?null:r.displayName||r.name||null;if(typeof r=="string")return r;switch(r){case v:return"Fragment";case S:return"Profiler";case w:return"StrictMode";case x:return"Suspense";case q:return"SuspenseList";case p:return"Activity"}if(typeof r=="object")switch(typeof r.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),r.$$typeof){case k:return"Portal";case A:return(r.displayName||"Context")+".Provider";case T:return(r._context.displayName||"Context")+".Consumer";case P:var g=r.render;return r=r.displayName,r||(r=g.displayName||g.name||"",r=r!==""?"ForwardRef("+r+")":"ForwardRef"),r;case z:return g=r.displayName||null,g!==null?g:o(r.type)||"Memo";case G:g=r._payload,r=r._init;try{return o(r(g))}catch{}}return null}function t(r){return""+r}function c(r){try{t(r);var g=!1}catch{g=!0}if(g){g=console;var F=g.error,j=typeof Symbol=="function"&&Symbol.toStringTag&&r[Symbol.toStringTag]||r.constructor.name||"Object";return F.call(g,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",j),t(r)}}function i(r){if(r===v)return"<>";if(typeof r=="object"&&r!==null&&r.$$typeof===G)return"<...>";try{var g=o(r);return g?"<"+g+">":"<...>"}catch{return"<...>"}}function a(){var r=Z.A;return r===null?null:r.getOwner()}function f(){return Error("react-stack-top-frame")}function u(r){if(se.call(r,"key")){var g=Object.getOwnPropertyDescriptor(r,"key").get;if(g&&g.isReactWarning)return!1}return r.key!==void 0}function h(r,g){function F(){J||(J=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",g))}F.isReactWarning=!0,Object.defineProperty(r,"key",{get:F,configurable:!0})}function E(){var r=o(this.type);return ne[r]||(ne[r]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),r=this.props.ref,r!==void 0?r:null}function C(r,g,F,j,Y,I,X,K){return F=I.ref,r={$$typeof:_,type:r,key:g,props:I,_owner:Y},(F!==void 0?F:null)!==null?Object.defineProperty(r,"ref",{enumerable:!1,get:E}):Object.defineProperty(r,"ref",{enumerable:!1,value:null}),r._store={},Object.defineProperty(r._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(r,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(r,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:X}),Object.defineProperty(r,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:K}),Object.freeze&&(Object.freeze(r.props),Object.freeze(r)),r}function m(r,g,F,j,Y,I,X,K){var O=g.children;if(O!==void 0)if(j)if(le(O)){for(j=0;j<O.length;j++)l(O[j]);Object.freeze&&Object.freeze(O)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else l(O);if(se.call(g,"key")){O=o(r);var L=Object.keys(g).filter(function(ie){return ie!=="key"});j=0<L.length?"{key: someKey, "+L.join(": ..., ")+": ...}":"{key: someKey}",ue[O+j]||(L=0<L.length?"{"+L.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,P,w,V,w),ce[w+P]=!0)}if(w=null,T!==void 0&&(c(T),w=""+T),u(g)&&(c(g.key),w=""+g.key),"key"in g){T={};for(var ee in g)ee!=="key"&&(T[ee]=g[ee])}else T=g;return w&&m(T,typeof r=="function"?r.displayName||r.name||"Unknown":r),E(r,w,M,L,a(),T,X,Q)}function l(r){typeof r=="object"&&r!==null&&r.$$typeof===A&&r._store&&(r._store.validated=1)}var R=n,A=Symbol.for("react.transitional.element"),y=Symbol.for("react.portal"),v=Symbol.for("react.fragment"),N=Symbol.for("react.strict_mode"),j=Symbol.for("react.profiler"),k=Symbol.for("react.consumer"),p=Symbol.for("react.context"),O=Symbol.for("react.forward_ref"),x=Symbol.for("react.suspense"),Y=Symbol.for("react.suspense_list"),z=Symbol.for("react.memo"),G=Symbol.for("react.lazy"),F=Symbol.for("react.activity"),se=Symbol.for("react.client.reference"),K=R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,ne=Object.prototype.hasOwnProperty,le=Array.isArray,H=console.createTask?console.createTask:function(){return null};R={"react-stack-bottom-frame":function(r){return r()}};var J,oe={},W=R["react-stack-bottom-frame"].bind(R,d)(),ue=H(i(d)),ce={};te.Fragment=v,te.jsx=function(r,g,T,P,L){var M=1e4>K.recentlyCreatedOwnerStacks++;return h(r,g,T,!1,P,L,M?Error("react-stack-top-frame"):W,M?H(i(r)):ue)},te.jsxs=function(r,g,T,P,L){var M=1e4>K.recentlyCreatedOwnerStacks++;return h(r,g,T,!0,P,L,M?Error("react-stack-top-frame"):W,M?H(i(r)):ue)}}()),te}var he;function Oe(){return he||(he=1,process.env.NODE_ENV==="production"?ae.exports=Ae():ae.exports=_e()),ae.exports}var me=Oe();const S=()=>{},ve=n.createContext({ref:null,watch:S,actions:{subscribe:S,reset:S,trigger:S,reload:S,resetField:S,setValue:S,getValues:S,getErrors:S,getFieldStates:S,getFormState:S,setError:S,clearError:S,clearErrors:S,checkValidity:S,getFieldValidity:S,getDefaultValues:S,setFieldState:S,triggerFieldBlur:S,resetFieldState:S,getControlledFields:S,setFormState:S,getEvents:S,getWatchEvents:S,addGroups:S},registerController:S,registerHookWatcher:S,lastReloadedAt:S,loadFormValues:S,getWatchValue:S,channels:{}}),de=()=>n.useContext(ve),je=({id:o,control:t,method:c,action:i,children:a,onChange:d,onBlur:u,onSubmit:m=()=>{},onInput:C=()=>{},onReset:E=()=>{},numberFields:h=[],className:l,...R})=>{const A=n.useCallback(y=>{t.ref&&(t.ref.current=y,t.ref.current&&t.initForm())},[t]);return n.useEffect(()=>{let y=()=>{},v=()=>{};return d&&(y=t.channels.subscribe("onChange",d)),u&&(v=t.channels.subscribe("onBlur",u)),()=>{y(),v()}},[t.lastReloadedAt]),me.jsx(ve.Provider,{value:t,children:me.jsx("form",{id:o,ref:A,action:i,method:c,className:l,onInput:C,onSubmit:y=>{c||y.preventDefault();const v=t.loadFormValues();m(v)},onChange:y=>{const v=y.target.name;!v||t.actions.getControlledFields().has(v)||t.actions.setValue(v,y.target.value)},onBlur:y=>{const v=y.target.name;if(!v||t.actions.getControlledFields().has(v))return;const N=y.target.value;t.channels.publish("onBlur",v,N,t.actions.getValues()),t.triggerBlurWatchers(v)},onReset:y=>{t.actions.reset(),E(y)},...R,children:a},t.lastReloadedAt)})},fe={isDirty:!1,isTouched:!1,error:null},Re={lastReset:null,isDirty:!1,isError:!1,errorFields:[],dirtyFields:[],touchedFields:[]},we={},Pe=["badInput","customError","patternMismatch","rangeOverflow","rangeUnderflow","stepMismatch","tooLong","tooShort","typeMismatch","valueMissing"],D=(o={},t="")=>t.split(".").reduce((c,i)=>c&&c[i]!==void 0?c[i]:void 0,o),I=(o={},t="",c)=>{const i=Array.isArray(o)?[...o]:{...o};let a=i;const d=t.split(".");return d.forEach((u,m)=>{m<d.length-1?(a[u]||(a[u]=/^\d+$/.test(d[m+1])?[]:{}),Array.isArray(a[u])?a[u]=[...a[u]]:a[u]={...a[u]},a=a[u]):a[u]=c}),i},Se=o=>{let t=Array.isArray(o)?[...o]:{...o};return Object.keys(t).forEach(c=>{if(c.includes(".")){const i=D(t,c);t=I(t,c,i||""),delete t[c]}}),t},$e=["errors","fieldStates","formState"],q=o=>$e.some(t=>o.startsWith(t))?o:"values."+o,Ce=o=>{typeof o.setCustomValidity=="function"&&o.setCustomValidity("");let t=o.validity,c=Pe.find(i=>t[i]);if(c)return{type:c,message:o.validationMessage}},ye=(o=new Set,t={},c="")=>Object.keys(t||{}).reduce((i,a)=>{const d=(t||{})[a];return o.has(c+a)?[...i,...ye(o,d,c+a+".")]:d!=null&&d.isDirty?[...i,c+a]:i},[]),ke=(o=new Set,t={},c="")=>Object.keys(t||{}).reduce((i,a)=>{const d=(t||{})[a];return o.has(c+a)?[...i,...ke(o,d,c+a+".")]:d!=null&&d.isTouched?[...i,c+a]:i},[]),pe=(o=new Set,t={},c="")=>Object.keys(t||{}).reduce((i,a)=>{const d=(t||{})[a];return o.has(c+a)?[...i,...pe(o,d,c+a+".")]:d?[...i,c+a]:i},[]),Fe=({control:o,name:t,defaultValue:c,shouldUnRegister:i})=>{const{actions:a,registerController:d,channels:u,getWatchValue:m,triggerBlurWatchers:C}=o||de(),E=n.useRef(),h=n.useRef(),l=D(a.getDefaultValues(),t)||c||"",[R,A]=n.useState(l),[y,v]=n.useState({}),N=n.useCallback((k,{shouldDirty:p=!0,shouldOnChange:O=!0}={})=>{var Y;let x=k;((Y=k==null?void 0:k.target)==null?void 0:Y.value)!==void 0&&(x=k.target.value),A(x),a.setValue(t,x,{shouldDirty:p,shouldOnChange:O})},[a.setValue]),j=n.useCallback(k=>{const p=a.getValues(),O=k??D(p,t);u.publish("onBlur",t,O,p),C(t)},[]);return n.useEffect(()=>{const k=d(t,A,{shouldUnRegister:i});return()=>{k(),h.current&&h.current()}},[i]),new Proxy({ref:E,name:t,defaultValue:l,value:R,onChange:N,onBlur:j,fieldState:y},{get(k,p,O){return typeof p=="string"&&p==="fieldState"&&(h.current&&h.current(),h.current=a.subscribe(`fieldStates.${t}`,()=>{v(m({name:`fieldStates.${t}`}))})),Reflect.get(k,p,O)}})},Ne=({name:o,control:t,shouldUnRegister:c,defaultValue:i,render:a=({ref:d,name:u,defaultValue:m,value:C,onChange:E,onBlur:h,fieldState:l})=>null})=>{const d=Fe({name:o,defaultValue:i,shouldUnRegister:c,control:t});return a(d)},De=()=>{const[o,t]=n.useState(),c=n.useCallback(()=>t(new Date().toString()),[]);return[o,c]},xe=()=>{const[,o]=n.useState({});return n.useCallback(()=>o({}),[])},We=({channels:o,getWatchValue:t})=>{const c=xe(),i=n.useCallback((u,m="onChange")=>{if(!u)return o.subscribeWatch("values",()=>c()),t();if(typeof u=="string"){let C=q(u);m==="onBlur"&&(C=`blur.${C}`),o.subscribeWatch(C,(E,h)=>{E!==h&&c()})}return Array.isArray(u)&&u.forEach(C=>{let E=q(C);m==="onBlur"&&(E=`blur.${E}`),o.subscribeWatch(E,(h,l)=>{h!==l&&c()})}),t({name:u})},[]),a=n.useCallback(({name:u,compute:m,setValue:C,mode:E="onChange"})=>{if(typeof m=="function")return o.subscribe("values",()=>{const l=t({compute:m});C(l)});if(!u)return o.subscribe("values",()=>{C(t())});if(typeof u=="string"){let h=q(u);return E==="onBlur"&&(h=`blur.${h}`),o.subscribe(h,()=>{const R=t({name:u});C(R)})}if(Array.isArray(u)){const h=[];return u.forEach(l=>{let R=q(l);E==="onBlur"&&(R=`blur.${R}`);const A=o.subscribe(R,()=>{const y=t({name:u});C(y)});h.push(A)}),()=>h.forEach(l=>l())}throw new Error("Parameters of name must be string or array of string or compute must be a function")},[]),d=n.useCallback((u,m,C="onChange")=>{if(!u)return o.subscribe("values",()=>m(t()));if(["onChange","onBlur"].includes(u))return o.subscribe(u,m);if(typeof u=="string"){let E=q(u);return C==="onBlur"&&(E=`blur.${E}`),o.subscribe(E,()=>m(t({name:u})))}if(Array.isArray(u)){const E=[];return u.forEach(h=>{let l=q(h);C==="onBlur"&&(l=`blur.${l}`);const R=o.subscribe(l,()=>{m(t({name:u}))});E.push(R)}),()=>E.forEach(h=>h())}throw new Error("Parameters of name must be string or array of string")},[]);return{watch:i,registerHookWatcher:a,getWatchValue:t,subscribe:d}},Me=({getWatchValue:o})=>{const t=n.useRef(new Map),c=n.useRef(new Map),i=n.useCallback(()=>c.current,[]),a=n.useCallback(()=>t.current,[]),d=n.useCallback(()=>{t.current.clear(),c.current.clear()},[]),u=l=>l.replace("values.","").replace("values",""),m=n.useCallback((l,...R)=>{const A=l.split(".");A.forEach((y,v)=>{const N=A.slice(0,A.length-v).join("."),j=t.current.get(N),k=c.current.get(N);if(v>0){const p=R[0],O=o({name:u(N)});R=[I(O,l.replace(N,""),p)]}j&&j.forEach(p=>p(...R)),k&&k.forEach(p=>p(...R))})},[]),C=n.useCallback((l,{trickle:R=!1,bubble:A=!1})=>{const y=l.split(".");let v=[o({name:u(l)})];y.forEach((N,j)=>{const k=y.slice(0,y.length-j).join("."),p=t.current.get(k),O=c.current.get(k);if(j>0&&A){const x=v[0],Y=o({name:u(k)});v=[I(Y,l.replace(k,""),x)]}p&&(j===0||A)&&p.forEach(x=>x(...v)),O&&(j===0||A)&&O.forEach(x=>x(...v))}),R&&(t.current.forEach((N,j)=>{j.startsWith(l)&&N.forEach(k=>k(o({name:u(j)})))}),c.current.forEach((N,j)=>{j.startsWith(l)&&N.forEach(k=>k(o({name:u(j)})))}))},[]),E=n.useCallback((l,R)=>(t.current.has(l)||t.current.set(l,new Set),t.current.get(l).add(R),()=>{var A;return(A=t.current.get(l))==null?void 0:A.delete(R)}),[]),h=n.useCallback((l,R)=>{c.current.has(l)||(c.current.set(l,new Set),c.current.get(l).add(R))},[]);return{reset:d,publish:m,subscribe:E,subscribeWatch:h,getEvents:a,getWatchEvents:i,trigger:C}},Be=({defaultValues:o=we,shouldUnRegister:t=!1,groups:c=[]}={})=>{const[i,a]=De(),d=n.useRef(),u=n.useRef(new Map),m=n.useRef({}),C=n.useRef({}),E=n.useRef({...Re}),h=n.useRef({...o}),l=n.useRef({...o}),R=n.useRef(new Set(c)),A=n.useCallback((e,s=l.current)=>Object.keys(s).reduce((b,f)=>{if(typeof s[f]=="object")return{...b,[f]:A(e,s[f])};const $={...e?{}:C.current[f]||{},...fe};return{...b,[f]:$}},{}),[]),y=n.useCallback((e={},{clearCustomFormStates:s=!1,clearCustomFieldStates:b=!1,groups:f=R.current}={})=>{l.current={...l.current,...e},h.current={...l.current},u.current.forEach(($,_)=>{$(D(l.current,_)??"")}),m.current={},R.current=new Set(f),u.current=new Map,E.current={...s?{}:E.current,...Re},C.current=A(b),F.reset(),a()},[]),v=n.useCallback(()=>{let e=Object.fromEntries(new FormData(d.current));u.current.forEach((b,f)=>{e=I(e,f,D(h.current,f))});let s={...h.current,...e};return Se(s)},[]),N=n.useCallback(e=>Ce(e.target),[]),j=n.useCallback(()=>l.current,[]),k=n.useCallback(()=>u.current,[]),p=n.useCallback((e,s)=>s?Array.isArray(s)?s.reduce((b,f)=>({...b,[f]:D(e,f)}),{}):D(e,s):{...e},[]),O=n.useCallback(e=>p(h.current,e),[p]),x=n.useCallback(e=>p(m.current,e),[p]),Y=n.useCallback(e=>p(C.current,e),[p]),z=n.useCallback(e=>p({...E.current,lastReset:i},e),[i]),G=n.useCallback(({name:e,compute:s}={})=>!e&&!s||e==="values"?O():typeof s=="function"?s(O()):Array.isArray(e)?e.reduce((b,f)=>({...b,[f]:G({name:f})}),{}):D({...h.current,errors:m.current,fieldStates:C.current,formState:z()},e),[]),F=Me({getWatchValue:G}),{watch:se,registerHookWatcher:K,subscribe:ne}=We({getWatchValue:G,channels:F}),le=n.useCallback((e,s)=>{typeof s=="function"&&(s=s(z(e)));const b=E.current,f=D(b,e);f!==s&&(E.current=I(E.current,e,s),F.publish(`formState.${e}`,s,f))},[]),H=n.useCallback((e,s)=>{typeof s=="function"&&(s=s(x(e))),W(e,"error",s)},[]),J=n.useCallback(e=>{W(e,"error",null)},[]),oe=n.useCallback(()=>{E.current.isError&&Object.keys(m.current).forEach(e=>J(e))},[]),W=n.useCallback((e,s,b)=>{try{if(typeof b=="function"&&(b=b(Y(e))),R.current.has(e))if(typeof b=="object"&&b!==null){Object.keys(b).forEach(_=>{W(`${e}.${_}`,s,b[_])});return}else return console.error(`Cannot set primitive value for nested parent field "${e}". Please set value for its children or provide an object.`);const f=D(C.current,e)||{...fe},$=D(f,s);if($!==b){if(C.current=I(C.current,`${e}.${s}`,b),F.publish(`fieldStates.${e}.${s}`,b,$),s==="error"){const _=D(m.current,e),U=b||null;_!==U&&(m.current=I(m.current,e,U),F.publish(`errors.${e}`,U,_));const B=pe(R.current,m.current);E.current.errorFields=B,F.publish("formState.errorFields",B);const Z=B.length>0;if(E.current.isError!==Z){const be=E.current.isError;E.current.isError=Z,F.publish("formState.isError",Z,be)}}if(s==="isDirty"){const _=ye(R.current,C.current);E.current.dirtyFields=_,F.publish("formState.dirtyFields",_);const U=_.length>0;if(E.current.isDirty!==U){const B=E.current.isDirty;E.current.isDirty=U,F.publish("formState.isDirty",U,B)}}if(s==="isTouched"){const _=ke(R.current,C.current);E.current.touchedFields=_,F.publish("formState.touchedFields",_)}}}catch(f){console.log(f)}},[]),ue=n.useCallback(e=>{W(e,"isDirty",!1),W(e,"isTouched",!1),W(e,"error",!1)},[]),ce=n.useCallback(e=>{const s=Ce(e.target);s?H(e.target.name,s):J(e.target.name)},[]),r=n.useCallback((e,s,{shouldDirty:b=!0,shouldOnChange:f=!0}={})=>{if(typeof s=="function"&&(s=s(O(e))),R.current.has(e)){typeof s=="object"&&s!==null?Object.keys(s).forEach(B=>{r(`${e}.${B}`,s[B],{shouldDirty:b,shouldOnChange:f})}):console.error(`Cannot set primitive value for nested parent field "${e}". Please set value for its children or provide an object.`);return}const $=D(h.current,e);if(s===$)return;h.current=I(h.current,e,s),F.publish(`values.${e}`,s,$);const _=u.current.get(e);if(_&&_(s),e.includes(".")){const B=e.split("."),Z=B.findIndex((be,Te)=>!R.current.has(B.slice(0,Te+1).join(".")));Z!==-1&&(e=B.slice(0,Z+1).join("."))}s&&W(e,"isTouched",!0);const U=s!==(D(l.current,e)||"");b&&W(e,"isDirty",U),f&&F.publish("onChange",e,s,$)},[]),g=n.useCallback(e=>{const s=e.split(".");let b="";s.forEach((f,$)=>{$<s.length-1&&(b=b?`${b}.${f}`:f,R.current.add(b))})},[]),T=n.useCallback(e=>{Array.isArray(e)?e.forEach(s=>g(s+".")):g(e+".")},[]),P=n.useCallback((e="",s,{shouldUnRegister:b=t}={})=>{if(!e){console.error("Controller must have a name");return}return u.current.set(e,s),C.current=I(C.current,e,{...fe}),e.includes(".")&&g(e),()=>{b&&u.current.delete(e)}},[]),L=n.useCallback((e,{keepError:s,keepDirty:b,keepTouched:f,defaultValue:$})=>{const _=u.current.get(e);if(!_)throw new Error(`Cannot reset "${e}" because it's uncontrolled field`);l.current=I(l.current,e,$),h.current=I(h.current,e,$),_&&_($),s||J(e),b||W(e,"isDirty",!1),f||W(e,"isTouched",!1)},[]),M=n.useCallback((e,{bubble:s,trickle:b}={})=>{if(!e)return F.trigger("values",{bubble:s,trickle:b??!0});if(!Array.isArray(e)){const f=q(e);F.trigger(f,{bubble:s,trickle:b});return}e.forEach(f=>{const $=q(f);F.trigger($,{bubble:s,trickle:b})})},[]),X=n.useCallback(e=>{F.publish(`blur.values.${e}`,O(e)),F.publish(`blur.errors.${e}`,x(e));const s=Y(e);Object.keys(s||{}).forEach(f=>{F.publish(`blur.fieldStates.${e}.${f}`,s[f])});const b=z();Object.keys(b||{}).forEach(f=>{F.publish(`blur.formState.${f}`,b[f])})},[]),Q=n.useCallback((e,s=O(e))=>{F.publish("onBlur",e,s,O()),X(e)},[]),w=n.useMemo(()=>({subscribe:ne,reset:y,trigger:M,reload:a,resetField:L,setValue:r,getValues:O,getErrors:x,getFieldStates:Y,getFormState:z,setError:H,clearError:J,clearErrors:oe,checkValidity:ce,getFieldValidity:N,getDefaultValues:j,setFieldState:W,triggerFieldBlur:Q,resetFieldState:ue,getControlledFields:k,setFormState:le,getEvents:F.getEvents,getWatchEvents:F.getWatchEvents,addGroups:T}),[i]),V=n.useCallback(()=>{[...d.current.querySelectorAll("[name]")].forEach(b=>{const f=b.name||"";f.includes(".")&&g(f),!b.defaultValue&&!u.current.has(f)&&D(l.current,f)&&(b.defaultValue=D(l.current,f))});const s=v();h.current={...s},l.current={...s}},[]),ee=n.useMemo(()=>({ref:d,watch:se,actions:w,initForm:V,registerController:P,registerHookWatcher:K,lastReloadedAt:i,loadFormValues:v,getWatchValue:G,triggerBlurWatchers:X,channels:F}),[i]),ie=n.useMemo(()=>({control:ee,actions:w,watch:se}),[i]);return n.useLayoutEffect(()=>{d.current&&V()},[i]),n.useLayoutEffect(()=>{C.current=A(!1)},[]),ie},Ie=({control:o,name:t,compute:c,mode:i})=>{const{getWatchValue:a,registerHookWatcher:d}=o||de(),u=a({name:t,compute:c}),[m,C]=n.useState(u);return n.useEffect(()=>d({name:t,compute:c,value:m,setValue:C,mode:i}),[]),m};exports.Controller=Ne;exports.Form=je;exports.restoreFromDotNotation=Se;exports.useController=Fe;exports.useForm=Be;exports.useFormContext=de;exports.useWatch=Ie;
+  <%s key={someKey} {...props} />`,j,O,L,O),ue[O+j]=!0)}if(O=null,F!==void 0&&(c(F),O=""+F),u(g)&&(c(g.key),O=""+g.key),"key"in g){F={};for(var Q in g)Q!=="key"&&(F[Q]=g[Q])}else F=g;return O&&h(F,typeof r=="function"?r.displayName||r.name||"Unknown":r),C(r,O,I,Y,a(),F,X,K)}function l(r){typeof r=="object"&&r!==null&&r.$$typeof===_&&r._store&&(r._store.validated=1)}var R=n,_=Symbol.for("react.transitional.element"),k=Symbol.for("react.portal"),v=Symbol.for("react.fragment"),w=Symbol.for("react.strict_mode"),S=Symbol.for("react.profiler"),T=Symbol.for("react.consumer"),A=Symbol.for("react.context"),P=Symbol.for("react.forward_ref"),x=Symbol.for("react.suspense"),q=Symbol.for("react.suspense_list"),z=Symbol.for("react.memo"),G=Symbol.for("react.lazy"),p=Symbol.for("react.activity"),te=Symbol.for("react.client.reference"),Z=R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,se=Object.prototype.hasOwnProperty,le=Array.isArray,H=console.createTask?console.createTask:function(){return null};R={"react-stack-bottom-frame":function(r){return r()}};var J,ne={},W=R["react-stack-bottom-frame"].bind(R,f)(),oe=H(i(f)),ue={};re.Fragment=v,re.jsx=function(r,g,F,j,Y){var I=1e4>Z.recentlyCreatedOwnerStacks++;return m(r,g,F,!1,j,Y,I?Error("react-stack-top-frame"):W,I?H(i(r)):oe)},re.jsxs=function(r,g,F,j,Y){var I=1e4>Z.recentlyCreatedOwnerStacks++;return m(r,g,F,!0,j,Y,I?Error("react-stack-top-frame"):W,I?H(i(r)):oe)}}()),re}var Ee;function Oe(){return Ee||(Ee=1,process.env.NODE_ENV==="production"?ae.exports=Ae():ae.exports=_e()),ae.exports}var me=Oe();const y=()=>{},ve=n.createContext({ref:null,watch:y,actions:{subscribe:y,reset:y,trigger:y,reload:y,resetField:y,setValue:y,getValues:y,getErrors:y,getFieldStates:y,getFormState:y,setError:y,clearError:y,clearErrors:y,checkValidity:y,getFieldValidity:y,getDefaultValues:y,setFieldState:y,triggerFieldBlur:y,resetFieldState:y,getControlledFields:y,setFormState:y,getEvents:y,getWatchEvents:y,addGroups:y},registerController:y,registerHookWatcher:y,lastReloadedAt:y,loadFormValues:y,getWatchValue:y,channels:{}}),be=()=>n.useContext(ve),je=({id:o,control:t,method:c,action:i,children:a,onChange:f,onBlur:u,onSubmit:h=()=>{},onInput:E=()=>{},onReset:C=()=>{},numberFields:m=[],className:l,...R})=>{const _=n.useCallback(k=>{t.ref&&(t.ref.current=k,t.ref.current&&t.initForm())},[t]);return n.useEffect(()=>{let k=()=>{},v=()=>{};return f&&(k=t.channels.subscribe("onChange",f)),u&&(v=t.channels.subscribe("onBlur",u)),()=>{k(),v()}},[t.lastReloadedAt]),me.jsx(ve.Provider,{value:t,children:me.jsx("form",{id:o,ref:_,action:i,method:c,className:l,onInput:E,onSubmit:k=>{c||k.preventDefault();const v=t.loadFormValues();h(v)},onChange:k=>{const v=k.target.name;!v||t.actions.getControlledFields().has(v)||t.actions.setValue(v,k.target.value)},onBlur:k=>{const v=k.target.name;if(!v||t.actions.getControlledFields().has(v))return;const w=k.target.value;t.channels.publish("onBlur",v,w,t.actions.getValues()),t.triggerBlurWatchers(v)},onReset:k=>{t.actions.reset(),C(k)},...R,children:a},t.lastReloadedAt)})},de={isDirty:!1,isTouched:!1,error:null},Re={lastReset:null,isDirty:!1,isError:!1,errorFields:[],dirtyFields:[],touchedFields:[]},we={},Pe=["badInput","customError","patternMismatch","rangeOverflow","rangeUnderflow","stepMismatch","tooLong","tooShort","typeMismatch","valueMissing"],D=(o={},t="")=>t.split(".").reduce((c,i)=>c&&c[i]!==void 0?c[i]:void 0,o),M=(o={},t="",c)=>{const i=Array.isArray(o)?[...o]:{...o};let a=i;const f=t.split(".");return f.forEach((u,h)=>{h<f.length-1?(a[u]||(a[u]=/^\d+$/.test(f[h+1])?[]:{}),Array.isArray(a[u])?a[u]=[...a[u]]:a[u]={...a[u]},a=a[u]):a[u]=c}),i},Se=o=>{let t=Array.isArray(o)?[...o]:{...o};return Object.keys(t).forEach(c=>{if(c.includes(".")){const i=D(t,c);t=M(t,c,i||""),delete t[c]}}),t},$e=["errors","fieldStates","formState"],U=o=>$e.some(t=>o.startsWith(t))?o:"values."+o,Ce=o=>{typeof o.setCustomValidity=="function"&&o.setCustomValidity("");let t=o.validity,c=Pe.find(i=>t[i]);if(c)return{type:c,message:o.validationMessage}},ye=(o=new Set,t={},c="")=>Object.keys(t||{}).reduce((i,a)=>{const f=(t||{})[a];return o.has(c+a)?[...i,...ye(o,f,c+a+".")]:f!=null&&f.isDirty?[...i,c+a]:i},[]),ke=(o=new Set,t={},c="")=>Object.keys(t||{}).reduce((i,a)=>{const f=(t||{})[a];return o.has(c+a)?[...i,...ke(o,f,c+a+".")]:f!=null&&f.isTouched?[...i,c+a]:i},[]),pe=(o=new Set,t={},c="")=>Object.keys(t||{}).reduce((i,a)=>{const f=(t||{})[a];return o.has(c+a)?[...i,...pe(o,f,c+a+".")]:f?[...i,c+a]:i},[]),Fe=({control:o,name:t,compute:c,mode:i})=>{const{getWatchValue:a,registerHookWatcher:f}=o||be(),u=a({name:t,compute:c}),[h,E]=n.useState(u);return n.useEffect(()=>f({name:t,compute:c,value:h,setValue:E,mode:i}),[]),h},Te=({control:o,name:t,defaultValue:c,shouldUnRegister:i})=>{const{actions:a,registerController:f,channels:u,getWatchValue:h,triggerBlurWatchers:E}=o||be(),C=n.useRef(),m=n.useRef(),l=D(a.getDefaultValues(),t)||c||"",R=Fe({name:t})??l,[_,k]=n.useState({}),v=n.useCallback((S,{shouldDirty:T=!0,shouldOnChange:A=!0}={})=>{var x;let P=S;((x=S==null?void 0:S.target)==null?void 0:x.value)!==void 0&&(P=S.target.value),a.setValue(t,P,{shouldDirty:T,shouldOnChange:A})},[a.setValue]),w=n.useCallback(S=>{const T=a.getValues(),A=S??D(T,t);u.publish("onBlur",t,A,T),E(t)},[]);return n.useEffect(()=>{const S=f(t,{shouldUnRegister:i});return()=>{S&&S(),m.current&&m.current()}},[i,t]),new Proxy({ref:C,name:t,defaultValue:l,value:R,onChange:v,onBlur:w,fieldState:_},{get(S,T,A){return typeof T=="string"&&T==="fieldState"&&(m.current&&m.current(),m.current=a.subscribe(`fieldStates.${t}`,()=>{k(h({name:`fieldStates.${t}`}))})),Reflect.get(S,T,A)}})},Ne=({name:o,control:t,shouldUnRegister:c,defaultValue:i,render:a=({ref:f,name:u,defaultValue:h,value:E,onChange:C,onBlur:m,fieldState:l})=>null})=>{const f=Te({name:o,defaultValue:i,shouldUnRegister:c,control:t});return a(f)},De=()=>{const[o,t]=n.useState(),c=n.useCallback(()=>t(new Date().toString()),[]);return[o,c]},xe=()=>{const[,o]=n.useState({});return n.useCallback(()=>o({}),[])},We=({channels:o,getWatchValue:t})=>{const c=xe(),i=n.useCallback((u,h="onChange")=>{if(!u)return o.subscribeWatch("values",()=>c()),t();if(typeof u=="string"){let E=U(u);h==="onBlur"&&(E=`blur.${E}`),o.subscribeWatch(E,(C,m)=>{C!==m&&c()})}return Array.isArray(u)&&u.forEach(E=>{let C=U(E);h==="onBlur"&&(C=`blur.${C}`),o.subscribeWatch(C,(m,l)=>{m!==l&&c()})}),t({name:u})},[]),a=n.useCallback(({name:u,compute:h,setValue:E,mode:C="onChange"})=>{if(typeof h=="function")return o.subscribe("values",()=>{const l=t({compute:h});E(l)});if(!u)return o.subscribe("values",()=>{E(t())});if(typeof u=="string"){let m=U(u);return C==="onBlur"&&(m=`blur.${m}`),o.subscribe(m,()=>{const R=t({name:u});E(R)})}if(Array.isArray(u)){const m=[];return u.forEach(l=>{let R=U(l);C==="onBlur"&&(R=`blur.${R}`);const _=o.subscribe(R,()=>{const k=t({name:u});E(k)});m.push(_)}),()=>m.forEach(l=>l())}throw new Error("Parameters of name must be string or array of string or compute must be a function")},[]),f=n.useCallback((u,h,E="onChange")=>{if(!u)return o.subscribe("values",()=>h(t()));if(["onChange","onBlur"].includes(u))return o.subscribe(u,h);if(typeof u=="string"){let C=U(u);return E==="onBlur"&&(C=`blur.${C}`),o.subscribe(C,()=>h(t({name:u})))}if(Array.isArray(u)){const C=[];return u.forEach(m=>{let l=U(m);E==="onBlur"&&(l=`blur.${l}`);const R=o.subscribe(l,()=>{h(t({name:u}))});C.push(R)}),()=>C.forEach(m=>m())}throw new Error("Parameters of name must be string or array of string")},[]);return{watch:i,registerHookWatcher:a,getWatchValue:t,subscribe:f}},Be=({getWatchValue:o})=>{const t=n.useRef(new Map),c=n.useRef(new Map),i=n.useCallback(()=>c.current,[]),a=n.useCallback(()=>t.current,[]),f=n.useCallback(()=>{t.current.clear(),c.current.clear()},[]),u=l=>l.replace("values.","").replace("values",""),h=n.useCallback((l,...R)=>{const _=l.split(".");_.forEach((k,v)=>{const w=_.slice(0,_.length-v).join("."),S=t.current.get(w),T=c.current.get(w);if(v>0){const A=R[0],P=o({name:u(w)});R=[M(P,l.replace(w,""),A)]}S&&S.forEach(A=>A(...R)),T&&T.forEach(A=>A(...R))})},[]),E=n.useCallback((l,{trickle:R=!1,bubble:_=!1})=>{const k=l.split(".");let v=[o({name:u(l)})];k.forEach((w,S)=>{const T=k.slice(0,k.length-S).join("."),A=t.current.get(T),P=c.current.get(T);if(S>0&&_){const x=v[0],q=o({name:u(T)});v=[M(q,l.replace(T,""),x)]}A&&(S===0||_)&&A.forEach(x=>x(...v)),P&&(S===0||_)&&P.forEach(x=>x(...v))}),R&&(t.current.forEach((w,S)=>{S.startsWith(l)&&w.forEach(T=>T(o({name:u(S)})))}),c.current.forEach((w,S)=>{S.startsWith(l)&&w.forEach(T=>T(o({name:u(S)})))}))},[]),C=n.useCallback((l,R)=>(t.current.has(l)||t.current.set(l,new Set),t.current.get(l).add(R),()=>{var _;return(_=t.current.get(l))==null?void 0:_.delete(R)}),[]),m=n.useCallback((l,R)=>{c.current.has(l)||(c.current.set(l,new Set),c.current.get(l).add(R))},[]);return{reset:f,publish:h,subscribe:C,subscribeWatch:m,getEvents:a,getWatchEvents:i,trigger:E}},Ie=({defaultValues:o=we,shouldUnRegister:t=!1,groups:c=[]}={})=>{const[i,a]=De(),f=n.useRef(),u=n.useRef({}),h=n.useRef({}),E=n.useRef({...Re}),C=n.useRef({...o}),m=n.useRef({...o}),l=n.useRef(new Set),R=n.useRef(new Set(c)),_=n.useCallback((e,s=m.current)=>Object.keys(s).reduce((d,b)=>{if(typeof s[b]=="object")return{...d,[b]:_(e,s[b])};const $={...e?{}:h.current[b]||{},...de};return{...d,[b]:$}},{}),[]),k=n.useCallback((e={},{clearCustomFormStates:s=!1,clearCustomFieldStates:d=!1,groups:b=R.current}={})=>{u.current={},m.current={...m.current,...e},C.current={...m.current},l.current=new Set,R.current=new Set(b),E.current={...s?{}:E.current,...Re},h.current=_(d),p.reset(),a()},[]),v=n.useCallback(()=>{let e=Object.fromEntries(new FormData(f.current));l.current.forEach(d=>{e=M(e,d,D(C.current,d))});let s={...C.current,...e};return Se(s)},[]),w=n.useCallback(e=>Ce(e.target),[]),S=n.useCallback(()=>m.current,[]),T=n.useCallback(()=>l.current,[]),A=n.useCallback((e,s)=>s?Array.isArray(s)?s.reduce((d,b)=>({...d,[b]:D(e,b)}),{}):D(e,s):{...e},[]),P=n.useCallback(e=>A(C.current,e),[A]),x=n.useCallback(e=>A(u.current,e),[A]),q=n.useCallback(e=>A(h.current,e),[A]),z=n.useCallback(e=>A({...E.current,lastReset:i},e),[i]),G=n.useCallback(({name:e,compute:s}={})=>!e&&!s||e==="values"?P():typeof s=="function"?s(P()):Array.isArray(e)?e.reduce((d,b)=>({...d,[b]:G({name:b})}),{}):D({...C.current,errors:u.current,fieldStates:h.current,formState:z()},e),[]),p=Be({getWatchValue:G}),{watch:te,registerHookWatcher:Z,subscribe:se}=We({getWatchValue:G,channels:p}),le=n.useCallback((e,s)=>{typeof s=="function"&&(s=s(z(e)));const d=E.current,b=D(d,e);b!==s&&(E.current=M(E.current,e,s),p.publish(`formState.${e}`,s,b))},[]),H=n.useCallback((e,s)=>{typeof s=="function"&&(s=s(x(e))),W(e,"error",s)},[]),J=n.useCallback(e=>{W(e,"error",null)},[]),ne=n.useCallback(()=>{E.current.isError&&Object.keys(u.current).forEach(e=>J(e))},[]),W=n.useCallback((e,s,d)=>{try{if(typeof d=="function"&&(d=d(q(e))),R.current.has(e))if(typeof d=="object"&&d!==null){Object.keys(d).forEach(N=>{W(`${e}.${N}`,s,d[N])});return}else return console.error(`Cannot set primitive value for nested parent field "${e}". Please set value for its children or provide an object.`);const b=D(h.current,e)||{...de},$=D(b,s);if($!==d){if(h.current=M(h.current,`${e}.${s}`,d),p.publish(`fieldStates.${e}.${s}`,d,$),s==="error"){const N=D(u.current,e),B=d||null;N!==B&&(u.current=M(u.current,e,B),p.publish(`errors.${e}`,B,N));const V=pe(R.current,u.current);E.current.errorFields=V,p.publish("formState.errorFields",V);const ce=V.length>0;if(E.current.isError!==ce){const fe=E.current.isError;E.current.isError=ce,p.publish("formState.isError",ce,fe)}}if(s==="isDirty"){const N=ye(R.current,h.current);E.current.dirtyFields=N,p.publish("formState.dirtyFields",N);const B=N.length>0;if(E.current.isDirty!==B){const V=E.current.isDirty;E.current.isDirty=B,p.publish("formState.isDirty",B,V)}}if(s==="isTouched"){const N=ke(R.current,h.current);E.current.touchedFields=N,p.publish("formState.touchedFields",N)}}}catch(b){console.log(b)}},[]),oe=n.useCallback(e=>{W(e,"isDirty",!1),W(e,"isTouched",!1),W(e,"error",!1)},[]),ue=n.useCallback(e=>{const s=Ce(e.target);s?H(e.target.name,s):J(e.target.name)},[]),r=n.useCallback((e,s,{shouldDirty:d=!0,shouldOnChange:b=!0}={})=>{if(typeof s=="function"&&(s=s(P(e))),R.current.has(e)){typeof s=="object"&&s!==null?Object.keys(s).forEach(B=>{r(`${e}.${B}`,s[B],{shouldDirty:d,shouldOnChange:b})}):console.error(`Cannot set primitive value for nested parent field "${e}". Please set value for its children or provide an object.`);return}const $=D(C.current,e);if(s===$)return;if(C.current=M(C.current,e,s),p.publish(`values.${e}`,s,$),e.includes(".")){const B=e.split("."),V=B.findIndex((ce,fe)=>!R.current.has(B.slice(0,fe+1).join(".")));V!==-1&&(e=B.slice(0,V+1).join("."))}s&&W(e,"isTouched",!0);const N=s!==(D(m.current,e)||"");d&&W(e,"isDirty",N),b&&p.publish("onChange",e,s,$)},[]),g=n.useCallback(e=>{const s=e.split(".");let d="";s.forEach((b,$)=>{$<s.length-1&&(d=d?`${d}.${b}`:b,R.current.add(d))})},[]),F=n.useCallback(e=>{Array.isArray(e)?e.forEach(s=>g(s+".")):g(e+".")},[]),j=n.useCallback((e="",{shouldUnRegister:s=t}={})=>e?(l.current.add(e),h.current=M(h.current,e,{...de}),e.includes(".")&&g(e),()=>{s&&l.current.delete(e)}):console.error("Controller must have a name"),[]),Y=n.useCallback((e,{keepError:s,keepDirty:d,keepTouched:b,defaultValue:$})=>{if(!l.current.has(e))throw new Error(`Cannot reset "${e}" because it's uncontrolled field`);m.current=M(m.current,e,$),C.current=M(C.current,e,$),p.publish(`values.${e}`,$),s||J(e),d||W(e,"isDirty",!1),b||W(e,"isTouched",!1)},[]),I=n.useCallback((e,{bubble:s,trickle:d}={})=>{if(!e)return p.trigger("values",{bubble:s,trickle:d??!0});if(!Array.isArray(e)){const b=U(e);p.trigger(b,{bubble:s,trickle:d});return}e.forEach(b=>{const $=U(b);p.trigger($,{bubble:s,trickle:d})})},[]),X=n.useCallback(e=>{p.publish(`blur.values.${e}`,P(e)),p.publish(`blur.errors.${e}`,x(e));const s=q(e);Object.keys(s||{}).forEach(b=>{p.publish(`blur.fieldStates.${e}.${b}`,s[b])});const d=z();Object.keys(d||{}).forEach(b=>{p.publish(`blur.formState.${b}`,d[b])})},[]),K=n.useCallback((e,s=P(e))=>{p.publish("onBlur",e,s,P()),X(e)},[]),O=n.useMemo(()=>({subscribe:se,reset:k,trigger:I,reload:a,resetField:Y,setValue:r,getValues:P,getErrors:x,getFieldStates:q,getFormState:z,setError:H,clearError:J,clearErrors:ne,checkValidity:ue,getFieldValidity:w,getDefaultValues:S,setFieldState:W,triggerFieldBlur:K,resetFieldState:oe,getControlledFields:T,setFormState:le,getEvents:p.getEvents,getWatchEvents:p.getWatchEvents,addGroups:F}),[i]),L=n.useCallback(()=>{[...f.current.querySelectorAll("[name]")].forEach(d=>{const b=d.name||"";b.includes(".")&&g(b),!d.defaultValue&&!l.current.has(b)&&D(m.current,b)&&(d.defaultValue=D(m.current,b))});const s=v();C.current={...s},m.current={...s}},[]),Q=n.useMemo(()=>({ref:f,watch:te,actions:O,initForm:L,registerController:j,registerHookWatcher:Z,lastReloadedAt:i,loadFormValues:v,getWatchValue:G,triggerBlurWatchers:X,channels:p}),[i]),ie=n.useMemo(()=>({control:Q,actions:O,watch:te}),[i]);return n.useLayoutEffect(()=>{f.current&&L()},[i]),n.useLayoutEffect(()=>{h.current=_(!1)},[]),ie};exports.Controller=Ne;exports.Form=je;exports.restoreFromDotNotation=Se;exports.useController=Te;exports.useForm=Ie;exports.useFormContext=be;exports.useWatch=Fe;