Skip to main content

Select

The Select component provides the user with a list of options to select from. Only one option is chosen.

The Select component is used independently or as a form component within a Form Block.

Properties

NameTypeDefaultDescription
namestringSpecifies the name of the component (form component only).
valueanySpecifies a value for the component.
labelnodeSpecifies a label for the component.
disabledboolfalseIf true, the select component is disabled.
menuItemcomponentDefines a menu item in the select list.

Style Attributes

NameTypeDefaultDescription
variantfilled
outlined
standard
string
outlinedDefines the display type of the component.
sizesmall
medium
string
mediumDefines the size of the component.
autoWidthboolfalseIf enabled, the width of the popover will automatically be set based on the size of the items in the menu.

Subcomponents

The Select component uses a Menu Item subcomponent to create the options list.

The Menu Item component creates a menu item either manually or dynamically.

Properties

NameTypeDefaultDescription
valueanySpecifies the value of the component.
labelnodeSpecifies a label for the component.
loopDataarrayDefines an array of options in the format id, label, value. The id must be is small letters.
itemNamestringDefines a unique identifier name for each menu item.

For more detail on the Select component, see the MUI developer docs.