Phone Input Component

A composite component that allows for phone number input.

The phone input pattern is a progressive enhancement of a textbox that allows users to select the country associated with their phone number.

Terminology

We use the following terminology when discussing this pattern.

• Phone Input : The pattern as a whole, a composite component containing a listbox button and a textbox.
• Listbox Button : The button that opens listbox of countries.
• Textbox : A regular HTML text (type=tel)
• Country code : The telephone dialing code of a country (e.g. +1 for United States of America)
• Phone number : The telephone number excluding the country code.