@react-aria/menu - npm Package Compare versions

Comparing version 3.0.0-nightly-993de98ad-241210 to 3.0.0-nightly-9d70953f1-250204

dist/types.d.ts

@@ -65,2 +65,4 @@ import { AriaMenuProps, MenuTriggerType } from "@react-types/menu";
     isFocused: boolean;
+    /** Whether the item is keyboard focused. */
+    isFocusVisible: boolean;
     /** Whether the item is currently selected. */
@@ -67,0 +69,0 @@ isSelected: boolean;

dist/useMenuItem.main.js

@@ -191,2 +191,3 @@ var $815e346b11b84016$exports = require("./utils.main.js");
         isFocused: isFocused,
+        isFocusVisible: isFocused && (0, $byVdR$reactariainteractions.isFocusVisible)(),
         isSelected: isSelected,
@@ -193,0 +194,0 @@ isPressed: isPressed,

dist/useMenuItem.module.js

@@ -185,2 +185,3 @@ import {menuData as $fc79756100351201$export$6f49b4016bfc8d56} from "./utils.module.js";
         isFocused: isFocused,
+        isFocusVisible: isFocused && (0, $7Kjv5$isFocusVisible)(),
         isSelected: isSelected,
@@ -187,0 +188,0 @@ isPressed: isPressed,

dist/useMenuTrigger.main.js

 var $d1742ec2644a0949$exports = require("./intlStrings.main.js");
 var $jo7gW$reactariautils = require("@react-aria/utils");
+var $jo7gW$reactariainteractions = require("@react-aria/interactions");
 var $jo7gW$reactariai18n = require("@react-aria/i18n");
-var $jo7gW$reactariainteractions = require("@react-aria/interactions");
 var $jo7gW$reactariaoverlays = require("@react-aria/overlays");
@@ -74,7 +74,12 @@
     let pressProps = {
+        preventFocusOnPress: true,
         onPressStart (e) {
             // For consistency with native, open the menu on mouse/key down, but touch up.
-            if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) // If opened with a screen reader, auto focus the first item.
-            // Otherwise, the menu itself will be focused.
-            state.open(e.pointerType === 'virtual' ? 'first' : null);
+            if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {
+                // Ensure trigger has focus before opening the menu so it can be restored by FocusScope on close.
+                (0, $jo7gW$reactariautils.focusWithoutScrolling)(e.target);
+                // If opened with a screen reader, auto focus the first item.
+                // Otherwise, the menu itself will be focused.
+                state.open(e.pointerType === 'virtual' ? 'first' : null);
+            }
         },
