jenesius-vue-modal - npm Package Compare versions

Comparing version 1.4.6 to 1.4.7

dist/dts/utils/instances.d.ts

 /**
- * last change: 29.11.2021
+ * last change: 05.12.2021
  * МЕТОД ДЛЯ СОХРАНЕНИЯ ЭКЗЕМПЛЯРА МОДАЛЬНОГО ОКНА.
  * ВЫЗЫВАЕТСЯ КАЖДЫЙ РАЗ В МОМЕНТ ИНИЦИАЛИЗАЦИИ.
  *
+ * INSTANCE это не ModalObject. INSTANCE - СБИЛДЕННАЯ VUE КОМПОНЕНТА, КОТОРУЮ ПЕРЕДАЛ
+ * ПОЛЬЗОВАТЕЛЬ
  * * */
-import Modal from "./Modal";
-export declare function saveInstance(id: number, instance: Modal): void;
+import { ModalComponentInterface } from "./types";
+export declare function saveInstance(id: number, instance: ModalComponentInterface): void;
+export declare function getInstance(id: number): ModalComponentInterface;

dist/dts/utils/Modal.d.ts

@@ -32,2 +32,6 @@ /**
     set onclose(func: GuardFunctionWithHandle);
+    /**
+     * @description Return instance of modal component
+     * */
+    get instance(): import("./types").ModalComponentInterface;
 }

dist/dts/utils/ModalError.d.ts

@@ -18,2 +18,3 @@ /**
     static ModalComponentNotProvided(): ModalError;
+    static ModalRouterIntegrationNotInitialized(): ModalError;
 }

dist/dts/utils/state.d.ts

@@ -12,3 +12,3 @@ /**
 import guards from "./guards";
-import Modal from "./Modal";
+import { ModalComponentInterface } from "./types";
 declare const modalQueue: import("vue").Ref<{
@@ -21,5 +21,8 @@ id: number;
     onclose: import("./types").GuardFunctionWithHandle;
+    readonly instance: {
+        [x: string]: any;
+    };
 }[]>;
 interface InstancesStorageInterface {
-    [index: number]: Modal;
+    [index: number]: ModalComponentInterface;
 }
@@ -26,0 +29,0 @@ interface StateInterface {

dist/dts/utils/types.d.ts

 export declare type GuardFunctionWithHandle = () => void | boolean | Promise<boolean>;
 export declare type GuardFunction = () => void | boolean | Promise<boolean>;
 export declare type GuardFunctionPromisify = () => Promise<void>;
+export interface ModalComponentInterface {
+    [name: string]: any;
+}

dist/jenesius-vue-modal.cjs.js

 /*!
-  * jenesius-vue-modal v1.4.6
+  * jenesius-vue-modal v1.4.7
   * (c) 2021 Jenesius
@@ -122,2 +122,5 @@ * @license MIT
     };
+    ModalError.ModalRouterIntegrationNotInitialized = function () {
+        return new ModalError("The integration was not initialized. Please, use useModalRouter.init(router). For more information: https://modal.jenesius.com/docs.html/integration-vue-router#installation");
+    };
     return ModalError;
@@ -261,2 +264,17 @@ }(Error));
 /**
+ * last change: 05.12.2021
+ * МЕТОД ДЛЯ СОХРАНЕНИЯ ЭКЗЕМПЛЯРА МОДАЛЬНОГО ОКНА.
+ * ВЫЗЫВАЕТСЯ КАЖДЫЙ РАЗ В МОМЕНТ ИНИЦИАЛИЗАЦИИ.
+ *
+ * INSTANCE это не ModalObject. INSTANCE - СБИЛДЕННАЯ VUE КОМПОНЕНТА, КОТОРУЮ ПЕРЕДАЛ
+ * ПОЛЬЗОВАТЕЛЬ
+ * * */
+function saveInstance(id, instance) {
+    state$1.instanceStorage[id] = instance;
+}
+function getInstance(id) {
+    return state$1.instanceStorage[id];
+}
+
+/**
  * last change: 25.11.2021
@@ -298,2 +316,12 @@ * */
     });
+    Object.defineProperty(Modal.prototype, "instance", {
+        /**
+         * @description Return instance of modal component
+         * */
+        get: function () {
+            return getInstance(this.id);
+        },
+        enumerable: false,
+        configurable: true
+    });
     Modal.modalId = 0;
@@ -352,12 +380,2 @@ return Modal;
 
