Fix #23: Added to vue instance the plugin name without $.

arthurvasconcelos · Aug 29, 2019 · 15fb0c2 · 15fb0c2
1 parent 1d5f04f
commit 15fb0c2
Show file tree

Hide file tree

Showing 2 changed files with 73 additions and 48 deletions.
diff --git a/src/types/index.d.ts b/src/types/index.d.ts
@@ -1,58 +1,74 @@
 import Vue, { PluginFunction } from 'vue';
 
 export class VueIzitoast {
-  constructor(options?: VueIzitoastOptions);
-
-  static install(): PluginFunction<any>;
-  static init(Vue: Vue): void;
-
-  public show(message: string, title: string, options: VueIzitoastOptions): void;
-  public hide(toast: string | HTMLDivElement | null, options: VueIzitoastOptions): void;
-  public progress(toast: string | HTMLDivElement | null, options: VueIzitoastOptions, callback: () => void): void;
-  public destroy(): void;
-  public info(message: string, title: string, options: VueIzitoastOptions): void;
-  public success(message: string, title: string, options: VueIzitoastOptions): void;
-  public warning(message: string, title: string, options: VueIzitoastOptions): void;
-  public error(message: string, title: string, options: VueIzitoastOptions): void;
-  public question(message: string, title: string, options: VueIzitoastOptions): void;
-  public on<CB>(eventName: string, callback: CB): void;
-  public off<CB>(eventName: string, callback: CB): void;
+    constructor(options?: VueIzitoastOptions);
+
+    static install(): PluginFunction<any>;
+
+    static init(Vue: Vue): void;
+
+    public show(message: string, title: string, options: VueIzitoastOptions): void;
+
+    public hide(toast: string | HTMLDivElement | null, options: VueIzitoastOptions): void;
+
+    public progress(toast: string | HTMLDivElement | null, options: VueIzitoastOptions, callback: () => void): void;
+
+    public destroy(): void;
+
+    public info(message: string, title: string, options: VueIzitoastOptions): void;
+
+    public success(message: string, title: string, options: VueIzitoastOptions): void;
+
+    public warning(message: string, title: string, options: VueIzitoastOptions): void;
+
+    public error(message: string, title: string, options: VueIzitoastOptions): void;
+
+    public question(message: string, title: string, options: VueIzitoastOptions): void;
+
+    public on<CB>(eventName: string, callback: CB): void;
+
+    public off<CB>(eventName: string, callback: CB): void;
 }
 
 export interface VueIzitoastOptions {
-  zindex: number;
-  layout: number;
-  balloon: boolean;
-  close: boolean;
-  closeOnEscape: boolean;
-  rtl: boolean;
-  position: string;
-  timeout: number;
-  animateInside: boolean;
-  drag: boolean;
-  pauseOnHover: boolean;
-  resetOnHover: boolean;
-  transitionIn: string;
-  transitionOut: string;
-  transitionInMobile: string;
-  transitionOutMobile: string;
-  buttons: unknown;
-  inputs: unknown;
-  onOpening: () => void;
-  onOpened: () => void;
-  onClosing: () => void;
-  onClosed: () => void;
+    zindex: number;
+    layout: number;
+    balloon: boolean;
+    close: boolean;
+    closeOnEscape: boolean;
+    rtl: boolean;
+    position: string;
+    timeout: number;
+    animateInside: boolean;
+    drag: boolean;
+    pauseOnHover: boolean;
+    resetOnHover: boolean;
+    transitionIn: string;
+    transitionOut: string;
+    transitionInMobile: string;
+    transitionOutMobile: string;
+    buttons: unknown;
+    inputs: unknown;
+    onOpening: () => void;
+    onOpened: () => void;
+    onClosing: () => void;
+    onClosed: () => void;
 }
 
+// https://vuejs.org/v2/guide/typescript.html#Augmenting-Types-for-Use-with-Plugins
 declare module 'vue/types/vue' {
-  interface Vue {
-    $toast: VueIzitoast;
-    __$VueIzitoastInstance: VueIzitoast;
-  }
+    interface Vue {
+        $toast: VueIzitoast;
+        __$VueIzitoastInstance: VueIzitoast;
+    }
+
+    interface VueConstructor {
+        toast: VueIzitoast;
+    }
 }
 
 declare module 'vue/types/options' {
-  interface ComponentOptions<V extends Vue> {
-    vueIzitoastSettings?: VueIzitoastOptions | VueIzitoast
-  }
+    interface ComponentOptions<V extends Vue> {
+        vueIzitoastSettings?: VueIzitoastOptions | VueIzitoast
+    }
 }
diff --git a/src/vue-izitoast.js b/src/vue-izitoast.js
@@ -61,7 +61,7 @@ export default class VueIziToast {
     _izi = iziToast;
 
     // Public Variables
-    accessorName = '$toast';
+    accessorName = 'toast';
     initialized = false;
 
     constructor(options = {}) {
@@ -188,6 +188,15 @@ export function install(Vue, options = {}) {
         return;
     }
 
+    const newInstance = new VueIziToast(options);
+
+    /**
+     * VueIziToast set 'toast' at Vue protoype object.
+     */
+    Object.defineProperty(Vue.prototype, newInstance.accessorName, {
+        get() { return newInstance; }
+    });
+
     Vue.mixin({
         /**
          * VueIziToast init hook, injected into each instances init hooks list.
@@ -200,13 +209,13 @@ export function install(Vue, options = {}) {
                 instance = parent.__$VueIziToastInstance;
                 instance.init(Vue);
             } else {
-                instance = new VueIziToast(options);
+                instance = newInstance;
             }
 
             if (instance) {
                 // Store helper for internal use
                 this.__$VueIziToastInstance = instance;
-                this[instance.accessorName] = instance;
+                this[`$${instance.accessorName}`] = instance;
             }
         }
     });