@fluentui-react-native/menu 0.14.8 → 0.15.2

package/lib-commonjs/__tests__/Menu.test.js

@@ -21,7 +21,7 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Default")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItem_1.MenuItem, { content: "Option 1" })))))
+                    React.createElement(MenuItem_1.MenuItem, null, "Option 1")))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -32,7 +32,7 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Open")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItem_1.MenuItem, { content: "Option 1" })))))
+                    React.createElement(MenuItem_1.MenuItem, null, "Option 1")))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -43,8 +43,8 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Open")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItem_1.MenuItem, { content: "Option 1" }),
-                    React.createElement(MenuItem_1.MenuItem, { disabled: true, content: "Option 2" })))))
+                    React.createElement(MenuItem_1.MenuItem, null, "Option 1"),
+                    React.createElement(MenuItem_1.MenuItem, { disabled: true }, "Option 2")))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -55,9 +55,9 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Open")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { content: "Option 1", name: "Option 1" }),
+                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 1" }, "Option 1"),
                     React.createElement(MenuDivider_1.MenuDivider, null),
-                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { disabled: true, content: "Option 2", name: "Option 2" })))))
+                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { disabled: true, name: "Option 2" }, "Option 2")))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -68,8 +68,8 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Open")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItemRadio_1.MenuItemRadio, { content: "Option 1", name: "Option 1" }),
-                    React.createElement(MenuItemRadio_1.MenuItemRadio, { content: "Option 2", name: "Option 2" })))))
+                    React.createElement(MenuItemRadio_1.MenuItemRadio, { name: "Option 1" }, "Option 1"),
+                    React.createElement(MenuItemRadio_1.MenuItemRadio, { name: "Option 2" }, "Option 2")))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -80,9 +80,9 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Open")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { content: "Option 1", name: "Option 1" }),
+                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 1" }, "Option 1"),
                     React.createElement(MenuDivider_1.MenuDivider, null),
-                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { content: "Option 2", name: "Option 2" })))))
+                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 2" }, "Option 2")))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -93,9 +93,9 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Open")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { content: "Option 1", name: "Option 1" }),
+                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 1" }, "Option 1"),
                     React.createElement(MenuDivider_1.MenuDivider, null),
-                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { content: "Option 2", name: "Option 2" })))))
+                    React.createElement(MenuItemCheckbox_1.MenuItemCheckbox, { name: "Option 2" }, "Option 2")))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -106,13 +106,13 @@ describe('Checkbox component tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Default")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItem_1.MenuItem, { content: "Option 1" }),
+                    React.createElement(MenuItem_1.MenuItem, null, "Option 1"),
                     React.createElement(Menu_1.Menu, null,
                         React.createElement(MenuTrigger_1.default, null,
-                            React.createElement(MenuItem_1.MenuItem, { content: "Option 2" })),
+                            React.createElement(MenuItem_1.MenuItem, null, "Option 2")),
                         React.createElement(MenuPopover_1.default, null,
                             React.createElement(MenuList_1.MenuList, null,
-                                React.createElement(MenuItem_1.MenuItem, { content: "Option 1" }))))))))
+                                React.createElement(MenuItem_1.MenuItem, null, "Option 1"))))))))
             .toJSON();
         expect(tree).toMatchSnapshot();
     });
@@ -124,7 +124,7 @@ describe('Menu rerender tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Rerender twice")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItem_1.MenuItem, { content: "Option 1" }))))); }, 3);
+                    React.createElement(MenuItem_1.MenuItem, null, "Option 1"))))); }, 3);
     });
     it('Menu re-renders correctly with style', function () {
         var style = { backgroundColor: 'black' };
@@ -133,7 +133,7 @@ describe('Menu rerender tests', function () {
                 React.createElement(button_1.ButtonV1, { style: style }, "Rerender twice")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItem_1.MenuItem, { content: "Option 1" }))))); }, 3);
