mui / material-ui

Materialย UI: Ready-to-use foundational React components, free forever. It includes Material UI, which implements Google's Material Design.
https://mui.com/material-ui/
MIT License
92.44k stars 31.85k forks source link

[Menu][material] using `slots` and `slotProps` overrides defaults completely #37612

Closed DiegoAndai closed 11 months ago

DiegoAndai commented 1 year ago

Duplicates

Latest version

Steps to reproduce ๐Ÿ•น

Link to live example: https://codesandbox.io/s/menu-paper-slot-replaces-default-cwtyk7?file=/src/App.tsx

Steps:

  1. Use the Menu component
  2. Provide slots and/or slotProps prop

Current behavior ๐Ÿ˜ฏ

The slots and/or slotProps provided are passed to the Popover component, and override the ones provided in the Menu component even when a slot is not being passed.

In the example, only the root slot is provided but the paper slot is overridden, so MenuPaper is not used.

Expected behavior ๐Ÿค”

The slots and slotProps should be merged so they're not overridden if not intended.

Context ๐Ÿ”ฆ

The slots and slotProps are new Popover props introduced in https://github.com/mui/material-ui/pull/37390. the Popover props are also available from the Menu component. As they're used in the Menu component, they should be fully supported and merged with the external ones.

Your environment ๐ŸŒŽ

npx @mui/envinfo ``` (Issue reproducible across browsers) System: OS: macOS 13.3.1 Binaries: Node: 16.20.0 - ~/.nvm/versions/node/v16.20.0/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v16.20.0/bin/yarn npm: 9.6.7 - ~/.nvm/versions/node/v16.20.0/bin/npm Browsers: Chrome: 114.0.5735.133 Edge: Not Found Firefox: 114.0.1 Safari: 16.4 npmPackages: @emotion/react: ^11.11.0 => 11.11.0 @emotion/styled: ^11.11.0 => 11.11.0 @mui/base: 5.0.0-beta.4 @mui/codemod: 5.13.3 @mui/core-downloads-tracker: 5.13.4 @mui/docs: 5.12.4 @mui/envinfo: 2.0.8 @mui/icons-material: 5.11.16 @mui/internal-waterfall: 1.0.0 @mui/joy: 5.0.0-alpha.84 @mui/lab: 5.0.0-alpha.134 @mui/markdown: 5.0.0 @mui/material: 5.13.5 @mui/material-next: 6.0.0-alpha.89 @mui/private-theming: 5.13.1 @mui/styled-engine: 5.13.2 @mui/styled-engine-sc: 5.12.0 @mui/styles: 5.13.2 @mui/system: 5.13.5 @mui/types: 7.2.4 @mui/utils: 5.13.1 @mui/x-data-grid: 6.4.0 @mui/x-data-grid-generator: 6.4.0 @mui/x-data-grid-premium: 6.4.0 @mui/x-data-grid-pro: 6.4.0 @mui/x-date-pickers: 6.4.0 @mui/x-date-pickers-pro: 6.4.0 @mui/x-license-pro: 6.0.4 @types/react: ^18.2.7 => 18.2.5 react: ^18.2.0 => 18.2.0 react-dom: ^18.2.0 => 18.2.0 styled-components: 5.3.10 typescript: ^4.9.5 => 4.9.5 ```
gitstart commented 1 year ago

@DiegoAndai I would like to pick this up

DiegoAndai commented 1 year ago

@gitstart hey! sure, let me know if you need any help with it

DiegoAndai commented 1 year ago

Hey @gitstart, have you been able to work on this? ๐Ÿ˜Š

gitstart commented 1 year ago

Currently on it @DiegoAndai, thanks for checking in.