Keyboard Navigation
The keyboard navigation of the Grid can be enabled using the navigatable prop of the Grid.
The Grid supports the following keyboard shortcuts:
| SHORTCUT | DESCRIPTION |
|---|---|
Arrow keys | Navigates through the cells of the Grid |
Enter | Will perform different actions based on the current cell. For example, it will sort a sortable column, expand/collapse a parent item, or if focusable nested component is available it will exit navigation and focus it. |
Esc | Will return to the Grid navigation if the user is currently inside editor or filter component navigation. For example, when inside a NumericTextBox editor, pressing Arrow up will increase the value, but pressing Esc will return to the cell level navigation and allow the end-user to move across the cells. |
Example
View Source
Change Theme:
