react-hook-form-mui
Version:
<div align="center"> <a href="https://react-hook-form-material-ui.vercel.app/" rel="noopener" target="_blank"> <img src="./rhf-mui.png" alt="Material-UI and react-hook-form combined" /> </a> </div>
99 lines (90 loc) • 6.78 kB
TypeScript
import { FieldValues, FieldPath, FieldError, UseControllerProps, Control, PathValue } from 'react-hook-form';
import { TextFieldProps } from '@mui/material';
import { ReactNode, RefAttributes } from 'react';
import { DateValidationError, DatePickerProps, DatePickerSlotProps, PickerChangeHandlerContext, MobileDatePickerProps, MobileDatePickerSlotProps, DateTimeValidationError, PickerValidDate as PickerValidDate$1, DateTimePickerProps, DateTimePickerSlotProps, TimeValidationError, TimePickerProps, TimePickerSlotProps } from '@mui/x-date-pickers';
import { PickerValidDate } from '@mui/x-date-pickers/models';
declare const defaultErrorMessages$2: {
[v in NonNullable<DateValidationError>]: string;
};
type DatePickerElementProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate = PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> = Omit<DatePickerProps<TValue>, 'value' | 'slotProps'> & {
name: TName;
required?: boolean;
isDate?: boolean;
parseError?: (error: FieldError | DateValidationError) => ReactNode;
rules?: UseControllerProps<TFieldValues, TName>['rules'];
control?: Control<TFieldValues>;
inputProps?: TextFieldProps;
helperText?: TextFieldProps['helperText'];
textReadOnly?: boolean;
slotProps?: Omit<DatePickerSlotProps<TValue, TEnableAccessibleFieldDOMStructure>, 'textField'>;
overwriteErrorMessages?: typeof defaultErrorMessages$2;
transform?: {
input?: (value: PathValue<TFieldValues, TName>) => TValue | null;
output?: (value: TValue | null, context: PickerChangeHandlerContext<DateValidationError>) => PathValue<TFieldValues, TName>;
};
};
type DatePickerElementComponent = <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate = PickerValidDate>(props: DatePickerElementProps<TFieldValues, TName, TValue> & RefAttributes<HTMLDivElement>) => JSX.Element;
declare const _default$3: DatePickerElementComponent;
type MobileDatePickerElementProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate = PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> = Omit<MobileDatePickerProps<TValue>, 'value' | 'slotProps'> & {
name: TName;
required?: boolean;
isDate?: boolean;
parseError?: (error: FieldError) => ReactNode;
rules?: UseControllerProps<TFieldValues, TName>['rules'];
control?: Control<TFieldValues>;
inputProps?: TextFieldProps;
helperText?: TextFieldProps['helperText'];
slotProps?: Omit<MobileDatePickerSlotProps<TValue, TEnableAccessibleFieldDOMStructure>, 'textField'>;
overwriteErrorMessages?: typeof defaultErrorMessages$2;
transform?: {
input?: (value: PathValue<TFieldValues, TName>) => TValue | null;
output?: (value: TValue | null, context: PickerChangeHandlerContext<DateValidationError>) => PathValue<TFieldValues, TName>;
};
};
type MobileDatePickerElementComponent = <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate = PickerValidDate>(props: MobileDatePickerElementProps<TFieldValues, TName, TValue> & RefAttributes<HTMLDivElement>) => JSX.Element;
declare const _default$2: MobileDatePickerElementComponent;
declare const defaultErrorMessages$1: {
[v in NonNullable<DateTimeValidationError>]: string;
};
type DateTimePickerElementProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate$1 = PickerValidDate$1, TEnableAccessibleFieldDOMStructure extends boolean = false> = Omit<DateTimePickerProps<TValue>, 'value' | 'slotProps'> & {
name: TName;
required?: boolean;
isDate?: boolean;
parseError?: (error: FieldError) => ReactNode;
rules?: UseControllerProps<TFieldValues, TName>['rules'];
control?: Control<TFieldValues>;
inputProps?: TextFieldProps;
helperText?: TextFieldProps['helperText'];
textReadOnly?: boolean;
slotProps?: Omit<DateTimePickerSlotProps<TValue, TEnableAccessibleFieldDOMStructure>, 'textField'>;
overwriteErrorMessages?: typeof defaultErrorMessages$1;
transform?: {
input?: (value: PathValue<TFieldValues, TName>) => TValue | null;
output?: (value: TValue | null, context: PickerChangeHandlerContext<DateTimeValidationError>) => PathValue<TFieldValues, TName>;
};
};
type DateTimePickerElementComponent = <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate$1 = PickerValidDate$1>(props: DateTimePickerElementProps<TFieldValues, TName, TValue> & RefAttributes<HTMLDivElement>) => JSX.Element;
declare const _default$1: DateTimePickerElementComponent;
declare const defaultErrorMessages: {
[v in NonNullable<TimeValidationError>]: string;
};
type TimePickerElementProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate = PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> = Omit<TimePickerProps<TValue>, 'value' | 'renderInput'> & {
name: TName;
required?: boolean;
isDate?: boolean;
parseError?: (error: FieldError) => ReactNode;
rules?: UseControllerProps<TFieldValues, TName>['rules'];
control?: Control<TFieldValues>;
inputProps?: TextFieldProps;
helperText?: TextFieldProps['helperText'];
textReadOnly?: boolean;
slotProps?: Omit<TimePickerSlotProps<TValue, TEnableAccessibleFieldDOMStructure>, 'textField'>;
overwriteErrorMessages?: typeof defaultErrorMessages;
transform?: {
input?: (value: PathValue<TFieldValues, TName>) => TValue | null;
output?: (value: TValue | null, context: PickerChangeHandlerContext<TimeValidationError>) => PathValue<TFieldValues, TName>;
};
};
type TimePickerElementComponent = <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends PickerValidDate = PickerValidDate>(props: TimePickerElementProps<TFieldValues, TName, TValue> & RefAttributes<HTMLDivElement>) => JSX.Element;
declare const _default: TimePickerElementComponent;
export { _default$3 as DatePickerElement, DatePickerElementProps, _default$1 as DateTimePickerElement, DateTimePickerElementProps, _default$2 as MobileDatePickerElement, MobileDatePickerElementProps, _default as TimePickerElement, TimePickerElementProps };