Phone
A phone number input field with an optional country code selector.
The Phone field renders a phone number input with an integrated country code dropdown. When the country selector is shown, users pick their country (which sets the dial prefix) and then enter their local number. The field supports a curated list of international dial codes.
For the shared properties available on all fields (label, help, note, key, width, visual styling, required), see the Form Fields Overview.
Configuration
| Property | Type | Default | Description |
|---|---|---|---|
| placeholder | string | "+1 (555) 000-0000" | Ghost text shown inside the input when empty |
| countryCode | string | "+1" | Default dial code prefix (e.g. "+1", "+44", "+91") |
| showCountryCode | boolean | true | Whether to show the country code selector dropdown |
Validation
The Phone field extends InputFieldBase, so the required toggle is available. The editor exposes only the placeholder setting. Additional validations (pattern, minLength, maxLength) are available on the type definition but not surfaced in the editor UI.
Example Usage
A contact form with a UK default:
{
"type": "phone",
"label": "Phone Number",
"required": true,
"placeholder": "+44 7911 123456",
"countryCode": "+44",
"showCountryCode": true
}