@progress/wct-a11y-spec
Version:
Contains accessibility and keyboard navigation specification of Telerik and Kendo web components.
22 lines (16 loc) • 1.59 kB
Markdown
## Managing the Focus
The navigation will be enabled by a `Navigable` parameter, like the Grid. When `Navigable` is true, all tiles will have a tabindex of `0`, and can be accessed through the reglar `Tab` key navigation.
## Keyboard Shortcuts
| Shortcut | Behavior |
| -------- | -------- |
| `Tab` | Move focus to the next tile. If focus is on the last tile, focus the next focusable element on the page. |
| `Shift + Tab` | Move focus to the previous tile. If focus is on the first tile, focus the previous focusable element before the TileLayout. |
| `Enter` | Focuses the first focusable element within the tile. Focus is trapped and wrapped within the tile content and follows its natural Tab sequence. |
| `Escape` | Moves focus back to the TileLayout item wrapper when it is on a focusable element within the tile content. |
| `Shift + Right Arrow` | Reorders the focused tile with the next one (if such exists). |
| `Shift + Left Arrow` | Reorders the focused tile with the previous one (if such exists). |
| `Ctrl/Cmd(Mac) + Right Arrow` | Increments the focused tile width with one column (to a maximum of the preset columns count). |
| `Ctrl/Cmd(Mac) + Left Arrow` | Decrements the focused tile width with one column (to a minimum of 1). |
| `Ctrl/Cmd(Mac) + Down Arrow` | Increments the focused item height with one row (to a maximum of the preset rows count if such option exists). |
| `Ctrl/Cmd(Mac) + Up Arrow` | Decrements the focused item height with one row (to a minimum of 1). |
> Prevent the default browser behavior when using the Cmd + ArrowKey shortcuts for macOS.