import React, { useRef } from 'react';
import classNames from 'classnames';
import { Menu as RcMenu } from '../components';
import { isValidElement } from '../utils/ReactNodeValidate';
import MenuContext from './MenuContext';
import omit from '../components/rc-util/omit';
import Icon from '../icon';
var RcSubMenu = RcMenu.SubMenu;
var DownLine = Icon.DownLine;
export var SubMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
  var renderTitle = function renderTitle(inlineCollapsed) {
    var icon = props.icon,
        title = props.title,
        level = props.level,
        rootPrefixCls = props.rootPrefixCls;

    if (!icon) {
      return inlineCollapsed && level === 1 && title && typeof title === 'string' ? /*#__PURE__*/React.createElement("div", {
        className: "".concat(rootPrefixCls, "-inline-collapsed-noicon")
      }, title.charAt(0)) : /*#__PURE__*/React.createElement(React.Fragment, null, title, /*#__PURE__*/React.createElement(DownLine, {
        className: "".concat(rootPrefixCls, "-submenu-arrowicon")
      }));
    }

    var titleIsSpan = isValidElement(title) && title.type === 'span';
    return /*#__PURE__*/React.createElement(React.Fragment, null, icon, titleIsSpan ? title : /*#__PURE__*/React.createElement("span", null, title), /*#__PURE__*/React.createElement(DownLine, {
      className: "".concat(rootPrefixCls, "-submenu-arrowicon")
    }));
  };

  var subMenuRef = ref || useRef(null);
  var rootPrefixCls = props.rootPrefixCls,
      popupClassName = props.popupClassName;
  return /*#__PURE__*/React.createElement(MenuContext.Consumer, null, function (_ref) {
    var kleinMenuTheme = _ref.kleinMenuTheme,
        inlineCollapsed = _ref.inlineCollapsed;
    return /*#__PURE__*/React.createElement(RcSubMenu, Object.assign({
      ref: subMenuRef
    }, omit(props, ['icon']), {
      title: renderTitle(inlineCollapsed),
      popupClassName: classNames(rootPrefixCls, "".concat(rootPrefixCls, "-").concat(kleinMenuTheme), popupClassName)
    }));
  });
});