@4i/modal-manager 1.0.31 → 1.0.40

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@4i/modal-manager",
-  "version": "1.0.31",
+  "version": "1.0.40",
   "description": "",
   "main": "src/index.ts",
   "scripts": {

package/readme.md

@@ -13,6 +13,10 @@ This package simplifies the management of multiple modals, popups, notifications
 npm install @4i/modal-manager
 ```
 
+## Example
+
+<a href="https://codesandbox.io/p/github/tonichiga/modal-manager-example/main?layout=%257B%2522sidebarPanel%2522%253A%2522GIT%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clsnqfzod00063p6le9554u03%2522%252C%2522sizes%2522%253A%255B70%252C30%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clsnqfzod00023p6lo9e5ocrg%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clsnqfzod00043p6l5kpjziav%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clsnqfzod00053p6lleknh8sj%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clsnqfzod00023p6lo9e5ocrg%2522%253A%257B%2522id%2522%253A%2522clsnqfzod00023p6lo9e5ocrg%2522%252C%2522tabs%2522%253A%255B%255D%257D%252C%2522clsnqfzod00053p6lleknh8sj%2522%253A%257B%2522id%2522%253A%2522clsnqfzod00053p6lleknh8sj%2522%252C%2522activeTabId%2522%253A%2522clsnqihgr00ht3p6l2nn59nq5%2522%252C%2522tabs%2522%253A%255B%257B%2522type%2522%253A%2522TASK_PORT%2522%252C%2522taskId%2522%253A%2522dev%2522%252C%2522port%2522%253A3000%252C%2522id%2522%253A%2522clsnqihgr00ht3p6l2nn59nq5%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522path%2522%253A%2522%252F%2522%257D%255D%257D%252C%2522clsnqfzod00043p6l5kpjziav%2522%253A%257B%2522id%2522%253A%2522clsnqfzod00043p6l5kpjziav%2522%252C%2522activeTabId%2522%253A%2522clsnqojb3003j3p6m98yg0rzn%2522%252C%2522tabs%2522%253A%255B%257B%2522type%2522%253A%2522TASK_LOG%2522%252C%2522taskId%2522%253A%2522dev%2522%252C%2522id%2522%253A%2522clsnqh362007k3p6lgb90p583%2522%252C%2522mode%2522%253A%2522permanent%2522%257D%252C%257B%2522id%2522%253A%2522clsnqojb3003j3p6m98yg0rzn%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522TERMINAL%2522%252C%2522shellId%2522%253A%2522clsnqojh1001mdjig37kbat9k%2522%257D%255D%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Atrue%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D">Codesandbox</a>
+
 ## Usage
 
 #### Instance methods:

package/src/utils/ModalManager.d.ts

@@ -1,6 +1,7 @@
 import Manager from "./Manager";
 declare class ModalManager extends Manager {
     queue: string[];
+    _openModalStateCallback: null | ((state: boolean) => void);
     constructor();
     create<T>(name: string, payload: {
         modalId: number;
@@ -8,6 +9,7 @@ declare class ModalManager extends Manager {
     }): void;
     call<T>(name: string, data?: T): void;
     close<T>(position?: T): void;
+    getQueueState(): boolean;
     onOpenModalState(callback: (state: boolean) => void): void;
 }
 declare const modal: ModalManager;

package/src/utils/ModalManager.js

@@ -34,6 +34,7 @@ var ModalManager = /** @class */ (function (_super) {
         _this.create = _this.create.bind(_this);
         _this.call = _this.call.bind(_this);
         _this.close = _this.close.bind(_this);
+        _this._openModalStateCallback = null;
         return _this;
     }
     ModalManager.prototype.create = function (name, payload) {
@@ -44,13 +45,20 @@ var ModalManager = /** @class */ (function (_super) {
     ModalManager.prototype.call = function (name, data) {
         this.create(name, { modalId: uniqueID(), data: data });
         this.queue.push(name);
+        this._openModalStateCallback &&
+            this._openModalStateCallback(this.getQueueState());
     };
     ModalManager.prototype.close = function (position) {
         this.emitter.emit(constants.CLOSE, position);
         this.queue.pop();
+        this._openModalStateCallback &&
+            this._openModalStateCallback(this.getQueueState());
+    };
+    ModalManager.prototype.getQueueState = function () {
+        return this.queue.length > 0;
     };
     ModalManager.prototype.onOpenModalState = function (callback) {
-        callback(this.queue.length > 0);
+        this._openModalStateCallback = callback;
     };
     return ModalManager;
 }(Manager_1.default));

package/src/utils/ModalManager.ts

@@ -11,12 +11,14 @@ const constants = {
 
 class ModalManager extends Manager {
   queue: string[] = [];
+  _openModalStateCallback: null | ((state: boolean) => void);
 
   constructor() {
     super();
     this.create = this.create.bind(this);
     this.call = this.call.bind(this);
     this.close = this.close.bind(this);
+    this._openModalStateCallback = null;
   }
 
   create<T>(name: string, payload: { modalId: number; data?: T }) {
@@ -28,15 +30,23 @@ class ModalManager extends Manager {
   call<T>(name: string, data?: T) {
     this.create<T>(name, { modalId: uniqueID(), data });
     this.queue.push(name);
+    this._openModalStateCallback &&
+      this._openModalStateCallback(this.getQueueState());
   }
 
   close<T>(position?: T) {
     this.emitter.emit(constants.CLOSE, position);
     this.queue.pop();
+    this._openModalStateCallback &&
+      this._openModalStateCallback(this.getQueueState());
+  }
+
+  getQueueState() {
+    return this.queue.length > 0;
   }
 
   onOpenModalState(callback: (state: boolean) => void) {
-    callback(this.queue.length > 0);
+    this._openModalStateCallback = callback;
   }
 }