Vue readme

grunt/replace.js

@@ -283,7 +283,8 @@ module.exports = function(grunt) {
       },
       files: {
         'README.md': 'README.md',
-        'react/README.md': 'react/README.md'
+        'react/README.md': 'react/README.md',
+        'vue/README.md': 'vue/README.md'
       }
     },
     issueTemplate: {

react/README.md

@@ -1,5 +1,5 @@
 # IntlTelInput React Component
-A React component wrapper for the [intl-tel-input](https://github.com/jackocnr/intl-tel-input) JavaScript plugin. View the source code [here](https://github.com/jackocnr/intl-tel-input/blob/master/react/src/intl-tel-input/react.tsx).
+A React 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/react/src/intl-tel-input/react.tsx).
 
 ## Table of Contents
 - [Demo and Examples](#demo-and-examples)
@@ -14,25 +14,24 @@ Check out [Storybook](https://intl-tel-input.com/storybook/?path=/docs/intltelin
 
 ## Getting Started
 ```js
-import IntlTelInput from "intl-tel-input/react";
+import IntlTelInput from "intl-tel-input/reactWithUtils";
 import "intl-tel-input/styles";
 
 <IntlTelInput
     onChangeNumber={setNumber}
     onChangeValidity={setIsValid}
     initOptions={{
         initialCountry: "us",
-        utilsScript: "path/to/utils.js",
     }}
 />
 ```
 
-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.
+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"` 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/[email protected]/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/[email protected]/build/js/utils.js"`.
 
 ## Props
-Here's a list of all of the current props you can pass to the IntlTelInput react component.
+Here's a list of all of the current props you can pass to the IntlTelInput React component.
 
 **disabled**    
 Type: `Boolean`, Default: `false`   

vue/README.md

@@ -0,0 +1,41 @@
+# IntlTelInput Vue Component
+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)
+- [Getting Started](#getting-started)
+- [Props](#props)
+- [Accessing Instance Methods](#accessing-instance-methods)
+- [Accessing Static Methods](#accessing-static-methods)
+- [Troubleshooting](#troubleshooting)
+
+## Demo and Examples
+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";
+</script>
+
+<template>
+  <IntlTelInput
+    :options="{
+      initialCountry: 'us',
+    }"
+  />
+</template>
+```
+
+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/[email protected]/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.
+
+[MORE COMING SOON]