UNPKG

@nish1896/rhf-mui-components

Version:

A suite of 20+ reusable Material UI components for React Hook Form to minimize your time and effort in creating and styling forms

31 lines (30 loc) 2.28 kB
import { type ReactNode, type SyntheticEvent } from 'react'; import { type FieldValues, type Path, type Control, type RegisterOptions } from 'react-hook-form'; import { type AutocompleteProps, type AutocompleteChangeDetails, type AutocompleteChangeReason } from '@mui/material/Autocomplete'; import type { TrueOrFalse, CountryDetails, CountryISO, FormLabelProps, FormHelperTextProps, AutoCompleteTextFieldProps, MuiChipProps } from '../../types'; import { countryList } from './countries'; type AutoCompleteProps = Omit<AutocompleteProps<CountryDetails, TrueOrFalse, TrueOrFalse, false>, 'freeSolo' | 'fullWidth' | 'renderInput' | 'renderOption' | 'renderTags' | 'options' | 'value' | 'defaultValue' | 'onChange' | 'getOptionKey' | 'getOptionLabel' | 'isOptionEqualToValue' | 'autoHighlight' | 'blurOnSelect' | 'disableCloseOnSelect' | 'ChipProps'>; export type RHFCountrySelectProps<T extends FieldValues> = { fieldName: Path<T>; control: Control<T>; registerOptions?: RegisterOptions<T, Path<T>>; countries?: CountryDetails[]; preferredCountries?: CountryISO[]; valueKey?: keyof Omit<CountryDetails, 'emoji'>; onValueChange?: (newValue: CountryDetails | CountryDetails[] | null, event: SyntheticEvent, reason: AutocompleteChangeReason, details?: AutocompleteChangeDetails<CountryDetails>) => void; label?: ReactNode; showLabelAboveFormField?: boolean; formLabelProps?: FormLabelProps; required?: boolean; helperText?: ReactNode; errorMessage?: ReactNode; hideErrorMessage?: boolean; formHelperTextProps?: FormHelperTextProps; textFieldProps?: AutoCompleteTextFieldProps; displayFlagOnSelect?: boolean; ChipProps?: MuiChipProps; } & AutoCompleteProps; declare const RHFCountrySelect: <T extends FieldValues>({ fieldName, control, registerOptions, countries, preferredCountries, valueKey, disabled, onValueChange, label, showLabelAboveFormField, formLabelProps, required, helperText, errorMessage, hideErrorMessage, formHelperTextProps, multiple, textFieldProps, displayFlagOnSelect, slotProps, ChipProps, ...otherAutoCompleteProps }: RHFCountrySelectProps<T>) => import("react/jsx-runtime").JSX.Element; export type { CountryISO, CountryDetails }; export { countryList }; export default RHFCountrySelect;