remix-validated-form 4.3.1-beta.0 → 4.4.2

package/.turbo/turbo-build.log

@@ -1,14 +1,14 @@
 $ vite build
 vite v2.9.5 building for production...
 transforming...
-✓ 383 modules transformed.
+✓ 321 modules transformed.
 rendering chunks...
-dist/remix-validated-form.cjs.js   46.74 KiB / gzip: 18.09 KiB
-dist/remix-validated-form.es.js   125.24 KiB / gzip: 27.86 KiB
-dist/remix-validated-form.umd.js   47.02 KiB / gzip: 18.26 KiB
+dist/remix-validated-form.cjs.js   43.88 KiB / gzip: 16.70 KiB
+dist/remix-validated-form.es.js   98.54 KiB / gzip: 23.35 KiB
+dist/remix-validated-form.umd.js   44.13 KiB / gzip: 16.84 KiB
 
 [vite:dts] Start generate declaration files...
-[vite:dts] Declaration files built in 1713ms.
+[vite:dts] Declaration files built in 1804ms.
 
 No name was provided for external module 'react' in output.globals – guessing 'React'
 No name was provided for external module '@remix-run/react' in output.globals – guessing 'react'

package/browser/ValidatedForm.js

@@ -2,15 +2,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Form as RemixForm, useSubmit } from "@remix-run/react";
 import uniq from "lodash/uniq";
 import React, { useCallback, useEffect, useMemo, useRef, useState, } from "react";
-import invariant from "tiny-invariant";
 import { useIsSubmitting, useIsValid } from "./hooks";
 import { FORM_ID_FIELD } from "./internal/constants";
 import { InternalFormContext, } from "./internal/formContext";
-import { useDefaultValuesFromLoader, useErrorResponseForForm, useFormUpdateAtom, useHasActiveFormSubmit, } from "./internal/hooks";
+import { useDefaultValuesFromLoader, useErrorResponseForForm, useHasActiveFormSubmit, useSetFieldErrors, } from "./internal/hooks";
 import { useMultiValueMap } from "./internal/MultiValueMap";
-import { resetAtom } from "./internal/reset";
-import { cleanupFormState, endSubmitAtom, fieldErrorsAtom, formElementAtom, formPropsAtom, isHydratedAtom, setFieldErrorAtom, startSubmitAtom, } from "./internal/state";
-import { useAwaitValue } from "./internal/state/controlledFields";
+import { cleanupFormState } from "./internal/state/cleanup";
+import { useControlledFieldStore, useFormStore, } from "./internal/state/storeHooks";
 import { useSubmitComplete } from "./internal/submissionCallbacks";
 import { mergeRefs, useDeepEqualsMemo, useIsomorphicLayoutEffect as useLayoutEffect, } from "./internal/util";
 const getDataFromForm = (el) => new FormData(el);
