"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));

var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _AngleLeft = _interopRequireDefault(require("@rsuite/icons/legacy/AngleLeft"));

var _AngleRight = _interopRequireDefault(require("@rsuite/icons/legacy/AngleRight"));

var _Collapse = _interopRequireDefault(require("../Animation/Collapse"));

var _DropdownMenuItem = _interopRequireDefault(require("./DropdownMenuItem"));

var _Ripple = _interopRequireDefault(require("../Ripple"));

var _utils = require("../utils");

var _useCustom2 = _interopRequireDefault(require("../utils/useCustom"));

function _templateObject6() {
  var data = (0, _taggedTemplateLiteralLoose2.default)(["collapsing"]);

  _templateObject6 = function _templateObject6() {
    return data;
  };

  return data;
}

function _templateObject5() {
  var data = (0, _taggedTemplateLiteralLoose2.default)(["collapse-in"]);

  _templateObject5 = function _templateObject5() {
    return data;
  };

  return data;
}

function _templateObject4() {
  var data = (0, _taggedTemplateLiteralLoose2.default)(["collapsing"]);

  _templateObject4 = function _templateObject4() {
    return data;
  };

  return data;
}

function _templateObject3() {
  var data = (0, _taggedTemplateLiteralLoose2.default)(["collapse-out"]);

  _templateObject3 = function _templateObject3() {
    return data;
  };

  return data;
}

