@react-aria/menu - npm Package Compare versions

Comparing version 3.0.0-nightly-7eae25e12-241205 to 3.0.0-nightly-8228e4efd-241207

dist/types.d.ts

@@ -21,2 +21,6 @@ import { AriaMenuProps, MenuTriggerType } from "@react-types/menu";
     keyboardDelegate?: KeyboardDelegate;
+    /**
+     * Whether the menu items should use virtual focus instead of being focused directly.
+     */
+    shouldUseVirtualFocus?: boolean;
 }
@@ -23,0 +27,0 @@ /**

dist/useMenu.main.js

@@ -0,1 +1,2 @@
+var $815e346b11b84016$exports = require("./utils.main.js");
 var $6CumN$reactariautils = require("@react-aria/utils");
@@ -9,3 +10,2 @@ var $6CumN$reactariaselection = require("@react-aria/selection");
 
-$parcel$export(module.exports, "menuData", () => $a3815f0132802737$export$6f49b4016bfc8d56);
 $parcel$export(module.exports, "useMenu", () => $a3815f0132802737$export$38eaa17faae8f579);
@@ -24,3 +24,3 @@ /*
 
-const $a3815f0132802737$export$6f49b4016bfc8d56 = new WeakMap();
+
 function $a3815f0132802737$export$38eaa17faae8f579(props, state, ref) {
@@ -41,5 +41,6 @@ let { shouldFocusWrap: shouldFocusWrap = true, onKeyDown: onKeyDown, onKeyUp: onKeyUp, ...otherProps } = props;
     });
-    $a3815f0132802737$export$6f49b4016bfc8d56.set(state, {
+    (0, $815e346b11b84016$exports.menuData).set(state, {
         onClose: props.onClose,
-        onAction: props.onAction
+        onAction: props.onAction,
+        shouldUseVirtualFocus: props.shouldUseVirtualFocus
     });
@@ -56,3 +57,3 @@ return {
                 // don't clear the menu selected keys if the user is presses escape since escape closes the menu
-                if (e.key !== 'Escape') (_listProps_onKeyDown = listProps.onKeyDown) === null || _listProps_onKeyDown === void 0 ? void 0 : _listProps_onKeyDown.call(listProps, e);
+                if (e.key !== 'Escape' || props.shouldUseVirtualFocus) (_listProps_onKeyDown = listProps.onKeyDown) === null || _listProps_onKeyDown === void 0 ? void 0 : _listProps_onKeyDown.call(listProps, e);
             }
@@ -59,0 +60,0 @@ })

dist/useMenu.module.js

@@ -0,1 +1,2 @@
+import {menuData as $fc79756100351201$export$6f49b4016bfc8d56} from "./utils.module.js";
 import {filterDOMProps as $ieN2F$filterDOMProps, mergeProps as $ieN2F$mergeProps} from "@react-aria/utils";
@@ -16,3 +17,3 @@ import {useSelectableList as $ieN2F$useSelectableList} from "@react-aria/selection";
 
-const $d5336fe17ce95402$export$6f49b4016bfc8d56 = new WeakMap();
+
 function $d5336fe17ce95402$export$38eaa17faae8f579(props, state, ref) {
@@ -33,5 +34,6 @@ let { shouldFocusWrap: shouldFocusWrap = true, onKeyDown: onKeyDown, onKeyUp: onKeyUp, ...otherProps } = props;
     });
-    $d5336fe17ce95402$export$6f49b4016bfc8d56.set(state, {
+    (0, $fc79756100351201$export$6f49b4016bfc8d56).set(state, {
         onClose: props.onClose,
-        onAction: props.onAction
+        onAction: props.onAction,
+        shouldUseVirtualFocus: props.shouldUseVirtualFocus
     });
@@ -48,3 +50,3 @@ return {
                 // don't clear the menu selected keys if the user is presses escape since escape closes the menu
-                if (e.key !== 'Escape') (_listProps_onKeyDown = listProps.onKeyDown) === null || _listProps_onKeyDown === void 0 ? void 0 : _listProps_onKeyDown.call(listProps, e);
+                if (e.key !== 'Escape' || props.shouldUseVirtualFocus) (_listProps_onKeyDown = listProps.onKeyDown) === null || _listProps_onKeyDown === void 0 ? void 0 : _listProps_onKeyDown.call(listProps, e);
             }
@@ -56,3 +58,3 @@ })
 
-export {$d5336fe17ce95402$export$6f49b4016bfc8d56 as menuData, $d5336fe17ce95402$export$38eaa17faae8f579 as useMenu};
+export {$d5336fe17ce95402$export$38eaa17faae8f579 as useMenu};
 //# sourceMappingURL=useMenu.module.js.map

dist/useMenuItem.main.js

@@ -1,2 +0,2 @@
-var $a3815f0132802737$exports = require("./useMenu.main.js");
+var $815e346b11b84016$exports = require("./utils.main.js");
 var $byVdR$reactariautils = require("@react-aria/utils");
@@ -36,3 +36,3 @@ var $byVdR$reactstatelycollections = require("@react-stately/collections");
     let isSelected = (_props_isSelected = props.isSelected) !== null && _props_isSelected !== void 0 ? _props_isSelected : selectionManager.isSelected(key);
-    let data = (0, $a3815f0132802737$exports.menuData).get(state);
+    let data = (0, $815e346b11b84016$exports.menuData).get(state);
     let item = state.collection.getItem(key);
@@ -106,2 +106,3 @@ let onClose = props.onClose || data.onClose;
     let { itemProps: itemProps, isFocused: isFocused } = (0, $byVdR$reactariaselection.useSelectableItem)({
+        id: id,
         selectionManager: selectionManager,
@@ -116,3 +117,4 @@ key: key,
         // actions are performed on key down rather than key up.
-        linkBehavior: 'none'
+        linkBehavior: 'none',
+        shouldUseVirtualFocus: data.shouldUseVirtualFocus
     });
@@ -119,0 +121,0 @@ let { pressProps: pressProps, isPressed: isPressed } = (0, $byVdR$reactariainteractions.usePress)({

dist/useMenuItem.module.js

@@ -1,2 +0,2 @@
-import {menuData as $d5336fe17ce95402$export$6f49b4016bfc8d56} from "./useMenu.module.js";
+import {menuData as $fc79756100351201$export$6f49b4016bfc8d56} from "./utils.module.js";
 import {useRouter as $7Kjv5$useRouter, useSlotId as $7Kjv5$useSlotId, filterDOMProps as $7Kjv5$filterDOMProps, useLinkProps as $7Kjv5$useLinkProps, mergeProps as $7Kjv5$mergeProps} from "@react-aria/utils";
@@ -30,3 +30,3 @@ import {getItemCount as $7Kjv5$getItemCount} from "@react-stately/collections";
     let isSelected = (_props_isSelected = props.isSelected) !== null && _props_isSelected !== void 0 ? _props_isSelected : selectionManager.isSelected(key);
-    let data = (0, $d5336fe17ce95402$export$6f49b4016bfc8d56).get(state);
+    let data = (0, $fc79756100351201$export$6f49b4016bfc8d56).get(state);
     let item = state.collection.getItem(key);
@@ -100,2 +100,3 @@ let onClose = props.onClose || data.onClose;
     let { itemProps: itemProps, isFocused: isFocused } = (0, $7Kjv5$useSelectableItem)({
+        id: id,
         selectionManager: selectionManager,
@@ -110,3 +111,4 @@ key: key,
         // actions are performed on key down rather than key up.
-        linkBehavior: 'none'
+        linkBehavior: 'none',
+        shouldUseVirtualFocus: data.shouldUseVirtualFocus
     });
@@ -113,0 +115,0 @@ let { pressProps: pressProps, isPressed: isPressed } = (0, $7Kjv5$usePress)({

package.json

 {
   "name": "@react-aria/menu",
-  "version": "3.0.0-nightly-7eae25e12-241205",
+  "version": "3.0.0-nightly-8228e4efd-241207",
   "description": "Spectrum UI components in React",
@@ -25,15 +25,15 @@ "license": "Apache-2.0",
   "dependencies": {
-    "@react-aria/focus": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-aria/i18n": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-aria/interactions": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-aria/overlays": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-aria/selection": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-aria/utils": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-stately/collections": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-stately/menu": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-stately/selection": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-stately/tree": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-types/button": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-types/menu": "^3.0.0-nightly-7eae25e12-241205",
-    "@react-types/shared": "^3.0.0-nightly-7eae25e12-241205",
+    "@react-aria/focus": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-aria/i18n": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-aria/interactions": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-aria/overlays": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-aria/selection": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-aria/utils": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-stately/collections": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-stately/menu": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-stately/selection": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-stately/tree": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-types/button": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-types/menu": "^3.0.0-nightly-8228e4efd-241207",
+    "@react-types/shared": "^3.0.0-nightly-8228e4efd-241207",
     "@swc/helpers": "^0.5.0"
@@ -40,0 +40,0 @@ },

src/useMenu.ts

@@ -14,4 +14,5 @@ /*
 import {AriaMenuProps} from '@react-types/menu';
-import {DOMAttributes, Key, KeyboardDelegate, KeyboardEvents, RefObject} from '@react-types/shared';
+import {DOMAttributes, KeyboardDelegate, KeyboardEvents, RefObject} from '@react-types/shared';
 import {filterDOMProps, mergeProps} from '@react-aria/utils';
+import {menuData} from './utils';
 import {TreeState} from '@react-stately/tree';
@@ -28,3 +29,2 @@ import {useSelectableList} from '@react-aria/selection';
   isVirtualized?: boolean,
-
   /**
@@ -34,12 +34,9 @@ * An optional keyboard delegate implementation for type to select,
    */
