InputPhoneInternational KIT

Examples API Setup
Source code
See also
InputPhone

Allows to input phone number in international format

InputPhoneInternational is based on @maskito/phone and libphonenumber-js libraries.

libphonenumber is an ultimate phone number formatting and parsing library developed by Google .

This library collects the latest phone number rules from ITU documents, user bug reports, telecom company home pages and government telecommunication authorities. It is always up-to-date (for more than 10 years), and releases are published almost every month. It means that InputPhoneInternational has the robust source of truth!

Choose metadata

#

The first step is to choose the size of metadata .

The complete list of all phone rules is huge, so libphonenumber-js provides different "metadata" sets to provides a way to optimize bundle size by choosing between max , min (default value) and mobile sets.

Read in-depth description about every set .

United States

Choose any countries

#

Parameter countries allows you to choose which countries user can select from the dropdown.

You can even pick all possible countries by built-in utility getCountries from libphonenumber-js .

Use TuiSortCountriesPipe to sort countries according to your current language.

China

Use phone format helpers

#

InputPhoneInternational internally uses Maskito to format phone number.
Don't hesitate to use it too to manually format any phone number.

Phone: +1 212 555-2368

Customize with icons

#

You can put static Icon or even interactive Tooltip at the right side of the textfield.

Türkiye