Skip to content

Commit b9cf233

Browse files
chore: bump @progress/wct-a11y-spec from 2.13.0 to 2.14.0 in /src-a11y (#2301)
* chore: bump @progress/wct-a11y-spec from 2.13.0 to 2.14.0 in /src-a11y Bumps [@progress/wct-a11y-spec](https://github.com/telerik/web-components-ux) from 2.13.0 to 2.14.0. - [Commits](https://github.com/telerik/web-components-ux/commits) --- updated-dependencies: - dependency-name: "@progress/wct-a11y-spec" dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com> * docs: update accessibility and keyboard-nav specs --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: kendo-bot <kendouiteam@progress.com>
1 parent a9f15b7 commit b9cf233

File tree

18 files changed

+42
-19
lines changed

18 files changed

+42
-19
lines changed

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

+2
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,8 @@ This section lists the selectors, attributes, and behavior patterns supported by
2727
| -------- | --------- | ----- |
2828
| `.k-checkbox` | `role=checkbox` or `type=checkbox` | Announces the `checkbox` role of the element. |
2929
| | `label for` or `aria-label` or `aria-labelledby` | The input requires an accessible name to which it will be assigned. |
30+
| | `aria-required=true` | The attribute is rendered only when the CheckBox is in a `form` HTML element and announces the required state of the component. |
31+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the checkbox, or if the value of the checkbox is invalid, to the error message. This attribute should only be present when a hint is set or when the checkbox value is invalid. |
3032
| | `aria-checked=true` or `checked=checked` | Announces the checked state of the CheckBox. |
3133
| | `disabled=disabled` or `aria-disabled=true` | The attribute is rendered only when the CheckBox is disabled. |
3234
| `.k-invalid,.ng-invalid` | `aria-invalid=true` | The attribute is rendered only when the CheckBox is in a `form` HTML element and announces the invalid state of the component. |

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

+3
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,9 @@ This section lists the selectors, attributes, and behavior patterns supported by
2727
| -------- | --------- | ----- |
2828
| `.k-input-inner` | `role=textbox` or `nodeName=input` | The element should either be an `<input type="text">` element or should have `role="textbox"` assigned. |
2929
| | `label for` or `aria-label` or `aria-labelledby` | The input needs an accessible name to be assigned to it. |
30+
| | `aria-required=true` | The attribute is rendered only when the DateInput is in a `form` HTML element and announces the required state of the component. |
31+
| | `aria-invalid=true` | Attribute is rendered only when the DateInput is in form and announces the valid state of the component. |
32+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3033
| | `readonly=readonly` or `aria-readonly=true` | Attribute is rendered only when the DateInput is readonly. |
3134
| | `tabindex=0` | The element should be focusable. |
3235
| `.k-disabled .k-input-inner` | `disabled=disabled` or `aria-disabled=true` | Attribute is rendered only when the DateInput is disabled. |

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

+3-1
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,14 @@ This section lists the selectors, attributes, and behavior patterns supported by
2929
| -------- | --------- | ----- |
3030
| `.k-input-inner` | `role=combobox` | The input element should follow the `combobox` specification. |
3131
| | `label for` or `aria-label` or `aria-labelledby` | The input needs an accessible name to be assigned to it. |
32+
| | `aria-required=true` | The attribute is rendered only when the DatePicker is in a `form` HTML element and announces the required state of the component. |
3233
| | `aria-haspopup=grid` | Indicates the component has a Calendar Popup that implements `role="grid"`. |
3334
| | `aria-expanded=true/false` | Announces whether the Popup is visible or not. |
3435
| | `aria-controls=.k-animation-container id` | Points to the popup element. Signifies that the `combobox` element controls the Calendar `grid`. |
3536
| | `aria-activedescendant=.k-calendar-td.k-focus id` | Points to the focused item (date/month/year) in the Calendar Popup. Should only be present when the Popup is open. |
37+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3638
| | `readonly=readonly` or `aria-readonly=true` | Attribute is rendered only when the DatePicker is readonly. |
37-
| | `aria-invalid=true` | Attribute is rendered only when the combobox is in form and announces the valid state of the component. |
39+
| | `aria-invalid=true` | Attribute is rendered only when the DatePicker is in form and announces the valid state of the component. |
3840
| | `tabindex=0` | The element must be focusable. |
3941
| `.k-disabled .k-input-inner` | `disabled=disabled` or `aria-disabled=true` | Attribute is rendered only when the DatePicker is disabled. |
4042
| `.k-input-button` | `role=button` or `nodeName=button` | The element should either be a `<button>` element or should have `role="button"` assigned. |

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

+2
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,8 @@ This section lists the selectors, attributes, and behavior patterns supported by
2929
| -------- | --------- | ----- |
3030
| `.k-input-inner` | `role=combobox` | The input element should follow the `combobox` specification. |
3131
| | `label for` or `aria-label` or `aria-labelledby` | The input needs an accessible name to be assigned to it. |
32+
| | `aria-required=true` | The attribute is rendered only when the DateRangePicker is in a `form` HTML element and announces the required state of the component. |
33+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3234
| | `aria-haspopup=grid` | Indicates the component has a Calendar Popup that implements `role="grid"`. |
3335
| | `aria-expanded=true/false` | Announces whether the Popup is visible or not. |
3436
| | `aria-controls=.k-calendar-container id` | Points to the popup element. Signifies that the `combobox` element controls the Calendar `grid`. |

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

+3-1
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,14 @@ This section lists the selectors, attributes, and behavior patterns supported by
2929
| -------- | --------- | ----- |
3030
| `.k-input-inner` | `role=combobox` | The input element should follow the `combobox` specification. |
3131
| | `label for` or `aria-label` or `aria-labelledby` | The input needs an accessible name to be assigned to it. |
32+
| | `aria-required=true` | The attribute is rendered only when the DateTimePicker is in a `form` HTML element and announces the required state of the component. |
33+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3234
| | `aria-haspopup=dialog` | Indicates the component has a Dialog Popup. |
3335
| | `aria-expanded=true/false` | Announces whether the Popup is visible or not. |
3436
| | `aria-controls=.k-calendar-container id` | Points to the popup element. Signifies that the `combobox` element controls the Calendar `grid`. |
3537
| | `aria-activedescendant=.k-calendar-td.k-focus id` | Points to the focused item (date/month/year/hour/minute) in the Calendar Popup or the Time Popup. Should only be present when the Popup is open. |
3638
| | `readonly=readonly` or `aria-readonly=true` | Attribute is rendered only when the DateTimePicker is readonly. |
37-
| | `aria-invalid=true` | Attribute is rendered only when the combobox is in form and announces the valid state of the component. |
39+
| | `aria-invalid=true` | Attribute is rendered only when the DateTimePicker is in form and announces the valid state of the component. |
3840
| | `tabindex=0` | The element should be focusable. |
3941
| `.k-disabled .k-input-inner` | `disabled=disabled` or `aria-disabled=true` | Attribute is rendered only when the DateTimePicker is disabled. |
4042
| `.k-input-button` | `role=button` or `nodeName=button` | The element should either be a `<button>` element or should have `role="button"` assigned. |

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

+2
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,8 @@ The following table summarizes the selectors and attributes supported by the `in
3232
| -------- | --------- | ----- |
3333
| `.k-input-inner` | `role=textbox` or `nodeName=input` | Specifies the role of the component. Not required if the `<input type=text`> configuration is used. |
3434
| | `label for` or `aria-label` or `aria-labelledby` | The input requires an accessible name that will be assigned to it. |
35+
| | `aria-required=true` | The attribute is rendered only when the MaskedTextBox is in a `form` HTML element and announces the required state of the component. |
36+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3537
| | `aria-placeholder` | Announces the mask or placeolder for the component. |
3638
| `.k-invalid .k-input-inner,.ng-invalid .k-input-inner` | `aria-invalid=true` | The attribute is rendered only when the MaskedTextBox is in a form and announces the valid state of the component. |
3739
| `.k-disabled .k-input-inner` | `disabled=disabled` or `aria-disabled=true` | The attribute is rendered only when the MaskedTextBox is disabled. |

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

+2
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,8 @@ This section lists the selectors, attributes, and behavior patterns supported by
2727
| -------- | --------- | ----- |
2828
| `.k-input-inner` | `role=spinbutton` | Announces the spin button capabilities of the NumericTextBox. |
2929
| | `label for` or `aria-label` or `aria-labelledby` | The input requires an accessible name that will be assigned to it. |
30+
| | `aria-required=true` | The attribute is rendered only when the NumericTextBox is in a `form` HTML element and announces the required state of the component. |
31+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3032
| | `aria-valuemnow` | Announces the value for the component. |
3133
| | `aria-valuemin` | Announces the minimum value allowed for the component. |
3234
| | `aria-valuemax` | Announces the maximum value allowed for the component. |

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

-1
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,6 @@ The `Page` select, which is present for mobile devices and smaller screens with
3939
| `.k-pager-nav` | `role=button` or `nodeName=button` | Specifies the role of the element. |
4040
| | `aria-disabled=true` | The attribute is present when the the `Arrow` button is disabled, for example, present on the **Previous** button when the current page is the first one. |
4141
| | `title` | Specifies the purpose of each button. |
42-
| `.k-pager-numbers>.k-link` | `role=button` or `nodeName=button` | Specifies the role of the element. |
4342
| | `aria-label` or `title` | Specifies the purpose of each link, for example, `Page 6`. |
4443
| | `aria-current=page` | The attribute must be present on the currently selected page element. |
4544
| `.k-pager-sizes>.k-dropdownlist` | `aria-label` | The element requires an `aria-label` to specify its purpose. |

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

+6-6
Original file line numberDiff line numberDiff line change
@@ -13,18 +13,18 @@ position: 50
1313

1414

1515

16-
Out of the box, the Telerik UI for Blazor PDFViewer provides extensive accessibility support and enables users with disabilities to acquire complete control over its features.
16+
Out of the box, the Telerik UI for Blazor PDF Viewer provides extensive accessibility support and enables users with disabilities to acquire complete control over its features.
1717

1818

19-
The PDFViewer is compliant with the [Web Content Accessibility Guidelines (WCAG) 2.2 AA](https://www.w3.org/TR/WCAG22/) standards and [Section 508](https://www.section508.gov/) requirements, follows the [Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA)](https://www.w3.org/WAI/ARIA/apg/) best practices for implementing the [keyboard navigation](#keyboard-navigation) for its `component` role, provides options for managing its focus and is tested against the most popular screen readers.
19+
The PDF Viewer is compliant with the [Web Content Accessibility Guidelines (WCAG) 2.2 AA](https://www.w3.org/TR/WCAG22/) standards and [Section 508](https://www.section508.gov/) requirements, follows the [Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA)](https://www.w3.org/WAI/ARIA/apg/) best practices for implementing the [keyboard navigation](#keyboard-navigation) for its `component` role, provides options for managing its focus and is tested against the most popular screen readers.
2020

2121
## WAI-ARIA
2222

2323

2424
This section lists the selectors, attributes, and behavior patterns supported by the component and its composite elements, if any.
2525

2626

27-
The PDFViewer component contains two inner elements - a toolbar and a page container.
27+
The PDF Viewer component contains two inner elements - a toolbar and a page container.
2828

2929
[ToolBar accessibility specification]({{toolbar_a11y_link}})
3030

@@ -40,19 +40,19 @@ The PDFViewer component contains two inner elements - a toolbar and a page conta
4040
## Section 508
4141

4242

43-
The PDFViewer is fully compliant with the [Section 508 requirements](http://www.section508.gov/).
43+
The PDF Viewer is fully compliant with the [Section 508 requirements](http://www.section508.gov/).
4444

4545
## Testing
4646

4747

48-
The PDFViewer has been extensively tested automatically with [axe-core](https://github.com/dequelabs/axe-core) and manually with the most popular screen readers.
48+
The PDF Viewer has been extensively tested automatically with [axe-core](https://github.com/dequelabs/axe-core) and manually with the most popular screen readers.
4949

5050
> To report any accessibility issues, contact the team through the [Telerik Support System](https://www.telerik.com/account/support-center).
5151
5252
### Screen Readers
5353

5454

55-
The PDFViewer has been tested with the following screen readers and browsers combinations:
55+
The PDF Viewer has been tested with the following screen readers and browsers combinations:
5656

5757
| Environment | Tool |
5858
| ----------- | ---- |

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

+4-4
Original file line numberDiff line numberDiff line change
@@ -43,10 +43,10 @@ This section lists the selectors, attributes, and behavior patterns supported by
4343
4444
### Slider Buttons
4545

46-
47-
When present, the Slider Buttons must implement the specification for the **Button** component.
48-
49-
[Button accessibility specification]({{button_a11y_link}})
46+
| Selector | Attribute | Usage |
47+
| -------- | --------- | ----- |
48+
| `.k-slider .k-button-decrease, .k-slider .k-button-increase` | `aria-hidden=true` | Hides the decrease/increase button elements and all their children from assistive technologies. |
49+
| | `tabindex=-1` | Excludes the decorative decrease/increase buttons from the natural tab order of the page. |
5050

5151
## Resources
5252

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

+1
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ This section lists the selectors, attributes, and behavior patterns supported by
3838
| `.k-splitbar` | `role=separator` | Sets the proper role for the Splitter split-bar element. |
3939
| | `aria-label` | An accessible name, with aria-label should be included if there is more than one focusable separator. The value is set through the corresponding SplitterPane API. |
4040
| `.k-splitbar-horizontal` | `aria-orientation=vertical` | When a splitbar separates two panes horizontally, its aria-orientation must be explicitly set to 'vertical'. |
41+
| | `aria-keyshortcuts=ArrowLeft ArrowRight ArrowUp ArrowDown` | Sets the aria-keyshortcuts attribute value to announce available keyboard shortcuts. Some are omitted for brevity. |
4142

4243
> Note: Setting the value-now attribute of the separator element is not applicable, as the Splitter is a complex layout component allowing splitting the content into multiple panes across any number and level of nested Splitters and panes, thus announcing a value would not convey any meaningful information. Moreover, there is no specification, or WAI-ARIA recommendation that explains how value should be set in multiple panes scenario. Further information on this complicated scenario could be found in the following WAI-ARIA GitHub issue:
4344

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,8 @@ The Stepper component is a landmark `<nav>` element or an element with `role="na
3131
| `.k-stepper` | `role=navigation` or `nodeName=nav` | The landmark role `navigation` must be assigned to the component. |
3232
| `.k-step-disabled>.k-step-link` | `aria-disabled=true` | A disabled (inactive) link. |
3333
| `.k-step-current>.k-step-link` | `aria-current=step` | The currently selected link. |
34-
| `.k-step.k-focus .k-step-link` | `tabindex=0` | Add element to the page Tab sequence. Set based on the Roving tabindex navigation when the tab is focused. |
35-
| `.k-step:not(.k-focus) .k-step-link` | `tabindex=-1` | Removes the element from the page Tab sequence. Set based on the Roving tabindex navigation when a tab is not focused. |
34+
| `.k-step.k-focus .k-step-link` | `tabindex=0` | Adds an element to the page's tab order. Set based on the roving tabindex navigation when the tab is focused. |
35+
| `.k-step:not(.k-focus) .k-step-link` | `tabindex=-1` | Removes the element from the page's tab order. Set based on the roving tabindex navigation when a tab is not focused. |
3636

3737

3838
No aria attributes should be applied to the Stepper as the ProgressBar serves a purely aesthetic purpose.

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

+2
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,8 @@ This section lists the selectors, attributes, and behavior patterns supported by
2727
| -------- | --------- | ----- |
2828
| `.k-switch` | `role=switch` | Announces the switch role of the element. |
2929
| | `label for` or `aria-label` or `aria-labelledby` | The input requires an accessible name that will be assigned to it. |
30+
| | `aria-required=true` | The attribute is rendered only when the Switch is in a `form` HTML element and announces the required state of the component. |
31+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3032
| | `aria-checked` | Announces the checked state of the Switch. |
3133
| | `tabindex=0` | The element must be focusable. |
3234
| | `aria-invalid=true` | The attribute is rendered only when the Switch is in a form and announces the valid state of the component. |

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

+2
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,8 @@ This section lists the selectors, attributes, and behavior patterns supported by
2727
| -------- | --------- | ----- |
2828
| `.k-input-inner` | `role=textbox` or `nodeName=textarea` | Describes the role of the component. |
2929
| | `label for` or `aria-label` or `aria-labelledby` | The input requires an accessible name that will be assigned to it. |
30+
| | `aria-required=true` | The attribute is rendered only when the TextArea is in a `form` HTML element and announces the required state of the component. |
31+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3032
| | `aria-multiline=true` | Announces the multi-line behavior of the TextArea. |
3133
| | `aria-invalid=true` | The attribute is rendered only when the TextArea is in a form and announces the valid state of the component. |
3234
| `.k-disabled .k-input-inner` | `disabled=disabled` or `aria-disabled=true` | The attribute is rendered only when the TextArea is disabled. |

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

+2
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,8 @@ No role attribute is implemented as the `html input type="text"` element is suff
3030
| -------- | --------- | ----- |
3131
| `.k-input-inner` | `role=textbox` or `nodeName=input` | Describes the role of the component. |
3232
| | `label for` or `aria-label` or `aria-labelledby` | The input requires an accessible name that will be assigned to it. |
33+
| | `aria-required=true` | The attribute is rendered only when the TextBox is in a `form` HTML element and announces the required state of the component. |
34+
| | `aria-describedby=.k-form-hint id/.k-form-error id` | Points to the hint for the input, or if the input is invalid, to the error message. This attribute should only be present when a hint is set or when the input is invalid. |
3335
| | `aria-invalid=true` | The attribute is rendered only when the TextBox is in a form and announces the valid state of the component. |
3436
| `.k-disabled .k-input-inner` | `disabled=disabled` or `aria-disabled=true` | The attribute is rendered only when the TextBox is disabled. |
3537

0 commit comments

Comments
 (0)