@nish1896/rhf-mui-components
Version:
A suite of 20+ production-ready react-hook-form components built with material-ui. Fully typed, tree-shakable, and optimized for enterprise-grade forms.
58 lines (57 loc) • 2.48 kB
TypeScript
import { TrueOrFalse } from "../../types/common.js";
import { CountryDetails, CountryISO } from "../../types/countries.js";
import { AutoCompleteTextFieldProps, FormHelperTextProps, FormLabelProps, MuiChipProps } from "../../types/mui.js";
import { countryList } from "./countries.js";
import { ReactNode, SyntheticEvent } from "react";
import * as react_jsx_runtime0 from "react/jsx-runtime";
import { Control, FieldValues, Path, RegisterOptions } from "react-hook-form";
import { AutocompleteChangeDetails, AutocompleteChangeReason, AutocompleteProps } from "@mui/material/Autocomplete";
//#region src/mui/country-select/index.d.ts
type AutoCompleteProps = Omit<AutocompleteProps<CountryDetails, TrueOrFalse, TrueOrFalse, false>, 'freeSolo' | 'fullWidth' | 'renderInput' | 'renderOption' | 'renderTags' | 'options' | 'value' | 'defaultValue' | 'onChange' | 'getOptionKey' | 'getOptionLabel' | 'isOptionEqualToValue' | 'autoHighlight' | 'blurOnSelect' | 'disableCloseOnSelect' | 'ChipProps' | 'loading'>;
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,
onValueChange,
disabled: muiDisabled,
label,
showLabelAboveFormField,
formLabelProps,
required,
helperText,
errorMessage,
hideErrorMessage,
formHelperTextProps,
multiple,
textFieldProps,
displayFlagOnSelect,
slotProps,
ChipProps,
onBlur,
...otherAutoCompleteProps
}: RHFCountrySelectProps<T>) => react_jsx_runtime0.JSX.Element;
//#endregion
export { type CountryDetails, type CountryISO, RHFCountrySelectProps, countryList, RHFCountrySelect as default };