power-apps-codeapps-blog-part2/node_modules/@fluentui/react-menu/lib-commonjs/components/MenuItem/useMenuItem.js

'use client';
"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, {
    useMenuItemBase_unstable: function() {
        return useMenuItemBase_unstable;
    },
    useMenuItem_unstable: function() {
        return useMenuItem_unstable;
    }
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _useCharacterSearch = require("./useCharacterSearch");
const _menuTriggerContext = require("../../contexts/menuTriggerContext");
const _reacticons = require("@fluentui/react-icons");
const _menuListContext = require("../../contexts/menuListContext");
const _menuContext = require("../../contexts/menuContext");
const _reactaria = require("@fluentui/react-aria");
const _keyboardkeys = require("@fluentui/keyboard-keys");
const _menuSplitGroupContext = require("../../contexts/menuSplitGroupContext");
const _useValidateNesting = require("../../utils/useValidateNesting");
const ChevronRightIcon = (0, _reacticons.bundleIcon)(_reacticons.ChevronRightFilled, _reacticons.ChevronRightRegular);
const ChevronLeftIcon = (0, _reacticons.bundleIcon)(_reacticons.ChevronLeftFilled, _reacticons.ChevronLeftRegular);
const useMenuItem_unstable = (props, ref)=>{
    const { dir } = (0, _reactsharedcontexts.useFluent_unstable)();
    const state = useMenuItemBase_unstable(props, ref);
    // Set default chevron icon
    if (state.submenuIndicator) {
        var _state_submenuIndicator;
        var _children;
        (_children = (_state_submenuIndicator = state.submenuIndicator).children) !== null && _children !== void 0 ? _children : _state_submenuIndicator.children = dir === 'rtl' ? /*#__PURE__*/ _react.createElement(ChevronLeftIcon, null) : /*#__PURE__*/ _react.createElement(ChevronRightIcon, null);
    }
    return state;
};
const useMenuItemBase_unstable = (props, ref)=>{
    const isSubmenuTrigger = (0, _menuTriggerContext.useMenuTriggerContext_unstable)();
    const persistOnClickContext = (0, _menuContext.useMenuContext_unstable)((context)=>context.persistOnItemClick);
    const { as = 'div', disabled = false, hasSubmenu = isSubmenuTrigger, persistOnClick = persistOnClickContext, content: _content, ...rest } = props;
    const { hasIcons, hasCheckmarks } = useIconAndCheckmarkAlignment({
        hasSubmenu
    });
    const setOpen = (0, _menuContext.useMenuContext_unstable)((context)=>context.setOpen);
    useNotifySplitItemMultiline({
        multiline: !!props.subText,
        hasSubmenu
    });
    const innerRef = _react.useRef(null);
    const dismissedWithKeyboardRef = _react.useRef(false);
    const validateNestingRef = (0, _useValidateNesting.useValidateNesting)(getValidateNestingComponentName(props.role));
    const state = {
        hasSubmenu,
        disabled,
        persistOnClick,
        components: {
            root: 'div',
            icon: 'span',
            checkmark: 'span',
            submenuIndicator: 'span',
            content: 'span',
            secondaryContent: 'span',
            subText: 'span'
        },
        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(as, (0, _reactaria.useARIAButtonProps)(as, {
            role: 'menuitem',
            ...rest,
            disabled: false,
            disabledFocusable: disabled,
            ref: (0, _reactutilities.useMergedRefs)(ref, innerRef, validateNestingRef),
            onKeyDown: (0, _reactutilities.useEventCallback)((event)=>{
                var _props_onKeyDown;
                (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, event);
                if (!event.isDefaultPrevented() && (event.key === _keyboardkeys.Space || event.key === _keyboardkeys.Enter)) {
                    dismissedWithKeyboardRef.current = true;
                }
            }),
            onMouseMove: (0, _reactutilities.useEventCallback)((event)=>{
                var _props_onMouseMove;
                if (event.currentTarget.ownerDocument.activeElement !== event.currentTarget) {
                    var _innerRef_current;
                    (_innerRef_current = innerRef.current) === null || _innerRef_current === void 0 ? void 0 : _innerRef_current.focus();
                }
                (_props_onMouseMove = props.onMouseMove) === null || _props_onMouseMove === void 0 ? void 0 : _props_onMouseMove.call(props, event);
            }),
            onClick: (0, _reactutilities.useEventCallback)((event)=>{
                var _props_onClick;
                if (!hasSubmenu && !persistOnClick) {
                    setOpen(event, {
                        open: false,
                        keyboard: dismissedWithKeyboardRef.current,
                        bubble: true,
                        type: 'menuItemClick',
                        event
                    });
                    dismissedWithKeyboardRef.current = false;
                }
                (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);
            })
        })), {
            elementType: 'div'
        }),
        icon: _reactutilities.slot.optional(props.icon, {
            renderByDefault: hasIcons,
            elementType: 'span'
        }),
        checkmark: _reactutilities.slot.optional(props.checkmark, {
            renderByDefault: hasCheckmarks,
            elementType: 'span'
        }),
        submenuIndicator: _reactutilities.slot.optional(props.submenuIndicator, {
            renderByDefault: hasSubmenu,
            elementType: 'span'
        }),
        content: _reactutilities.slot.optional(props.content, {
            renderByDefault: !!props.children,
            defaultProps: {
                children: props.children
            },
            elementType: 'span'
        }),
        secondaryContent: _reactutilities.slot.optional(props.secondaryContent, {
            elementType: 'span'
        }),
        subText: _reactutilities.slot.optional(props.subText, {
            elementType: 'span'
        })
    };
    (0, _useCharacterSearch.useCharacterSearch)(state, innerRef);
    return state;
};
/**
 * MenuSplitGroup needs to apply extra styles when its main item is in multiline layout mode
 * Notify the parent MenuSplitGroup so that it can handle this case
 */ const useNotifySplitItemMultiline = (options)=>{
    const { hasSubmenu, multiline } = options;
    const isSplitItemTrigger = (0, _menuSplitGroupContext.useIsInMenuSplitGroup)() && hasSubmenu;
    const { setMultiline } = (0, _menuSplitGroupContext.useMenuSplitGroupContext_unstable)();
    (0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
        if (!isSplitItemTrigger) {
            setMultiline(multiline);
        }
    }, [
        setMultiline,
        multiline,
        isSplitItemTrigger
    ]);
};
const useIconAndCheckmarkAlignment = (options)=>{
    const { hasSubmenu } = options;
    const hasIcons = (0, _menuListContext.useMenuListContext_unstable)((context)=>context.hasIcons);
    const hasCheckmarks = (0, _menuListContext.useMenuListContext_unstable)((context)=>context.hasCheckmarks);
    const isSplitItemTrigger = (0, _menuSplitGroupContext.useIsInMenuSplitGroup)() && hasSubmenu;
    return {
        hasIcons: hasIcons && !isSplitItemTrigger,
        hasCheckmarks: hasCheckmarks && !isSplitItemTrigger
    };
};
const getValidateNestingComponentName = (role)=>{
    switch(role){
        case 'menuitemcheckbox':
            return 'MenuItemCheckbox';
        case 'menuitemradio':
            return 'MenuItemRadio';
    }
    return 'MenuItem';
};