intl-tel-input 24.0.1 → 24.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intl-tel-input",
-  "version": "24.0.1",
+  "version": "24.1.0",
   "description": "A JavaScript plugin for entering and validating international telephone numbers",
   "keywords": [
     "international",
@@ -30,6 +30,7 @@
     "@types/react-dom": "^18.2.24",
     "@typescript-eslint/eslint-plugin": "^8.1.0",
     "@typescript-eslint/parser": "^8.1.0",
+    "@vitejs/plugin-vue": "^5.1.2",
     "cspell": "^8.6.1",
     "esbuild": "^0.23.0",
     "eslint": "^8.57.0",
@@ -62,7 +63,9 @@
     "sass": "^1.74.1",
     "sharp": "^0.33.5",
     "time-grunt": "^2.0.0",
-    "typescript": "^5.5.3"
+    "typescript": "^5.5.3",
+    "vite": "^5.4.2",
+    "vue": "^3.4.38"
   },
   "files": [
     "build/*",
@@ -92,7 +95,9 @@
     "build:utils": "grunt build:utils",
     "build:css": "grunt css",
     "build:img": "grunt img",
-    "build:react": "grunt react"
+    "build:react": "grunt react",
+    "build:vue": "vite build --config vue/vite.config.js",
+    "vue:demo": "vite --config vue/demo/vite.config.js"
   },
   "style": "build/css/intlTelInput.css",
   "main": "./build/js/intlTelInput.js",
@@ -113,6 +118,10 @@
       "require": "./react/build/IntlTelInput.cjs",
       "default": "./react/build/IntlTelInput.js"
     },
+    "./vue": {
+      "import": "./vue/build/IntlTelInputWithUtils.mjs",
+      "default": "./vue/build/IntlTelInputWithUtils.umd.js"
+    },
     "./reactWithUtils": {
       "types": "./react/build/IntlTelInput.d.ts",
       "require": "./react/build/IntlTelInputWithUtils.cjs",

package/react/README.md

@@ -29,7 +29,7 @@ import "intl-tel-input/styles";
 
 See the [Validation demo](https://github.com/jackocnr/intl-tel-input/blob/master/react/demo/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"` instead, 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.0.1/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"` instead, 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.1.0/build/js/utils.js"`.
 
 ## Props
 Here's a list of all of the current props you can pass to the IntlTelInput react component.

package/react/build/IntlTelInput.cjs

@@ -1838,7 +1838,7 @@ var Iti = class {
       c.nodeById[this.id] = listItem;
       let content = "";
       if (this.options.showFlags) {
-        content += `<div class='iti__flag-box'><div class='iti__flag iti__${c.iso2}'></div></div>`;
+        content += `<div class='iti__flag iti__${c.iso2}'></div>`;
       }
       content += `<span class='iti__country-name'>${c.name}</span>`;
       content += `<span class='iti__dial-code'>+${c.dialCode}</span>`;
@@ -2835,7 +2835,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.0.1"
+    version: "24.1.0"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/react/build/IntlTelInput.js

@@ -1802,7 +1802,7 @@ var Iti = class {
       c.nodeById[this.id] = listItem;
       let content = "";
       if (this.options.showFlags) {
-        content += `<div class='iti__flag-box'><div class='iti__flag iti__${c.iso2}'></div></div>`;
+        content += `<div class='iti__flag iti__${c.iso2}'></div>`;
       }
       content += `<span class='iti__country-name'>${c.name}</span>`;
       content += `<span class='iti__dial-code'>+${c.dialCode}</span>`;
@@ -2799,7 +2799,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.0.1"
+    version: "24.1.0"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/react/build/IntlTelInputWithUtils.cjs

@@ -1838,7 +1838,7 @@ var Iti = class {
       c.nodeById[this.id] = listItem;
       let content = "";
       if (this.options.showFlags) {
-        content += `<div class='iti__flag-box'><div class='iti__flag iti__${c.iso2}'></div></div>`;
+        content += `<div class='iti__flag iti__${c.iso2}'></div>`;
       }
       content += `<span class='iti__country-name'>${c.name}</span>`;
       content += `<span class='iti__dial-code'>+${c.dialCode}</span>`;
@@ -2835,7 +2835,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.0.1"
+    version: "24.1.0"
   }
 );
 var intl_tel_input_default = intlTelInput;

package/react/build/IntlTelInputWithUtils.js

@@ -1802,7 +1802,7 @@ var Iti = class {
       c.nodeById[this.id] = listItem;
       let content = "";
       if (this.options.showFlags) {
-        content += `<div class='iti__flag-box'><div class='iti__flag iti__${c.iso2}'></div></div>`;
+        content += `<div class='iti__flag iti__${c.iso2}'></div>`;
       }
       content += `<span class='iti__country-name'>${c.name}</span>`;
       content += `<span class='iti__dial-code'>+${c.dialCode}</span>`;
@@ -2799,7 +2799,7 @@ var intlTelInput = Object.assign(
     //* A map from instance ID to instance object.
     instances: {},
     loadUtils,
-    version: "24.0.1"
+    version: "24.1.0"
   }
 );
 var intl_tel_input_default = intlTelInput;