intl-tel-input 18.0.3 → 18.1.1

package/build/js/intlTelInput-jquery.js

@@ -1,5 +1,5 @@
 /*
- * International Telephone Input v18.0.3
+ * International Telephone Input v18.1.1
  * https://github.com/jackocnr/intl-tel-input.git
  * Licensed under the MIT license
  */
@@ -118,7 +118,9 @@
             return document.readyState === "complete";
         }
     };
-    if (typeof window === "object") window.intlTelInputGlobals = intlTelInputGlobals;
+    if (typeof window === "object") {
+        window.intlTelInputGlobals = intlTelInputGlobals;
+    }
     // these vars persist through all instances of the plugin
     var id = 0;
     var defaults = {
@@ -147,7 +149,7 @@
         initialCountry: "",
         // localized country names e.g. { 'de': 'Deutschland' }
         localizedCountries: null,
-        // deal with national numbers instead of international numbers
+        // national vs international formatting for numbers e.g. placeholders and displaying existing numbers
         nationalMode: true,
         // display only these countries
         onlyCountries: [],
@@ -157,6 +159,8 @@
         preferredCountries: [ "us", "gb" ],
         // display the country dial code next to the selected flag
         separateDialCode: false,
+        // option to hide the flags - must be used with separateDialCode, or allowDropdown=false
+        showFlags: true,
         // specify the path to the libphonenumber script to enable validation/formatting
         utilsScript: ""
     };
@@ -200,9 +204,19 @@
             value: function _init() {
                 var _this2 = this;
                 // if in nationalMode, do not insert dial codes
-                if (this.options.nationalMode) this.options.autoInsertDialCode = false;
+                if (this.options.nationalMode) {
+                    this.options.autoInsertDialCode = false;
+                }
                 // if separateDialCode enabled, do not insert dial codes
-                if (this.options.separateDialCode) this.options.autoInsertDialCode = false;
+                if (this.options.separateDialCode) {
+                    this.options.autoInsertDialCode = false;
+                }
+                // force showFlags=true if there's a dropdown and we're not displaying the dial code,
+                // as otherwise you just have a down arrow on it's own which doesn't make sense
+                var forceShowFlags = this.options.allowDropdown && !this.options.separateDialCode;
+                if (!this.options.showFlags && forceShowFlags) {
+                    this.options.showFlags = true;
+                }
                 // we cannot just test screen size as some smartphones/website meta tags will report desktop
                 // resolutions
                 // Note: for some reason jasmine breaks if you put this in the main Plugin function with the
@@ -213,7 +227,9 @@
                     // trigger the mobile dropdown css
                     document.body.classList.add("iti-mobile");
                     // on mobile, we want a full screen dropdown, so we must append it to the body
-                    if (!this.options.dropdownContainer) this.options.dropdownContainer = document.body;
+                    if (!this.options.dropdownContainer) {
+                        this.options.dropdownContainer = document.body;
+                    }
                 }
                 // these promises get resolved when their individual requests complete
                 // this way the dev can do something like iti.promise.then(...) to know when all requests are
@@ -257,7 +273,9 @@
                 // process the preferredCountries
                 this._processPreferredCountries();
                 // translate countries according to localizedCountries option
-                if (this.options.localizedCountries) this._translateCountriesByLocale();
+                if (this.options.localizedCountries) {
+                    this._translateCountriesByLocale();
+                }
                 // sort countries by name
                 if (this.options.onlyCountries.length || this.options.localizedCountries) {
                     this.countries.sort(this._countryNameSort);
@@ -274,7 +292,9 @@
                 }
                 // bail if we already have this country for this countryCode
                 for (var i = 0; i < this.countryCodes[countryCode].length; i++) {
-                    if (this.countryCodes[countryCode][i] === iso2) return;
+                    if (this.countryCodes[countryCode][i] === iso2) {
+                        return;
+                    }
                 }
                 // check for undefined as 0 is falsy
                 var index = priority !== undefined ? priority : this.countryCodes[countryCode].length;
