@react-aria/interactions - npm Package Compare versions

Comparing version 3.3.1 to 3.3.2

dist/main.js

@@ -1194,3 +1194,4 @@ var _react2 = require("react");
     ref,
-    onInteractOutside
+    onInteractOutside,
+    isDisabled
   } = props;
@@ -1204,54 +1205,68 @@ let stateRef = useRef({
     let onPointerDown = e => {
+      if (isDisabled) {
+        return;
+      }
+
       if ($f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref)) {
         state.isPointerDown = true;
       }
-    }; // Use pointer events if available. Otherwise, fall back to mouse and touch events.
-
-
+    };
+    /*
+    // FF bug https://bugzilla.mozilla.org/show_bug.cgi?id=1675846 prevents us from using this pointerevent
+    // once it's fixed we can uncomment
+    // Use pointer events if available. Otherwise, fall back to mouse and touch events.
     if (typeof PointerEvent !== 'undefined') {
-      let onPointerUp = e => {
-        if (state.isPointerDown && onInteractOutside && $f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref)) {
+      let onPointerUp = (e) => {
+        if (state.isPointerDown && onInteractOutside && isValidEvent(e, ref)) {
           state.isPointerDown = false;
           onInteractOutside(e);
         }
-      }; // changing these to capture phase fixed combobox
-
-
+      };
+       // changing these to capture phase fixed combobox
       document.addEventListener('pointerdown', onPointerDown, true);
       document.addEventListener('pointerup', onPointerUp, true);
-      return () => {
+       return () => {
         document.removeEventListener('pointerdown', onPointerDown, true);
         document.removeEventListener('pointerup', onPointerUp, true);
       };
-    } else {
-      let onMouseUp = e => {
-        if (state.ignoreEmulatedMouseEvents) {
-          state.ignoreEmulatedMouseEvents = false;
-        } else if (state.isPointerDown && onInteractOutside && $f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref)) {
-          state.isPointerDown = false;
-          onInteractOutside(e);
-        }
-      };
+    } else {*/
 
-      let onTouchEnd = e => {
-        state.ignoreEmulatedMouseEvents = true;
 
-        if (onInteractOutside && state.isPointerDown && $f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref)) {
-          state.isPointerDown = false;
-          onInteractOutside(e);
-        }
-      };
+    let onMouseUp = e => {
+      if (isDisabled) {
+        return;
+      }
 
-      document.addEventListener('mousedown', onPointerDown, true);
-      document.addEventListener('mouseup', onMouseUp, true);
-      document.addEventListener('touchstart', onPointerDown, true);
-      document.addEventListener('touchend', onTouchEnd, true);
-      return () => {
-        document.removeEventListener('mousedown', onPointerDown, true);
-        document.removeEventListener('mouseup', onMouseUp, true);
-        document.removeEventListener('touchstart', onPointerDown, true);
-        document.removeEventListener('touchend', onTouchEnd, true);
-      };
-    }
-  }, [onInteractOutside, ref, state.ignoreEmulatedMouseEvents, state.isPointerDown]);
+      if (state.ignoreEmulatedMouseEvents) {
+        state.ignoreEmulatedMouseEvents = false;
+      } else if (state.isPointerDown && onInteractOutside && $f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref)) {
+        state.isPointerDown = false;
+        onInteractOutside(e);
+      }
+    };
+
+    let onTouchEnd = e => {
+      if (isDisabled) {
+        return;
+      }
+
+      state.ignoreEmulatedMouseEvents = true;
+
+      if (onInteractOutside && state.isPointerDown && $f07e167670fb16f6a9d7f8a0eda7e156$var$isValidEvent(e, ref)) {
+        state.isPointerDown = false;
+        onInteractOutside(e);
+      }
+    };
+
+    document.addEventListener('mousedown', onPointerDown, true);
+    document.addEventListener('mouseup', onMouseUp, true);
+    document.addEventListener('touchstart', onPointerDown, true);
+    document.addEventListener('touchend', onTouchEnd, true);
+    return () => {
+      document.removeEventListener('mousedown', onPointerDown, true);
+      document.removeEventListener('mouseup', onMouseUp, true);
+      document.removeEventListener('touchstart', onPointerDown, true);
+      document.removeEventListener('touchend', onTouchEnd, true);
+    };
+  }, [onInteractOutside, ref, state.ignoreEmulatedMouseEvents, state.isPointerDown, isDisabled]);
 }
@@ -1258,0 +1273,0 @@

dist/module.js

@@ -1143,3 +1143,4 @@ import _react, { useContext, useEffect, useMemo, useRef, useState } from "react";
     ref,
-    onInteractOutside
+    onInteractOutside,
+    isDisabled
   } = props;
@@ -1153,54 +1154,68 @@ let stateRef = useRef({
     let onPointerDown = e => {
+      if (isDisabled) {
+        return;
+      }
+
       if ($e415bb64ab27cb8fbfac2f417412022f$var$isValidEvent(e, ref)) {
         state.isPointerDown = true;
       }
-    }; // Use pointer events if available. Otherwise, fall back to mouse and touch events.
-
-
+    };
+    /*
+    // FF bug https://bugzilla.mozilla.org/show_bug.cgi?id=1675846 prevents us from using this pointerevent
+    // once it's fixed we can uncomment
+    // Use pointer events if available. Otherwise, fall back to mouse and touch events.
     if (typeof PointerEvent !== 'undefined') {
-      let onPointerUp = e => {
-        if (state.isPointerDown && onInteractOutside && $e415bb64ab27cb8fbfac2f417412022f$var$isValidEvent(e, ref)) {
+      let onPointerUp = (e) => {
+        if (state.isPointerDown && onInteractOutside && isValidEvent(e, ref)) {
           state.isPointerDown = false;
           onInteractOutside(e);
         }
-      }; // changing these to capture phase fixed combobox
-
-
+      };
+       // changing these to capture phase fixed combobox
       document.addEventListener('pointerdown', onPointerDown, true);
       document.addEventListener('pointerup', onPointerUp, true);
-      return () => {
+       return () => {
         document.removeEventListener('pointerdown', onPointerDown, true);
         document.removeEventListener('pointerup', onPointerUp, true);
       };
-    } else {
-      let onMouseUp = e => {
-        if (state.ignoreEmulatedMouseEvents) {
-          state.ignoreEmulatedMouseEvents = false;
-        } else if (state.isPointerDown && onInteractOutside && $e415bb64ab27cb8fbfac2f417412022f$var$isValidEvent(e, ref)) {
-          state.isPointerDown = false;
-          onInteractOutside(e);
-        }
-      };
+    } else {*/
 
-      let onTouchEnd = e => {
-        state.ignoreEmulatedMouseEvents = true;
 
-        if (onInteractOutside && state.isPointerDown && $e415bb64ab27cb8fbfac2f417412022f$var$isValidEvent(e, ref)) {
-          state.isPointerDown = false;
-          onInteractOutside(e);
-        }
-      };
+    let onMouseUp = e => {
+      if (isDisabled) {
+        return;
+      }
 
-      document.addEventListener('mousedown', onPointerDown, true);
-      document.addEventListener('mouseup', onMouseUp, true);
-      document.addEventListener('touchstart', onPointerDown, true);
-      document.addEventListener('touchend', onTouchEnd, true);
-      return () => {
-        document.removeEventListener('mousedown', onPointerDown, true);
-        document.removeEventListener('mouseup', onMouseUp, true);
-        document.removeEventListener('touchstart', onPointerDown, true);
-        document.removeEventListener('touchend', onTouchEnd, true);
-      };
-    }
-  }, [onInteractOutside, ref, state.ignoreEmulatedMouseEvents, state.isPointerDown]);
+      if (state.ignoreEmulatedMouseEvents) {
+        state.ignoreEmulatedMouseEvents = false;
+      } else if (state.isPointerDown && onInteractOutside && $e415bb64ab27cb8fbfac2f417412022f$var$isValidEvent(e, ref)) {
+        state.isPointerDown = false;
+        onInteractOutside(e);
+      }
+    };
+
+    let onTouchEnd = e => {
+      if (isDisabled) {
+        return;
+      }
+
+      state.ignoreEmulatedMouseEvents = true;
+
+      if (onInteractOutside && state.isPointerDown && $e415bb64ab27cb8fbfac2f417412022f$var$isValidEvent(e, ref)) {
+        state.isPointerDown = false;
+        onInteractOutside(e);
+      }
+    };
+
+    document.addEventListener('mousedown', onPointerDown, true);
+    document.addEventListener('mouseup', onMouseUp, true);
+    document.addEventListener('touchstart', onPointerDown, true);
+    document.addEventListener('touchend', onTouchEnd, true);
+    return () => {
+      document.removeEventListener('mousedown', onPointerDown, true);
+      document.removeEventListener('mouseup', onMouseUp, true);
+      document.removeEventListener('touchstart', onPointerDown, true);
+      document.removeEventListener('touchend', onTouchEnd, true);
+    };
+  }, [onInteractOutside, ref, state.ignoreEmulatedMouseEvents, state.isPointerDown, isDisabled]);
 }
@@ -1207,0 +1222,0 @@

dist/types.d.ts

@@ -108,2 +108,4 @@ import React, { HTMLAttributes, RefObject, ReactElement, ReactNode, FocusEvent, SyntheticEvent } from "react";
     onInteractOutside?: (e: SyntheticEvent) => void;
+    /** Whether the interact outside events should be disabled. */
+    isDisabled?: boolean;
 }