@@ -113,32 +111,19 @@ export function ValidatedForm({ validator, onSubmit, children, fetcher, action,
     const formRef = useRef(null);
     const Form = (_a = fetcher === null || fetcher === void 0 ? void 0 : fetcher.Form) !== null && _a !== void 0 ? _a : RemixForm;
     const submit = useSubmit();
-    const setFieldErrors = useFormUpdateAtom(fieldErrorsAtom(formId));
-    const setFieldError = useFormUpdateAtom(setFieldErrorAtom(formId));
-    const reset = useFormUpdateAtom(resetAtom(formId));
-    const startSubmit = useFormUpdateAtom(startSubmitAtom(formId));
-    const endSubmit = useFormUpdateAtom(endSubmitAtom(formId));
-    const syncFormProps = useFormUpdateAtom(formPropsAtom(formId));
-    const setHydrated = useFormUpdateAtom(isHydratedAtom(formId));
-    const setFormElementInState = useFormUpdateAtom(formElementAtom(formId));
+    const setFieldErrors = useSetFieldErrors(formId);
+    const setFieldError = useFormStore(formId, (state) => state.setFieldError);
+    const reset = useFormStore(formId, (state) => state.reset);
+    const resetControlledFields = useControlledFieldStore(formId, (state) => state.reset);
+    const startSubmit = useFormStore(formId, (state) => state.startSubmit);
+    const endSubmit = useFormStore(formId, (state) => state.endSubmit);
+    const syncFormProps = useFormStore(formId, (state) => state.syncFormProps);
+    const setHydrated = useFormStore(formId, (state) => state.setHydrated);
+    const setFormElementInState = useFormStore(formId, (state) => state.setFormElement);
     useEffect(() => {
-        setHydrated(true);
+        setHydrated();
         return () => cleanupFormState(formId);
     }, [formId, setHydrated]);
-    const awaitValue = useAwaitValue(formId);
-    const validateField = useCallback(async (field) => {
-        invariant(formRef.current, "Cannot find reference to form");
-        await awaitValue(field);
-        const { error } = await validator.validateField(getDataFromForm(formRef.current), field);
-        if (error) {
-            setFieldError({ field, error });
-            return error;
-        }
-        else {
-            setFieldError({ field, error: undefined });
-            return null;
-        }
-    }, [awaitValue, setFieldError, validator]);
     const customFocusHandlers = useMultiValueMap();
     const registerReceiveFocus = useCallback((fieldName, handler) => {
         customFocusHandlers().add(fieldName, handler);
@@ -152,8 +137,8 @@ export function ValidatedForm({ validator, onSubmit, children, fetcher, action,
             action,
             defaultValues: (_a = providedDefaultValues !== null && providedDefaultValues !== void 0 ? providedDefaultValues : backendDefaultValues) !== null && _a !== void 0 ? _a : {},
             subaction,
-            validateField,
             registerReceiveFocus,
+            validator,
         });
     }, [
         action,
@@ -161,8 +146,8 @@ export function ValidatedForm({ validator, onSubmit, children, fetcher, action,
         registerReceiveFocus,
         subaction,
         syncFormProps,
-        validateField,
         backendDefaultValues,
+        validator,
     ]);
     useEffect(() => {
         var _a;
@@ -208,18 +193,17 @@ export function ValidatedForm({ validator, onSubmit, children, fetcher, action,
                 endSubmit();
                 return;
             }
+            const submitter = e.nativeEvent
+                .submitter;
             // We deviate from the remix code here a bit because of our async submit.
             // In remix's `FormImpl`, they use `event.currentTarget` to get the form,
             // but we already have the form in `formRef.current` so we can just use that.
             // If we use `event.currentTarget` here, it will break because `currentTarget`
             // will have changed since the start of the submission.
             if (fetcher)
-                fetcher.submit(clickedButtonRef.current || formRef.current);
+                fetcher.submit(submitter || e.currentTarget);
             else
-                submit(clickedButtonRef.current || formRef.current, {
-                    method,
-                    replace,
-                });
+                submit(submitter || e.currentTarget, { method, replace });
             clickedButtonRef.current = null;
         }
     };
@@ -231,5 +215,6 @@ export function ValidatedForm({ validator, onSubmit, children, fetcher, action,
             if (event.defaultPrevented)
                 return;
             reset();
+            resetControlledFields();
         }, children: _jsxs(InternalFormContext.Provider, { value: contextValue, children: [_jsx(FormResetter, { formRef: formRef, resetAfterSubmit: resetAfterSubmit }, void 0), subaction && (_jsx("input", { type: "hidden", value: subaction, name: "subaction" }, void 0)), id && _jsx("input", { type: "hidden", value: id, name: FORM_ID_FIELD }, void 0), children] }, void 0) }, void 0));
 }

package/browser/hooks.d.ts

@@ -64,4 +64,4 @@ export declare const useField: (name: string, options?: {
     formId?: string | undefined;
 } | undefined) => FieldProps;
 export declare const useControlField: <T>(name: string, formId?: string | undefined) => readonly [T, (value: T) => void];
-export declare const useUpdateControlledField: (formId?: string | undefined) => (field: string, value: unknown) => void;
+export declare const useUpdateControlledField: (formId?: string | undefined) => (fieldName: string, value: unknown) => void;

package/browser/hooks.js

@@ -1,7 +1,6 @@
 import { useEffect, useMemo } from "react";
 import { createGetInputProps, } from "./internal/getInputProps";
-import { useInternalFormContext, useFieldTouched, useFieldError, useFormAtomValue, useFieldDefaultValue, } from "./internal/hooks";
-import { formPropsAtom, hasBeenSubmittedAtom, isSubmittingAtom, isValidAtom, } from "./internal/state";
+import { useInternalFormContext, useFieldTouched, useFieldError, useFieldDefaultValue, useClearError, useInternalIsSubmitting, useInternalIsValid, useInternalHasBeenSubmitted, useValidateField, useRegisterReceiveFocus, } from "./internal/hooks";
 import { useControllableValue, useUpdateControllableValue, } from "./internal/state/controlledFields";
 /**
  * Returns whether or not the parent form is currently being submitted.
@@ -12,7 +11,7 @@ import { useControllableValue, useUpdateControllableValue, } from "./internal/st
  */
 export const useIsSubmitting = (formId) => {
     const formContext = useInternalFormContext(formId, "useIsSubmitting");
-    return useFormAtomValue(isSubmittingAtom(formContext.formId));
+    return useInternalIsSubmitting(formContext.formId);
 };
 /**
  * Returns whether or not the current form is valid.
@@ -21,7 +20,7 @@ export const useIsSubmitting = (formId) => {
  */
 export const useIsValid = (formId) => {
     const formContext = useInternalFormContext(formId, "useIsValid");
-    return useFormAtomValue(isValidAtom(formContext.formId));
+    return useInternalIsValid(formContext.formId);
 };
 /**
  * Provides the data and helpers necessary to set up a field.
@@ -31,9 +30,11 @@ export const useField = (name, options) => {
     const formContext = useInternalFormContext(providedFormId, "useField");
     const defaultValue = useFieldDefaultValue(name, formContext);
     const [touched, setTouched] = useFieldTouched(name, formContext);
-    const [error, setError] = useFieldError(name, formContext);
-    const hasBeenSubmitted = useFormAtomValue(hasBeenSubmittedAtom(formContext.formId));
-    const { validateField, registerReceiveFocus } = useFormAtomValue(formPropsAtom(formContext.formId));
+    const error = useFieldError(name, formContext);
+    const clearError = useClearError(formContext);
+    const hasBeenSubmitted = useInternalHasBeenSubmitted(formContext.formId);
+    const validateField = useValidateField(formContext.formId);
+    const registerReceiveFocus = useRegisterReceiveFocus(formContext.formId);
     useEffect(() => {
         if (handleReceiveFocus)
             return registerReceiveFocus(name, handleReceiveFocus);
@@ -41,7 +42,7 @@ export const useField = (name, options) => {
     const field = useMemo(() => {
         const helpers = {
             error,
-            clearError: () => setError(undefined),
+            clearError: () => clearError(name),
             validate: () => {
                 validateField(name);
             },
@@ -61,13 +62,13 @@ export const useField = (name, options) => {
         };
     }, [
         error,
+        clearError,
         defaultValue,
         touched,
         setTouched,
         name,
         hasBeenSubmitted,
         options === null || options === void 0 ? void 0 : options.validationBehavior,
-        setError,
         validateField,
     ]);
     return field;

package/browser/internal/hooks.d.ts

@@ -1,11 +1,7 @@
-import { Atom, WritableAtom } from "jotai";
-import { useUpdateAtom } from "jotai/utils";
 import { FieldErrors, ValidationErrorResponseData } from "..";
 import { InternalFormContextValue } from "./formContext";
 import { Hydratable } from "./hydratable";
-export declare const useFormUpdateAtom: typeof useUpdateAtom;
-export declare const useFormAtom: <Value, Update, Result extends void | Promise<void>>(anAtom: WritableAtom<Value, Update, Result>) => [Value extends Promise<infer V> ? V : Value, import("jotai/core/atom").SetAtom<Update, Result>];
-export declare const useFormAtomValue: <Value>(anAtom: Atom<Value>) => Value extends Promise<infer V> ? V : Value;
+import { InternalFormId } from "./state/storeFamily";
 export declare const useInternalFormContext: (formId?: string | symbol | undefined, hookName?: string | undefined) => InternalFormContextValue;
 export declare function useErrorResponseForForm({ fetcher, subaction, formId, }: InternalFormContextValue): ValidationErrorResponseData | null;
 export declare const useFieldErrorsForForm: (context: InternalFormContextValue) => Hydratable<FieldErrors | undefined>;
@@ -14,8 +10,23 @@ export declare const useDefaultValuesForForm: (context: InternalFormContextValue
     [fieldName: string]: any;
 }>;
 export declare const useHasActiveFormSubmit: ({ fetcher, }: InternalFormContextValue) => boolean;
-export declare const useFieldTouched: (field: string, { formId }: InternalFormContextValue) => [boolean, (update: boolean) => void];
-export declare const useFieldError: (name: string, context: InternalFormContextValue) => readonly [string | undefined, (update?: string | undefined) => void];
+export declare const useFieldTouched: (field: string, { formId }: InternalFormContextValue) => readonly [boolean, (touched: boolean) => void];
+export declare const useFieldError: (name: string, context: InternalFormContextValue) => string | undefined;
+export declare const useClearError: (context: InternalFormContextValue) => (field: string) => void;
 export declare const useFieldDefaultValue: (name: string, context: InternalFormContextValue) => any;
-export declare const useClearError: ({ formId }: InternalFormContextValue) => (name: string) => void;
-export declare const useSetTouched: ({ formId }: InternalFormContextValue) => (name: string, touched: boolean) => void;
+export declare const useInternalIsSubmitting: (formId: InternalFormId) => boolean;
+export declare const useInternalIsValid: (formId: InternalFormId) => boolean;
+export declare const useInternalHasBeenSubmitted: (formId: InternalFormId) => boolean;
+export declare const useValidateField: (formId: InternalFormId) => (fieldName: string) => Promise<string | null>;
+export declare const useValidate: (formId: InternalFormId) => () => Promise<void>;
+export declare const useRegisterReceiveFocus: (formId: InternalFormId) => (fieldName: string, handler: () => void) => () => void;
+export declare const useSyncedDefaultValues: (formId: InternalFormId) => {
+    [fieldName: string]: any;
+};
+export declare const useSetTouched: ({ formId }: InternalFormContextValue) => (field: string, touched: boolean) => void;
+export declare const useTouchedFields: (formId: InternalFormId) => import("..").TouchedFields;
+export declare const useFieldErrors: (formId: InternalFormId) => FieldErrors;
+export declare const useSetFieldErrors: (formId: InternalFormId) => (errors: FieldErrors) => void;
+export declare const useResetFormElement: (formId: InternalFormId) => () => void;
+export declare const useFormActionProp: (formId: InternalFormId) => string | undefined;
+export declare const useFormSubactionProp: (formId: InternalFormId) => string | undefined;

package/browser/internal/hooks.js

@@ -1,16 +1,11 @@
 import { useActionData, useMatches, useTransition } from "@remix-run/react";
-import { useAtom } from "jotai";
-import { useAtomValue, useUpdateAtom } from "jotai/utils";
 import lodashGet from "lodash/get";
 import { useCallback, useContext } from "react";
 import invariant from "tiny-invariant";
 import { formDefaultValuesKey } from "./constants";
 import { InternalFormContext } from "./formContext";
 import { hydratable } from "./hydratable";
-import { ATOM_SCOPE, fieldErrorAtom, fieldTouchedAtom, formPropsAtom, isHydratedAtom, setFieldErrorAtom, setTouchedAtom, } from "./state";
-export const useFormUpdateAtom = (atom) => useUpdateAtom(atom, ATOM_SCOPE);
-export const useFormAtom = (anAtom) => useAtom(anAtom, ATOM_SCOPE);
-export const useFormAtomValue = (anAtom) => useAtomValue(anAtom, ATOM_SCOPE);
+import { useFormStore } from "./state/storeHooks";
 export const useInternalFormContext = (formId, hookName) => {
     const formContext = useContext(InternalFormContext);
     if (formId)
@@ -39,7 +34,7 @@ export function useErrorResponseForForm({ fetcher, subaction, formId, }) {
 }
 export const useFieldErrorsForForm = (context) => {
     const response = useErrorResponseForForm(context);
-    const hydrated = useFormAtomValue(isHydratedAtom(context.formId));
+    const hydrated = useFormStore(context.formId, (state) => state.isHydrated);
     return hydratable.from(response === null || response === void 0 ? void 0 : response.fieldErrors, hydrated);
 };
 export const useDefaultValuesFromLoader = ({ formId, }) => {
@@ -57,7 +52,7 @@ export const useDefaultValuesFromLoader = ({ formId, }) => {
 };
 export const useDefaultValuesForForm = (context) => {
     const { formId, defaultValuesProp } = context;
-    const hydrated = useFormAtomValue(isHydratedAtom(formId));
+    const hydrated = useFormStore(formId, (state) => state.isHydrated);
     const errorResponse = useErrorResponseForForm(context);
     const defaultValuesFromLoader = useDefaultValuesFromLoader(context);
     // Typical flow is:
@@ -82,27 +77,41 @@ export const useHasActiveFormSubmit = ({ fetcher, }) => {
         : !!transition.submission;
     return hasActiveSubmission;
 };
-export const useFieldTouched = (field, { formId }) => useFormAtom(fieldTouchedAtom({ formId, field }));
+export const useFieldTouched = (field, { formId }) => {
+    const touched = useFormStore(formId, (state) => state.touchedFields[field]);
+    const setFieldTouched = useFormStore(formId, (state) => state.setTouched);
+    const setTouched = useCallback((touched) => setFieldTouched(field, touched), [field, setFieldTouched]);
+    return [touched, setTouched];
+};
 export const useFieldError = (name, context) => {
     const fieldErrors = useFieldErrorsForForm(context);
-    const [state, set] = useFormAtom(fieldErrorAtom({ formId: context.formId, field: name }));
-    return [
-        fieldErrors.map((fieldErrors) => fieldErrors === null || fieldErrors === void 0 ? void 0 : fieldErrors[name]).hydrateTo(state),
-        set,
-    ];
+    const state = useFormStore(context.formId, (state) => state.fieldErrors[name]);
+    return fieldErrors.map((fieldErrors) => fieldErrors === null || fieldErrors === void 0 ? void 0 : fieldErrors[name]).hydrateTo(state);
+};
+export const useClearError = (context) => {
+    const { formId } = context;
+    return useFormStore(formId, (state) => state.clearFieldError);
 };
 export const useFieldDefaultValue = (name, context) => {
     const defaultValues = useDefaultValuesForForm(context);
-    const { defaultValues: state } = useFormAtomValue(formPropsAtom(context.formId));
+    const state = useSyncedDefaultValues(context.formId);
     return defaultValues
         .map((val) => lodashGet(val, name))
         .hydrateTo(lodashGet(state, name));
 };
-export const useClearError = ({ formId }) => {
-    const updateError = useFormUpdateAtom(setFieldErrorAtom(formId));
-    return useCallback((name) => updateError({ field: name, error: undefined }), [updateError]);
-};
-export const useSetTouched = ({ formId }) => {
-    const setTouched = useFormUpdateAtom(setTouchedAtom(formId));
-    return useCallback((name, touched) => setTouched({ field: name, touched }), [setTouched]);
-};
+export const useInternalIsSubmitting = (formId) => useFormStore(formId, (state) => state.isSubmitting);
+export const useInternalIsValid = (formId) => useFormStore(formId, (state) => state.isValid());
+export const useInternalHasBeenSubmitted = (formId) => useFormStore(formId, (state) => state.hasBeenSubmitted);
+export const useValidateField = (formId) => useFormStore(formId, (state) => state.validateField);
+export const useValidate = (formId) => useFormStore(formId, (state) => state.validate);
+const noOpReceiver = () => () => { };
+export const useRegisterReceiveFocus = (formId) => useFormStore(formId, (state) => { var _a, _b; return (_b = (_a = state.formProps) === null || _a === void 0 ? void 0 : _a.registerReceiveFocus) !== null && _b !== void 0 ? _b : noOpReceiver; });
+const defaultDefaultValues = {};
+export const useSyncedDefaultValues = (formId) => useFormStore(formId, (state) => { var _a, _b; return (_b = (_a = state.formProps) === null || _a === void 0 ? void 0 : _a.defaultValues) !== null && _b !== void 0 ? _b : defaultDefaultValues; });
+export const useSetTouched = ({ formId }) => useFormStore(formId, (state) => state.setTouched);
+export const useTouchedFields = (formId) => useFormStore(formId, (state) => state.touchedFields);
+export const useFieldErrors = (formId) => useFormStore(formId, (state) => state.fieldErrors);
+export const useSetFieldErrors = (formId) => useFormStore(formId, (state) => state.setFieldErrors);
+export const useResetFormElement = (formId) => useFormStore(formId, (state) => state.resetFormElement);
+export const useFormActionProp = (formId) => useFormStore(formId, (state) => { var _a; return (_a = state.formProps) === null || _a === void 0 ? void 0 : _a.action; });
+export const useFormSubactionProp = (formId) => useFormStore(formId, (state) => { var _a; return (_a = state.formProps) === null || _a === void 0 ? void 0 : _a.subaction; });

package/browser/internal/logic/getRadioChecked.js

@@ -5,7 +5,7 @@ export const getRadioChecked = (radioValue = "on", newValue) => {
 };
 if (import.meta.vitest) {
     const { it, expect } = import.meta.vitest;
-    it("add", () => {
+    it("getRadioChecked", () => {
         expect(getRadioChecked("on", "on")).toBe(true);
         expect(getRadioChecked("on", undefined)).toBe(undefined);
         expect(getRadioChecked("trueValue", undefined)).toBe(undefined);

package/browser/internal/state/cleanup.d.ts

@@ -0,0 +1,2 @@
+import { InternalFormId } from "./storeFamily";
+export declare const cleanupFormState: (formId: InternalFormId) => void;

package/browser/internal/state/cleanup.js

@@ -0,0 +1,6 @@
+import { controlledFieldStore } from "./controlledFieldStore";
+import { formStore } from "./createFormStore";
+export const cleanupFormState = (formId) => {
+    formStore.remove(formId);
+    controlledFieldStore.remove(formId);
+};

package/browser/internal/state/controlledFieldStore.d.ts

@@ -0,0 +1,24 @@
+export declare type ControlledFieldState = {
+    fields: {
+        [fieldName: string]: {
+            refCount: number;
+            value: unknown;
+            defaultValue?: unknown;
+            hydrated: boolean;
+            valueUpdatePromise: Promise<void> | undefined;
+            resolveValueUpdate: (() => void) | undefined;
+        } | undefined;
+    };
+    register: (fieldName: string) => void;
+    unregister: (fieldName: string) => void;
+    setValue: (fieldName: string, value: unknown) => void;
+    hydrateWithDefault: (fieldName: string, defaultValue: unknown) => void;
+    awaitValueUpdate: (fieldName: string) => Promise<void>;
+    reset: () => void;
+};
+export declare const controlledFieldStore: {
+    (formId: import("./storeFamily").InternalFormId): import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<ControlledFieldState>, "setState"> & {
+        setState(nextStateOrUpdater: ControlledFieldState | Partial<ControlledFieldState> | ((state: import("immer/dist/internal").WritableDraft<ControlledFieldState>) => void), shouldReplace?: boolean | undefined): void;
+    }>;
+    remove(formId: import("./storeFamily").InternalFormId): void;
+};

package/browser/internal/state/controlledFieldStore.js

@@ -0,0 +1,57 @@
+import create from "zustand";
+import { immer } from "zustand/middleware/immer";
+import { storeFamily } from "./storeFamily";
+export const controlledFieldStore = storeFamily(() => create()(immer((set, get, api) => ({
+    fields: {},
+    register: (field) => set((state) => {
+        if (state.fields[field]) {
+            state.fields[field].refCount++;
+        }
+        else {
+            state.fields[field] = {
+                refCount: 1,
+                value: undefined,
+                hydrated: false,
+                valueUpdatePromise: undefined,
+                resolveValueUpdate: undefined,
+            };
+        }
+    }),
+    unregister: (field) => set((state) => {
+        const fieldState = state.fields[field];
+        if (!fieldState)
+            return;
+        fieldState.refCount--;
+        if (fieldState.refCount === 0)
+            delete state.fields[field];
+    }),
+    setValue: (field, value) => set((state) => {
+        const fieldState = state.fields[field];
+        if (!fieldState)
+            return;
+        fieldState.value = value;
+        const promise = new Promise((resolve) => {
+            fieldState.resolveValueUpdate = resolve;
+        });
+        fieldState.valueUpdatePromise = promise;
+    }),
+    hydrateWithDefault: (field, defaultValue) => set((state) => {
+        const fieldState = state.fields[field];
+        if (!fieldState)
+            return;
+        fieldState.value = defaultValue;
+        fieldState.defaultValue = defaultValue;
+        fieldState.hydrated = true;
+    }),
+    awaitValueUpdate: async (field) => {
+        var _a;
+        await ((_a = get().fields[field]) === null || _a === void 0 ? void 0 : _a.valueUpdatePromise);
+    },
+    reset: () => set((state) => {
+        Object.values(state.fields).forEach((field) => {
+            if (!field)
+                return;
+            field.value = field.defaultValue;
+        });
+    }),
+}))));

package/browser/internal/state/controlledFields.d.ts

@@ -1,119 +1,6 @@
-import { PrimitiveAtom } from "jotai";
 import { InternalFormContextValue } from "../formContext";
-import { FieldAtomKey, InternalFormId } from "./atomUtils";
-export declare const controlledFieldsAtom: {
-    (param: InternalFormId): import("jotai").Atom<Record<string, PrimitiveAtom<unknown>>> & {
-        write: (get: {
-            <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
-            <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
-            <Value_2>(atom: import("jotai").Atom<Value_2>): Value_2 extends Promise<infer V> ? V : Value_2;
-        } & {
-            <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
-                unstable_promise: true;
-            }): Value_3 | Promise<Value_3>;
-            <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
-                unstable_promise: true;
-            }): Value_4 | Promise<Value_4>;
-            <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
-                unstable_promise: true;
-            }): (Value_5 extends Promise<infer V> ? V : Value_5) | Promise<Value_5 extends Promise<infer V> ? V : Value_5>;
-        }, set: {
-            <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
-            <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
-        }, update: Record<string, PrimitiveAtom<unknown>> | ((prev: Record<string, PrimitiveAtom<unknown>>) => Record<string, PrimitiveAtom<unknown>>)) => void;
-        onMount?: (<S extends (update: Record<string, PrimitiveAtom<unknown>> | ((prev: Record<string, PrimitiveAtom<unknown>>) => Record<string, PrimitiveAtom<unknown>>)) => void>(setAtom: S) => void | (() => void)) | undefined;
-    } & {
-        init: Record<string, PrimitiveAtom<unknown>>;
-    };
-    remove(param: InternalFormId): void;
-    setShouldRemove(shouldRemove: ((createdAt: number, param: InternalFormId) => boolean) | null): void;
-};
-export declare const valueUpdatePromiseAtom: {
-    (param: FieldAtomKey): import("jotai").Atom<Promise<void> | undefined> & {
-        write: (get: {
-            <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
-            <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
-            <Value_2>(atom: import("jotai").Atom<Value_2>): Value_2 extends Promise<infer V> ? V : Value_2;
-        } & {
-            <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
-                unstable_promise: true;
-            }): Value_3 | Promise<Value_3>;
-            <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
-                unstable_promise: true;
-            }): Value_4 | Promise<Value_4>;
-            <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
-                unstable_promise: true;
-            }): (Value_5 extends Promise<infer V> ? V : Value_5) | Promise<Value_5 extends Promise<infer V> ? V : Value_5>;
-        }, set: {
-            <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
-            <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
-        }, update: Promise<void> | ((prev: Promise<void> | undefined) => Promise<void> | undefined) | undefined) => void;
-        onMount?: (<S extends (update?: Promise<void> | ((prev: Promise<void> | undefined) => Promise<void> | undefined) | undefined) => void>(setAtom: S) => void | (() => void)) | undefined;
-    } & {
-        init: Promise<void> | undefined;
-    };
-    remove(param: FieldAtomKey): void;
-    setShouldRemove(shouldRemove: ((createdAt: number, param: FieldAtomKey) => boolean) | null): void;
-};
-export declare const resolveValueUpdateAtom: {
-    (param: FieldAtomKey): import("jotai").Atom<(() => void) | undefined> & {
-        write: (get: {
-            <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
-            <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
-            <Value_2>(atom: import("jotai").Atom<Value_2>): Value_2 extends Promise<infer V> ? V : Value_2;
-        } & {
-            <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
-                unstable_promise: true;
-            }): Value_3 | Promise<Value_3>;
-            <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
-                unstable_promise: true;
-            }): Value_4 | Promise<Value_4>;
-            <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
-                unstable_promise: true;
-            }): (Value_5 extends Promise<infer V> ? V : Value_5) | Promise<Value_5 extends Promise<infer V> ? V : Value_5>;
-        }, set: {
-            <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
-            <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
-        }, update: (() => void) | ((prev: (() => void) | undefined) => (() => void) | undefined) | undefined) => void;
-        onMount?: (<S extends (update?: (() => void) | ((prev: (() => void) | undefined) => (() => void) | undefined) | undefined) => void>(setAtom: S) => void | (() => void)) | undefined;
-    } & {
-        init: (() => void) | undefined;
-    };
-    remove(param: FieldAtomKey): void;
-    setShouldRemove(shouldRemove: ((createdAt: number, param: FieldAtomKey) => boolean) | null): void;
-};
-export declare const setControlledFieldValueAtom: import("jotai").Atom<null> & {
-    write: (get: {
-        <Value>(atom: import("jotai").Atom<Value | Promise<Value>>): Value;
-        <Value_1>(atom: import("jotai").Atom<Promise<Value_1>>): Value_1;
-        <Value_2>(atom: import("jotai").Atom<Value_2>): Value_2 extends Promise<infer V> ? V : Value_2;
-    } & {
-        <Value_3>(atom: import("jotai").Atom<Value_3 | Promise<Value_3>>, options: {
-            unstable_promise: true;
-        }): Value_3 | Promise<Value_3>;
-        <Value_4>(atom: import("jotai").Atom<Promise<Value_4>>, options: {
-            unstable_promise: true;
-        }): Value_4 | Promise<Value_4>;
-        <Value_5>(atom: import("jotai").Atom<Value_5>, options: {
-            unstable_promise: true;
-        }): (Value_5 extends Promise<infer V> ? V : Value_5) | Promise<Value_5 extends Promise<infer V> ? V : Value_5>;
-    }, set: {
-        <Value_6, Result extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_6, undefined, Result>): Result;
-        <Value_7, Update, Result_1 extends void | Promise<void>>(atom: import("jotai").WritableAtom<Value_7, Update, Result_1>, update: Update): Result_1;
-    }, update: {
-        formId: InternalFormId;
-        field: string;
-        value: unknown;
-    }) => void;
-    onMount?: (<S extends (update: {
-        formId: InternalFormId;
-        field: string;
-        value: unknown;
-    }) => void>(setAtom: S) => void | (() => void)) | undefined;
-} & {
-    init: null;
-};
+import { InternalFormId } from "./storeFamily";
 export declare const useControlledFieldValue: (context: InternalFormContextValue, field: string) => any;
 export declare const useControllableValue: (context: InternalFormContextValue, field: string) => readonly [any, (value: unknown) => void];
-export declare const useUpdateControllableValue: (formId: InternalFormId) => (field: string, value: unknown) => void;
-export declare const useAwaitValue: (formId: InternalFormId) => (arg: string) => Promise<void>;
+export declare const useUpdateControllableValue: (formId: InternalFormId) => (fieldName: string, value: unknown) => void;
+export declare const useAwaitValue: (formId: InternalFormId) => (fieldName: string) => Promise<void>;