[vue-tel-input] Add definitions for vue-tel-input (#35026)

* Saturday, 27 April 2019.

1. Add declaration for vue-tel-input package.

* Saturday, 27 April 2019.

1. Revision data interface.
2. Revision methods interface.

types/vue-tel-input/index.d.ts

@@ -0,0 +1,102 @@
+// Type definitions for vue-tel-input 2.1
+// Project: https://educationlink.github.io/vue-tel-input
+// Definitions by: Komang Suryadana <https://github.com/suryadana>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 2.3
+
+import { VueConstructor } from 'vue';
+import { DirectiveOptions } from 'vue/types/options';
+
+export default VueTelInput;
+export const VueTelInput: VueTelInputConstructor;
+
+export interface VueTelInputProps {
+    value: string;
+    placeholder: string;
+    disabledFetchingCountry: boolean;
+    disabled: boolean;
+    disabledFormatting: boolean;
+    invalidMsg: string;
+    required: boolean;
+    defaultCountry: string;
+    enabledCountryCode: boolean;
+    enabledFlags: boolean;
+    preferredCountries: boolean;
+    onlyCountries: any[];
+    ignoredCountries: any[];
+    autocomplete: string;
+    name: string;
+    wrapperClasses: string;
+    inputClasses: string;
+    dropdownOptions: VueTelInputDowndownOption;
+    inputOptions: VueTelInputInputOption;
+    maxLen: number;
+}
+
+export interface VueTelInputData {
+    phone: string;
+    activeCountry: VueTelInputCountryOption;
+    open: boolean;
+    selectedIndex: any;
+    typeToFindInput: string;
+    typeToFindTimer: any;
+}
+
+export interface VueTelInputWatch {
+    state: (value: any) => void;
+    value: () => void;
+}
+
+export interface VueTelInputMethods {
+    initializeCountry: () => void;
+    getCountries: (list: any[]) => any[];
+    findCountry: (iso: string) => any[];
+    getItemClass: (index: number, iso2: string) => any;
+    choose: (country: any) => void;
+    onInput: ()  => void;
+    onBlur: () => void;
+    toggleDropdown: () => void;
+    clickedOutside: () => void;
+    keyboardNav: (e: Event) => void;
+    reset: () => void;
+}
+
+export interface VueTelInputComputed {
+    mode: () => string;
+    filteredCountries: () => string[];
+    sortedCountries: () => string[];
+    formattedResult: () => string;
+    state: () => boolean;
+    response: () => VueTelInputResponse ;
+}
+
+export interface VueTelInputDirective {
+    'click-outside': DirectiveOptions;
+}
+
+export interface VueTelInputResponse {
+    number: string;
+    isValid: boolean;
+    country: VueTelInputCountryOption;
+}
+
+export interface VueTelInputCountryOption {
+    iso2: string;
+}
+
+export interface VueTelInputDowndownOption {
+    disabledDialCode: boolean;
+}
+
+export interface VueTelInputInputOption {
+    showDialCode: boolean;
+}
+
+export interface VueTelInputConstructor extends VueConstructor {
+    props: VueTelInputProps;
+    data: () => VueTelInputData;
+    watch: VueTelInputWatch;
+    methods: VueTelInputMethods;
+    computed: VueTelInputComputed;
+    directives: VueTelInputDirective;
+}

types/vue-tel-input/package.json

@@ -0,0 +1,6 @@
+{
+  "private": true,
+  "dependencies": {
+    "vue": ">=2.0.0"
+  }
+}

types/vue-tel-input/tsconfig.json

@@ -0,0 +1,24 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "lib": [
+            "es6",
+            "dom"
+        ],
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "strictNullChecks": true,
+        "strictFunctionTypes": true,
+        "baseUrl": "../",
+        "typeRoots": [
+            "../"
+        ],
+        "types": [],
+        "noEmit": true,
+        "forceConsistentCasingInFileNames": true
+    },
+    "files": [
+        "index.d.ts",
+        "vue-tel-input-tests.ts"
+    ]
+}

types/vue-tel-input/tslint.json

@@ -0,0 +1 @@
+{ "extends": "dtslint/dt.json" }

types/vue-tel-input/vue-tel-input-tests.ts

@@ -0,0 +1,40 @@
+import Vue from 'vue';
+import VueTelInput from 'vue-tel-input';
+
+new Vue({
+    el: '#app',
+    data: {
+      phone: "",
+      bindProps: {
+        defaultCountry: "",
+        disabledFetchingCountry: false,
+        disabled: false,
+        disabledFormatting: false,
+        placeholder: "Enter a phone number",
+        required: false,
+        enabledCountryCode: false,
+        enabledFlags: true,
+        preferredCountries: ["AU", "BR"],
+        onlyCountries: [],
+        ignoredCountries: [],
+        autocomplete: "off",
+        name: "telephone",
+        maxLen: 25,
+        wrapperClasses: "",
+        inputClasses: "",
+        dropdownOptions: {
+          disabledDialCode: false
+        },
+        inputOptions: {
+          showDialCode: false
+        }
+      }
+    },
+    components: {
+        'vue-tel-input': VueTelInput
+    },
+    template: `
+    <vue-tel-input v-model="phone" v-bind="bindProps">
+    </vue-tel-input>
+`
+});