primereact 10.0.2 → 10.0.4

package/icons/thlarge/index.esm.js

@@ -150,6 +150,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/thlarge/index.js

@@ -171,6 +171,13 @@ this.primereact.icons.thlarge = (function (exports, React, iconbase) {
       value: function equals(obj1, obj2, field) {
         if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
       }
+
+      /**
+       * Compares two JSON objects for deep equality recursively comparing both objects.
+       * @param {*} a the first JSON object
+       * @param {*} b the second JSON object
+       * @returns true if equals, false it not
+       */
     }, {
       key: "deepEquals",
       value: function deepEquals(a, b) {

package/icons/timescircle/index.cjs.js

@@ -174,6 +174,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/timescircle/index.esm.js

@@ -150,6 +150,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/timescircle/index.js

@@ -171,6 +171,13 @@ this.primereact.icons.timescircle = (function (exports, React, iconbase) {
       value: function equals(obj1, obj2, field) {
         if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
       }
+
+      /**
+       * Compares two JSON objects for deep equality recursively comparing both objects.
+       * @param {*} a the first JSON object
+       * @param {*} b the second JSON object
+       * @returns true if equals, false it not
+       */
     }, {
       key: "deepEquals",
       value: function deepEquals(a, b) {

package/icons/trash/index.cjs.js

@@ -174,6 +174,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/trash/index.esm.js

@@ -150,6 +150,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/trash/index.js

@@ -171,6 +171,13 @@ this.primereact.icons.trash = (function (exports, React, iconbase) {
       value: function equals(obj1, obj2, field) {
         if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
       }
+
+      /**
+       * Compares two JSON objects for deep equality recursively comparing both objects.
+       * @param {*} a the first JSON object
+       * @param {*} b the second JSON object
+       * @returns true if equals, false it not
+       */
     }, {
       key: "deepEquals",
       value: function deepEquals(a, b) {

package/icons/undo/index.cjs.js

@@ -174,6 +174,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/undo/index.esm.js

@@ -150,6 +150,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/undo/index.js

@@ -171,6 +171,13 @@ this.primereact.icons.undo = (function (exports, React, iconbase) {
       value: function equals(obj1, obj2, field) {
         if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
       }
+
+      /**
+       * Compares two JSON objects for deep equality recursively comparing both objects.
+       * @param {*} a the first JSON object
+       * @param {*} b the second JSON object
+       * @returns true if equals, false it not
+       */
     }, {
       key: "deepEquals",
       value: function deepEquals(a, b) {

package/icons/upload/index.cjs.js

@@ -174,6 +174,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/upload/index.esm.js

@@ -150,6 +150,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/upload/index.js

@@ -171,6 +171,13 @@ this.primereact.icons.upload = (function (exports, React, iconbase) {
       value: function equals(obj1, obj2, field) {
         if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
       }
+
+      /**
+       * Compares two JSON objects for deep equality recursively comparing both objects.
+       * @param {*} a the first JSON object
+       * @param {*} b the second JSON object
+       * @returns true if equals, false it not
+       */
     }, {
       key: "deepEquals",
       value: function deepEquals(a, b) {

package/icons/windowmaximize/index.cjs.js

@@ -174,6 +174,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/windowmaximize/index.esm.js

@@ -150,6 +150,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/windowmaximize/index.js

@@ -171,6 +171,13 @@ this.primereact.icons.windowmaximize = (function (exports, React, iconbase) {
       value: function equals(obj1, obj2, field) {
         if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
       }
+
+      /**
+       * Compares two JSON objects for deep equality recursively comparing both objects.
+       * @param {*} a the first JSON object
+       * @param {*} b the second JSON object
+       * @returns true if equals, false it not
+       */
     }, {
       key: "deepEquals",
       value: function deepEquals(a, b) {

package/icons/windowminimize/index.cjs.js

@@ -174,6 +174,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/windowminimize/index.esm.js

@@ -150,6 +150,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {

package/icons/windowminimize/index.js

@@ -171,6 +171,13 @@ this.primereact.icons.windowminimize = (function (exports, React, iconbase) {
       value: function equals(obj1, obj2, field) {
         if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
       }
+
+      /**
+       * Compares two JSON objects for deep equality recursively comparing both objects.
+       * @param {*} a the first JSON object
+       * @param {*} b the second JSON object
+       * @returns true if equals, false it not
+       */
     }, {
       key: "deepEquals",
       value: function deepEquals(a, b) {

package/image/image.cjs.js

@@ -4,6 +4,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var utils = require('primereact/utils');
 var PrimeReact = require('primereact/api');
 var componentbase = require('primereact/componentbase');
 var csstransition = require('primereact/csstransition');
@@ -16,7 +17,6 @@ var searchplus = require('primereact/icons/searchplus');
 var times = require('primereact/icons/times');
 var undo = require('primereact/icons/undo');
 var portal = require('primereact/portal');
-var utils = require('primereact/utils');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -152,6 +152,106 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$1(arr, i) || _nonIterableRest();
 }
 
+var usePrevious = function usePrevious(newValue) {
+  var ref = React__namespace.useRef(undefined);
+  React__namespace.useEffect(function () {
+    ref.current = newValue;
+  });
+  return ref.current;
+};
+
+/* eslint-disable */
+var useUnmountEffect = function useUnmountEffect(fn) {
+  return React__namespace.useEffect(function () {
+    return fn;
+  }, []);
+};
+/* eslint-enable */
+
+/* eslint-disable */
+var useEventListener = function useEventListener(_ref) {
+  var _ref$target = _ref.target,
+    target = _ref$target === void 0 ? 'document' : _ref$target,
+    type = _ref.type,
+    listener = _ref.listener,
+    options = _ref.options,
+    _ref$when = _ref.when,
+    when = _ref$when === void 0 ? true : _ref$when;
+  var targetRef = React__namespace.useRef(null);
+  var listenerRef = React__namespace.useRef(null);
+  var prevListener = usePrevious(listener);
+  var prevOptions = usePrevious(options);
+  var bind = function bind() {
+    var bindOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    if (utils.ObjectUtils.isNotEmpty(bindOptions.target)) {
+      unbind();
+      (bindOptions.when || when) && (targetRef.current = utils.DomHandler.getTargetElement(bindOptions.target));
+    }
+    if (!listenerRef.current && targetRef.current) {
+      listenerRef.current = function (event) {
+        return listener && listener(event);
+      };
+      targetRef.current.addEventListener(type, listenerRef.current, options);
+    }
+  };
+  var unbind = function unbind() {
+    if (listenerRef.current) {
+      targetRef.current.removeEventListener(type, listenerRef.current, options);
+      listenerRef.current = null;
+    }
+  };
+  React__namespace.useEffect(function () {
+    if (when) {
+      targetRef.current = utils.DomHandler.getTargetElement(target);
+    } else {
+      unbind();
+      targetRef.current = null;
+    }
+  }, [target, when]);
+  React__namespace.useEffect(function () {
+    // to properly compare functions we can implicitly converting the function to it's body's text as a String
+    if (listenerRef.current && ('' + prevListener !== '' + listener || prevOptions !== options)) {
+      unbind();
+      when && bind();
+    }
+  }, [listener, options, when]);
+  useUnmountEffect(function () {
+    unbind();
+  });
+  return [bind, unbind];
+};
+/* eslint-enable */
+
+var useOnEscapeKey = function useOnEscapeKey(ref, condition, callback) {
+  var handleEsc = function handleEsc(event) {
+    if (event.key === 'Esc' || event.key === 'Escape') {
+      event.stopImmediatePropagation();
+      callback(event);
+    }
+    return;
+  };
+  var _useEventListener = useEventListener({
+      type: 'keydown',
+      listener: handleEsc
+    }),
+    _useEventListener2 = _slicedToArray(_useEventListener, 2),
+    bindKeyDownListener = _useEventListener2[0],
+    unbindKeyDownListener = _useEventListener2[1];
+  React__namespace.useEffect(function () {
+    if (!condition) {
+      return;
+    }
+    if (!ref.current) {
+      return;
+    }
+    bindKeyDownListener();
+    return function () {
+      unbindKeyDownListener();
+    };
+  });
+  return [ref, callback];
+};
+
 function _arrayWithoutHoles(arr) {
   if (Array.isArray(arr)) return _arrayLikeToArray$1(arr);
 }
@@ -204,6 +304,13 @@ var ObjectUtils = /*#__PURE__*/function () {
     value: function equals(obj1, obj2, field) {
       if (field && obj1 && _typeof(obj1) === 'object' && obj2 && _typeof(obj2) === 'object') return this.resolveFieldData(obj1, field) === this.resolveFieldData(obj2, field);else return this.deepEquals(obj1, obj2);
     }
+
+    /**
+     * Compares two JSON objects for deep equality recursively comparing both objects.
+     * @param {*} a the first JSON object
+     * @param {*} b the second JSON object
+     * @returns true if equals, false it not
+     */
   }, {
     key: "deepEquals",
     value: function deepEquals(a, b) {
@@ -731,7 +838,7 @@ var classes = {
   },
   transition: 'p-image-preview'
 };
-var styles = "\n@layer primereact {\n    .p-image-mask {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n    \n    .p-image-preview-container {\n        position: relative;\n        display: inline-block;\n    }\n    \n    .p-image-preview-indicator {\n        position: absolute;\n        left: 0;\n        top: 0;\n        width: 100%;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        opacity: 0;\n        transition: opacity .3s;\n    }\n    \n    .p-image-preview-icon {\n        font-size: 1.5rem;\n    }\n    \n    .p-image-preview-container:hover > .p-image-preview-indicator {\n        opacity: 1;\n        cursor: pointer;\n    }\n    \n    .p-image-preview-container > img {\n        cursor: pointer;\n    }\n    \n    .p-image-toolbar {\n        position: absolute;\n        top: 0;\n        right: 0;\n        display: flex;\n        z-index: 1;\n    }\n    \n    .p-image-action.p-link {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n    \n    .p-image-preview {\n        transition: transform .15s;\n        max-width: 100vw;\n        max-height: 100vh;\n        width: 100%;\n        height: 100%;\n    }\n    \n    .p-image-preview-enter {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n    \n    .p-image-preview-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n    \n    .p-image-preview-enter-done {\n        transform: none;\n    }\n    \n    .p-image-preview-exit {\n        opacity: 1;\n    }\n    \n    .p-image-preview-exit-active {\n        opacity: 0;\n        transform: scale(0.7);\n        transition: all 150ms cubic-bezier(0.4, 0.0, 0.2, 1);\n    }\n}\n";
+var styles = "\n@layer primereact {\n    .p-image-mask {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n    \n    .p-image-preview-container {\n        position: relative;\n        display: inline-block;\n        line-height: 0;\n    }\n    \n    .p-image-preview-indicator {\n        position: absolute;\n        left: 0;\n        top: 0;\n        width: 100%;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        opacity: 0;\n        transition: opacity .3s;\n        border: none;\n        padding: 0;\n    }\n    \n    .p-image-preview-icon {\n        font-size: 1.5rem;\n    }\n    \n    .p-image-preview-container:hover > .p-image-preview-indicator {\n        opacity: 1;\n        cursor: pointer;\n    }\n    \n    .p-image-preview-container > img {\n        cursor: pointer;\n    }\n    \n    .p-image-toolbar {\n        position: absolute;\n        top: 0;\n        right: 0;\n        display: flex;\n        z-index: 1;\n    }\n    \n    .p-image-action.p-link {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n    \n    .p-image-preview {\n        transition: transform .15s;\n        max-width: 100vw;\n        max-height: 100vh;\n        width: 100%;\n        height: 100%;\n    }\n    \n    .p-image-preview-enter {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n    \n    .p-image-preview-enter-active {\n        opacity: 1;\n        transform: scale(1);\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n    \n    .p-image-preview-enter-done {\n        transform: none;\n    }\n    \n    .p-image-preview-exit {\n        opacity: 1;\n    }\n    \n    .p-image-preview-exit-active {\n        opacity: 0;\n        transform: scale(0.7);\n        transition: all 150ms cubic-bezier(0.4, 0.0, 0.2, 1);\n    }\n}\n";
 var inlineStyles = {
   preview: function preview(_ref2) {
     var rotateState = _ref2.rotateState,
@@ -780,106 +887,6 @@ var ImageBase = componentbase.ComponentBase.extend({
   }
 });
 
-var usePrevious = function usePrevious(newValue) {
-  var ref = React__namespace.useRef(undefined);
-  React__namespace.useEffect(function () {
-    ref.current = newValue;
-  });
-  return ref.current;
-};
-
-/* eslint-disable */
-var useUnmountEffect = function useUnmountEffect(fn) {
-  return React__namespace.useEffect(function () {
-    return fn;
-  }, []);
-};
-/* eslint-enable */
-
-/* eslint-disable */
-var useEventListener = function useEventListener(_ref) {
-  var _ref$target = _ref.target,
-    target = _ref$target === void 0 ? 'document' : _ref$target,
-    type = _ref.type,
-    listener = _ref.listener,
-    options = _ref.options,
-    _ref$when = _ref.when,
-    when = _ref$when === void 0 ? true : _ref$when;
-  var targetRef = React__namespace.useRef(null);
-  var listenerRef = React__namespace.useRef(null);
-  var prevListener = usePrevious(listener);
-  var prevOptions = usePrevious(options);
-  var bind = function bind() {
-    var bindOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    if (utils.ObjectUtils.isNotEmpty(bindOptions.target)) {
-      unbind();
-      (bindOptions.when || when) && (targetRef.current = utils.DomHandler.getTargetElement(bindOptions.target));
-    }
-    if (!listenerRef.current && targetRef.current) {
-      listenerRef.current = function (event) {
-        return listener && listener(event);
-      };
-      targetRef.current.addEventListener(type, listenerRef.current, options);
-    }
-  };
-  var unbind = function unbind() {
-    if (listenerRef.current) {
-      targetRef.current.removeEventListener(type, listenerRef.current, options);
-      listenerRef.current = null;
-    }
-  };
-  React__namespace.useEffect(function () {
-    if (when) {
-      targetRef.current = utils.DomHandler.getTargetElement(target);
-    } else {
-      unbind();
-      targetRef.current = null;
-    }
-  }, [target, when]);
-  React__namespace.useEffect(function () {
-    // to properly compare functions we can implicitly converting the function to it's body's text as a String
-    if (listenerRef.current && ('' + prevListener !== '' + listener || prevOptions !== options)) {
-      unbind();
-      when && bind();
-    }
-  }, [listener, options, when]);
-  useUnmountEffect(function () {
-    unbind();
-  });
-  return [bind, unbind];
-};
-/* eslint-enable */
-
-var useOnEscapeKey = function useOnEscapeKey(ref, condition, callback) {
-  var handleEsc = function handleEsc(event) {
-    if (event.key === 'Esc' || event.key === 'Escape') {
-      event.stopImmediatePropagation();
-      callback(event);
-    }
-    return;
-  };
-  var _useEventListener = useEventListener({
-      type: 'keydown',
-      listener: handleEsc
-    }),
-    _useEventListener2 = _slicedToArray(_useEventListener, 2),
-    bindKeyDownListener = _useEventListener2[0],
-    unbindKeyDownListener = _useEventListener2[1];
-  React__namespace.useEffect(function () {
-    if (!condition) {
-      return;
-    }
-    if (!ref.current) {
-      return;
-    }
-    bindKeyDownListener();
-    return function () {
-      unbindKeyDownListener();
-    };
-  });
-  return [ref, callback];
-};
-
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Image = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
@@ -928,8 +935,7 @@ var Image = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.fo
   var show = function show() {
     if (props.preview) {
       setMaskVisibleState(true);
-      utils.DomHandler.addClass(document.body, 'p-overflow-hidden');
-      document.body.style.setProperty('--scrollbar-width', utils.DomHandler.calculateScrollbarWidth() + 'px');
+      utils.DomHandler.blockBodyScroll();
       setTimeout(function () {
         setPreviewVisibleState(true);
       }, 25);
@@ -938,8 +944,7 @@ var Image = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.fo
   var hide = function hide() {
     if (!previewClick.current) {
       setPreviewVisibleState(false);
-      utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
-      document.body.style.removeProperty('--scrollbar-width');
+      utils.DomHandler.unblockBodyScroll();
       setRotateState(0);
       setScaleState(1);
     }