Listbox
Allows selection of one or more items from a list of options. Read more.
Example 1: Manual Selection
ARROW keys move the active descendant. SPACEBAR key is required to manually change the selected state.
Unselected
Selected
Example 2: Automatic Selection
ARROW keys move the active descendant and automatically updated the selected state. This behaviour is similar to a radio button group.
Unselected
Selected
Example 3: Groups
Layouts
Responsive Columns (flat DOM)
Fixed Columns (nested DOM)
Updated: April 18th, 2025