rsuite 5.40.0 → 5.42.0

package/cjs/Menu/Menu.js

@@ -1,56 +1,41 @@
+'use client';
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
-
 var _MenuContext = _interopRequireWildcard(require("./MenuContext"));
-
 var _utils = require("../utils");
-
 var _useUniqueId = _interopRequireDefault(require("../utils/useUniqueId"));
-
 var _useMenu = _interopRequireDefault(require("./useMenu"));
-
 var _useFocus2 = _interopRequireDefault(require("../utils/useFocus"));
-
 var _useClickOutside = _interopRequireDefault(require("../utils/useClickOutside"));
-
 var _events = require("../utils/events");
-
 var _dom = require("../utils/dom");
-
 var defaultOpenMenuOn = ['click'];
+
 /**
  * Headless ARIA `menu`
  * @private
  */
-
 function Menu(_ref) {
   var _items$activeItemInde;
-
   var disabled = _ref.disabled,
-      children = _ref.children,
-      _ref$openMenuOn = _ref.openMenuOn,
-      openMenuOn = _ref$openMenuOn === void 0 ? defaultOpenMenuOn : _ref$openMenuOn,
-      _ref$defaultOpen = _ref.defaultOpen,
-      defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
-      openProp = _ref.open,
-      menuButtonText = _ref.menuButtonText,
-      renderMenuButton = _ref.renderMenuButton,
-      renderMenuPopup = _ref.renderMenuPopup,
-      onToggleMenu = _ref.onToggleMenu;
+    children = _ref.children,
+    _ref$openMenuOn = _ref.openMenuOn,
+    openMenuOn = _ref$openMenuOn === void 0 ? defaultOpenMenuOn : _ref$openMenuOn,
+    _ref$defaultOpen = _ref.defaultOpen,
+    defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
+    openProp = _ref.open,
+    menuButtonText = _ref.menuButtonText,
+    renderMenuButton = _ref.renderMenuButton,
+    renderMenuPopup = _ref.renderMenuPopup,
+    onToggleMenu = _ref.onToggleMenu;
   var buttonElementRef = (0, _react.useRef)(null);
   var menuElementRef = (0, _react.useRef)(null);
   var parentMenu = (0, _react.useContext)(_MenuContext.default);
@@ -59,33 +44,27 @@ function Menu(_ref) {
     open: defaultOpen
   });
   var _menu$ = menu[0],
-      openState = _menu$.open,
-      items = _menu$.items,
-      activeItemIndex = _menu$.activeItemIndex,
-      dispatch = menu[1];
+    openState = _menu$.open,
+    items = _menu$.items,
+    activeItemIndex = _menu$.activeItemIndex,
+    dispatch = menu[1];
   var openControlled = typeof openProp !== 'undefined';
   var open = openControlled ? openProp : openState;
-
   var _useCustom = (0, _utils.useCustom)('Menu'),
-      rtl = _useCustom.rtl;
-
+    rtl = _useCustom.rtl;
   var activeItem = (0, _isNil.default)(activeItemIndex) ? null : (_items$activeItemInde = items[activeItemIndex]) === null || _items$activeItemInde === void 0 ? void 0 : _items$activeItemInde.element;
-
   var _useFocus = (0, _useFocus2.default)(menuElementRef),
-      grabFocus = _useFocus.grab;
-
+    grabFocus = _useFocus.grab;
   var openMenu = (0, _react.useCallback)(function (event) {
     dispatch({
       type: _MenuContext.MenuActionTypes.OpenMenu
     });
-
     if (!event.isTrusted) {
       dispatch({
         type: _MenuContext.MenuActionTypes.MoveFocus,
         to: _MenuContext.MoveFocusTo.First
       });
     }
-
     onToggleMenu === null || onToggleMenu === void 0 ? void 0 : onToggleMenu(true, event);
     grabFocus();
   }, [dispatch, onToggleMenu, grabFocus]);
@@ -93,7 +72,6 @@ function Menu(_ref) {
     if (returnFocusToButton === void 0) {
       returnFocusToButton = true;
     }
-
     dispatch({
       type: _MenuContext.MenuActionTypes.CloseMenu
     });
@@ -102,10 +80,8 @@ function Menu(_ref) {
       to: _MenuContext.MoveFocusTo.None
     });
     onToggleMenu === null || onToggleMenu === void 0 ? void 0 : onToggleMenu(false, event);
