File "form.tsx"
Full Path: /home/markqprx/iniasli.pro/client/ui/forms/form.tsx
File size: 920 bytes
MIME-type: text/html
Charset: utf-8
import {
FieldValues,
FormProvider,
SubmitHandler,
UseFormReturn,
} from 'react-hook-form';
import {FocusEventHandler, ReactNode} from 'react';
interface Props<T extends FieldValues> {
children: ReactNode;
form: UseFormReturn<T>;
className?: string;
onSubmit: SubmitHandler<T>;
onBeforeSubmit?: () => void;
onBlur?: FocusEventHandler<HTMLFormElement>;
id?: string;
}
export function Form<T extends FieldValues>({
children,
onBeforeSubmit,
onSubmit,
form,
className,
id,
onBlur,
}: Props<T>) {
return (
<FormProvider {...form}>
<form
id={id}
onBlur={onBlur}
className={className}
onSubmit={e => {
// prevent parent forms from submitting, if nested
e.stopPropagation();
onBeforeSubmit?.();
form.handleSubmit(onSubmit)(e);
}}
>
{children}
</form>
</FormProvider>
);
}