0.0.5 • Published 1 year ago
bi-vue-phone-mask v0.0.5
Vue Phone Mask
Buy me a coffee :coffee:
Installation
yarn
yarn add bi-vue-phone-mask
npm
npm i bi-vue-phone-mask --save
Usage
import PhoneMaskInput from "bi-vue-phone-mask";
<template>
<div>
<h2>Example 4 [custom style]</h2>
<phone-mask-input
v-model="phone"
autoDetectCountry
showFlag
@onValidate="onValidate"
wrapperClass="wrraper-example"
inputClass="input-example"
flagClass="flag-example"
/>
<p>Phone number: <b>{{phone}}</b></p>
<p class="json">{{valid}}</p>
</div>
</template>
Props
Name | Type | Default | Description |
---|---|---|---|
value | String, Number | Value to be render in the input | |
placeholder | String | "" | Placeholder to be shown when no tags |
autoDetectCountry | Boolean | false | Detect visitor country |
defaultCountry | String | one of the values defined here | |
showFlag | Boolean | false | Show country flag |
flagSize | String | normal | Available values: small, normal, big |
disabled | Boolean | false | Disable input field |
wrapperClass | String | { display: flex; flex-direction: row; align-items: center; height: 40px; } | Style class of div wrapper input and flag |
inputClass | String | { height: 20px; } | Style class of input |
flagClass | String | { margin: 0; } | Style class of flag (span tag) |
Events
Property value | Arguments | Description |
---|---|---|
input | String | Fires when the input changes with the argument is the string number |
isValid | Object | Fires when the input changes with the argument is the object includes { number, isValid, country } |
onBlur | Fires on blur event | |
onFocus | Fires on focus event |
Available Flags
Here follows the list of the available flags. They are identified using the ISO 3166-1 standard.
This component currently support alpha-2 of the standard.
Country Name | alpha-2 | |
---|---|---|
Afghanistan | af | |
Aland Islands | ax | |
Albania | al | |
Algeria | dz | |
American Samoa | as | |
Andorra | ad | |
Angola | ao | |
Anguilla | ai | |
Antigua and Barbuda | ag | |
Argentina | ar | |
Armenia | am | |
Aruba | aw | |
Australia | au | |
Austria | at | |
Azerbaijan | az | |
Bahamas | bs | |
Bahrain | bh | |
Bangladesh | bd | |
Barbados | bb | |
Belarus | by | |
Belgium | be | |
Belize | bz | |
Benin | bj | |
Bermuda | bm | |
Bhutan | bt | |
Bolivia | bo | |
Bosnia and Herzegovina | ba | |
Botswana | bw | |
Brazil | br | |
British Virgin Islands | vg | |
Brunei | bn | |
Bulgaria | bg | |
Burkina Faso | bf | |
Burma | mm | |
Burundi | bi | |
Cambodia | kh | |
Cameroon | cm | |
Canada | ca | |
Canary Islands | ic | |
Cape Verde | cv | |
Cayman Islands | ky | |
Central African Republic | cf | |
Chad | td | |
Chile | cl | |
China | cn | |
Colombia | co | |
Comoros | km | |
Cook Islands | ck | |
Costa Rica | cr | |
Croatia | hr | |
Cuba | cu | |
Curacao | cw | |
Cyprus | cy | |
Czech Republic | cz | |
Democratic Republic of the Congo | cd | |
Denmark | dk | |
Djibouti | dj | |
Dominica | dm | |
Dominican Republic | do | |
East Timor | tl | |
Ecuador | ec | |
Egypt | eg | |
El Salvador | sv | |
Equatorial Guinea | gq | |
Eritrea | er | |
Estonia | ee | |
Ethiopia | et | |
European Union | eu | |
Falkland Islands (Malvinas) | fk | |
Faroe Islands | fo | |
Fiji | fj | |
Finland | fi | |
France | fr | |
French Polynesia | pf | |
French Southern Territories | tf | |
Gabon | ga | |
Gambia | gm | |
Georgia | ge | |
Germany | de | |
Ghana | gh | |
Gibraltar | gi | |
Granada | gd | |
Greece | gr | |
Greenland | gl | |
Guam | gu | |
Guatemala | gt | |
Guernsey | gg | |
Guinea | gn | |
Guinea-Bissau | gw | |
Guyana | gy | |
Haiti | ht | |
Honduras | hn | |
Hong Kong | hk | |
Hungary | hu | |
Iceland | is | |
India | in | |
Indonesia | id | |
Iran | ir | |
Iraq | iq | |
Ireland | ie | |
Isle of Man | im | |
Israel | il | |
Italy | it | |
Ivory Coast | ci | |
Jamaica | jm | |
Japan | jp | |
Jersey | je | |
Jordan | jo | |
Kazakhstan | kz | |
Kenya | ke | |
Kiribati | ki | |
Kuwait | kw | |
Kyrgyzstan | kg | |
Laos | la | |
Latvia | lv | |
Lebanon | lb | |
Lesotho | ls | |
Liberia | lr | |
Libya | ly | |
Liechtenstein | li | |
Lithuania | lt | |
Luxembourg | lu | |
Macao | mo | mac |
Macedonia | mk | |
Madagascar | mg | |
Malawi | mw | |
Malaysia | my | |
Maldives | mv | |
Mali | ml | mli |
Malta | mt | |
Marshall, Islands | mh | |
Martinique | mq | |
Mauricio | mu | |
Mauritania | mr | |
Mayotte | yt | |
Mexico | mx | |
Micronesia | fm | |
Moldova | md | |
Monaco | mc | |
Mongolia | mn | |
Montenegro | me | |
Montserrat | ms | |
Morocco | ma | mar |
Mozambique | mz | moz |
Namibia | na | nam |
Nauru | nr | nru |
Nepal | np | npl |
Netherlands Antilles | an | |
New Caledonia | nc | |
New Zealand | nz | |
Nicaragua | ni | |
Niger | ne | |
Nigeria | ng | |
Niue | nu | |
Norfolk, Island | nf | |
North Korea | kp | |
Northern Mariana Islands | mp | |
Norway | no | |
Oman | om | |
Pakistan | pk | |
Palau | pw | |
Palestine | ps | |
Panama | pa | |
Papua New Guinea | pg | |
Paraguay | py | pry |
Peru | pe | per |
Philippines | ph | |
Pitcairn | pn | |
Poland | pl | |
Portugal | pt | |
Puerto Rico | pr | |
Qatar | qa | |
Republic of the Congo | cg | |
Romania | ro | |
Russia | ru | |
Rwanda | rw | |
Saint Barthelemy | bl | |
Saint Helena | sh | |
Saint Kitts and Nevis | kn | |
Saint Lucia | lc | |
Saint Martin | mf | |
Saint Vincent and the Grenadines | vc | |
Samoa | ws | |
San Marino | sm | |
Sao Tome and Principe | st | |
Saudi Arabia | sa | |
Senegal | sn | |
Serbia | rs | |
Seychelles | sc | |
Sierra Leone | sl | |
Singapore | sg | |
Slovakia | sk | |
Slovenia | si | |
Solomon Islands | sb | |
Somalia | so | |
South Africa | za | |
South Georgia and the South Sandwich Islands | gs | |
South Korea | kr | |
South Sudan | ss | |
Spain | es | |
Sri Lanka | lk | |
Sudan | sd | |
Suriname | sr | |
Swaziland | sz | |
Sweden | se | |
Switzerland | ch | |
Syria | sy | |
Taiwan | tw | |
Tajikistan | tj | |
Tanzania | tz | |
Thailand | th | |
The Netherlands | nl | |
Togo | tg | |
Tokelau | tk | |
Tonga | to | |
Trinidad and Tobago | tt | |
Tunisia | tn | |
Turkey | tr | |
Turkmenistan | tm | |
Turks and Caicos Islands | tc | |
Tuvalu | tv | |
Uganda | ug | |
Ukraine | ua | |
United Arab Emirates | ae | |
United Kingdom | gb | |
United States | us | |
Uruguay | uy | |
Uzbekistan | uz | |
Vanuatu | vu | |
Vatican City | va | |
Venezuela | ve | |
Vietnam | vn | |
Virgin Islands of the United States | vi | |
Wallis and Futuna | wf | |
Western Sahara | eh | |
Yemen | ye | |
Zambia | zm | |
Zimbabwe | zw |
Buy me a coffee :coffee: