Improve typescript typings and config (ModusCreateOrg#44)

michaeltintiuc · grgur · commit f0c837c1f538 · 2018-10-11T19:10:21.000+02:00
diff --git a/.gitignore b/.gitignore
@@ -6,6 +6,7 @@ node_modules/
 coverage/
 reports/
 src/**/*.js
+types/**/*.map
 
 # ignore log files
 *.log
diff --git a/build/rollup.config.js b/build/rollup.config.js
@@ -52,7 +52,7 @@ function baseConfig() {
       '@ionic/core/dist/ionic/svg',
       'ionicons/dist/collection/icon/icon.css',
     ],
-    plugins: [vue(), typescript()],
+    plugins: [vue(), typescript({ useTsconfigDeclarationDir: true })],
   }
 }
 
diff --git a/package.json b/package.json
@@ -8,12 +8,13 @@
   "license": "MIT",
   "repository": "github:ModusCreateOrg/ionic-vue",
   "main": "dist/ionic-vue.common.js",
-  "typings": "dist/index.d.ts",
+  "typings": "types/index.d.ts",
   "module": "dist/ionic-vue.esm.js",
   "unpkg": "dist/ionic-vue.js",
   "jsdelivr": "dist/ionic-vue.js",
   "files": [
     "src/",
+    "types/",
     "dist/*.js",
     "dist/*.ts"
   ],
