feat(OverflowMenu): add menuOptionsClass to overflowMenu (#2174)

* feat: add menuOptionsClass to overflowMenu * refactor: use the destructured prop
carbon-design-system · Apr 10, 2019 · 3f7e44e · 3f7e44e
1 parent e769f33
commit 3f7e44e
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/src/components/OverflowMenu/OverflowMenu-test.js b/src/components/OverflowMenu/OverflowMenu-test.js
@@ -110,7 +110,7 @@ describe('OverflowMenu', () => {
 
     it('should render a ul with the appropriate class', () => {
       const rootWrapper = mount(
-        <OverflowMenu>
+        <OverflowMenu menuOptionsClass="extra-menu-class">
           <div className="test-child" />
           <div className="test-child" />
         </OverflowMenu>
@@ -124,6 +124,7 @@ describe('OverflowMenu', () => {
       const list = rootWrapper.find('ul');
       expect(list.length).toEqual(1);
       expect(list.hasClass('bx--overflow-menu-options')).toEqual(true);
+      expect(list.hasClass('extra-menu-class')).toEqual(true);
     });
 
     it('should render children as expected', () => {

diff --git a/src/components/OverflowMenu/OverflowMenu.js b/src/components/OverflowMenu/OverflowMenu.js
@@ -296,6 +296,11 @@ class OverflowMenu extends Component {
      */
     onClose: PropTypes.func,
 
+    /**
+     * The class to apply to the menu options
+     */
+    menuOptionsClass: PropTypes.string,
+
     /**
      * Function called when menu is closed
      */
@@ -577,6 +582,7 @@ class OverflowMenu extends Component {
       onOpen, // eslint-disable-line
       renderIcon: IconElement,
       innerRef: ref,
+      menuOptionsClass,
       ...other
     } = this.props;
     const floatingMenu = !!breakingChangesX || origFloatingMenu;
@@ -613,6 +619,7 @@ class OverflowMenu extends Component {
     );
 
     const overflowMenuOptionsClasses = classNames(
+      menuOptionsClass,
       `${prefix}--overflow-menu-options`,
       {
         [`${prefix}--overflow-menu--flip`]: this.props.flipped,