List organizes list items, grouped items, and their actions.
Overview
Lists can group List Items with List Groups, and leverage slots to include actionable or supplemental elements, such as Actions and Icons. Lists and List Items can support selection workflows using selection and accommodate filtering with filter.
Additional functionality, such as sorting or removing items in a list will be added in the near future. In the meantime, use the deprecated Value List.
Usage
- Format a series of line items
- Grouping line items
Sample
Accessibility
Keyboard navigation
| Key | Function |
|---|---|
Arrow down | Navigates to the next calcite-list-item. |
Arrow up | Navigates to the previous calcite-list-item. |
Home | Navigates to the first calcite-list-item. |
End | Navigates to the last calcite-list-item. |
Tab | Navigates to the next calcite-list-item child calcite-action. If the currently focused calcite-action is the last item, the focus will leave the component. |
Tab and Shift | Navigates to the next calcite-list-item child calcite-action. If the currently focused calcite-action is the last item, the focus will leave the component. |