/**
 * @license MIT
 * author: Cube Dev Team
 * @cube-dev/ui-kit v0.0.0-canary-032998c
 * Released under the MIT license.
 */

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useMenuSection } from 'react-aria';
import { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider.js';
import { MenuItem } from './MenuItem.js';
import { StyledMenu, StyledSection, StyledSectionHeading } from './styled.js';
/** @private */
export function MenuSection(props) {
    const { item, state, styles, itemStyles, headingStyles, size } = props;
    const heading = item.rendered;
    const { itemProps, headingProps, groupProps } = useMenuSection({
        heading,
        'aria-label': item['aria-label'],
    });
    return (_jsx(_Fragment, { children: _jsxs(StyledSection, { ...itemProps, styles: styles, children: [heading && (_jsx(StyledSectionHeading, { ...headingProps, size: size, styles: headingStyles, children: heading })), _jsx(StyledMenu, { ...groupProps, mods: { section: true }, children: [...item.childNodes].map((node) => {
                        let menuItem = (_jsx(MenuItem, { item: node, styles: itemStyles, state: state, size: size, onAction: node.onAction }, node.key));
                        // Apply tooltip wrapper if tooltip property is provided
                        if (node.props.tooltip) {
                            const tooltipProps = typeof node.props.tooltip === 'string'
                                ? { title: node.props.tooltip }
                                : node.props.tooltip;
                            menuItem = (_jsx(TooltipProvider, { activeWrap: true, placement: "right", ...tooltipProps, children: menuItem }, node.key));
                        }
                        if (node.props.wrapper) {
                            menuItem = node.props.wrapper(menuItem);
                        }
                        return menuItem;
                    }) })] }) }));
}

        