@fluentui/react-menu 9.6.1 → 9.6.3

package/CHANGELOG.json

@@ -2,7 +2,75 @@
   "name": "@fluentui/react-menu",
   "entries": [
     {
-      "date": "Mon, 09 Jan 2023 21:50:48 GMT",
+      "date": "Wed, 18 Jan 2023 16:30:58 GMT",
+      "tag": "@fluentui/react-menu_v9.6.3",
+      "version": "9.6.3",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-portal to v9.1.2",
+            "commit": "13cf1d07a6df4617106c731ba0379b6102a08104"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-tabster to v9.4.0",
+            "commit": "13cf1d07a6df4617106c731ba0379b6102a08104"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Mon, 16 Jan 2023 08:39:04 GMT",
+      "tag": "@fluentui/react-menu_v9.6.2",
+      "version": "9.6.2",
+      "comments": {
+        "none": [
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-menu",
+            "commit": "64bb45980d68de1219c6b36a7db5363f0a9cff9f",
+            "comment": "chore: migrate to packaged scripts"
+          }
+        ],
+        "patch": [
+          {
+            "author": "lingfangao@hotmail.com",
+            "package": "@fluentui/react-menu",
+            "commit": "ab5942ae2f6805832d2f6f6dd3b01b293df7ef89",
+            "comment": "fix: Tab should focus the window if trigger is the last focusable element"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-portal to v9.1.1",
+            "commit": "a870d8360e47f3ea03358c4e75e89e08a74845d7"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-positioning to v9.3.8",
+            "commit": "a870d8360e47f3ea03358c4e75e89e08a74845d7"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-shared-contexts to v9.1.5",
+            "commit": "a870d8360e47f3ea03358c4e75e89e08a74845d7"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-menu",
+            "comment": "Bump @fluentui/react-tabster to v9.3.7",
+            "commit": "a870d8360e47f3ea03358c4e75e89e08a74845d7"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Mon, 09 Jan 2023 21:51:23 GMT",
       "tag": "@fluentui/react-menu_v9.6.1",
       "version": "9.6.1",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,35 @@
 # Change Log - @fluentui/react-menu
 
-This log was last generated on Mon, 09 Jan 2023 21:50:48 GMT and should not be manually modified.
+This log was last generated on Wed, 18 Jan 2023 16:30:58 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.6.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.6.3)
+
+Wed, 18 Jan 2023 16:30:58 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.6.2..@fluentui/react-menu_v9.6.3)
+
+### Patches
+
+- Bump @fluentui/react-portal to v9.1.2 ([PR #26377](https://github.com/microsoft/fluentui/pull/26377) by beachball)
+- Bump @fluentui/react-tabster to v9.4.0 ([PR #26377](https://github.com/microsoft/fluentui/pull/26377) by beachball)
+
+## [9.6.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.6.2)
+
+Mon, 16 Jan 2023 08:39:04 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.6.1..@fluentui/react-menu_v9.6.2)
+
+### Patches
+
+- fix: Tab should focus the window if trigger is the last focusable element ([PR #26163](https://github.com/microsoft/fluentui/pull/26163) by lingfangao@hotmail.com)
+- Bump @fluentui/react-portal to v9.1.1 ([commit](https://github.com/microsoft/fluentui/commit/a870d8360e47f3ea03358c4e75e89e08a74845d7) by beachball)
+- Bump @fluentui/react-positioning to v9.3.8 ([commit](https://github.com/microsoft/fluentui/commit/a870d8360e47f3ea03358c4e75e89e08a74845d7) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.1.5 ([commit](https://github.com/microsoft/fluentui/commit/a870d8360e47f3ea03358c4e75e89e08a74845d7) by beachball)
+- Bump @fluentui/react-tabster to v9.3.7 ([commit](https://github.com/microsoft/fluentui/commit/a870d8360e47f3ea03358c4e75e89e08a74845d7) by beachball)
+
 ## [9.6.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu_v9.6.1)
 
-Mon, 09 Jan 2023 21:50:48 GMT 
+Mon, 09 Jan 2023 21:51:23 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu_v9.6.0..@fluentui/react-menu_v9.6.1)
 
 ### Patches

package/lib/components/Menu/useMenu.js

@@ -7,7 +7,6 @@ import { useFocusFinders } from '@fluentui/react-tabster';
 import { useMenuContext_unstable } from '../../contexts/menuContext';
 import { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';
 import { useIsSubmenu } from '../../utils/useIsSubmenu';
-import { Tab } from '@fluentui/keyboard-keys';
 /**
  * Create the state required to render Menu.
  *
@@ -138,8 +137,6 @@ const useMenuOpenState = state => {
     return (_a = state.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(state, e, data);
   });
   const shouldHandleCloseRef = React.useRef(false);
-  const shouldHandleTabRef = React.useRef(false);
-  const pressedShiftRef = React.useRef(false);
   const setOpenTimeout = React.useRef(0);
   const enteringTriggerRef = React.useRef(false);
   const [open, setOpenState] = useControllableState({
@@ -159,12 +156,6 @@ const useMenuOpenState = state => {
       state.setContextTarget(undefined);
       shouldHandleCloseRef.current = true;
     }
-    if (e.type === 'keydown') {
-      if (e.key === Tab) {
-        shouldHandleTabRef.current = true;
-        pressedShiftRef.current = e.shiftKey;
-      }
-    }
     if (data.bubble) {
       parentSetOpen(e, {
         ...data
@@ -240,39 +231,29 @@ const useMenuOpenState = state => {
   }, []);
   // Manage focus for open state
   const {
-    findFirstFocusable,
-    findNextFocusable,
-    findPrevFocusable
+    findFirstFocusable
   } = useFocusFinders();
   const focusFirst = React.useCallback(() => {
     const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);
     firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
   }, [findFirstFocusable, state.menuPopoverRef]);
-  const focusAfterMenuTrigger = React.useCallback(() => {
-    const nextFocusable = findNextFocusable(state.triggerRef.current);
-    nextFocusable === null || nextFocusable === void 0 ? void 0 : nextFocusable.focus();
-  }, [findNextFocusable, state.triggerRef]);
-  const focusBeforeMenuTrigger = React.useCallback(() => {
-    const prevFocusable = findPrevFocusable(state.triggerRef.current);
-    prevFocusable === null || prevFocusable === void 0 ? void 0 : prevFocusable.focus();
-  }, [findPrevFocusable, state.triggerRef]);
   React.useEffect(() => {
     var _a;
     if (open) {
       focusFirst();
     } else {
       if (shouldHandleCloseRef.current) {
-        if (shouldHandleTabRef.current && !state.isSubmenu) {
-          pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();
-        } else {
-          (_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
+        // We know that React effects are sync so we focus the trigger here
+        // after any event handler (event handlers will update state and re-render).
+        // Since the browser only performs the default behaviour for the Tab key once
+        // keyboard events have fully bubbled up the window, the browser will move
+        // focus to the next tabbable element before/after the trigger if needed.
+        // If the Tab key was not pressed, focus will remain on the trigger as expected.
+        (_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
       }
     }
     shouldHandleCloseRef.current = false;
-    shouldHandleTabRef.current = false;
-    pressedShiftRef.current = false;
-  }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);
+  }, [state.triggerRef, state.isSubmenu, open, focusFirst]);
   return [open, setOpen];
 };
 //# sourceMappingURL=useMenu.js.map

package/lib/components/Menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["React","usePositioningMouseTarget","usePositioning","resolvePositioningShorthand","useControllableState","useId","useOnClickOutside","useEventCallback","useOnScrollOutside","useFluent_unstable","useFluent","elementContains","useFocusFinders","useMenuContext_unstable","MENU_ENTER_EVENT","useOnMenuMouseEnter","useIsSubmenu","Tab","useMenu_unstable","props","isSubmenu","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","triggerId","contextTarget","setContextTarget","positioningState","position","align","target","undefined","positioning","children","Children","toArray","process","env","NODE_ENV","length","console","warn","menuTrigger","menuPopover","targetRef","triggerRef","containerRef","menuPopoverRef","open","setOpen","useMenuOpenState","defaultOpen","onOpenChange","checkedValues","onCheckedValueChange","useMenuSelectableState","components","setCheckedValues","state","defaultState","initialState","e","name","checkedItems","currentValue","targetDocument","parentSetOpen","context","data","shouldHandleCloseRef","useRef","shouldHandleTabRef","pressedShiftRef","setOpenTimeout","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","detail","nativeEvent","current","key","shiftKey","bubble","clearTimeout","Event","persist","contains","setTimeout","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","findNextFocusable","findPrevFocusable","focusFirst","useCallback","firstFocusable","focus","focusAfterMenuTrigger","nextFocusable","focusBeforeMenuTrigger","prevFocusable"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePositioningMouseTarget, usePositioning, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\nimport { Tab } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const shouldHandleTabRef = React.useRef(false);\n  const pressedShiftRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (e.type === 'keydown') {\n      if ((e as React.KeyboardEvent<HTMLElement>).key === Tab) {\n        shouldHandleTabRef.current = true;\n        pressedShiftRef.current = (e as React.KeyboardEvent<HTMLElement>).shiftKey;\n      }\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable, findNextFocusable, findPrevFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  const focusAfterMenuTrigger = React.useCallback(() => {\n    const nextFocusable = findNextFocusable(state.triggerRef.current);\n    nextFocusable?.focus();\n  }, [findNextFocusable, state.triggerRef]);\n\n  const focusBeforeMenuTrigger = React.useCallback(() => {\n    const prevFocusable = findPrevFocusable(state.triggerRef.current);\n    prevFocusable?.focus();\n  }, [findPrevFocusable, state.triggerRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        if (shouldHandleTabRef.current && !state.isSubmenu) {\n          pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();\n        } else {\n          state.triggerRef.current?.focus();\n        }\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n    shouldHandleTabRef.current = false;\n    pressedShiftRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);\n\n  return [open, setOpen] as const;\n};\n"]}
+{"version":3,"mappings":"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","names":["React","usePositioningMouseTarget","usePositioning","resolvePositioningShorthand","useControllableState","useId","useOnClickOutside","useEventCallback","useOnScrollOutside","useFluent_unstable","useFluent","elementContains","useFocusFinders","useMenuContext_unstable","MENU_ENTER_EVENT","useOnMenuMouseEnter","useIsSubmenu","useMenu_unstable","props","isSubmenu","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","triggerId","contextTarget","setContextTarget","positioningState","position","align","target","undefined","positioning","children","Children","toArray","process","env","NODE_ENV","length","console","warn","menuTrigger","menuPopover","targetRef","triggerRef","containerRef","menuPopoverRef","open","setOpen","useMenuOpenState","defaultOpen","onOpenChange","checkedValues","onCheckedValueChange","useMenuSelectableState","components","setCheckedValues","state","defaultState","initialState","e","name","checkedItems","currentValue","targetDocument","parentSetOpen","context","data","shouldHandleCloseRef","useRef","setOpenTimeout","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","detail","nativeEvent","current","bubble","clearTimeout","Event","persist","contains","setTimeout","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","focusFirst","useCallback","firstFocusable","focus"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePositioningMouseTarget, usePositioning, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        // We know that React effects are sync so we focus the trigger here\n        // after any event handler (event handlers will update state and re-render).\n        // Since the browser only performs the default behaviour for the Tab key once\n        // keyboard events have fully bubbled up the window, the browser will move\n        // focus to the next tabbable element before/after the trigger if needed.\n        // If the Tab key was not pressed, focus will remain on the trigger as expected.\n        state.triggerRef.current?.focus();\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst]);\n\n  return [open, setOpen] as const;\n};\n"]}

package/lib/components/MenuPopover/useMenuPopover.js

@@ -92,7 +92,6 @@ export const useMenuPopover_unstable = (props, ref) => {
         type: 'menuPopoverKeyDown',
         event
       });
-      event.preventDefault();
     }
     onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(event);
   });

package/lib/components/MenuPopover/useMenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["React","ArrowLeft","Tab","ArrowRight","Escape","getNativeElementProps","useEventCallback","useMergedRefs","useMenuContext_unstable","dispatchMenuEnterEvent","useFluent_unstable","useFluent","useIsSubmenu","useMenuPopover_unstable","props","ref","popoverRef","context","menuPopoverRef","setOpen","open","openOnHover","isSubmenu","canDispatchCustomEventRef","useRef","throttleDispatchTimerRef","dir","CloseArrowKey","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","setTimeout","useEffect","clearTimeout","inline","rootProps","role","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","stopPropagation","preventDefault","components","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const rootProps = getNativeElementProps('div', {\n    role: 'presentation',\n    ...props,\n    ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n  });\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLElement>) => {\n    if (openOnHover) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n\n    onMouseEnterOriginal?.(event);\n  });\n\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLElement>) => {\n    const key = event.key;\n\n    if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement)) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover and Tooltip\n        event.stopPropagation();\n      }\n    }\n\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n      event.preventDefault();\n    }\n\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    components: {\n      root: 'div',\n    },\n    root: rootProps,\n  };\n};\n"]}
+{"version":3,"mappings":"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","names":["React","ArrowLeft","Tab","ArrowRight","Escape","getNativeElementProps","useEventCallback","useMergedRefs","useMenuContext_unstable","dispatchMenuEnterEvent","useFluent_unstable","useFluent","useIsSubmenu","useMenuPopover_unstable","props","ref","popoverRef","context","menuPopoverRef","setOpen","open","openOnHover","isSubmenu","canDispatchCustomEventRef","useRef","throttleDispatchTimerRef","dir","CloseArrowKey","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","setTimeout","useEffect","clearTimeout","inline","rootProps","role","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","stopPropagation","components","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const rootProps = getNativeElementProps('div', {\n    role: 'presentation',\n    ...props,\n    ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n  });\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLElement>) => {\n    if (openOnHover) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n\n    onMouseEnterOriginal?.(event);\n  });\n\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLElement>) => {\n    const key = event.key;\n\n    if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement)) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover and Tooltip\n        event.stopPropagation();\n      }\n    }\n\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n    }\n\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    components: {\n      root: 'div',\n    },\n    root: rootProps,\n  };\n};\n"]}

package/lib-amd/components/Menu/useMenu.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "tslib", "react", "@fluentui/react-positioning", "@fluentui/react-utilities", "@fluentui/react-shared-contexts", "@fluentui/react-portal", "@fluentui/react-tabster", "../../contexts/menuContext", "../../utils/index", "../../utils/useIsSubmenu", "@fluentui/keyboard-keys"], function (require, exports, tslib_1, React, react_positioning_1, react_utilities_1, react_shared_contexts_1, react_portal_1, react_tabster_1, menuContext_1, index_1, useIsSubmenu_1, keyboard_keys_1) {
+define(["require", "exports", "tslib", "react", "@fluentui/react-positioning", "@fluentui/react-utilities", "@fluentui/react-shared-contexts", "@fluentui/react-portal", "@fluentui/react-tabster", "../../contexts/menuContext", "../../utils/index", "../../utils/useIsSubmenu"], function (require, exports, tslib_1, React, react_positioning_1, react_utilities_1, react_shared_contexts_1, react_portal_1, react_tabster_1, menuContext_1, index_1, useIsSubmenu_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.useMenu_unstable = void 0;
@@ -106,8 +106,6 @@ define(["require", "exports", "tslib", "react", "@fluentui/react-positioning", "
         var parentSetOpen = menuContext_1.useMenuContext_unstable(function (context) { return context.setOpen; });
         var onOpenChange = react_utilities_1.useEventCallback(function (e, data) { var _a; return (_a = state.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(state, e, data); });
         var shouldHandleCloseRef = React.useRef(false);
-        var shouldHandleTabRef = React.useRef(false);
-        var pressedShiftRef = React.useRef(false);
         var setOpenTimeout = React.useRef(0);
         var enteringTriggerRef = React.useRef(false);
         var _a = react_utilities_1.useControllableState({
@@ -125,12 +123,6 @@ define(["require", "exports", "tslib", "react", "@fluentui/react-positioning", "
                 state.setContextTarget(undefined);
                 shouldHandleCloseRef.current = true;
             }
-            if (e.type === 'keydown') {
-                if (e.key === keyboard_keys_1.Tab) {
-                    shouldHandleTabRef.current = true;
-                    pressedShiftRef.current = e.shiftKey;
-                }
-            }
             if (data.bubble) {
                 parentSetOpen(e, tslib_1.__assign({}, data));
             }
@@ -192,19 +184,11 @@ define(["require", "exports", "tslib", "react", "@fluentui/react-positioning", "
             };
         }, []);
         // Manage focus for open state
-        var _b = react_tabster_1.useFocusFinders(), findFirstFocusable = _b.findFirstFocusable, findNextFocusable = _b.findNextFocusable, findPrevFocusable = _b.findPrevFocusable;
+        var findFirstFocusable = react_tabster_1.useFocusFinders().findFirstFocusable;
         var focusFirst = React.useCallback(function () {
             var firstFocusable = findFirstFocusable(state.menuPopoverRef.current);
             firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
         }, [findFirstFocusable, state.menuPopoverRef]);
-        var focusAfterMenuTrigger = React.useCallback(function () {
-            var nextFocusable = findNextFocusable(state.triggerRef.current);
-            nextFocusable === null || nextFocusable === void 0 ? void 0 : nextFocusable.focus();
-        }, [findNextFocusable, state.triggerRef]);
-        var focusBeforeMenuTrigger = React.useCallback(function () {
-            var prevFocusable = findPrevFocusable(state.triggerRef.current);
-            prevFocusable === null || prevFocusable === void 0 ? void 0 : prevFocusable.focus();
-        }, [findPrevFocusable, state.triggerRef]);
         React.useEffect(function () {
             var _a;
             if (open) {
@@ -212,18 +196,17 @@ define(["require", "exports", "tslib", "react", "@fluentui/react-positioning", "
             }
             else {
                 if (shouldHandleCloseRef.current) {
-                    if (shouldHandleTabRef.current && !state.isSubmenu) {
-                        pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();
-                    }
-                    else {
-                        (_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-                    }
+                    // We know that React effects are sync so we focus the trigger here
+                    // after any event handler (event handlers will update state and re-render).
+                    // Since the browser only performs the default behaviour for the Tab key once
+                    // keyboard events have fully bubbled up the window, the browser will move
+                    // focus to the next tabbable element before/after the trigger if needed.
+                    // If the Tab key was not pressed, focus will remain on the trigger as expected.
+                    (_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
                 }
             }
             shouldHandleCloseRef.current = false;
-            shouldHandleTabRef.current = false;
-            pressedShiftRef.current = false;
-        }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);
+        }, [state.triggerRef, state.isSubmenu, open, focusFirst]);
         return [open, setOpen];
     };
 });

package/lib-amd/components/Menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenu.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { usePositioningMouseTarget, usePositioning, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\nimport { Tab } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const shouldHandleTabRef = React.useRef(false);\n  const pressedShiftRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (e.type === 'keydown') {\n      if ((e as React.KeyboardEvent<HTMLElement>).key === Tab) {\n        shouldHandleTabRef.current = true;\n        pressedShiftRef.current = (e as React.KeyboardEvent<HTMLElement>).shiftKey;\n      }\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable, findNextFocusable, findPrevFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  const focusAfterMenuTrigger = React.useCallback(() => {\n    const nextFocusable = findNextFocusable(state.triggerRef.current);\n    nextFocusable?.focus();\n  }, [findNextFocusable, state.triggerRef]);\n\n  const focusBeforeMenuTrigger = React.useCallback(() => {\n    const prevFocusable = findPrevFocusable(state.triggerRef.current);\n    prevFocusable?.focus();\n  }, [findPrevFocusable, state.triggerRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        if (shouldHandleTabRef.current && !state.isSubmenu) {\n          pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();\n        } else {\n          state.triggerRef.current?.focus();\n        }\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n    shouldHandleTabRef.current = false;\n    pressedShiftRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);\n\n  return [open, setOpen] as const;\n};\n"]}
+{"version":3,"file":"useMenu.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { usePositioningMouseTarget, usePositioning, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        // We know that React effects are sync so we focus the trigger here\n        // after any event handler (event handlers will update state and re-render).\n        // Since the browser only performs the default behaviour for the Tab key once\n        // keyboard events have fully bubbled up the window, the browser will move\n        // focus to the next tabbable element before/after the trigger if needed.\n        // If the Tab key was not pressed, focus will remain on the trigger as expected.\n        state.triggerRef.current?.focus();\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst]);\n\n  return [open, setOpen] as const;\n};\n"]}

package/lib-amd/components/MenuPopover/useMenuPopover.js

@@ -65,7 +65,6 @@ define(["require", "exports", "tslib", "react", "@fluentui/keyboard-keys", "@flu
             }
             if (key === keyboard_keys_1.Tab) {
                 setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event: event });
-                event.preventDefault();
             }
             onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(event);
         });

package/lib-amd/components/MenuPopover/useMenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuPopover.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const rootProps = getNativeElementProps('div', {\n    role: 'presentation',\n    ...props,\n    ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n  });\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLElement>) => {\n    if (openOnHover) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n\n    onMouseEnterOriginal?.(event);\n  });\n\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLElement>) => {\n    const key = event.key;\n\n    if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement)) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover and Tooltip\n        event.stopPropagation();\n      }\n    }\n\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n      event.preventDefault();\n    }\n\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    components: {\n      root: 'div',\n    },\n    root: rootProps,\n  };\n};\n"]}
+{"version":3,"file":"useMenuPopover.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-menu/src/components/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const rootProps = getNativeElementProps('div', {\n    role: 'presentation',\n    ...props,\n    ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n  });\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLElement>) => {\n    if (openOnHover) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n\n    onMouseEnterOriginal?.(event);\n  });\n\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLElement>) => {\n    const key = event.key;\n\n    if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement)) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover and Tooltip\n        event.stopPropagation();\n      }\n    }\n\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n    }\n\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    components: {\n      root: 'div',\n    },\n    root: rootProps,\n  };\n};\n"]}

package/lib-commonjs/components/Menu/useMenu.js

@@ -13,7 +13,6 @@ const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
 const menuContext_1 = /*#__PURE__*/require("../../contexts/menuContext");
 const index_1 = /*#__PURE__*/require("../../utils/index");
 const useIsSubmenu_1 = /*#__PURE__*/require("../../utils/useIsSubmenu");
-const keyboard_keys_1 = /*#__PURE__*/require("@fluentui/keyboard-keys");
 /**
  * Create the state required to render Menu.
  *
@@ -145,8 +144,6 @@ const useMenuOpenState = state => {
     return (_a = state.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(state, e, data);
   });
   const shouldHandleCloseRef = React.useRef(false);
-  const shouldHandleTabRef = React.useRef(false);
-  const pressedShiftRef = React.useRef(false);
   const setOpenTimeout = React.useRef(0);
   const enteringTriggerRef = React.useRef(false);
   const [open, setOpenState] = react_utilities_1.useControllableState({
@@ -166,12 +163,6 @@ const useMenuOpenState = state => {
       state.setContextTarget(undefined);
       shouldHandleCloseRef.current = true;
     }
-    if (e.type === 'keydown') {
-      if (e.key === keyboard_keys_1.Tab) {
-        shouldHandleTabRef.current = true;
-        pressedShiftRef.current = e.shiftKey;
-      }
-    }
     if (data.bubble) {
       parentSetOpen(e, {
         ...data
@@ -247,39 +238,29 @@ const useMenuOpenState = state => {
   }, []);
   // Manage focus for open state
   const {
-    findFirstFocusable,
-    findNextFocusable,
-    findPrevFocusable
+    findFirstFocusable
   } = react_tabster_1.useFocusFinders();
   const focusFirst = React.useCallback(() => {
     const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);
     firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
   }, [findFirstFocusable, state.menuPopoverRef]);
-  const focusAfterMenuTrigger = React.useCallback(() => {
-    const nextFocusable = findNextFocusable(state.triggerRef.current);
-    nextFocusable === null || nextFocusable === void 0 ? void 0 : nextFocusable.focus();
-  }, [findNextFocusable, state.triggerRef]);
-  const focusBeforeMenuTrigger = React.useCallback(() => {
-    const prevFocusable = findPrevFocusable(state.triggerRef.current);
-    prevFocusable === null || prevFocusable === void 0 ? void 0 : prevFocusable.focus();
-  }, [findPrevFocusable, state.triggerRef]);
   React.useEffect(() => {
     var _a;
     if (open) {
       focusFirst();
     } else {
       if (shouldHandleCloseRef.current) {
-        if (shouldHandleTabRef.current && !state.isSubmenu) {
-          pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();
-        } else {
-          (_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
+        // We know that React effects are sync so we focus the trigger here
+        // after any event handler (event handlers will update state and re-render).
+        // Since the browser only performs the default behaviour for the Tab key once
+        // keyboard events have fully bubbled up the window, the browser will move
+        // focus to the next tabbable element before/after the trigger if needed.
+        // If the Tab key was not pressed, focus will remain on the trigger as expected.
+        (_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
       }
     }
     shouldHandleCloseRef.current = false;
-    shouldHandleTabRef.current = false;
-    pressedShiftRef.current = false;
-  }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);
+  }, [state.triggerRef, state.isSubmenu, open, focusFirst]);
   return [open, setOpen];
 };
 //# sourceMappingURL=useMenu.js.map

package/lib-commonjs/components/Menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AAOA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;;;;;;;;AAQO,MAAMA,gBAAgB,GAAIC,KAAgB,IAAe;EAC9D,MAAMC,SAAS,GAAGC,2BAAY,EAAE;EAChC,MAAM;IACJC,UAAU,GAAG,GAAG;IAChBC,MAAM,GAAG,KAAK;IACdC,aAAa,GAAG,KAAK;IACrBC,QAAQ,GAAG,KAAK;IAChBC,aAAa,GAAG,KAAK;IACrBC,aAAa,GAAG,KAAK;IACrBC,kBAAkB,GAAG,KAAK;IAC1BC,WAAW,GAAGT,SAAS;IACvBU;EAAoB,CACrB,GAAGX,KAAK;EACT,MAAMY,SAAS,GAAGC,uBAAK,CAAC,MAAM,CAAC;EAC/B,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGC,6CAAyB,EAAE;EAErE,MAAMC,gBAAgB,GAAG;IACvBC,QAAQ,EAAEjB,SAAS,GAAG,OAAO,GAAG,OAAO;IACvCkB,KAAK,EAAElB,SAAS,GAAG,KAAK,GAAG,OAAO;IAClCmB,MAAM,EAAEpB,KAAK,CAACQ,aAAa,GAAGM,aAAa,GAAGO,SAAS;IACvD,GAAGL,+CAA2B,CAAChB,KAAK,CAACsB,WAAW;GACxC;EAEV,MAAMC,QAAQ,GAAGC,KAAK,CAACC,QAAQ,CAACC,OAAO,CAAC1B,KAAK,CAACuB,QAAQ,CAAyB;EAE/E,IAAII,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,EAAE;IACzC,IAAIN,QAAQ,CAACO,MAAM,KAAK,CAAC,EAAE;MACzB;MACAC,OAAO,CAACC,IAAI,CAAC,sCAAsC,CAAC;;IAGtD,IAAIT,QAAQ,CAACO,MAAM,GAAG,CAAC,EAAE;MACvB;MACAC,OAAO,CAACC,IAAI,CAAC,wCAAwC,CAAC;;;EAI1D,IAAIC,WAAW,GAAmCZ,SAAS;EAC3D,IAAIa,WAAW,GAAmCb,SAAS;EAC3D,IAAIE,QAAQ,CAACO,MAAM,KAAK,CAAC,EAAE;IACzBG,WAAW,GAAGV,QAAQ,CAAC,CAAC,CAAC;IACzBW,WAAW,GAAGX,QAAQ,CAAC,CAAC,CAAC;GAC1B,MAAM,IAAIA,QAAQ,CAACO,MAAM,KAAK,CAAC,EAAE;IAChCI,WAAW,GAAGX,QAAQ,CAAC,CAAC,CAAC;;EAG3B,MAAM;IAAEY,SAAS,EAAEC,UAAU;IAAEC,YAAY,EAAEC;EAAc,CAAE,GAAGtB,kCAAc,CAACC,gBAAgB,CAAC;EAEhG;EACA,MAAM,CAACsB,IAAI,EAAEC,OAAO,CAAC,GAAGC,gBAAgB,CAAC;IACvCtC,UAAU;IACVF,SAAS;IACTc,gBAAgB;IAChBR,aAAa;IACb+B,cAAc;IACdF,UAAU;IACVG,IAAI,EAAEvC,KAAK,CAACuC,IAAI;IAChBG,WAAW,EAAE1C,KAAK,CAAC0C,WAAW;IAC9BC,YAAY,EAAE3C,KAAK,CAAC2C,YAAY;IAChCnC;GACD,CAAC;EAEF,MAAM,CAACoC,aAAa,EAAEC,oBAAoB,CAAC,GAAGC,sBAAsB,CAAC;IACnEF,aAAa,EAAE5C,KAAK,CAAC4C,aAAa;IAClCjC,oBAAoB;IACpBkC,oBAAoB,EAAE7C,KAAK,CAAC6C;GAC7B,CAAC;EAEF,OAAO;IACLzC,MAAM;IACND,UAAU;IACVS,SAAS;IACTX,SAAS;IACTS,WAAW;IACXI,aAAa;IACbC,gBAAgB;IAChBV,aAAa;IACbC,QAAQ;IACRC,aAAa;IACb0B,WAAW;IACXC,WAAW;IACXE,UAAU;IACVE,cAAc;IACdS,UAAU,EAAE,EAAE;IACdvC,aAAa;IACb+B,IAAI;IACJC,OAAO;IACPI,aAAa;IACbC,oBAAoB;IACpBpC;GACD;AACH,CAAC;AA3FYuC,wBAAgB;AA6F7B;;;;AAIA,MAAMF,sBAAsB,GAC1B9C,KAAyF,IACvF;EACF,MAAM,CAAC4C,aAAa,EAAEK,gBAAgB,CAAC,GAAGpC,sCAAoB,CAAC;IAC7DqC,KAAK,EAAElD,KAAK,CAAC4C,aAAa;IAC1BO,YAAY,EAAEnD,KAAK,CAACW,oBAAoB;IACxCyC,YAAY,EAAE;GACf,CAAC;EACF,MAAMP,oBAAoB,GAAsChC,kCAAgB,CAAC,CAACwC,CAAC,EAAE;IAAEC,IAAI;IAAEC;EAAY,CAAE,KAAI;;IAC7G,WAAK,CAACV,oBAAoB,+CAA1B7C,KAAK,EAAwBqD,CAAC,EAAE;MAAEC,IAAI;MAAEC;IAAY,CAAE,CAAC;IAEvDN,gBAAgB,CAACO,YAAY,KAAK;MAChC,GAAGA,YAAY;MACf,CAACF,IAAI,GAAGC;KACT,CAAC,CAAC;EACL,CAAC,CAAC;EAEF,OAAO,CAACX,aAAa,EAAEC,oBAAoB,CAAU;AACvD,CAAC;AAED,MAAMJ,gBAAgB,GACpBS,KAU0D,IACxD;EACF,MAAM;IAAEO;EAAc,CAAE,GAAGC,0CAAS,EAAE;EACtC,MAAMC,aAAa,GAAGC,qCAAuB,CAACC,OAAO,IAAIA,OAAO,CAACrB,OAAO,CAAC;EACzE,MAAMG,YAAY,GAA8B9B,kCAAgB,CAAC,CAACwC,CAAC,EAAES,IAAI,KAAI;IAAA;IAAC,kBAAK,CAACnB,YAAY,+CAAlBO,KAAK,EAAgBG,CAAC,EAAES,IAAI,CAAC;EAAA,EAAC;EAE5G,MAAMC,oBAAoB,GAAGvC,KAAK,CAACwC,MAAM,CAAC,KAAK,CAAC;EAChD,MAAMC,kBAAkB,GAAGzC,KAAK,CAACwC,MAAM,CAAC,KAAK,CAAC;EAC9C,MAAME,eAAe,GAAG1C,KAAK,CAACwC,MAAM,CAAC,KAAK,CAAC;EAC3C,MAAMG,cAAc,GAAG3C,KAAK,CAACwC,MAAM,CAAC,CAAC,CAAC;EACtC,MAAMI,kBAAkB,GAAG5C,KAAK,CAACwC,MAAM,CAAC,KAAK,CAAC;EAE9C,MAAM,CAACzB,IAAI,EAAE8B,YAAY,CAAC,GAAGxD,sCAAoB,CAAC;IAChDqC,KAAK,EAAEA,KAAK,CAACX,IAAI;IACjBY,YAAY,EAAED,KAAK,CAACR,WAAW;IAC/BU,YAAY,EAAE;GACf,CAAC;EAEF,MAAMkB,UAAU,GAAGzD,kCAAgB,CAAC,CAACwC,CAAgB,EAAES,IAAwB,KAAI;IACjF,MAAMS,KAAK,GAAGlB,CAAC,YAAYmB,WAAW,IAAInB,CAAC,CAACoB,IAAI,KAAKC,wBAAgB,GAAGrB,CAAC,CAACsB,MAAM,CAACC,WAAW,GAAGvB,CAAC;IAChGV,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAG4B,KAAK,EAAE;MAAE,GAAGT;IAAI,CAAE,CAAC;IAClC,IAAIA,IAAI,CAACvB,IAAI,IAAIc,CAAC,CAACoB,IAAI,KAAK,aAAa,EAAE;MACzCvB,KAAK,CAACnC,gBAAgB,CAACsC,CAAqB,CAAC;;IAG/C,IAAI,CAACS,IAAI,CAACvB,IAAI,EAAE;MACdW,KAAK,CAACnC,gBAAgB,CAACM,SAAS,CAAC;MACjC0C,oBAAoB,CAACc,OAAO,GAAG,IAAI;;IAGrC,IAAIxB,CAAC,CAACoB,IAAI,KAAK,SAAS,EAAE;MACxB,IAAKpB,CAAsC,CAACyB,GAAG,KAAKC,mBAAG,EAAE;QACvDd,kBAAkB,CAACY,OAAO,GAAG,IAAI;QACjCX,eAAe,CAACW,OAAO,GAAIxB,CAAsC,CAAC2B,QAAQ;;;IAI9E,IAAIlB,IAAI,CAACmB,MAAM,EAAE;MACftB,aAAa,CAACN,CAAC,EAAE;QAAE,GAAGS;MAAI,CAAE,CAAC;;IAG/BO,YAAY,CAACP,IAAI,CAACvB,IAAI,CAAC;EACzB,CAAC,CAAC;EAEF,MAAMC,OAAO,GAAG3B,kCAAgB,CAAC,CAACwC,CAAgB,EAAES,IAAwB,KAAI;;IAC9EoB,YAAY,CAACf,cAAc,CAACU,OAAO,CAAC;IACpC,IAAI,EAAExB,CAAC,YAAY8B,KAAK,CAAC,IAAI9B,CAAC,CAAC+B,OAAO,EAAE;MACtC;MACA/B,CAAC,CAAC+B,OAAO,EAAE;;IAGb,IAAI/B,CAAC,CAACoB,IAAI,KAAK,YAAY,IAAIpB,CAAC,CAACoB,IAAI,KAAK,YAAY,IAAIpB,CAAC,CAACoB,IAAI,KAAK,WAAW,IAAIpB,CAAC,CAACoB,IAAI,KAAKC,wBAAgB,EAAE;MAC/G,IAAI,WAAK,CAACtC,UAAU,CAACyC,OAAO,0CAAEQ,QAAQ,CAAChC,CAAC,CAACjC,MAAqB,CAAC,EAAE;QAC/DgD,kBAAkB,CAACS,OAAO,GAAGxB,CAAC,CAACoB,IAAI,KAAK,YAAY,IAAIpB,CAAC,CAACoB,IAAI,KAAK,WAAW;;MAGhF;MACA;MACA;MACAN,cAAc,CAACU,OAAO,GAAGS,UAAU,CAAC,MAAMhB,UAAU,CAACjB,CAAC,EAAES,IAAI,CAAC,EAAEZ,KAAK,CAAC/C,UAAU,CAAC;KACjF,MAAM;MACLmE,UAAU,CAACjB,CAAC,EAAES,IAAI,CAAC;;EAEvB,CAAC,CAAC;EAEFjD,mCAAiB,CAAC;IAChBwE,QAAQ,EAAEE,8BAAe;IACzBC,QAAQ,EAAE,CAACjD,IAAI;IACfkD,OAAO,EAAEhC,cAAc;IACvBiC,IAAI,EAAE,CAACxC,KAAK,CAACZ,cAAc,EAAE,CAACY,KAAK,CAAC1C,aAAa,IAAI0C,KAAK,CAACd,UAAU,CAAC,CAACuD,MAAM,CAC3EC,OAAO,CACiC;IAC1CC,QAAQ,EAAEtB,KAAK,IAAI/B,OAAO,CAAC+B,KAAK,EAAE;MAAEhC,IAAI,EAAE,KAAK;MAAEkC,IAAI,EAAE,cAAc;MAAEF;IAAK,CAAE;GAC/E,CAAC;EAEF;EACA,MAAMhE,aAAa,GAAG2C,KAAK,CAAC1C,aAAa,IAAI0C,KAAK,CAAC3C,aAAa;EAChEM,oCAAkB,CAAC;IACjBwE,QAAQ,EAAEE,8BAAe;IACzBE,OAAO,EAAEhC,cAAc;IACvBoC,QAAQ,EAAEtB,KAAK,IAAI/B,OAAO,CAAC+B,KAAK,EAAE;MAAEhC,IAAI,EAAE,KAAK;MAAEkC,IAAI,EAAE,eAAe;MAAEF;IAAK,CAAE,CAAC;IAChFmB,IAAI,EAAE,CAACxC,KAAK,CAACZ,cAAc,EAAE,CAACY,KAAK,CAAC1C,aAAa,IAAI0C,KAAK,CAACd,UAAU,CAAC,CAACuD,MAAM,CAC3EC,OAAO,CACiC;IAC1CJ,QAAQ,EAAE,CAACjD,IAAI,IAAI,CAAChC;GACrB,CAAC;EAEFmE,2BAAmB,CAAC;IAClBe,OAAO,EAAEhC,cAAc;IACvBoC,QAAQ,EAAEtB,KAAK,IAAG;MAChB;MACA;MACA,IAAI,CAACH,kBAAkB,CAACS,OAAO,EAAE;QAC/BrC,OAAO,CAAC+B,KAAK,EAAE;UAAEhC,IAAI,EAAE,KAAK;UAAEkC,IAAI,EAAE,gBAAgB;UAAEF;QAAK,CAAE,CAAC;;IAElE,CAAC;IACDiB,QAAQ,EAAE,CAACjD,IAAI;IACfmD,IAAI,EAAE,CAACxC,KAAK,CAACZ,cAAc;GAC5B,CAAC;EAEF;EACA;EACAd,KAAK,CAACsE,SAAS,CAAC,MAAK;IACnB,OAAO,MAAK;MACVZ,YAAY,CAACf,cAAc,CAACU,OAAO,CAAC;IACtC,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN;EACA,MAAM;IAAEkB,kBAAkB;IAAEC,iBAAiB;IAAEC;EAAiB,CAAE,GAAGC,+BAAe,EAAE;EACtF,MAAMC,UAAU,GAAG3E,KAAK,CAAC4E,WAAW,CAAC,MAAK;IACxC,MAAMC,cAAc,GAAGN,kBAAkB,CAAC7C,KAAK,CAACZ,cAAc,CAACuC,OAAO,CAAC;IACvEwB,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEC,KAAK,EAAE;EACzB,CAAC,EAAE,CAACP,kBAAkB,EAAE7C,KAAK,CAACZ,cAAc,CAAC,CAAC;EAE9C,MAAMiE,qBAAqB,GAAG/E,KAAK,CAAC4E,WAAW,CAAC,MAAK;IACnD,MAAMI,aAAa,GAAGR,iBAAiB,CAAC9C,KAAK,CAACd,UAAU,CAACyC,OAAO,CAAC;IACjE2B,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEF,KAAK,EAAE;EACxB,CAAC,EAAE,CAACN,iBAAiB,EAAE9C,KAAK,CAACd,UAAU,CAAC,CAAC;EAEzC,MAAMqE,sBAAsB,GAAGjF,KAAK,CAAC4E,WAAW,CAAC,MAAK;IACpD,MAAMM,aAAa,GAAGT,iBAAiB,CAAC/C,KAAK,CAACd,UAAU,CAACyC,OAAO,CAAC;IACjE6B,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEJ,KAAK,EAAE;EACxB,CAAC,EAAE,CAACL,iBAAiB,EAAE/C,KAAK,CAACd,UAAU,CAAC,CAAC;EAEzCZ,KAAK,CAACsE,SAAS,CAAC,MAAK;;IACnB,IAAIvD,IAAI,EAAE;MACR4D,UAAU,EAAE;KACb,MAAM;MACL,IAAIpC,oBAAoB,CAACc,OAAO,EAAE;QAChC,IAAIZ,kBAAkB,CAACY,OAAO,IAAI,CAAC3B,KAAK,CAACjD,SAAS,EAAE;UAClDiE,eAAe,CAACW,OAAO,GAAG4B,sBAAsB,EAAE,GAAGF,qBAAqB,EAAE;SAC7E,MAAM;UACL,WAAK,CAACnE,UAAU,CAACyC,OAAO,0CAAEyB,KAAK,EAAE;;;;IAKvCvC,oBAAoB,CAACc,OAAO,GAAG,KAAK;IACpCZ,kBAAkB,CAACY,OAAO,GAAG,KAAK;IAClCX,eAAe,CAACW,OAAO,GAAG,KAAK;EACjC,CAAC,EAAE,CAAC3B,KAAK,CAACd,UAAU,EAAEc,KAAK,CAACjD,SAAS,EAAEsC,IAAI,EAAE4D,UAAU,EAAEI,qBAAqB,EAAEE,sBAAsB,CAAC,CAAC;EAExG,OAAO,CAAClE,IAAI,EAAEC,OAAO,CAAU;AACjC,CAAC","names":["useMenu_unstable","props","isSubmenu","useIsSubmenu_1","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","triggerId","react_utilities_1","contextTarget","setContextTarget","react_positioning_1","positioningState","position","align","target","undefined","positioning","children","React","Children","toArray","process","env","NODE_ENV","length","console","warn","menuTrigger","menuPopover","targetRef","triggerRef","containerRef","menuPopoverRef","open","setOpen","useMenuOpenState","defaultOpen","onOpenChange","checkedValues","onCheckedValueChange","useMenuSelectableState","components","exports","setCheckedValues","state","defaultState","initialState","e","name","checkedItems","currentValue","targetDocument","react_shared_contexts_1","parentSetOpen","menuContext_1","context","data","shouldHandleCloseRef","useRef","shouldHandleTabRef","pressedShiftRef","setOpenTimeout","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","index_1","detail","nativeEvent","current","key","keyboard_keys_1","shiftKey","bubble","clearTimeout","Event","persist","contains","setTimeout","react_portal_1","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","findNextFocusable","findPrevFocusable","react_tabster_1","focusFirst","useCallback","firstFocusable","focus","focusAfterMenuTrigger","nextFocusable","focusBeforeMenuTrigger","prevFocusable"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePositioningMouseTarget, usePositioning, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\nimport { Tab } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const shouldHandleTabRef = React.useRef(false);\n  const pressedShiftRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (e.type === 'keydown') {\n      if ((e as React.KeyboardEvent<HTMLElement>).key === Tab) {\n        shouldHandleTabRef.current = true;\n        pressedShiftRef.current = (e as React.KeyboardEvent<HTMLElement>).shiftKey;\n      }\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable, findNextFocusable, findPrevFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  const focusAfterMenuTrigger = React.useCallback(() => {\n    const nextFocusable = findNextFocusable(state.triggerRef.current);\n    nextFocusable?.focus();\n  }, [findNextFocusable, state.triggerRef]);\n\n  const focusBeforeMenuTrigger = React.useCallback(() => {\n    const prevFocusable = findPrevFocusable(state.triggerRef.current);\n    prevFocusable?.focus();\n  }, [findPrevFocusable, state.triggerRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        if (shouldHandleTabRef.current && !state.isSubmenu) {\n          pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();\n        } else {\n          state.triggerRef.current?.focus();\n        }\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n    shouldHandleTabRef.current = false;\n    pressedShiftRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);\n\n  return [open, setOpen] as const;\n};\n"]}
+{"version":3,"mappings":"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","names":["useMenu_unstable","props","isSubmenu","useIsSubmenu_1","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","triggerId","react_utilities_1","contextTarget","setContextTarget","react_positioning_1","positioningState","position","align","target","undefined","positioning","children","React","Children","toArray","process","env","NODE_ENV","length","console","warn","menuTrigger","menuPopover","targetRef","triggerRef","containerRef","menuPopoverRef","open","setOpen","useMenuOpenState","defaultOpen","onOpenChange","checkedValues","onCheckedValueChange","useMenuSelectableState","components","exports","setCheckedValues","state","defaultState","initialState","e","name","checkedItems","currentValue","targetDocument","react_shared_contexts_1","parentSetOpen","menuContext_1","context","data","shouldHandleCloseRef","useRef","setOpenTimeout","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","index_1","detail","nativeEvent","current","bubble","clearTimeout","Event","persist","contains","setTimeout","react_portal_1","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","react_tabster_1","focusFirst","useCallback","firstFocusable","focus"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/Menu/useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePositioningMouseTarget, usePositioning, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvent, MenuProps, MenuState } from './Menu.types';\n\n/**\n * Create the state required to render Menu.\n *\n * The returned state can be modified with hooks such as useMenuStyles,\n * before being passed to renderMenu_unstable.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu_unstable = (props: MenuProps): MenuState => {\n  const isSubmenu = useIsSubmenu();\n  const {\n    hoverDelay = 500,\n    inline = false,\n    hasCheckmarks = false,\n    hasIcons = false,\n    closeOnScroll = false,\n    openOnContext = false,\n    persistOnItemClick = false,\n    openOnHover = isSubmenu,\n    defaultCheckedValues,\n  } = props;\n  const triggerId = useId('menu');\n  const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n\n  const positioningState = {\n    position: isSubmenu ? 'after' : 'below',\n    align: isSubmenu ? 'top' : 'start',\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  } as const;\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (process.env.NODE_ENV !== 'production') {\n    if (children.length === 0) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at least one child');\n    }\n\n    if (children.length > 2) {\n      // eslint-disable-next-line no-console\n      console.warn('Menu must contain at most two children');\n    }\n  }\n\n  let menuTrigger: React.ReactElement | undefined = undefined;\n  let menuPopover: React.ReactElement | undefined = undefined;\n  if (children.length === 2) {\n    menuTrigger = children[0];\n    menuPopover = children[1];\n  } else if (children.length === 1) {\n    menuPopover = children[0];\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePositioning(positioningState);\n\n  // TODO Better way to narrow types ?\n  const [open, setOpen] = useMenuOpenState({\n    hoverDelay,\n    isSubmenu,\n    setContextTarget,\n    closeOnScroll,\n    menuPopoverRef,\n    triggerRef,\n    open: props.open,\n    defaultOpen: props.defaultOpen,\n    onOpenChange: props.onOpenChange,\n    openOnContext,\n  });\n\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({\n    checkedValues: props.checkedValues,\n    defaultCheckedValues,\n    onCheckedValueChange: props.onCheckedValueChange,\n  });\n\n  return {\n    inline,\n    hoverDelay,\n    triggerId,\n    isSubmenu,\n    openOnHover,\n    contextTarget,\n    setContextTarget,\n    hasCheckmarks,\n    hasIcons,\n    closeOnScroll,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n    components: {},\n    openOnContext,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n    persistOnItemClick,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  props: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: props.checkedValues,\n    defaultState: props.defaultCheckedValues,\n    initialState: {},\n  });\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    props.onCheckedValueChange?.(e, { name, checkedItems });\n\n    setCheckedValues(currentValue => ({\n      ...currentValue,\n      [name]: checkedItems,\n    }));\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<\n    MenuState,\n    | 'isSubmenu'\n    | 'menuPopoverRef'\n    | 'setContextTarget'\n    | 'triggerRef'\n    | 'openOnContext'\n    | 'closeOnScroll'\n    | 'hoverDelay'\n  > &\n    Pick<MenuProps, 'open' | 'defaultOpen' | 'onOpenChange'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);\n  const onOpenChange: MenuProps['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleCloseRef = React.useRef(false);\n  const setOpenTimeout = React.useRef(0);\n  const enteringTriggerRef = React.useRef(false);\n\n  const [open, setOpenState] = useControllableState({\n    state: state.open,\n    defaultState: state.defaultOpen,\n    initialState: false,\n  });\n\n  const trySetOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;\n    onOpenChange?.(event, { ...data });\n    if (data.open && e.type === 'contextmenu') {\n      state.setContextTarget(e as React.MouseEvent);\n    }\n\n    if (!data.open) {\n      state.setContextTarget(undefined);\n      shouldHandleCloseRef.current = true;\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvent, data: MenuOpenChangeData) => {\n    clearTimeout(setOpenTimeout.current);\n    if (!(e instanceof Event) && e.persist) {\n      // < React 17 still uses pooled synthetic events\n      e.persist();\n    }\n\n    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {\n      if (state.triggerRef.current?.contains(e.target as HTMLElement)) {\n        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';\n      }\n\n      // FIXME leaking Node timeout type\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);\n    } else {\n      trySetOpen(e, data);\n    }\n  });\n\n  useOnClickOutside({\n    contains: elementContains,\n    disabled: !open,\n    element: targetDocument,\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    callback: event => setOpen(event, { open: false, type: 'clickOutside', event }),\n  });\n\n  // only close on scroll for context, or when closeOnScroll is specified\n  const closeOnScroll = state.openOnContext || state.closeOnScroll;\n  useOnScrollOutside({\n    contains: elementContains,\n    element: targetDocument,\n    callback: event => setOpen(event, { open: false, type: 'scrollOutside', event }),\n    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(\n      Boolean,\n    ) as React.MutableRefObject<HTMLElement>[],\n    disabled: !open || !closeOnScroll,\n  });\n\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: event => {\n      // When moving from a menu directly back to its trigger, this handler can close the menu\n      // Explicitly check a flag to see if this situation happens\n      if (!enteringTriggerRef.current) {\n        setOpen(event, { open: false, type: 'menuMouseEnter', event });\n      }\n    },\n    disabled: !open,\n    refs: [state.menuPopoverRef],\n  });\n\n  // Clear timeout on unmount\n  // Setting state after a component unmounts can cause memory leaks\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(setOpenTimeout.current);\n    };\n  }, []);\n\n  // Manage focus for open state\n  const { findFirstFocusable } = useFocusFinders();\n  const focusFirst = React.useCallback(() => {\n    const firstFocusable = findFirstFocusable(state.menuPopoverRef.current);\n    firstFocusable?.focus();\n  }, [findFirstFocusable, state.menuPopoverRef]);\n\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleCloseRef.current) {\n        // We know that React effects are sync so we focus the trigger here\n        // after any event handler (event handlers will update state and re-render).\n        // Since the browser only performs the default behaviour for the Tab key once\n        // keyboard events have fully bubbled up the window, the browser will move\n        // focus to the next tabbable element before/after the trigger if needed.\n        // If the Tab key was not pressed, focus will remain on the trigger as expected.\n        state.triggerRef.current?.focus();\n      }\n    }\n\n    shouldHandleCloseRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst]);\n\n  return [open, setOpen] as const;\n};\n"]}

package/lib-commonjs/components/MenuPopover/useMenuPopover.js

@@ -98,7 +98,6 @@ const useMenuPopover_unstable = (props, ref) => {
         type: 'menuPopoverKeyDown',
         event
       });
-      event.preventDefault();
     }
     onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(event);
   });

package/lib-commonjs/components/MenuPopover/useMenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["useMenuPopover_unstable","props","ref","popoverRef","menuContext_1","context","menuPopoverRef","setOpen","open","openOnHover","isSubmenu","useIsSubmenu_1","canDispatchCustomEventRef","React","useRef","throttleDispatchTimerRef","dir","react_shared_contexts_1","CloseArrowKey","keyboard_keys_1","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","index_1","setTimeout","useEffect","clearTimeout","inline","rootProps","react_utilities_1","role","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","stopPropagation","preventDefault","components","root","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const rootProps = getNativeElementProps('div', {\n    role: 'presentation',\n    ...props,\n    ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n  });\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLElement>) => {\n    if (openOnHover) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n\n    onMouseEnterOriginal?.(event);\n  });\n\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLElement>) => {\n    const key = event.key;\n\n    if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement)) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover and Tooltip\n        event.stopPropagation();\n      }\n    }\n\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n      event.preventDefault();\n    }\n\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    components: {\n      root: 'div',\n    },\n    root: rootProps,\n  };\n};\n"]}
+{"version":3,"mappings":"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","names":["useMenuPopover_unstable","props","ref","popoverRef","menuContext_1","context","menuPopoverRef","setOpen","open","openOnHover","isSubmenu","useIsSubmenu_1","canDispatchCustomEventRef","React","useRef","throttleDispatchTimerRef","dir","react_shared_contexts_1","CloseArrowKey","keyboard_keys_1","mouseOverListenerCallbackRef","useCallback","node","addEventListener","e","current","index_1","setTimeout","useEffect","clearTimeout","inline","rootProps","react_utilities_1","role","onMouseEnter","onMouseEnterOriginal","onKeyDown","onKeyDownOriginal","event","keyboard","type","key","contains","target","stopPropagation","components","root","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-menu/src/components/MenuPopover/useMenuPopover.ts"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, Tab, ArrowRight, Escape } from '@fluentui/keyboard-keys';\nimport { getNativeElementProps, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';\nimport { useMenuContext_unstable } from '../../contexts/menuContext';\nimport { dispatchMenuEnterEvent } from '../../utils/index';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\n\n/**\n * Create the state required to render MenuPopover.\n *\n * The returned state can be modified with hooks such as useMenuPopoverStyles_unstable,\n * before being passed to renderMenuPopover_unstable.\n *\n * @param props - props from this instance of MenuPopover\n * @param ref - reference to root HTMLElement of MenuPopover\n */\nexport const useMenuPopover_unstable = (props: MenuPopoverProps, ref: React.Ref<HTMLElement>): MenuPopoverState => {\n  const popoverRef = useMenuContext_unstable(context => context.menuPopoverRef);\n  const setOpen = useMenuContext_unstable(context => context.setOpen);\n  const open = useMenuContext_unstable(context => context.open);\n  const openOnHover = useMenuContext_unstable(context => context.openOnHover);\n  const isSubmenu = useIsSubmenu();\n  const canDispatchCustomEventRef = React.useRef(true);\n  const throttleDispatchTimerRef = React.useRef(0);\n\n  const { dir } = useFluent();\n  const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n\n  // use DOM listener since react events propagate up the react tree\n  // no need to do `contains` logic as menus are all positioned in different portals\n  const mouseOverListenerCallbackRef = React.useCallback(\n    (node: HTMLElement) => {\n      if (node) {\n        // Dispatches the custom menu mouse enter event with throttling\n        // Needs to trigger on mouseover to support keyboard + mouse together\n        // i.e. keyboard opens submenus while cursor is still on the parent\n        node.addEventListener('mouseover', e => {\n          if (canDispatchCustomEventRef.current) {\n            canDispatchCustomEventRef.current = false;\n            dispatchMenuEnterEvent(popoverRef.current as HTMLElement, e);\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore #16889 Node setTimeout type leaking\n            throttleDispatchTimerRef.current = setTimeout(() => (canDispatchCustomEventRef.current = true), 250);\n          }\n        });\n      }\n    },\n    [popoverRef, throttleDispatchTimerRef],\n  );\n\n  React.useEffect(() => {\n    () => clearTimeout(throttleDispatchTimerRef.current);\n  }, []);\n\n  const inline = useMenuContext_unstable(context => context.inline) ?? false;\n  const rootProps = getNativeElementProps('div', {\n    role: 'presentation',\n    ...props,\n    ref: useMergedRefs(ref, popoverRef, mouseOverListenerCallbackRef),\n  });\n\n  const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;\n\n  rootProps.onMouseEnter = useEventCallback((event: React.MouseEvent<HTMLElement>) => {\n    if (openOnHover) {\n      setOpen(event, { open: true, keyboard: false, type: 'menuPopoverMouseEnter', event });\n    }\n\n    onMouseEnterOriginal?.(event);\n  });\n\n  rootProps.onKeyDown = useEventCallback((event: React.KeyboardEvent<HTMLElement>) => {\n    const key = event.key;\n\n    if (key === Escape || (isSubmenu && key === CloseArrowKey)) {\n      if (open && popoverRef.current?.contains(event.target as HTMLElement)) {\n        setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n        // stop propagation to avoid conflicting with other elements that listen for `Escape`\n        // e,g: Dialog, Popover and Tooltip\n        event.stopPropagation();\n      }\n    }\n\n    if (key === Tab) {\n      setOpen(event, { open: false, keyboard: true, type: 'menuPopoverKeyDown', event });\n    }\n\n    onKeyDownOriginal?.(event);\n  });\n\n  return {\n    inline,\n    components: {\n      root: 'div',\n    },\n    root: rootProps,\n  };\n};\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-menu",
-  "version": "9.6.1",
+  "version": "9.6.3",
   "description": "Fluent UI menu component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -30,17 +30,19 @@
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
     "@fluentui/react-conformance-griffel": "9.0.0-beta.19",
-    "@fluentui/scripts": "*"
+    "@fluentui/scripts-api-extractor": "*",
+    "@fluentui/scripts-cypress": "*",
+    "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
     "@fluentui/react-aria": "^9.3.5",
     "@fluentui/keyboard-keys": "^9.0.1",
     "@fluentui/react-context-selector": "^9.1.5",
     "@fluentui/react-icons": "^2.0.175",
-    "@fluentui/react-portal": "^9.1.0",
-    "@fluentui/react-positioning": "^9.3.7",
-    "@fluentui/react-shared-contexts": "^9.1.4",
-    "@fluentui/react-tabster": "^9.3.6",
+    "@fluentui/react-portal": "^9.1.2",
+    "@fluentui/react-positioning": "^9.3.8",
+    "@fluentui/react-shared-contexts": "^9.1.5",
+    "@fluentui/react-tabster": "^9.4.0",
     "@fluentui/react-theme": "^9.1.5",
     "@fluentui/react-utilities": "^9.4.0",
     "@griffel/react": "^1.5.2",