mui-nested-menu icon indicating copy to clipboard operation
mui-nested-menu copied to clipboard

Styling the menu via mui's "MenuProps" breaks the menu's hover

Open Andrii-Vovk opened this issue 1 year ago • 0 comments

After changing the <NestedMenuItem /> height, it no longer closes on mouse leave.

Example code:

  <NestedMenuItem
    key={item.label}
    leftIcon={icon}
    className={twMerge(
      '[&>div>p]:text-[13px] [&>div>p]:font-medium [&>div>p]:pl-3',
      className,
    )}
    label={label}
    parentMenuOpen={open}
    data-testid={`nested-menu-item-${index}`}
    MenuProps={{
      style: {
        maxHeight: 'auto',
      },
      PaperProps: {
        style: {
          maxHeight: '100%',
          height: '300px',
        },
      },
    }}
  >
    {renderMenuItems(nested, open, handleMenuClose)}
  </NestedMenuItem>

Andrii-Vovk avatar Oct 13 '23 13:10 Andrii-Vovk