MenuLabel can react to isOpen state

src/components/Menu/Menu.js

@@ -98,7 +98,10 @@ class Menu extends Component {
       if (child.type === MenuLabel) {
         // MenuLabel needs toggleOpen function
         // We pass that directly  so that component user doesn't need to worry about that
-        return React.cloneElement(child, { onToggleActive: this.toggleOpen });
+        return React.cloneElement(child, {
+          isOpen: this.state.isOpen,
+          onToggleActive: this.toggleOpen,
+        });
       } else if (child.type === MenuContent) {
         // MenuContent needs some styling data (width, arrowPosition, and isOpen info)
         // We pass those directly so that component user doesn't need to worry about those.

src/components/MenuLabel/MenuLabel.css

@@ -16,3 +16,6 @@
     outline: none;
   }
 }
+
+/* Default isOpen class - no styles yet */
+.isOpen {}

src/components/MenuLabel/MenuLabel.js

@@ -35,11 +35,13 @@ class MenuLabel extends Component {
   }
 
   render() {
-    const { children, className, rootClassName } = this.props;
+    const { children, className, rootClassName, isOpen, isOpenClassName } = this.props;
 
     const rootClass = rootClassName || css.root;
+    const isOpenClass = isOpenClassName || css.isOpen;
     const classes = classNames(rootClass, className, {
       [css.clickedWithMouse]: this.state.clickedWithMouse,
+      [isOpenClass]: isOpen,
     });
 
     return (
@@ -58,11 +60,13 @@ MenuLabel.defaultProps = {
   rootClassName: '',
 };
 
-const { func, node, string } = PropTypes;
+const { bool, func, node, string } = PropTypes;
 
 MenuLabel.propTypes = {
   children: node.isRequired,
   className: string,
+  isOpenClassName: string,
+  isOpen: bool,
   onToggleActive: func,
   rootClassName: string,
 };