@fluentui/react-menu 9.0.0-alpha.8 → 9.0.0-alpha.80

package/lib/components/Menu/useMenu.js

@@ -1,14 +1,14 @@
 import { __assign } from "tslib";
 import * as React from 'react';
-import { usePopper } from '@fluentui/react-positioning';
-import { makeMergePropsCompat, resolveShorthandProps, useMergedRefs, useControllableValue, useId, useOnClickOutside, useEventCallback, } from '@fluentui/react-utilities';
+import { usePopperMouseTarget, usePopper, resolvePositioningShorthand } from '@fluentui/react-positioning';
+import { useControllableState, useId, useOnClickOutside, useEventCallback } from '@fluentui/react-utilities';
 import { useFluent } from '@fluentui/react-provider';
+import { elementContains } from '@fluentui/react-portal';
+import { useFocusFinders } from '@fluentui/react-tabster';
 import { MenuTrigger } from '../MenuTrigger/index';
 import { useMenuContext } from '../../contexts/menuContext';
-import { useMenuPopup } from './useMenuPopup';
-export var menuShorthandProps = ['menuPopup'];
-// eslint-disable-next-line deprecation/deprecation
-var mergeProps = makeMergePropsCompat({ deepMerge: menuShorthandProps });
+import { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';
+import { useIsSubmenu } from '../../utils/useIsSubmenu';
 /**
  * Create the state required to render Menu.
  *
@@ -16,85 +16,254 @@ var mergeProps = makeMergePropsCompat({ deepMerge: menuShorthandProps });
  * before being passed to renderMenu.
  *
  * @param props - props from this instance of Menu
- * @param ref - reference to root HTMLElement of Menu
- * @param defaultProps - (optional) default prop values provided by the implementing type
- *
- * {@docCategory Menu }
  */
-export var useMenu = function (props, ref, defaultProps) {
-    var document = useFluent().document;
-    var triggerId = useId('menu');
-    var isSubmenu = useMenuContext(function (context) { return context.hasMenuContext; });
-    var state = mergeProps({
-        ref: useMergedRefs(ref, React.useRef(null)),
-        menuPopup: { as: 'div' },
-        position: isSubmenu ? 'after' : 'below',
-        align: isSubmenu ? 'top' : 'start',
-        openOnHover: isSubmenu,
-        triggerId: triggerId,
-    }, defaultProps, resolveShorthandProps(props, menuShorthandProps));
-    state.isSubmenu = isSubmenu;
-    // TODO Better way to narrow types ?
-    var children = React.Children.toArray(state.children);
-    // TODO throw warnings in development safely
-    if (children.length !== 2) {
-        // eslint-disable-next-line no-console
-        console.warn('Menu can only take one MenuTrigger and one MenuList as children');
+
+export var useMenu = function (props) {
+  var triggerId = useId('menu');
+  var isSubmenu = useIsSubmenu();
+
+  var _a = usePopperMouseTarget(),
+      contextTarget = _a[0],
+      setContextTarget = _a[1];
+
+  var popperState = __assign({
+    position: isSubmenu ? 'after' : 'below',
+    align: isSubmenu ? 'top' : 'start',
+    target: props.openOnContext ? contextTarget : undefined
+  }, resolvePositioningShorthand(props.positioning));
+
+  var children = React.Children.toArray(props.children);
+
+  if (children.length !== 2 && process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line no-console
+    console.warn('Menu can only take one MenuTrigger and one MenuList as children');
+  }
+
+  var _b = children.reduce(function (acc, child) {
+    if (child.type === MenuTrigger) {
+      acc.menuTrigger = child;
+    } else {
+      acc.menuPopover = child;
     }
-    var _a = usePopper({
-        align: state.align,
-        position: state.position,
-    }), triggerRef = _a.targetRef, menuPopupRef = _a.containerRef;
-    state.menuPopupRef = menuPopupRef;
-    state.triggerRef = triggerRef;
-    children.forEach(function (child) {
-        if (child.type === MenuTrigger) {
-            state.menuTrigger = child;
-        }
-        else {
-            state.menuList = child;
-        }
-    });
-    var _b = useControllableValue(state.open, state.defaultOpen), open = _b[0], setOpen = _b[1];
-    // TODO fix useControllableValue typing
-    state.open = open !== undefined ? open : state.open;
-    var onOpenChange = useEventCallback(function (e, data) { var _a, _b; return (_b = (_a = state).onOpenChange) === null || _b === void 0 ? void 0 : _b.call(_a, e, data); });
-    state.setOpen = React.useCallback(function (e, shouldOpen) {
-        setOpen(function (prevOpen) {
-            var _a;
-            // More than one event (mouse, focus, keyboard) can request the popup to close
-            // We assume the first event is the correct one
-            if (prevOpen !== shouldOpen) {
-                (_a = onOpenChange) === null || _a === void 0 ? void 0 : _a(e, { open: shouldOpen });
-            }
-            return shouldOpen;
-        });
-    }, [setOpen, onOpenChange]);
-    useMenuSelectableState(state);
-    useMenuPopup(state);
-    useOnClickOutside({
-        element: document,
-        refs: [state.menuPopupRef, triggerRef],
-        callback: function (e) { return state.setOpen(e, false); },
-    });
-    return state;
+
+    return acc;
+  }, {}),
+      menuTrigger = _b.menuTrigger,
+      menuPopover = _b.menuPopover;
+
+  var _c = usePopper(popperState),
+      triggerRef = _c.targetRef,
+      menuPopoverRef = _c.containerRef;
+
+  var initialState = __assign(__assign({
+    hoverDelay: 500,
+    triggerId: triggerId,
+    isSubmenu: !!isSubmenu,
+    openOnHover: !!isSubmenu,
+    contextTarget: contextTarget,
+    setContextTarget: setContextTarget
+  }, props), {
+    menuTrigger: menuTrigger,
+    menuPopover: menuPopover,
+    triggerRef: triggerRef,
+    menuPopoverRef: menuPopoverRef
+  }); // TODO Better way to narrow types ?
+
+
+  var _d = useMenuOpenState(initialState),
+      open = _d[0],
+      setOpen = _d[1];
+
+  var _e = useMenuSelectableState(initialState),
+      checkedValues = _e[0],
+      onCheckedValueChange = _e[1];
+
+  return __assign(__assign({}, initialState), {
+    open: open,
+    setOpen: setOpen,
+    checkedValues: checkedValues,
+    onCheckedValueChange: onCheckedValueChange
+  });
 };
 /**
  * Adds appropriate state values and handlers for selectable items
  * i.e checkboxes and radios
  */
+
 var useMenuSelectableState = function (state) {
-    var _a = useControllableValue(state.checkedValues, state.defaultCheckedValues), checkedValues = _a[0], setCheckedValues = _a[1];
-    var onCheckedValueChangeOriginal = state.onCheckedValueChange;
-    state.checkedValues = checkedValues;
-    state.onCheckedValueChange = useEventCallback(function (e, name, checkedItems) {
-        if (onCheckedValueChangeOriginal) {
-            onCheckedValueChangeOriginal(e, name, checkedItems);
-        }
-        setCheckedValues(function (s) {
-            var _a, _b;
-            return s ? __assign(__assign({}, s), (_a = {}, _a[name] = checkedItems, _a)) : (_b = {}, _b[name] = checkedItems, _b);
-        });
+  var _a = useControllableState({
+    state: state.checkedValues,
+    defaultState: state.defaultCheckedValues,
+    initialState: {}
+  }),
+      checkedValues = _a[0],
+      setCheckedValues = _a[1];
+
+  var onCheckedValueChangeOriginal = state.onCheckedValueChange;
+  var onCheckedValueChange = useEventCallback(function (e, _a) {
+    var name = _a.name,
+        checkedItems = _a.checkedItems;
+
+    if (onCheckedValueChangeOriginal) {
+      onCheckedValueChangeOriginal(e, {
+        name: name,
+        checkedItems: checkedItems
+      });
+    }
+
+    setCheckedValues(function (s) {
+      var _a, _b;
+
+      return s ? __assign(__assign({}, s), (_a = {}, _a[name] = checkedItems, _a)) : (_b = {}, _b[name] = checkedItems, _b);
     });
+  });
+  return [checkedValues, onCheckedValueChange];
+};
+
+var useMenuOpenState = function (state) {
+  var targetDocument = useFluent().targetDocument;
+  var parentSetOpen = useMenuContext(function (context) {
+    return context.setOpen;
+  });
+  var onOpenChange = useEventCallback(function (e, data) {
+    var _a;
+
+    return (_a = state.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(state, e, data);
+  });
+  var shouldHandleKeyboardRef = 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 = useControllableState({
+    state: state.open,
+    defaultState: state.defaultOpen,
+    initialState: false
+  }),
+      open = _a[0],
+      setOpenState = _a[1];
+
+  var trySetOpen = useEventCallback(function (e, data) {
+    var event = e instanceof CustomEvent && e.type === MENU_ENTER_EVENT ? e.detail.nativeEvent : e;
+    onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, __assign({}, data));
+
+    if (data.open && e.type === 'contextmenu') {
+      state.setContextTarget(e);
+    }
+
+    if (!data.open) {
+      state.setContextTarget(undefined);
+    }
+
+    if (data.keyboard) {
+      shouldHandleKeyboardRef.current = true;
+      shouldHandleTabRef.current = e.key === 'Tab';
+      pressedShiftRef.current = e.shiftKey;
+    }
+
+    if (data.bubble) {
+      parentSetOpen(e, __assign({}, data));
+    }
+
+    setOpenState(data.open);
+  });
+  var setOpen = useEventCallback(function (e, data) {
+    var _a;
+
+    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) {
+      if ((_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.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(function () {
+        return trySetOpen(e, data);
+      }, state.hoverDelay);
+    } else {
+      trySetOpen(e, data);
+    }
+  });
+  useOnClickOutside({
+    contains: elementContains,
+    disabled: !open,
+    element: targetDocument,
+    refs: [state.menuPopoverRef, state.triggerRef],
+    callback: function (e) {
+      return setOpen(e, {
+        open: false
+      });
+    }
+  });
+  useOnMenuMouseEnter({
+    element: targetDocument,
+    callback: function (e) {
+      // 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(e, {
+          open: false
+        });
+      }
+    },
+    disabled: !open,
+    refs: [state.menuPopoverRef]
+  }); // Clear timeout on unmount
+  // Setting state after a component unmounts can cause memory leaks
+
+  React.useEffect(function () {
+    return function () {
+      clearTimeout(setOpenTimeout.current);
+    };
+  }, []); // Manage focus for open state
+
+  var _b = useFocusFinders(),
+      findFirstFocusable = _b.findFirstFocusable,
+      findNextFocusable = _b.findNextFocusable,
+      findPrevFocusable = _b.findPrevFocusable;
+
+  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 (!shouldHandleKeyboardRef.current) {
+      return;
+    }
+
+    if (open) {
+      focusFirst();
+    } else {
+      if (shouldHandleTabRef.current && !state.isSubmenu) {
+        pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();
+      } else {
+        (_a = state.triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+      }
+    }
+
+    shouldHandleKeyboardRef.current = false;
+    shouldHandleTabRef.current = false;
+    pressedShiftRef.current = false;
+  }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);
+  return [open !== null && open !== void 0 ? open : false, setOpen];
 };
 //# sourceMappingURL=useMenu.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"useMenu.js","sourceRoot":"../src/","sources":["components/Menu/useMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { usePopper } from '@fluentui/react-positioning';\nimport {\n  makeMergePropsCompat,\n  resolveShorthandProps,\n  useMergedRefs,\n  useControllableValue,\n  useId,\n  useOnClickOutside,\n  useEventCallback,\n} from '@fluentui/react-utilities';\nimport { useFluent } from '@fluentui/react-provider';\nimport { MenuProps, MenuState } from './Menu.types';\nimport { MenuTrigger } from '../MenuTrigger/index';\nimport { useMenuContext } from '../../contexts/menuContext';\nimport { useMenuPopup } from './useMenuPopup';\n\nexport const menuShorthandProps: (keyof MenuProps)[] = ['menuPopup'];\n\n// eslint-disable-next-line deprecation/deprecation\nconst mergeProps = makeMergePropsCompat<MenuState>({ deepMerge: menuShorthandProps });\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.\n *\n * @param props - props from this instance of Menu\n * @param ref - reference to root HTMLElement of Menu\n * @param defaultProps - (optional) default prop values provided by the implementing type\n *\n * {@docCategory Menu }\n */\nexport const useMenu = (props: MenuProps, ref: React.Ref<HTMLElement>, defaultProps?: MenuProps): MenuState => {\n  const { document } = useFluent();\n  const triggerId = useId('menu');\n  const isSubmenu = useMenuContext(context => context.hasMenuContext);\n\n  const state = mergeProps(\n    {\n      ref: useMergedRefs(ref, React.useRef(null)),\n      menuPopup: { as: 'div' },\n      position: isSubmenu ? 'after' : 'below',\n      align: isSubmenu ? 'top' : 'start',\n      openOnHover: isSubmenu,\n      triggerId,\n    },\n    defaultProps,\n    resolveShorthandProps(props, menuShorthandProps),\n  );\n\n  state.isSubmenu = isSubmenu;\n\n  // TODO Better way to narrow types ?\n  const children = React.Children.toArray(state.children) as React.ReactElement[];\n\n  // TODO throw warnings in development safely\n  if (children.length !== 2) {\n    // eslint-disable-next-line no-console\n    console.warn('Menu can only take one MenuTrigger and one MenuList as children');\n  }\n\n  const { targetRef: triggerRef, containerRef: menuPopupRef } = usePopper({\n    align: state.align,\n    position: state.position,\n  });\n  state.menuPopupRef = menuPopupRef;\n  state.triggerRef = triggerRef;\n  children.forEach(child => {\n    if (child.type === MenuTrigger) {\n      state.menuTrigger = child;\n    } else {\n      state.menuList = child;\n    }\n  });\n\n  const [open, setOpen] = useControllableValue(state.open, state.defaultOpen);\n  // TODO fix useControllableValue typing\n  state.open = open !== undefined ? open : state.open;\n  const onOpenChange: MenuState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n  state.setOpen = React.useCallback(\n    (e, shouldOpen) => {\n      setOpen(prevOpen => {\n        // More than one event (mouse, focus, keyboard) can request the popup to close\n        // We assume the first event is the correct one\n        if (prevOpen !== shouldOpen) {\n          onOpenChange?.(e, { open: shouldOpen });\n        }\n\n        return shouldOpen;\n      });\n    },\n    [setOpen, onOpenChange],\n  );\n\n  useMenuSelectableState(state);\n  useMenuPopup(state);\n  useOnClickOutside({\n    element: document,\n    refs: [state.menuPopupRef, triggerRef],\n    callback: e => state.setOpen(e, false),\n  });\n\n  return state;\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (state: MenuState) => {\n  const [checkedValues, setCheckedValues] = useControllableValue(state.checkedValues, state.defaultCheckedValues);\n  const { onCheckedValueChange: onCheckedValueChangeOriginal } = state;\n  state.checkedValues = checkedValues;\n  state.onCheckedValueChange = useEventCallback((e, name, checkedItems) => {\n    if (onCheckedValueChangeOriginal) {\n      onCheckedValueChangeOriginal(e, name, checkedItems);\n    }\n\n    setCheckedValues(s => {\n      return s ? { ...s, [name]: checkedItems } : { [name]: checkedItems };\n    });\n  });\n};\n"]}
+{"version":3,"sources":["components/Menu/useMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { usePopperMouseTarget, usePopper, resolvePositioningShorthand } from '@fluentui/react-positioning';\nimport { useControllableState, useId, useOnClickOutside, useEventCallback } from '@fluentui/react-utilities';\nimport { useFluent } from '@fluentui/react-provider';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { MenuTrigger } from '../MenuTrigger/index';\nimport { useMenuContext } from '../../contexts/menuContext';\nimport { MENU_ENTER_EVENT, useOnMenuMouseEnter } from '../../utils/index';\nimport { useIsSubmenu } from '../../utils/useIsSubmenu';\nimport type { MenuOpenChangeData, MenuOpenEvents, 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.\n *\n * @param props - props from this instance of Menu\n */\nexport const useMenu = (props: MenuProps): MenuState => {\n  const triggerId = useId('menu');\n  const isSubmenu = useIsSubmenu();\n  const [contextTarget, setContextTarget] = usePopperMouseTarget();\n\n  const popperState = {\n    position: isSubmenu ? ('after' as const) : ('below' as const),\n    align: isSubmenu ? ('top' as const) : ('start' as const),\n    target: props.openOnContext ? contextTarget : undefined,\n    ...resolvePositioningShorthand(props.positioning),\n  };\n\n  const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n  if (children.length !== 2 && process.env.NODE_ENV !== 'production') {\n    // eslint-disable-next-line no-console\n    console.warn('Menu can only take one MenuTrigger and one MenuList as children');\n  }\n\n  const { menuTrigger, menuPopover } = children.reduce((acc, child) => {\n    if (child.type === MenuTrigger) {\n      acc.menuTrigger = child;\n    } else {\n      acc.menuPopover = child;\n    }\n\n    return acc;\n  }, {} as Pick<MenuState, 'menuTrigger' | 'menuPopover'>);\n  const { targetRef: triggerRef, containerRef: menuPopoverRef } = usePopper(popperState);\n\n  const initialState = {\n    hoverDelay: 500,\n    triggerId,\n    isSubmenu: !!isSubmenu,\n    openOnHover: !!isSubmenu,\n    contextTarget,\n    setContextTarget,\n    ...props,\n    menuTrigger,\n    menuPopover,\n    triggerRef,\n    menuPopoverRef,\n  } as const;\n\n  // TODO Better way to narrow types ?\n\n  const [open, setOpen] = useMenuOpenState(initialState);\n  const [checkedValues, onCheckedValueChange] = useMenuSelectableState(initialState);\n\n  return {\n    ...initialState,\n    open,\n    setOpen,\n    checkedValues,\n    onCheckedValueChange,\n  };\n};\n\n/**\n * Adds appropriate state values and handlers for selectable items\n * i.e checkboxes and radios\n */\nconst useMenuSelectableState = (\n  state: Pick<MenuProps, 'checkedValues' | 'defaultCheckedValues' | 'onCheckedValueChange'>,\n) => {\n  const [checkedValues, setCheckedValues] = useControllableState({\n    state: state.checkedValues,\n    defaultState: state.defaultCheckedValues,\n    initialState: {},\n  });\n  const { onCheckedValueChange: onCheckedValueChangeOriginal } = state;\n  const onCheckedValueChange: MenuState['onCheckedValueChange'] = useEventCallback((e, { name, checkedItems }) => {\n    if (onCheckedValueChangeOriginal) {\n      onCheckedValueChangeOriginal(e, { name, checkedItems });\n    }\n\n    setCheckedValues(s => {\n      return s ? { ...s, [name]: checkedItems } : { [name]: checkedItems };\n    });\n  });\n\n  return [checkedValues, onCheckedValueChange] as const;\n};\n\nconst useMenuOpenState = (\n  state: Pick<MenuState, 'onOpenChange' | 'setContextTarget' | 'triggerRef' | 'menuPopoverRef' | 'isSubmenu'> &\n    Pick<MenuProps, 'open' | 'defaultOpen'>,\n) => {\n  const { targetDocument } = useFluent();\n  const parentSetOpen = useMenuContext(context => context.setOpen);\n  const onOpenChange: MenuState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n  const shouldHandleKeyboardRef = 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: MenuOpenEvents, 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.keyboard) {\n      shouldHandleKeyboardRef.current = true;\n      shouldHandleTabRef.current = (e as React.KeyboardEvent).key === 'Tab';\n      pressedShiftRef.current = (e as React.KeyboardEvent).shiftKey;\n    }\n\n    if (data.bubble) {\n      parentSetOpen(e, { ...data });\n    }\n\n    setOpenState(data.open);\n  });\n\n  const setOpen = useEventCallback((e: MenuOpenEvents, 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.triggerRef],\n    callback: e => setOpen(e, { open: false }),\n  });\n  useOnMenuMouseEnter({\n    element: targetDocument,\n    callback: e => {\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(e, { open: false });\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 (!shouldHandleKeyboardRef.current) {\n      return;\n    }\n\n    if (open) {\n      focusFirst();\n    } else {\n      if (shouldHandleTabRef.current && !state.isSubmenu) {\n        pressedShiftRef.current ? focusBeforeMenuTrigger() : focusAfterMenuTrigger();\n      } else {\n        state.triggerRef.current?.focus();\n      }\n    }\n\n    shouldHandleKeyboardRef.current = false;\n    shouldHandleTabRef.current = false;\n    pressedShiftRef.current = false;\n  }, [state.triggerRef, state.isSubmenu, open, focusFirst, focusAfterMenuTrigger, focusBeforeMenuTrigger]);\n\n  return [open ?? false, setOpen] as const;\n};\n"],"sourceRoot":"../src/"}

package/lib/components/Menu/useMenuContextValues.d.ts

@@ -0,0 +1,2 @@
+import type { MenuContextValues, MenuState } from './Menu.types';
+export declare function useMenuContextValues(state: MenuState): MenuContextValues;

package/lib/components/Menu/useMenuContextValues.js

@@ -0,0 +1,39 @@
+export function useMenuContextValues(state) {
+  var open = state.open,
+      setOpen = state.setOpen,
+      onCheckedValueChange = state.onCheckedValueChange,
+      checkedValues = state.checkedValues,
+      defaultCheckedValues = state.defaultCheckedValues,
+      openOnHover = state.openOnHover,
+      openOnContext = state.openOnContext,
+      triggerRef = state.triggerRef,
+      triggerId = state.triggerId,
+      menuPopoverRef = state.menuPopoverRef,
+      isSubmenu = state.isSubmenu,
+      hasCheckmarks = state.hasCheckmarks,
+      hasIcons = state.hasIcons,
+      persistOnItemClick = state.persistOnItemClick,
+      inline = state.inline; // This context is created with "@fluentui/react-context-selector", these is no sense to memoize it
+
+  var menu = {
+    open: open,
+    setOpen: setOpen,
+    onCheckedValueChange: onCheckedValueChange,
+    checkedValues: checkedValues,
+    defaultCheckedValues: defaultCheckedValues,
+    triggerRef: triggerRef,
+    openOnHover: openOnHover,
+    openOnContext: openOnContext,
+    triggerId: triggerId,
+    menuPopoverRef: menuPopoverRef,
+    isSubmenu: isSubmenu,
+    hasCheckmarks: hasCheckmarks,
+    hasIcons: hasIcons,
+    persistOnItemClick: persistOnItemClick,
+    inline: inline
+  };
+  return {
+    menu: menu
+  };
+}
+//# sourceMappingURL=useMenuContextValues.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["components/Menu/useMenuContextValues.ts"],"names":[],"mappings":"AAEA,OAAM,SAAU,oBAAV,CAA+B,KAA/B,EAA+C;AAEjD,MAAA,IAAI,GAeF,KAAK,CAfH,IAAJ;AAAA,MACA,OAAO,GAcL,KAAK,CAdA,OADP;AAAA,MAEA,oBAAoB,GAalB,KAAK,CAba,oBAFpB;AAAA,MAGA,aAAa,GAYX,KAAK,CAZM,aAHb;AAAA,MAIA,oBAAoB,GAWlB,KAAK,CAXa,oBAJpB;AAAA,MAKA,WAAW,GAUT,KAAK,CAVI,WALX;AAAA,MAMA,aAAa,GASX,KAAK,CATM,aANb;AAAA,MAOA,UAAU,GAQR,KAAK,CARG,UAPV;AAAA,MAQA,SAAS,GAOP,KAAK,CAPE,SART;AAAA,MASA,cAAc,GAMZ,KAAK,CANO,cATd;AAAA,MAUA,SAAS,GAKP,KAAK,CALE,SAVT;AAAA,MAWA,aAAa,GAIX,KAAK,CAJM,aAXb;AAAA,MAYA,QAAQ,GAGN,KAAK,CAHC,QAZR;AAAA,MAaA,kBAAkB,GAEhB,KAAK,CAFW,kBAblB;AAAA,MAcA,MAAM,GACJ,KAAK,CADD,MAdN,CAFiD,CAmBnD;;AACA,MAAM,IAAI,GAAG;AACX,IAAA,IAAI,EAAA,IADO;AAEX,IAAA,OAAO,EAAA,OAFI;AAGX,IAAA,oBAAoB,EAAA,oBAHT;AAIX,IAAA,aAAa,EAAA,aAJF;AAKX,IAAA,oBAAoB,EAAA,oBALT;AAMX,IAAA,UAAU,EAAA,UANC;AAOX,IAAA,WAAW,EAAA,WAPA;AAQX,IAAA,aAAa,EAAA,aARF;AASX,IAAA,SAAS,EAAA,SATE;AAUX,IAAA,cAAc,EAAA,cAVH;AAWX,IAAA,SAAS,EAAA,SAXE;AAYX,IAAA,aAAa,EAAA,aAZF;AAaX,IAAA,QAAQ,EAAA,QAbG;AAcX,IAAA,kBAAkB,EAAA,kBAdP;AAeX,IAAA,MAAM,EAAA;AAfK,GAAb;AAkBA,SAAO;AAAE,IAAA,IAAI,EAAA;AAAN,GAAP;AACD","sourcesContent":["import type { MenuContextValues, MenuState } from './Menu.types';\n\nexport function useMenuContextValues(state: MenuState): MenuContextValues {\n  const {\n    open,\n    setOpen,\n    onCheckedValueChange,\n    checkedValues,\n    defaultCheckedValues,\n    openOnHover,\n    openOnContext,\n    triggerRef,\n    triggerId,\n    menuPopoverRef,\n    isSubmenu,\n    hasCheckmarks,\n    hasIcons,\n    persistOnItemClick,\n    inline,\n  } = state;\n\n  // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n  const menu = {\n    open,\n    setOpen,\n    onCheckedValueChange,\n    checkedValues,\n    defaultCheckedValues,\n    triggerRef,\n    openOnHover,\n    openOnContext,\n    triggerId,\n    menuPopoverRef,\n    isSubmenu,\n    hasCheckmarks,\n    hasIcons,\n    persistOnItemClick,\n    inline,\n  };\n\n  return { menu };\n}\n"],"sourceRoot":"../src/"}

package/lib/components/MenuDivider/MenuDivider.d.ts

@@ -1,6 +1,23 @@
 import * as React from 'react';
 /**
  * Define a styled MenuDivider, using the `useMenuDivider` hook.
- * {@docCategory MenuDivider }
  */
-export declare const MenuDivider: React.ForwardRefExoticComponent<import("@fluentui/react-utilities").ComponentProps & React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+export declare const MenuDivider: React.ForwardRefExoticComponent<Pick<{
+    root?: import("@fluentui/react-utilities").ShorthandProps<{
+        as?: "div" | undefined;
+    } & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | import("@fluentui/react-utilities").ShorthandRenderFunction<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
+            ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        }> | null | undefined;
+    }>;
+}, never> & Pick<{
+    as?: "div" | undefined;
+} & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+} & {
+    children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | import("@fluentui/react-utilities").ShorthandRenderFunction<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+    }> | null | undefined;
+}, "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "as"> & React.RefAttributes<HTMLDivElement>>;

package/lib/components/MenuDivider/MenuDivider.js

@@ -4,12 +4,12 @@ import { useMenuDividerStyles } from './useMenuDividerStyles';
 import { renderMenuDivider } from './renderMenuDivider';
 /**
  * Define a styled MenuDivider, using the `useMenuDivider` hook.
- * {@docCategory MenuDivider }
  */
-export var MenuDivider = React.forwardRef(function (props, ref) {
-    var state = useMenuDivider(props, ref);
-    useMenuDividerStyles(state);
-    return renderMenuDivider(state);
+
+export var MenuDivider = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var state = useMenuDivider(props, ref);
+  useMenuDividerStyles(state);
+  return renderMenuDivider(state);
 });
 MenuDivider.displayName = 'MenuDivider';
 //# sourceMappingURL=MenuDivider.js.map

package/lib/components/MenuDivider/MenuDivider.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuDivider.js","sourceRoot":"../src/","sources":["components/MenuDivider/MenuDivider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD;;;GAGG;AACH,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAAgC,UAAC,KAAK,EAAE,GAAG;IACpF,IAAM,KAAK,GAAG,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IACzC,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAE5B,OAAO,iBAAiB,CAAC,KAAK,CAAC,CAAC;AAClC,CAAC,CAAC,CAAC;AAEH,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC","sourcesContent":["import * as React from 'react';\nimport { useMenuDivider } from './useMenuDivider';\nimport { MenuDividerProps } from './MenuDivider.types';\nimport { useMenuDividerStyles } from './useMenuDividerStyles';\nimport { renderMenuDivider } from './renderMenuDivider';\n\n/**\n * Define a styled MenuDivider, using the `useMenuDivider` hook.\n * {@docCategory MenuDivider }\n */\nexport const MenuDivider = React.forwardRef<HTMLElement, MenuDividerProps>((props, ref) => {\n  const state = useMenuDivider(props, ref);\n  useMenuDividerStyles(state);\n\n  return renderMenuDivider(state);\n});\n\nMenuDivider.displayName = 'MenuDivider';\n"]}
+{"version":3,"sources":["components/MenuDivider/MenuDivider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,cAAT,QAA+B,kBAA/B;AACA,SAAS,oBAAT,QAAqC,wBAArC;AACA,SAAS,iBAAT,QAAkC,qBAAlC;AAGA;;AAEG;;AACH,OAAO,IAAM,WAAW,gBAAG,KAAK,CAAC,UAAN,CAAmD,UAAC,KAAD,EAAQ,GAAR,EAAW;AACvF,MAAM,KAAK,GAAG,cAAc,CAAC,KAAD,EAAQ,GAAR,CAA5B;AACA,EAAA,oBAAoB,CAAC,KAAD,CAApB;AAEA,SAAO,iBAAiB,CAAC,KAAD,CAAxB;AACD,CAL0B,CAApB;AAOP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport { useMenuDivider } from './useMenuDivider';\nimport { useMenuDividerStyles } from './useMenuDividerStyles';\nimport { renderMenuDivider } from './renderMenuDivider';\nimport type { MenuDividerProps } from './MenuDivider.types';\n\n/**\n * Define a styled MenuDivider, using the `useMenuDivider` hook.\n */\nexport const MenuDivider = React.forwardRef<HTMLDivElement, MenuDividerProps>((props, ref) => {\n  const state = useMenuDivider(props, ref);\n  useMenuDividerStyles(state);\n\n  return renderMenuDivider(state);\n});\n\nMenuDivider.displayName = 'MenuDivider';\n"],"sourceRoot":"../src/"}