@@ -110,0 +112,0 @@ /**

package.json

 {
   "name": "@react-aria/interactions",
-  "version": "3.3.1",
+  "version": "3.3.2",
   "description": "Spectrum UI components in React",
@@ -21,3 +21,3 @@ "license": "Apache-2.0",
     "@babel/runtime": "^7.6.2",
-    "@react-aria/utils": "^3.4.0",
+    "@react-aria/utils": "^3.4.1",
     "@react-types/shared": "^3.3.0"
@@ -31,3 +31,3 @@ },
   },
-  "gitHead": "296b5d76442b15a2062c2c3f8f295516601f1845"
+  "gitHead": "f5b429ee8615248f2e3c76754bad2ece83f1c444"
 }

src/useInteractOutside.ts

@@ -22,3 +22,5 @@ /*
   ref: RefObject<Element>,
-  onInteractOutside?: (e: SyntheticEvent) => void
+  onInteractOutside?: (e: SyntheticEvent) => void,
+  /** Whether the interact outside events should be disabled. */
+  isDisabled?: boolean
 }
@@ -31,3 +33,3 @@
 export function useInteractOutside(props: InteractOutsideProps) {
-  let {ref, onInteractOutside} = props;
+  let {ref, onInteractOutside, isDisabled} = props;
   let stateRef = useRef({
@@ -41,2 +43,5 @@ isPointerDown: false,
     let onPointerDown = (e) => {
+      if (isDisabled) {
+        return;
+      }
       if (isValidEvent(e, ref)) {
@@ -46,3 +51,5 @@ state.isPointerDown = true;
     };
-
+    /*
+    // FF bug https://bugzilla.mozilla.org/show_bug.cgi?id=1675846 prevents us from using this pointerevent
+    // once it's fixed we can uncomment
     // Use pointer events if available. Otherwise, fall back to mouse and touch events.
@@ -65,33 +72,38 @@ if (typeof PointerEvent !== 'undefined') {
       };
-    } else {
-      let onMouseUp = (e) => {
-        if (state.ignoreEmulatedMouseEvents) {
-          state.ignoreEmulatedMouseEvents = false;
-        } else if (state.isPointerDown && onInteractOutside && isValidEvent(e, ref)) {
-          state.isPointerDown = false;
-          onInteractOutside(e);
-        }
-      };
+    } else {*/
+    let onMouseUp = (e) => {
+      if (isDisabled) {
+        return;
+      }
+      if (state.ignoreEmulatedMouseEvents) {
+        state.ignoreEmulatedMouseEvents = false;
+      } else if (state.isPointerDown && onInteractOutside && isValidEvent(e, ref)) {
+        state.isPointerDown = false;
+        onInteractOutside(e);
+      }
+    };
 
-      let onTouchEnd = (e) => {
-        state.ignoreEmulatedMouseEvents = true;
-        if (onInteractOutside && state.isPointerDown && isValidEvent(e, ref)) {
-          state.isPointerDown = false;
-          onInteractOutside(e);
-        }
-      };
+    let onTouchEnd = (e) => {
+      if (isDisabled) {
+        return;
+      }
+      state.ignoreEmulatedMouseEvents = true;
+      if (onInteractOutside && state.isPointerDown && isValidEvent(e, ref)) {
+        state.isPointerDown = false;
+        onInteractOutside(e);
+      }
+    };
 
-      document.addEventListener('mousedown', onPointerDown, true);
-      document.addEventListener('mouseup', onMouseUp, true);
-      document.addEventListener('touchstart', onPointerDown, true);
-      document.addEventListener('touchend', onTouchEnd, true);
+    document.addEventListener('mousedown', onPointerDown, true);
+    document.addEventListener('mouseup', onMouseUp, true);
+    document.addEventListener('touchstart', onPointerDown, true);
+    document.addEventListener('touchend', onTouchEnd, true);
 
-      return () => {
-        document.removeEventListener('mousedown', onPointerDown, true);
-        document.removeEventListener('mouseup', onMouseUp, true);
-        document.removeEventListener('touchstart', onPointerDown, true);
-        document.removeEventListener('touchend', onTouchEnd, true);
-      };
-    }
-  }, [onInteractOutside, ref, state.ignoreEmulatedMouseEvents, state.isPointerDown]);
+    return () => {
+      document.removeEventListener('mousedown', onPointerDown, true);
+      document.removeEventListener('mouseup', onMouseUp, true);
+      document.removeEventListener('touchstart', onPointerDown, true);
+      document.removeEventListener('touchend', onTouchEnd, true);
+    };
+  }, [onInteractOutside, ref, state.ignoreEmulatedMouseEvents, state.isPointerDown, isDisabled]);
 }
@@ -98,0 +110,0 @@

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

395646

increased by0.21%

Lines of code

4427

increased by0.98%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• Updated@react-aria/utils@^3.4.1