@@ -314,8 +334,12 @@
         }, {
             key: "_countryNameSort",
             value: function _countryNameSort(a, b) {
-                if (a.name < b.name) return -1;
-                if (a.name > b.name) return 1;
+                if (a.name < b.name) {
+                    return -1;
+                }
+                if (a.name > b.name) {
+                    return 1;
+                }
                 return 0;
             }
         }, {
@@ -329,7 +353,9 @@
                 // first: add dial codes
                 for (var i = 0; i < this.countries.length; i++) {
                     var c = this.countries[i];
-                    if (!this.dialCodes[c.dialCode]) this.dialCodes[c.dialCode] = true;
+                    if (!this.dialCodes[c.dialCode]) {
+                        this.dialCodes[c.dialCode] = true;
+                    }
                     this._addCountryCode(c.iso2, c.dialCode, c.priority);
                 }
                 // next: add area codes
@@ -364,17 +390,23 @@
                 for (var i = 0; i < this.options.preferredCountries.length; i++) {
                     var countryCode = this.options.preferredCountries[i].toLowerCase();
                     var countryData = this._getCountryData(countryCode, false, true);
-                    if (countryData) this.preferredCountries.push(countryData);
+                    if (countryData) {
+                        this.preferredCountries.push(countryData);
+                    }
                 }
             }
         }, {
             key: "_createEl",
             value: function _createEl(name, attrs, container) {
                 var el = document.createElement(name);
-                if (attrs) forEachProp(attrs, function(key, value) {
-                    return el.setAttribute(key, value);
-                });
-                if (container) container.appendChild(el);
+                if (attrs) {
+                    forEachProp(attrs, function(key, value) {
+                        return el.setAttribute(key, value);
+                    });
+                }
+                if (container) {
+                    container.appendChild(el);
+                }
                 return el;
             }
         }, {
@@ -383,51 +415,66 @@
                 // if autocomplete does not exist on the element and its form, then
                 // prevent autocomplete as there's no safe, cross-browser event we can react to, so it can
                 // easily put the plugin in an inconsistent state e.g. the wrong flag selected for the
-                // autocompleted number, which on submit could mean wrong number is saved (esp in nationalMode)
+                // autocompleted number, which on submit could mean wrong number is saved
                 if (!this.telInput.hasAttribute("autocomplete") && !(this.telInput.form && this.telInput.form.hasAttribute("autocomplete"))) {
                     this.telInput.setAttribute("autocomplete", "off");
                 }
+                var _this$options = this.options, allowDropdown = _this$options.allowDropdown, separateDialCode = _this$options.separateDialCode, showFlags = _this$options.showFlags, customContainer = _this$options.customContainer, hiddenInput = _this$options.hiddenInput, dropdownContainer = _this$options.dropdownContainer;
                 // containers (mostly for positioning)
                 var parentClass = "iti";
-                if (this.options.allowDropdown) parentClass += " iti--allow-dropdown";
-                if (this.options.separateDialCode) parentClass += " iti--separate-dial-code";
-                if (this.options.customContainer) {
-                    parentClass += " ";
-                    parentClass += this.options.customContainer;
+                if (allowDropdown) {
+                    parentClass += " iti--allow-dropdown";
+                }
+                if (separateDialCode) {
+                    parentClass += " iti--separate-dial-code";
+                }
+                if (showFlags) {
+                    parentClass += " iti--show-flags";
+                }
+                if (customContainer) {
+                    parentClass += " ".concat(customContainer);
                 }
                 var wrapper = this._createEl("div", {
                     "class": parentClass
                 });
                 this.telInput.parentNode.insertBefore(wrapper, this.telInput);
-                this.flagsContainer = this._createEl("div", {
-                    "class": "iti__flag-container"
-                }, wrapper);
+                // only hide the flagsContainer if allowDropdown, showFlags and separateDialCode are all false
+                var showFlagsContainer = allowDropdown || showFlags || separateDialCode;
+                if (showFlagsContainer) {
+                    this.flagsContainer = this._createEl("div", {
+                        "class": "iti__flag-container"
+                    }, wrapper);
+                }
                 wrapper.appendChild(this.telInput);
                 // selected flag (displayed to left of input)
                 // using Aria tags for "Select-Only Combobox Example"
                 // https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/
-                this.selectedFlag = this._createEl("div", _objectSpread({
-                    "class": "iti__selected-flag"
-                }, this.options.allowDropdown && {
-                    role: "combobox",
-                    "aria-haspopup": "listbox",
-                    "aria-controls": "iti-".concat(this.id, "__country-listbox"),
-                    "aria-owns": "iti-".concat(this.id, "__country-listbox"),
-                    "aria-expanded": "false",
-                    "aria-label": "Telephone country code"
-                }), this.flagsContainer);
-                this.selectedFlagInner = this._createEl("div", {
-                    "class": "iti__flag"
-                }, this.selectedFlag);
-                if (this.telInput.disabled) {
+                if (showFlagsContainer) {
+                    this.selectedFlag = this._createEl("div", _objectSpread({
+                        "class": "iti__selected-flag"
+                    }, allowDropdown && {
+                        role: "combobox",
+                        "aria-haspopup": "listbox",
+                        "aria-controls": "iti-".concat(this.id, "__country-listbox"),
+                        "aria-owns": "iti-".concat(this.id, "__country-listbox"),
+                        "aria-expanded": "false",
+                        "aria-label": "Telephone country code"
+                    }), this.flagsContainer);
+                }
+                if (showFlags) {
+                    this.selectedFlagInner = this._createEl("div", {
+                        "class": "iti__flag"
+                    }, this.selectedFlag);
+                }
+                if (this.selectedFlag && this.telInput.disabled) {
                     this.selectedFlag.setAttribute("aria-disabled", "true");
                 }
-                if (this.options.separateDialCode) {
+                if (separateDialCode) {
                     this.selectedDialCode = this._createEl("div", {
                         "class": "iti__selected-dial-code"
                     }, this.selectedFlag);
                 }
-                if (this.options.allowDropdown) {
+                if (allowDropdown) {
                     if (!this.telInput.disabled) {
                         // make element focusable and tab navigable
                         this.selectedFlag.setAttribute("tabindex", "0");
@@ -452,7 +499,7 @@
                     }
                     this._appendListItems(this.countries, "iti__standard");
                     // create dropdownContainer markup
-                    if (this.options.dropdownContainer) {
+                    if (dropdownContainer) {
                         this.dropdown = this._createEl("div", {
                             "class": "iti iti--container"
                         });
@@ -461,14 +508,16 @@
                         this.flagsContainer.appendChild(this.countryList);
                     }
                 }
-                if (this.options.hiddenInput) {
-                    var hiddenInputName = this.options.hiddenInput;
+                if (hiddenInput) {
+                    var hiddenInputName = hiddenInput;
                     var name = this.telInput.getAttribute("name");
                     if (name) {
                         var i = name.lastIndexOf("[");
                         // if input name contains square brackets, then give the hidden input the same name,
                         // replacing the contents of the last set of brackets with the given hiddenInput name
-                        if (i !== -1) hiddenInputName = "".concat(name.substr(0, i), "[").concat(hiddenInputName, "]");
+                        if (i !== -1) {
+                            hiddenInputName = "".concat(name.substr(0, i), "[").concat(hiddenInputName, "]");
+                        }
                     }
                     this.hiddenInput = this._createEl("input", {
                         type: "hidden",
@@ -490,7 +539,9 @@
                     // open the list item
                     tmp += "<li class='iti__country ".concat(className, "' tabIndex='-1' id='iti-").concat(this.id, "__item-").concat(c.iso2).concat(idSuffix, "' role='option' data-dial-code='").concat(c.dialCode, "' data-country-code='").concat(c.iso2, "' aria-selected='false'>");
                     // add the flag
-                    tmp += "<div class='iti__flag-box'><div class='iti__flag iti__".concat(c.iso2, "'></div></div>");
+                    if (this.options.showFlags) {
+                        tmp += "<div class='iti__flag-box'><div class='iti__flag iti__".concat(c.iso2, "'></div></div>");
+                    }
                     // and the country name and dial code
                     tmp += "<span class='iti__country-name'>".concat(c.name, "</span>");
                     tmp += "<span class='iti__dial-code'>+".concat(c.dialCode, "</span>");
@@ -511,7 +562,7 @@
                 var val = useAttribute ? attributeValue : inputValue;
                 var dialCode = this._getDialCode(val);
                 var isRegionlessNanp = this._isRegionlessNanp(val);
-                var _this$options = this.options, initialCountry = _this$options.initialCountry, autoInsertDialCode = _this$options.autoInsertDialCode;
+                var _this$options2 = this.options, initialCountry = _this$options2.initialCountry, autoInsertDialCode = _this$options2.autoInsertDialCode;
                 // if we already have a dial code, and it's not a regionlessNanp, we can go ahead and set the
                 // flag, else fall back to the default country
                 if (dialCode && !isRegionlessNanp) {
@@ -539,15 +590,23 @@
                 }
                 // NOTE: if initialCountry is set to auto, that will be handled separately
                 // format - note this wont be run after _updateDialCode as that's only called if no val
-                if (val) this._updateValFromNumber(val);
+                if (val) {
+                    this._updateValFromNumber(val);
+                }
             }
         }, {
             key: "_initListeners",
             value: function _initListeners() {
                 this._initKeyListeners();
-                if (this.options.autoInsertDialCode) this._initBlurListeners();
-                if (this.options.allowDropdown) this._initDropdownListeners();
-                if (this.hiddenInput) this._initHiddenInputListener();
+                if (this.options.autoInsertDialCode) {
+                    this._initBlurListeners();
+                }
+                if (this.options.allowDropdown) {
+                    this._initDropdownListeners();
+                }
+                if (this.hiddenInput) {
+                    this._initHiddenInputListener();
+                }
             }
         }, {
             key: "_initHiddenInputListener",
@@ -556,7 +615,9 @@
                 this._handleHiddenInputSubmit = function() {
                     _this3.hiddenInput.value = _this3.getNumber();
                 };
-                if (this.telInput.form) this.telInput.form.addEventListener("submit", this._handleHiddenInputSubmit);
+                if (this.telInput.form) {
+                    this.telInput.form.addEventListener("submit", this._handleHiddenInputSubmit);
+                }
             }
         }, {
             key: "_getClosestLabel",
@@ -576,10 +637,16 @@
                 // close it again
                 this._handleLabelClick = function(e) {
                     // if the dropdown is closed, then focus the input, else ignore the click
-                    if (_this4.countryList.classList.contains("iti__hide")) _this4.telInput.focus(); else e.preventDefault();
+                    if (_this4.countryList.classList.contains("iti__hide")) {
+                        _this4.telInput.focus();
+                    } else {
+                        e.preventDefault();
+                    }
                 };
                 var label = this._getClosestLabel();
-                if (label) label.addEventListener("click", this._handleLabelClick);
+                if (label) {
+                    label.addEventListener("click", this._handleLabelClick);
+                }
                 // toggle country dropdown on click
                 this._handleClickSelectedFlag = function() {
                     // only intercept this event if we're opening the dropdown
@@ -601,7 +668,9 @@
                         _this4._showDropdown();
                     }
                     // allow navigation from dropdown to input on TAB
-                    if (e.key === "Tab") _this4._closeDropdown();
+                    if (e.key === "Tab") {
+                        _this4._closeDropdown();
+                    }
                 };
                 this.flagsContainer.addEventListener("keydown", this._handleFlagsContainerKeydown);
             }
@@ -620,8 +689,14 @@
                             window.intlTelInputGlobals.loadUtils(_this5.options.utilsScript);
                         });
                     }
-                } else this.resolveUtilsScriptPromise();
-                if (this.options.initialCountry === "auto") this._loadAutoCountry(); else this.resolveAutoCountryPromise();
+                } else {
+                    this.resolveUtilsScriptPromise();
+                }
+                if (this.options.initialCountry === "auto") {
+                    this._loadAutoCountry();
+                } else {
+                    this.resolveAutoCountryPromise();
+                }
             }
         }, {
             key: "_loadAutoCountry",
@@ -686,7 +761,9 @@
                 this._handleSubmitOrBlurEvent = function() {
                     _this7._removeEmptyDialCode();
                 };
-                if (this.telInput.form) this.telInput.form.addEventListener("submit", this._handleSubmitOrBlurEvent);
+                if (this.telInput.form) {
+                    this.telInput.form.addEventListener("submit", this._handleSubmitOrBlurEvent);
+                }
                 this.telInput.addEventListener("blur", this._handleSubmitOrBlurEvent);
             }
         }, {
@@ -734,7 +811,11 @@
         }, {
             key: "_toggleClass",
             value: function _toggleClass(el, className, shouldHaveClass) {
-                if (shouldHaveClass && !el.classList.contains(className)) el.classList.add(className); else if (!shouldHaveClass && el.classList.contains(className)) el.classList.remove(className);
+                if (shouldHaveClass && !el.classList.contains(className)) {
+                    el.classList.add(className);
+                } else if (!shouldHaveClass && el.classList.contains(className)) {
+                    el.classList.remove(className);
+                }
             }
         }, {
             key: "_setDropdownPosition",
@@ -790,13 +871,17 @@
                 this._handleMouseoverCountryList = function(e) {
                     // handle event delegation, as we're listening for this event on the countryList
                     var listItem = _this9._getClosestListItem(e.target);
-                    if (listItem) _this9._highlightListItem(listItem, false);
+                    if (listItem) {
+                        _this9._highlightListItem(listItem, false);
+                    }
                 };
                 this.countryList.addEventListener("mouseover", this._handleMouseoverCountryList);
                 // listen for country selection
                 this._handleClickCountryList = function(e) {
                     var listItem = _this9._getClosestListItem(e.target);
-                    if (listItem) _this9._selectListItem(listItem);
+                    if (listItem) {
+                        _this9._selectListItem(listItem);
+                    }
                 };
                 this.countryList.addEventListener("click", this._handleClickCountryList);
                 // click off to close
@@ -804,7 +889,9 @@
                 // we cannot just stopPropagation as it may be needed to close another instance
                 var isOpening = true;
                 this._handleClickOffToClose = function() {
-                    if (!isOpening) _this9._closeDropdown();
+                    if (!isOpening) {
+                        _this9._closeDropdown();
+                    }
                     isOpening = false;
                 };
                 document.documentElement.addEventListener("click", this._handleClickOffToClose);
@@ -819,9 +906,17 @@
                     // and enter key from submitting a form etc
                     e.preventDefault();
                     // up and down to navigate
-                    if (e.key === "ArrowUp" || e.key === "Up" || e.key === "ArrowDown" || e.key === "Down") _this9._handleUpDownKey(e.key); else if (e.key === "Enter") _this9._handleEnterKey(); else if (e.key === "Escape") _this9._closeDropdown(); else if (/^[a-zA-ZÀ-ÿа-яА-Я ]$/.test(e.key)) {
+                    if (e.key === "ArrowUp" || e.key === "Up" || e.key === "ArrowDown" || e.key === "Down") {
+                        _this9._handleUpDownKey(e.key);
+                    } else if (e.key === "Enter") {
+                        _this9._handleEnterKey();
+                    } else if (e.key === "Escape") {
+                        _this9._closeDropdown();
+                    } else if (/^[a-zA-ZÀ-ÿа-яА-Я ]$/.test(e.key)) {
                         // jump to countries that start with the query string
-                        if (queryTimer) clearTimeout(queryTimer);
+                        if (queryTimer) {
+                            clearTimeout(queryTimer);
+                        }
                         query += e.key.toLowerCase();
                         _this9._searchForCountry(query);
                         // if the timer hits 1 second, reset the query
@@ -847,7 +942,9 @@
         }, {
             key: "_handleEnterKey",
             value: function _handleEnterKey() {
-                if (this.highlightedItem) this._selectListItem(this.highlightedItem);
+                if (this.highlightedItem) {
+                    this._selectListItem(this.highlightedItem);
+                }
             }
         }, {
             key: "_searchForCountry",
@@ -883,7 +980,7 @@
         }, {
             key: "_updateFlagFromNumber",
             value: function _updateFlagFromNumber(originalNumber) {
-                // if we're in nationalMode and we already have US/Canada selected, make sure the number starts
+                // if we already have US/Canada selected, make sure the number starts
                 // with a +1 so _getDialCode will be able to extract the area code
                 // update: if we dont yet have selectedCountryData, but we're here (trying to update the flag
                 // from the number), that means we're initialising the plugin with a number that already has a
@@ -891,8 +988,10 @@
                 var number = originalNumber;
                 var selectedDialCode = this.selectedCountryData.dialCode;
                 var isNanp = selectedDialCode === "1";
-                if (number && this.options.nationalMode && isNanp && number.charAt(0) !== "+") {
-                    if (number.charAt(0) !== "1") number = "1".concat(number);
+                if (number && isNanp && number.charAt(0) !== "+") {
+                    if (number.charAt(0) !== "1") {
+                        number = "1".concat(number);
+                    }
                     number = "+".concat(number);
                 }
                 // if separateDialCode enabled, then consider the selected dial code to be part of the number
@@ -953,11 +1052,15 @@
             key: "_highlightListItem",
             value: function _highlightListItem(listItem, shouldFocus) {
                 var prevItem = this.highlightedItem;
-                if (prevItem) prevItem.classList.remove("iti__highlight");
+                if (prevItem) {
+                    prevItem.classList.remove("iti__highlight");
+                }
                 this.highlightedItem = listItem;
                 this.highlightedItem.classList.add("iti__highlight");
                 this.selectedFlag.setAttribute("aria-activedescendant", listItem.getAttribute("id"));
-                if (shouldFocus) this.highlightedItem.focus();
+                if (shouldFocus) {
+                    this.highlightedItem.focus();
+                }
             }
         }, {
             key: "_getCountryData",
@@ -983,10 +1086,14 @@
                 if (this.selectedCountryData.iso2) {
                     this.defaultCountry = this.selectedCountryData.iso2;
                 }
-                this.selectedFlagInner.setAttribute("class", "iti__flag iti__".concat(countryCode));
+                if (this.options.showFlags) {
+                    this.selectedFlagInner.setAttribute("class", "iti__flag iti__".concat(countryCode));
+                }
                 // update the selected country's title attribute
-                var title = countryCode ? "".concat(this.selectedCountryData.name, ": +").concat(this.selectedCountryData.dialCode) : "Unknown";
-                this.selectedFlag.setAttribute("title", title);
+                if (this.selectedFlag) {
+                    var title = countryCode ? "".concat(this.selectedCountryData.name, ": +").concat(this.selectedCountryData.dialCode) : "Unknown";
+                    this.selectedFlag.setAttribute("title", title);
+                }
                 if (this.options.separateDialCode) {
                     var dialCode = this.selectedCountryData.dialCode ? "+".concat(this.selectedCountryData.dialCode) : "";
                     this.selectedDialCode.innerHTML = dialCode;
@@ -1054,8 +1161,8 @@
                 this._updateDialCode(listItem.getAttribute("data-dial-code"));
                 // focus the input
                 this.telInput.focus();
-                // put cursor at end - this fix is required for FF and IE11 (with nationalMode=false i.e. auto
-                // inserting dial code), who try to put the cursor at the beginning the first time
+                // put cursor at end - this fix is required for FF and IE11 (with auto inserting dial code),
+                // who try to put the cursor at the beginning the first time
                 var len = this.telInput.value.length;
                 this.telInput.setSelectionRange(len, len);
                 if (flagChanged) {
@@ -1077,8 +1184,12 @@
                 this.countryList.removeEventListener("click", this._handleClickCountryList);
                 // remove menu from container
                 if (this.options.dropdownContainer) {
-                    if (!this.isMobile) window.removeEventListener("scroll", this._handleWindowScroll);
-                    if (this.dropdown.parentNode) this.dropdown.parentNode.removeChild(this.dropdown);
+                    if (!this.isMobile) {
+                        window.removeEventListener("scroll", this._handleWindowScroll);
+                    }
+                    if (this.dropdown.parentNode) {
+                        this.dropdown.parentNode.removeChild(this.dropdown);
+                    }
                 }
                 this._trigger("close:countrydropdown");
             }
@@ -1098,11 +1209,15 @@
                 var middleOffset = containerHeight / 2 - elementHeight / 2;
                 if (elementTop < containerTop) {
                     // scroll up
-                    if (middle) newScrollTop -= middleOffset;
+                    if (middle) {
+                        newScrollTop -= middleOffset;
+                    }
                     container.scrollTop = newScrollTop;
                 } else if (elementBottom > containerBottom) {
                     // scroll down
-                    if (middle) newScrollTop += middleOffset;
+                    if (middle) {
+                        newScrollTop += middleOffset;
+                    }
                     var heightDifference = containerHeight - elementHeight;
                     container.scrollTop = newScrollTop - heightDifference;
                 }
@@ -1115,7 +1230,7 @@
                 var newDialCode = "+".concat(newDialCodeBare);
                 var newNumber;
                 if (inputVal.charAt(0) === "+") {
-                    // there's a plus so we're dealing with a replacement (doesn't matter if nationalMode or not)
+                    // there's a plus so we're dealing with a replacement
                     var prevDialCode = this._getDialCode(inputVal);
                     if (prevDialCode) {
                         // current number contains a valid dial code, so replace it
@@ -1249,13 +1364,19 @@
                     this.flagsContainer.removeEventListener("keydown", this._handleFlagsContainerKeydown);
                     // label click hack
                     var label = this._getClosestLabel();
-                    if (label) label.removeEventListener("click", this._handleLabelClick);
+                    if (label) {
+                        label.removeEventListener("click", this._handleLabelClick);
+                    }
                 }
                 // unbind hiddenInput listeners
-                if (this.hiddenInput && form) form.removeEventListener("submit", this._handleHiddenInputSubmit);
+                if (this.hiddenInput && form) {
+                    form.removeEventListener("submit", this._handleHiddenInputSubmit);
+                }
                 // unbind autoInsertDialCode listeners
                 if (this.options.autoInsertDialCode) {
-                    if (form) form.removeEventListener("submit", this._handleSubmitOrBlurEvent);
+                    if (form) {
+                        form.removeEventListener("submit", this._handleSubmitOrBlurEvent);
+                    }
                     this.telInput.removeEventListener("blur", this._handleSubmitOrBlurEvent);
                 }
                 // unbind key events, and cut/paste events
@@ -1313,15 +1434,14 @@
             key: "isValidNumber",
             value: function isValidNumber() {
                 var val = this._getFullNumber().trim();
-                var countryCode = this.options.nationalMode ? this.selectedCountryData.iso2 : "";
-                return window.intlTelInputUtils ? intlTelInputUtils.isValidNumber(val, countryCode) : null;
+                return window.intlTelInputUtils ? intlTelInputUtils.isValidNumber(val, this.selectedCountryData.iso2) : null;
             }
         }, {
             key: "setCountry",
             value: function setCountry(originalCountryCode) {
                 var countryCode = originalCountryCode.toLowerCase();
                 // check if already selected
-                if (!this.selectedFlagInner.classList.contains("iti__".concat(countryCode))) {
+                if (this.selectedCountryData.iso2 !== countryCode) {
                     this._setFlag(countryCode);
                     this._updateDialCode(this.selectedCountryData.dialCode);
                     this._triggerCountryChange();
@@ -1360,11 +1480,15 @@
         var script = document.createElement("script");
         script.onload = function() {
             forEachInstance("handleUtils");
-            if (handleSuccess) handleSuccess();
+            if (handleSuccess) {
+                handleSuccess();
+            }
         };
         script.onerror = function() {
             forEachInstance("rejectUtilsScriptPromise");
-            if (handleFailure) handleFailure();
+            if (handleFailure) {
+                handleFailure();
+            }
         };
         script.className = "iti-load-utils";
         script.async = true;
@@ -1393,7 +1517,7 @@
     // default options
     intlTelInputGlobals.defaults = defaults;
     // version
-    intlTelInputGlobals.version = "18.0.3";
+    intlTelInputGlobals.version = "18.1.1";
     var pluginName = "intlTelInput";
     // A really lightweight plugin wrapper around the constructor,
     // preventing against multiple instantiations