Home > mui-country-code-selector > CountryCodeSelectorCompositeReact
This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
A complete phone number input React component with a country code selector autocomplete field. Based on MUI’s Autocomplete
(https://mui.com/material-ui/react-autocomplete/) and TextField
(https://mui.com/material-ui/react-text-field/) components. These subcomponents are combined using a common state that is implemented differently in specific variants of the component.
This component variant uses React’s state management utilities to create the common state between the subcomponents.
Signature:
export default function CountryCodeSelectorCompositeReact({ id, name, value, onChange, countryCodeLabel, phoneNumberLabel, errorMessageDelay, errorMessageDisplay, onError, inputRef, defaultValue, layout, formGroupProps, gridContainerProps, gridItemProps, gridSelectorProps, gridInputProps, gridErrorProps, grid2ContainerProps, grid2ItemProps, grid2SelectorProps, grid2InputProps, grid2ErrorProps, stackProps, selectorSize, inputSize, errorSize, filterOptions, shrink, variant, selectorProps, inputProps, errorProps, selectorRenderCountRef, inputRenderCountRef, }: CCSelectorCompositeProps): import("react/jsx-runtime").JSX.Element;
Parameter |
Type |
Description |
---|---|---|
{ id, name, value, onChange, countryCodeLabel, phoneNumberLabel, errorMessageDelay, errorMessageDisplay, onError, inputRef, defaultValue, layout, formGroupProps, gridContainerProps, gridItemProps, gridSelectorProps, gridInputProps, gridErrorProps, grid2ContainerProps, grid2ItemProps, grid2SelectorProps, grid2InputProps, grid2ErrorProps, stackProps, selectorSize, inputSize, errorSize, filterOptions, shrink, variant, selectorProps, inputProps, errorProps, selectorRenderCountRef, inputRenderCountRef, } |
import(“react/jsx-runtime”).JSX.Element
A complete phone number input React component with a country code selector autocomplete field.