@react-aria/interactions - npm Package Compare versions

Comparing version 3.0.0-nightly-086ad3115-240912 to 3.0.0-nightly-0ddbe6f95-241019

dist/textSelection.main.js

@@ -29,3 +29,2 @@ var $20aJV$reactariautils = require("@react-aria/utils");
         if ($f7e14e656343df57$var$state === 'default') {
-            // eslint-disable-next-line no-restricted-globals
             const documentObject = (0, $20aJV$reactariautils.getOwnerDocument)(target);
@@ -57,3 +56,2 @@ $f7e14e656343df57$var$savedUserSelect = documentObject.documentElement.style.webkitUserSelect;
                 if ($f7e14e656343df57$var$state === 'restoring') {
-                    // eslint-disable-next-line no-restricted-globals
                     const documentObject = (0, $20aJV$reactariautils.getOwnerDocument)(target);
@@ -60,0 +58,0 @@ if (documentObject.documentElement.style.webkitUserSelect === 'none') documentObject.documentElement.style.webkitUserSelect = $f7e14e656343df57$var$savedUserSelect || '';

dist/textSelection.module.js

@@ -22,3 +22,2 @@ import {isIOS as $7R18e$isIOS, getOwnerDocument as $7R18e$getOwnerDocument, runAfterTransition as $7R18e$runAfterTransition} from "@react-aria/utils";
         if ($14c0b72509d70225$var$state === 'default') {
-            // eslint-disable-next-line no-restricted-globals
             const documentObject = (0, $7R18e$getOwnerDocument)(target);
@@ -50,3 +49,2 @@ $14c0b72509d70225$var$savedUserSelect = documentObject.documentElement.style.webkitUserSelect;
                 if ($14c0b72509d70225$var$state === 'restoring') {
-                    // eslint-disable-next-line no-restricted-globals
                     const documentObject = (0, $7R18e$getOwnerDocument)(target);
@@ -53,0 +51,0 @@ if (documentObject.documentElement.style.webkitUserSelect === 'none') documentObject.documentElement.style.webkitUserSelect = $14c0b72509d70225$var$savedUserSelect || '';

dist/usePress.main.js

@@ -271,3 +271,3 @@ var $f7e14e656343df57$exports = require("./textSelection.main.js");
                 // default on pointer down and handle focusing the pressable element ourselves.
-                if ($0294ea432cd92340$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
+                if ($0294ea432cd92340$var$shouldPreventDefaultDown(e.currentTarget)) e.preventDefault();
                 state.pointerType = e.pointerType;
@@ -295,3 +295,3 @@ let shouldStopPropagation = true;
                     // focus event will be fired.
-                    if ($0294ea432cd92340$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
+                    if ($0294ea432cd92340$var$shouldPreventDefaultDown(e.currentTarget)) e.preventDefault();
                     e.stopPropagation();
@@ -334,4 +334,19 @@ }
                     if (!allowTextSelectionOnPress) (0, $f7e14e656343df57$exports.restoreTextSelection)(state.target);
+                    // Prevent subsequent touchend event from triggering onClick on unrelated elements on Android. See below.
+                    // Both 'touch' and 'pen' pointerTypes trigger onTouchEnd, but 'mouse' does not.
+                    if ('ontouchend' in state.target && e.pointerType !== 'mouse') addGlobalListener(state.target, 'touchend', onTouchEnd, {
+                        once: true
+                    });
                 }
             };
+            // This is a workaround for an Android Chrome/Firefox issue where click events are fired on an incorrect element
+            // if the original target is removed during onPointerUp (before onClick).
+            // https://github.com/adobe/react-spectrum/issues/1513
+            // https://issues.chromium.org/issues/40732224
+            // Note: this event must be registered directly on the element, not via React props in order to work.
+            // https://github.com/facebook/react/issues/9809
+            let onTouchEnd = (e)=>{
+                // Don't preventDefault if we actually want the default (e.g. submit/link click).
+                if ($0294ea432cd92340$var$shouldPreventDefaultUp(e.currentTarget)) e.preventDefault();
+            };
             let onPointerCancel = (e)=>{
@@ -351,3 +366,3 @@ cancel(e);
                 // default on mouse down and handle focusing the pressable element ourselves.
-                if ($0294ea432cd92340$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
+                if ($0294ea432cd92340$var$shouldPreventDefaultDown(e.currentTarget)) e.preventDefault();
                 if (state.ignoreEmulatedMouseEvents) {
@@ -493,3 +508,2 @@ e.stopPropagation();
     // Remove user-select: none in case component unmounts immediately after pressStart
-    // eslint-disable-next-line arrow-body-style
     (0, $bBqCQ$react.useEffect)(()=>{
@@ -590,8 +604,8 @@ return ()=>{
 }
-function $0294ea432cd92340$var$shouldPreventDefault(target) {
+function $0294ea432cd92340$var$shouldPreventDefaultDown(target) {
     // We cannot prevent default if the target is a draggable element.
     return !(target instanceof HTMLElement) || !target.hasAttribute('draggable');
 }
-function $0294ea432cd92340$var$shouldPreventDefaultKeyboard(target, key) {
-    if (target instanceof HTMLInputElement) return !$0294ea432cd92340$var$isValidInputKey(target, key);
+function $0294ea432cd92340$var$shouldPreventDefaultUp(target) {
+    if (target instanceof HTMLInputElement) return false;
     if (target instanceof HTMLButtonElement) return target.type !== 'submit' && target.type !== 'reset';
@@ -601,2 +615,6 @@ if ($0294ea432cd92340$var$isHTMLAnchorLink(target)) return false;
 }
+function $0294ea432cd92340$var$shouldPreventDefaultKeyboard(target, key) {
+    if (target instanceof HTMLInputElement) return !$0294ea432cd92340$var$isValidInputKey(target, key);
+    return $0294ea432cd92340$var$shouldPreventDefaultUp(target);
+}
 const $0294ea432cd92340$var$nonTextInputTypes = new Set([
@@ -603,0 +621,0 @@ 'checkbox',

dist/usePress.module.js

@@ -265,3 +265,3 @@ import {disableTextSelection as $14c0b72509d70225$export$16a4697467175487, restoreTextSelection as $14c0b72509d70225$export$b0d6fa1ab32e3295} from "./textSelection.module.js";
                 // default on pointer down and handle focusing the pressable element ourselves.
-                if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
+                if ($f6c31cce2adf654f$var$shouldPreventDefaultDown(e.currentTarget)) e.preventDefault();
                 state.pointerType = e.pointerType;
@@ -289,3 +289,3 @@ let shouldStopPropagation = true;
                     // focus event will be fired.
-                    if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
+                    if ($f6c31cce2adf654f$var$shouldPreventDefaultDown(e.currentTarget)) e.preventDefault();
                     e.stopPropagation();
@@ -328,4 +328,19 @@ }
                     if (!allowTextSelectionOnPress) (0, $14c0b72509d70225$export$b0d6fa1ab32e3295)(state.target);
+                    // Prevent subsequent touchend event from triggering onClick on unrelated elements on Android. See below.
+                    // Both 'touch' and 'pen' pointerTypes trigger onTouchEnd, but 'mouse' does not.
+                    if ('ontouchend' in state.target && e.pointerType !== 'mouse') addGlobalListener(state.target, 'touchend', onTouchEnd, {
+                        once: true
+                    });
                 }
             };
+            // This is a workaround for an Android Chrome/Firefox issue where click events are fired on an incorrect element
+            // if the original target is removed during onPointerUp (before onClick).
+            // https://github.com/adobe/react-spectrum/issues/1513
+            // https://issues.chromium.org/issues/40732224
+            // Note: this event must be registered directly on the element, not via React props in order to work.
+            // https://github.com/facebook/react/issues/9809
+            let onTouchEnd = (e)=>{
+                // Don't preventDefault if we actually want the default (e.g. submit/link click).
+                if ($f6c31cce2adf654f$var$shouldPreventDefaultUp(e.currentTarget)) e.preventDefault();
+            };
             let onPointerCancel = (e)=>{
@@ -345,3 +360,3 @@ cancel(e);
                 // default on mouse down and handle focusing the pressable element ourselves.
-                if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
+                if ($f6c31cce2adf654f$var$shouldPreventDefaultDown(e.currentTarget)) e.preventDefault();
                 if (state.ignoreEmulatedMouseEvents) {
@@ -487,3 +502,2 @@ e.stopPropagation();
     // Remove user-select: none in case component unmounts immediately after pressStart
-    // eslint-disable-next-line arrow-body-style
     (0, $7mdmh$useEffect)(()=>{
@@ -584,8 +598,8 @@ return ()=>{
 }
-function $f6c31cce2adf654f$var$shouldPreventDefault(target) {
+function $f6c31cce2adf654f$var$shouldPreventDefaultDown(target) {
     // We cannot prevent default if the target is a draggable element.
     return !(target instanceof HTMLElement) || !target.hasAttribute('draggable');
 }
-function $f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(target, key) {
-    if (target instanceof HTMLInputElement) return !$f6c31cce2adf654f$var$isValidInputKey(target, key);
+function $f6c31cce2adf654f$var$shouldPreventDefaultUp(target) {
+    if (target instanceof HTMLInputElement) return false;
     if (target instanceof HTMLButtonElement) return target.type !== 'submit' && target.type !== 'reset';
@@ -595,2 +609,6 @@ if ($f6c31cce2adf654f$var$isHTMLAnchorLink(target)) return false;
 }
+function $f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(target, key) {
+    if (target instanceof HTMLInputElement) return !$f6c31cce2adf654f$var$isValidInputKey(target, key);
+    return $f6c31cce2adf654f$var$shouldPreventDefaultUp(target);
+}
 const $f6c31cce2adf654f$var$nonTextInputTypes = new Set([
@@ -597,0 +615,0 @@ 'checkbox',

dist/utils.main.js

@@ -58,3 +58,2 @@ var $iJhOP$react = require("react");
     // Clean up MutationObserver on unmount. See below.
-    // eslint-disable-next-line arrow-body-style
     (0, $iJhOP$reactariautils.useLayoutEffect)(()=>{
@@ -61,0 +60,0 @@ const state = stateRef.current;

dist/utils.module.js

@@ -52,3 +52,2 @@ import {useRef as $6dfIe$useRef, useCallback as $6dfIe$useCallback} from "react";
     // Clean up MutationObserver on unmount. See below.
-    // eslint-disable-next-line arrow-body-style
     (0, $6dfIe$useLayoutEffect)(()=>{
@@ -55,0 +54,0 @@ const state = stateRef.current;

package.json

 {
   "name": "@react-aria/interactions",
-  "version": "3.0.0-nightly-086ad3115-240912",
+  "version": "3.0.0-nightly-0ddbe6f95-241019",
   "description": "Spectrum UI components in React",
@@ -25,5 +25,5 @@ "license": "Apache-2.0",
   "dependencies": {
-    "@react-aria/ssr": "^3.0.0-nightly-086ad3115-240912",
-    "@react-aria/utils": "^3.0.0-nightly-086ad3115-240912",
-    "@react-types/shared": "^3.0.0-nightly-086ad3115-240912",
+    "@react-aria/ssr": "^3.0.0-nightly-0ddbe6f95-241019",
+    "@react-aria/utils": "^3.0.0-nightly-0ddbe6f95-241019",
+    "@react-types/shared": "^3.0.0-nightly-0ddbe6f95-241019",
     "@swc/helpers": "^0.5.0"
@@ -37,3 +37,3 @@ },
   },
-  "stableVersion": "3.22.2"
+  "stableVersion": "3.22.4"
 }

src/textSelection.ts

@@ -39,3 +39,3 @@ /*
     if (state === 'default') {
-      // eslint-disable-next-line no-restricted-globals
+       
       const documentObject = getOwnerDocument(target);
@@ -73,3 +73,3 @@ savedUserSelect = documentObject.documentElement.style.webkitUserSelect;
         if (state === 'restoring') {
-          // eslint-disable-next-line no-restricted-globals
+           
           const documentObject = getOwnerDocument(target);
@@ -76,0 +76,0 @@ if (documentObject.documentElement.style.webkitUserSelect === 'none') {

src/usePress.ts

@@ -413,3 +413,3 @@ /*
         // default on pointer down and handle focusing the pressable element ourselves.
-        if (shouldPreventDefault(e.currentTarget as Element)) {
+        if (shouldPreventDefaultDown(e.currentTarget as Element)) {
           e.preventDefault();
@@ -456,3 +456,3 @@ }
           // focus event will be fired.
-          if (shouldPreventDefault(e.currentTarget as Element)) {
+          if (shouldPreventDefaultDown(e.currentTarget as Element)) {
             e.preventDefault();
@@ -515,5 +515,24 @@ }
           }
+
+          // Prevent subsequent touchend event from triggering onClick on unrelated elements on Android. See below.
+          // Both 'touch' and 'pen' pointerTypes trigger onTouchEnd, but 'mouse' does not.
+          if ('ontouchend' in state.target && e.pointerType !== 'mouse') {
+            addGlobalListener(state.target, 'touchend', onTouchEnd, {once: true});
+          }
         }
       };
 
+      // This is a workaround for an Android Chrome/Firefox issue where click events are fired on an incorrect element
+      // if the original target is removed during onPointerUp (before onClick).
+      // https://github.com/adobe/react-spectrum/issues/1513
+      // https://issues.chromium.org/issues/40732224
+      // Note: this event must be registered directly on the element, not via React props in order to work.
+      // https://github.com/facebook/react/issues/9809
+      let onTouchEnd = (e: TouchEvent) => {
+        // Don't preventDefault if we actually want the default (e.g. submit/link click).
+        if (shouldPreventDefaultUp(e.currentTarget as Element)) {
+          e.preventDefault();
+        }
+      };
+
       let onPointerCancel = (e: PointerEvent) => {
@@ -540,3 +559,3 @@ cancel(e);
         // default on mouse down and handle focusing the pressable element ourselves.
-        if (shouldPreventDefault(e.currentTarget)) {
+        if (shouldPreventDefaultDown(e.currentTarget)) {
           e.preventDefault();
@@ -775,3 +794,3 @@ }
   // Remove user-select: none in case component unmounts immediately after pressStart
-  // eslint-disable-next-line arrow-body-style
+   
   useEffect(() => {
@@ -922,3 +941,3 @@ return () => {
 
-function shouldPreventDefault(target: Element) {
+function shouldPreventDefaultDown(target: Element) {
   // We cannot prevent default if the target is a draggable element.
@@ -928,5 +947,5 @@ return !(target instanceof HTMLElement) || !target.hasAttribute('draggable');
 
-function shouldPreventDefaultKeyboard(target: Element, key: string) {
+function shouldPreventDefaultUp(target: Element) {
   if (target instanceof HTMLInputElement) {
-    return !isValidInputKey(target, key);
+    return false;
   }
@@ -945,2 +964,10 @@
 
+function shouldPreventDefaultKeyboard(target: Element, key: string) {
+  if (target instanceof HTMLInputElement) {
+    return !isValidInputKey(target, key);
+  }
+
+  return shouldPreventDefaultUp(target);
+}
+
 const nonTextInputTypes = new Set([
@@ -947,0 +974,0 @@ 'checkbox',

src/utils.ts

@@ -71,3 +71,3 @@ /*
   // Clean up MutationObserver on unmount. See below.
-  // eslint-disable-next-line arrow-body-style
+   
   useLayoutEffect(() => {
@@ -74,0 +74,0 @@ const state = stateRef.current;

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

714108

increased by1.06%

Lines of code

8422

increased by0.77%

Dependency changes

• Updated@react-aria/ssr@^3.0.0-nightly-0ddbe6f95-241019

• Updated@react-aria/utils@^3.0.0-nightly-0ddbe6f95-241019

• Updated@react-types/shared@^3.0.0-nightly-0ddbe6f95-241019