-  keyboardDelegate?: KeyboardDelegate
+  keyboardDelegate?: KeyboardDelegate,
+  /**
+   * Whether the menu items should use virtual focus instead of being focused directly.
+   */
+  shouldUseVirtualFocus?: boolean
 }
 
-interface MenuData {
-  onClose?: () => void,
-  onAction?: (key: Key) => void
-}
-
-export const menuData = new WeakMap<TreeState<unknown>, MenuData>();
-
 /**
@@ -76,3 +73,4 @@ * Provides the behavior and accessibility implementation for a menu component.
     onClose: props.onClose,
-    onAction: props.onAction
+    onAction: props.onAction,
+    shouldUseVirtualFocus: props.shouldUseVirtualFocus
   });
@@ -86,3 +84,3 @@
         // don't clear the menu selected keys if the user is presses escape since escape closes the menu
-        if (e.key !== 'Escape') {
+        if (e.key !== 'Escape' || props.shouldUseVirtualFocus) {
           listProps.onKeyDown?.(e);
@@ -89,0 +87,0 @@ }

src/useMenuItem.ts

@@ -17,3 +17,3 @@ /*
 import {isFocusVisible, useFocus, useHover, useKeyboard, usePress} from '@react-aria/interactions';
-import {menuData} from './useMenu';
+import {menuData} from './utils';
 import {SelectionManager} from '@react-stately/selection';
@@ -229,2 +229,3 @@ import {TreeState} from '@react-stately/tree';
   let {itemProps, isFocused} = useSelectableItem({
+    id,
     selectionManager: selectionManager,
@@ -239,3 +240,4 @@ key,
     // actions are performed on key down rather than key up.
-    linkBehavior: 'none'
+    linkBehavior: 'none',
+    shouldUseVirtualFocus: data.shouldUseVirtualFocus
   });
@@ -242,0 +244,0 @@

New alerts

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 2 instances in 1 package

Improved metrics

Total package byte prevSize

323342

increased by2.16%

Number of package files

227

increased by2.71%

Lines of code

3974

increased by1.95%

Worsened metrics

Number of low license alerts

8

increased by33.33%

Dependency changes

• Updated@react-aria/focus@^3.0.0-nightly-8228e4efd-241207

• Updated@react-aria/i18n@^3.0.0-nightly-8228e4efd-241207

• Updated@react-aria/interactions@^3.0.0-nightly-8228e4efd-241207

• Updated@react-aria/overlays@^3.0.0-nightly-8228e4efd-241207

• Updated@react-aria/selection@^3.0.0-nightly-8228e4efd-241207

• Updated@react-aria/utils@^3.0.0-nightly-8228e4efd-241207

• Updated@react-stately/collections@^3.0.0-nightly-8228e4efd-241207

• Updated@react-stately/menu@^3.0.0-nightly-8228e4efd-241207

• Updated@react-stately/selection@^3.0.0-nightly-8228e4efd-241207

• Updated@react-stately/tree@^3.0.0-nightly-8228e4efd-241207

• Updated@react-types/button@^3.0.0-nightly-8228e4efd-241207

• Updated@react-types/menu@^3.0.0-nightly-8228e4efd-241207

• Updated@react-types/shared@^3.0.0-nightly-8228e4efd-241207