Unstyled React Select components and hook

useOption API

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

Name	Type	Description
getRootProps	<Other extends EventHandlers>(otherHandlers?: Other) => UseOptionRootSlotProps<Other>
highlighted	boolean
index	number
ref	React.RefCallback<HTMLElement>
selected	boolean

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

Name	Type	Description

Name	Type	Description
buttonActive	boolean	If `true`, the trigger button is active (pressed).
buttonFocusVisible	boolean	If `true`, the trigger button has a visible focus.
contextValue	SelectProviderValue<Value>	A value to be passed to the `SelectProvider` component.
disabled	boolean	If `true`, the select is disabled.
dispatch	(action: ListAction<Value> \| SelectAction) => void	Action dispatcher for the select component. Allows to programmatically control the select.
getButtonProps	<OtherHandlers extends EventHandlers = {}>(otherHandlers?: OtherHandlers) => UseSelectButtonSlotProps<OtherHandlers>	Resolver for the button slot's props.
getListboxProps	<OtherHandlers extends EventHandlers = {}>(otherHandlers?: OtherHandlers) => UseSelectListboxSlotProps<OtherHandlers>	Resolver for the listbox slot's props.
getOptionMetadata	(optionValue: Value) => SelectOption<Value> \| undefined	A function that returns the metadata of an option with a given value.
highlightedOption	Value \| null	The value of the highlighted option.
open	boolean	If `true`, the listbox is open.
options	Value[]	Values of all the registered options.
value	SelectValue<Value, Multiple>	The value of the selected option(s).