import { __assign, __rest } from "tslib";
import React, { useContext } from 'react';
import classNames from 'classnames';
import { ConfigContext } from '../config-provider/config-context';
import { getPrefixCls } from '../_utils/general';
import { MenuContext } from './menu-context';
import { SubMenuContext } from './sub-menu-context';
var MenuItemGroup = function (props) {
    var index = props.index, title = props.title, className = props.className, style = props.style, children = props.children, customisedCls = props.prefixCls, otherProps = __rest(props, ["index", "title", "className", "style", "children", "prefixCls"]);
    var configContext = useContext(ConfigContext);
    var inlineIndent = useContext(MenuContext).inlineIndent;
    var _a = useContext(SubMenuContext).level, level = _a === void 0 ? 1 : _a;
    var prefixCls = getPrefixCls('menu-item-group', configContext.prefixCls, customisedCls);
    var cls = classNames(prefixCls, className);
    return (React.createElement("li", __assign({}, otherProps, { key: title, className: cls, style: style }),
        React.createElement("div", { className: prefixCls + "__title", style: {
                paddingLeft: inlineIndent * level - inlineIndent / 2,
            } }, title),
        React.createElement("ul", { className: prefixCls + "__list" }, React.Children.map(children, function (child, idx) {
            var childElement = child;
            if (childElement.type.displayName === 'MenuItem') {
                var childProps = {
                    index: index + "-" + idx,
                };
                return React.cloneElement(childElement, childProps);
            }
            else {
                console.warn('Menu has a child that is not a MenuItem component.');
                return null;
            }
        }))));
};
MenuItemGroup.displayName = 'MenuItemGroup';
export default MenuItemGroup;
//# sourceMappingURL=menu-item-group.js.map