+                    React.createElement(MenuItem_1.MenuItem, null, "Option 1"))))); }, 3);
     });
     it('Menu re-renders correctly with accessibilityAction', function () {
         var action = [{ name: 'Expand' }];
@@ -142,7 +142,7 @@ describe('Menu rerender tests', function () {
                 React.createElement(button_1.ButtonV1, null, "Rerender twice")),
             React.createElement(MenuPopover_1.default, null,
                 React.createElement(MenuList_1.MenuList, null,
-                    React.createElement(MenuItem_1.MenuItem, { accessibilityActions: action, content: "Option 1" }))))); }, 3);
+                    React.createElement(MenuItem_1.MenuItem, { accessibilityActions: action }, "Option 1"))))); }, 3);
     });
 });
 //# sourceMappingURL=Menu.test.js.map

package/lib-commonjs/__tests__/Menu.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.test.js","sourceRoot":"","sources":["../../src/__tests__/Menu.test.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Menu.test.js","sourceRoot":"","sources":["../../src/__tests__/Menu.test.tsx"],"names":[],"mappings":"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"}

package/lib-commonjs/consts.d.ts

@@ -1,3 +1,3 @@
-export declare const delayHover: number;
+export declare const hoverDelayDefault: number;
 export declare const isCloseOnHoverOutEnabled: boolean;
 //# sourceMappingURL=consts.d.ts.map