diff --git a/src/api-utils.ts b/src/api-utils.ts
@@ -1,4 +1,4 @@
-import { HTMLStencilElement } from './types/interfaces';
+import { HTMLStencilElement } from './interfaces';
 
 // A proxy method that initializes the controller and calls requested method
 export function proxyMethod(tag: string, method: string, ...opts: any[]): Promise<any> {
diff --git a/src/api.ts b/src/api.ts
@@ -1,5 +1,5 @@
 import Vue, { PluginFunction } from 'vue';
-import { ApiCache, FrameworkDelegate } from './types/interfaces';
+import { ApiCache, FrameworkDelegate } from './interfaces';
 import Delegate from './framework-delegate';
 import ProxyController from './proxy-controller';
 import ProxyMenuController from './proxy-menu-controller';
@@ -13,37 +13,37 @@ export default class Api {
   static install: PluginFunction<never>;
 
   // Create or return a ActionSheetController instance
-  get actionSheetController(): typeof ProxyController {
+  get actionSheetController(): ProxyController {
     return getOrCreateController('ion-action-sheet-controller');
   }
 
   // Create or return an AlertController instance
-  get alertController(): typeof ProxyController {
+  get alertController(): ProxyController {
     return getOrCreateController('ion-alert-controller');
   }
 
   // Create or return a LoadingController instance
-  get loadingController(): typeof ProxyController {
+  get loadingController(): ProxyController {
     return getOrCreateController('ion-loading-controller');
   }
 
   // Create or return a MenuController instance
-  get menuController(): typeof ProxyMenuController {
+  get menuController(): ProxyMenuController {
     return getOrCreateMenuController('ion-menu-controller');
   }
 
   // Create or return a ModalController instance
-  get modalController(): typeof ProxyDelegateController {
+  get modalController(): ProxyDelegateController {
     return getOrCreateDelegatedController('ion-modal-controller');
   }
 
   // Create or return a PopoverController instance
-  get popoverController(): typeof ProxyDelegateController {
+  get popoverController(): ProxyDelegateController {
     return getOrCreateDelegatedController('ion-popover-controller');
   }
 
   // Create or return a ToastController instance
-  get toastController(): typeof ProxyController {
+  get toastController(): ProxyController {
     return getOrCreateController('ion-toast-controller');
   }
 }
@@ -82,7 +82,7 @@ Api.install = (Vue): void => {
 };
 
 // Get existing Base controller instance or initialize a new one
-function getOrCreateController(tag: string): typeof ProxyController {
+function getOrCreateController(tag: string): ProxyController {
   if (!Api.cache[tag]) {
     Api.cache[tag] = new ProxyController(tag);
   }
@@ -91,7 +91,7 @@ function getOrCreateController(tag: string): typeof ProxyController {
 }
 
 // Get existing Menu controller instance or initialize a new one
-function getOrCreateMenuController(tag: string): typeof ProxyMenuController {
+function getOrCreateMenuController(tag: string): ProxyMenuController {
   if (!Api.cache[tag]) {
     Api.cache[tag] = new ProxyMenuController(tag);
   }
@@ -100,7 +100,7 @@ function getOrCreateMenuController(tag: string): typeof ProxyMenuController {
 }
 
 // Get existing Delegated controller instance or initialize a new one
-function getOrCreateDelegatedController(tag: string): typeof ProxyDelegateController {
+function getOrCreateDelegatedController(tag: string): ProxyDelegateController {
   if (!Api.cache[tag]) {
     Api.cache[tag] = new ProxyDelegateController(tag, _Delegate);
   }
diff --git a/src/components/ion-vue-router-transitionless.vue b/src/components/ion-vue-router-transitionless.vue
@@ -7,7 +7,7 @@
 <script lang="ts">
 import { Prop } from 'vue-property-decorator';
 import Component, { mixins } from 'vue-class-component';
-import CatchIonicGoBack from '../mixins/catch-ionic-go-back.js';
+import CatchIonicGoBack from '../mixins/catch-ionic-go-back';
 
 @Component
 export default class IonVueRouter extends mixins(CatchIonicGoBack) {
diff --git a/src/components/ion-vue-router.vue b/src/components/ion-vue-router.vue
@@ -26,9 +26,8 @@
 <script lang="ts">
 import { Prop } from 'vue-property-decorator';
 import Component, { mixins } from 'vue-class-component';
-import CatchIonicGoBack from '../mixins/catch-ionic-go-back.js';
-import { IonRouterOutlet } from '../types/interfaces.js';
-import Router from '../router.js';
+import CatchIonicGoBack from '../mixins/catch-ionic-go-back';
+import { IonRouterOutlet } from '../interfaces';
 
 @Component
 export default class IonVueRouter extends mixins(CatchIonicGoBack) {
@@ -78,7 +77,7 @@ export default class IonVueRouter extends mixins(CatchIonicGoBack) {
         deepWait: true,
         duration: this.getDuration(),
         direction: this.getDirection(),
-        showGoBack: (this.$router as Router).canGoBack(),
+        showGoBack: this.$router.canGoBack(),
       });
     });
   }
@@ -90,7 +89,7 @@ export default class IonVueRouter extends mixins(CatchIonicGoBack) {
 
   // Get the navigation direction from the router
   getDirection() {
-    return (this.$router as Router).direction === 1 ? 'forward' : 'back';
+    return this.$router.direction === 1 ? 'forward' : 'back';
   }
 
   // Set the component to be rendered before we render the new route
diff --git a/src/framework-delegate.ts b/src/framework-delegate.ts
@@ -1,5 +1,5 @@
 import { VueConstructor } from 'vue';
-import { FrameworkDelegate, HTMLVueElement, WebpackFunction, EsModule } from './types/interfaces';
+import { EsModule, FrameworkDelegate, HTMLVueElement, WebpackFunction } from './interfaces';
 
 export default class Delegate implements FrameworkDelegate {
   constructor(public vue: VueConstructor) {}
diff --git a/src/interfaces.ts b/src/interfaces.ts
@@ -1,5 +1,5 @@
-import Vue, { VueConstructor } from 'vue';
-import IonicApi from '../api';
+import Vue from 'vue';
+import IonicApi from './api';
 import VueRouter from 'vue-router';
 import { RouterOptions } from 'vue-router/types/router';
 
@@ -9,6 +9,14 @@ declare module 'vue/types/vue' {
   }
 }
 
+declare module 'vue-router/types/router' {
+  interface VueRouter {
+    direction: number;
+    directionOverride: number | null;
+    canGoBack(): boolean;
+  }
+}
+
 export interface HTMLVueElement extends HTMLElement {
   __vue__: Vue;
 }
@@ -64,7 +72,7 @@ export interface ProxyControllerInterface {
 
 export interface ProxyDelegateOptions extends Object {
   [key: string]: any;
-  delegate: FrameworkDelegate;
+  delegate?: FrameworkDelegate;
 }
 
 export interface ProxyMenuControllerInterface {
diff --git a/src/mixins/catch-ionic-go-back.ts b/src/mixins/catch-ionic-go-back.ts
@@ -1,7 +1,7 @@
 import Vue from 'vue';
-import Router from '../router'
+import Router from '../router';
 import Component from 'vue-class-component';
-import { IonBackButton } from '../types/interfaces';
+import { IonBackButton } from '../interfaces';
 
 @Component
 export default class CatchIonicGoBack extends Vue {
@@ -33,4 +33,4 @@ export default class CatchIonicGoBack extends Vue {
       $router.push(defaultHref);
     }
   }
-};
+}
diff --git a/src/proxy-controller.ts b/src/proxy-controller.ts
@@ -1,5 +1,5 @@
 import * as apiUtils from './api-utils';
-import { ProxyControllerInterface } from './types/interfaces';
+import { ProxyControllerInterface } from './interfaces';
 
 // A proxy class that allows early access to controller methods
 export default class ProxyController implements ProxyControllerInterface {
diff --git a/src/proxy-delegate-controller.ts b/src/proxy-delegate-controller.ts
@@ -1,5 +1,5 @@
 import ProxyController from './proxy-controller';
-import { FrameworkDelegate, ProxyDelegateOptions } from './types/interfaces';
+import { FrameworkDelegate, ProxyDelegateOptions } from './interfaces';
 
 // A proxy class that allows early access to controller methods
 export default class ProxyDelegateController extends ProxyController {
diff --git a/src/proxy-menu-controller.ts b/src/proxy-menu-controller.ts
@@ -1,5 +1,5 @@
 import * as apiUtils from './api-utils';
-import { ProxyMenuControllerInterface } from './types/interfaces';
+import { ProxyMenuControllerInterface } from './interfaces';
 
 // A proxy class that allows early access to controller methods
 export default class ProxyMenuController implements ProxyMenuControllerInterface {
diff --git a/src/router.ts b/src/router.ts
@@ -1,6 +1,6 @@
 import VueRouter, { Route } from 'vue-router';
 import { PluginFunction } from 'vue';
-import { RouterArgs, VueWindow } from './types/interfaces';
+import { RouterArgs, VueWindow } from './interfaces';
 import IonVueRouter from './components/ion-vue-router.vue';
 import IonVueRouterTransitionless from './components/ion-vue-router-transitionless.vue';
 
diff --git a/tsconfig.json b/tsconfig.json
@@ -5,6 +5,8 @@
     "allowSyntheticDefaultImports": true,
     "allowUnreachableCode": false,
     "declaration": true,
+    "declarationMap": true,
+    "declarationDir": "types",
     "experimentalDecorators": true,
     "forceConsistentCasingInFileNames": true,
     "jsx": "react",
@@ -26,8 +28,10 @@
     "strictPropertyInitialization": false,
     "target": "es5"
   },
-  "files": [
-    "src/index.ts",
-    "src/sfc.d.ts"
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules"
   ]
 }
diff --git a/types/api-utils.d.ts b/types/api-utils.d.ts
@@ -0,0 +1,4 @@
+import { HTMLStencilElement } from './interfaces';
+export declare function proxyMethod(tag: string, method: string, ...opts: any[]): Promise<any>;
+export declare function initController(tag: string): Promise<HTMLStencilElement>;
+//# sourceMappingURL=api-utils.d.ts.map
diff --git a/types/api.d.ts b/types/api.d.ts
@@ -0,0 +1,18 @@
+import { PluginFunction } from 'vue';
+import { ApiCache } from './interfaces';
+import ProxyController from './proxy-controller';
+import ProxyMenuController from './proxy-menu-controller';
+import ProxyDelegateController from './proxy-delegate-controller';
+export default class Api {
+    static cache: ApiCache;
+    static installed: boolean;
+    static install: PluginFunction<never>;
+    readonly actionSheetController: ProxyController;
+    readonly alertController: ProxyController;
+    readonly loadingController: ProxyController;
+    readonly menuController: ProxyMenuController;
+    readonly modalController: ProxyDelegateController;
+    readonly popoverController: ProxyDelegateController;
+    readonly toastController: ProxyController;
+}
+//# sourceMappingURL=api.d.ts.map
diff --git a/types/components/ion-vue-router-transitionless.vue.d.ts b/types/components/ion-vue-router-transitionless.vue.d.ts
@@ -0,0 +1,7 @@
+import CatchIonicGoBack from '../mixins/catch-ionic-go-back';
+declare const IonVueRouter_base: import("vue-class-component/lib/declarations").VueClass<CatchIonicGoBack>;
+export default class IonVueRouter extends IonVueRouter_base {
+    name: string;
+}
+export {};
+//# sourceMappingURL=ion-vue-router-transitionless.vue?rollup-plugin-vue=script.d.ts.map
diff --git a/types/components/ion-vue-router.vue.d.ts b/types/components/ion-vue-router.vue.d.ts
@@ -0,0 +1,25 @@
+import CatchIonicGoBack from '../mixins/catch-ionic-go-back';
+declare const IonVueRouter_base: import("vue-class-component/lib/declarations").VueClass<CatchIonicGoBack>;
+export default class IonVueRouter extends IonVueRouter_base {
+    name: string;
+    bindCSS: boolean;
+    animated: boolean;
+    leavingEl: HTMLElement;
+    enteringEl: HTMLElement;
+    inTransition: boolean;
+    customTransition: boolean;
+    created(): void;
+    transition(enteringEl: HTMLElement, leavingEl: HTMLElement): Promise<boolean> | undefined;
+    getDuration(): 0 | undefined;
+    getDirection(): "forward" | "back";
+    beforeEnter(el: HTMLElement): void;
+    beforeLeave(el: HTMLElement): void;
+    leave(el: HTMLElement, done: (opts?: boolean) => void): void;
+    enter(_el: HTMLElement, done: () => void): void;
+    afterEnter(): void;
+    enterCancelled(): void;
+    afterLeave(): void;
+    leaveCancelled(): void;
+}
+export {};
+//# sourceMappingURL=ion-vue-router.vue?rollup-plugin-vue=script.d.ts.map
diff --git a/types/framework-delegate.d.ts b/types/framework-delegate.d.ts
@@ -0,0 +1,11 @@
+import { VueConstructor } from 'vue';
+import { FrameworkDelegate, HTMLVueElement, WebpackFunction } from './interfaces';
+export default class Delegate implements FrameworkDelegate {
+    vue: VueConstructor;
+    constructor(vue: VueConstructor);
+    attachViewToDom(parentElement: HTMLElement, component: HTMLElement | WebpackFunction | object | VueConstructor, opts?: object, classes?: string[]): Promise<HTMLElement>;
+    removeViewFromDom(_parentElement: HTMLElement, childElement: HTMLVueElement): Promise<void>;
+    vueController(component: WebpackFunction | object | VueConstructor): Promise<VueConstructor>;
+    vueComponent(controller: VueConstructor, opts?: object): import("vue/types/vue").CombinedVueInstance<import("vue/types/vue").Vue, object, object, object, Record<never, any>>;
+}
+//# sourceMappingURL=framework-delegate.d.ts.map
diff --git a/types/index.d.ts b/types/index.d.ts
@@ -0,0 +1,4 @@
+export { default as Ionic } from './ionic';
+export { default as IonicAPI } from './api';
+export { default as IonicVueRouter } from './router';
+//# sourceMappingURL=index.d.ts.map
diff --git a/types/interfaces.d.ts b/types/interfaces.d.ts
diff --git a/types/ionic.d.ts b/types/ionic.d.ts
diff --git a/types/mixins/catch-ionic-go-back.d.ts b/types/mixins/catch-ionic-go-back.d.ts
diff --git a/types/proxy-controller.d.ts b/types/proxy-controller.d.ts
diff --git a/types/proxy-delegate-controller.d.ts b/types/proxy-delegate-controller.d.ts
diff --git a/types/proxy-menu-controller.d.ts b/types/proxy-menu-controller.d.ts
diff --git a/types/router.d.ts b/types/router.d.ts
diff --git a/types/types/interfaces.d.ts b/types/types/interfaces.d.ts

Original file line number	Diff line number	Diff line change
`@@ -52,7 +52,7 @@ function baseConfig() {`
`52`	`52`	`'@ionic/core/dist/ionic/svg',`
`53`	`53`	`'ionicons/dist/collection/icon/icon.css',`
`54`	`54`	`],`
`55`		`- plugins: [vue(), typescript()],`
	`55`	`+ plugins: [vue(), typescript({ useTsconfigDeclarationDir: true })],`
`56`	`56`	`}`
`57`	`57`	`}`
`58`	`58`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { HTMLStencilElement } from './types/interfaces';`
	`1`	`+import { HTMLStencilElement } from './interfaces';`
`2`	`2`
`3`	`3`	`// A proxy method that initializes the controller and calls requested method`
`4`	`4`	`export function proxyMethod(tag: string, method: string, ...opts: any[]): Promise<any> {`
Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,5 @@`
`1`	`1`	`import Vue, { PluginFunction } from 'vue';`
`2`		`-import { ApiCache, FrameworkDelegate } from './types/interfaces';`
	`2`	`+import { ApiCache, FrameworkDelegate } from './interfaces';`
`3`	`3`	`import Delegate from './framework-delegate';`
`4`	`4`	`import ProxyController from './proxy-controller';`
`5`	`5`	`import ProxyMenuController from './proxy-menu-controller';`
`@@ -13,37 +13,37 @@ export default class Api {`
`13`	`13`	`static install: PluginFunction<never>;`
`14`	`14`
`15`	`15`	`// Create or return a ActionSheetController instance`
`16`		`- get actionSheetController(): typeof ProxyController {`
	`16`	`+ get actionSheetController(): ProxyController {`
`17`	`17`	`return getOrCreateController('ion-action-sheet-controller');`
`18`	`18`	`}`
`19`	`19`
`20`	`20`	`// Create or return an AlertController instance`
`21`		`- get alertController(): typeof ProxyController {`
	`21`	`+ get alertController(): ProxyController {`
`22`	`22`	`return getOrCreateController('ion-alert-controller');`
`23`	`23`	`}`
`24`	`24`
`25`	`25`	`// Create or return a LoadingController instance`
`26`		`- get loadingController(): typeof ProxyController {`
	`26`	`+ get loadingController(): ProxyController {`
`27`	`27`	`return getOrCreateController('ion-loading-controller');`
`28`	`28`	`}`
`29`	`29`
`30`	`30`	`// Create or return a MenuController instance`
`31`		`- get menuController(): typeof ProxyMenuController {`
	`31`	`+ get menuController(): ProxyMenuController {`
`32`	`32`	`return getOrCreateMenuController('ion-menu-controller');`
`33`	`33`	`}`
`34`	`34`
`35`	`35`	`// Create or return a ModalController instance`
`36`		`- get modalController(): typeof ProxyDelegateController {`
	`36`	`+ get modalController(): ProxyDelegateController {`
`37`	`37`	`return getOrCreateDelegatedController('ion-modal-controller');`
`38`	`38`	`}`
`39`	`39`
`40`	`40`	`// Create or return a PopoverController instance`
`41`		`- get popoverController(): typeof ProxyDelegateController {`
	`41`	`+ get popoverController(): ProxyDelegateController {`
`42`	`42`	`return getOrCreateDelegatedController('ion-popover-controller');`
`43`	`43`	`}`
`44`	`44`
`45`	`45`	`// Create or return a ToastController instance`
`46`		`- get toastController(): typeof ProxyController {`
	`46`	`+ get toastController(): ProxyController {`
`47`	`47`	`return getOrCreateController('ion-toast-controller');`
`48`	`48`	`}`
`49`	`49`	`}`
`@@ -82,7 +82,7 @@ Api.install = (Vue): void => {`
`82`	`82`	`};`
`83`	`83`
`84`	`84`	`// Get existing Base controller instance or initialize a new one`
`85`		`-function getOrCreateController(tag: string): typeof ProxyController {`
	`85`	`+function getOrCreateController(tag: string): ProxyController {`
`86`	`86`	`if (!Api.cache[tag]) {`
`87`	`87`	`Api.cache[tag] = new ProxyController(tag);`
`88`	`88`	`}`
`@@ -91,7 +91,7 @@ function getOrCreateController(tag: string): typeof ProxyController {`
`91`	`91`	`}`
`92`	`92`
`93`	`93`	`// Get existing Menu controller instance or initialize a new one`
`94`		`-function getOrCreateMenuController(tag: string): typeof ProxyMenuController {`
	`94`	`+function getOrCreateMenuController(tag: string): ProxyMenuController {`
`95`	`95`	`if (!Api.cache[tag]) {`
`96`	`96`	`Api.cache[tag] = new ProxyMenuController(tag);`
`97`	`97`	`}`
`@@ -100,7 +100,7 @@ function getOrCreateMenuController(tag: string): typeof ProxyMenuController {`
`100`	`100`	`}`
`101`	`101`
`102`	`102`	`// Get existing Delegated controller instance or initialize a new one`
`103`		`-function getOrCreateDelegatedController(tag: string): typeof ProxyDelegateController {`
	`103`	`+function getOrCreateDelegatedController(tag: string): ProxyDelegateController {`
`104`	`104`	`if (!Api.cache[tag]) {`
`105`	`105`	`Api.cache[tag] = new ProxyDelegateController(tag, _Delegate);`
`106`	`106`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`import Vue from 'vue';`
`2`		`-import Router from '../router'`
	`2`	`+import Router from '../router';`
`3`	`3`	`import Component from 'vue-class-component';`
`4`		`-import { IonBackButton } from '../types/interfaces';`
	`4`	`+import { IonBackButton } from '../interfaces';`
`5`	`5`
`6`	`6`	`@Component`
`7`	`7`	`export default class CatchIonicGoBack extends Vue {`
`@@ -33,4 +33,4 @@ export default class CatchIonicGoBack extends Vue {`
`33`	`33`	`$router.push(defaultHref);`
`34`	`34`	`}`
`35`	`35`	`}`
`36`		`-};`
	`36`	`+}`