diff --git a/packages/mui-material/src/Menu/Menu.d.ts b/packages/mui-material/src/Menu/Menu.d.ts index b06f442674a3e3..16e78dd1cd12e3 100644 --- a/packages/mui-material/src/Menu/Menu.d.ts +++ b/packages/mui-material/src/Menu/Menu.d.ts @@ -1,16 +1,14 @@ import * as React from 'react'; import { SxProps } from '@mui/system'; -import { MenuOwnerState, SlotComponentProps } from '@mui/base'; import { InternalStandardProps as StandardProps } from '..'; -import Paper, { PaperProps } from '../Paper'; +import { PaperProps } from '../Paper'; import { PopoverProps } from '../Popover'; import { MenuListProps } from '../MenuList'; import { Theme } from '../styles'; import { TransitionProps } from '../transitions/transition'; import { MenuClasses } from './menuClasses'; -export interface MenuProps - extends StandardProps, 'children'> { +export interface MenuProps extends StandardProps { /** * An HTML element, or a function that returns one. * It's used to set the position of the menu. @@ -60,25 +58,6 @@ export interface MenuProps * `classes` prop applied to the [`Popover`](/material-ui/api/popover/) element. */ PopoverClasses?: PopoverProps['classes']; - /** - * The components used for each slot inside. - * - * @default {} - */ - slots?: { - root?: React.ElementType; - paper?: React.ElementType; - }; - /** - * The extra props for the slot components. - * You can override the existing props or add new ones. - * - * @default {} - */ - slotProps?: { - root?: SlotComponentProps; - paper?: SlotComponentProps; - }; /** * The system prop that allows defining system overrides as well as additional CSS styles. */ diff --git a/packages/mui-material/src/Select/Select.spec.tsx b/packages/mui-material/src/Select/Select.spec.tsx index c745a4b631ce46..25283d8a874054 100644 --- a/packages/mui-material/src/Select/Select.spec.tsx +++ b/packages/mui-material/src/Select/Select.spec.tsx @@ -58,4 +58,21 @@ function genericValueTest() { }, }, }); + + // tests deep slot prop forwarding up to the modal backdrop + ', () => { expect(paper.style).to.have.property('minWidth', `${selectButton.clientWidth}px`); }); + + // https://github.com/mui/material-ui/issues/38949 + it('should forward `slotProps` to menu', function test() { + const { getByTestId } = render( + , + ); + + const backdrop = getByTestId('backdrop'); + + expect(backdrop.style).to.have.property('backgroundColor', 'red'); + }); }); describe('prop: SelectDisplayProps', () => { diff --git a/packages/mui-material/src/Select/SelectInput.js b/packages/mui-material/src/Select/SelectInput.js index 90e5d4f25668a5..ec020a5a9e099c 100644 --- a/packages/mui-material/src/Select/SelectInput.js +++ b/packages/mui-material/src/Select/SelectInput.js @@ -554,6 +554,7 @@ const SelectInput = React.forwardRef(function SelectInput(props, ref) { ...MenuProps.MenuListProps, }} slotProps={{ + ...MenuProps.slotProps, paper: { ...paperProps, style: {