File size: 1,647 Bytes
f0743f4 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | import React, { createContext, PropsWithChildren, ReactElement, useContext, useMemo } from 'react';
import type {
Control,
// FieldErrors,
FieldValues,
UseFormReset,
UseFormRegister,
UseFormGetValues,
UseFormHandleSubmit,
UseFormSetValue,
} from 'react-hook-form';
interface FormContextValue<TFieldValues extends FieldValues> {
register: UseFormRegister<TFieldValues>;
control: Control<TFieldValues>;
// errors: FieldErrors<TFieldValues>;
getValues: UseFormGetValues<TFieldValues>;
setValue: UseFormSetValue<TFieldValues>;
handleSubmit: UseFormHandleSubmit<TFieldValues>;
reset: UseFormReset<TFieldValues>;
}
function createFormContext<TFieldValues extends FieldValues>() {
const context = createContext<FormContextValue<TFieldValues> | undefined>(undefined);
const useCustomFormContext = (): FormContextValue<TFieldValues> => {
const value = useContext(context);
if (!value) {
throw new Error('useCustomFormContext must be used within a CustomFormProvider');
}
return value;
};
const CustomFormProvider = ({
register,
control,
setValue,
// errors,
getValues,
handleSubmit,
reset,
children,
}: PropsWithChildren<FormContextValue<TFieldValues>>): ReactElement => {
const value = useMemo(
() => ({ register, control, getValues, setValue, handleSubmit, reset }),
[register, control, setValue, getValues, handleSubmit, reset],
);
return <context.Provider value={value}>{children}</context.Provider>;
};
return { CustomFormProvider, useCustomFormContext };
}
export type { FormContextValue };
export { createFormContext };
|