chore: refactor/remove mixin

src/Menu.jsx

@@ -2,14 +2,15 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import createReactClass from 'create-react-class';
 import { Provider, create } from 'mini-store';
-import { default as MenuMixin, getActiveKey } from './MenuMixin';
+import { default as SubPopupMenu, getActiveKey } from './SubPopupMenu';
 import { noop } from './util';
 
 const Menu = createReactClass({
   displayName: 'Menu',
 
   propTypes: {
     defaultSelectedKeys: PropTypes.arrayOf(PropTypes.string),
+    defaultActiveFirst: PropTypes.bool,
     selectedKeys: PropTypes.arrayOf(PropTypes.string),
     defaultOpenKeys: PropTypes.arrayOf(PropTypes.string),
     openKeys: PropTypes.arrayOf(PropTypes.string),
@@ -29,10 +30,12 @@ const Menu = createReactClass({
     selectable: PropTypes.bool,
     multiple: PropTypes.bool,
     children: PropTypes.any,
+    className: PropTypes.string,
+    style: PropTypes.object,
+    activeKey: PropTypes.string,
+    prefixCls: PropTypes.string,
   },
 
-  mixins: [MenuMixin],
-
   isRootMenu: true,
 
   getDefaultProps() {
@@ -47,6 +50,10 @@ const Menu = createReactClass({
       subMenuOpenDelay: 0.1,
       subMenuCloseDelay: 0.1,
       triggerSubMenuAction: 'hover',
+      prefixCls: 'rc-menu',
+      className: '',
+      mode: 'vertical',
+      style: {},
     };
   },
 
@@ -110,6 +117,13 @@ const Menu = createReactClass({
     this.props.onClick(e);
   },
 
+  // onKeyDown needs to be exposed as a instance method
+  // e.g., in rc-select, we need to navigate menu item while
+  // current active item is rc-select input box rather than the menu itself
+  onKeyDown(e, callback) {
+    this.innerMenu.getWrappedInstance().onKeyDown(e, callback);
+  },
+
   onOpenChange(event) {
     const props = this.props;
     const openKeys = this.store.getState().openKeys.concat();
@@ -175,27 +189,21 @@ const Menu = createReactClass({
     return transitionName;
   },
 
-  renderMenuItem(c, i, subMenuKey) {
-    /* istanbul ignore if */
-    if (!c) {
-      return null;
-    }
-    const state = this.store.getState();
-    const extraProps = {
-      openKeys: state.openKeys,
-      selectedKeys: state.selectedKeys,
-      triggerSubMenuAction: this.props.triggerSubMenuAction,
-      subMenuKey,
-    };
-    return this.renderCommonMenuItem(c, i, extraProps);
-  },
-
   render() {
-    const props = { ...this.props };
+    let { children, ...props } = this.props;
     props.className += ` ${props.prefixCls}-root`;
+    props = {
+      ...props,
+      onClick: this.onClick,
+      onOpenChange: this.onOpenChange,
+      onDeselect: this.onDeselect,
+      onSelect: this.onSelect,
+      openTransitionName: this.getOpenTransitionName(),
+      parentMenu: this,
+    }
     return (
       <Provider store={this.store}>
-        {this.renderRoot(props)}
+        <SubPopupMenu {...props} ref={c => this.innerMenu = c}>{children}</SubPopupMenu>
       </Provider>
     );
   },