Menu component: Dense prop doesn't change padding

The documentation explains that a “dense” prop may be applied to the Menu component to reduce its padding. It appears to only change the size of the typography component inside it, but doesn’t change the height of the list item or any of its padding.

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

Add a dense prop to a MenuList and the typography component changes from body1 to body2.

Expected Behavior 🤔

Add a dense prop to MenuList and the padding should be reduced, as well as the overall height.

Steps to Reproduce 🕹

I’m only a designer, so I’m inspecting documentation in Chrome and playing with it in code sandbox.

Context 🔦

I want to provide perfect specs to my engineers, and I want to modify components, which requires a perfect understanding of how they’re set up.

Your Environment 🌎

Figma, Chrome.

`npx @mui/envinfo`

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

[brookssolveig]

Hey, I’m not a developer, but I’d still like to help you repro this.

1. First, note that the documentation states “you can use the dense prop to reduce the padding”.
2. Then, note that any menu with dense applied has the exact same padding as any menu without dense applied.
3. Note that dense only changes the size of the typography component.

I suggest either updating the documentation’s description to better describe what the prop will do or, better yet, change the behavior of the dense prop. I have an actual need of a smaller menu item, and I’m having to make my own.

[jatinsandilya]

@siriwatknp @danilo-leal I raised a PR for it. Tested it with generated packages locally as well as compared the Netlify builds. Is there something else that needs to be done to ensure no side effects occur?