Skip to content

[select] does not accept slotProp: **placement** #547

@maaaaaaaaaaaaaaaax

Description

@maaaaaaaaaaaaaaaax

Steps to reproduce

Link to live example: https://stackblitz.com/edit/react-fpjpbc?file=Demo.tsx

import * as React from 'react';
import {
  Select as BaseSelect,
  SelectProps,
  selectClasses,
  SelectRootSlotProps,
} from '@mui/base/Select';
import { Option as BaseOption, optionClasses } from '@mui/base/Option';
import { styled } from '@mui/system';
import UnfoldMoreRoundedIcon from '@mui/icons-material/UnfoldMoreRounded';

/* … */

Steps:

  1. Run the demo

Current behavior

After passing slotProps={{ popup: { placement: 'top' } }} to the select component, the placement of the popup cannot be modified.

Expected behavior

One should expect the popup to spawn in the given direction.

Context

As I do have another bug with the implementation of my modified select component, where I cannot retrieve the placement of the popup using the const popupContext = useContext(PopupContext); I do want to limit the opening behaviour to only open towards the bottom, in order to always apply correct styling.

Your environment

npx @mui/envinfo
  System:
    OS: macOS 14.6.1
  Binaries:
    Node: 21.6.1 - ~/.nvm/versions/node/v21.6.1/bin/node
    npm: 10.2.4 - ~/.nvm/versions/node/v21.6.1/bin/npm
    pnpm: Not Found
  Browsers:
    Chrome: 127.0.6533.120
    Edge: Not Found
    Safari: 17.6
  npmPackages:
    @emotion/react: ^11.11.1 => 11.11.4
    @emotion/styled: ^11.11.0 => 11.11.5
    @mui/base: 5.0.0-beta.40 => 5.0.0-beta.40
    @mui/core-downloads-tracker:  5.16.7
    @mui/icons-material: 5.16.6 => 5.16.6
    @mui/material: 5.16.6 => 5.16.6
    @mui/private-theming:  5.16.6
    @mui/styled-engine:  5.16.6
    @mui/styles: 5.16.6 => 5.16.6
    @mui/system: 5.16.6 => 5.16.6
    @mui/types:  7.2.15
    @mui/utils: 5.16.6 => 5.16.6
    @types/react: ^18.2.20 => 18.3.3
    react: ^18.2.0 => 18.3.1
    react-dom: ^18.2.0 => 18.3.1
    typescript: ^5.0.0 => 5.5.3

Search keywords: Select, Popup

Metadata

Metadata

Assignees

Labels

component: selectChanges related to the select component.package: @mui/baseSpecific to @mui/base (legacy).

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions