Data Display
List
A list displays a collection of items and allows a user to select one or more of them.
One
Two
Three
Four
Five
Separators#
One
Two
Three
Four
Five
Sections#
Introduction
One
Two
Three
Summary
Four
Five
Single select#
One
Two
Three
Four
Five
Multiple select#
One
Two
Three
Four
Five
Preselected#
One
Two
Three
Four
Five
Component props#
List#
| Name | Type | Description |
|---|---|---|
| selectionMode | SelectionMode | "none" | "single" | "multiple" |
| selectedKeys | string[] | Controlled selected keys |
| defaultSelectedKeys | string[] | Default selected keys |
| onSelectionChange | (keys: Selection) => void | Called when selection changes |
ListItem#
| Name | Type | Description |
|---|---|---|
| id | string | Unique item identifier |
| textValue | string | Text value for accessibility |
| isDisabled | boolean | Disables the item |