docs: normalize keyboard interaction headers and add escape key (#15241)

Also normalized the sections a bit (titles, tenses, and usage of period).

Fixes #15165
This commit is contained in:
Lazar Ljubenović
2019-02-22 06:48:02 +01:00
committed by Jeremy Elbourn
parent 35982a50dc
commit fe2881de7d
6 changed files with 12 additions and 8 deletions
+1 -1
View File
@@ -54,7 +54,7 @@ resetting it will call `reset` on the underlying form control which clears the v
- <kbd>RIGHT_ARROW</kbd>: Focuses the next step header
- <kbd>ENTER</kbd>, <kbd>SPACE</kbd>: Selects the step that the focus is currently on
- <kbd>TAB</kbd>: Focuses the next tabbable element
- <kbd>TAB</kbd>+<kbd>SHIFT</kbd>: Focuses the previous tabbable element
- <kbd>SHIFT</kbd>+<kbd>TAB</kbd>: Focuses the previous tabbable element
### Accessibility
The CDK stepper is treated as a tabbed view for accessibility purposes, so it is given
+4 -3
View File
@@ -112,9 +112,10 @@ autocomplete is attached to using the `matAutocompleteOrigin` directive together
```
### Keyboard interaction
- <kbd>DOWN_ARROW</kbd>: Next option becomes active.
- <kbd>UP_ARROW</kbd>: Previous option becomes active.
- <kbd>ENTER</kbd>: Select currently active item.
- <kbd>DOWN_ARROW</kbd>: Next option becomes active
- <kbd>UP_ARROW</kbd>: Previous option becomes active
- <kbd>ENTER</kbd>: Selects currently active item
- <kbd>ESCAPE</kbd>: Closes the autocomplete panel
### Option groups
`mat-option` can be collected into groups using the `mat-optgroup` element:
+1 -1
View File
@@ -346,7 +346,7 @@ the native input and toggle button elements respectively, and they trigger a cal
should have a placeholder or be given a meaningful label via `aria-label`, `aria-labelledby` or
`MatDatepickerIntl`.
#### Keyboard shortcuts
#### Keyboard interaction
The datepicker supports the following keyboard shortcuts:
+2 -1
View File
@@ -137,8 +137,9 @@ with a different set of data, depending on the trigger that opened it:
- <kbd>DOWN_ARROW</kbd>: Focuses the next menu item
- <kbd>UP_ARROW</kbd>: Focuses previous menu item
- <kbd>RIGHT_ARROW</kbd>: Opens the menu item's sub-menu
- <kbd>LEFT_ARROW</kbd>: Closes the current menu, if it is a sub-menu.
- <kbd>LEFT_ARROW</kbd>: Closes the current menu, if it is a sub-menu
- <kbd>ENTER</kbd>: Activates the focused menu item
- <kbd>ESCAPE</kbd>: Closes the menu
### Accessibility
Menu triggers or menu items without text or labels should be given a meaningful label via
+3 -1
View File
@@ -234,9 +234,11 @@ The stepper can now show error states by simply providing the `showError` option
### Keyboard interaction
- <kbd>LEFT_ARROW</kbd>: Focuses the previous step header
- <kbd>RIGHT_ARROW</kbd>: Focuses the next step header
- <kbd>HOME</kbd>: Focuses the first step header
- <kbd>END</kbd>: Focuses the last step header
- <kbd>ENTER</kbd>, <kbd>SPACE</kbd>: Selects the step that the focus is currently on
- <kbd>TAB</kbd>: Focuses the next tabbable element
- <kbd>TAB</kbd>+<kbd>SHIFT</kbd>: Focuses the previous tabbable element
- <kbd>SHIFT</kbd>+<kbd>TAB</kbd>: Focuses the previous tabbable element
### Localizing labels
Labels used by the stepper are provided through `MatStepperIntl`. Localization of these messages
+1 -1
View File
@@ -126,7 +126,7 @@ Tabs without text or labels should be given a meaningful label via `aria-label`
`aria-labelledby`. For `MatTabNav`, the `<nav>` element should have a label as well.
#### Keyboard shortcuts
#### Keyboard interaction
| Shortcut | Action |
|----------------------|----------------------------|