phoneAuto

A phone number of any country in the world: the mask is chosen by the code the user types. Works like phoneAuto from tinyval-mask, but knows 245 countries.

Signature

function phoneAuto(options?: { defaultCountry?: PhoneCountry; countries?: PhoneCountry[] }): PhoneAutoMask

interface PhoneAutoMask extends Mask {
  country(value: string): CountryInfo | undefined;
}

interface CountryInfo {
  code: PhoneCountry; // 'jp'
  dial: string;       // '81'
  flag: string;       // '🇯🇵'
}

Parameters

Option	Description
defaultCountry	The default country. A number without + is local, the national prefix is dropped: 09012345678 → +81 90-1234-5678. An empty field shows its template and flag
countries	Which countries to detect among. Handy if the service works in a few countries: other numbers won't be valid

Notes

• How countries sharing a code (+1, +7, +44) are told apart — in Countries & formats.
• To type a number of another country when the field shows the default country, just type +.
• The unmasked value is all digits including the country code: 819012345678.
• valid is true only if the number is filled by the mask of a detected country.

Examples

import { mask, unmask, isValid } from 'tinyval-mask';
import { phoneAuto, countryName } from 'tinyval-phone';

const tel = phoneAuto({ defaultCountry: 'jp' });
mask('09012345678', tel);              // '+81 90-1234-5678'
mask('+55 11961234567', tel);          // '+55 (11) 96123-4567'
tel.country('+1 242');                 // { code: 'bs', dial: '1', flag: '🇧🇸' }
countryName(tel.country('+55')!.code, 'en'); // 'Brazil'
isValid('+81 90-1234-5678', tel);      // true

// только несколько стран
const eu = phoneAuto({ defaultCountry: 'de', countries: ['de', 'at', 'ch', 'fr', 'it'] });

See also

• phone, detectCountry, phoneCountries
• loadFlag — a flag icon for country.code
• vMask — a mask in a Vue field