el-form-react-hooks/dist/index.d.mts

TypeScript-first React form hooks with flexible validation - supports Zod, Yup, Valibot, custom functions, or no validation. Modern form state management with useForm hook.

import { ValidatorConfig } from 'el-form-core';
export * from 'el-form-core';
import * as react_jsx_runtime from 'react/jsx-runtime';
import React$1 from 'react';

interface FileInfo {
    name: string;
    size: number;
    type: string;
    lastModified: number;
    formattedSize: string;
    isImage: boolean;
    extension: string;
}
interface FileValidationOptions {
    maxSize?: number;
    minSize?: number;
    maxFiles?: number;
    minFiles?: number;
    acceptedTypes?: string[];
    acceptedExtensions?: string[];
}

interface FormContextValue<T extends Record<string, any>> {
    form: UseFormReturn<T>;
    formId?: string;
}
interface FormState<T extends Record<string, any>> {
    values: Partial<T>;
    errors: Partial<Record<keyof T, string>>;
    touched: Partial<Record<keyof T, boolean>>;
    isSubmitting: boolean;
    isValid: boolean;
    isDirty: boolean;
}
interface FormSnapshot<T extends Record<string, any>> {
    values: Partial<T>;
    errors: Partial<Record<keyof T, string>>;
    touched: Partial<Record<keyof T, boolean>>;
    timestamp: number;
    isDirty: boolean;
}
interface UseFormOptions<T extends Record<string, any>> {
    defaultValues?: Partial<T>;
    validators?: ValidatorConfig;
    onSubmit?: (values: T) => void | Promise<void>;
    fieldValidators?: Partial<Record<keyof T, ValidatorConfig>>;
    fileValidators?: Partial<Record<keyof T, FileValidationOptions>>;
    mode?: "onChange" | "onBlur" | "onSubmit" | "all";
    validateOn?: "onChange" | "onBlur" | "onSubmit" | "manual";
}
interface FieldState {
    isDirty: boolean;
    isTouched: boolean;
    error?: string;
}
interface ResetOptions<T> {
    values?: Partial<T>;
    keepErrors?: boolean;
    keepDirty?: boolean;
    keepTouched?: boolean;
}
interface SetFocusOptions {
    shouldSelect?: boolean;
}
interface UseFormReturn<T extends Record<string, any>> {
    register: (name: string) => {
        name: string;
        onChange: (e: React.ChangeEvent<any>) => void;
        onBlur: (e: React.FocusEvent<any>) => void;
    } & ({
        checked: boolean;
        value?: never;
        files?: never;
    } | {
        value: any;
        checked?: never;
        files?: never;
    } | {
        files: FileList | File | File[] | null;
        value?: never;
        checked?: never;
    });
    handleSubmit: (onValid: (data: T) => void, onError?: (errors: Record<keyof T, string>) => void) => (e: React.FormEvent) => void;
    formState: FormState<T>;
    reset: (options?: ResetOptions<T>) => void;
    setValue: (path: string, value: any) => void;
    setValues: (values: Partial<T>) => void;
    watch: {
        (): Partial<T>;
        <Name extends keyof T>(name: Name): T[Name];
        <Names extends keyof T>(names: Names[]): Pick<T, Names>;
    };
    resetValues: (values?: Partial<T>) => void;
    getFieldState: <Name extends keyof T>(name: Name) => FieldState;
    isDirty: <Name extends keyof T>(name?: Name) => boolean;
    getDirtyFields: () => Partial<Record<keyof T, boolean>>;
    getTouchedFields: () => Partial<Record<keyof T, boolean>>;
    isFieldDirty: (name: string) => boolean;
    isFieldTouched: (name: string) => boolean;
    isFieldValid: (name: string) => boolean;
    hasErrors: () => boolean;
    getErrorCount: () => number;
    markAllTouched: () => void;
    markFieldTouched: (name: string) => void;
    markFieldUntouched: (name: string) => void;
    trigger: {
        (): Promise<boolean>;
        <Name extends keyof T>(name: Name): Promise<boolean>;
        <Names extends keyof T>(names: Names[]): Promise<boolean>;
    };
    clearErrors: (name?: keyof T) => void;
    setError: <Name extends keyof T>(name: Name, error: string) => void;
    setFocus: <Name extends keyof T>(name: Name, options?: SetFocusOptions) => void;
    addArrayItem: (path: string, item: any) => void;
    removeArrayItem: (path: string, index: number) => void;
    resetField: <Name extends keyof T>(name: Name) => void;
    submit: () => Promise<void>;
    submitAsync: () => Promise<{
        success: true;
        data: T;
    } | {
        success: false;
        errors: Partial<Record<keyof T, string>>;
    }>;
    canSubmit: boolean;
    getSnapshot: () => FormSnapshot<T>;
    restoreSnapshot: (snapshot: FormSnapshot<T>) => void;
    hasChanges: () => boolean;
    getChanges: () => Partial<T>;
    addFile: (name: string, file: File) => void;
    removeFile: (name: string, index?: number) => void;
    clearFiles: (name: string) => void;
    getFileInfo: (file: File) => FileInfo;
    getFilePreview: (file: File) => Promise<string | null>;
    filePreview: Partial<Record<keyof T, string | null>>;
}

declare function useForm<T extends Record<string, any>>(options: UseFormOptions<T>): UseFormReturn<T>;

declare function FormProvider<T extends Record<string, any>>({ children, form, formId, }: {
    children: React$1.ReactNode;
    form: UseFormReturn<T>;
    formId?: string;
}): react_jsx_runtime.JSX.Element;
declare function useFormContext<T extends Record<string, any> = any>(): FormContextValue<T>;
declare function useFormState<T extends Record<string, any> = any>(): UseFormReturn<T>;

export { type FieldState, type FormContextValue, FormProvider, type FormState, type ResetOptions, type SetFocusOptions, type UseFormOptions, type UseFormReturn, useForm, useFormContext, useFormState };