MultiSelectUnstyled API

API documentation for the React MultiSelectUnstyled component. Learn about the available props and the CSS API.

Import

import MultiSelectUnstyled from '@mui/base/MultiSelectUnstyled';
// or
import { MultiSelectUnstyled } from '@mui/base';

The foundation for building custom-styled multi-selection select components.

Props of the native component are also available.

Name	Type	Default	Description
autoFocus	bool	false	If `true`, the select element is focused during the first mount
component	elementType		The component used for the root node. Either a string to use a HTML element or a component.
components	{ Listbox?: elementType, Popper?: elementType, Root?: elementType }	{}	The components used for each slot inside the Select. Either a string to use a HTML element or a component.
componentsProps	{ listbox?: func \| object, popper?: func \| object, root?: func \| object }	{}	The props used for each slot inside the Input.
defaultListboxOpen	bool	false	If `true`, the select will be initially open.
defaultValue	array	[]	The default selected values. Use when the component is not controlled.
disabled	bool	false	If `true`, the select is disabled.
listboxId	string		`id` attribute of the listbox element. Also used to derive the `id` attributes of options.
listboxOpen	bool	undefined	Controls the open state of the select's listbox.
onChange	func		Callback fired when an option is selected.
onListboxOpenChange	func		Callback fired when the component requests to be opened. Use in controlled mode (see listboxOpen).
renderValue	func		Function that customizes the rendering of the selected values.
value	array		The selected values. Set to an empty array to deselect all options.

The ref is forwarded to the root element.