@povio/ui 3.3.0 → 3.4.0-rc.10

package/dist/config/uiConfig.context.js

@@ -1,10 +1,8 @@
-import { CalendarIcon } from "../assets/icons/Calendar.js";
-import { ClockIcon } from "../assets/icons/Clock.js";
-import { DateTimeIcon } from "../assets/icons/DateTime.js";
 import { ObjectUtils } from "../utils/object.utils.js";
 import { useDeepCompareMemo } from "../hooks/useDeepCompare.js";
-import { jsx } from "react/jsx-runtime";
+import { Calendar, CalendarClock, Clock } from "lucide-react";
 import { createContext, use } from "react";
+import { jsx } from "react/jsx-runtime";
 //#region src/config/uiConfig.context.tsx
 var UIConfig;
 (function(_UIConfig) {
@@ -41,8 +39,8 @@ var UIConfig;
 			selectedTagsType: "list",
 			collapseAfter: 3,
 			hideSearchIcon: false,
-			fireBlurOnChange: false,
-			multiSelectAutoConfirm: false
+			multiSelectAutoConfirm: false,
+			fireBlurOnChange: false
 		},
 		queryAutocomplete: {
 			isInitialQueryDisabled: false,
@@ -70,15 +68,15 @@ var UIConfig;
 			shouldForceLeadingZeros: false,
 			disableManualEntry: false,
 			autoFixYear: false,
-			fireBlurOnChange: false,
-			calendarIcon: /* @__PURE__ */ jsx(CalendarIcon, { className: "size-5" }),
-			dateTimeIcon: /* @__PURE__ */ jsx(DateTimeIcon, { className: "size-5" }),
-			timeIcon: /* @__PURE__ */ jsx(ClockIcon, { className: "size-6 text-interactive-text-secondary-idle" }),
+			calendarIcon: /* @__PURE__ */ jsx(Calendar, { className: "size-4" }),
+			dateTimeIcon: /* @__PURE__ */ jsx(CalendarClock, { className: "size-4" }),
+			timeIcon: /* @__PURE__ */ jsx(Clock, { className: "size-4 text-interactive-text-secondary-idle" }),
 			setDateValueOnDateSelection: false,
 			timeZone: "clientLocal",
 			granularity: "day",
 			shouldUpdateDateOnMonthYearChange: false,
-			allowPartialRange: false
+			allowPartialRange: false,
+			fireBlurOnChange: false
 		},
 		actionModal: {
 			titleTypography: {

package/dist/config/uiOverrides.context.js

@@ -1,9 +1,9 @@
 import { StyleMergeUtils } from "../utils/style-merge.util.js";
-import { c } from "react/compiler-runtime";
-import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { createContext, use } from "react";
+import { c } from "react/compiler-runtime";
 import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
 //#region src/config/uiOverrides.context.tsx
 var UIOverrides;
 (function(_UIOverrides) {

package/dist/helpers/dynamicColumns.d.ts

@@ -1,6 +1,6 @@
 import { CellContext, ColumnDef, ColumnMeta } from '@tanstack/react-table';
 import { ReactNode } from 'react';
-import { FieldPath } from 'react-hook-form';
+import { FieldPath } from '../components/inputs/shared/form.binding';
 import { z } from 'zod';
 type NestedTypeFromKey<T, K extends string> = K extends keyof T ? T[K] : K extends `${infer First}.${infer Rest}` ? First extends keyof T ? NestedTypeFromKey<T[First], Rest> : never : never;
 type SchemaType<TSchema extends z.ZodObject<any>> = z.infer<TSchema>;

package/dist/helpers/dynamicInputs.d.ts

@@ -1,5 +1,5 @@
 import { ReactElement } from 'react';
-import { Control, UseFormReturn } from 'react-hook-form';
+import { FormInstance } from '../components/inputs/shared/form.binding';
 import { z } from 'zod';
 import { InputComponentProps, InputComponentType, InputDef, InputDefBaseProps, InputWrapperType } from '../components/inputs/Inputs/InputItem';
 import { ZodUtils } from '../utils/zod.utils';
@@ -47,17 +47,17 @@ type UnknownInputDef<TSchema extends z.ZodObject<any>, K extends keyof z.infer<T
     } & DynamicInputDefBase<InputDefBaseProps<InputComponentProps<T>>>;
 }[DefaultComponentType<TSchema["shape"][K]>];
 type RenderInputDef<TSchema extends z.ZodObject<any>, K extends keyof z.infer<TSchema>> = {
-    render: (formControl: {
-        control: Control<z.infer<TSchema>>;
+    render: (field: {
+        form: FormInstance<z.infer<TSchema>>;
         name: K;
-    }, form: UseFormReturn<z.infer<TSchema>>) => ReactElement;
+    }, form: FormInstance<z.infer<TSchema>>) => ReactElement;
 } & DynamicInputDefBase<Record<string, never>>;
 type DynamicInputDef<TSchema extends z.ZodObject<any>, K extends keyof z.infer<TSchema>> = ConfigInputDef<TSchema, K> | UnknownInputDef<TSchema, K> | RenderInputDef<TSchema, K>;
 type InputsConfig<TSchema extends z.ZodObject<any>> = {
-    [K in keyof z.infer<TSchema>]?: DynamicInputDef<TSchema, K> | ((formControl: {
-        control: Control<z.infer<TSchema>>;
+    [K in keyof z.infer<TSchema>]?: DynamicInputDef<TSchema, K> | ((field: {
+        form: FormInstance<z.infer<TSchema>>;
         name: K;
-    }, form: UseFormReturn<z.infer<TSchema>>) => ReactElement) | boolean;
+    }, form: FormInstance<z.infer<TSchema>>) => ReactElement) | boolean;
 };
 type GlobalProps = {
     [T in Exclude<InputComponentType, "unknown">]: InputDefBaseProps<InputComponentProps<T>>;

package/dist/hooks/useAutosave.d.ts

@@ -1,10 +1,10 @@
-import { FieldValues, UseFormReturn } from 'react-hook-form';
-export interface UseAutosaveProps<TFieldValues extends FieldValues = FieldValues, TContext = any, TTransformedValues = TFieldValues, TResponse = unknown> {
-    form: UseFormReturn<TFieldValues, TContext, TTransformedValues>;
+import { UIForm } from './useForm';
+export interface UseAutosaveProps<TFieldValues extends Record<string, unknown>, TTransformedValues = TFieldValues, TResponse = unknown> {
+    form: UIForm<TFieldValues>;
     delay?: number;
     enabled?: boolean;
     trigger?: "change" | "blur";
     onSave: (data: Partial<TTransformedValues>) => Promise<TResponse>;
     onSaveSuccess?: () => void;
 }
-export declare function useAutosave<TFieldValues extends FieldValues = FieldValues, TContext = any, TTransformedValues = TFieldValues, TResponse = unknown>({ form, delay, enabled, trigger, onSave, onSaveSuccess, }: UseAutosaveProps<TFieldValues, TContext, TTransformedValues, TResponse>): void;
+export declare function useAutosave<TFieldValues extends Record<string, unknown>, TTransformedValues = TFieldValues, TResponse = unknown>({ form, delay, enabled, trigger, onSave, onSaveSuccess, }: UseAutosaveProps<TFieldValues, TTransformedValues, TResponse>): void;

package/dist/hooks/useAutosave.js

@@ -1,70 +1,85 @@
 import { ObjectUtils } from "../utils/object.utils.js";
 import { isEqual } from "../utils/isEqual.js";
 import { useEffect, useRef } from "react";
-import { useFormState, useWatch } from "react-hook-form";
 //#region src/hooks/useAutosave.ts
-function isNilOrEqual(left, right) {
-	if (ObjectUtils.isNil(left) && ObjectUtils.isNil(right)) return true;
-	return isEqual(left, right);
-}
-function diffLeftOnly(left, right, shallowKeys) {
-	if (!ObjectUtils.isObject(left) || ObjectUtils.isDate(left) || ObjectUtils.isRegExp(left)) return !isNilOrEqual(left, right) ? left : void 0;
-	if (Array.isArray(left)) return !isNilOrEqual(left, right) ? left : void 0;
+function diffLeftOnly(left, right) {
+	if (!ObjectUtils.isObject(left) || ObjectUtils.isDate(left) || ObjectUtils.isRegExp(left)) return isEqual(left, right) ? void 0 : left;
+	if (Array.isArray(left)) return isEqual(left, right) ? void 0 : left;
 	const result = Object.entries(left).reduce((acc, [key, value]) => {
-		const shallowSubtree = shallowKeys?.[key];
-		if (shallowSubtree === true) {
-			if (!isNilOrEqual(value, right?.[key])) acc[key] = value;
-			return acc;
-		}
-		const diff = diffLeftOnly(value, right?.[key], shallowSubtree);
+		const diff = diffLeftOnly(value, right?.[key]);
 		if (diff !== void 0 && (!ObjectUtils.isObject(diff) || !ObjectUtils.isEmpty(diff))) acc[key] = diff;
 		return acc;
 	}, {});
 	return ObjectUtils.isEmpty(result) ? void 0 : result;
 }
+var snapshot = (value) => structuredClone(value);
+function pickChangedValues(source, changes) {
+	if (!ObjectUtils.isObject(changes) || Array.isArray(changes)) return source;
+	return Object.entries(changes).reduce((result, [key, value]) => {
+		result[key] = pickChangedValues(source?.[key], value);
+		return result;
+	}, {});
+}
 function useAutosave({ form, delay = 500, enabled = true, trigger = "change", onSave, onSaveSuccess }) {
 	const timeoutRef = useRef(void 0);
-	const previousBlurTriggerFieldsRef = useRef(void 0);
-	const { control, reset, handleSubmit } = form;
-	const { dirtyFields, touchedFields, defaultValues } = useFormState({ control });
-	const formData = useWatch({ control });
+	const savedSnapshotRef = useRef(snapshot(form.state.values));
+	const saveQueueRef = useRef(Promise.resolve());
+	const latestSaveRef = useRef({
+		onSave,
+		onSaveSuccess
+	});
+	latestSaveRef.current = {
+		onSave,
+		onSaveSuccess
+	};
 	useEffect(() => {
-		if (!enabled || Object.keys(dirtyFields).length === 0) return;
-		if (trigger === "blur") {
-			const blurTriggerFields = JSON.stringify(touchedFields);
-			if (Object.keys(touchedFields).length === 0 || previousBlurTriggerFieldsRef.current === blurTriggerFields) return;
-			previousBlurTriggerFieldsRef.current = blurTriggerFields;
-		}
-		if (timeoutRef.current) clearTimeout(timeoutRef.current);
-		timeoutRef.current = setTimeout(() => {
-			handleSubmit(async (data) => {
-				const changedData = diffLeftOnly(Object.entries(dirtyFields).filter(([, value]) => value).reduce((acc, [key]) => {
-					acc[key] = data[key];
-					return acc;
-				}, {}), defaultValues, dirtyFields) ?? {};
-				if (Object.keys(changedData).length === 0) return;
-				try {
-					reset(void 0, { keepValues: true });
-					await onSave(changedData);
-					onSaveSuccess?.();
-				} catch {
-					reset(defaultValues);
-					return;
-				}
-			})();
-		}, delay);
+		const clearPending = () => {
+			if (timeoutRef.current) {
+				clearTimeout(timeoutRef.current);
+				timeoutRef.current = void 0;
+			}
+		};
+		const queueSave = () => {
+			if (!enabled) return;
+			clearPending();
+			timeoutRef.current = setTimeout(() => {
+				saveQueueRef.current = saveQueueRef.current.then(async () => {
+					const valuesAtSaveTime = snapshot(form.state.values);
+					const changedValues = diffLeftOnly(valuesAtSaveTime, savedSnapshotRef.current);
+					if (!changedValues) return;
+					let transformedValues;
+					try {
+						transformedValues = form.parseValues(valuesAtSaveTime);
+					} catch {
+						return;
+					}
+					const payload = pickChangedValues(transformedValues, changedValues);
+					if (ObjectUtils.isEmpty(payload)) return;
+					try {
+						await latestSaveRef.current.onSave(payload);
+						savedSnapshotRef.current = valuesAtSaveTime;
+						for (const name of Object.keys(payload)) form.setFieldMeta(name, (meta) => ({
+							...meta,
+							isDirty: false
+						}));
+						latestSaveRef.current.onSaveSuccess?.();
+					} catch {}
+				});
+			}, delay);
+		};
+		const unsubscribeStore = trigger === "change" ? form.store.subscribe(() => {
+			if (!isEqual(form.state.values, savedSnapshotRef.current)) queueSave();
+		}) : void 0;
+		const unsubscribeBlur = trigger === "blur" ? form.subscribeBlur(queueSave) : void 0;
 		return () => {
-			if (timeoutRef.current) clearTimeout(timeoutRef.current);
+			clearPending();
+			unsubscribeStore?.unsubscribe();
+			unsubscribeBlur?.();
 		};
 	}, [
-		defaultValues,
-		dirtyFields,
-		trigger === "change" ? formData : touchedFields,
 		delay,
-		onSave,
-		handleSubmit,
 		enabled,
-		reset,
+		form,
 		trigger
 	]);
 }

package/dist/hooks/useFilters.js

@@ -1,7 +1,7 @@
 import { UIRouter } from "../config/router.context.js";
 import { RoutingUtils } from "../utils/routing.utils.js";
-import { c } from "react/compiler-runtime";
 import { useEffect, useState } from "react";
+import { c } from "react/compiler-runtime";
 import { z } from "zod";
 //#region src/hooks/useFilters.ts
 function getFieldType(schema, fieldKey) {

package/dist/hooks/useForm.d.ts

@@ -1,18 +1,42 @@
-import { BrowserNativeObject, ExtractObjects, FieldValues, NestedValue, UseFormProps as UseReactHookFormProps } from 'react-hook-form';
+import { AnyFormApi, DeepKeys, DeepValue, ReactFormExtendedApi } from '@tanstack/react-form';
 import { z } from 'zod';
-type DeepNullablePartial<T> = T extends BrowserNativeObject | NestedValue ? T : {
-    [K in keyof T]?: ExtractObjects<T[K]> extends never ? T[K] | null : DeepNullablePartial<T[K]>;
+type FormMode = "all" | "onBlur" | "onChange" | "onSubmit" | "onTouched";
+type FieldValidators = {
+    onBlur?: ({ value }: {
+        value: unknown;
+    }) => string | undefined;
+    onChange?: ({ value }: {
+        value: unknown;
+    }) => string | undefined;
 };
-type AsyncDefaultValues<TFieldValues> = (payload?: unknown) => Promise<TFieldValues>;
-type NullableDefaultValues<TFieldValues> = TFieldValues extends AsyncDefaultValues<TFieldValues> ? DeepNullablePartial<Awaited<TFieldValues>> : DeepNullablePartial<TFieldValues>;
-export type UseFormResolverProps<TFieldValues extends FieldValues, TTransformedValues = TFieldValues> = {
-    zodSchema: z.ZodType<TTransformedValues, TFieldValues>;
-    resolver?: never;
-} | {
-    zodSchema?: never;
-};
-export type UseFormProps<TFieldValues extends FieldValues, TContext, TTransformedValues = TFieldValues> = Omit<UseReactHookFormProps<TFieldValues, TContext, TTransformedValues>, "defaultValues"> & {
-    defaultValues?: NullableDefaultValues<TFieldValues> | AsyncDefaultValues<TFieldValues>;
+export type FormSubmitHandler<TValues> = (values: TValues) => void | Promise<void>;
+export type FormSubmitErrorHandler<TValues> = (errors: unknown, values: TValues) => unknown;
+type TanStackForm<TFieldValues> = ReactFormExtendedApi<TFieldValues, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, never>;
+export type UIForm<TFieldValues extends Record<string, unknown> = Record<string, unknown>> = Omit<TanStackForm<TFieldValues>, "handleSubmit"> & {
+    readonly disabled: boolean;
+    getFieldValidators: (name: DeepKeys<TFieldValues>) => FieldValidators | undefined;
+    notifyBlur: (name: DeepKeys<TFieldValues>) => void;
+    parseValues: (values: TFieldValues) => unknown;
+    subscribeBlur: (listener: (name: DeepKeys<TFieldValues>) => void) => () => void;
+    handleSubmit: (onValid: FormSubmitHandler<any>, onInvalid?: FormSubmitErrorHandler<TFieldValues>) => (event?: {
+        preventDefault?: () => void;
+        stopPropagation?: () => void;
+    }) => Promise<void>;
 };
-export declare function useForm<TFieldValues extends FieldValues = FieldValues, TContext = any, TTransformedValues = TFieldValues>({ resolver, zodSchema, defaultValues, ...props }: UseFormProps<TFieldValues, TContext, TTransformedValues> & UseFormResolverProps<TFieldValues, TTransformedValues>): import('react-hook-form').UseFormReturn<TFieldValues, TContext, TTransformedValues>;
-export {};
+type AsyncDefaultValues<TFieldValues> = (payload?: unknown) => Promise<TFieldValues>;
+type NullableDefaults<T> = T extends Date | File | Blob ? T : T extends Array<infer TItem> ? Array<NullableDefaults<TItem>> : T extends object ? {
+    [K in keyof T]?: NullableDefaults<T[K]> | null;
+} : T | null;
+export interface UseFormProps<TFieldValues, TTransformedValues = TFieldValues> {
+    defaultValues?: NullableDefaults<TFieldValues> | AsyncDefaultValues<TFieldValues>;
+    disabled?: boolean;
+    mode?: FormMode;
+    onSubmitAsync?: (props: {
+        value: TFieldValues;
+    }) => Promise<unknown>;
+    zodSchema?: z.ZodType<TTransformedValues, TFieldValues>;
+}
+export declare function useForm<TFieldValues extends Record<string, unknown> = Record<string, unknown>, _TContext = unknown, TTransformedValues = TFieldValues>({ defaultValues, disabled, mode, onSubmitAsync, zodSchema, }?: UseFormProps<TFieldValues, TTransformedValues>): UIForm<TFieldValues>;
+export declare const useFormValue: <TFieldValues extends Record<string, unknown>, TSelected>(form: UIForm<TFieldValues>, selector: (values: TFieldValues) => TSelected) => TSelected;
+export declare const useFormState: <TFieldValues extends Record<string, unknown>, TSelected>(form: UIForm<TFieldValues>, selector: (state: UIForm<TFieldValues>["state"]) => TSelected) => TSelected;
+export type { AnyFormApi, DeepKeys, DeepValue };

package/dist/hooks/useForm.js

@@ -1,48 +1,101 @@
+import { useEffect, useMemo, useRef } from "react";
 import { c } from "react/compiler-runtime";
-import { useForm } from "react-hook-form";
-import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm, useStore } from "@tanstack/react-form";
 //#region src/hooks/useForm.ts
-function useForm$1(t0) {
-	const $ = c(12);
-	let defaultValues;
-	let props;
-	let resolver;
-	let zodSchema;
-	if ($[0] !== t0) {
-		({resolver, zodSchema, defaultValues, ...props} = t0);
-		$[0] = t0;
-		$[1] = defaultValues;
-		$[2] = props;
-		$[3] = resolver;
-		$[4] = zodSchema;
-	} else {
-		defaultValues = $[1];
-		props = $[2];
-		resolver = $[3];
-		zodSchema = $[4];
-	}
-	let t1;
-	if ($[5] !== resolver || $[6] !== zodSchema) {
-		t1 = resolver ?? (zodSchema ? zodResolver(zodSchema) : void 0);
-		$[5] = resolver;
-		$[6] = zodSchema;
-		$[7] = t1;
-	} else t1 = $[7];
-	const formResolver = t1;
-	const t2 = defaultValues;
-	let t3;
-	if ($[8] !== formResolver || $[9] !== props || $[10] !== t2) {
-		t3 = {
-			...props,
-			resolver: formResolver,
-			defaultValues: t2
+function useForm$1({ defaultValues, disabled = false, mode = "onSubmit", onSubmitAsync, zodSchema } = {}) {
+	const submitHandlerRef = useRef(() => void 0);
+	const submitErrorHandlerRef = useRef(void 0);
+	const blurListenersRef = useRef(/* @__PURE__ */ new Set());
+	const fieldValidators = useMemo(() => {
+		return /* @__PURE__ */ new Map();
+	}, [mode, zodSchema]);
+	const formValidator = useMemo(() => {
+		if (!zodSchema) return;
+		return ({ value }) => {
+			const result = zodSchema.safeParse(value);
+			if (result.success) return;
+			return { fields: Object.fromEntries(result.error.issues.map((issue) => [pathToString(issue.path), issue.message])) };
+		};
+	}, [zodSchema]);
+	const form = useForm({
+		defaultValues: (typeof defaultValues === "function" ? {} : defaultValues) ?? {},
+		validators: formValidator || onSubmitAsync ? {
+			onSubmit: formValidator,
+			onSubmitAsync
+		} : void 0,
+		onSubmit: async ({ value: value_0 }) => {
+			const transformed = zodSchema ? zodSchema.parse(value_0) : value_0;
+			await submitHandlerRef.current(transformed);
+		},
+		onSubmitInvalid: ({ value: value_1, formApi }) => {
+			submitErrorHandlerRef.current?.(formApi.state.errors, value_1);
+		}
+	});
+	const originalHandleSubmit = useMemo(() => form.handleSubmit.bind(form), [form]);
+	const uiForm = form;
+	Object.defineProperties(uiForm, { disabled: {
+		configurable: true,
+		get: () => disabled
+	} });
+	uiForm.getFieldValidators = (name) => {
+		const cached = fieldValidators.get(name);
+		if (cached || fieldValidators.has(name)) return cached;
+		const schema = zodSchema ? getSchemaAtPath(zodSchema, name) : void 0;
+		if (!schema || mode === "onSubmit") {
+			fieldValidators.set(name, void 0);
+			return;
+		}
+		const validate = ({ value: value_2 }) => {
+			const result_0 = schema.safeParse(value_2);
+			return result_0.success ? void 0 : result_0.error.issues[0]?.message;
 		};
-		$[8] = formResolver;
-		$[9] = props;
-		$[10] = t2;
-		$[11] = t3;
-	} else t3 = $[11];
-	return useForm(t3);
+		const validators = mode === "onChange" || mode === "all" ? { onChange: validate } : { onBlur: validate };
+		fieldValidators.set(name, validators);
+		return validators;
+	};
+	uiForm.notifyBlur = (name_0) => {
+		for (const listener of blurListenersRef.current) listener(name_0);
+	};
+	uiForm.parseValues = (values) => zodSchema ? zodSchema.parse(values) : values;
+	uiForm.subscribeBlur = (listener_0) => {
+		blurListenersRef.current.add(listener_0);
+		return () => blurListenersRef.current.delete(listener_0);
+	};
+	uiForm.handleSubmit = (onValid, onInvalid) => async (event) => {
+		event?.preventDefault?.();
+		event?.stopPropagation?.();
+		submitHandlerRef.current = onValid;
+		submitErrorHandlerRef.current = onInvalid;
+		await originalHandleSubmit();
+	};
+	useEffect(() => {
+		if (typeof defaultValues === "function") defaultValues().then((values_0) => form.reset(values_0));
+	}, [defaultValues, form]);
+	return uiForm;
 }
+var useFormValue = (form, selector) => {
+	const $ = c(2);
+	let t0;
+	if ($[0] !== selector) {
+		t0 = (state) => selector(state.values);
+		$[0] = selector;
+		$[1] = t0;
+	} else t0 = $[1];
+	return useStore(form.store, t0);
+};
+var useFormState = (form, selector) => {
+	return useStore(form.store, selector);
+};
+var getSchemaAtPath = (rootSchema, path) => {
+	let schema = rootSchema;
+	for (const segment of parsePath(path)) {
+		while (schema?.unwrap && !schema.shape && !schema.element && !schema.items) schema = schema.unwrap();
+		schema = typeof segment === "number" ? schema?.element ?? schema?.items?.[segment] : schema?.shape?.[segment];
+		if (!schema) return;
+	}
+	return schema;
+};
+var parsePath = (path) => path.replaceAll("[", ".").replaceAll("]", "").split(".").filter(Boolean).map((segment) => /^\d+$/.test(segment) ? Number(segment) : segment);
+var pathToString = (path) => path.reduce((result, segment) => typeof segment === "number" ? `${result}[${segment}]` : result ? `${result}.${String(segment)}` : String(segment), "");
 //#endregion
-export { useForm$1 as useForm };
+export { useForm$1 as useForm, useFormState, useFormValue };

package/dist/hooks/useFormAutosave.d.ts

@@ -1,15 +1,14 @@
 import { DependencyList } from 'react';
-import { FieldValues } from 'react-hook-form';
 import { UseAutosaveProps } from './useAutosave';
-import { UseFormProps, UseFormResolverProps } from './useForm';
-export type UseFormAutosaveProps<TFieldValues extends FieldValues = FieldValues, TContext = any, TTransformedValues = TFieldValues, TResponse = unknown> = Omit<UseFormProps<TFieldValues, TContext, TTransformedValues>, "defaultValues"> & UseFormResolverProps<TFieldValues, TTransformedValues> & {
-    autosaveDelay?: UseAutosaveProps<TFieldValues, TContext, TTransformedValues, TResponse>["delay"];
-    enableAutosave?: UseAutosaveProps<TFieldValues, TContext, TTransformedValues, TResponse>["enabled"];
-    autosaveOn?: UseAutosaveProps<TFieldValues, TContext, TTransformedValues, TResponse>["trigger"];
+import { UseFormProps } from './useForm';
+export type UseFormAutosaveProps<TFieldValues extends Record<string, unknown> = Record<string, unknown>, _TContext = any, TTransformedValues = TFieldValues, TResponse = unknown> = Omit<UseFormProps<TFieldValues, TTransformedValues>, "defaultValues"> & {
+    autosaveDelay?: UseAutosaveProps<TFieldValues, TTransformedValues, TResponse>["delay"];
+    enableAutosave?: UseAutosaveProps<TFieldValues, TTransformedValues, TResponse>["enabled"];
+    autosaveOn?: UseAutosaveProps<TFieldValues, TTransformedValues, TResponse>["trigger"];
     normalizeAutosaveData?: (data: Partial<TTransformedValues>) => Partial<TTransformedValues> | undefined;
-    onAutosave: UseAutosaveProps<TFieldValues, TContext, TTransformedValues, TResponse>["onSave"];
-    getResetValues: () => UseFormProps<TFieldValues, TContext, TTransformedValues>["defaultValues"];
+    onAutosave: UseAutosaveProps<TFieldValues, TTransformedValues, TResponse>["onSave"];
+    getResetValues: () => UseFormProps<TFieldValues, TTransformedValues>["defaultValues"];
     resetDeps: DependencyList;
     resetTimeout?: number;
 };
-export declare function useFormAutosave<TFieldValues extends FieldValues = FieldValues, TContext = any, TTransformedValues = TFieldValues, TResponse = any>({ autosaveDelay, enableAutosave, autosaveOn, normalizeAutosaveData, onAutosave, getResetValues, resetDeps, resetTimeout, ...props }: UseFormAutosaveProps<TFieldValues, TContext, TTransformedValues, TResponse>): import('react-hook-form').UseFormReturn<TFieldValues, TContext, TTransformedValues>;
+export declare function useFormAutosave<TFieldValues extends Record<string, unknown> = Record<string, unknown>, TContext = any, TTransformedValues = TFieldValues, TResponse = any>({ autosaveDelay, enableAutosave, autosaveOn, normalizeAutosaveData, onAutosave, getResetValues, resetDeps, resetTimeout, ...props }: UseFormAutosaveProps<TFieldValues, TContext, TTransformedValues, TResponse>): import('./useForm').UIForm<TFieldValues>;

package/dist/hooks/useFormAutosave.js

@@ -26,15 +26,19 @@ function useFormAutosave({ autosaveDelay, enableAutosave, autosaveOn = "change",
 		const resetValues = getResetValues();
 		if (resetValues === void 0) return;
 		const resetFormValues = async () => {
-			const keepStateOptions = shouldResetFormValuesRef.current ? { keepDirtyValues: true } : void 0;
+			const keepCurrentValues = shouldResetFormValuesRef.current;
 			shouldResetFormValuesRef.current = false;
-			let values = resetValues;
+			let values;
 			if (ObjectUtils.isFunction(resetValues)) values = await resetValues();
-			form.reset(values, keepStateOptions);
+			else values = resetValues;
+			form.reset(keepCurrentValues ? {
+				...values,
+				...form.state.values
+			} : values);
 		};
 		resetFormValues();
 	}, [...resetDeps]);
-	const onSaveSuccess = () => {
+	const prepareForSaveReset = () => {
 		shouldResetFormValuesRef.current = true;
 		if (resetFormValuesTimeoutRef.current) clearTimeout(resetFormValuesTimeoutRef.current);
 		resetFormValuesTimeoutRef.current = setTimeout(() => {
@@ -46,12 +50,22 @@ function useFormAutosave({ autosaveDelay, enableAutosave, autosaveOn = "change",
 		delay: autosaveDelay,
 		enabled: enableAutosave,
 		trigger: autosaveOn,
-		onSave: useCallback((data) => {
+		onSave: useCallback(async (data) => {
 			const normalizedData = normalizeAutosaveData ? normalizeAutosaveData(data) : data;
-			if (!normalizedData || ObjectUtils.isEmpty(normalizedData)) return Promise.resolve(void 0);
-			return onAutosave(normalizedData);
-		}, [normalizeAutosaveData, onAutosave]),
-		onSaveSuccess
+			if (!normalizedData || ObjectUtils.isEmpty(normalizedData)) return;
+			prepareForSaveReset();
+			try {
+				return await onAutosave(normalizedData);
+			} catch (error) {
+				shouldResetFormValuesRef.current = false;
+				if (resetFormValuesTimeoutRef.current) clearTimeout(resetFormValuesTimeoutRef.current);
+				throw error;
+			}
+		}, [
+			normalizeAutosaveData,
+			onAutosave,
+			resetTimeout
+		])
 	});
 	return form;
 }

package/dist/hooks/useIntersectionObserver.js

@@ -1,5 +1,5 @@
-import { c } from "react/compiler-runtime";
 import { useEffect, useRef } from "react";
+import { c } from "react/compiler-runtime";
 //#region src/hooks/useIntersectionObserver.ts
 var useIntersectionObserver = (t0) => {
 	const $ = c(13);

package/dist/hooks/useLocalStorage.js

@@ -1,5 +1,5 @@
-import { c } from "react/compiler-runtime";
 import { useState } from "react";
+import { c } from "react/compiler-runtime";
 //#region src/hooks/useLocalStorage.ts
 var getValue = (key, schema) => {
 	if (!localStorage) return null;

package/dist/hooks/usePagination.js

@@ -1,7 +1,7 @@
 import { UIRouter } from "../config/router.context.js";
 import { RoutingUtils } from "../utils/routing.utils.js";
-import { c } from "react/compiler-runtime";
 import { useEffect, useState } from "react";
+import { c } from "react/compiler-runtime";
 //#region src/hooks/usePagination.ts
 var DEFAULT_STATE = {
 	pageIndex: 1,

package/dist/hooks/useScrollableListBox.js

@@ -1,6 +1,6 @@
 import { useBreakpoint } from "./useBreakpoint.js";
-import { c } from "react/compiler-runtime";
 import { useEffect, useRef } from "react";
+import { c } from "react/compiler-runtime";
 //#region src/hooks/useScrollableListBox.ts
 function useScrollableListBox() {
 	const $ = c(4);

package/dist/hooks/useSorting.js

@@ -1,7 +1,7 @@
 import { UIRouter } from "../config/router.context.js";
 import { RoutingUtils } from "../utils/routing.utils.js";
-import { c } from "react/compiler-runtime";
 import { useEffect, useState } from "react";
+import { c } from "react/compiler-runtime";
 //#region src/hooks/useSorting.ts
 function useSorting(defaultSorting, t0) {
 	const $ = c(16);

package/dist/hooks/useStateAndRef.js

@@ -1,6 +1,6 @@
 import { ObjectUtils } from "../utils/object.utils.js";
-import { c } from "react/compiler-runtime";
 import { useRef, useState } from "react";
+import { c } from "react/compiler-runtime";
 //#region src/hooks/useStateAndRef.ts
 var useStateAndRef = (initialState) => {
 	const $ = c(3);

package/dist/hooks/useTableColumnConfig.js

@@ -1,5 +1,5 @@
-import { c } from "react/compiler-runtime";
 import { useEffect, useState } from "react";
+import { c } from "react/compiler-runtime";
 //#region src/hooks/useTableColumnConfig.ts
 function sortByKeyOrder(data, orderedKeys = []) {
 	return [...data].sort((a, b) => {