@faceless-ui/modal - npm Package Compare versions

Comparing version 2.0.0 to 2.0.1

dist/ModalProvider/context.d.ts

@@ -6,2 +6,3 @@ /// <reference types="react" />
     isOpen: boolean;
+    openedOn?: number;
 };
@@ -8,0 +9,0 @@ export declare type ModalState = {

dist/ModalProvider/generateCSS.d.ts

 declare const CSS: ({ classPrefix, zIndex, }: {
     classPrefix?: string | undefined;
-    zIndex: number;
+    zIndex: number | string;
 }) => string;
 export default CSS;

dist/ModalProvider/index.d.ts

@@ -9,3 +9,3 @@ import React from 'react';
     transTime?: number;
-    zIndex?: number;
+    zIndex?: number | string;
     children?: React.ReactNode;
@@ -12,0 +12,0 @@ };

dist/ModalProvider/index.js

@@ -73,2 +73,3 @@ "use strict";
                 isOpen: true,
+                openedOn: Date.now(),
             };
@@ -83,6 +84,7 @@ return acc;
     var _j = (0, react_1.useState)(''), cssString = _j[0], setCSSString = _j[1];
+    var escIsBound = (0, react_1.useRef)(false);
     var bindEsc = (0, react_1.useCallback)(function (e) {
         if (e.keyCode === 27) {
             dispatchModalState({
-                type: 'CLOSE_ALL_MODALS',
+                type: 'CLOSE_LATEST_MODAL',
             });
@@ -93,4 +95,11 @@ }
     (0, react_1.useEffect)(function () {
-        document.addEventListener('keydown', function (e) { return bindEsc(e); }, false);
-        return function () { return document.removeEventListener('keydown', function (e) { return bindEsc(e); }, false); };
+        if (!escIsBound.current) {
+            document.addEventListener('keydown', function (e) { return bindEsc(e); }, false);
+            escIsBound.current = true;
+        }
+        return function () {
+            if (escIsBound.current) {
+                document.removeEventListener('keydown', function (e) { return bindEsc(e); }, false);
+            }
+        };
     }, [bindEsc]);
@@ -97,0 +106,0 @@ // Generate CSS to inject into stylesheet

dist/ModalProvider/reducer.d.ts

@@ -30,2 +30,6 @@ import { ModalStatus, ModalState } from './context';
 };
+export declare type CLOSE_LATEST_MODAL = {
+    type: 'CLOSE_LATEST_MODAL';
+    payload?: undefined;
+};
 export declare type CLOSE_ALL_MODALS = {
@@ -35,4 +39,4 @@ type: 'CLOSE_ALL_MODALS';
 };
-export declare type Action = UPDATE_MODAL | OPEN_MODAL | REMOVE_MODAL | CLOSE_MODAL | TOGGLE_MODAL | CLOSE_ALL_MODALS;
+export declare type Action = UPDATE_MODAL | OPEN_MODAL | REMOVE_MODAL | CLOSE_MODAL | TOGGLE_MODAL | CLOSE_LATEST_MODAL | CLOSE_ALL_MODALS;
 declare const reducer: (state: ModalState, action: Action) => ModalState;
 export default reducer;

dist/ModalProvider/reducer.js

@@ -30,3 +30,3 @@ "use strict";
                 if (!isCurrentlyOpen) {
-                    newState[slug] = __assign(__assign({}, newState[slug]), { isOpen: true });
+                    newState[slug] = __assign(__assign({}, newState[slug]), { slug: slug, openedOn: Date.now(), isOpen: true });
                 }
@@ -40,3 +40,3 @@ }
                 var isCurrentlyOpen = slug in newState && newState[slug].isOpen;
-                newState[slug] = __assign(__assign({}, newState[slug]), { isOpen: !isCurrentlyOpen });
+                newState[slug] = __assign(__assign({}, newState[slug]), { slug: slug, openedOn: !isCurrentlyOpen ? Date.now() : undefined, isOpen: !isCurrentlyOpen });
             }
@@ -48,3 +48,3 @@ break;
             if (slug) {
-                newState[slug] = __assign(__assign({}, newState[slug]), { isOpen: false });
+                newState[slug] = __assign(__assign({}, newState[slug]), { slug: slug, openedOn: undefined, isOpen: false });
             }
@@ -60,6 +60,20 @@ break;
         }
+        case 'CLOSE_LATEST_MODAL': {
+            var latestModal = Object.keys(newState)
+                .reduce(function (acc, slug) {
+                var modal = newState[slug];
+                if (modal.isOpen && typeof modal.openedOn === 'number' && (!acc || (typeof acc.openedOn === 'number' && modal.openedOn > acc.openedOn))) {
+                    return modal;
+                }
+                return acc;
+            }, undefined);
+            if (latestModal) {
+                newState[latestModal.slug] = __assign(__assign({}, newState[latestModal.slug]), { isOpen: false, openedOn: undefined });
+            }
+            break;
+        }
         case 'CLOSE_ALL_MODALS': {
             newState = Object.entries((newState)).reduce(function (acc, _a) {
                 var key = _a[0], value = _a[1];
-                acc[key] = __assign(__assign({}, value), { isOpen: false });
+                acc[key] = __assign(__assign({}, value), { isOpen: false, openedOn: undefined });
                 return acc;
@@ -66,0 +80,0 @@ }, {});

package.json

 {
   "name": "@faceless-ui/modal",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "main": "dist/index.js",
@@ -5,0 +5,0 @@ "types": "dist/index.d.ts",

No alert changes

Improved metrics

Total package byte prevSize

70876

increased by3.21%

Lines of code

1030

increased by2.79%

No dependency changes