@@ -81,0 +86,0 @@ onPress (e) {

dist/useMenuTrigger.module.js

 import $czs6v$intlStringsmodulejs from "./intlStrings.module.js";
-import {useId as $czs6v$useId} from "@react-aria/utils";
+import {useId as $czs6v$useId, focusWithoutScrolling as $czs6v$focusWithoutScrolling} from "@react-aria/utils";
+import {useLongPress as $czs6v$useLongPress} from "@react-aria/interactions";
 import {useLocalizedStringFormatter as $czs6v$useLocalizedStringFormatter} from "@react-aria/i18n";
-import {useLongPress as $czs6v$useLongPress} from "@react-aria/interactions";
 import {useOverlayTrigger as $czs6v$useOverlayTrigger} from "@react-aria/overlays";
@@ -68,7 +68,12 @@
     let pressProps = {
+        preventFocusOnPress: true,
         onPressStart (e) {
             // For consistency with native, open the menu on mouse/key down, but touch up.
-            if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) // If opened with a screen reader, auto focus the first item.
-            // Otherwise, the menu itself will be focused.
-            state.open(e.pointerType === 'virtual' ? 'first' : null);
+            if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {
+                // Ensure trigger has focus before opening the menu so it can be restored by FocusScope on close.
+                (0, $czs6v$focusWithoutScrolling)(e.target);
+                // If opened with a screen reader, auto focus the first item.
+                // Otherwise, the menu itself will be focused.
+                state.open(e.pointerType === 'virtual' ? 'first' : null);
+            }
         },
@@ -75,0 +80,0 @@ onPress (e) {

package.json

 {
   "name": "@react-aria/menu",
-  "version": "3.0.0-nightly-993de98ad-241210",
+  "version": "3.0.0-nightly-9d70953f1-250204",
   "description": "Spectrum UI components in React",
@@ -25,15 +25,15 @@ "license": "Apache-2.0",
   "dependencies": {
-    "@react-aria/focus": "^3.0.0-nightly-993de98ad-241210",
-    "@react-aria/i18n": "^3.0.0-nightly-993de98ad-241210",
-    "@react-aria/interactions": "^3.0.0-nightly-993de98ad-241210",
-    "@react-aria/overlays": "^3.0.0-nightly-993de98ad-241210",
-    "@react-aria/selection": "^3.0.0-nightly-993de98ad-241210",
-    "@react-aria/utils": "^3.0.0-nightly-993de98ad-241210",
-    "@react-stately/collections": "^3.0.0-nightly-993de98ad-241210",
-    "@react-stately/menu": "^3.0.0-nightly-993de98ad-241210",
-    "@react-stately/selection": "^3.0.0-nightly-993de98ad-241210",
-    "@react-stately/tree": "^3.0.0-nightly-993de98ad-241210",
-    "@react-types/button": "^3.0.0-nightly-993de98ad-241210",
-    "@react-types/menu": "^3.0.0-nightly-993de98ad-241210",
-    "@react-types/shared": "^3.0.0-nightly-993de98ad-241210",
+    "@react-aria/focus": "3.0.0-nightly-9d70953f1-250204",
+    "@react-aria/i18n": "3.0.0-nightly-9d70953f1-250204",
+    "@react-aria/interactions": "3.0.0-nightly-9d70953f1-250204",
+    "@react-aria/overlays": "3.0.0-nightly-9d70953f1-250204",
+    "@react-aria/selection": "3.0.0-nightly-9d70953f1-250204",
+    "@react-aria/utils": "3.0.0-nightly-9d70953f1-250204",
+    "@react-stately/collections": "3.0.0-nightly-9d70953f1-250204",
+    "@react-stately/menu": "3.0.0-nightly-9d70953f1-250204",
+    "@react-stately/selection": "3.0.0-nightly-9d70953f1-250204",
+    "@react-stately/tree": "3.0.0-nightly-9d70953f1-250204",
+    "@react-types/button": "3.0.0-nightly-9d70953f1-250204",
+    "@react-types/menu": "3.0.0-nightly-9d70953f1-250204",
+    "@react-types/shared": "3.0.0-nightly-9d70953f1-250204",
     "@swc/helpers": "^0.5.0"
@@ -47,4 +47,3 @@ },
     "access": "public"
-  },
-  "stableVersion": "3.16.0"
+  }
 }

src/useMenuItem.ts

@@ -37,2 +37,4 @@ /*
   isFocused: boolean,
+  /** Whether the item is keyboard focused. */
+  isFocusVisible: boolean,
   /** Whether the item is currently selected. */
@@ -320,2 +322,3 @@ isSelected: boolean,
     isFocused,
+    isFocusVisible: isFocused && isFocusVisible(),
     isSelected,
@@ -322,0 +325,0 @@ isPressed,

src/useMenuTrigger.ts

