International Telephone Input

🎉 NEWS: we now have our own React component! Play with it on Storybook! 🎉

A JavaScript plugin for entering and validating international telephone numbers. It takes a regular input field, adds a searchable country dropdown, auto-detects the user's country, displays a relevant placeholder number, formats the number as you type, and provides comprehensive validation methods.

Demo

Features

  • Automatically select the user's current country using an IP lookup
  • Automatically set the input placeholder to an example number for the selected country
  • Navigate the country dropdown by typing a country's name, or using up/down keys
  • Automatically format the number as the user types
  • Optionally only allow numeric characters and cap the number at the maximum valid length
  • The user types their national number and the plugin gives you the full standardized international number
  • Number validation, including specific error types
  • High-resolution flag images
  • Lots of initialisation options for customisation, as well as public methods/events for interaction
  • Accessibility provided via ARIA tags
  • Typescript type definitions provided
  • Easily customise styles by overriding the provided CSS variables
  • React component included

Docs

For full documentation, including Getting Started, Initialisation Options, Instance Methods, Custom Events, and more, please see the readme.