@delangle/use-modal - npm Package Compare versions

Comparing version 1.2.0 to 1.3.0

bili.config.ts

@@ -5,10 +5,4 @@ import { Config } from 'bili'
   plugins: {
-    babel: false,
     typescript2: {
-      tsconfigOverride: {
-        compilerOptions: {
-          declaration: false,
-          declarationMap: false,
-        },
-      },
+      useTsconfigDeclarationDir: true,
     },
@@ -15,0 +9,0 @@ },

dist/index.esm.js

 import { __assign } from 'tslib';
-import { useRef, useState, useMemo, useEffect, useCallback, useLayoutEffect } from 'react';
+import { useLayoutEffect, useEffect, useRef, useState, useMemo, useCallback } from 'react';
 
+function _typeof(obj) {
+  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+    _typeof = function (obj) {
+      return typeof obj;
+    };
+  } else {
+    _typeof = function (obj) {
+      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+    };
+  }
+
+  return _typeof(obj);
+}
+
 var ModalState;
+
 (function (ModalState) {
-    ModalState["opening"] = "opening";
-    ModalState["opened"] = "opened";
-    ModalState["closing"] = "closing";
-    ModalState["closed"] = "closed";
+  ModalState["opening"] = "opening";
+  ModalState["opened"] = "opened";
+  ModalState["closing"] = "closing";
+  ModalState["closed"] = "closed";
 })(ModalState || (ModalState = {}));
@@ -14,97 +29,117 @@
 var DEFAULT_CONFIG = {
-    animationDuration: 300,
-    animated: false,
-    persistent: false,
-    open: false,
-    onClose: function () { },
+  animationDuration: 300,
+  animated: false,
+  persistent: false,
+  open: false,
+  onClose: function onClose() {}
 };