package/lib-commonjs/consts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../src/consts.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,QAGrB,CAAC;AAEH,eAAO,MAAM,wBAAwB,SAAmC,CAAC"}
+{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../src/consts.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,QAG5B,CAAC;AAEH,eAAO,MAAM,wBAAwB,SAAmC,CAAC"}

package/lib-commonjs/consts.js

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isCloseOnHoverOutEnabled = exports.delayHover = void 0;
+exports.isCloseOnHoverOutEnabled = exports.hoverDelayDefault = void 0;
 var react_native_1 = require("react-native");
-exports.delayHover = react_native_1.Platform.select({
+exports.hoverDelayDefault = react_native_1.Platform.select({
     macos: 100,
     default: 500, // win32
 });

package/lib-commonjs/consts.js.map

@@ -1 +1 @@
-{"version":3,"file":"consts.js","sourceRoot":"","sources":["../src/consts.ts"],"names":[],"mappings":";;;AAAA,6CAAwC;AAE3B,QAAA,UAAU,GAAG,uBAAQ,CAAC,MAAM,CAAC;IACxC,KAAK,EAAE,GAAG;IACV,OAAO,EAAE,GAAG,EAAE,QAAQ;CACvB,CAAC,CAAC;AAEU,QAAA,wBAAwB,GAAG,uBAAQ,CAAC,EAAE,KAAM,OAAe,CAAC"}
+{"version":3,"file":"consts.js","sourceRoot":"","sources":["../src/consts.ts"],"names":[],"mappings":";;;AAAA,6CAAwC;AAE3B,QAAA,iBAAiB,GAAG,uBAAQ,CAAC,MAAM,CAAC;IAC/C,KAAK,EAAE,GAAG;IACV,OAAO,EAAE,GAAG,EAAE,QAAQ;CACvB,CAAC,CAAC;AAEU,QAAA,wBAAwB,GAAG,uBAAQ,CAAC,EAAE,KAAM,OAAe,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/menu",
-  "version": "0.14.8",
+  "version": "0.15.2",
   "description": "A cross-platform Menu component using the Fluent Design System",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",

package/src/Menu/Menu.types.ts

@@ -5,9 +5,29 @@ import type { MenuListProps } from '../MenuList/MenuList.types';
 export const menuName = 'Menu';
 
 export interface MenuProps extends MenuListProps {
+  /**
+   * Whether the popup is open on mount
+   */
   defaultOpen?: boolean;
+
+  /**
+   * How much delay to have between hover in and showing the menu, in ms.
+   */
+  hoverDelay?: number;
+
+  /**
+   * Whether the popup is open
+   */
   open?: boolean;
+
+  /**
+   * Call back when the component requests to change value
+   */
   onOpenChange?: (e: InteractionEvent, isOpen: boolean) => void;
+
+  /*
+   * Opens the menu on hovering over the trigger
+   */
   openOnHover?: boolean;
 }
 

package/src/MenuItem/MenuItem.tsx

@@ -1,11 +1,12 @@
 /** @jsx withSlots */
 import { I18nManager, View } from 'react-native';
 import { SvgXml } from 'react-native-svg';
-import { compose, mergeProps, UseSlots, withSlots } from '@fluentui-react-native/framework';
+import { compose, memoize, mergeProps, UseSlots, withSlots } from '@fluentui-react-native/framework';
 import { Text } from '@fluentui-react-native/experimental-text';
 import { menuItemName, MenuItemProps, MenuItemType } from './MenuItem.types';
 import { useMenuItem } from './useMenuItem';
 import { stylingSettings } from './MenuItem.styling';
+import React from 'react';
 
 export const MenuItem = compose<MenuItemType>({
   displayName: menuItemName,
@@ -20,8 +21,8 @@ export const MenuItem = compose<MenuItemType>({
     const menuItem = useMenuItem(userProps);
     const Slots = useSlots(userProps, (layer): boolean => menuItem.state[layer] || userProps[layer]);
 
-    return (final: MenuItemProps) => {
-      const mergedProps = mergeProps(menuItem.props, final);
+    return (final: MenuItemProps, children: React.ReactNode) => {
+      const { accessibilityLabel, ...mergedProps } = mergeProps(menuItem.props, final);
       const chevronXml = I18nManager.isRTL
         ? `
           <svg>
@@ -32,13 +33,29 @@ export const MenuItem = compose<MenuItemType>({
             <path fill='currentColor' d='M4.64645 2.14645C4.45118 2.34171 4.45118 2.65829 4.64645 2.85355L7.79289 6L4.64645 9.14645C4.45118 9.34171 4.45118 9.65829 4.64645 9.85355C4.84171 10.0488 5.15829 10.0488 5.35355 9.85355L8.85355 6.35355C9.04882 6.15829 9.04882 5.84171 8.85355 5.64645L5.35355 2.14645C5.15829 1.95118 4.84171 1.95118 4.64645 2.14645Z' />
           </svg>`;
 
+      // We only automatically support the one child string.
+      const label = getAccessibilityLabel(accessibilityLabel, children[0]);
+
       return (
-        <Slots.root {...mergedProps}>
+        <Slots.root {...mergedProps} accessibilityLabel={label}>
           {menuItem.hasCheckmarks && <Slots.checkmark />}
-          {mergedProps.content && <Slots.content>{mergedProps.content}</Slots.content>}
+          {children && <Slots.content>{children}</Slots.content>}
           {menuItem.hasSubmenu && <Slots.submenuIndicator xml={chevronXml} />}
         </Slots.root>
       );
     };
   },
 });
+
+const getAccessibilityLabelWorker = (accessibilityLabel: string, child: React.ReactNode) => {
+  if (accessibilityLabel !== undefined) {
+    return accessibilityLabel;
+  }
+
+  if (typeof child === 'string') {
+    return child;
+  }
+
+  return '';
+};
+export const getAccessibilityLabel = memoize(getAccessibilityLabelWorker);

package/src/MenuItem/MenuItem.types.ts

@@ -9,11 +9,29 @@ import { FontTokens, IBorderTokens, IColorTokens, LayoutTokens } from '@fluentui
 export const menuItemName = 'MenuItem';
 
 export interface MenuItemTokens extends LayoutTokens, FontTokens, IBorderTokens, IColorTokens {
+  /**
+   * Height and width in pixels of the space that is reserved to align the item's text with other items which have checkmarks
+   */
   checkmarkSize?: number;
+
+  /**
+   * Amount of space in pixels around the indicator that shows that an item has a submenu
+   */
   submenuIndicatorPadding?: number;
+
+  /**
+   * Height and width in pixels of the indicator that shows that an item has a submenu
+   */
   submenuIndicatorSize?: number;
+
+  /**
+   * Space between parts of the item control in pixels
+   */
   gap?: number;
 
+  /**
+   * States of the item control
+   */
   disabled?: MenuItemTokens;
   focused?: MenuItemTokens;
   hovered?: MenuItemTokens;
@@ -21,13 +39,6 @@ export interface MenuItemTokens extends LayoutTokens, FontTokens, IBorderTokens,
 }
 
 export interface MenuItemProps extends Omit<IWithPressableOptions<ViewProps>, 'onPress'> {
-  content: string;
-
-  /**
-   * Applies disabled styles to menu item but remains focusable
-   */
-  disabled?: boolean;
-
   /**
    * A RefObject to access the IButton interface. Use this to access the public methods and properties of the component.
    */

package/src/MenuItem/useMenuItem.ts

@@ -68,7 +68,6 @@ export const useMenuItem = (props: MenuItemProps): MenuItemState => {
       accessible: true,
       accessibilityRole: 'menuitem',
       onAccessibilityTap: props.onAccessibilityTap || onInvoke,
-      accessibilityLabel: props.accessibilityLabel || props.content,
       accessibilityState: getAccessibilityState(disabled, accessibilityState),
       enableFocusRing: Platform.select({
         macos: false,

package/src/MenuItemCheckbox/MenuItemCheckbox.tsx

@@ -12,6 +12,8 @@ import {
 } from './MenuItemCheckbox.types';
 import { useMenuItemCheckbox } from './useMenuItemCheckbox';
 import { stylingSettings } from './MenuItemCheckbox.styling';
+import { getAccessibilityLabel } from '../MenuItem/MenuItem';
+import React from 'react';
 
 export const MenuItemCheckbox = compose<MenuItemCheckboxType>({
   displayName: menuItemCheckboxName,
@@ -33,17 +35,19 @@ export const menuItemFinalRender = (
   menuItem: MenuItemCheckboxState,
   Slots: Slots<MenuItemCheckboxSlotProps>,
 ): React.FunctionComponent<MenuItemCheckboxProps> => {
-  return (final: MenuItemCheckboxProps) => {
-    const mergedProps = mergeProps(menuItem.props, final);
+  return (final: MenuItemCheckboxProps, children: React.ReactNode) => {
+    const { accessibilityLabel, ...mergedProps } = mergeProps(menuItem.props, final);
     const checkmarkXml = `
     <svg>
       <path fill='currentColor' d='M9.85355 3.14645C10.0488 3.34171 10.0488 3.65829 9.85355 3.85355L5.35355 8.35355C5.15829 8.54882 4.84171 8.54882 4.64645 8.35355L2.64645 6.35355C2.45118 6.15829 2.45118 5.84171 2.64645 5.64645C2.84171 5.45118 3.15829 5.45118 3.35355 5.64645L5 7.29289L9.14645 3.14645C9.34171 2.95118 9.65829 2.95118 9.85355 3.14645Z' />
     </svg>`;
 
+    const label = getAccessibilityLabel(accessibilityLabel, children[0]);
+
     return (
-      <Slots.root {...mergedProps}>
+      <Slots.root {...mergedProps} accessibilityLabel={label}>
         <Slots.checkmark xml={checkmarkXml} />
-        {mergedProps.content && <Slots.content>{mergedProps.content}</Slots.content>}
+        {children && <Slots.content>{children}</Slots.content>}
       </Slots.root>
     );
   };

package/src/MenuItemCheckbox/MenuItemCheckbox.types.ts

@@ -9,12 +9,34 @@ import { FontTokens, IBorderTokens, IColorTokens, LayoutTokens } from '@fluentui
 export const menuItemCheckboxName = 'MenuItemCheckbox';
 
 export interface MenuItemCheckboxTokens extends LayoutTokens, FontTokens, IBorderTokens, IColorTokens {
+  /**
+   * Color of the checkmark icon
+   */
   checkmarkColor?: ColorValue;
+
+  /**
+   * Amount of space in pixels around the checkmark icon
+   */
   checkmarkPadding?: number;
+
+  /**
+   * Height and width in pixels of the checkmark icon
+   */
   checkmarkSize?: number;
+
+  /**
+   * Visibility of the checkmark icon from 0 to 1
+   */
   checkmarkVisibility?: number;
+
+  /**
+   * Space between parts of the item control in pixels
+   */
   gap?: number;
 
+  /**
+   * States of the item control
+   */
   checked?: MenuItemCheckboxTokens;
   disabled?: MenuItemCheckboxTokens;
   focused?: MenuItemCheckboxTokens;
@@ -23,13 +45,6 @@ export interface MenuItemCheckboxTokens extends LayoutTokens, FontTokens, IBorde
 }
 
 export interface MenuItemCheckboxProps extends Omit<IWithPressableOptions<ViewProps>, 'onPress'> {
-  content: string;
-
-  /**
-   * Applies disabled styles to menu item but remains focusable
-   */
-  disabled?: boolean;
-
   /**
    * A RefObject to access the IButton interface. Use this to access the public methods and properties of the component.
    */

package/src/MenuItemCheckbox/useMenuItemCheckbox.ts

@@ -54,6 +54,7 @@ export const useMenuCheckboxInteraction = (
   const defaultComponentRef = React.useRef(null);
   const {
     accessibilityActions,
+    accessibilityLabel,
     accessibilityState,
     componentRef = defaultComponentRef,
     disabled,
@@ -97,7 +98,7 @@ export const useMenuCheckboxInteraction = (
       ...pressable.props,
       accessible: true,
       accessibilityActions: accessibilityActionsProp,
-      accessibilityLabel: props.accessibilityLabel || props.content,
+      accessibilityLabel,
       accessibilityRole: 'menuitem',
       accessibilityState: getAccessibilityState(disabled, state.checked, accessibilityState),
       enableFocusRing: Platform.select({

package/src/MenuList/MenuList.types.ts

@@ -6,13 +6,33 @@ import React from 'react';
 export const menuListName = 'MenuList';
 
 export interface MenuListTokens extends LayoutTokens, IBackgroundColorTokens {
+  /**
+   * Space between items in pixels
+   */
   gap?: number;
 }
 
 export interface MenuListProps extends Omit<IViewProps, 'onPress'> {
+  /**
+   * Array of all checked items
+   */
   checked?: string[];
+
+  /**
+   * Default items to be checked on mount
+   */
   defaultChecked?: string[];
+
+  /**
+   * States that menu items can contain selectable items and reserves space for item alignment
+   */
   hasCheckmarks?: boolean;
+
+  /**
+   * Callback when checked items change
+   *
+   * @param checked Array of all currently checked values
+   */
   onCheckedChange?: (e: InteractionEvent, checked: string[]) => void;
 }
 

package/src/MenuTrigger/useMenuTrigger.ts

@@ -3,7 +3,7 @@ import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import { MenuTriggerState } from './MenuTrigger.types';
 import { AccessibilityActionEvent, AccessibilityActionName, Platform } from 'react-native';
 import React from 'react';
-import { delayHover, isCloseOnHoverOutEnabled } from '../consts';
+import { hoverDelayDefault, isCloseOnHoverOutEnabled } from '../consts';
 
 const accessibilityActions =
   Platform.OS === ('win32' as any) ? [{ name: 'Expand' as AccessibilityActionName }, { name: 'Collapse' as AccessibilityActionName }] : [];
@@ -12,7 +12,16 @@ const collapsedState = { expanded: false };
 
 export const useMenuTrigger = (): MenuTriggerState => {
   const context = useMenuContext();
-  const { open, openOnHover, popoverHoverOutTimer, setOpen, setTriggerHoverOutTimer, triggerHoverOutTimer, triggerRef } = context;
+  const {
+    hoverDelay = hoverDelayDefault,
+    open,
+    openOnHover,
+    popoverHoverOutTimer,
+    setOpen,
+    setTriggerHoverOutTimer,
+    triggerHoverOutTimer,
+    triggerRef,
+  } = context;
 
   const accessibilityState = open ? expandedState : collapsedState;
 
@@ -41,10 +50,10 @@ export const useMenuTrigger = (): MenuTriggerState => {
         e.persist();
         setTimeout(() => {
           setOpen(e, true /* isOpen */);
-        }, delayHover);
+        }, hoverDelay);
       }
     },
-    [openOnHover, setOpen, triggerHoverOutTimer, popoverHoverOutTimer],
+    [hoverDelay, openOnHover, setOpen, triggerHoverOutTimer, popoverHoverOutTimer],
   );
 
   const onHoverOut = React.useCallback(
@@ -53,11 +62,11 @@ export const useMenuTrigger = (): MenuTriggerState => {
         e.persist();
         const timer = setTimeout(() => {
           setOpen(e, false /* isOpen */);
-        }, delayHover);
+        }, hoverDelay);
         setTriggerHoverOutTimer(timer);
       }
     },
-    [openOnHover, setOpen, setTriggerHoverOutTimer],
+    [hoverDelay, openOnHover, setOpen, setTriggerHoverOutTimer],
   );
 
   const onClick = React.useCallback(

package/src/__tests__/Menu.test.tsx

@@ -22,7 +22,7 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItem content="Option 1" />
+              <MenuItem>Option 1</MenuItem>
             </MenuList>
           </MenuPopover>
         </Menu>,
@@ -40,7 +40,7 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItem content="Option 1" />
+              <MenuItem>Option 1</MenuItem>
             </MenuList>
           </MenuPopover>
         </Menu>,
@@ -58,8 +58,8 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItem content="Option 1" />
-              <MenuItem disabled content="Option 2" />
+              <MenuItem>Option 1</MenuItem>
+              <MenuItem disabled>Option 2</MenuItem>
             </MenuList>
           </MenuPopover>
         </Menu>,
@@ -77,9 +77,11 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItemCheckbox content="Option 1" name="Option 1" />
+              <MenuItemCheckbox name="Option 1">Option 1</MenuItemCheckbox>
               <MenuDivider />
-              <MenuItemCheckbox disabled content="Option 2" name="Option 2" />
+              <MenuItemCheckbox disabled name="Option 2">
+                Option 2
+              </MenuItemCheckbox>
             </MenuList>
           </MenuPopover>
         </Menu>,
@@ -97,8 +99,8 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItemRadio content="Option 1" name="Option 1" />
-              <MenuItemRadio content="Option 2" name="Option 2" />
+              <MenuItemRadio name="Option 1">Option 1</MenuItemRadio>
+              <MenuItemRadio name="Option 2">Option 2</MenuItemRadio>
             </MenuList>
           </MenuPopover>
         </Menu>,
@@ -116,9 +118,9 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItemCheckbox content="Option 1" name="Option 1" />
+              <MenuItemCheckbox name="Option 1">Option 1</MenuItemCheckbox>
               <MenuDivider />
-              <MenuItemCheckbox content="Option 2" name="Option 2" />
+              <MenuItemCheckbox name="Option 2">Option 2</MenuItemCheckbox>
             </MenuList>
           </MenuPopover>
         </Menu>,
@@ -136,9 +138,9 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItemCheckbox content="Option 1" name="Option 1" />
+              <MenuItemCheckbox name="Option 1">Option 1</MenuItemCheckbox>
               <MenuDivider />
-              <MenuItemCheckbox content="Option 2" name="Option 2" />
+              <MenuItemCheckbox name="Option 2">Option 2</MenuItemCheckbox>
             </MenuList>
           </MenuPopover>
         </Menu>,
@@ -156,14 +158,14 @@ describe('Checkbox component tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItem content="Option 1" />
+              <MenuItem>Option 1</MenuItem>
               <Menu>
                 <MenuTrigger>
-                  <MenuItem content="Option 2" />
+                  <MenuItem>Option 2</MenuItem>
                 </MenuTrigger>
                 <MenuPopover>
                   <MenuList>
-                    <MenuItem content="Option 1" />
+                    <MenuItem>Option 1</MenuItem>
                   </MenuList>
                 </MenuPopover>
               </Menu>
@@ -186,7 +188,7 @@ describe('Menu rerender tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItem content="Option 1" />
+              <MenuItem>Option 1</MenuItem>
             </MenuList>
           </MenuPopover>
         </Menu>
@@ -205,7 +207,7 @@ describe('Menu rerender tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItem content="Option 1" />
+              <MenuItem>Option 1</MenuItem>
             </MenuList>
           </MenuPopover>
         </Menu>
@@ -224,7 +226,7 @@ describe('Menu rerender tests', () => {
           </MenuTrigger>
           <MenuPopover>
             <MenuList>
-              <MenuItem accessibilityActions={action} content="Option 1" />
+              <MenuItem accessibilityActions={action}>Option 1</MenuItem>
             </MenuList>
           </MenuPopover>
         </Menu>