From 7e8b7a0a94b9a1847f5f85155d4ddc76d2ece4ea Mon Sep 17 00:00:00 2001 From: I Komang Suryadana Date: Thu, 2 May 2019 06:07:34 +0700 Subject: [PATCH] [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 | 102 +++++++++++++++++++++ types/vue-tel-input/package.json | 6 ++ types/vue-tel-input/tsconfig.json | 24 +++++ types/vue-tel-input/tslint.json | 1 + types/vue-tel-input/vue-tel-input-tests.ts | 40 ++++++++ 5 files changed, 173 insertions(+) create mode 100644 types/vue-tel-input/index.d.ts create mode 100644 types/vue-tel-input/package.json create mode 100644 types/vue-tel-input/tsconfig.json create mode 100644 types/vue-tel-input/tslint.json create mode 100644 types/vue-tel-input/vue-tel-input-tests.ts diff --git a/types/vue-tel-input/index.d.ts b/types/vue-tel-input/index.d.ts new file mode 100644 index 0000000000..9fc01b92bd --- /dev/null +++ b/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 +// 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; +} diff --git a/types/vue-tel-input/package.json b/types/vue-tel-input/package.json new file mode 100644 index 0000000000..faefc1b2f7 --- /dev/null +++ b/types/vue-tel-input/package.json @@ -0,0 +1,6 @@ +{ + "private": true, + "dependencies": { + "vue": ">=2.0.0" + } +} diff --git a/types/vue-tel-input/tsconfig.json b/types/vue-tel-input/tsconfig.json new file mode 100644 index 0000000000..6424bf3865 --- /dev/null +++ b/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" + ] +} diff --git a/types/vue-tel-input/tslint.json b/types/vue-tel-input/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/vue-tel-input/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" } diff --git a/types/vue-tel-input/vue-tel-input-tests.ts b/types/vue-tel-input/vue-tel-input-tests.ts new file mode 100644 index 0000000000..68de80e0b8 --- /dev/null +++ b/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: ` + + +` +});