intl-tel-input 24.3.3 → 24.3.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intl-tel-input",
-  "version": "24.3.3",
+  "version": "24.3.5",
   "description": "A JavaScript plugin for entering and validating international telephone numbers",
   "keywords": [
     "international",

package/react/README.md

@@ -28,7 +28,7 @@ import "intl-tel-input/styles";
 
 See the [Validation demo](https://github.com/jackocnr/intl-tel-input/blob/master/react/demo/validation/ValidationApp.tsx) for a more fleshed-out example of how to handle validation.
 
-A note on the utils script (~260KB): if you're lazy loading the IntlTelInput chunk (and so less worried about filesize) then you can just import IntlTelInput from `"intl-tel-input/reactWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/react"` import, then you should couple this with the `utilsScript` initialisation option - you will need to host the [utils.js](https://github.com/jackocnr/intl-tel-input/blob/master/build/js/utils.js) file, and then set the `utilsScript` option to that URL, or alternatively just point it to a CDN hosted version e.g. `"https://cdn.jsdelivr.net/npm/intl-tel-input@24.3.3/build/js/utils.js"`.
+A note on the utils script (~260KB): if you're lazy loading the IntlTelInput chunk (and so less worried about filesize) then you can just import IntlTelInput from `"intl-tel-input/reactWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/react"` import, then you should couple this with the `utilsScript` initialisation option - you will need to host the [utils.js](https://github.com/jackocnr/intl-tel-input/blob/master/build/js/utils.js) file, and then set the `utilsScript` option to that URL, or alternatively just point it to a CDN hosted version e.g. `"https://cdn.jsdelivr.net/npm/intl-tel-input@24.3.5/build/js/utils.js"`.
 
 ## Props
 Here's a list of all of the current props you can pass to the IntlTelInput React component.
@@ -43,7 +43,7 @@ The initial value to put in the input. This will get auto-formatted on init (acc
 
 **initOptions**  
 Type: `Object`  
-An object containing all of the [initialisation options](https://github.com/jackocnr/intl-tel-input?tab=readme-ov-file#initialisation-options) to pass to the plugin. You can use these exactly the same as when using the plugin with pure JavaScript.
+An object containing the [initialisation options](https://github.com/jackocnr/intl-tel-input?tab=readme-ov-file#initialisation-options) to pass to the plugin. You can use these exactly the same way as with the main JavaScript plugin.
 
 **inputProps**  
 Type: `Object`  

package/react/build/IntlTelInput.cjs

@@ -1763,7 +1763,6 @@ var Iti = class {
     }
     if (this.options.separateDialCode) {
       this.options.nationalMode = false;
-      this.options.countrySearch = true;
     }
     if (this.options.allowDropdown && !this.options.showFlags && !this.options.separateDialCode) {
       this.options.nationalMode = false;
@@ -2243,13 +2242,13 @@ var Iti = class {
   }
   //* Initialize the tel input listeners.
   _initTelInputListeners() {
-    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown } = this.options;
+    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown, countrySearch } = this.options;
     let userOverrideFormatting = false;
     if (/\p{L}/u.test(this.telInput.value)) {
       userOverrideFormatting = true;
     }
     this._handleInputEvent = (e) => {
-      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown) {
+      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown && countrySearch) {
         const currentCaretPos = this.telInput.selectionStart || 0;
         const valueBeforeCaret = this.telInput.value.substring(0, currentCaretPos - 1);
         const valueAfterCaret = this.telInput.value.substring(currentCaretPos);
@@ -2283,7 +2282,7 @@ var Iti = class {
     if (strictMode || separateDialCode) {
       this._handleKeydownEvent = (e) => {
         if (e.key && e.key.length === 1 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-          if (separateDialCode && allowDropdown && e.key === "+") {
+          if (separateDialCode && allowDropdown && countrySearch && e.key === "+") {
             e.preventDefault();
             this._openDropdownWithPlus();
             return;
@@ -3099,7 +3098,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.3.3"
+    version: "24.3.5"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/react/build/IntlTelInput.js

@@ -1727,7 +1727,6 @@ var Iti = class {
     }
     if (this.options.separateDialCode) {
       this.options.nationalMode = false;
-      this.options.countrySearch = true;
     }
     if (this.options.allowDropdown && !this.options.showFlags && !this.options.separateDialCode) {
       this.options.nationalMode = false;
@@ -2207,13 +2206,13 @@ var Iti = class {
   }
   //* Initialize the tel input listeners.
   _initTelInputListeners() {
-    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown } = this.options;
+    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown, countrySearch } = this.options;
     let userOverrideFormatting = false;
     if (/\p{L}/u.test(this.telInput.value)) {
       userOverrideFormatting = true;
     }
     this._handleInputEvent = (e) => {
-      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown) {
+      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown && countrySearch) {
         const currentCaretPos = this.telInput.selectionStart || 0;
         const valueBeforeCaret = this.telInput.value.substring(0, currentCaretPos - 1);
         const valueAfterCaret = this.telInput.value.substring(currentCaretPos);
@@ -2247,7 +2246,7 @@ var Iti = class {
     if (strictMode || separateDialCode) {
       this._handleKeydownEvent = (e) => {
         if (e.key && e.key.length === 1 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-          if (separateDialCode && allowDropdown && e.key === "+") {
+          if (separateDialCode && allowDropdown && countrySearch && e.key === "+") {
             e.preventDefault();
             this._openDropdownWithPlus();
             return;
@@ -3063,7 +3062,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.3.3"
+    version: "24.3.5"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/react/build/IntlTelInputWithUtils.cjs

@@ -1763,7 +1763,6 @@ var Iti = class {
     }
     if (this.options.separateDialCode) {
       this.options.nationalMode = false;
-      this.options.countrySearch = true;
     }
     if (this.options.allowDropdown && !this.options.showFlags && !this.options.separateDialCode) {
       this.options.nationalMode = false;
@@ -2243,13 +2242,13 @@ var Iti = class {
   }
   //* Initialize the tel input listeners.
   _initTelInputListeners() {
-    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown } = this.options;
+    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown, countrySearch } = this.options;
     let userOverrideFormatting = false;
     if (/\p{L}/u.test(this.telInput.value)) {
       userOverrideFormatting = true;
     }
     this._handleInputEvent = (e) => {
-      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown) {
+      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown && countrySearch) {
         const currentCaretPos = this.telInput.selectionStart || 0;
         const valueBeforeCaret = this.telInput.value.substring(0, currentCaretPos - 1);
         const valueAfterCaret = this.telInput.value.substring(currentCaretPos);
@@ -2283,7 +2282,7 @@ var Iti = class {
     if (strictMode || separateDialCode) {
       this._handleKeydownEvent = (e) => {
         if (e.key && e.key.length === 1 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-          if (separateDialCode && allowDropdown && e.key === "+") {
+          if (separateDialCode && allowDropdown && countrySearch && e.key === "+") {
             e.preventDefault();
             this._openDropdownWithPlus();
             return;
@@ -3099,7 +3098,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.3.3"
+    version: "24.3.5"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/react/build/IntlTelInputWithUtils.js

@@ -1727,7 +1727,6 @@ var Iti = class {
     }
     if (this.options.separateDialCode) {
       this.options.nationalMode = false;
-      this.options.countrySearch = true;
     }
     if (this.options.allowDropdown && !this.options.showFlags && !this.options.separateDialCode) {
       this.options.nationalMode = false;
@@ -2207,13 +2206,13 @@ var Iti = class {
   }
   //* Initialize the tel input listeners.
   _initTelInputListeners() {
-    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown } = this.options;
+    const { strictMode, formatAsYouType, separateDialCode, formatOnDisplay, allowDropdown, countrySearch } = this.options;
     let userOverrideFormatting = false;
     if (/\p{L}/u.test(this.telInput.value)) {
       userOverrideFormatting = true;
     }
     this._handleInputEvent = (e) => {
-      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown) {
+      if (this.isAndroid && e?.data === "+" && separateDialCode && allowDropdown && countrySearch) {
         const currentCaretPos = this.telInput.selectionStart || 0;
         const valueBeforeCaret = this.telInput.value.substring(0, currentCaretPos - 1);
         const valueAfterCaret = this.telInput.value.substring(currentCaretPos);
@@ -2247,7 +2246,7 @@ var Iti = class {
     if (strictMode || separateDialCode) {
       this._handleKeydownEvent = (e) => {
         if (e.key && e.key.length === 1 && !e.altKey && !e.ctrlKey && !e.metaKey) {
-          if (separateDialCode && allowDropdown && e.key === "+") {
+          if (separateDialCode && allowDropdown && countrySearch && e.key === "+") {
             e.preventDefault();
             this._openDropdownWithPlus();
             return;
@@ -3063,7 +3062,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.3.3"
+    version: "24.3.5"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/vue/README.md

@@ -2,20 +2,18 @@
 A Vue component wrapper for the [intl-tel-input](https://github.com/jackocnr/intl-tel-input) JavaScript plugin. View the [source code](https://github.com/jackocnr/intl-tel-input/blob/master/vue/src/intl-tel-input/IntlTelInput.vue).
 
 ## Table of Contents
-- [Demo and Examples](#demo-and-examples)
+- [Demo](#demo)
 - [Getting Started](#getting-started)
 - [Props](#props)
-- [Accessing Instance Methods](#accessing-instance-methods)
-- [Accessing Static Methods](#accessing-static-methods)
-- [Troubleshooting](#troubleshooting)
 
-## Demo and Examples
+## Demo
 Try it for yourself by downloading the project and running `npm install` and then `npm run vue:demo` and then copying the given URL into your browser.
 
 ## Getting Started
 ```vue
 <script setup>
-  import IntlTelInput from "../../src/intl-tel-input/IntlTelInputWithUtils.vue";
+  import IntlTelInput from "intl-tel-input/vueWithUtils";
+  import "intl-tel-input/styles";
 </script>
 
 <template>
@@ -29,13 +27,13 @@ Try it for yourself by downloading the project and running `npm install` and the
 
 See the [Validation demo](https://github.com/jackocnr/intl-tel-input/blob/master/vue/demo/validation/App.vue) for a more fleshed-out example of how to handle validation [COMING SOON].
 
-A note on the utils script (~260KB): if you're lazy loading the IntlTelInput chunk (and so less worried about filesize) then you can just import IntlTelInput from `"intl-tel-input/vueWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/vue"` import, then you should couple this with the `utilsScript` initialisation option - you will need to host the [utils.js](https://github.com/jackocnr/intl-tel-input/blob/master/build/js/utils.js) file, and then set the `utilsScript` option to that URL, or alternatively just point it to a CDN hosted version e.g. `"https://cdn.jsdelivr.net/npm/intl-tel-input@24.3.3/build/js/utils.js"`.
+A note on the utils script (~260KB): if you're lazy loading the IntlTelInput chunk (and so less worried about filesize) then you can just import IntlTelInput from `"intl-tel-input/vueWithUtils"`, to include the utils script. Alternatively, if you use the main `"intl-tel-input/vue"` import, then you should couple this with the `utilsScript` initialisation option - you will need to host the [utils.js](https://github.com/jackocnr/intl-tel-input/blob/master/build/js/utils.js) file, and then set the `utilsScript` option to that URL, or alternatively just point it to a CDN hosted version e.g. `"https://cdn.jsdelivr.net/npm/intl-tel-input@24.3.5/build/js/utils.js"`.
 
 ## Props
 Here's a list of all of the current props you can pass to the IntlTelInput Vue component.
 
 **options**  
 Type: `Object`  
-An object containing all of the [initialisation options](https://github.com/jackocnr/intl-tel-input?tab=readme-ov-file#initialisation-options) to pass to the plugin. You can use these exactly the same as when using the plugin with pure JavaScript.
+An object containing the [initialisation options](https://github.com/jackocnr/intl-tel-input?tab=readme-ov-file#initialisation-options) to pass to the plugin. You can use these exactly the same way as with the main JavaScript plugin.
 
-[MORE COMING SOON]
+[MORE COMING SOON]