@fluentui/react-menu 9.7.15 → 9.8.0

package/lib/components/Menu/useMenu.js

@@ -9,7 +9,14 @@ import { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';
 import { useIsSubmenu } from '../../utils/useIsSubmenu';
 // If it's not possible to position the submenu in smaller viewports, try
 // and fallback to this order of positions
-const submenuFallbackPositions = ['after', 'after-bottom', 'before-top', 'before', 'before-bottom', 'above'];
+const submenuFallbackPositions = [
+    'after',
+    'after-bottom',
+    'before-top',
+    'before',
+    'before-bottom',
+    'above'
+];
 /**
  * Create the state required to render Menu.
  *
@@ -17,252 +24,251 @@ const submenuFallbackPositions = ['after', 'after-bottom', 'before-top', 'before
  * before being passed to renderMenu_unstable.
  *
  * @param props - props from this instance of Menu
- */
-export const useMenu_unstable = props => {
-  const isSubmenu = useIsSubmenu();
-  const {
-    hoverDelay = 500,
-    inline = false,
-    hasCheckmarks = false,
-    hasIcons = false,
-    closeOnScroll = false,
-    openOnContext = false,
-    persistOnItemClick = false,
-    openOnHover = isSubmenu,
-    defaultCheckedValues,
-    mountNode = null
-  } = props;
-  const triggerId = useId('menu');
-  const [contextTarget, setContextTarget] = usePositioningMouseTarget();
-  const positioningState = {
-    position: isSubmenu ? 'after' : 'below',
-    align: isSubmenu ? 'top' : 'start',
-    target: props.openOnContext ? contextTarget : undefined,
-    fallbackPositions: isSubmenu ? submenuFallbackPositions : undefined,
-    ...resolvePositioningShorthand(props.positioning)
-  };
-  const children = React.Children.toArray(props.children);
-  if (process.env.NODE_ENV !== 'production') {
-    if (children.length === 0) {
-      // eslint-disable-next-line no-console
-      console.warn('Menu must contain at least one child');
+ */ export const useMenu_unstable = (props)=>{
+    const isSubmenu = useIsSubmenu();
+    const { hoverDelay =500 , inline =false , hasCheckmarks =false , hasIcons =false , closeOnScroll =false , openOnContext =false , persistOnItemClick =false , openOnHover =isSubmenu , defaultCheckedValues , mountNode =null  } = props;
+    const triggerId = useId('menu');
+    const [contextTarget, setContextTarget] = usePositioningMouseTarget();
+    const positioningState = {
+        position: isSubmenu ? 'after' : 'below',
+        align: isSubmenu ? 'top' : 'start',
+        target: props.openOnContext ? contextTarget : undefined,
+        fallbackPositions: isSubmenu ? submenuFallbackPositions : undefined,
+        ...resolvePositioningShorthand(props.positioning)
+    };
+    const children = React.Children.toArray(props.children);
+    if (process.env.NODE_ENV !== 'production') {
+        if (children.length === 0) {
+            // eslint-disable-next-line no-console
+            console.warn('Menu must contain at least one child');
+        }
+        if (children.length > 2) {
+            // eslint-disable-next-line no-console
+            console.warn('Menu must contain at most two children');
+        }
     }
-    if (children.length > 2) {
-      // eslint-disable-next-line no-console
-      console.warn('Menu must contain at most two children');
+    let menuTrigger = undefined;
+    let menuPopover = undefined;
+    if (children.length === 2) {
+        menuTrigger = children[0];
+        menuPopover = children[1];
+    } else if (children.length === 1) {
+        menuPopover = children[0];
     }
-  }
-  let menuTrigger = undefined;
-  let menuPopover = undefined;
-  if (children.length === 2) {
-    menuTrigger = children[0];
-    menuPopover = children[1];
-  } else if (children.length === 1) {
-    menuPopover = children[0];
-  }
-  const {
-    targetRef: triggerRef,
-    containerRef: menuPopoverRef
-  } = usePositioning(positioningState);
-  // TODO Better way to narrow types ?
-  const [open, setOpen] = useMenuOpenState({
-    hoverDelay,
-    isSubmenu,
-    setContextTarget,
-    closeOnScroll,
-    menuPopoverRef,
-    triggerRef,
-    open: props.open,
-    defaultOpen: props.defaultOpen,
-    onOpenChange: props.onOpenChange,
-    openOnContext
-  });
-  const [checkedValues, onCheckedValueChange] = useMenuSelectableState({
-    checkedValues: props.checkedValues,
-    defaultCheckedValues,
-    onCheckedValueChange: props.onCheckedValueChange
-  });
-  return {
-    inline,
-    hoverDelay,
-    triggerId,
-    isSubmenu,
-    openOnHover,
-    contextTarget,
-    setContextTarget,
-    hasCheckmarks,
-    hasIcons,
-    closeOnScroll,
-    menuTrigger,
-    menuPopover,
-    mountNode,
-    triggerRef,
-    menuPopoverRef,
-    components: {},
-    openOnContext,
-    open,
-    setOpen,
-    checkedValues,
-    onCheckedValueChange,
-    persistOnItemClick
-  };
+    const { targetRef: triggerRef , containerRef: menuPopoverRef  } = usePositioning(positioningState);
+    // TODO Better way to narrow types ?
+    const [open, setOpen] = useMenuOpenState({
+        hoverDelay,
+        isSubmenu,
+        setContextTarget,
+        closeOnScroll,
+        menuPopoverRef,
+        triggerRef,
+        open: props.open,
+        defaultOpen: props.defaultOpen,
+        onOpenChange: props.onOpenChange,
+        openOnContext
+    });
+    const [checkedValues, onCheckedValueChange] = useMenuSelectableState({
+        checkedValues: props.checkedValues,
+        defaultCheckedValues,
+        onCheckedValueChange: props.onCheckedValueChange
+    });
+    return {
+        inline,
+        hoverDelay,
+        triggerId,
+        isSubmenu,
+        openOnHover,
+        contextTarget,
+        setContextTarget,
+        hasCheckmarks,
+        hasIcons,
+        closeOnScroll,
+        menuTrigger,
+        menuPopover,
+        mountNode,
+        triggerRef,
+        menuPopoverRef,
+        components: {},
+        openOnContext,
+        open,
+        setOpen,
+        checkedValues,
+        onCheckedValueChange,
+        persistOnItemClick
+    };
 };
 /**
  * Adds appropriate state values and handlers for selectable items
  * i.e checkboxes and radios
- */
-const useMenuSelectableState = props => {
-  const [checkedValues, setCheckedValues] = useControllableState({
-    state: props.checkedValues,
-    defaultState: props.defaultCheckedValues,
-    initialState: {}
-  });
-  const onCheckedValueChange = useEventCallback((e, {
-    name,
-    checkedItems
-  }) => {
-    var _props_onCheckedValueChange;
-    (_props_onCheckedValueChange = props.onCheckedValueChange) === null || _props_onCheckedValueChange === void 0 ? void 0 : _props_onCheckedValueChange.call(props, e, {
-      name,
-      checkedItems
+ */ const useMenuSelectableState = (props)=>{
+    const [checkedValues, setCheckedValues] = useControllableState({
+        state: props.checkedValues,
+        defaultState: props.defaultCheckedValues,
+        initialState: {}
     });
-    setCheckedValues(currentValue => ({
-      ...currentValue,
-      [name]: checkedItems
-    }));
-  });
-  return [checkedValues, onCheckedValueChange];
+    const onCheckedValueChange = useEventCallback((e, { name , checkedItems  })=>{
+        var _props_onCheckedValueChange;
+        (_props_onCheckedValueChange = props.onCheckedValueChange) === null || _props_onCheckedValueChange === void 0 ? void 0 : _props_onCheckedValueChange.call(props, e, {
+            name,
+            checkedItems
+        });
+        setCheckedValues((currentValue)=>({
+                ...currentValue,
+                [name]: checkedItems
+            }));
+    });
+    return [
+        checkedValues,
+        onCheckedValueChange
+    ];
 };
-const useMenuOpenState = state => {
-  const {
-    targetDocument
-  } = useFluent();
-  const parentSetOpen = useMenuContext_unstable(context => context.setOpen);
-  const onOpenChange = useEventCallback((e, data) => {
-    var _state_onOpenChange;
-    return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, e, data);
-  });
-  const setOpenTimeout = React.useRef(0);
-  const enteringTriggerRef = React.useRef(false);
-  const [open, setOpenState] = useControllableState({
-    state: state.open,
-    defaultState: state.defaultOpen,
-    initialState: false
-  });
-  const trySetOpen = useEventCallback((e, data) => {
-    const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;
-    onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, {
-      ...data
+const useMenuOpenState = (state)=>{
+    const { targetDocument  } = useFluent();
+    const parentSetOpen = useMenuContext_unstable((context)=>context.setOpen);
+    const onOpenChange = useEventCallback((e, data)=>{
+        var _state_onOpenChange;
+        return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, e, data);
     });
-    if (data.open && e.type === 'contextmenu') {
-      state.setContextTarget(e);
-    }
-    if (!data.open) {
-      state.setContextTarget(undefined);
-    }
-    if (data.bubble) {
-      parentSetOpen(e, {
-        ...data
-      });
-    }
-    setOpenState(data.open);
-  });
-  const setOpen = useEventCallback((e, data) => {
-    clearTimeout(setOpenTimeout.current);
-    if (!(e instanceof Event) && e.persist) {
-      // < React 17 still uses pooled synthetic events
-      e.persist();
-    }
-    if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {
-      var _state_triggerRef_current;
-      if ((_state_triggerRef_current = state.triggerRef.current) === null || _state_triggerRef_current === void 0 ? void 0 : _state_triggerRef_current.contains(e.target)) {
-        enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';
-      }
-      // FIXME leaking Node timeout type
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
-      setOpenTimeout.current = setTimeout(() => trySetOpen(e, data), state.hoverDelay);
-    } else {
-      trySetOpen(e, data);
-    }
-  });
-  useOnClickOutside({
-    contains: elementContains,
-    disabled: !open,
-    element: targetDocument,
-    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(Boolean),
-    callback: event => setOpen(event, {
-      open: false,
-      type: 'clickOutside',
-      event
-    })
-  });
-  // only close on scroll for context, or when closeOnScroll is specified
-  const closeOnScroll = state.openOnContext || state.closeOnScroll;
-  useOnScrollOutside({
-    contains: elementContains,
-    element: targetDocument,
-    callback: event => setOpen(event, {
-      open: false,
-      type: 'scrollOutside',
-      event
-    }),
-    refs: [state.menuPopoverRef, !state.openOnContext && state.triggerRef].filter(Boolean),
-    disabled: !open || !closeOnScroll
-  });
-  useOnMenuMouseEnter({
-    element: targetDocument,
-    callback: event => {
-      // When moving from a menu directly back to its trigger, this handler can close the menu
-      // Explicitly check a flag to see if this situation happens
-      if (!enteringTriggerRef.current) {
-        setOpen(event, {
-          open: false,
-          type: 'menuMouseEnter',
-          event
+    const setOpenTimeout = React.useRef(0);
+    const enteringTriggerRef = React.useRef(false);
+    const [open, setOpenState] = useControllableState({
+        state: state.open,
+        defaultState: state.defaultOpen,
+        initialState: false
+    });
+    const trySetOpen = useEventCallback((e, data)=>{
+        const event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;
+        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, {
+            ...data
         });
-      }
-    },
-    disabled: !open,
-    refs: [state.menuPopoverRef]
-  });
-  // Clear timeout on unmount
-  // Setting state after a component unmounts can cause memory leaks
-  React.useEffect(() => {
-    return () => {
-      clearTimeout(setOpenTimeout.current);
-    };
-  }, []);
-  // Manage focus for open state
-  const {
-    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 firstMount = useFirstMount();
-  React.useEffect(() => {
-    if (open) {
-      focusFirst();
-    } else {
-      if (!firstMount) {
-        if ((targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.body)) {
-          var
-          // 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.
-          _state_triggerRef_current;
-          (_state_triggerRef_current = state.triggerRef.current) === null || _state_triggerRef_current === void 0 ? void 0 : _state_triggerRef_current.focus();
+        if (data.open && e.type === 'contextmenu') {
+            state.setContextTarget(e);
+        }
+        if (!data.open) {
+            state.setContextTarget(undefined);
+        }
+        if (data.bubble) {
+            parentSetOpen(e, {
+                ...data
+            });
+        }
+        setOpenState(data.open);
+    });
+    const setOpen = useEventCallback((e, data)=>{
+        clearTimeout(setOpenTimeout.current);
+        if (!(e instanceof Event) && e.persist) {
+            // < React 17 still uses pooled synthetic events
+            e.persist();
+        }
+        if (e.type === 'mouseleave' || e.type === 'mouseenter' || e.type === 'mousemove' || e.type === MENU_ENTER_EVENT) {
+            var _state_triggerRef_current;
+            if ((_state_triggerRef_current = state.triggerRef.current) === null || _state_triggerRef_current === void 0 ? void 0 : _state_triggerRef_current.contains(e.target)) {
+                enteringTriggerRef.current = e.type === 'mouseenter' || e.type === 'mousemove';
+            }
+            // FIXME leaking Node timeout type
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            setOpenTimeout.current = setTimeout(()=>trySetOpen(e, data), state.hoverDelay);
+        } else {
+            trySetOpen(e, data);
+        }
+    });
+    useOnClickOutside({
+        contains: elementContains,
+        disabled: !open,
+        element: targetDocument,
+        refs: [
+            state.menuPopoverRef,
+            !state.openOnContext && state.triggerRef
+        ].filter(Boolean),
+        callback: (event)=>setOpen(event, {
+                open: false,
+                type: 'clickOutside',
+                event
+            })
+    });
+    // only close on scroll for context, or when closeOnScroll is specified
+    const closeOnScroll = state.openOnContext || state.closeOnScroll;
+    useOnScrollOutside({
+        contains: elementContains,
+        element: targetDocument,
+        callback: (event)=>setOpen(event, {
+                open: false,
+                type: 'scrollOutside',
+                event
+            }),
+        refs: [
+            state.menuPopoverRef,
+            !state.openOnContext && state.triggerRef
+        ].filter(Boolean),
+        disabled: !open || !closeOnScroll
+    });
+    useOnMenuMouseEnter({
+        element: targetDocument,
+        callback: (event)=>{
+            // When moving from a menu directly back to its trigger, this handler can close the menu
+            // Explicitly check a flag to see if this situation happens
+            if (!enteringTriggerRef.current) {
+                setOpen(event, {
+                    open: false,
+                    type: 'menuMouseEnter',
+                    event
+                });
+            }
+        },
+        disabled: !open,
+        refs: [
+            state.menuPopoverRef
+        ]
+    });
+    // Clear timeout on unmount
+    // Setting state after a component unmounts can cause memory leaks
+    React.useEffect(()=>{
+        return ()=>{
+            clearTimeout(setOpenTimeout.current);
+        };
+    }, []);
+    // Manage focus for open state
+    const { 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 firstMount = useFirstMount();
+    React.useEffect(()=>{
+        if (open) {
+            focusFirst();
+        } else {
+            if (!firstMount) {
+                if ((targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.body)) {
+                    var // 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.
+                    _state_triggerRef_current;
+                    (_state_triggerRef_current = state.triggerRef.current) === null || _state_triggerRef_current === void 0 ? void 0 : _state_triggerRef_current.focus();
+                }
+            }
         }
-      }
-    }
     // firstMount change should not re-run this effect
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [state.triggerRef, state.isSubmenu, open, focusFirst, targetDocument, state.menuPopoverRef]);
-  return [open, setOpen];
+    }, [
+        state.triggerRef,
+        state.isSubmenu,
+        open,
+        focusFirst,
+        targetDocument,
+        state.menuPopoverRef
+    ]);
+    return [
+        open,
+        setOpen
+    ];
 };
-//# sourceMappingURL=useMenu.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","usePositioningMouseTarget","usePositioning","resolvePositioningShorthand","useControllableState","useId","useOnClickOutside","useEventCallback","useOnScrollOutside","useFirstMount","useFluent_unstable","useFluent","elementContains","useFocusFinders","useMenuContext_unstable","MENU_ENTER_EVENT","useOnMenuMouseEnter","useIsSubmenu","submenuFallbackPositions","useMenu_unstable","props","isSubmenu","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","mountNode","triggerId","contextTarget","setContextTarget","positioningState","position","align","target","undefined","fallbackPositions","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","_props_onCheckedValueChange","call","currentValue","targetDocument","parentSetOpen","context","data","_state_onOpenChange","setOpenTimeout","useRef","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","detail","nativeEvent","bubble","clearTimeout","current","Event","persist","_state_triggerRef_current","contains","setTimeout","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","focusFirst","useCallback","firstFocusable","focus","firstMount","activeElement","body"],"sources":["../../../src/components/Menu/useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  usePositioningMouseTarget,\n  usePositioning,\n  resolvePositioningShorthand,\n  PositioningShorthandValue,\n} from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n  useFirstMount,\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// If it's not possible to position the submenu in smaller viewports, try\n// and fallback to this order of positions\nconst submenuFallbackPositions: PositioningShorthandValue[] = [\n  'after',\n  'after-bottom',\n  'before-top',\n  'before',\n  'before-bottom',\n  'above',\n];\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    mountNode = null,\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    fallbackPositions: isSubmenu ? submenuFallbackPositions : 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    mountNode,\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 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    }\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  const firstMount = useFirstMount();\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (!firstMount) {\n        if (targetDocument?.activeElement === targetDocument?.body) {\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    // firstMount change should not re-run this effect\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst, targetDocument, state.menuPopoverRef]);\n\n  return [open, setOpen] as const;\n};\n"],"mappings":"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"}
+{"version":3,"sources":["useMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  usePositioningMouseTarget,\n  usePositioning,\n  resolvePositioningShorthand,\n  PositioningShorthandValue,\n} from '@fluentui/react-positioning';\nimport {\n  useControllableState,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n  useOnScrollOutside,\n  useFirstMount,\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// If it's not possible to position the submenu in smaller viewports, try\n// and fallback to this order of positions\nconst submenuFallbackPositions: PositioningShorthandValue[] = [\n  'after',\n  'after-bottom',\n  'before-top',\n  'before',\n  'before-bottom',\n  'above',\n];\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    mountNode = null,\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    fallbackPositions: isSubmenu ? submenuFallbackPositions : 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    mountNode,\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 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    }\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  const firstMount = useFirstMount();\n  React.useEffect(() => {\n    if (open) {\n      focusFirst();\n    } else {\n      if (!firstMount) {\n        if (targetDocument?.activeElement === targetDocument?.body) {\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    // firstMount change should not re-run this effect\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst, targetDocument, state.menuPopoverRef]);\n\n  return [open, setOpen] as const;\n};\n"],"names":["React","usePositioningMouseTarget","usePositioning","resolvePositioningShorthand","useControllableState","useId","useOnClickOutside","useEventCallback","useOnScrollOutside","useFirstMount","useFluent_unstable","useFluent","elementContains","useFocusFinders","useMenuContext_unstable","MENU_ENTER_EVENT","useOnMenuMouseEnter","useIsSubmenu","submenuFallbackPositions","useMenu_unstable","props","isSubmenu","hoverDelay","inline","hasCheckmarks","hasIcons","closeOnScroll","openOnContext","persistOnItemClick","openOnHover","defaultCheckedValues","mountNode","triggerId","contextTarget","setContextTarget","positioningState","position","align","target","undefined","fallbackPositions","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","setOpenTimeout","useRef","enteringTriggerRef","setOpenState","trySetOpen","event","CustomEvent","type","detail","nativeEvent","bubble","clearTimeout","current","Event","persist","contains","setTimeout","disabled","element","refs","filter","Boolean","callback","useEffect","findFirstFocusable","focusFirst","useCallback","firstFocusable","focus","firstMount","activeElement","body"],"mappings":"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"}