cross-state 0.56.4 → 1.0.0

package/dist/react/index.d.ts

@@ -1,6 +1,6 @@
-import "../scope-D3jkIPgn.js";
-import { Constrain, Duration, GetKeys, Join, MaybePromise, Object_, Path as Path$1, PathAsString, Selector, Store, Update, Value, WildcardPathAsString, WildcardValue } from "../store-DnZ6fsiJ.js";
-import { ScopeProps, ScopeProvider, UseCacheArray, UseCacheValue, UseStoreOptions, cacheMethods, scopeMethods, storeMethods, useCache, useScope, useStore } from "../storeMethods-Cb1ur5K3.js";
+import "../scope-DJXSRsGy.js";
+import { A as GetKeys, B as Value, C as Selector, F as PathAsString, G as MaybePromise, H as WildcardPathAsString, I as SettablePath, K as Constrain, N as Path$1, T as Update, U as WildcardValue, W as Object_, b as Duration, j as Join, r as Store } from "../store-BRHFhRPm.js";
+import { a as useScope, c as UseCacheValue, d as useStore, i as ScopeProvider, l as useCache, n as scopeMethods, o as cacheMethods, r as ScopeProps, s as UseCacheArray, t as storeMethods, u as UseStoreOptions } from "../storeMethods-Dsz0-Cda.js";
 import { Component, ComponentPropsWithoutRef, Context, FormEvent, FunctionComponent, HTMLProps, ReactNode } from "react";
 
 //#region src/react/form/customInput.d.ts
@@ -15,8 +15,8 @@ declare function CustomInput({
 }: CustomInputProps): React.JSX.Element;
 //#endregion
 //#region src/react/form/formField.d.ts