@@ -15,2 +15,4 @@ /*
 import {AriaMenuOptions} from './useMenu';
+import {FocusableElement, RefObject} from '@react-types/shared';
+import {focusWithoutScrolling, useId} from '@react-aria/utils';
 // @ts-ignore
@@ -20,6 +22,4 @@ import intlMessages from '../intl/*.json';
 import {MenuTriggerType} from '@react-types/menu';
-import {RefObject} from '@react-types/shared';
-import {useId} from '@react-aria/utils';
+import {PressProps, useLongPress} from '@react-aria/interactions';
 import {useLocalizedStringFormatter} from '@react-aria/i18n';
-import {useLongPress} from '@react-aria/interactions';
 import {useOverlayTrigger} from '@react-aria/overlays';
@@ -113,6 +113,10 @@
 
-  let pressProps =  {
+  let pressProps: PressProps =  {
+    preventFocusOnPress: true,
     onPressStart(e) {
       // For consistency with native, open the menu on mouse/key down, but touch up.
       if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {
+        // Ensure trigger has focus before opening the menu so it can be restored by FocusScope on close.
+        focusWithoutScrolling(e.target as FocusableElement);
+
         // If opened with a screen reader, auto focus the first item.
@@ -119,0 +123,0 @@ // Otherwise, the menu itself will be focused.

No alert changes

Improved metrics

Total package byte prevSize

325924

increased by0.8%

Lines of code

4000

increased by0.65%

Dependency changes

• + Added@formatjs/ecma402-abstract@2.3.3(transitive)

• + Added@formatjs/icu-messageformat-parser@2.11.1(transitive)

• + Added@formatjs/icu-skeleton-parser@1.8.13(transitive)

• + Added@formatjs/intl-localematcher@0.6.0(transitive)

• + Added@internationalized/date@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@internationalized/message@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@internationalized/number@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@internationalized/string@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/focus@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/i18n@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/interactions@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/overlays@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/selection@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/ssr@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/utils@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-aria/visually-hidden@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-stately/collections@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-stately/menu@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-stately/overlays@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-stately/selection@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-stately/tree@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-stately/utils@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-types/button@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-types/menu@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-types/overlays@3.0.0-nightly-9d70953f1-250204(transitive)

• + Added@react-types/shared@3.0.0-nightly-9d70953f1-250204(transitive)

• + Addedintl-messageformat@10.7.15(transitive)

• - Removed@formatjs/ecma402-abstract@2.3.2(transitive)

• - Removed@formatjs/icu-messageformat-parser@2.11.0(transitive)

• - Removed@formatjs/icu-skeleton-parser@1.8.12(transitive)

• - Removed@formatjs/intl-localematcher@0.5.10(transitive)

• - Removed@internationalized/date@3.7.0(transitive)

• - Removed@internationalized/message@3.1.6(transitive)

• - Removed@internationalized/number@3.6.0(transitive)

• - Removed@internationalized/string@3.2.5(transitive)

• - Removed@react-aria/focus@3.19.1(transitive)

• - Removed@react-aria/i18n@3.12.5(transitive)

• - Removed@react-aria/interactions@3.23.0(transitive)

• - Removed@react-aria/overlays@3.25.0(transitive)

• - Removed@react-aria/selection@3.22.0(transitive)

• - Removed@react-aria/ssr@3.9.7(transitive)

• - Removed@react-aria/utils@3.27.0(transitive)

• - Removed@react-aria/visually-hidden@3.8.19(transitive)

• - Removed@react-stately/collections@3.12.1(transitive)

• - Removed@react-stately/menu@3.9.1(transitive)

• - Removed@react-stately/overlays@3.6.13(transitive)

• - Removed@react-stately/selection@3.19.0(transitive)

• - Removed@react-stately/tree@3.8.7(transitive)

• - Removed@react-stately/utils@3.10.5(transitive)

• - Removed@react-types/button@3.10.2(transitive)

• - Removed@react-types/menu@3.9.14(transitive)

• - Removed@react-types/overlays@3.8.12(transitive)

• - Removed@react-types/shared@3.27.0(transitive)

• - Removedintl-messageformat@10.7.14(transitive)

• Updated@react-aria/focus@3.0.0-nightly-9d70953f1-250204

• Updated@react-aria/i18n@3.0.0-nightly-9d70953f1-250204

• Updated@react-aria/interactions@3.0.0-nightly-9d70953f1-250204

• Updated@react-aria/overlays@3.0.0-nightly-9d70953f1-250204

• Updated@react-aria/selection@3.0.0-nightly-9d70953f1-250204

• Updated@react-aria/utils@3.0.0-nightly-9d70953f1-250204

• Updated@react-stately/collections@3.0.0-nightly-9d70953f1-250204

• Updated@react-stately/menu@3.0.0-nightly-9d70953f1-250204

• Updated@react-stately/selection@3.0.0-nightly-9d70953f1-250204

• Updated@react-stately/tree@3.0.0-nightly-9d70953f1-250204

• Updated@react-types/button@3.0.0-nightly-9d70953f1-250204

• Updated@react-types/menu@3.0.0-nightly-9d70953f1-250204

• Updated@react-types/shared@3.0.0-nightly-9d70953f1-250204