@4i/modal-manager 1.0.14 → 1.0.30

package/package.json

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

package/readme.md

@@ -31,6 +31,8 @@ create table with methods
 |                                      |
 | close()                              | Close last modals. (default)                          |
 |                                      |
+| haveOpenModal                        | (getter) Is there at least one window open now        |
+|                                      |
 | addEventListener(event, callback)    | Add an event listener to the modal manager.           |
 |                                      |
 | removeEventListener(event, callback) | Remove an event listener from the modal manager.      |
@@ -38,11 +40,12 @@ create table with methods
 
 #### ModalProvider props
 
-| Prop       | Type    | Description                                                                |
-| ---------- | ------- | -------------------------------------------------------------------------- |
-| modalList  | Object  | An object containing modal actions as keys and modal components as values. |
-| className  | string  |                                                                            |
-| isOverflow | boolean | Set "overflow: hidden" on body                                             |
+| Prop               | Type     | Description                                                                |
+| ------------------ | -------- | -------------------------------------------------------------------------- |
+| modalList          | Object   | An object containing modal actions as keys and modal components as values. |
+| className          | string   |                                                                            |
+| isOverflow         | boolean  | Set "overflow: hidden" on body                                             |
+| onModalStateChange | function | Callback function that is called when modal state changes.                 |
 
 #### Define Modal Actions:
 

package/src/components/modal-provider.d.ts

@@ -6,6 +6,10 @@ interface ModalProviderProps {
     modalList: any;
     isOverflow?: boolean;
     className?: string;
+    onModalStateChange?: (modalState: boolean, data: TData[], names: string[]) => void;
 }
-declare const ModalProvider: ({ modalList, isOverflow, className, }: ModalProviderProps) => false | React.JSX.Element[];
+type TData = {
+    [key: string]: any;
+};
+declare const ModalProvider: ({ modalList, isOverflow, className, onModalStateChange, }: ModalProviderProps) => false | React.JSX.Element[];
 export default ModalProvider;

package/src/components/modal-provider.js

@@ -50,10 +50,16 @@ var react_1 = __importStar(require("react"));
 var ModalManager_1 = __importDefault(require("../utils/ModalManager"));
 var ModalManager_2 = __importDefault(require("../utils/ModalManager"));
 var ModalProvider = function (_a) {
-    var modalList = _a.modalList, isOverflow = _a.isOverflow, className = _a.className;
+    var modalList = _a.modalList, isOverflow = _a.isOverflow, className = _a.className, onModalStateChange = _a.onModalStateChange;
     var _b = (0, react_1.useState)([]), data = _b[0], setData = _b[1];
     var _c = (0, react_1.useState)([]), names = _c[0], setNames = _c[1];
     var modalRef = (0, react_1.useRef)([]);
+    (0, react_1.useEffect)(function () {
+        if (!onModalStateChange)
+            return;
+        var modalState = data.length !== 0;
+        onModalStateChange(modalState, data, names);
+    }, [data, names]);
     (0, react_1.useEffect)(function () {
         var handleOpenModal = function (name, data) {
             setData(function (prev) { return __spreadArray(__spreadArray([], prev, true), [data], false); });

package/src/components/modal-provider.tsx

@@ -8,6 +8,11 @@ interface ModalProviderProps {
   modalList: any;
   isOverflow?: boolean;
   className?: string;
+  onModalStateChange?: (
+    modalState: boolean,
+    data: TData[],
+    names: string[]
+  ) => void;
 }
 
 type TData = { [key: string]: any };
@@ -16,11 +21,18 @@ const ModalProvider = ({
   modalList,
   isOverflow,
   className,
+  onModalStateChange,
 }: ModalProviderProps) => {
   const [data, setData] = useState<TData[]>([]);
   const [names, setNames] = useState<string[]>([]);
   const modalRef = useRef<any[]>([]);
 
+  useEffect(() => {
+    if (!onModalStateChange) return;
+    const modalState = data.length !== 0;
+    onModalStateChange(modalState, data, names);
+  }, [data, names]);
+
   useEffect(() => {
     const handleOpenModal = (name: string, data: TData) => {
       setData((prev: TData[]) => [...prev, data]);

package/src/utils/ModalManager.d.ts

@@ -1,5 +1,6 @@
 import Manager from "./Manager";
 declare class ModalManager extends Manager {
+    queue: string[];
     constructor();
     create<T>(name: string, payload: {
         modalId: number;
@@ -7,6 +8,7 @@ declare class ModalManager extends Manager {
     }): void;
     call<T>(name: string, data?: T): void;
     close<T>(position?: T): void;
+    get haveOpenModal(): boolean;
 }
 declare const modal: ModalManager;
 export default modal;

package/src/utils/ModalManager.js

@@ -30,6 +30,7 @@ var ModalManager = /** @class */ (function (_super) {
     __extends(ModalManager, _super);
     function ModalManager() {
         var _this = _super.call(this) || this;
+        _this.queue = [];
         _this.create = _this.create.bind(_this);
         _this.call = _this.call.bind(_this);
         _this.close = _this.close.bind(_this);
@@ -42,10 +43,19 @@ var ModalManager = /** @class */ (function (_super) {
     };
     ModalManager.prototype.call = function (name, data) {
         this.create(name, { modalId: uniqueID(), data: data });
+        this.queue.push(name);
     };
     ModalManager.prototype.close = function (position) {
         this.emitter.emit(constants.CLOSE, position);
+        this.queue.pop();
     };
+    Object.defineProperty(ModalManager.prototype, "haveOpenModal", {
+        get: function () {
+            return this.queue.length > 0;
+        },
+        enumerable: false,
+        configurable: true
+    });
     return ModalManager;
 }(Manager_1.default));
 var modal = new ModalManager();

package/src/utils/ModalManager.ts

@@ -10,6 +10,8 @@ const constants = {
 };
 
 class ModalManager extends Manager {
+  queue: string[] = [];
+
   constructor() {
     super();
     this.create = this.create.bind(this);
@@ -25,10 +27,16 @@ class ModalManager extends Manager {
 
   call<T>(name: string, data?: T) {
     this.create<T>(name, { modalId: uniqueID(), data });
+    this.queue.push(name);
   }
 
   close<T>(position?: T) {
     this.emitter.emit(constants.CLOSE, position);
+    this.queue.pop();
+  }
+
+  get haveOpenModal() {
+    return this.queue.length > 0;
   }
 }