Skip to content

Commit 2b8bf41

Browse files
[Merge AFTER the August release(s)] chore: bump @progress/wct-a11y-spec from 2.17.0 to 2.18.0 in /src-a11y (#3160)
* chore: bump @progress/wct-a11y-spec from 2.17.0 to 2.18.0 in /src-a11y Bumps [@progress/wct-a11y-spec](https://github.com/telerik/web-components-ux) from 2.17.0 to 2.18.0. - [Commits](https://github.com/telerik/web-components-ux/commits) --- updated-dependencies: - dependency-name: "@progress/wct-a11y-spec" dependency-version: 2.18.0 dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <[email protected]> * docs: update accessibility and keyboard-nav specs --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: kendo-bot <[email protected]>
1 parent dc28d0f commit 2b8bf41

File tree

16 files changed

+2149
-1204
lines changed

16 files changed

+2149
-1204
lines changed

components/aiprompt/accessibility/wai-aria-support.md

Lines changed: 48 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -26,24 +26,46 @@ This section lists the selectors, attributes, and behavior patterns supported by
2626
### AI Prompt
2727

2828

29-
The AI Prompt component is a composite one and integrates the accessibility of the Toolbar, TextArea, Card List container
29+
The AI Prompt component is a composite one and integrates the accessibility of the Toolbar, TextArea, Card, Chip and FloatingActionButton.
3030

3131
### TextArea Component
3232

3333
[TextArea accessibility specification]({{textarea_a11y_link}})
3434

35-
### Prompt Suggestion Component
35+
### TextArea Adornments
3636

37+
| Selector | Attribute | Usage |
38+
| -------- | --------- | ----- |
39+
| `.k-textarea-prefix>.k-button` | `role=button` or `nodeName=button` | The buttons must have appropriate role. |
40+
| | `aria-label` or `title` | The buttons must be properly labelled. |
41+
| `.k-textarea-suffix>.k-button` | `role=button` or `nodeName=button` | The buttons must have appropriate role. |
42+
| | `aria-label` or `title` | The buttons must be properly labelled. |
43+
| `.k-textarea-suffix>.k-prompt-send.k-disabled` | `aria-disabled=true` | Announces send action as disabled if necessary. |
44+
45+
### Suggestion Component
3746

38-
The Prompt suggestion list implements roving tabindex navigation. Meaning that only one suggestion has tabindex=0. The display of the suggestion list is controlled by the expand button.
47+
48+
The Suggestion list implements roving tabindex navigation. Meaning that only one suggestion has tabindex=0. The display of the suggestion list is controlled by the expand button.
3949

4050
| Selector | Attribute | Usage |
4151
| -------- | --------- | ----- |
4252
| `.k-prompt-expander .k-button` | `aria-controls=.k-prompt-expander-content id` | Points to the controlled element based on the given `id`. |
4353
| | `aria-expanded=true/false` | Indicates the expanded state of the prompt expander content. |
44-
| `.k-prompt-expander .k-prompt-expander-content` | `role=list` | Indicates that the suggestion container element is a list. |
45-
| `.k-prompt-expander .k-prompt-suggestion` | `role=listitem` | Indicates that the suggestion element is a listitem. |
46-
| | `tabindex=0/-1` | The element should be focusable. |
54+
| `.k-prompt-expander .k-suggestion-group` | `role=group` | Indicates that the suggestion container element is a group. |
55+
| `.k-prompt-expander .k-suggestion` | `role=button` | Indicates that the suggestion element is a button. |
56+
| | `aria-label` or `title` | The suggestion elements must be properly labelled. |
57+
| | `tabindex=0` | The suggestion element should be focusable. |
58+
59+
### Button Component
60+
61+
[Button accessibility specification]({{button_a11y_link}})
62+
63+
### Adaptive Mode
64+
65+
66+
When the AI Prompt component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
67+
68+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
4769

4870
### Toolbar Component
4971

@@ -57,6 +79,26 @@ The Prompt suggestion list implements roving tabindex navigation. Meaning that o
5779

5880
[Card accessibility specification]({{card_a11y_link}})
5981

82+
### Chip Component
83+
84+
[Chip accessibility specification]({{chip_a11y_link}})
85+
86+
### ChipList Component
87+
88+
[ChipList accessibility specification]({{chiplist_a11y_link}})
89+
90+
### ContextMenu Component
91+
92+
[ContextMenu accessibility specification]({{contextmenu_a11y_link}})
93+
94+
### FloatingActionButton Component
95+
96+
[FloatingActionButton accessibility specification]({{floatingactionbutton_a11y_link}})
97+
98+
### SpeechToTextButton Component
99+
100+
[SpeechToTextButton accessibility specification]({{speechtotextbutton_a11y_link}})
101+
60102
### More Actions View - PanelBar Component
61103

62104
[PanelBar accessibility specification]({{panelbar_a11y_link}})

components/autocomplete/accessibility/wai-aria-support.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,7 @@ The popup element of the AutoComplete has to implement the WAI-ARIA specificatio
5454
| -------- | --------- | ----- |
5555
| `.k-animation-container` | `role=region` | When the component container is appended to the `<body>` element of the document, it requires you to assing a `landmark` role to it. Otherwise, append it to an element with an appropriate `landmark` role. |
5656
| | `aria-label` or `aria-labelledby` | When the container has a `region` role assigned, povides a label. |
57+
| `.k-list .k-no-data` | `aria-live=polite` | Identifies the element as a live region in the `polite` state, meaning assistive technology users are informed about changes to the region at the next available opportunity. |
5758
| `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
5859
| | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
5960
| `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
@@ -64,6 +65,13 @@ The popup element of the AutoComplete has to implement the WAI-ARIA specificatio
6465
| | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
6566
| `.k-list-group-item>.k-list-item-text` | `id` | The `k-list-item-text` elements of the `k-list-group-item` must have an id specified. The `aria-labelledby` attribute of the list items in the group must point to that id. |
6667

68+
### Adaptive Mode
69+
70+
71+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
72+
73+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
74+
6775
## Resources
6876

6977
[WAI-ARIA Authoring Practices: Editable Combobox With Both List and Inline Autocomplete Example](https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-autocomplete-both.html)

components/colorpicker/accessibility/wai-aria-support.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,18 @@ The ColorPicker popup contains in itself ColorGradient, ColorPalette, a UI to sw
4848
| | `aria-label=undefined` | The ColorGradient element must have its `aria-label` attribute removed. |
4949
| | `tabindex=-1/undefined` | The ColorGradient must be removed from the page tab sequence. |
5050

51+
### Adaptive Mode
52+
53+
54+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
55+
56+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
57+
58+
| Selector | Attribute | Usage |
59+
| -------- | --------- | ----- |
60+
| `.k-colorgradient` | `role=none/undefined` | The ColorGradient element must have its role removed. |
61+
| | `aria-label=undefined` | The ColorGradient element must have its `aria-label` attribute removed. |
62+
5163
## Section 508
5264

5365

components/combobox/accessibility/wai-aria-support.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@ The popup element of the ComboBox has to implement the WAI-ARIA specification fo
5858
| -------- | --------- | ----- |
5959
| `.k-animation-container` | `role=region` | When the component container is appended to the `<body>` element of the document, it requires you to assing a `landmark` role to it. Otherwise, append it to an element with an appropriate `landmark` role. |
6060
| | `aria-label` or `aria-labelledby` | When the container has a `region` role assigned, povides a label. |
61+
| `.k-list .k-no-data` | `aria-live=polite` | Identifies the element as a live region in the `polite` state, meaning assistive technology users are informed about changes to the region at the next available opportunity. |
6162
| `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
6263
| | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
6364
| `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
@@ -68,6 +69,13 @@ The popup element of the ComboBox has to implement the WAI-ARIA specification fo
6869
| | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
6970
| `.k-list-group-item>.k-list-item-text` | `id` | The `k-list-item-text` elements of the `k-list-group-item` must have an id specified. The `aria-labelledby` attribute of the list items in the group must point to that id. |
7071

72+
### Adaptive Mode
73+
74+
75+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
76+
77+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
78+
7179
## Resources
7280

7381
[WAI-ARIA Authoring Practices: Editable Combobox With Both List and Inline Autocomplete Example](https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-autocomplete-both.html)

components/datepicker/accessibility/wai-aria-support.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,13 @@ The Calendar in the Popup element of the component should implement the specific
5151

5252
[Calendar accessibility specification]({{calendar_a11y_link}})
5353

54+
### Adaptive Mode
55+
56+
57+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
58+
59+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
60+
5461
## Resources
5562

5663
[WAI ARIA specification for combobox](https://www.w3.org/TR/wai-aria-1.2/#combobox)

components/daterangepicker/accessibility/wai-aria-support.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,13 @@ The Calendars in the Popup element of the component should implement the specifi
4747

4848
[Calendar accessibility specification]({{calendar_a11y_link}})
4949

50+
### Adaptive Mode
51+
52+
53+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
54+
55+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
56+
5057
## Resources
5158

5259
[WAI ARIA specification for combobox](https://www.w3.org/TR/wai-aria-1.2/#combobox)

components/datetimepicker/accessibility/wai-aria-support.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,13 @@ Time Popup implementation should follow the specification for the TimePicker com
6565

6666
[TimePicker accessibility specification]({{timepicker_a11y_link}})
6767

68+
### Adaptive Mode
69+
70+
71+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
72+
73+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
74+
6875
## Resources
6976

7077
[WAI ARIA specification for combobox](https://www.w3.org/TR/wai-aria-1.2/#combobox)

components/dropdownlist/accessibility/wai-aria-support.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,7 @@ The listbox placed in the popup element of the DropDownList has to implement the
7070
| -------- | --------- | ----- |
7171
| `.k-animation-container` | `role=region` | When the component container is appended to the `<body>` element of the document, it requires you to assing a `landmark` role to it. Otherwise, append it to an element with an appropriate `landmark` role. |
7272
| | `aria-label` or `aria-labelledby` | When the container has a `region` role assigned, povides a label. |
73+
| `.k-list .k-no-data` | `aria-live=polite` | Identifies the element as a live region in the `polite` state, meaning assistive technology users are informed about changes to the region at the next available opportunity. |
7374
| `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
7475
| | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
7576
| `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
@@ -80,6 +81,13 @@ The listbox placed in the popup element of the DropDownList has to implement the
8081
| | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
8182
| `.k-list-group-item>.k-list-item-text` | `id` | The `k-list-item-text` elements of the `k-list-group-item` must have an id specified. The `aria-labelledby` attribute of the list items in the group must point to that id. |
8283

84+
### Adaptive Mode
85+
86+
87+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
88+
89+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
90+
8391
## Resources
8492

8593
[WAI-ARIA Authoring Practices: Select-Only Combobox Example](https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-select-only.html)

components/grid/accessibility/wai-aria-support.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,15 @@ Implements the ColumnMenu specification.
138138
| `.k-grid-header-wrap .k-grid-header-table .k-table-row` | `role=presentation/none` | When there are locked columns, the rows from the non-locked header table should have their default semantic role removed, as their children are owned by the corresponding row from the locked table. |
139139
| `.k-grid-content .k-grid-table .k-table-row` | `role=presentation/none` | When there are locked columns, the rows from the non-locked content table should have their default semantic role removed, as their children are owned by the corresponding row from the locked table. |
140140

141+
#### Grid popup editor
142+
143+
144+
The popup editor consists of a Window component containing a Form component.
145+
146+
[Window accessibility specification]({{window_a11y_link}})
147+
148+
[Form accessibility specification]({{form_a11y_link}})
149+
141150
#### Grid footer
142151

143152

@@ -167,6 +176,15 @@ The selection aggregates are placed within a `.k-grid-selection-aggregates` elem
167176
| -------- | --------- | ----- |
168177
| `.k-grid-selection-aggregates` | `aria-live=polite` | Ensures that changes in the calculated selection aggregates are announced by assistive technologies. |
169178

179+
### Data Grid Stacked Layout
180+
181+
182+
The element is a regular Grid cell (td element) that holds a stacked layout content representing all available column headers and content for the given row. All internal "stacked cell" elements become focusable when focus is moved within the cell.
183+
184+
| Selector | Attribute | Usage |
185+
| -------- | --------- | ----- |
186+
| `.k-grid-stack-cell` | `tabindex=0` | "Stacked cell" elements receive tabindex '0' when focus is within their parent '.k-grid-stack-row' element. This allows the end user to navigate through the content using Tab. The tabindex attribute is removed when focus leaves the '.k-grid-stack-row' element. |
187+
170188
## Resources
171189

172190
[WAI-ARIA specification for grid](https://www.w3.org/TR/wai-aria-1.2/#grid)

components/multiselect/accessibility/wai-aria-support.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,7 @@ The popup element of the MultiSelect must implement the WAI-ARIA specification f
6060
| -------- | --------- | ----- |
6161
| `.k-animation-container` | `role=region` | When the component container is appended to the `<body>` element of the document, it requires you to assing a `landmark` role to it. Otherwise, append it to an element with an appropriate `landmark` role. |
6262
| | `aria-label` or `aria-labelledby` | When the container has a `region` role assigned, povides a label. |
63+
| `.k-list .k-no-data` | `aria-live=polite` | Identifies the element as a live region in the `polite` state, meaning assistive technology users are informed about changes to the region at the next available opportunity. |
6364
| `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
6465
| | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
6566
| `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
@@ -70,6 +71,13 @@ The popup element of the MultiSelect must implement the WAI-ARIA specification f
7071
| | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
7172
| `.k-list-group-item>.k-list-item-text` | `id` | The `k-list-item-text` elements of the `k-list-group-item` must have an id specified. The `aria-labelledby` attribute of the list items in the group must point to that id. |
7273

74+
### Adaptive Mode
75+
76+
77+
When the component is in adaptive mode, the popup element follows the specifications of the ActionSheet component.
78+
79+
[ActionSheet accessibility specification]({{actionsheet_a11y_link}})
80+
7381
## Resources
7482

7583
[WAI-ARIA Authoring Practices: Select-Only Combobox Example](https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-select-only.html)

0 commit comments

Comments
 (0)