[material-ui][Drawer] Issues when opening a Drawer within a list item about material-ui

[DiegoAndai]

Hey, @ElliPetsava, thanks for the report!

A minimal reproduction test case with the latest version would help a lot. A live example would be perfect. This codesandbox.io template may be a good starting point. Thank you!

[ElliPetsava]

Hey, @ElliPetsava, thanks for the report!

A minimal reproduction test case with the latest version would help a lot. A live example would be perfect. This codesandbox.io template may be a good starting point. Thank you!

In our app we have implemented a side menu similar to the documentation example of 'Mini variant drawer'.
[https://mui.com/material-ui/react-drawer/#mini-variant-drawer]

I want to toggle the drawer by clicking on it, instead of a hamburger button.
ie. I click on the mini drawer (outside of a button) and it opens. I click on the expanded drawer and it returns to the minimized drawer state.

Is there a way to implement this?
I will try to build an example of my implementation.
I am also attaching some screenshots of the drawer and where I placed the event inside of the drawer

[DiegoAndai]

I think you can achieve what you're looking for by stopping propagation on the list item button components, for example:

<ListItemButton
    onClick={(event) => event.stopPropagation()}
/>

Here's a working example: https://stackblitz.com/edit/react-wiyrro?file=Demo.tsx

[ElliPetsava]

Thank you for the help.