Skip to content

[Popover] function for slotProps.paper isn't working #42310

@jedwards1211

Description

@jedwards1211

Steps to reproduce

Link to live example: (required)

Steps:

  1. Click the "Open Popovers" button
  2. Popovers should appear above and below the button
  3. Note that the popover above (which uses object slotProps.paper) has a red background
  4. Note that the popover above (which uses function slotProps.paper) has a white background

Current behavior

The popover passed a function for slotProps.paper doesn't have the same appearance as the one with an object for slotProps.paper

Expected behavior

Both popovers have the same background color from slotProps.paper

Context

I was trying to accommodate these changes in MUI in material-ui-popup-state, and a user reported this issue: jcoreio/material-ui-popup-state#134

Your environment

npx @mui/envinfo
  Browser: Chrome 124.0.6367.207
  System:
    OS: macOS 14.4.1
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm
    pnpm: 8.11.0 - ~/.nvm/versions/node/v20.10.0/bin/pnpm
  Browsers:
    Chrome: 124.0.6367.209
    Edge: Not Found
    Safari: 17.4.1
  npmPackages:
    @emotion/react: ^11.10.5 => 11.10.5 
    @emotion/styled: ^11.10.5 => 11.10.5 
    @mui/icons-material: ^5.10.16 => 5.10.16 
    @mui/material: ^5.15.18 => 5.15.18 
    @mui/styles: 5.15.14 => 5.15.14 
    @mui/types: ^7.2.2 => 7.2.2 
    @types/react: ^18.0.26 => 18.0.26 
    react: ^18.2.0 => 18.2.0 
    react-dom: ^18.2.0 => 18.2.0 
    typescript: ^5.1.0 => 5.4.2 

Search keywords: popover,slot-props

Metadata

Metadata

Assignees

Labels

component: PopoverThe React component.ready to takeHelp wanted. Guidance available. There is a high chance the change will be acceptedtype: bugIt doesn't behave as expected.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions