feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/Menu.js

@@ -0,0 +1,22 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Menu", {
+    enumerable: true,
+    get: function() {
+        return Menu;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _useMenu = require("./useMenu");
+const _useMenuContextValues = require("./useMenuContextValues");
+const _renderMenu = require("./renderMenu");
+const Menu = (props)=>{
+    const state = (0, _useMenu.useMenu_unstable)(props);
+    const contextValues = (0, _useMenuContextValues.useMenuContextValues_unstable)(state);
+    return (0, _renderMenu.renderMenu_unstable)(state, contextValues);
+};
+Menu.displayName = 'Menu';

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/Menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Menu/Menu.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenu_unstable } from './useMenu';\nimport { useMenuContextValues_unstable } from './useMenuContextValues';\nimport { renderMenu_unstable } from './renderMenu';\nimport type { MenuProps } from './Menu.types';\n\n/**\n * Wrapper component that manages state for a popup MenuList and a MenuTrigger\n */\nexport const Menu: React.FC<MenuProps> = props => {\n  const state = useMenu_unstable(props);\n  const contextValues = useMenuContextValues_unstable(state);\n\n  return renderMenu_unstable(state, contextValues);\n};\n\nMenu.displayName = 'Menu';\n"],"names":["React","useMenu_unstable","useMenuContextValues_unstable","renderMenu_unstable","Menu","props","state","contextValues","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;yBACE,YAAY;sCACC,yBAAyB;4BACnC,eAAe;AAM5C,MAAMI,OAA4BC,CAAAA;IACvC,MAAMC,YAAQL,yBAAAA,EAAiBI;IAC/B,MAAME,oBAAgBL,mDAAAA,EAA8BI;IAEpD,WAAOH,+BAAAA,EAAoBG,OAAOC;AACpC,EAAE;AAEFH,KAAKI,WAAW,GAAG"}

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/Menu.types.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/MenuSurfaceMotion.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "MenuSurfaceMotion", {
+    enumerable: true,
+    get: function() {
+        return MenuSurfaceMotion;
+    }
+});
+const _reactmotion = require("@fluentui/react-motion");
+const _reactmotioncomponentspreview = require("@fluentui/react-motion-components-preview");
+const _reactpositioning = require("@fluentui/react-positioning");
+// Shared timing constants for the enter animation.
+const duration = _reactmotion.motionTokens.durationSlower;
+const easing = _reactmotion.motionTokens.curveDecelerateMid;
+const MenuSurfaceMotion = (0, _reactmotion.createPresenceComponent)(({ distance = 10 })=>({
+        enter: [
+            (0, _reactmotioncomponentspreview.fadeAtom)({
+                duration,
+                easing,
+                direction: 'enter'
+            }),
+            {
+                // slideAtom produces translate keyframes from `outX`/`outY` → `0px`.
+                // The `outX`/`outY` values read the positioning-provided CSS variables and scale
+                // them by `distance` so the surface slides in from the correct direction.
+                ...(0, _reactmotioncomponentspreview.slideAtom)({
+                    duration,
+                    easing,
+                    direction: 'enter',
+                    outX: `calc(var(${_reactpositioning.POSITIONING_SLIDE_DIRECTION_VAR_X}, 0px) * ${distance})`,
+                    outY: `calc(var(${_reactpositioning.POSITIONING_SLIDE_DIRECTION_VAR_Y}, 0px) * ${distance})`
+                }),
+                // 'accumulate' compositing adds this effect's transform on top of the element's
+                // existing transform, preserving any transform applied by the positioning engine.
+                composite: 'accumulate'
+            }
+        ],
+        // No exit animation — the surface unmounts immediately on close.
+        exit: []
+    }));

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/MenuSurfaceMotion.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Menu/MenuSurfaceMotion.ts"],"sourcesContent":["import { createPresenceComponent, motionTokens } from '@fluentui/react-motion';\nimport { fadeAtom, slideAtom } from '@fluentui/react-motion-components-preview';\nimport {\n  POSITIONING_SLIDE_DIRECTION_VAR_X as slideDirectionVarX,\n  POSITIONING_SLIDE_DIRECTION_VAR_Y as slideDirectionVarY,\n} from '@fluentui/react-positioning';\n\n// Shared timing constants for the enter animation.\nconst duration = motionTokens.durationSlower;\nconst easing = motionTokens.curveDecelerateMid;\n\n/**\n * Default `surfaceMotion` slot for `<Menu>`.\n *\n * Enter-only animation combining a fade and a direction-aware slide.\n * The slide reads CSS variables set by `usePositioningSlideDirection` and scales\n * them by `distance` pixels. There is no exit animation; the surface unmounts immediately.\n *\n * @param distance - Travel distance (px) for the enter slide. Defaults to `10`.\n */\nexport const MenuSurfaceMotion = createPresenceComponent(({ distance = 10 }: { distance?: number }) => ({\n  enter: [\n    fadeAtom({ duration, easing, direction: 'enter' }),\n    {\n      // slideAtom produces translate keyframes from `outX`/`outY` → `0px`.\n      // The `outX`/`outY` values read the positioning-provided CSS variables and scale\n      // them by `distance` so the surface slides in from the correct direction.\n      ...slideAtom({\n        duration,\n        easing,\n        direction: 'enter',\n        outX: `calc(var(${slideDirectionVarX}, 0px) * ${distance})`,\n        outY: `calc(var(${slideDirectionVarY}, 0px) * ${distance})`,\n      }),\n      // 'accumulate' compositing adds this effect's transform on top of the element's\n      // existing transform, preserving any transform applied by the positioning engine.\n      composite: 'accumulate',\n    },\n  ],\n  // No exit animation — the surface unmounts immediately on close.\n  exit: [],\n}));\n"],"names":["createPresenceComponent","motionTokens","fadeAtom","slideAtom","POSITIONING_SLIDE_DIRECTION_VAR_X","slideDirectionVarX","POSITIONING_SLIDE_DIRECTION_VAR_Y","slideDirectionVarY","duration","durationSlower","easing","curveDecelerateMid","MenuSurfaceMotion","distance","enter","direction","outX","outY","composite","exit"],"mappings":";;;;+BAoBaY;;;;;;6BApByC,yBAAyB;8CAC3C,4CAA4C;kCAIzE,8BAA8B;AAErC,mDAAmD;AACnD,MAAMJ,WAAWP,yBAAAA,CAAaQ,cAAc;AAC5C,MAAMC,SAAST,yBAAAA,CAAaU,kBAAkB;AAWvC,8BAA0BX,oCAAAA,EAAwB,CAAC,EAAEa,WAAW,EAAE,EAAyB,GAAM,CAAA;QACtGC,OAAO;gBACLZ,sCAAAA,EAAS;gBAAEM;gBAAUE;gBAAQK,WAAW;YAAQ;YAChD;gBACE,qEAAqE;gBACrE,iFAAiF;gBACjF,0EAA0E;gBAC1E,GAAGZ,2CAAAA,EAAU;oBACXK;oBACAE;oBACAK,WAAW;oBACXC,MAAM,CAAC,SAAS,EAAEX,mDAAAA,CAAmB,SAAS,EAAEQ,SAAS,CAAC,CAAC;oBAC3DI,MAAM,CAAC,SAAS,EAAEV,mDAAAA,CAAmB,SAAS,EAAEM,SAAS,CAAC,CAAC;gBAC7D,EAAE;gBACF,gFAAgF;gBAChF,kFAAkF;gBAClFK,WAAW;YACb;SACD;QACD,iEAAiE;QACjEC,MAAM,EAAE;KACV,CAAA,GAAI"}

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/index.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    Menu: function() {
+        return _Menu.Menu;
+    },
+    renderMenu_unstable: function() {
+        return _renderMenu.renderMenu_unstable;
+    },
+    useMenuContextValues_unstable: function() {
+        return _useMenuContextValues.useMenuContextValues_unstable;
+    },
+    useMenu_unstable: function() {
+        return _useMenu.useMenu_unstable;
+    }
+});
+const _Menu = require("./Menu");
+const _renderMenu = require("./renderMenu");
+const _useMenu = require("./useMenu");
+const _useMenuContextValues = require("./useMenuContextValues");

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Menu/index.ts"],"sourcesContent":["export { Menu } from './Menu';\nexport type {\n  MenuContextValues,\n  MenuOpenChangeData,\n  MenuOpenEvent,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  MenuOpenEvents,\n  MenuProps,\n  MenuSlots,\n  MenuState,\n} from './Menu.types';\nexport { renderMenu_unstable } from './renderMenu';\nexport { useMenu_unstable } from './useMenu';\nexport { useMenuContextValues_unstable } from './useMenuContextValues';\n"],"names":["Menu","renderMenu_unstable","useMenu_unstable","useMenuContextValues_unstable"],"mappings":";;;;;;;;;;;;eAASA,UAAI;;;eAWJC,+BAAmB;;;eAEnBE,mDAA6B;;;eAD7BD,yBAAgB;;;sBAZJ,SAAS;4BAWM,eAAe;yBAClB,YAAY;sCACC,yBAAyB"}

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/renderMenu.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderMenu_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderMenu_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactmotion = require("@fluentui/react-motion");
+const _reactutilities = require("@fluentui/react-utilities");
+const _menuContext = require("../../contexts/menuContext");
+const renderMenu_unstable = (state, contextValues)=>{
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_menuContext.MenuProvider, {
+        value: contextValues.menu,
+        children: [
+            state.menuTrigger,
+            state.menuPopover && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.surfaceMotion, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactmotion.MotionRefForwarder, {
+                    children: state.menuPopover
+                })
+            })
+        ]
+    });
+};

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/renderMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Menu/renderMenu.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport { MotionRefForwarder } from '@fluentui/react-motion';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { MenuProvider } from '../../contexts/menuContext';\nimport type { InternalMenuSlots, MenuContextValues, MenuState } from './Menu.types';\n\n/**\n * Render the final JSX of Menu\n */\nexport const renderMenu_unstable = (state: MenuState, contextValues: MenuContextValues): JSXElement => {\n  assertSlots<InternalMenuSlots>(state);\n\n  return (\n    <MenuProvider value={contextValues.menu}>\n      {state.menuTrigger}\n      {state.menuPopover && (\n        <state.surfaceMotion>\n          <MotionRefForwarder>\n            {/* Casting here as content should be equivalent to <MenuPopover /> */}\n            {/* FIXME: content should not be ReactNode it should be ReactElement instead. */}\n            {state.menuPopover as React.ReactElement}\n          </MotionRefForwarder>\n        </state.surfaceMotion>\n      )}\n    </MenuProvider>\n  );\n};\n"],"names":["React","MotionRefForwarder","assertSlots","MenuProvider","renderMenu_unstable","state","contextValues","value","menu","menuTrigger","menuPopover","surfaceMotion"],"mappings":";;;;+BAaaI;;;;;;;4BAZb,iCAAiD;iEAE1B,QAAQ;6BACI,yBAAyB;gCAChC,4BAA4B;6BAE3B,6BAA6B;AAMnD,4BAA4B,CAACC,OAAkBC;QACpDJ,2BAAAA,EAA+BG;IAE/B,OAAA,WAAA,OACE,gBAAA,EAACF,yBAAAA,EAAAA;QAAaI,OAAOD,cAAcE,IAAI;;YACpCH,MAAMI,WAAW;YACjBJ,MAAMK,WAAW,IAAA,WAAA,OAChB,eAAA,EAACL,MAAMM,aAAa,EAAA;0BAClB,WAAA,OAAA,eAAA,EAACV,+BAAAA,EAAAA;8BAGEI,MAAMK,WAAW;;;;;AAM9B,EAAE"}

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/useMenu.js

