react-phone-flag/dist/index.js

A React component for selecting country codes with flags for phone numbers

"use strict";var a=require("react/jsx-runtime"),e=require("react"),d=function(){return d=Object.assign||function(a){for(var e,d=1,o=arguments.length;d<o;d++)for(var l in e=arguments[d])Object.prototype.hasOwnProperty.call(e,l)&&(a[l]=e[l]);return a},d.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var o=[{name:"United States",code:"US",dialCode:"+1",flag:"🇺🇸"},{name:"United Kingdom",code:"GB",dialCode:"+44",flag:"🇬🇧"},{name:"Canada",code:"CA",dialCode:"+1",flag:"🇨🇦"},{name:"Australia",code:"AU",dialCode:"+61",flag:"🇦🇺"},{name:"Germany",code:"DE",dialCode:"+49",flag:"🇩🇪"},{name:"France",code:"FR",dialCode:"+33",flag:"🇫🇷"},{name:"Spain",code:"ES",dialCode:"+34",flag:"🇪🇸"},{name:"Italy",code:"IT",dialCode:"+39",flag:"🇮🇹"},{name:"Netherlands",code:"NL",dialCode:"+31",flag:"🇳🇱"},{name:"Belgium",code:"BE",dialCode:"+32",flag:"🇧🇪"},{name:"Switzerland",code:"CH",dialCode:"+41",flag:"🇨🇭"},{name:"Austria",code:"AT",dialCode:"+43",flag:"🇦🇹"},{name:"Sweden",code:"SE",dialCode:"+46",flag:"🇸🇪"},{name:"Norway",code:"NO",dialCode:"+47",flag:"🇳🇴"},{name:"Denmark",code:"DK",dialCode:"+45",flag:"🇩🇰"},{name:"Finland",code:"FI",dialCode:"+358",flag:"🇫🇮"},{name:"Poland",code:"PL",dialCode:"+48",flag:"🇵🇱"},{name:"Czech Republic",code:"CZ",dialCode:"+420",flag:"🇨🇿"},{name:"Hungary",code:"HU",dialCode:"+36",flag:"🇭🇺"},{name:"Slovakia",code:"SK",dialCode:"+421",flag:"🇸🇰"},{name:"Slovenia",code:"SI",dialCode:"+386",flag:"🇸🇮"},{name:"Croatia",code:"HR",dialCode:"+385",flag:"🇭🇷"},{name:"Bulgaria",code:"BG",dialCode:"+359",flag:"🇧🇬"},{name:"Romania",code:"RO",dialCode:"+40",flag:"🇷🇴"},{name:"Greece",code:"GR",dialCode:"+30",flag:"🇬🇷"},{name:"Portugal",code:"PT",dialCode:"+351",flag:"🇵🇹"},{name:"Ireland",code:"IE",dialCode:"+353",flag:"🇮🇪"},{name:"Luxembourg",code:"LU",dialCode:"+352",flag:"🇱🇺"},{name:"Iceland",code:"IS",dialCode:"+354",flag:"🇮🇸"},{name:"Malta",code:"MT",dialCode:"+356",flag:"🇲🇹"},{name:"Cyprus",code:"CY",dialCode:"+357",flag:"🇨🇾"},{name:"Estonia",code:"EE",dialCode:"+372",flag:"🇪🇪"},{name:"Latvia",code:"LV",dialCode:"+371",flag:"🇱🇻"},{name:"Lithuania",code:"LT",dialCode:"+370",flag:"🇱🇹"},{name:"Japan",code:"JP",dialCode:"+81",flag:"🇯🇵"},{name:"South Korea",code:"KR",dialCode:"+82",flag:"🇰🇷"},{name:"China",code:"CN",dialCode:"+86",flag:"🇨🇳"},{name:"India",code:"IN",dialCode:"+91",flag:"🇮🇳"},{name:"Brazil",code:"BR",dialCode:"+55",flag:"🇧🇷"},{name:"Mexico",code:"MX",dialCode:"+52",flag:"🇲🇽"},{name:"Argentina",code:"AR",dialCode:"+54",flag:"🇦🇷"},{name:"Chile",code:"CL",dialCode:"+56",flag:"🇨🇱"},{name:"Colombia",code:"CO",dialCode:"+57",flag:"🇨🇴"},{name:"Peru",code:"PE",dialCode:"+51",flag:"🇵🇪"},{name:"Venezuela",code:"VE",dialCode:"+58",flag:"🇻🇪"},{name:"Uruguay",code:"UY",dialCode:"+598",flag:"🇺🇾"},{name:"Paraguay",code:"PY",dialCode:"+595",flag:"🇵🇾"},{name:"Ecuador",code:"EC",dialCode:"+593",flag:"🇪🇨"},{name:"Bolivia",code:"BO",dialCode:"+591",flag:"🇧🇴"},{name:"Guyana",code:"GY",dialCode:"+592",flag:"🇬🇾"},{name:"Suriname",code:"SR",dialCode:"+597",flag:"🇸🇷"},{name:"French Guiana",code:"GF",dialCode:"+594",flag:"🇬🇫"},{name:"South Africa",code:"ZA",dialCode:"+27",flag:"🇿🇦"},{name:"Egypt",code:"EG",dialCode:"+20",flag:"🇪🇬"},{name:"Nigeria",code:"NG",dialCode:"+234",flag:"🇳🇬"},{name:"Kenya",code:"KE",dialCode:"+254",flag:"🇰🇪"},{name:"Ghana",code:"GH",dialCode:"+233",flag:"🇬🇭"},{name:"Ethiopia",code:"ET",dialCode:"+251",flag:"🇪🇹"},{name:"Tanzania",code:"TZ",dialCode:"+255",flag:"🇹🇿"},{name:"Uganda",code:"UG",dialCode:"+256",flag:"🇺🇬"},{name:"Morocco",code:"MA",dialCode:"+212",flag:"🇲🇦"},{name:"Algeria",code:"DZ",dialCode:"+213",flag:"🇩🇿"},{name:"Tunisia",code:"TN",dialCode:"+216",flag:"🇹🇳"},{name:"Libya",code:"LY",dialCode:"+218",flag:"🇱🇾"},{name:"Sudan",code:"SD",dialCode:"+249",flag:"🇸🇩"},{name:"Somalia",code:"SO",dialCode:"+252",flag:"🇸🇴"},{name:"Djibouti",code:"DJ",dialCode:"+253",flag:"🇩🇯"},{name:"Comoros",code:"KM",dialCode:"+269",flag:"🇰🇲"},{name:"Madagascar",code:"MG",dialCode:"+261",flag:"🇲🇬"},{name:"Mauritius",code:"MU",dialCode:"+230",flag:"🇲🇺"},{name:"Seychelles",code:"SC",dialCode:"+248",flag:"🇸🇨"},{name:"Reunion",code:"RE",dialCode:"+262",flag:"🇷🇪"},{name:"Mayotte",code:"YT",dialCode:"+262",flag:"🇾🇹"},{name:"Israel",code:"IL",dialCode:"+972",flag:"🇮🇱"},{name:"Saudi Arabia",code:"SA",dialCode:"+966",flag:"🇸🇦"},{name:"United Arab Emirates",code:"AE",dialCode:"+971",flag:"🇦🇪"},{name:"Qatar",code:"QA",dialCode:"+974",flag:"🇶🇦"},{name:"Kuwait",code:"KW",dialCode:"+965",flag:"🇰🇼"},{name:"Bahrain",code:"BH",dialCode:"+973",flag:"🇧🇭"},{name:"Oman",code:"OM",dialCode:"+968",flag:"🇴🇲"},{name:"Jordan",code:"JO",dialCode:"+962",flag:"🇯🇴"},{name:"Lebanon",code:"LB",dialCode:"+961",flag:"🇱🇧"},{name:"Syria",code:"SY",dialCode:"+963",flag:"🇸🇾"},{name:"Iraq",code:"IQ",dialCode:"+964",flag:"🇮🇶"},{name:"Iran",code:"IR",dialCode:"+98",flag:"🇮🇷"},{name:"Afghanistan",code:"AF",dialCode:"+93",flag:"🇦🇫"},{name:"Pakistan",code:"PK",dialCode:"+92",flag:"🇵🇰"},{name:"Bangladesh",code:"BD",dialCode:"+880",flag:"🇧🇩"},{name:"Sri Lanka",code:"LK",dialCode:"+94",flag:"🇱🇰"},{name:"Nepal",code:"NP",dialCode:"+977",flag:"🇳🇵"},{name:"Bhutan",code:"BT",dialCode:"+975",flag:"🇧🇹"},{name:"Maldives",code:"MV",dialCode:"+960",flag:"🇲🇻"},{name:"Myanmar",code:"MM",dialCode:"+95",flag:"🇲🇲"},{name:"Thailand",code:"TH",dialCode:"+66",flag:"🇹🇭"},{name:"Laos",code:"LA",dialCode:"+856",flag:"🇱🇦"},{name:"Cambodia",code:"KH",dialCode:"+855",flag:"🇰🇭"},{name:"Vietnam",code:"VN",dialCode:"+84",flag:"🇻🇳"},{name:"Malaysia",code:"MY",dialCode:"+60",flag:"🇲🇾"},{name:"Singapore",code:"SG",dialCode:"+65",flag:"🇸🇬"},{name:"Indonesia",code:"ID",dialCode:"+62",flag:"🇮🇩"},{name:"Philippines",code:"PH",dialCode:"+63",flag:"🇵🇭"},{name:"Brunei",code:"BN",dialCode:"+673",flag:"🇧🇳"},{name:"East Timor",code:"TL",dialCode:"+670",flag:"🇹🇱"},{name:"Papua New Guinea",code:"PG",dialCode:"+675",flag:"🇵🇬"},{name:"Fiji",code:"FJ",dialCode:"+679",flag:"🇫🇯"},{name:"New Zealand",code:"NZ",dialCode:"+64",flag:"🇳🇿"},{name:"Samoa",code:"WS",dialCode:"+685",flag:"🇼🇸"},{name:"Tonga",code:"TO",dialCode:"+676",flag:"🇹🇴"},{name:"Vanuatu",code:"VU",dialCode:"+678",flag:"🇻🇺"},{name:"Solomon Islands",code:"SB",dialCode:"+677",flag:"🇸🇧"},{name:"Kiribati",code:"KI",dialCode:"+686",flag:"🇰🇮"},{name:"Tuvalu",code:"TV",dialCode:"+688",flag:"🇹🇻"},{name:"Nauru",code:"NR",dialCode:"+674",flag:"🇳🇷"},{name:"Palau",code:"PW",dialCode:"+680",flag:"🇵🇼"},{name:"Marshall Islands",code:"MH",dialCode:"+692",flag:"🇲🇭"},{name:"Micronesia",code:"FM",dialCode:"+691",flag:"🇫🇲"},{name:"Guam",code:"GU",dialCode:"+1",flag:"🇬🇺"},{name:"Northern Mariana Islands",code:"MP",dialCode:"+1",flag:"🇲🇵"},{name:"American Samoa",code:"AS",dialCode:"+1",flag:"🇦🇸"},{name:"Cook Islands",code:"CK",dialCode:"+682",flag:"🇨🇰"},{name:"Niue",code:"NU",dialCode:"+683",flag:"🇳🇺"},{name:"Tokelau",code:"TK",dialCode:"+690",flag:"🇹🇰"},{name:"Wallis and Futuna",code:"WF",dialCode:"+681",flag:"🇼🇫"},{name:"French Polynesia",code:"PF",dialCode:"+689",flag:"🇵🇫"},{name:"New Caledonia",code:"NC",dialCode:"+687",flag:"🇳🇨"},{name:"Pitcairn",code:"PN",dialCode:"+64",flag:"🇵🇳"},{name:"Russia",code:"RU",dialCode:"+7",flag:"🇷🇺"},{name:"Ukraine",code:"UA",dialCode:"+380",flag:"🇺🇦"},{name:"Belarus",code:"BY",dialCode:"+375",flag:"🇧🇾"},{name:"Moldova",code:"MD",dialCode:"+373",flag:"🇲🇩"},{name:"Georgia",code:"GE",dialCode:"+995",flag:"🇬🇪"},{name:"Armenia",code:"AM",dialCode:"+374",flag:"🇦🇲"},{name:"Azerbaijan",code:"AZ",dialCode:"+994",flag:"🇦🇿"},{name:"Kazakhstan",code:"KZ",dialCode:"+7",flag:"🇰🇿"},{name:"Uzbekistan",code:"UZ",dialCode:"+998",flag:"🇺🇿"},{name:"Turkmenistan",code:"TM",dialCode:"+993",flag:"🇹🇲"},{name:"Tajikistan",code:"TJ",dialCode:"+992",flag:"🇹🇯"},{name:"Kyrgyzstan",code:"KG",dialCode:"+996",flag:"🇰🇬"},{name:"Mongolia",code:"MN",dialCode:"+976",flag:"🇲🇳"},{name:"North Korea",code:"KP",dialCode:"+850",flag:"🇰🇵"},{name:"Taiwan",code:"TW",dialCode:"+886",flag:"🇹🇼"},{name:"Hong Kong",code:"HK",dialCode:"+852",flag:"🇭🇰"},{name:"Macau",code:"MO",dialCode:"+853",flag:"🇲🇴"},{name:"Turkey",code:"TR",dialCode:"+90",flag:"🇹🇷"}],l={US:"https://flagcdn.com/w20/us.png",GB:"https://flagcdn.com/w20/gb.png",CA:"https://flagcdn.com/w20/ca.png",AU:"https://flagcdn.com/w20/au.png",DE:"https://flagcdn.com/w20/de.png",FR:"https://flagcdn.com/w20/fr.png"},n=function(a){return l[a]||"https://flagcdn.com/w20/".concat(a.toLowerCase(),".png")},i=function(e){var d=e.countryCode,o=e.emoji,l=e.useImages,i=void 0!==l&&l,c=e.size,r=void 0===c?16:c,t=e.className,s=void 0===t?"":t;return i?a.jsx("img",{src:n(d),alt:"Flag of ".concat(d),style:{width:r,height:.75*r,objectFit:"cover",borderRadius:"2px"},className:s,onError:function(a){var e,d=a.target;d.style.display="none";var l=document.createElement("span");l.textContent=o||"🏳️",l.style.fontSize="".concat(r,"px"),l.className=s,null===(e=d.parentNode)||void 0===e||e.insertBefore(l,d)}}):a.jsx("span",{className:s,style:{fontSize:"".concat(r,"px"),lineHeight:1},children:o||"🏳️"})},c=function(l){var n=l.value,c=l.onChange,r=l.className,t=void 0===r?"":r,s=l.disabled,g=void 0!==s&&s,m=l.searchable,f=void 0===m||m,C=l.showFlag,u=void 0===C||C,p=l.showDialCode,h=void 0===p||p,v=l.useFlagImages,S=void 0!==v&&v,N=l.flagSize,y=void 0===N?16:N,x=l.defaultCountry,w=void 0===x?"US":x,E=l.preferredCountries,M=void 0===E?[]:E,j=l.excludeCountries,I=void 0===j?[]:j,A=l.dropdownProps,P=void 0===A?{}:A,T=e.useState(!1),b=T[0],F=T[1],L=e.useState(""),U=L[0],K=L[1],G=e.useState(n),B=G[0],R=G[1],z=e.useRef(null);e.useEffect(function(){if(!B){var a=o.find(function(a){return a.code===w});a&&R(a)}},[w,B]),e.useEffect(function(){n&&R(n)},[n]),e.useEffect(function(){var a=function(a){z.current&&!z.current.contains(a.target)&&F(!1)};return document.addEventListener("mousedown",a),function(){return document.removeEventListener("mousedown",a)}},[]);var D=function(a,e,d){if(d||2===arguments.length)for(var o,l=0,n=e.length;l<n;l++)!o&&l in e||(o||(o=Array.prototype.slice.call(e,0,l)),o[l]=e[l]);return a.concat(o||Array.prototype.slice.call(e))}([],o.filter(function(a){var e=!U||a.name.toLowerCase().includes(U.toLowerCase())||a.dialCode.includes(U)||a.code.toLowerCase().includes(U.toLowerCase()),d=!I.includes(a.code);return e&&d}),!0).sort(function(a,e){var d=M.includes(a.code),o=M.includes(e.code);return d&&!o?-1:!d&&o?1:a.name.localeCompare(e.name)});return a.jsxs("div",{className:"country-code-selector ".concat(t),ref:z,children:[a.jsxs("div",{className:"selector-trigger ".concat(g?"disabled":""," ").concat(b?"open":""),onClick:function(){g||(F(!b),b||K(""))},children:[B&&a.jsxs("div",{className:"selected-country",children:[u&&a.jsx(i,{countryCode:B.code,emoji:B.flag,useImages:S,size:y,className:"flag"}),h&&a.jsx("span",{className:"dial-code",children:B.dialCode})]}),a.jsx("span",{className:"arrow",children:"▼"})]}),b&&a.jsxs("div",d({className:"dropdown"},P,{children:[f&&a.jsx("div",{className:"search-container",children:a.jsx("input",{type:"text",placeholder:"Search countries...",value:U,onChange:function(a){return K(a.target.value)},className:"search-input",autoFocus:!0})}),a.jsx("div",{className:"countries-list",children:D.length>0?D.map(function(e){return a.jsxs("div",{className:"country-option ".concat((null==B?void 0:B.code)===e.code?"selected":""),onClick:function(){return function(a){R(a),F(!1),K(""),null==c||c(a)}(e)},children:[u&&a.jsx(i,{countryCode:e.code,emoji:e.flag,useImages:S,size:y,className:"flag"}),a.jsx("span",{className:"country-name",children:e.name}),h&&a.jsx("span",{className:"dial-code",children:e.dialCode})]},e.code)}):a.jsx("div",{className:"no-results",children:"No countries found"})})]}))]})};exports.CountryCodeSelector=c,exports.Flag=i,exports.PhoneFlagSelector=function(l){var n=l.value,i=void 0===n?"":n,r=l.onChange,t=l.placeholder,s=void 0===t?"Enter phone number":t,g=l.className,m=void 0===g?"":g,f=l.disabled,C=void 0!==f&&f,u=l.searchable,p=void 0===u||u,h=l.showFlag,v=void 0===h||h,S=l.showDialCode,N=void 0===S||S,y=l.useFlagImages,x=void 0!==y&&y,w=l.flagSize,E=void 0===w?16:w,M=l.defaultCountry,j=void 0===M?"US":M,I=l.preferredCountries,A=void 0===I?[]:I,P=l.excludeCountries,T=void 0===P?[]:P,b=l.inputProps,F=void 0===b?{}:b,L=l.dropdownProps,U=void 0===L?{}:L,K=e.useState(i),G=K[0],B=K[1],R=e.useState(),z=R[0],D=R[1];e.useEffect(function(){if(!z){var a=o.find(function(a){return a.code===j});a&&D(a)}},[j,z]),e.useEffect(function(){B(i)},[i]);var k=z&&G.startsWith(z.dialCode)?G.substring(z.dialCode.length):G;return a.jsx("div",{className:"phone-flag-selector ".concat(m),children:a.jsxs("div",{className:"phone-input-container",children:[a.jsx(c,{value:z,onChange:function(a){D(a);var e="".concat(a.dialCode).concat(G);null==r||r(e,a)},disabled:C,searchable:p,showFlag:v,showDialCode:N,useFlagImages:x,flagSize:E,defaultCountry:j,preferredCountries:A,excludeCountries:T,dropdownProps:U}),a.jsx("input",d({type:"tel",value:k,onChange:function(a){var e=a.target.value;B(e);var d=z?"".concat(z.dialCode).concat(e):e;null==r||r(d,z)},placeholder:s,disabled:C,className:"phone-input"},F))]})})},exports.countryData=o,exports.flagImageUrls=l,exports.getFlagImageUrl=n;
//# sourceMappingURL=index.js.map