package/lib/components/MenuDivider/MenuDivider.types.d.ts

@@ -1,12 +1,6 @@
-import * as React from 'react';
-import { ComponentProps } from '@fluentui/react-utilities';
-/**
- * {@docCategory MenuDivider}
- */
-export declare type MenuDividerProps = ComponentProps & React.HTMLAttributes<HTMLElement>;
-/**
- * {@docCategory MenuDivider}
- */
-export interface MenuDividerState extends MenuDividerProps {
-    ref: React.MutableRefObject<HTMLElement>;
-}
+import { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
+export declare type MenuDividerSlots = {
+    root: IntrinsicShorthandProps<'div'>;
+};
+export declare type MenuDividerProps = ComponentProps<MenuDividerSlots>;
+export declare type MenuDividerState = ComponentState<MenuDividerSlots>;

package/lib/components/MenuDivider/MenuDivider.types.js

@@ -1 +1,2 @@
+export {};
 //# sourceMappingURL=MenuDivider.types.js.map

package/lib/components/MenuDivider/MenuDivider.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuDivider.types.js","sourceRoot":"../src/","sources":["components/MenuDivider/MenuDivider.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { ComponentProps } from '@fluentui/react-utilities';\n\n/**\n * {@docCategory MenuDivider}\n */\nexport type MenuDividerProps = ComponentProps & React.HTMLAttributes<HTMLElement>;\n\n/**\n * {@docCategory MenuDivider}\n */\nexport interface MenuDividerState extends MenuDividerProps {\n  ref: React.MutableRefObject<HTMLElement>;\n}\n"]}
+{"version":3,"file":"MenuDivider.types.js","sourceRoot":"../src/","sources":["components/MenuDivider/MenuDivider.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';\n\nexport type MenuDividerSlots = {\n  root: IntrinsicShorthandProps<'div'>;\n};\n\nexport type MenuDividerProps = ComponentProps<MenuDividerSlots>;\n\nexport type MenuDividerState = ComponentState<MenuDividerSlots>;\n"]}

package/lib/components/MenuDivider/index.js

@@ -1,3 +1,4 @@
+export * from './MenuDivider.types';
 export * from './MenuDivider';
 export * from './renderMenuDivider';
 export * from './useMenuDivider';