@@ -0,0 +1,345 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useMenu_unstable", {
+    enumerable: true,
+    get: function() {
+        return useMenu_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactpositioning = require("@fluentui/react-positioning");
+const _reactmotion = require("@fluentui/react-motion");
+const _reactutilities = require("@fluentui/react-utilities");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _reacttabster = require("@fluentui/react-tabster");
+const _menuContext = require("../../contexts/menuContext");
+const _utils = require("../../utils");
+const _useMenuItemStylesstyles = require("../MenuItem/useMenuItemStyles.styles");
+const _MenuSurfaceMotion = require("./MenuSurfaceMotion");
+// 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 useMenu_unstable = (props)=>{
+    const isSubmenu = (0, _utils.useIsSubmenu)();
+    const { hoverDelay = 500, inline = false, hasCheckmarks = false, hasIcons = false, closeOnScroll = false, openOnContext = false, persistOnItemClick = false, openOnHover = isSubmenu, defaultCheckedValues, mountNode = null, safeZone } = props;
+    const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
+    const triggerId = (0, _reactutilities.useId)('menu');
+    const [contextTarget, setContextTarget] = (0, _reactpositioning.usePositioningMouseTarget)();
+    const resolvedPositioning = (0, _reactpositioning.resolvePositioningShorthand)(props.positioning);
+    const handlePositionEnd = (0, _reactpositioning.usePositioningSlideDirection)({
+        targetDocument,
+        onPositioningEnd: resolvedPositioning.onPositioningEnd
+    });
+    const positioningOptions = {
+        position: isSubmenu ? 'after' : 'below',
+        align: isSubmenu ? 'top' : 'start',
+        target: props.openOnContext ? contextTarget : undefined,
+        fallbackPositions: isSubmenu ? submenuFallbackPositions : undefined,
+        ...resolvedPositioning,
+        onPositioningEnd: handlePositionEnd
+    };
+    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');
+        }
+    }
+    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, containerRef } = (0, _reactpositioning.usePositioning)(positioningOptions);
+    const enableSafeZone = safeZone && openOnHover;
+    const safeZoneDescriptorRef = _react.useRef({
+        isInside: false,
+        mouseCoordinates: {
+            x: 0,
+            y: 0
+        }
+    });
+    const safeZoneHandle = (0, _reactpositioning.useSafeZoneArea)({
+        disabled: !enableSafeZone,
+        timeout: typeof safeZone === 'object' ? safeZone.timeout : 300,
+        onSafeZoneEnter: (e)=>{
+            setOpen(e, {
+                open: true,
+                keyboard: false,
+                type: 'menuSafeZoneMouseEnter',
+                event: e
+            });
+            safeZoneDescriptorRef.current.isInside = true;
+        },
+        onSafeZoneLeave: ()=>{
+            safeZoneDescriptorRef.current.isInside = false;
+        },
+        onSafeZoneMove: (e)=>{
+            safeZoneDescriptorRef.current.mouseCoordinates = {
+                x: e.clientX,
+                y: e.clientY
+            };
+        },
+        onSafeZoneTimeout: ()=>{
+            const event = new CustomEvent(_utils.MENU_SAFEZONE_TIMEOUT_EVENT);
+            setOpen(event, {
+                open: false,
+                keyboard: false,
+                type: 'menuSafeZoneTimeout',
+                event
+            });
+            if (safeZoneDescriptorRef.current.isInside && targetDocument) {
+                const elementsInPoint = targetDocument.elementsFromPoint(safeZoneDescriptorRef.current.mouseCoordinates.x, safeZoneDescriptorRef.current.mouseCoordinates.y);
+                const menuItemEl = elementsInPoint.find((el)=>{
+                    return el.classList.contains(_useMenuItemStylesstyles.menuItemClassNames.root);
+                });
+                menuItemEl === null || menuItemEl === void 0 ? void 0 : menuItemEl.dispatchEvent(event);
+            }
+        }
+    });
+    const triggerRef = (0, _reactutilities.useMergedRefs)(targetRef, safeZoneHandle.targetRef);
+    const menuPopoverRef = (0, _reactutilities.useMergedRefs)(containerRef, safeZoneHandle.containerRef);
+    // 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: {
+            surfaceMotion: _MenuSurfaceMotion.MenuSurfaceMotion
+        },
+        openOnContext,
+        open,
+        setOpen,
+        checkedValues,
+        onCheckedValueChange,
+        persistOnItemClick,
+        safeZone: safeZoneHandle.elementToRender,
+        surfaceMotion: (0, _reactmotion.presenceMotionSlot)(props.surfaceMotion, {
+            elementType: _MenuSurfaceMotion.MenuSurfaceMotion,
+            defaultProps: {
+                visible: open,
+                appear: true,
+                unmountOnExit: true
+            }
+        })
+    };
+};
+/**
+ * Adds appropriate state values and handlers for selectable items
+ * i.e checkboxes and radios
+ */ const useMenuSelectableState = (props)=>{
+    const [checkedValues, setCheckedValues] = (0, _reactutilities.useControllableState)({
+        state: props.checkedValues,
+        defaultState: props.defaultCheckedValues,
+        initialState: {}
+    });
+    const onCheckedValueChange = (0, _reactutilities.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)=>{
+    'use no memo';
+    const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
+    const parentSetOpen = (0, _menuContext.useMenuContext_unstable)((context)=>context.setOpen);
+    const onOpenChange = (0, _reactutilities.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 enteringTriggerRef = _react.useRef(false);
+    const [open, setOpenState] = (0, _reactutilities.useControllableState)({
+        state: state.open,
+        defaultState: state.defaultOpen,
+        initialState: false
+    });
+    const trySetOpen = (0, _reactutilities.useEventCallback)((e, data)=>{
+        const event = e instanceof CustomEvent && e.type === _utils.MENU_ENTER_EVENT ? e.detail.nativeEvent : e;
+        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, {
+            ...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 [setOpenTimeout, clearOpenTimeout] = (0, _reactutilities.useTimeout)();
+    const setOpen = (0, _reactutilities.useEventCallback)((e, data)=>{
+        clearOpenTimeout();
+        if (!(e instanceof Event) && e.persist) {
+            // < React 17 still uses pooled synthetic events
+            e.persist();
+        }
+        const shouldUseDelay = !data.ignoreHoverDelay && (e.type === 'mouseleave' || e.type === 'mouseover' || e.type === 'mousemove' || e.type === _utils.MENU_ENTER_EVENT);
+        if (shouldUseDelay) {
+            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 === 'mouseover' || e.type === 'mousemove';
+            }
+            setOpenTimeout(()=>trySetOpen(e, data), state.hoverDelay);
+        } else {
+            trySetOpen(e, data);
+        }
+    });
+    (0, _reactutilities.useOnClickOutside)({
+        contains: _reactutilities.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;
+    (0, _reactutilities.useOnScrollOutside)({
+        contains: _reactutilities.elementContains,
+        element: targetDocument,
+        callback: (event)=>setOpen(event, {
+                open: false,
+                type: 'scrollOutside',
+                event
+            }),
+        refs: [
+            state.menuPopoverRef,
+            !state.openOnContext && state.triggerRef
+        ].filter(Boolean),
+        disabled: !open || !closeOnScroll
+    });
+    (0, _utils.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
+        ]
+    });
+    // Manage focus for open state
+    const { findFirstFocusable } = (0, _reacttabster.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 = (0, _reactutilities.useFirstMount)();
+    _react.useEffect(()=>{
+        if (open) {
+            focusFirst();
+        } else {
+            // Skip the initial render — focus should only be restored when the menu
+            // transitions from open → closed, not on mount.
+            if (!firstMount) {
+                var // (e.g. during an exit animation), so focus may still be inside the
+                // popover even though `open` is already false. Proactively move it
+                // to the trigger before the DOM element is eventually removed.
+                _state_menuPopoverRef_current;
+                var _targetDocument_activeElement;
+                if (// meaning the user's focus has nowhere meaningful to go.
+                (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.body) || ((_state_menuPopoverRef_current = state.menuPopoverRef.current) === null || _state_menuPopoverRef_current === void 0 ? void 0 : _state_menuPopoverRef_current.contains((_targetDocument_activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) !== null && _targetDocument_activeElement !== void 0 ? _targetDocument_activeElement : null))) {
+                    var // 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
+    ];
+};

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/useMenuContextValues.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useMenuContextValues_unstable", {
+    enumerable: true,
+    get: function() {
+        return useMenuContextValues_unstable;
+    }
+});
+function useMenuContextValues_unstable(state) {
+    const { checkedValues, hasCheckmarks, hasIcons, inline, isSubmenu, menuPopoverRef, mountNode, onCheckedValueChange, open, openOnContext, openOnHover, persistOnItemClick, safeZone, setOpen, triggerId, triggerRef } = state;
+    // This context is created with "@fluentui/react-context-selector", these is no sense to memoize it
+    const menu = {
+        checkedValues,
+        hasCheckmarks,
+        hasIcons,
+        inline,
+        isSubmenu,
+        menuPopoverRef,
+        mountNode,
+        onCheckedValueChange,
+        open,
+        openOnContext,
+        openOnHover,
+        persistOnItemClick,
+        safeZone,
+        setOpen,
+        triggerId,
+        triggerRef
+    };
+    return {
+        menu
+    };
+}

node_modules/@fluentui/react-menu/lib-commonjs/components/Menu/useMenuContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Menu/useMenuContextValues.ts"],"sourcesContent":["import type { MenuContextValues, MenuState } from './Menu.types';\n\nexport function useMenuContextValues_unstable(state: MenuState): MenuContextValues {\n  const {\n    checkedValues,\n    hasCheckmarks,\n    hasIcons,\n    inline,\n    isSubmenu,\n    menuPopoverRef,\n    mountNode,\n    onCheckedValueChange,\n    open,\n    openOnContext,\n    openOnHover,\n    persistOnItemClick,\n    safeZone,\n    setOpen,\n    triggerId,\n    triggerRef,\n  } = state;\n\n  // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n  const menu = {\n    checkedValues,\n    hasCheckmarks,\n    hasIcons,\n    inline,\n    isSubmenu,\n    menuPopoverRef,\n    mountNode,\n    onCheckedValueChange,\n    open,\n    openOnContext,\n    openOnHover,\n    persistOnItemClick,\n    safeZone,\n    setOpen,\n    triggerId,\n    triggerRef,\n  };\n\n  return { menu };\n}\n"],"names":["useMenuContextValues_unstable","state","checkedValues","hasCheckmarks","hasIcons","inline","isSubmenu","menuPopoverRef","mountNode","onCheckedValueChange","open","openOnContext","openOnHover","persistOnItemClick","safeZone","setOpen","triggerId","triggerRef","menu"],"mappings":";;;;+BAEgBA;;;;;;AAAT,uCAAuCC,KAAgB;IAC5D,MAAM,EACJC,aAAa,EACbC,aAAa,EACbC,QAAQ,EACRC,MAAM,EACNC,SAAS,EACTC,cAAc,EACdC,SAAS,EACTC,oBAAoB,EACpBC,IAAI,EACJC,aAAa,EACbC,WAAW,EACXC,kBAAkB,EAClBC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,UAAU,EACX,GAAGhB;IAEJ,mGAAmG;IACnG,MAAMiB,OAAO;QACXhB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,OAAO;QAAEC;IAAK;AAChB"}