-/**
- * last change: 29.11.2021
- * МЕТОД ДЛЯ СОХРАНЕНИЯ ЭКЗЕМПЛЯРА МОДАЛЬНОГО ОКНА.
- * ВЫЗЫВАЕТСЯ КАЖДЫЙ РАЗ В МОМЕНТ ИНИЦИАЛИЗАЦИИ.
- *
- * * */
-function saveInstance(id, instance) {
-    state$1.instanceStorage[id] = instance;
-}
-
 var script$1 = {
@@ -560,2 +578,4 @@ props: {
                     case 0:
+                        if (!state.router)
+                            throw ModalError.ModalRouterIntegrationNotInitialized();
                         isNavigationClosingGuard = false;
@@ -562,0 +582,0 @@ modal = null;

package.json

 {
   "name": "jenesius-vue-modal",
-  "version": "1.4.6",
+  "version": "1.4.7",
   "private": false,
@@ -5,0 +5,0 @@ "description": "Simple modal plugin for Vue3",

README.md

@@ -8,9 +8,11 @@ # Jenesius Vue Modal
 
+- [Full Documentation](https://modal.jenesius.com/docs.html/installation#npm)
 - [Site](https://modal.jenesius.com/)
-- [Documentation](https://modal.jenesius.com/docs.html/installation#npm)
 
+
+![](https://img.shields.io/github/issues/Jenesius/vue-modal)
+![](https://img.shields.io/npm/dw/jenesius-vue-modal)
 ![](https://img.shields.io/github/stars/Jenesius/vue-modal)
 ![Greet everyone](https://github.com/Jenesius/vue-modal/actions/workflows/node.js.yml/badge.svg)
 ![](https://img.shields.io/npm/l/jenesius-vue-modal)
-![](https://img.shields.io/github/package-json/dependency-version/jenesius/vue-modal/vue)
 
@@ -50,12 +52,13 @@ ### Installation
 ```js
-    import {openModal} from "jenesius-vue-modal";
-    import SomeVueComponent from "SomeVueComponent.vue";
+import {openModal} from "jenesius-vue-modal";
+import SomeVueComponent from "SomeVueComponent.vue";
     
-    openModal(SomeVueComponent, props);
+openModal(SomeVueComponent, props);
 ```
 - props will provide in your component, [example](#example-vuemodalcomponent)
 
-Methods return promise, in this case promise is resolved - [modalObject](https://modal.jenesius.com/docs.html/details#modal-object)
+Methods return promise, in this case promise is resolved **modalObject**.
+[More information](https://modal.jenesius.com/docs.html/details#modal-object)
 ```js
-    const modal = await openModal(SomeVueComponent); // {id, close, onclose, closed}
+const modal = await openModal(SomeVueComponent); // {id, close, onclose, closed, instance}
 ```
@@ -71,2 +74,4 @@
 
+[More information](https://modal.jenesius.com/docs.html/methods)
+
 ```js 
@@ -85,3 +90,3 @@ import {openModal, pushModal, closeModal, popModal} from "jenesius-vue-modal"
 ```js
-const modal = await openModal(Modal);
+const modal = await openModal(Modal, {title: "welcome"});
 modal.onclose = () => {
@@ -92,25 +97,44 @@ console.log("Close");
 ```
+or if using function declaration you have access to modal **Instance** by *this*.
+This declaration provide way to view data within the modal in the parent's onclose() method:
 
+```js
+//Modal.vue
+{
+    props: {title: String},
+    data : () => ({info: "Version x.x.x"}),
+    methods: {
+        update(){}
+    }
+}
+//...
+modal.onclose = function(){
+    // Has access to the context of the component instance this.
+    this.title; // "welcome"
+    this.info;  // "Version x.x.x"
+    this.update();
+}
+```
+
 - default component
 
 ```js
-    export default {
-        props: {},
-        data: () => ({isValidate: false}),
-        beforeModalClose(){
-            if (!isValidate) return false; //modal will not be closed while isValidate === false
-            
-        }
+export default {
+    props: {},
+    data: () => ({isValidate: false}),
+    beforeModalClose(){
+        if (!isValidate) return false; //modal will not be closed while isValidate === false
     }
+}
 ```
 - Composition style
 ```js
-    import {onBeforeModalClose} from "jenesius-vue-modal"
-    export default{
-        setup() {
-            onBeforeModalClose(() => {
-                console.log("Close");
-            });
-        }
+import {onBeforeModalClose} from "jenesius-vue-modal"
+export default{
+    setup() {
+        onBeforeModalClose(() => {
+            console.log("Close");
+        });
     }
+}
 ```
@@ -123,6 +147,6 @@
 ```js
-    async beforeModalClose(){
-        await doSome();
-        return false; // This modal can not be closed!
-    }
+async beforeModalClose(){
+    await doSome();
+    return false; // This modal can not be closed!
+}
 ```
@@ -132,7 +156,7 @@ or
 ```js
-    beforeModalClose(){
-        return Promise(resolve => {
-            setTimeout(() => resolve(true), 2000); //Modal will closed after 2 second
-        })
-    }
+beforeModalClose(){
+    return Promise(resolve => {
+        setTimeout(() => resolve(true), 2000); //Modal will closed after 2 second
+    })
+}
 ```
@@ -180,21 +204,21 @@
 ```vue 
-    <template>
-        <p>{{title}}</p>
-    </template>
-    <script>
-        export default {
-            props: {
-                title: String
-            }
+<template>
+    <p>{{title}}</p>
+</template>
+<script>
+    export default {
+        props: {
+            title: String
         }
-    </script>
+    }
+</script>
 ```
 To show this component
 ```js
-    import {openModal} from "jenesius-vue-modal"
-    import WidgeTestModal from "WidgeTestModal.vue";
+import {openModal} from "jenesius-vue-modal"
+import WidgeTestModal from "WidgeTestModal.vue";
 
-    openModal(WidgeTestModal, {
-        title: "Hello World!"
-    });
+openModal(WidgeTestModal, {
+    title: "Hello World!"
+});
 ```
@@ -201,0 +225,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

42770

increased by5.08%

Lines of code

797

increased by4.46%

Number of lines in readme file

221

increased by12.18%

No dependency changes