fix(Menu): allow maxMenuHeight with Scrollabe (#6608)

* fix(Menu): allow maxMenuHeight with Scrollabe * stop setting heights to 'auto'
patternfly · Nov 15, 2021 · 8c1f12c · 8c1f12c
1 parent 77f7603
commit 8c1f12c
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 8 deletions.
diff --git a/packages/react-core/src/components/Menu/Menu.tsx b/packages/react-core/src/components/Menu/Menu.tsx
@@ -262,8 +262,7 @@ class MenuBase extends React.Component<MenuProps, MenuState> {
           onGetMenuHeight,
           flyoutRef: this.state.flyoutRef,
           setFlyoutRef: flyoutRef => this.setState({ flyoutRef }),
-          disableHover: this.state.disableHover,
-          isScrollable
+          disableHover: this.state.disableHover
         }}
       >
         {isRootMenu && (

diff --git a/packages/react-core/src/components/Menu/MenuContent.tsx b/packages/react-core/src/components/Menu/MenuContent.tsx
@@ -28,15 +28,15 @@ export const MenuContent = React.forwardRef((props: MenuContentProps, ref: React
   };
   return (
     <MenuContext.Consumer>
-      {({ menuId, onGetMenuHeight, isScrollable }) => (
+      {({ menuId, onGetMenuHeight }) => (
         <div
           {...rest}
           className={css(styles.menuContent, props.className)}
           ref={el => refCallback(el, menuId, onGetMenuHeight)}
           style={
             {
-              '--pf-c-menu__content--Height': menuHeight || 'auto',
-              '--pf-c-menu__content--MaxHeight': !isScrollable ? maxMenuHeight || 'auto' : ''
+              ...(menuHeight && { '--pf-c-menu__content--Height': menuHeight }),
+              ...(maxMenuHeight && { '--pf-c-menu__content--MaxHeight': maxMenuHeight })
             } as React.CSSProperties
           }
         >

diff --git a/packages/react-core/src/components/Menu/MenuContext.ts b/packages/react-core/src/components/Menu/MenuContext.ts
@@ -15,7 +15,6 @@ export const MenuContext = React.createContext<{
   flyoutRef?: React.Ref<HTMLLIElement>;
   setFlyoutRef?: (ref: React.Ref<HTMLLIElement>) => void;
   disableHover?: boolean;
-  isScrollable?: boolean;
 }>({
   menuId: null,
   parentMenu: null,
@@ -30,8 +29,7 @@ export const MenuContext = React.createContext<{
   onGetMenuHeight: () => null,
   flyoutRef: null,
   setFlyoutRef: () => null,
-  disableHover: false,
-  isScrollable: false
+  disableHover: false
 });
 
 export const MenuItemContext = React.createContext<{