-
     if (returnFocusToButton) {
       var _buttonElementRef$cur;
-
       (_buttonElementRef$cur = buttonElementRef.current) === null || _buttonElementRef$cur === void 0 ? void 0 : _buttonElementRef$cur.focus({
         preventScroll: true
       });
@@ -122,7 +98,6 @@ function Menu(_ref) {
     enabled: open,
     isOutside: function isOutside(event) {
       var _buttonElementRef$cur2, _menuElementRef$curre;
-
       return !((_buttonElementRef$cur2 = buttonElementRef.current) !== null && _buttonElementRef$cur2 !== void 0 && _buttonElementRef$cur2.contains(event.target)) && !((_menuElementRef$curre = menuElementRef.current) !== null && _menuElementRef$curre !== void 0 && _menuElementRef$curre.contains(event.target));
     },
     // fixme if clicking on a focusable element, don't move focus to menu button
@@ -130,11 +105,11 @@ function Menu(_ref) {
       return closeMenu(event, !(0, _dom.isFocusableElement)(event.target));
     }
   });
+
   /**
    * Keyboard interaction on menu button
    * @see https://www.w3.org/TR/wai-aria-practices-1.2/#keyboard-interaction-13
    */
-
   var handleButtonKeydown = (0, _react.useCallback)(function (e) {
     switch (e.key) {
       // Open the menu
@@ -142,7 +117,6 @@ function Menu(_ref) {
       case _utils.KEY_VALUES.SPACE:
         e.preventDefault();
         e.stopPropagation();
-
         if (!open) {
           openMenu(e);
           dispatch({
@@ -152,19 +126,15 @@ function Menu(_ref) {
         } else {
           closeMenu(e);
         }
-
         break;
       // Open the menu (if closed) and move focus to first item
       // This is mostly useful after opening the menu with click
-
       case _utils.KEY_VALUES.DOWN:
         e.preventDefault();
         e.stopPropagation();
-
         if (!open) {
           openMenu(e);
         }
-
         dispatch({
           type: _MenuContext.MenuActionTypes.MoveFocus,
           to: _MenuContext.MoveFocusTo.First
@@ -176,13 +146,13 @@ function Menu(_ref) {
     if (disabled) {
       return;
     }
-
     toggleMenu(event);
   }, [disabled, toggleMenu]);
   var handleButtonContextMenu = (0, _react.useCallback)(function (event) {
     // prevents default contextmenu
-    event.preventDefault(); // Only opens menu on right click. Left click can close the menu opened by a right click
+    event.preventDefault();
 
+    // Only opens menu on right click. Left click can close the menu opened by a right click
     if (open) return;
     if (disabled) return;
     openMenu(event);
@@ -191,19 +161,17 @@ function Menu(_ref) {
     var buttonEventHandlers = {
       onKeyDown: handleButtonKeydown
     };
+
     /**
      * Bind event of trigger,
      * not used in  in the expanded state of '<Sidenav>'
      */
-
     if (openMenuOn !== null && openMenuOn !== void 0 && openMenuOn.includes('click')) {
       buttonEventHandlers.onClick = handleButtonClick;
     }
-
     if (openMenuOn !== null && openMenuOn !== void 0 && openMenuOn.includes('contextmenu')) {
       buttonEventHandlers.onContextMenu = handleButtonContextMenu;
     }
-
     return buttonEventHandlers;
   }, [openMenuOn, handleButtonKeydown, handleButtonClick, handleButtonContextMenu]);
   var buttonId = (0, _useUniqueId.default)('menubutton-');
@@ -232,11 +200,11 @@ function Menu(_ref) {
   var buttonElement = customMenuButton !== null && customMenuButton !== void 0 ? customMenuButton : /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
     ref: buttonElementRef
   }, buttonProps), menuButtonText);
+
   /**
    * Keyboard interaction on menu
    * @see https://www.w3.org/TR/wai-aria-practices-1.2/#keyboard-interaction-12
    */
-
   var handleMenuKeydown = (0, _react.useCallback)(function (e) {
     switch (e.key) {
       // Move focus to previous item
@@ -249,7 +217,6 @@ function Menu(_ref) {
         });
         break;
       // Move focus to next item
-
       case _utils.KEY_VALUES.DOWN:
         e.preventDefault();
         e.stopPropagation();
@@ -259,11 +226,9 @@ function Menu(_ref) {
         });
         break;
       // When focus is in a menu and on a menuitem that has a submenu, opens the submenu and places focus on its first item.
-
       case _utils.KEY_VALUES.RIGHT:
         e.preventDefault();
         e.stopPropagation();
-
         if (!rtl) {
           if ((activeItem === null || activeItem === void 0 ? void 0 : activeItem.getAttribute('aria-haspopup')) === 'menu') {
             activeItem.click();
@@ -273,14 +238,11 @@ function Menu(_ref) {
             type: _MenuContext.MenuActionTypes.CloseMenu
           });
         }
-
         break;
       // When focus is in a submenu of an item in a menu, closes the submenu and returns focus to the parent menuitem.
-
       case _utils.KEY_VALUES.LEFT:
         e.preventDefault();
         e.stopPropagation();
-
         if (!rtl) {
           if (isSubmenu) {
             closeMenu(e);
@@ -288,10 +250,8 @@ function Menu(_ref) {
         } else if ((activeItem === null || activeItem === void 0 ? void 0 : activeItem.getAttribute('aria-haspopup')) === 'menu') {
           activeItem.click();
         }
-
         break;
       // Move focus to the first item
-
       case _utils.KEY_VALUES.HOME:
         e.preventDefault();
         e.stopPropagation();
@@ -301,7 +261,6 @@ function Menu(_ref) {
         });
         break;
       // Move focus to the last item
-
       case _utils.KEY_VALUES.END:
         e.preventDefault();
         e.stopPropagation();
@@ -312,40 +271,41 @@ function Menu(_ref) {
         break;
       // - When focus is on a menuitem that has a submenu, opens the submenu and places focus on its first item.
       // - Otherwise, activates the item and closes the menu.
-
       case _utils.KEY_VALUES.ENTER:
       case _utils.KEY_VALUES.SPACE:
         if (activeItem) {
           e.preventDefault();
           e.stopPropagation();
           activeItem.click();
-
           if (!activeItem.getAttribute('aria-haspopup')) {
             closeMenu(e);
           }
         }
-
         break;
       //  Close the menu that contains focus and return focus to the element or context,
       //  e.g., menu button or parent menuitem, from which the menu was opened.
-
       case _utils.KEY_VALUES.ESC:
         closeMenu(e);
         break;
     }
-  }, [dispatch, activeItem, isSubmenu, rtl, closeMenu]); // Only used for clicks bubbling from child `menuitem`s.
+  }, [dispatch, activeItem, isSubmenu, rtl, closeMenu]);
 
+  // Only used for clicks bubbling from child `menuitem`s.
   var handleMenuClick = (0, _react.useCallback)(function (event) {
-    var target = event.target; // Only handle clicks on `menuitem`s
+    var target = event.target;
 
-    if (target.getAttribute('role') !== 'menuitem') return; // Ignore clicks on `menuitem`s that controls a submenu
+    // Only handle clicks on `menuitem`s
+    if (target.getAttribute('role') !== 'menuitem') return;
 
-    if (target.getAttribute('aria-haspopup') === 'menu') return; // Ignore disabled `menuitem`s
+    // Ignore clicks on `menuitem`s that controls a submenu
+    if (target.getAttribute('aria-haspopup') === 'menu') return;
 
+    // Ignore disabled `menuitem`s
     if (target.getAttribute('aria-disabled') === 'true') return;
     closeMenu(event, !isSubmenu);
-  }, [closeMenu, isSubmenu]); // Ref: https://www.w3.org/TR/wai-aria-practices-1.2/#wai-aria-roles-states-and-properties-13
+  }, [closeMenu, isSubmenu]);
 
+  // Ref: https://www.w3.org/TR/wai-aria-practices-1.2/#wai-aria-roles-states-and-properties-13
   var menuAriaAttributes = {
     role: 'menu',
     'aria-labelledby': buttonId,
@@ -362,8 +322,9 @@ function Menu(_ref) {
   });
   var customMenuPopup = renderMenuPopup === null || renderMenuPopup === void 0 ? void 0 : renderMenuPopup((0, _extends2.default)({}, menuProps, {
     open: open
-  }), menuElementRef); // fixme Wrong children here
+  }), menuElementRef);
 