-var useSSRLayoutEffect = typeof window === 'object' ? useLayoutEffect : useEffect;
-var useMergedRef = function (ref) {
-    var innerRef = useRef(null);
-    return (ref ? ref : innerRef);
+var useSSRLayoutEffect = (typeof window === "undefined" ? "undefined" : _typeof(window)) === 'object' ? useLayoutEffect : useEffect;
+
+var useMergedRef = function useMergedRef(ref) {
+  var innerRef = useRef(null);
+  return ref ? ref : innerRef;
 };
-var useHasAlreadyBeenOpened = function (open) {
-    var hasAlreadyBeenOpened = useRef(false);
-    if (!hasAlreadyBeenOpened.current && open) {
-        hasAlreadyBeenOpened.current = true;
+
+var useHasAlreadyBeenOpened = function useHasAlreadyBeenOpened(open) {
+  var hasAlreadyBeenOpened = useRef(false);
+
+  if (!hasAlreadyBeenOpened.current && open) {
+    hasAlreadyBeenOpened.current = true;
+  }
+
+  return hasAlreadyBeenOpened.current;
+};
+
+var useDelayedOpen = function useDelayedOpen(open, animated) {
+  var hasAlreadyRendered = useRef(false);
+  var shouldDelayOpening = !hasAlreadyRendered.current && animated && open;
+
+  var _a = useState(!shouldDelayOpening),
+      canBeOpened = _a[0],
+      setCanBeOpened = _a[1];
+
+  useEffect(function () {
+    hasAlreadyRendered.current = true;
+
+    if (!canBeOpened) {
+      setCanBeOpened(true);
     }
-    return hasAlreadyBeenOpened.current;
+  }, [canBeOpened]);
+  return !!(canBeOpened && open);
 };
-var useDelayedOpen = function (open, animated) {
-    var hasAlreadyRendered = useRef(false);
-    var shouldDelayOpening = !hasAlreadyRendered.current && animated && open;
-    var _a = useState(!shouldDelayOpening), canBeOpened = _a[0], setCanBeOpened = _a[1];
-    useEffect(function () {
-        hasAlreadyRendered.current = true;
-        if (!canBeOpened) {
-            setCanBeOpened(true);
-        }
-    }, [canBeOpened]);
-    return !!(canBeOpened && open);
-};
-var useModal = function (baseConfig) {
-    var config = __assign(__assign({}, DEFAULT_CONFIG), baseConfig);
-    var open = useDelayedOpen(config.open, config.animated);
-    var hasAlreadyBeenOpened = useHasAlreadyBeenOpened(open);
-    var domRef = useMergedRef(config.ref);
-    var configRef = useRef(config);
-    var _a = useState(false), isLocalOpened = _a[0], setLocalOpened = _a[1];
-    var state = useMemo(function () {
-        if (!open && !isLocalOpened) {
-            return ModalState.closed;
-        }
-        if (!open && isLocalOpened) {
-            return ModalState.closing;
-        }
-        if (open && !isLocalOpened) {
-            return ModalState.opening;
-        }
-        return ModalState.opened;
-    }, [open, isLocalOpened]);
-    useEffect(function () {
-        configRef.current = config;
-    });
-    useSSRLayoutEffect(function () {
-        if (!configRef.current.animated && open !== isLocalOpened) {
-            setLocalOpened(open);
-        }
-    }, [isLocalOpened, open]);
-    var handleClose = useCallback(function () {
-        configRef.current.onClose();
-    }, []);
-    useEffect(function () {
-        if (configRef.current.animated) {
-            var timeout_1 = setTimeout(function () { return setLocalOpened(open); }, configRef.current.animationDuration);
-            return function () { return clearTimeout(timeout_1); };
-        }
-    }, [open]);
-    useEffect(function () {
-        var handleKeyDown = function (e) {
-            if (!configRef.current.persistent &&
-                configRef.current.open &&
-                e.key === ESCAPE_KEY) {
-                handleClose();
-            }
-        };
-        var handleClick = function (e) {
-            if (!configRef.current.persistent &&
-                state === ModalState.opened &&
-                domRef.current &&
-                !domRef.current.contains(e.target)) {
-                handleClose();
-            }
-        };
-        window.addEventListener('keydown', handleKeyDown);
-        window.addEventListener('click', handleClick);
-        return function () {
-            window.removeEventListener('keydown', handleKeyDown);
-            window.removeEventListener('click', handleClick);
-        };
-    }, [domRef, handleClose, isLocalOpened, state]);
-    return {
-        state: state,
-        close: handleClose,
-        ref: domRef,
-        hasAlreadyBeenOpened: hasAlreadyBeenOpened,
+
+var useModal = function useModal(baseConfig) {
+  var config = __assign(__assign({}, DEFAULT_CONFIG), baseConfig);
+
+  var open = useDelayedOpen(config.open, config.animated);
+  var hasAlreadyBeenOpened = useHasAlreadyBeenOpened(open);
+  var domRef = useMergedRef(config.ref);
+  var configRef = useRef(config);
+
+  var _a = useState(false),
+      isLocalOpened = _a[0],
+      setLocalOpened = _a[1];
+
+  var state = useMemo(function () {
+    if (!open && !isLocalOpened) {
+      return ModalState.closed;
+    }
+
+    if (!open && isLocalOpened) {
+      return ModalState.closing;
+    }
+
+    if (open && !isLocalOpened) {
+      return ModalState.opening;
+    }
+
+    return ModalState.opened;
+  }, [open, isLocalOpened]);
+  useEffect(function () {
+    configRef.current = config;
+  });
+  useSSRLayoutEffect(function () {
+    if (!configRef.current.animated && open !== isLocalOpened) {
+      setLocalOpened(open);
+    }
+  }, [isLocalOpened, open]);
+  var handleClose = useCallback(function () {
+    configRef.current.onClose();
+  }, []);
+  useEffect(function () {
+    if (configRef.current.animated) {
+      var timeout_1 = setTimeout(function () {
+        return setLocalOpened(open);
+      }, configRef.current.animationDuration);
+      return function () {
+        return clearTimeout(timeout_1);
+      };
+    }
+  }, [open]);
+  useEffect(function () {
+    var handleKeyDown = function handleKeyDown(e) {
+      if (!configRef.current.persistent && configRef.current.open && e.key === ESCAPE_KEY) {
+        handleClose();
+      }
     };
+
+    var handleClick = function handleClick(e) {
+      if (!configRef.current.persistent && state === ModalState.opened && domRef.current && !domRef.current.contains(e.target)) {
+        handleClose();
+      }
+    };
+
+    window.addEventListener('keydown', handleKeyDown);
+    window.addEventListener('click', handleClick);
+    return function () {
+      window.removeEventListener('keydown', handleKeyDown);
+      window.removeEventListener('click', handleClick);
+    };
+  }, [domRef, handleClose, isLocalOpened, state]);
+  return {
+    state: state,
+    close: handleClose,
+    ref: domRef,
+    hasAlreadyBeenOpened: hasAlreadyBeenOpened
+  };
 };
@@ -111,0 +146,0 @@

dist/index.js

@@ -8,7 +8,21 @@ 'use strict';
 
+function _typeof(obj) {
+  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+    _typeof = function (obj) {
+      return typeof obj;
+    };
+  } else {
+    _typeof = function (obj) {
+      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+    };
+  }
+
+  return _typeof(obj);
+}
+
 (function (ModalState) {
-    ModalState["opening"] = "opening";
-    ModalState["opened"] = "opened";
-    ModalState["closing"] = "closing";
-    ModalState["closed"] = "closed";
+  ModalState["opening"] = "opening";
+  ModalState["opened"] = "opened";
+  ModalState["closing"] = "closing";
+  ModalState["closed"] = "closed";
 })(exports.ModalState || (exports.ModalState = {}));
@@ -18,99 +32,119 @@
 var DEFAULT_CONFIG = {
-    animationDuration: 300,
-    animated: false,
-    persistent: false,
-    open: false,
-    onClose: function () { },
+  animationDuration: 300,
+  animated: false,
+  persistent: false,
+  open: false,
+  onClose: function onClose() {}
 };
-var useSSRLayoutEffect = typeof window === 'object' ? React.useLayoutEffect : React.useEffect;
-var useMergedRef = function (ref) {
-    var innerRef = React.useRef(null);
-    return (ref ? ref : innerRef);
+var useSSRLayoutEffect = (typeof window === "undefined" ? "undefined" : _typeof(window)) === 'object' ? React.useLayoutEffect : React.useEffect;
+
+var useMergedRef = function useMergedRef(ref) {
+  var innerRef = React.useRef(null);
+  return ref ? ref : innerRef;
 };
-var useHasAlreadyBeenOpened = function (open) {
-    var hasAlreadyBeenOpened = React.useRef(false);
-    if (!hasAlreadyBeenOpened.current && open) {
-        hasAlreadyBeenOpened.current = true;
+
+var useHasAlreadyBeenOpened = function useHasAlreadyBeenOpened(open) {
+  var hasAlreadyBeenOpened = React.useRef(false);
+
+  if (!hasAlreadyBeenOpened.current && open) {
+    hasAlreadyBeenOpened.current = true;
+  }
+
+  return hasAlreadyBeenOpened.current;
+};
+
+var useDelayedOpen = function useDelayedOpen(open, animated) {
+  var hasAlreadyRendered = React.useRef(false);
+  var shouldDelayOpening = !hasAlreadyRendered.current && animated && open;
+
+  var _a = React.useState(!shouldDelayOpening),
+      canBeOpened = _a[0],
+      setCanBeOpened = _a[1];
+
+  React.useEffect(function () {
+    hasAlreadyRendered.current = true;
+
+    if (!canBeOpened) {
+      setCanBeOpened(true);
     }
-    return hasAlreadyBeenOpened.current;
+  }, [canBeOpened]);
+  return !!(canBeOpened && open);
 };
-var useDelayedOpen = function (open, animated) {
-    var hasAlreadyRendered = React.useRef(false);
-    var shouldDelayOpening = !hasAlreadyRendered.current && animated && open;
-    var _a = React.useState(!shouldDelayOpening), canBeOpened = _a[0], setCanBeOpened = _a[1];
-    React.useEffect(function () {
-        hasAlreadyRendered.current = true;
-        if (!canBeOpened) {
-            setCanBeOpened(true);
-        }
-    }, [canBeOpened]);
-    return !!(canBeOpened && open);
-};
-var useModal = function (baseConfig) {
-    var config = tslib.__assign(tslib.__assign({}, DEFAULT_CONFIG), baseConfig);
-    var open = useDelayedOpen(config.open, config.animated);
-    var hasAlreadyBeenOpened = useHasAlreadyBeenOpened(open);
-    var domRef = useMergedRef(config.ref);
-    var configRef = React.useRef(config);
-    var _a = React.useState(false), isLocalOpened = _a[0], setLocalOpened = _a[1];
-    var state = React.useMemo(function () {
-        if (!open && !isLocalOpened) {
-            return exports.ModalState.closed;
-        }
-        if (!open && isLocalOpened) {
-            return exports.ModalState.closing;
-        }
-        if (open && !isLocalOpened) {
-            return exports.ModalState.opening;
-        }
-        return exports.ModalState.opened;
-    }, [open, isLocalOpened]);
-    React.useEffect(function () {
-        configRef.current = config;
-    });
-    useSSRLayoutEffect(function () {
-        if (!configRef.current.animated && open !== isLocalOpened) {
-            setLocalOpened(open);
-        }
-    }, [isLocalOpened, open]);
-    var handleClose = React.useCallback(function () {
-        configRef.current.onClose();
-    }, []);
-    React.useEffect(function () {
-        if (configRef.current.animated) {
-            var timeout_1 = setTimeout(function () { return setLocalOpened(open); }, configRef.current.animationDuration);
-            return function () { return clearTimeout(timeout_1); };
-        }
-    }, [open]);
-    React.useEffect(function () {
-        var handleKeyDown = function (e) {
-            if (!configRef.current.persistent &&
-                configRef.current.open &&
-                e.key === ESCAPE_KEY) {
-                handleClose();
-            }
-        };
-        var handleClick = function (e) {
-            if (!configRef.current.persistent &&
-                state === exports.ModalState.opened &&
-                domRef.current &&
-                !domRef.current.contains(e.target)) {
-                handleClose();
-            }
-        };
-        window.addEventListener('keydown', handleKeyDown);
-        window.addEventListener('click', handleClick);
-        return function () {
-            window.removeEventListener('keydown', handleKeyDown);
-            window.removeEventListener('click', handleClick);
-        };
-    }, [domRef, handleClose, isLocalOpened, state]);
-    return {
-        state: state,
-        close: handleClose,
-        ref: domRef,
-        hasAlreadyBeenOpened: hasAlreadyBeenOpened,
+
+var useModal = function useModal(baseConfig) {
+  var config = tslib.__assign(tslib.__assign({}, DEFAULT_CONFIG), baseConfig);
+
+  var open = useDelayedOpen(config.open, config.animated);
+  var hasAlreadyBeenOpened = useHasAlreadyBeenOpened(open);
+  var domRef = useMergedRef(config.ref);
+  var configRef = React.useRef(config);
+
+  var _a = React.useState(false),
+      isLocalOpened = _a[0],
+      setLocalOpened = _a[1];
+
+  var state = React.useMemo(function () {
+    if (!open && !isLocalOpened) {
+      return exports.ModalState.closed;
+    }
+
+    if (!open && isLocalOpened) {
+      return exports.ModalState.closing;
+    }
+
+    if (open && !isLocalOpened) {
+      return exports.ModalState.opening;
+    }
+
+    return exports.ModalState.opened;
+  }, [open, isLocalOpened]);
+  React.useEffect(function () {
+    configRef.current = config;
+  });
+  useSSRLayoutEffect(function () {
+    if (!configRef.current.animated && open !== isLocalOpened) {
+      setLocalOpened(open);
+    }
+  }, [isLocalOpened, open]);
+  var handleClose = React.useCallback(function () {
+    configRef.current.onClose();
+  }, []);
+  React.useEffect(function () {
+    if (configRef.current.animated) {
+      var timeout_1 = setTimeout(function () {
+        return setLocalOpened(open);
+      }, configRef.current.animationDuration);
+      return function () {
+        return clearTimeout(timeout_1);
+      };
+    }
+  }, [open]);
+  React.useEffect(function () {
+    var handleKeyDown = function handleKeyDown(e) {
+      if (!configRef.current.persistent && configRef.current.open && e.key === ESCAPE_KEY) {
+        handleClose();
+      }
     };
+
+    var handleClick = function handleClick(e) {
+      if (!configRef.current.persistent && state === exports.ModalState.opened && domRef.current && !domRef.current.contains(e.target)) {
+        handleClose();
+      }
+    };
+
+    window.addEventListener('keydown', handleKeyDown);
+    window.addEventListener('click', handleClick);
+    return function () {
+      window.removeEventListener('keydown', handleKeyDown);
+      window.removeEventListener('click', handleClick);
+    };
+  }, [domRef, handleClose, isLocalOpened, state]);
+  return {
+    state: state,
+    close: handleClose,
+    ref: domRef,
+    hasAlreadyBeenOpened: hasAlreadyBeenOpened
+  };
 };
 
 exports.default = useModal;

dist/index.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var tslib=require("tslib"),React=require("react");!function(e){e.opening="opening",e.opened="opened",e.closing="closing",e.closed="closed"}(exports.ModalState||(exports.ModalState={}));var ESCAPE_KEY="Escape",DEFAULT_CONFIG={animationDuration:300,animated:!1,persistent:!1,open:!1,onClose:function(){}},useSSRLayoutEffect="object"==typeof window?React.useLayoutEffect:React.useEffect,useMergedRef=function(e){var t=React.useRef(null);return e||t},useHasAlreadyBeenOpened=function(e){var t=React.useRef(!1);return!t.current&&e&&(t.current=!0),t.current},useDelayedOpen=function(e,t){var n=React.useRef(!1),r=!n.current&&t&&e,a=React.useState(!r),o=a[0],u=a[1];return React.useEffect(function(){n.current=!0,o||u(!0)},[o]),!(!o||!e)},useModal=function(e){var t=tslib.__assign(tslib.__assign({},DEFAULT_CONFIG),e),n=useDelayedOpen(t.open,t.animated),r=useHasAlreadyBeenOpened(n),a=useMergedRef(t.ref),o=React.useRef(t),u=React.useState(!1),c=u[0],s=u[1],i=React.useMemo(function(){return n||c?!n&&c?exports.ModalState.closing:n&&!c?exports.ModalState.opening:exports.ModalState.opened:exports.ModalState.closed},[n,c]);React.useEffect(function(){o.current=t}),useSSRLayoutEffect(function(){o.current.animated||n===c||s(n)},[c,n]);var f=React.useCallback(function(){o.current.onClose()},[]);return React.useEffect(function(){if(o.current.animated){var e=setTimeout(function(){return s(n)},o.current.animationDuration);return function(){return clearTimeout(e)}}},[n]),React.useEffect(function(){var e=function(e){!o.current.persistent&&o.current.open&&e.key===ESCAPE_KEY&&f()},t=function(e){o.current.persistent||i!==exports.ModalState.opened||!a.current||a.current.contains(e.target)||f()};return window.addEventListener("keydown",e),window.addEventListener("click",t),function(){window.removeEventListener("keydown",e),window.removeEventListener("click",t)}},[a,f,c,i]),{state:i,close:f,ref:a,hasAlreadyBeenOpened:r}};exports.default=useModal;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var tslib=require("tslib"),React=require("react");function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}!function(e){e.opening="opening",e.opened="opened",e.closing="closing",e.closed="closed"}(exports.ModalState||(exports.ModalState={}));var ESCAPE_KEY="Escape",DEFAULT_CONFIG={animationDuration:300,animated:!1,persistent:!1,open:!1,onClose:function(){}},useSSRLayoutEffect="object"===("undefined"==typeof window?"undefined":_typeof(window))?React.useLayoutEffect:React.useEffect,useMergedRef=function(e){var t=React.useRef(null);return e||t},useHasAlreadyBeenOpened=function(e){var t=React.useRef(!1);return!t.current&&e&&(t.current=!0),t.current},useDelayedOpen=function(e,t){var n=React.useRef(!1),o=!n.current&&t&&e,r=React.useState(!o),u=r[0],a=r[1];return React.useEffect(function(){n.current=!0,u||a(!0)},[u]),!(!u||!e)},useModal=function(e){var t=tslib.__assign(tslib.__assign({},DEFAULT_CONFIG),e),n=useDelayedOpen(t.open,t.animated),o=useHasAlreadyBeenOpened(n),r=useMergedRef(t.ref),u=React.useRef(t),a=React.useState(!1),c=a[0],s=a[1],i=React.useMemo(function(){return n||c?!n&&c?exports.ModalState.closing:n&&!c?exports.ModalState.opening:exports.ModalState.opened:exports.ModalState.closed},[n,c]);React.useEffect(function(){u.current=t}),useSSRLayoutEffect(function(){u.current.animated||n===c||s(n)},[c,n]);var f=React.useCallback(function(){u.current.onClose()},[]);return React.useEffect(function(){if(u.current.animated){var e=setTimeout(function(){return s(n)},u.current.animationDuration);return function(){return clearTimeout(e)}}},[n]),React.useEffect(function(){var e=function(e){!u.current.persistent&&u.current.open&&e.key===ESCAPE_KEY&&f()},t=function(e){u.current.persistent||i!==exports.ModalState.opened||!r.current||r.current.contains(e.target)||f()};return window.addEventListener("keydown",e),window.addEventListener("click",t),function(){window.removeEventListener("keydown",e),window.removeEventListener("click",t)}},[r,f,c,i]),{state:i,close:f,ref:r,hasAlreadyBeenOpened:o}};exports.default=useModal;
 //# sourceMappingURL=index.min.js.map

dist/typings/index.d.ts

@@ -0,0 +0,0 @@ import useModal from './useModal';

dist/typings/useModal.d.ts

@@ -0,0 +0,0 @@ import { Modal, ModalFullConfig } from './useModal.interface';

dist/typings/useModal.interface.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

package.json

 {
   "name": "@delangle/use-modal",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "React hook for modal management",
@@ -12,6 +12,4 @@ "private": false,
     "clean": "rimraf ./dist",
-    "build": "npm run clean && bili && npm run build:types",
-    "build:dev": "npm run clean && tsc",
-    "build:watch": "npm run clean && tsc --watch",
-    "build:types": "tsc --emitDeclarationOnly",
+    "build": "npm run clean && bili",
+    "build:watch": "npm run clean && bili --watch",
     "test": "jest",
@@ -54,7 +52,7 @@ "test:coverage": "jest --coverage",
     "bili": "^4.8.0",
-    "cross-env": "^5.2.0",
+    "cross-env": "^6.0.0",
     "husky": "^3.0.0",
     "jest": "^24.8.0",
     "lint-staged": "^9.0.1",
-    "react": "^16.9.0",
+    "react": "^16.10.2",
     "react-hooks-testing-library": "^0.6.0",
@@ -61,0 +59,0 @@ "react-test-renderer": "^16.9.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

38932

increased by3.05%

Number of package files

22

increased by10%

Lines of code

691

increased by3.75%

No dependency changes