function _templateObject2() {
  var data = (0, _taggedTemplateLiteralLoose2.default)(["toggle-icon"]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = (0, _taggedTemplateLiteralLoose2.default)(["toggle"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

var defaultProps = {
  openKeys: [],
  classPrefix: 'dropdown-menu'
};

var DropdownMenu = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
  var children = props.children,
      className = props.className,
      classPrefix = props.classPrefix,
      collapsible = props.collapsible,
      expanded = props.expanded,
      activeKey = props.activeKey,
      openKeys = props.openKeys,
      onSelect = props.onSelect,
      onToggle = props.onToggle,
      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["children", "className", "classPrefix", "collapsible", "expanded", "activeKey", "openKeys", "onSelect", "onToggle"]);

  var _useClassNames = (0, _utils.useClassNames)(classPrefix),
      withClassPrefix = _useClassNames.withClassPrefix,
      merge = _useClassNames.merge,
      prefix = _useClassNames.prefix;

  var _useCustom = (0, _useCustom2.default)('DropdownMenu'),
      rtl = _useCustom.rtl;

  var handleToggleChange = (0, _react.useCallback)(function (eventKey, event) {
    onToggle === null || onToggle === void 0 ? void 0 : onToggle(eventKey, event);
  }, [onToggle]);
  var isActive = (0, _react.useCallback)(function (props) {
    if (props.active || typeof activeKey !== 'undefined' && (0, _utils.shallowEqual)(props.eventKey, activeKey)) {
      return true;
    }

    if (_utils.ReactChildren.some(props.children, function (child) {
      return isActive(child.props);
    })) {
      return true;
    }

    return props.active;
  }, [activeKey]);

  var getMenuItemsAndStatus = function getMenuItemsAndStatus(children) {
    var hasActiveItem;

    var items = _react.default.Children.map(children, function (item, index) {
      var _item$type;

      if (!item) {
        return null;
      }

      var displayName = item === null || item === void 0 ? void 0 : (_item$type = item.type) === null || _item$type === void 0 ? void 0 : _item$type.displayName;
      var active;

      if (displayName === 'DropdownMenuItem' || displayName === 'DropdownMenu') {
        active = isActive(item.props);

        if (active) {
          hasActiveItem = true;
        }
      }

      if (displayName === 'DropdownMenuItem') {
        var onItemSelect = item.props.onSelect;
        return /*#__PURE__*/_react.default.cloneElement(item, {
          key: index,
          active: active,
          onSelect: (0, _utils.createChainedFunction)(onSelect, onItemSelect)
        });
      } else if (displayName === 'DropdownMenu') {
        var itemsAndStatus = getMenuItemsAndStatus(item.props.children);
        var _item$props = item.props,
            icon = _item$props.icon,
            open = _item$props.open,
            trigger = _item$props.trigger,
            pullLeft = _item$props.pullLeft,
            _eventKey = _item$props.eventKey,
            title = _item$props.title,
            _className = _item$props.className;

        var _expanded = openKeys.some(function (key) {
          return (0, _utils.shallowEqual)(key, _eventKey);
        });

        var itemClassName = merge(_className, prefix("pull-" + (pullLeft ? 'left' : 'right'), {
          'item-focus': isActive(item.props)
        }));
        var Icon = pullLeft && !rtl || rtl && !pullLeft ? _AngleLeft.default : _AngleRight.default;
        return /*#__PURE__*/_react.default.createElement(_DropdownMenuItem.default, {
          icon: icon,
          open: open,
          trigger: trigger,
          expanded: _expanded,
          className: itemClassName,
          pullLeft: pullLeft,
          as: "div",
          submenu: true,
          role: null
        }, /*#__PURE__*/_react.default.createElement("div", {
          className: prefix(_templateObject()),
          onClick: function onClick(e) {
            return handleToggleChange(_eventKey, e);
          },
          role: "menu",
          tabIndex: -1
        }, /*#__PURE__*/_react.default.createElement("span", null, title), /*#__PURE__*/_react.default.createElement(Icon, {
          className: prefix(_templateObject2())
        }), /*#__PURE__*/_react.default.createElement(_Ripple.default, null)), renderCollapse(function (transitionProps, ref) {
          var _ref = transitionProps || {},
              className = _ref.className,
              transitionRestProps = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["className"]);

          return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, transitionRestProps, {
            ref: ref,
            role: "menu",
            className: merge(className, withClassPrefix())
          }), itemsAndStatus.items);
        }, _expanded));
      }

      return item;
    });

    return {
      items: items,
      active: hasActiveItem
    };
  };

  var renderCollapse = function renderCollapse(children, expanded) {
    return collapsible ? /*#__PURE__*/_react.default.createElement(_Collapse.default, {
      in: expanded,
      exitedClassName: prefix(_templateObject3()),
      exitingClassName: prefix(_templateObject4()),
      enteredClassName: prefix(_templateObject5()),
      enteringClassName: prefix(_templateObject6())
    }, children) : children();
  };

  var _getMenuItemsAndStatu = getMenuItemsAndStatus(children),
      items = _getMenuItemsAndStatu.items,
      active = _getMenuItemsAndStatu.active;

  var classes = merge(className, withClassPrefix({
    active: active
  }));
  return renderCollapse(function (transitionProps, transitionRef) {
    var _ref2 = transitionProps || {},
        transitionClassName = _ref2.className,
        transitionRestProps = (0, _objectWithoutPropertiesLoose2.default)(_ref2, ["className"]);

    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, rest, transitionRestProps, {
      className: (0, _classnames.default)(classes, transitionClassName),
      role: "menu",
      ref: (0, _utils.mergeRefs)(transitionRef, ref)
    }), items);
  }, expanded);
});

DropdownMenu.displayName = 'DropdownMenu';
DropdownMenu.defaultProps = defaultProps;
DropdownMenu.propTypes = {
  active: _propTypes.default.bool,
  activeKey: _propTypes.default.any,
  className: _propTypes.default.string,
  children: _propTypes.default.node,
  icon: _propTypes.default.any,
  classPrefix: _propTypes.default.string,
  pullLeft: _propTypes.default.bool,
  title: _propTypes.default.node,
  open: _propTypes.default.bool,
  trigger: _propTypes.default.oneOf(['click', 'hover']),
  eventKey: _propTypes.default.any,
  openKeys: _propTypes.default.array,
  expanded: _propTypes.default.bool,
  collapsible: _propTypes.default.bool,
  onSelect: _propTypes.default.func,
  onToggle: _propTypes.default.func
};
var _default = DropdownMenu;
exports.default = _default;