'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "useMenuPopover_unstable", {
    enumerable: true,
    get: function() {
        return useMenuPopover_unstable;
    }
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _keyboardkeys = require("@fluentui/keyboard-keys");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _reactmotion = require("@fluentui/react-motion");
const _reacttabster = require("@fluentui/react-tabster");
const _reactutilities = require("@fluentui/react-utilities");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _menuContext = require("../../contexts/menuContext");
const _menuListContext = require("../../contexts/menuListContext");
const _index = require("../../utils/index");
const useMenuPopover_unstable = (props, ref)=>{
    'use no memo';
    const safeZone = (0, _menuContext.useMenuContext_unstable)((context)=>context.safeZone);
    const popoverRef = (0, _menuContext.useMenuContext_unstable)((context)=>context.menuPopoverRef);
    const setOpen = (0, _menuContext.useMenuContext_unstable)((context)=>context.setOpen);
    const open = (0, _menuContext.useMenuContext_unstable)((context)=>context.open);
    const openOnHover = (0, _menuContext.useMenuContext_unstable)((context)=>context.openOnHover);
    const triggerRef = (0, _menuContext.useMenuContext_unstable)((context)=>context.triggerRef);
    const isSubmenu = (0, _index.useIsSubmenu)();
    const shouldCloseOnArrowLeft = (0, _menuListContext.useMenuListContext_unstable)((ctx)=>{
        var _ctx_shouldCloseOnArrowLeft;
        return (_ctx_shouldCloseOnArrowLeft = ctx.shouldCloseOnArrowLeft) !== null && _ctx_shouldCloseOnArrowLeft !== void 0 ? _ctx_shouldCloseOnArrowLeft : true;
    });
    const canDispatchCustomEventRef = _react.useRef(true);
    const restoreFocusSourceAttributes = (0, _reacttabster.useRestoreFocusSource)();
    const [setThrottleTimeout, clearThrottleTimeout] = (0, _reactutilities.useTimeout)();
    const { dir } = (0, _reactsharedcontexts.useFluent_unstable)();
    const CloseArrowKey = dir === 'ltr' ? _keyboardkeys.ArrowLeft : _keyboardkeys.ArrowRight;
    // use DOM listener since react events propagate up the react tree
    // no need to do `contains` logic as menus are all positioned in different portals
    const mouseOverListenerCallbackRef = _react.useCallback((node)=>{
        if (node) {
            // Dispatches the custom menu mouse enter event with throttling
            // Needs to trigger on mouseover to support keyboard + mouse together
            // i.e. keyboard opens submenus while cursor is still on the parent
            node.addEventListener('mouseover', (e)=>{
                if (canDispatchCustomEventRef.current) {
                    canDispatchCustomEventRef.current = false;
                    (0, _index.dispatchMenuEnterEvent)(popoverRef.current, e);
                    setThrottleTimeout(()=>{
                        canDispatchCustomEventRef.current = true;
                    }, 250);
                }
            });
        }
    }, [
        popoverRef,
        setThrottleTimeout
    ]);
    _react.useEffect(()=>{
        return ()=>clearThrottleTimeout();
    }, [
        clearThrottleTimeout
    ]);
    var _useMenuContext_unstable;
    const inline = (_useMenuContext_unstable = (0, _menuContext.useMenuContext_unstable)((context)=>context.inline)) !== null && _useMenuContext_unstable !== void 0 ? _useMenuContext_unstable : false;
    const mountNode = (0, _menuContext.useMenuContext_unstable)((context)=>context.mountNode);
    const rootProps = _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
        role: 'presentation',
        ...restoreFocusSourceAttributes,
        ...props,
        // FIXME:
        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
        // but since it would be a breaking change to fix it, we are casting ref to it's proper type
        ref: (0, _reactutilities.useMergedRefs)(ref, popoverRef, mouseOverListenerCallbackRef, (0, _reactmotion.useMotionForwardedRef)())
    }), {
        elementType: 'div'
    });
    const { onMouseEnter: onMouseEnterOriginal, onKeyDown: onKeyDownOriginal } = rootProps;
    rootProps.onMouseEnter = (0, _reactutilities.useEventCallback)((event)=>{
        if (openOnHover || isSubmenu) {
            setOpen(event, {
                open: true,
                keyboard: false,
                type: 'menuPopoverMouseEnter',
                event
            });
        }
        onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(event);
    });
    rootProps.onKeyDown = (0, _reactutilities.useEventCallback)((event)=>{
        const key = event.key;
        if (key === _keyboardkeys.Escape || isSubmenu && shouldCloseOnArrowLeft && key === CloseArrowKey) {
            var _popoverRef_current;
            if (open && ((_popoverRef_current = popoverRef.current) === null || _popoverRef_current === void 0 ? void 0 : _popoverRef_current.contains(event.target)) && !event.isDefaultPrevented()) {
                setOpen(event, {
                    open: false,
                    keyboard: true,
                    type: 'menuPopoverKeyDown',
                    event
                });
                // stop propagation to avoid conflicting with other elements that listen for `Escape`
                // e,g: Dialog, Popover, Menu and Tooltip
                event.preventDefault();
            }
        }
        if (key === _keyboardkeys.Tab) {
            setOpen(event, {
                open: false,
                keyboard: true,
                type: 'menuPopoverKeyDown',
                event
            });
            if (!isSubmenu) {
                var _triggerRef_current;
                (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();
            }
        }
        onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(event);
    });
    return {
        inline,
        mountNode,
        safeZone,
        components: {
            root: 'div'
        },
        root: rootProps
    };
};