useeform/dist/index.d.ts

useeform is a custom React hook designed to simplify form handling in React applications. It provides an easy way to manage form state, handle form submissions, and validate form data. This hook is built to be flexible and can be integrated into any form

import * as React$1 from 'react';
import React__default, { HTMLInputTypeAttribute, ButtonHTMLAttributes, ReactNode } from 'react';
import { z, ZodError } from 'zod';

type className = React__default.ComponentProps<"div">["className"];

type InputSchema = {
    formElement: "input";
    type?: HTMLInputTypeAttribute;
    className?: string;
    value?: string;
    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
    disabled?: boolean;
    readOnly?: boolean;
    placeholder?: string;
    required?: boolean;
    pattern?: string;
    min?: number;
    max?: number;
    step?: string;
    autoFocus?: boolean;
    multiple?: boolean;
    checked?: boolean;
    defaultChecked?: boolean;
    maxLength?: number;
    minLength?: number;
    name: string;
    zodValidation?: z.ZodType;
};

type ButtonSchema = {
    formElement: "button";
    type?: ButtonHTMLAttributes<HTMLButtonElement>["type"];
    className?: string;
    name: string;
    value?: string;
    autoFocus?: boolean;
    disabled?: boolean;
    loading?: boolean;
    loadingComponent?: string | ReactNode;
};

type LabelSchema = {
    formElement: "label";
    name: string;
    className?: string;
    htmlFor?: string;
    children: InputSchema;
    value?: string | JSX.Element;
};

type FormSchema = {
    onSubmit?: (event: React__default.FormEvent<HTMLFormElement>, formValues: FormValues, errors: ErrorSchema[], zodErrors: ZodError[]) => void;
    preventDefault?: boolean;
    className?: className;
    id?: string;
    name?: string;
    noValidate?: boolean;
    autoComplete?: "on" | "off";
    style?: React__default.CSSProperties;
    ref?: React__default.Ref<HTMLFormElement>;
    children?: Array<InputSchema | ButtonSchema | LabelSchema>;
};
type FormValues = {
    [x: string]: string | number | undefined;
};
type ErrorSchema = {
    error: string;
    name: string;
};

declare function useForm(initialState: FormSchema): {
    formState: [FormValues, React$1.Dispatch<React$1.SetStateAction<FormValues>>];
    errors: ErrorSchema[];
    addError: (error: string, name: string) => void;
    removeError: (index: number) => void;
    clearErrors: () => void;
    formUI: React$1.ReactElement<HTMLFormElement, string | React$1.JSXElementConstructor<any>>;
    validateFormZod: () => ZodError[];
    clearForm: () => void;
};

declare function Input({ props, addError, setFormValues, formValues, }: {
    props: InputSchema;
    addError: (error: string, name: string) => void;
    setFormValues: React__default.Dispatch<React__default.SetStateAction<FormValues>>;
    formValues: FormValues;
}): JSX.Element;

declare function TextInput$1({ props: { type, className, autoFocus, disabled, maxLength, minLength, multiple, pattern, placeholder, readOnly, required, value, min, max, step, checked, onChange, name, }, addError, setFormValues, formValues, }: {
    props: InputSchema;
    addError: (error: string, name: string) => void;
    setFormValues: React__default.Dispatch<React__default.SetStateAction<FormValues>>;
    formValues: FormValues;
}): React__default.JSX.Element;

declare function TextInput({ props: { type, className, autoFocus, disabled, maxLength, minLength, multiple, pattern, placeholder, readOnly, required, value, min, max, step, checked, defaultChecked, onChange, name, }, addError, setFormValues, formValues, }: {
    props: InputSchema;
    addError: (error: string, name: string) => void;
    setFormValues: React__default.Dispatch<React__default.SetStateAction<FormValues>>;
    formValues: FormValues;
}): React__default.JSX.Element;

declare function Label({ props: { children, formElement, name, className, htmlFor, value }, addError, setFormValues, formValues, }: {
    props: LabelSchema;
    addError: (error: string, name: string) => void;
    setFormValues: React__default.Dispatch<React__default.SetStateAction<FormValues>>;
    formValues: FormValues;
}): React__default.JSX.Element;

declare function Button({ props: { type, className, name, value, autoFocus, disabled, formElement, loadingComponent, }, addError, clearForm, loading, }: {
    props: ButtonSchema;
    addError: (error: string, name: string) => void;
    clearForm: () => void;
    loading?: boolean;
}): React__default.JSX.Element;

declare function Form({ form: { children, className, id, noValidate, autoComplete, name, ref, style }, addError, setFormValues, submiForm, clearForm, formValues, loading, setLoading, }: {
    form: FormSchema;
    setForm: React__default.Dispatch<React__default.SetStateAction<FormSchema>>;
    addError: (error: string, name: string) => void;
    setFormValues: React__default.Dispatch<React__default.SetStateAction<FormValues>>;
    clearForm: () => void;
    submiForm: (event: React__default.FormEvent<HTMLFormElement>) => void;
    formValues: FormValues;
    loading: boolean;
    setLoading: React__default.Dispatch<React__default.SetStateAction<boolean>>;
}): React__default.ReactElement<HTMLFormElement>;

export { Button, type ButtonSchema, type ErrorSchema, Form, type FormSchema, type FormValues, Input, type InputSchema, Label, type LabelSchema, TextInput$1 as NumberInput, TextInput, useForm as default };