A phone number input with a country picker and formatting, submitted in E.164 format.
The countries the user can choose from. Defaults to the built-in list, exported as |
defaultCountry | string | US | The code of the country selected at first, such as |
defaultValue | string | – | The number at first, when it isn't controlled, in E.164 format such as |
disabled | boolean | – | Whether the component should ignore user interaction. |
labels | Partial<InputPhoneLabels> | – | Replaces the built-in text for this instance. See |
name | string | – | Submits the E.164 value (e.g. "+15550000000") with a form under this name. |
onChange | ((e164: string, country: CountryData, nationalNumber: string) => void) | – | Called when the number or country changes, with the full number in E.164 format, the selected country, and the digits typed without the dialling code. |
readOnly | boolean | – | Whether the value can be seen but not changed. |
required | boolean | – | Whether a number is required to submit the form. Applies to the hidden input written under |
size | "lg"|"sm"|"default" | default | The size of the component. |
value | string | – | The number in E.164 format, such as |
variant | "default"|"ghost"|"filled" | default | The visual style of the component. |
Accepts render, plus every native attribute of the element it renders.
Accepts render, plus every native <span> attribute.
Accepts className, style and render, plus every native attribute of the element it renders.