-interface FormFieldComponentProps<TValue, TPath> {
-  name: TPath;
+interface FormFieldComponentProps<TValue, TPath$1> {
+  name: TPath$1;
   value: TValue;
   onChange: (event: {
     target: {
@@ -25,29 +25,29 @@ interface FormFieldComponentProps<TValue, TPath> {
   } | TValue | undefined, ...args: any[]) => void;
   onBlur: (...args: any[]) => void;
 }
-type FormFieldInfos<TDraft, TOriginal, TPath extends string> = Field<TDraft, TOriginal, TPath> & {
+type FormFieldInfos<TDraft, TOriginal, TPath$1 extends string> = Field<TDraft, TOriginal, TPath$1> & {
   hasTriggeredValidations: boolean;
 };
 type NativeInputType = "input" | "select" | "textarea";
 type PartialComponentType<P> = (new (props: P, context?: any) => Component<P, any>) | ((props: P, context?: any) => ReactNode);
 type FormFieldComponent = NativeInputType | PartialComponentType<any>;
-type FieldValue<T extends FormFieldComponent> = ComponentPropsWithoutRef<T>["value"];
-type FieldChangeValue<T extends FormFieldComponent> = ComponentPropsWithoutRef<T> extends {
+type FieldValue<T$1 extends FormFieldComponent> = ComponentPropsWithoutRef<T$1>["value"];
+type FieldChangeValue<T$1 extends FormFieldComponent> = ComponentPropsWithoutRef<T$1> extends {
   onChange?: (update: infer U) => void;
 } ? U extends {
   target: {
     value: infer V;
   };
 } ? V : U : never;
-type MakeOptional<T, Keys extends string> = Omit<T, Keys> & Partial<Pick<T, Keys & keyof T>>;
-type FormFieldProps<TPath, TDraft> = {
-  name: TPath & PathAsString<TDraft>;
+type MakeOptional<T$1, Keys extends string> = Omit<T$1, Keys> & Partial<Pick<T$1, Keys & keyof T$1>>;
+type FormFieldProps<TPath$1, TDraft> = {
+  name: TPath$1 & PathAsString<TDraft>;
   commitOnBlur?: boolean;
   commitDebounce?: number;
 };
-type FormFieldPropsWithRender<TDraft, TOriginal, TPath extends string> = FormFieldProps<TPath, TDraft> & NoInfer<{
+type FormFieldPropsWithRender<TDraft, TOriginal, TPath$1 extends string> = FormFieldProps<TPath$1, TDraft> & NoInfer<{
   component?: undefined;
-  render: (props: FormFieldComponentProps<Value<TDraft, TPath>, TPath>, info: FormFieldInfos<TDraft, TOriginal, TPath>, form: FormContext<TDraft, TOriginal>) => ReactNode;
+  render: (props: FormFieldComponentProps<Value<TDraft, TPath$1>, TPath$1>, info: FormFieldInfos<TDraft, TOriginal, TPath$1>, form: FormContext<TDraft, TOriginal>) => ReactNode;
   inputFilter?: undefined;
   defaultValue?: undefined;
   serialize?: undefined;
@@ -55,43 +55,43 @@ type FormFieldPropsWithRender<TDraft, TOriginal, TPath extends string> = FormFie
   onChange?: undefined;
   onBlur?: undefined;
 }>;
-type Serialize<TDraft, TOriginal, TPath, TComponent extends FormFieldComponent> = (value: Value<TDraft, TPath>, formState: FormInstance<TDraft, TOriginal>) => FieldValue<TComponent>;
-type Deserialize<TDraft, TOriginal, TPath, TComponent extends FormFieldComponent> = (value: FieldChangeValue<TComponent>, formState: FormInstance<TDraft, TOriginal>) => Value<TDraft, TPath>;
-type FormFieldPropsWithComponent<TDraft, TOriginal, TPath extends string, TComponent extends FormFieldComponent> = FormFieldProps<TPath, TDraft> & {
+type Serialize<TDraft, TOriginal, TPath$1, TComponent extends FormFieldComponent> = (value: Value<TDraft, TPath$1>, formState: FormInstance<TDraft, TOriginal>) => FieldValue<TComponent>;
+type Deserialize<TDraft, TOriginal, TPath$1, TComponent extends FormFieldComponent> = (value: FieldChangeValue<TComponent>, formState: FormInstance<TDraft, TOriginal>) => Value<TDraft, TPath$1>;
+type FormFieldPropsWithComponent<TDraft, TOriginal, TPath$1 extends string, TComponent extends FormFieldComponent> = FormFieldProps<TPath$1, TDraft> & {
   component?: TComponent;
   render?: undefined;
 } & NoInfer<{
   inputFilter?: (value: FieldChangeValue<TComponent>) => boolean;
-} & MakeOptional<Omit<ComponentPropsWithoutRef<TComponent>, "id" | "name" | "value" | "defaultValue">, "onChange" | "onBlur"> & (Value<TDraft, TPath> extends Exclude<FieldValue<TComponent>, undefined> ? {
+} & MakeOptional<Omit<ComponentPropsWithoutRef<TComponent>, "id" | "name" | "value" | "defaultValue">, "onChange" | "onBlur"> & (Value<TDraft, TPath$1> extends Exclude<FieldValue<TComponent>, undefined> ? {
   defaultValue?: FieldValue<TComponent>;
-  serialize?: Serialize<TDraft, TOriginal, TPath, TComponent>;
-} : Value<TDraft, TPath> extends FieldValue<TComponent> ? {
+  serialize?: Serialize<TDraft, TOriginal, TPath$1, TComponent>;
+} : Value<TDraft, TPath$1> extends FieldValue<TComponent> ? {
   defaultValue: FieldValue<TComponent>;
-  serialize?: Serialize<TDraft, TOriginal, TPath, TComponent>;
+  serialize?: Serialize<TDraft, TOriginal, TPath$1, TComponent>;
 } | {
   defaultValue?: FieldValue<TComponent>;
-  serialize: Serialize<TDraft, TOriginal, TPath, TComponent>;
+  serialize: Serialize<TDraft, TOriginal, TPath$1, TComponent>;
 } : {
-  serialize: Serialize<TDraft, TOriginal, TPath, TComponent>;
-}) & (FieldChangeValue<TComponent> extends Value<TDraft, TPath> ? {
-  deserialize?: Deserialize<TDraft, TOriginal, TPath, TComponent>;
+  serialize: Serialize<TDraft, TOriginal, TPath$1, TComponent>;
+}) & (FieldChangeValue<TComponent> extends Value<TDraft, TPath$1> ? {
+  deserialize?: Deserialize<TDraft, TOriginal, TPath$1, TComponent>;
 } : {
-  deserialize: Deserialize<TDraft, TOriginal, TPath, TComponent>;
+  deserialize: Deserialize<TDraft, TOriginal, TPath$1, TComponent>;
 })>;
 //#endregion
 //#region src/react/form/formForEach.d.ts
-type ElementName<TDraft, TPath extends string> = keyof { [Path in TPath as Join<Path, GetKeys<NonNullable<Value<TDraft, Path>>> & (string | number)>]: 1 };
-interface FormForEachProps<TDraft, TPath extends string> {
-  name: TPath & PathAsString<TDraft>;
+type ElementName<TDraft, TPath$1 extends string> = keyof { [Path in TPath$1 as Join<Path, GetKeys<NonNullable<Value<TDraft, Path>>> & (string | number)>]: 1 };
+interface FormForEachProps<TDraft, TPath$1 extends string> {
+  name: TPath$1 & PathAsString<TDraft>;
   renderElement?: (props: {
-    name: ElementName<TDraft, TPath>;
-    key: `${GetKeys<NonNullable<Value<TDraft, TPath>>> & (string | number)}`;
+    name: ElementName<TDraft, TPath$1>;
+    key: `${GetKeys<NonNullable<Value<TDraft, TPath$1>>> & (string | number)}`;
     index: number;
     remove: () => void;
   }) => ReactNode;
   children?: (props: {
-    setValue: (value: Value<TDraft, TPath> | ((value: Value<TDraft, TPath>) => Value<TDraft, TPath>)) => void;
-  } & FieldHelperMethods<TDraft, TPath>) => ReactNode;
+    setValue: (value: Value<TDraft, TPath$1> | ((value: Value<TDraft, TPath$1>) => Value<TDraft, TPath$1>)) => void;
+  } & FieldHelperMethods<TDraft, TPath$1>) => ReactNode;
 }
 //#endregion
 //#region src/react/form/useFormAutosave.d.ts
@@ -114,23 +114,23 @@ interface FormOptions<TDraft, TOriginal> {
   validatedClass?: string;
 }
 type Validations<TDraft, TOriginal> = { [TPath in WildcardPathAsString<TDraft>]?: Record<string, Validation<TDraft, TOriginal, TPath>> } & Record<string, Record<string, Validation<TDraft, TOriginal, any>>>;
-type Validation<TDraft, TOriginal, TPath> = (value: WildcardValue<TDraft, TPath>, context: {
+type Validation<TDraft, TOriginal, TPath$1> = (value: WildcardValue<TDraft, TPath$1>, context: {
   draft: TDraft;
   original: TOriginal;
   field: PathAsString<TDraft> | "";
 }) => boolean;
-type Field<TDraft, TOriginal, TPath extends string> = {
-  originalValue: Value<TOriginal, TPath> | undefined;
-  value: Value<TDraft, TPath>;
-  setValue: (value: Update<Value<TDraft, TPath>>) => void;
+type Field<TDraft, TOriginal, TPath$1 extends string> = {
+  originalValue: Value<TOriginal, TPath$1> | undefined;
+  value: Value<TDraft, TPath$1>;
+  setValue: (value: Update<Value<TDraft, TPath$1>>) => void;
   removeValue: () => void;
   hasChange: boolean;
   errors: string[];
-} & (Value<TDraft, TPath> extends Object_ ? FieldHelperMethods<TDraft, TPath> : {});
-type FieldHelperMethods<TDraft, TPath extends string> = {
-  names: ElementName<TDraft, TPath>[];
-  add: NonNullable<Value<TDraft, TPath>> extends readonly (infer T)[] ? (element: T) => void : NonNullable<Value<TDraft, TPath>> extends Record<infer K, infer V> ? (key: K, value: V) => void : never;
-  remove: Value<TDraft, TPath> extends readonly any[] ? (index: number) => void : (key: string) => void;
+} & (Value<TDraft, TPath$1> extends Object_ ? FieldHelperMethods<TDraft, TPath$1> : {});
+type FieldHelperMethods<TDraft, TPath$1 extends string> = {
+  names: ElementName<TDraft, TPath$1>[];
+  add: NonNullable<Value<TDraft, TPath$1>> extends readonly (infer T)[] ? (element: T) => void : NonNullable<Value<TDraft, TPath$1>> extends Record<infer K, infer V> ? (key: K, value: V) => void : never;
+  remove: Value<TDraft, TPath$1> extends readonly any[] ? (index: number) => void : (key: string) => void;
 };
 interface FormState<TDraft> {
   draft: TDraft | undefined;
@@ -151,7 +151,7 @@ interface FormContext<TDraft, TOriginal> {
   formState: Store<FormState<TDraft>>;
   options: FormOptions<TDraft, TOriginal>;
   original: TOriginal | undefined;
-  getField: <TPath extends string>(path: TPath) => Field<TDraft, TOriginal, TPath>;
+  getField: <TPath$1 extends string>(path: TPath$1) => Field<TDraft, TOriginal, TPath$1>;
   getDraft: () => TDraft;
   hasTriggeredValidations: () => boolean;
   saveScheduled: () => boolean;
@@ -169,7 +169,7 @@ declare class Form<TDraft, TOriginal extends TDraft = TDraft> {
   constructor(options: FormOptions<TDraft, TOriginal>);
   useForm(): FormContext<TDraft, TOriginal>;
   useFormState<S>(selector: (state: FormInstance<TDraft, TOriginal>) => S, useStoreOptions?: UseStoreOptions<S>): S;
-  useField<TPath extends string>(path: TPath, useStoreOptions?: UseStoreOptions<any>): Field<TDraft, TOriginal, TPath>;
+  useField<TPath$1 extends string>(path: TPath$1, useStoreOptions?: UseStoreOptions<any>): Field<TDraft, TOriginal, TPath$1>;
   Form({
     original,
     defaultValue,
@@ -190,9 +190,9 @@ declare class Form<TDraft, TOriginal extends TDraft = TDraft> {
     selector: (form: FormInstance<TDraft, TOriginal>) => S;
     children: (selectedState: S) => ReactNode;
   }): React.JSX.Element;
-  Field<const TPath extends string>(props: FormFieldPropsWithRender<TDraft, TOriginal, TPath>): React.JSX.Element;
-  Field<const TPath extends string, const TComponent extends FormFieldComponent = "input">(props: FormFieldPropsWithComponent<TDraft, TOriginal, TPath, TComponent>): React.JSX.Element;
-  ForEach<const TPath extends string>(props: FormForEachProps<TDraft, TPath>): React.JSX.Element;
+  Field<const TPath$1 extends string>(props: FormFieldPropsWithRender<TDraft, TOriginal, TPath$1>): React.JSX.Element;
+  Field<const TPath$1 extends string, const TComponent extends FormFieldComponent = "input">(props: FormFieldPropsWithComponent<TDraft, TOriginal, TPath$1, TComponent>): React.JSX.Element;
+  ForEach<const TPath$1 extends string>(props: FormForEachProps<TDraft, TPath$1>): React.JSX.Element;
   withForm<TProps extends Record<string, unknown>>(Component: React.ComponentType<TProps>, formProps?: Parameters<this["Form"]>[0]): FunctionComponent<TProps>;
 }
 declare function createForm<TDraft, TOriginal extends TDraft = TDraft>(options: FormOptions<TDraft, TOriginal>): Form<TDraft, TOriginal>;
@@ -224,34 +224,34 @@ declare function LoadingBoundary({
 declare function useLoadingBoundary(isLoading: boolean | undefined, label?: ReactNode): void;
 //#endregion
 //#region src/react/url/urlOptions.d.ts
-interface UrlOptions<T> {
+interface UrlOptions<T$1> {
   key: string;
   type?: "search" | "hash";
-  serialize?: (value: T) => string;
-  deserialize?: (value: string) => T;
-  defaultValue: T;
+  serialize?: (value: T$1) => string;
+  deserialize?: (value: string) => T$1;
+  defaultValue: T$1;
   writeDefaultValue?: boolean;
-  onCommit?: (value: T) => void;
+  onCommit?: (value: T$1) => void;
   persist?: {
     id: string;
   } | null;
   path?: string | RegExp | (string | RegExp)[] | null;
 }
-interface UrlOptionsWithoutDefaults<T> extends Omit<UrlOptions<T | undefined>, "defaultValue"> {
-  defaultValue?: T | undefined;
+interface UrlOptionsWithoutDefaults<T$1> extends Omit<UrlOptions<T$1 | undefined>, "defaultValue"> {
+  defaultValue?: T$1 | undefined;
 }
-declare function createUrlOptions<T>(options: UrlOptions<T>): Required<UrlOptions<T>>;
-declare function createUrlOptions<T>(options: UrlOptionsWithoutDefaults<T>): Required<UrlOptions<T | undefined>>;
+declare function createUrlOptions<T$1>(options: UrlOptions<T$1>): Required<UrlOptions<T$1>>;
+declare function createUrlOptions<T$1>(options: UrlOptionsWithoutDefaults<T$1>): Required<UrlOptions<T$1 | undefined>>;
 //#endregion
 //#region src/react/url/urlParamStore.d.ts
 declare const urlStore: Store<string>;
-declare class UrlParamStore<T> extends Store<T> {
-  readonly urlOptions: Required<UrlOptions<T>>;
+declare class UrlParamStore<T$1> extends Store<T$1> {
+  readonly urlOptions: Required<UrlOptions<T$1>>;
   readonly storageKey: string | null;
   private lastHref?;
   private lastStorageValue?;
   private lastValue?;
-  constructor(urlOptions: Required<UrlOptions<T>>);
+  constructor(urlOptions: Required<UrlOptions<T$1>>);
   private watch;
   private getUrlValue;
   private getStorageValue;
@@ -259,25 +259,25 @@ declare class UrlParamStore<T> extends Store<T> {
   private calc;
   private updateUrl;
   private updateStorage;
-  set(update: Update<T>): void;
-  set<const P>(path: Constrain<P, Path$1<T>>, update: Update<Value<T, P>>): void;
-  parse(path: string): T;
+  set(update: Update<T$1>): void;
+  set<const P>(path: Constrain<P, Path$1<T$1>>, update: Update<Value<T$1, P>>): void;
+  parse(path: string): T$1;
 }
-declare function createUrlParam<T>(options: UrlOptions<T>): UrlParamStore<T>;
-declare function createUrlParam<T>(options: UrlOptionsWithoutDefaults<T>): UrlParamStore<T | undefined>;
+declare function createUrlParam<T$1>(options: UrlOptions<T$1>): UrlParamStore<T$1>;
+declare function createUrlParam<T$1>(options: UrlOptionsWithoutDefaults<T$1>): UrlParamStore<T$1 | undefined>;
 //#endregion
 //#region src/react/useDecoupledState.d.ts
-interface UseDecoupledStateOptions<T> {
+interface UseDecoupledStateOptions<T$1> {
   debounce?: Duration;
   throttle?: Duration;
-  onCommit?: (value: T) => void;
+  onCommit?: (value: T$1) => void;
 }
-declare function useDecoupledState<T>(value: T, onChange: (value: T) => void, options?: UseDecoupledStateOptions<T>): [state: T, setState: (value: T) => void];
+declare function useDecoupledState<T$1>(value: T$1, onChange: (value: T$1) => void, options?: UseDecoupledStateOptions<T$1>): [state: T$1, setState: (value: T$1) => void];
 //#endregion
 //#region src/react/useProp.d.ts
-declare function useProp<T, S>(store: Store<T>, selector: Selector<T, S>, updater: (value: S) => Update<T>, options?: UseStoreOptions<S>): [value: S, setValue: Store<S>["set"]];
-declare function useProp<T, const P>(store: Store<T>, selector: Constrain<P, Path$1<T>>, options?: UseStoreOptions<Value<T, P>>): [value: Value<T, P>, setValue: Store<Value<T, P>>["set"]];
-declare function useProp<T>(store: Store<T>, options?: UseStoreOptions<T>): [value: T, setValue: Store<T>["set"]];
+declare function useProp<T$1, S>(store: Store<T$1>, selector: Selector<T$1, S>, updater: (value: S) => Update<T$1>, options?: UseStoreOptions<S>): [value: S, setValue: Store<S>["set"]];
+declare function useProp<T$1, const P>(store: Store<T$1>, selector: Constrain<P, SettablePath<T$1>>, options?: UseStoreOptions<Value<T$1, P>>): [value: Value<T$1, P>, setValue: Store<Value<T$1, P>>["set"]];
+declare function useProp<T$1>(store: Store<T$1>, options?: UseStoreOptions<T$1>): [value: T$1, setValue: Store<T$1>["set"]];
 //#endregion
 export { CustomInput, CustomInputProps, Field, Form, FormContext, FormDerivedState, FormFieldComponent, FormFieldComponentProps, FormFieldInfos, FormFieldProps, FormFieldPropsWithComponent, FormFieldPropsWithRender, FormInstance, FormOptions, FormState, LoadingBoundary, type LoadingBoundaryEntry, type LoadingBoundaryProps, type ScopeProps, ScopeProvider, Transform, type UrlOptions, type UrlOptionsWithoutDefaults, type UrlParamStore, type UseCacheArray, type UseCacheValue, type UseDecoupledStateOptions, type UseStoreOptions, Validation, Validations, cacheMethods, createForm, createUrlOptions, createUrlParam, scopeMethods, storeMethods, urlStore, useCache, useDecoupledState, useLoadingBoundary, useProp, useScope, useStore };
 //# sourceMappingURL=index.d.ts.map

package/dist/react/index.js

@@ -1,8 +1,8 @@
-import { Store, autobind, calcDuration, createStore, debounce, queue, throttle } from "../store-Dx8w7yT-.js";
-import { castArrayPath, deepEqual, get, isObject, join, set } from "../propAccess-B260LXN1.js";
-import { simpleHash } from "../hash-DNFM5y_h.js";
-import { fromExtendedJsonString, toExtendedJsonString } from "../extendedJson-BZkQBXEv.js";
-import { LoadingBoundary, ScopeProvider, cacheMethods, scopeMethods, storeMethods, useCache, useLoadingBoundary, useProp, useScope, useStore } from "../storeMethods-BrKuusQ2.js";
+import { c as debounce, d as queue, h as autobind, m as calcDuration, n as createStore, r as throttle, t as Store } from "../store-v3RYWzVg.js";
+import { a as set, c as deepEqual, n as get, o as isObject, r as join, t as castArrayPath } from "../propAccess-DvWFpYoj.js";
+import { i as toExtendedJsonString, n as fromExtendedJsonString } from "../extendedJson-Dv9q6rps.js";
+import "../path-CyYq74W8.js";
+import { a as useProp, c as cacheMethods, d as useLoadingBoundary, f as useStore, i as useScope, l as useCache, n as scopeMethods, o as useLatestFunction, p as useMemoEquals, r as ScopeProvider, s as useLatestRef, t as storeMethods, u as LoadingBoundary } from "../storeMethods-CQhXlHpl.js";
 import { Fragment, createContext, createElement, startTransition, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
@@ -106,21 +106,17 @@ function FormField({ name = "", component, commitOnBlur, commitDebounce, render,
 function FormForEach({ name, renderElement, children }) {
 	const form = this.useForm();
 	const names = this.useFormState(() => {
-		const field = form.getField(name);
-		return field.names;
+		return form.getField(name).names;
 	});
 	const add = useCallback((...args) => {
-		const field = form.getField(name);
-		field.add(...args);
-	}, [form]);
+		form.getField(name).add(...args);
+	}, [form, name]);
 	const remove = useCallback((key) => {
-		const field = form.getField(name);
-		field.remove(key);
-	}, [form]);
+		form.getField(name).remove(key);
+	}, [form, name]);
 	const setValue = useCallback((value) => {
-		const field = form.getField(name);
-		field.setValue(value);
-	}, [form]);
+		form.getField(name).setValue(value);
+	}, [form, name]);
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [renderElement && names.map((name$1, index) => {
 		const key = name$1.split(".").pop();
 		return /* @__PURE__ */ jsx(Fragment, { children: renderElement({
@@ -140,39 +136,38 @@ function FormForEach({ name, renderElement, children }) {
 //#endregion
 //#region src/react/form/useFormAutosave.ts
 function useFormAutosave(form) {
-	const { formState, options, getDraft } = form;
-	const debounceTime = calcDuration(options.autoSave?.debounce ?? 2e3);
-	const latestRef = useRef({ options });
+	const debounceTime = calcDuration(form.options.autoSave?.debounce ?? 2e3);
+	const latestRef = useLatestRef(form);
 	const lastValue = useRef(void 0);
 	const q = useMemo(() => queue(), []);
 	const run = useMemo(() => debounce(async () => {
-		const { options: options$1 } = latestRef.current;
-		const save = options$1.autoSave?.save;
-		const draft = getDraft();
+		const save = latestRef.current.options.autoSave?.save;
+		const draft = latestRef.current.getDraft();
 		lastValue.current = draft;
 		q.clear();
 		q(async () => {
 			try {
-				formState.set("saveInProgress", true);
-				await save?.(draft, form);
-				if (q.size === 0 && options$1.autoSave?.resetAfterSave) form.reset();
+				latestRef.current.formState.set("saveInProgress", true);
+				await save?.(draft, latestRef.current);
+				if (q.size === 0 && latestRef.current.options.autoSave?.resetAfterSave) latestRef.current.reset();
 			} finally {
-				formState.set("saveInProgress", false);
-				if (q.size === 0) formState.set("saveScheduled", false);
+				latestRef.current.formState.set("saveInProgress", false);
+				if (q.size === 0) latestRef.current.formState.set("saveScheduled", false);
 			}
 		});
-	}, debounceTime), [formState, debounceTime]);
+	}, debounceTime), [
+		latestRef,
+		debounceTime,
+		q
+	]);
 	useEffect(() => {
-		if (!options.autoSave?.save) return;
-		return formState.map((state) => state.draft).subscribe(() => {
-			if (deepEqual(getDraft(), lastValue.current)) return;
+		if (!latestRef.current.options.autoSave?.save) return;
+		return latestRef.current.formState.map((state) => state.draft).subscribe(() => {
+			if (deepEqual(latestRef.current.getDraft(), lastValue.current)) return;
 			run();
-			formState.set("saveScheduled", true);
+			latestRef.current.formState.set("saveScheduled", true);
 		}, { runNow: false });
-	}, [formState]);
-	useEffect(() => {
-		latestRef.current = { options };
-	});
+	}, [latestRef, run]);
 }
 
 //#endregion
@@ -181,7 +176,7 @@ function FormContainer({ form,...formProps }) {
 	const formInstance = form.useForm();
 	const hasTriggeredValidations = form.useFormState((state) => state.hasTriggeredValidations);
 	const formRef = useRef(null);
-	function updateValidity(errors, buttonElement) {
+	const updateValidity = useLatestFunction((errors, buttonElement) => {
 		const formElement = formRef.current;
 		if (!formElement) return;
 		const localizedErrors = new Map([...errors.entries()].map(([field, errors$1]) => [field, errors$1.map((error) => formInstance.options.localizeError?.(error, field) ?? error)]));
@@ -190,10 +185,10 @@ function FormContainer({ form,...formProps }) {
 			const errorString = [...errors.values()].flat().join("\n");
 			buttonElement.setCustomValidity(errorString);
 		}
-	}
+	});
 	useEffect(() => {
 		return formInstance.formState.map(() => formInstance.getErrors()).subscribe((errors) => updateValidity(errors));
-	}, []);
+	}, [formInstance, updateValidity]);
 	return /* @__PURE__ */ jsx("form", {
 		ref: formRef,
 		noValidate: true,
@@ -208,8 +203,7 @@ function FormContainer({ form,...formProps }) {
 				const buttonElement = event.nativeEvent instanceof SubmitEvent && event.nativeEvent.submitter instanceof HTMLButtonElement ? event.nativeEvent.submitter : void 0;
 				updateValidity(formInstance.getErrors(), buttonElement);
 				formElement.reportValidity();
-				const isValid = formInstance.validate();
-				if (isValid) await formProps.onSubmit?.(event, {
+				if (formInstance.validate()) await formProps.onSubmit?.(event, {
 					...formInstance,
 					...getDerivedState(formInstance)
 				});
@@ -220,13 +214,12 @@ function FormContainer({ form,...formProps }) {
 	});
 }
 function getField(form, path) {
-	const field = {
+	return {
 		get originalValue() {
 			return form.original !== void 0 ? get(form.original, path) : void 0;
 		},
 		get value() {
-			const draft = form.getDraft();
-			return get(draft ?? form.original ?? form.options.defaultValue, path);
+			return get(form.getDraft() ?? form.original ?? form.options.defaultValue, path);
 		},
 		setValue(update) {
 			form.formState.set("draft", (draft = form.original ?? form.options.defaultValue) => {
@@ -238,8 +231,7 @@ function getField(form, path) {
 			return !deepEqual(this.originalValue, this.value, { undefinedEqualsAbsent: true });
 		},
 		get errors() {
-			const errors = form.getErrors();
-			return errors.get(path) ?? [];
+			return form.getErrors().get(path) ?? [];
 		},
 		get names() {
 			const { value } = this;
@@ -270,7 +262,6 @@ function getField(form, path) {
 			});
 		}
 	};
-	return field;
 }
 function getErrors(draft, original, validations) {
 	const errors = /* @__PURE__ */ new Map();
@@ -424,8 +415,9 @@ var Form = class Form {
 			});
 		}, [
 			original,
-			defaultValue,
-			options.transform
+			options.defaultValue,
+			options.transform,
+			formState
 		]);
 		useFormAutosave(context);
 		return /* @__PURE__ */ jsx(this.context.Provider, {
@@ -437,8 +429,7 @@ var Form = class Form {
 		});
 	}
 	FormState({ selector, children }) {
-		const selectedState = this.useFormState(selector);
-		return /* @__PURE__ */ jsx(Fragment$1, { children: children(selectedState) });
+		return /* @__PURE__ */ jsx(Fragment$1, { children: children(this.useFormState(selector)) });
 	}
 	Field(props) {
 		return Reflect.apply(FormField, this, [{
@@ -472,11 +463,11 @@ function castArray(value) {
 //#endregion
 //#region src/react/url/urlHelpers.ts
 function defaultDeserializer(value) {
-	if (value === void 0) return void 0;
+	if (value === void 0) return;
 	try {
 		return fromExtendedJsonString(value);
 	} catch {
-		return void 0;
+		return;
 	}
 }
 function defaultSerializer(value) {
@@ -560,8 +551,7 @@ var UrlParamStore = class UrlParamStore extends Store {
 	getUrlValue() {
 		const href = urlStore.get();
 		const url = new URL(href);
-		const params = new URLSearchParams(url[this.urlOptions.type].slice(1) || "");
-		return params.get(this.urlOptions.key);
+		return new URLSearchParams(url[this.urlOptions.type].slice(1) || "").get(this.urlOptions.key);
 	}
 	getStorageValue() {
 		return this.storageKey !== null ? localStorage.getItem(this.storageKey) : null;
@@ -580,8 +570,7 @@ var UrlParamStore = class UrlParamStore extends Store {
 		if (!this.isPathActive() && this.lastHref !== void 0) href = this.lastHref;
 		if (this.lastHref === href && this.lastStorageValue === storageValue) return this.lastValue;
 		const url = new URL(href);
-		const params = new URLSearchParams(url[this.urlOptions.type].slice(1));
-		const urlValue = params.get(this.urlOptions.key);
+		const urlValue = new URLSearchParams(url[this.urlOptions.type].slice(1)).get(this.urlOptions.key);
 		const value = urlValue !== null ? this.urlOptions.deserialize(urlValue) : this.storageKey !== null && storageValue !== null ? this.urlOptions.deserialize(storageValue) : this.urlOptions.defaultValue;
 		this.lastHref = href;
 		this.lastStorageValue = storageValue;
@@ -609,16 +598,14 @@ var UrlParamStore = class UrlParamStore extends Store {
 		if (update instanceof Function) {
 			const before = this.get();
 			const valueBefore = get(before, path);
-			const valueAfter = update(valueBefore);
-			update = set(before, path, valueAfter);
+			update = set(before, path, update(valueBefore));
 		} else if (path.length > 0) update = set(this.get(), path, update);
 		if (this.isPathActive()) this.updateUrl(update);
 		else this.updateStorage(update);
 	}
 	parse(path) {
 		const url = new URL(path, window.location.href);
-		const params = new URLSearchParams(url[this.urlOptions.type].slice(1) || "");
-		const urlValue = params.get(this.urlOptions.key);
+		const urlValue = new URLSearchParams(url[this.urlOptions.type].slice(1) || "").get(this.urlOptions.key);
 		return urlValue !== null ? this.urlOptions.deserialize(urlValue) : this.urlOptions.defaultValue;
 	}
 };
@@ -630,32 +617,30 @@ function createUrlParam(options) {
 //#region src/react/useDecoupledState.ts
 function useDecoupledState(value, onChange, options = {}) {
 	const [dirty, setDirty] = useState();
-	const ref = useRef({
-		onChange,
-		onCommit: options.onCommit
-	});
-	useEffect(() => {
-		ref.current = {
-			onChange,
-			onCommit: options.onCommit
-		};
-	}, [onChange]);
+	const latestOnChange = useLatestFunction(onChange);
+	const latestOnCommit = useLatestFunction(options.onCommit ?? (() => {}));
+	const debounceOptions = useMemoEquals(options.debounce);
+	const throttleOptions = useMemoEquals(options.throttle);
 	const update = useMemo(() => {
-		const { onChange: onChange$1, onCommit } = ref.current;
 		const update$1 = (value$1) => {
-			onChange$1(value$1);
+			latestOnChange(value$1);
 			setDirty(void 0);
-			onCommit?.(value$1);
+			latestOnCommit(value$1);
 		};
 		let delayedUpdate;
-		if (options.debounce) delayedUpdate = debounce(update$1, options.debounce);
-		else if (options.throttle) delayedUpdate = throttle(update$1, options.throttle);
+		if (debounceOptions) delayedUpdate = debounce(update$1, debounceOptions);
+		else if (throttleOptions) delayedUpdate = throttle(update$1, throttleOptions);
 		else delayedUpdate = (value$1) => startTransition(() => update$1(value$1));
 		return (value$1) => {
 			setDirty({ v: value$1 });
 			delayedUpdate(value$1);
 		};
-	}, [simpleHash([options.debounce, options.throttle])]);
+	}, [
+		latestOnChange,
+		latestOnCommit,
+		debounceOptions,
+		throttleOptions
+	]);
 	return [dirty ? dirty.v : value, update];
 }