+  // fixme Wrong children here
   var menuElement = customMenuPopup !== null && customMenuPopup !== void 0 ? customMenuPopup : /*#__PURE__*/_react.default.createElement("ul", (0, _extends2.default)({
     ref: menuElementRef
   }, menuProps, {
@@ -389,12 +350,10 @@ function Menu(_ref) {
   var rootEventHandlers = {
     onBlur: handleContainerBlur
   };
-
   if (openMenuOn !== null && openMenuOn !== void 0 && openMenuOn.includes('mouseover')) {
     rootEventHandlers.onMouseEnter = handleMouseEnter;
     rootEventHandlers.onMouseLeave = handleMouseLeave;
   }
-
   var rootProps = (0, _extends2.default)({}, rootEventHandlers, {
     children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, buttonElement, /*#__PURE__*/_react.default.createElement(_MenuContext.default.Provider, {
       value: menu
@@ -402,14 +361,11 @@ function Menu(_ref) {
     // render props
     open: open
   });
-
   if (isSubmenu) {
     rootProps.role = 'none presentation';
   }
-
   return children(rootProps, rootElementRef);
 }
-
 Menu.displayName = 'Menu';
 Menu.propTypes = {
   children: _propTypes.default.func.isRequired

package/cjs/Menu/MenuContext.js

@@ -1,15 +1,12 @@
+'use client';
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = exports.MoveFocusTo = exports.MenuActionTypes = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var MenuActionTypes;
 exports.MenuActionTypes = MenuActionTypes;
-
 (function (MenuActionTypes) {
   MenuActionTypes[MenuActionTypes["RegisterItem"] = 0] = "RegisterItem";
   MenuActionTypes[MenuActionTypes["UnregisterItem"] = 1] = "UnregisterItem";
@@ -17,10 +14,8 @@ exports.MenuActionTypes = MenuActionTypes;
   MenuActionTypes[MenuActionTypes["CloseMenu"] = 3] = "CloseMenu";
   MenuActionTypes[MenuActionTypes["MoveFocus"] = 4] = "MoveFocus";
 })(MenuActionTypes || (exports.MenuActionTypes = MenuActionTypes = {}));
-
 var MoveFocusTo;
 exports.MoveFocusTo = MoveFocusTo;
-
 (function (MoveFocusTo) {
   MoveFocusTo[MoveFocusTo["Next"] = 0] = "Next";
   MoveFocusTo[MoveFocusTo["Prev"] = 1] = "Prev";
@@ -29,10 +24,8 @@ exports.MoveFocusTo = MoveFocusTo;
   MoveFocusTo[MoveFocusTo["Specific"] = 4] = "Specific";
   MoveFocusTo[MoveFocusTo["None"] = 5] = "None";
 })(MoveFocusTo || (exports.MoveFocusTo = MoveFocusTo = {}));
-
 // Defaults to null for checking whether a Menu is inside another menu
 var MenuContext = /*#__PURE__*/_react.default.createContext(null);
-
 MenuContext.displayName = 'MenuContext';
 var _default = MenuContext;
 exports.default = _default;

package/cjs/Menu/MenuItem.js

@@ -1,54 +1,44 @@
+'use client';
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _react = require("react");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
-
 var _useUniqueId = _interopRequireDefault(require("../utils/useUniqueId"));
-
 var _MenuContext = _interopRequireWildcard(require("./MenuContext"));
-
 /**
  * Headless ARIA `menuitem`
  * @private
  */
 function MenuItem(props) {
   var _menuState$items$menu;
-
   var children = props.children,
-      _props$selected = props.selected,
-      selected = _props$selected === void 0 ? false : _props$selected,
-      _props$disabled = props.disabled,
-      disabled = _props$disabled === void 0 ? false : _props$disabled,
-      onActivate = props.onActivate;
+    _props$selected = props.selected,
+    selected = _props$selected === void 0 ? false : _props$selected,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    onActivate = props.onActivate;
   var menuitemRef = (0, _react.useRef)(null);
   var menuitemId = (0, _useUniqueId.default)('menuitem-');
   var menu = (0, _react.useContext)(_MenuContext.default);
-
   if (!menu) {
     throw new Error('<MenuItem> must be rendered within a <Menu>');
   }
-
   var menuState = menu[0],
-      dispatch = menu[1]; // Whether this menuitem has focus (indicated by `aria-activedescendant` from parent menu)
-
+    dispatch = menu[1]; // Whether this menuitem has focus (indicated by `aria-activedescendant` from parent menu)
   var hasFocus = !(0, _isNil.default)(menuitemRef.current) && !(0, _isNil.default)(menuState.activeItemIndex) && ((_menuState$items$menu = menuState.items[menuState.activeItemIndex]) === null || _menuState$items$menu === void 0 ? void 0 : _menuState$items$menu.element) === menuitemRef.current;
   var handleClick = (0, _react.useCallback)(function (event) {
     if (disabled) {
       return;
     }
-
     onActivate === null || onActivate === void 0 ? void 0 : onActivate(event);
-  }, [disabled, onActivate]); // Gain/release focus on mousedown in `menubar`
+  }, [disabled, onActivate]);
+
+  // Gain/release focus on mousedown in `menubar`
 
   var handleMouseDown = (0, _react.useCallback)(function () {
     if (!(0, _isNil.default)(menuitemRef.current) && !hasFocus) {
@@ -58,8 +48,9 @@ function MenuItem(props) {
         id: menuitemRef.current.id
       });
     }
-  }, [dispatch, hasFocus]); // Gain/release focus on mouseenter/mouseleave in `menu`
+  }, [dispatch, hasFocus]);
 
+  // Gain/release focus on mouseenter/mouseleave in `menu`
   var handleMouseMove = (0, _react.useCallback)(function () {
     if (!(0, _isNil.default)(menuitemRef.current) && !hasFocus) {
       dispatch({
@@ -77,7 +68,6 @@ function MenuItem(props) {
   }, [dispatch]);
   (0, _react.useEffect)(function () {
     var menuitemElement = menuitemRef.current;
-
     if (menuitemElement) {
       dispatch({
         type: _MenuContext.MenuActionTypes.RegisterItem,
@@ -103,24 +93,23 @@ function MenuItem(props) {
     tabIndex: -1,
     onClick: handleClick,
     // render props
+
     selected: selected,
     active: hasFocus
-  }; // Only move focus on hover in a `menu`, not `menubar`
+  };
 
+  // Only move focus on hover in a `menu`, not `menubar`
   if ((menuState === null || menuState === void 0 ? void 0 : menuState.role) === 'menu') {
     menuitemProps.onMouseMove = handleMouseMove;
     menuitemProps.onMouseLeave = handleMouseLeave;
   }
-
   if ((menuState === null || menuState === void 0 ? void 0 : menuState.role) === 'menubar') {
     menuitemProps.onMouseDown = handleMouseDown;
     menuitemProps.onMouseOver = handleMouseMove;
     menuitemProps.onMouseLeave = handleMouseLeave;
   }
-
   return children(menuitemProps, menuitemRef);
 }
-
 MenuItem.displayName = 'MenuItem';
 MenuItem.propTypes = {
   selected: _propTypes.default.bool,

package/cjs/Menu/Menubar.js

@@ -1,26 +1,17 @@
+'use client';
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 exports.__esModule = true;
 exports.default = Menubar;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _isNil = _interopRequireDefault(require("lodash/isNil"));
-
 var _MenuContext = _interopRequireWildcard(require("./MenuContext"));
-
 var _utils = require("../utils");
-
 var _events = require("../utils/events");
-
 var _useMenu = _interopRequireDefault(require("./useMenu"));
-
 var _dom = require("../utils/dom");
-
 // Headless ARIA `menubar`
 
 /**
@@ -28,22 +19,22 @@ var _dom = require("../utils/dom");
  */
 function Menubar(_ref) {
   var _items$activeItemInde3;
-
   var _ref$vertical = _ref.vertical,
-      vertical = _ref$vertical === void 0 ? false : _ref$vertical,
-      children = _ref.children,
-      onActivateItem = _ref.onActivateItem;
+    vertical = _ref$vertical === void 0 ? false : _ref$vertical,
+    children = _ref.children,
+    onActivateItem = _ref.onActivateItem;
   var menubar = (0, _useMenu.default)({
     role: 'menubar'
   });
   var _menubar$ = menubar[0],
-      items = _menubar$.items,
-      activeItemIndex = _menubar$.activeItemIndex,
-      dispatch = menubar[1];
+    items = _menubar$.items,
+    activeItemIndex = _menubar$.activeItemIndex,
+    dispatch = menubar[1];
   var menubarElementRef = (0, _react.useRef)(null);
   var onFocus = (0, _react.useCallback)(function (event) {
     // Focus moves inside Menubar
-    if ((0, _events.isFocusEntering)(event) && // Skip if focus is moving to a focusable element within this menu
+    if ((0, _events.isFocusEntering)(event) &&
+    // Skip if focus is moving to a focusable element within this menu
     !(event.target !== event.currentTarget && (0, _dom.isFocusableElement)(event.target))) {
       if (activeItemIndex === null) {
         dispatch({
@@ -62,15 +53,11 @@ function Menubar(_ref) {
       });
     }
   }, [dispatch]);
-
   var _useCustom = (0, _utils.useCustom)('Menubar'),
-      rtl = _useCustom.rtl;
-
+    rtl = _useCustom.rtl;
   var onKeyDown = (0, _react.useCallback)(function (event) {
     var _items$activeItemInde, _items$activeItemInde2;
-
     var activeItemElement = (0, _isNil.default)(activeItemIndex) ? null : (_items$activeItemInde = (_items$activeItemInde2 = items[activeItemIndex]) === null || _items$activeItemInde2 === void 0 ? void 0 : _items$activeItemInde2.element) !== null && _items$activeItemInde !== void 0 ? _items$activeItemInde : null;
-
     switch (true) {
       case !vertical && !rtl && event.key === _utils.KEY_VALUES.RIGHT:
       case !vertical && rtl && event.key === _utils.KEY_VALUES.LEFT:
@@ -82,7 +69,6 @@ function Menubar(_ref) {
           to: _MenuContext.MoveFocusTo.Next
         });
         break;
-
       case !vertical && !rtl && event.key === _utils.KEY_VALUES.LEFT:
       case !vertical && rtl && event.key === _utils.KEY_VALUES.RIGHT:
       case vertical && event.key === _utils.KEY_VALUES.UP:
@@ -93,7 +79,6 @@ function Menubar(_ref) {
           to: _MenuContext.MoveFocusTo.Prev
         });
         break;
-
       case event.key === _utils.KEY_VALUES.HOME:
         event.preventDefault();
         event.stopPropagation();
@@ -102,7 +87,6 @@ function Menubar(_ref) {
           to: _MenuContext.MoveFocusTo.First
         });
         break;
-
       case event.key === _utils.KEY_VALUES.END:
         event.preventDefault();
         event.stopPropagation();
@@ -111,7 +95,6 @@ function Menubar(_ref) {
           to: _MenuContext.MoveFocusTo.Last
         });
         break;
-
       case !vertical && event.key === _utils.KEY_VALUES.DOWN:
       case vertical && !rtl && event.key === _utils.KEY_VALUES.RIGHT:
       case vertical && rtl && event.key === _utils.KEY_VALUES.LEFT:
@@ -120,9 +103,7 @@ function Menubar(_ref) {
           event.stopPropagation();
           activeItemElement.click();
         }
-
         break;
-
       case event.key === _utils.KEY_VALUES.ENTER:
       case event.key === _utils.KEY_VALUES.SPACE:
         event.preventDefault();
@@ -130,9 +111,10 @@ function Menubar(_ref) {
         activeItemElement === null || activeItemElement === void 0 ? void 0 : activeItemElement.click();
         break;
     }
-  }, [rtl, items, activeItemIndex, dispatch, vertical]); // Only used for handling click events bubbling from children
-  // Which indicates that a child menuitem is being activated
+  }, [rtl, items, activeItemIndex, dispatch, vertical]);
 
+  // Only used for handling click events bubbling from children
+  // Which indicates that a child menuitem is being activated
   var onClick = (0, _react.useCallback)(function (event) {
     if (items.some(function (item) {
       return item.element === event.target;
@@ -151,6 +133,5 @@ function Menubar(_ref) {
     onClick: onClick,
     'aria-activedescendant': (0, _isNil.default)(activeItemIndex) ? undefined : (_items$activeItemInde3 = items[activeItemIndex]) === null || _items$activeItemInde3 === void 0 ? void 0 : _items$activeItemInde3.element.id,
     'aria-orientation': vertical ? 'vertical' : undefined // implicitly set 'horizontal'
-
   }, menubarElementRef));
 }

package/cjs/Menu/index.js

@@ -1,11 +1,9 @@
+'use client';
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _Menu = _interopRequireDefault(require("./Menu"));
-
 var _default = _Menu.default;
 exports.default = _default;