docs: update accessibility and keyboard-nav specs

kendo-bot · kendo-bot · commit f1c79df8f907 · 2025-11-05T15:06:25.000Z
diff --git a/components/autocomplete/accessibility/wai-aria-support.md b/components/autocomplete/accessibility/wai-aria-support.md
@@ -58,8 +58,8 @@ The popup element of the AutoComplete has to implement the WAI-ARIA specificatio
 | `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
 |  | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
 | `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
-|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the `aria-owns` attribute of their group header elements (with `role=group`) point to that ids. |
-|  | `aria-describedby` | When grouped, the list items must have an `aria-describedby` attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
+|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the "aria-owns" attribute of their group header elements (with `role=group`) point to that ids. |
+|  | `aria-describedby` | When grouped, the list items must have an "aria-describedby" attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
 | `.k-list-item.k-selected` | `aria-selected=true` | Indicates the selected state of the item. |
 | `.k-list-group-item` | `role=group` | The group elements in the popup list must be have `role=group`. |
 |  | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
diff --git a/components/colorpicker/accessibility/wai-aria-support.md b/components/colorpicker/accessibility/wai-aria-support.md
@@ -58,7 +58,7 @@ When the component is in adaptive mode, the popup element follows the specificat
 | Selector | Attribute | Usage |
 | -------- | --------- | ----- |
 | `.k-colorgradient` | `role=none/undefined` | The ColorGradient element must have its role removed. |
-|  | `aria-label=undefined` | The ColorGradient element must have its `aria-label` attribute removed. |
+|  | `aria-label=undefined` | The ColorGradient element must have its "aria-label" attribute removed. |
 
 ## Section 508
 
diff --git a/components/combobox/accessibility/wai-aria-support.md b/components/combobox/accessibility/wai-aria-support.md
@@ -62,8 +62,8 @@ The popup element of the ComboBox has to implement the WAI-ARIA specification fo
 | `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
 |  | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
 | `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
-|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the `aria-owns` attribute of their group header elements (with `role=group`) point to that ids. |
-|  | `aria-describedby` | When grouped, the list items must have an `aria-describedby` attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
+|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the "aria-owns" attribute of their group header elements (with `role=group`) point to that ids. |
+|  | `aria-describedby` | When grouped, the list items must have an "aria-describedby" attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
 | `.k-list-item.k-selected` | `aria-selected=true` | Indicates the selected state of the item. |
 | `.k-list-group-item` | `role=group` | The group elements in the popup list must be have `role=group`. |
 |  | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
diff --git a/components/dialog/accessibility/wai-aria-support.md b/components/dialog/accessibility/wai-aria-support.md
@@ -40,7 +40,7 @@ This section lists the selectors, attributes, and behavior patterns supported by
 
 ## Resources
 
-[ARIA practices Modal Dialog Example](https://www.w3.org/WAI/ARIA/apg/example-index/dialog-modal/dialog)
+[ARIA practices Modal Dialog Example](https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/dialog/)
 
 ## Section 508
 
diff --git a/components/drawer/accessibility/wai-aria-support.md b/components/drawer/accessibility/wai-aria-support.md
@@ -31,7 +31,7 @@ The Drawer component allows rendering a whole template inside of it. Thus, the a
 | `.k-drawer ul` | `role=menubar` | Indicates that the list of drawer items is a menubar. |
 |  | `aria-orientation=vertical` | Indicates that the orientation of the drawer is vertical. |
 | `.k-drawer-item:not(.k-drawer-separator)` | `role=menuitem` | Indicates that the item of a drawer serves as a menuitem. |
-|  | `aria-label` | The drawer item requires an `aria-label` attribute when in mini mode and no content is rendered in the item. The `aria-label` points to the text field value of the item. |
+|  | `aria-label` | The drawer item requires an "aria-label" attribute when in mini mode and no content is rendered in the item. The "aria-label" points to the text field value of the item. |
 | `.k-drawer-item.k-drawer-separator` | `role=separator` | Indicates that the item of a drawer serves as a separator. |
 
 ## Section 508
diff --git a/components/dropdownlist/accessibility/wai-aria-support.md b/components/dropdownlist/accessibility/wai-aria-support.md
@@ -74,8 +74,8 @@ The listbox placed in the popup element of the DropDownList has to implement the
 | `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
 |  | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
 | `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
-|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the `aria-owns` attribute of their group header elements (with `role=group`) point to that ids. |
-|  | `aria-describedby` | When grouped, the list items must have an `aria-describedby` attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
+|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the "aria-owns" attribute of their group header elements (with `role=group`) point to that ids. |
+|  | `aria-describedby` | When grouped, the list items must have an "aria-describedby" attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
 | `.k-list-item.k-selected` | `aria-selected=true` | Indicates the selected state of the item. |
 | `.k-list-group-item` | `role=group` | The group elements in the popup list must be have `role=group`. |
 |  | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
diff --git a/components/flatcolorpicker/accessibility/wai-aria-support.md b/components/flatcolorpicker/accessibility/wai-aria-support.md
@@ -41,7 +41,7 @@ The FlatColorPicker contains in itself ColorGradient, ColorPalette, a UI to swit
 | Selector | Attribute | Usage |
 | -------- | --------- | ----- |
 | `.k-colorgradient` | `role=none/` | The ColorGradient element must have its role removed. |
-|  | `aria-label` | The ColorGradient element must have its `aria-label` attribute removed. |
+|  | `aria-label` | The ColorGradient element must have its "aria-label" attribute removed. |
 |  | `tabindex=-1/` | The ColorGradient must be removed from the page tab sequence. |
 
 ## Section 508
diff --git a/components/multiselect/accessibility/wai-aria-support.md b/components/multiselect/accessibility/wai-aria-support.md
@@ -64,8 +64,8 @@ The popup element of the MultiSelect must implement the WAI-ARIA specification f
 | `.k-list-ul` | `role=listbox` | Identifies the `ul` element as a listbox. |
 |  | `aria-label` or `aria-labelledby` | Provides a label for the listbox of the ComboBox. |
 | `.k-list-item` | `role=option` | Identifies the `li` element as a listbox option. |
-|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the `aria-owns` attribute of their group header elements (with `role=group`) point to that ids. |
-|  | `aria-describedby` | When grouped, the list items must have an `aria-describedby` attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
+|  | `id` | When grouped, the list items must have an `id` attribute specified, so that the "aria-owns" attribute of their group header elements (with `role=group`) point to that ids. |
+|  | `aria-describedby` | When grouped, the list items must have an "aria-describedby" attribute pointing to the id of the `k-list-item-text` element in their `k-list-group-item`. |
 | `.k-list-item.k-selected` | `aria-selected=true` | Indicates the selected state of the item. |
 | `.k-list-group-item` | `role=group` | The group elements in the popup list must be have `role=group`. |
 |  | `aria-owns` | The group elements in the popup list must own the list items belonging to their group. |
diff --git a/components/pager/accessibility/wai-aria-support.md b/components/pager/accessibility/wai-aria-support.md
@@ -41,9 +41,9 @@ The `Page` select, which is present for mobile devices and smaller screens with
 |  | `title` | Specifies the purpose of each button. |
 |  | `aria-label` or `title` | Specifies the purpose of each link, for example, `Page 6`. |
 |  | `aria-current=page` | The attribute must be present on the currently selected page element. |
-| `.k-pager-sizes>.k-dropdownlist` | `aria-label` | The element requires an `aria-label` to specify its purpose. |
-| `.k-pager-numbers-wrap>.k-dropdown` | `aria-label` | The element requires an `aria-label` to specify its purpose. |
-| `.k-pager-input>.k-input>.k-input-inner` | `aria-label` | The element requires an `aria-label` to specify its purpose. |
+| `.k-pager-sizes>.k-dropdownlist` | `aria-label` | The element requires an "aria-label" to specify its purpose. |
+| `.k-pager-numbers-wrap>.k-dropdown` | `aria-label` | The element requires an "aria-label" to specify its purpose. |
+| `.k-pager-input>.k-input>.k-input-inner` | `aria-label` | The element requires an "aria-label" to specify its purpose. |
 
 ## Resources
 
diff --git a/components/pivotgrid/accessibility/wai-aria-support.md b/components/pivotgrid/accessibility/wai-aria-support.md
@@ -47,8 +47,8 @@ The element with `role="grid"` - includes the row headers, column headers, and d
 | -------- | --------- | ----- |
 | `.k-pivotgrid-column-headers>.k-pivotgrid-table` | `role=presentation/none` | Negates the default semantic role of the `<table>` element. |
 | `.k-pivotgrid-empty-cell` | `role=columnheader` | Announces the empty cell role as a part of the programmatically constructed a11y tree. |
-|  | `aria-colspan` | Sets the correct aria-colspan corresponding to the number of columns in the row headers table. |
-|  | `aria-rowspan` | Sets the correct aria-rowspan corresponding to the number of rows in the column headers table. |
+|  | `aria-colspan` | Sets the correct "aria-colspan" corresponding to the number of columns in the row headers table. |
+|  | `aria-rowspan` | Sets the correct "aria-rowspan" corresponding to the number of rows in the column headers table. |
 |  | `id` | Sets an unique identifier for the cell to be referenced from the first row in the column header table `aria-owns` attribute. |
 | `.k-pivotgrid-empty-cell>.k-sr-only` | `undefined` | The empty cell should have a nested span.k-sr-only element containing the localizable text message that will be announced by screen readers when the empty cell is focused. |
 | `.k-pivotgrid-column-headers>.k-pivotgrid-table>tbody` | `role=rowgroup` | Required as the owner `<table>` element has its semantic role removed. |
diff --git a/components/progressbar/accessibility/wai-aria-support.md b/components/progressbar/accessibility/wai-aria-support.md
@@ -27,9 +27,9 @@ This section lists the selectors, attributes, and behavior patterns supported by
 | -------- | --------- | ----- |
 | `.k-progressbar` | `role=progressbar` | Sets the proper role for ProgressBar. |
 |  | `aria-label` or `aria-labelledby` | The Progressbar needs an accessible name to be assigned to it. |
-|  | `aria-valuenow` | Only present and required if the value is not indeterminate. Set to a decimal value between 0, or aria-valuemin if present, and aria-valuemax indicating the current value of the progress bar. |
-|  | `aria-valuemin` | Set to a decimal value representing the minimum value, and less than aria-valuemax. If not present, the default value is 0. |
-|  | `aria-valuemax` | Set to a decimal value representing the maximum value, and greater than aria-valuemin. If not present, the default value is 100. |
+|  | `aria-valuenow` | Only present and required if the value is not indeterminate. Set to a decimal value between 0, or "aria-valuemin" if present, and "aria-valuemax" indicating the current value of the progress bar. |
+|  | `aria-valuemin` | Set to a decimal value representing the minimum value, and less than "aria-valuemax". If not present, the default value is 0. |
+|  | `aria-valuemax` | Set to a decimal value representing the maximum value, and greater than "aria-valuemin". If not present, the default value is 100. |
 
 ## Resources
 
diff --git a/components/scheduler/accessibility/wai-aria-support.md b/components/scheduler/accessibility/wai-aria-support.md
@@ -47,7 +47,7 @@ Below are listed the requirements for those components part of the ToolBar.
 | -------- | --------- | ----- |
 | `.k-nav-prev,.k-nav-next` | `aria-label` | Required as those buttons contain only icon (no text). |
 | `.k-nav-current` | `aria-live=polite` | The new date of the Scheduler view will be announced upon navigation to new time span / view type. |
-| `.k-views-dropdown` | `aria-label` | Specifies the purpose of the element. The `<select>` element visible on the toolbar on small screens must have its `aria-label` set. |
+| `.k-views-dropdown` | `aria-label` | Specifies the purpose of the element. The `<select>` element visible on the toolbar on small screens must have its "aria-label" set. |
 
 
 Depending on the current view, The Scheduler component implements different roles. Below are described the three possible approaches:
diff --git a/components/splitter/accessibility/wai-aria-support.md b/components/splitter/accessibility/wai-aria-support.md
@@ -36,9 +36,9 @@ This section lists the selectors, attributes, and behavior patterns supported by
 | Selector | Attribute | Usage |
 | -------- | --------- | ----- |
 | `.k-splitbar` | `role=separator` | Sets the proper role for the Splitter split-bar element. |
-|  | `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. |
-| `.k-splitbar-horizontal` | `aria-orientation=vertical` | When a splitbar separates two panes horizontally, its aria-orientation must be explicitly set to 'vertical'. |
-|  | `aria-keyshortcuts=ArrowLeft ArrowRight ArrowUp ArrowDown` | Sets the aria-keyshortcuts attribute value to announce available keyboard shortcuts. Some are omitted for brevity. |
+|  | `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. |
+| `.k-splitbar-horizontal` | `aria-orientation=vertical` | When a splitbar separates two panes horizontally, its "aria-orientation" must be explicitly set to 'vertical'. |
+|  | `aria-keyshortcuts=ArrowLeft ArrowRight ArrowUp ArrowDown` | Sets the "aria-keyshortcuts" attribute value to announce available keyboard shortcuts. Some are omitted for brevity. |
 
 > Note: Setting the `value-now` attribute of the separator element is not applicable because it would not convey any meaningful information.  The Splitter is a complex layout component that lets you split the content into multiple panes across any number and level of nested Splitters and panes. Furthermore, no WAI-ARIA specifications or recommendations indicate how to set a value in a multiple panes scenario. If needed, developers can still apply attributes as they see fit, using the respective API options. Further information on this complicated scenario could be found in the following WAI-ARIA GitHub issue:
 
diff --git a/components/spreadsheet/accessibility/wai-aria-support.md b/components/spreadsheet/accessibility/wai-aria-support.md
@@ -89,7 +89,7 @@ The Name editor must implement the spec for a ComboBox component.
 
 | Selector | Attribute | Usage |
 | -------- | --------- | ----- |
-| `.k-spreadsheet-formula-list` | `id` | Unique and deterministic id linked to the `aria-controls` attribute of the corresponding formula input. |
+| `.k-spreadsheet-formula-list` | `id` | Unique and deterministic id linked to the "aria-controls" attribute of the corresponding formula input. |
 | `.k-spreadsheet-formula-list` | `role=menu` | Announces the `menu` role of the popup. |
 | `.k-list-item` | `role=menuitem` | Announces the `menuitem` role of the popup items. |
 
diff --git a/components/tabstrip/accessibility/wai-aria-support.md b/components/tabstrip/accessibility/wai-aria-support.md
@@ -28,12 +28,12 @@ This section lists the selectors, attributes, and behavior patterns supported by
 | `.k-tabstrip-items` | `role=tablist` | Indicates the tablist role for the ul element of the TabStrip. |
 | `.k-tabstrip.k-tabstrip-left .k-tabstrip-items,.k-tabstrip.k-tabstrip-right .k-tabstrip-items` | `aria-orientation=vertical` | Indicates the orientation of the tablist container element. The attribute is rendered only when the orientation of the component is vertical as the `tablist` role comes with default horizontal orientation. |
 | `.k-tabstrip-item` | `role=tab` | The tab `li` element. |
-| `.k-tabstrip .k-item.k-active` | `aria-selected=true` | Announces the selected state of the tab. |
+| `.k-tabstrip .k-tabstrip-item.k-active` | `aria-selected=true` | Announces the selected state of the tab. |
 |  | `aria-controls=.k-tabstrip-content id` | Announces the relation between the panel and active tab. |
 | `.k-tabstrip-content` | `role=tabpanel` | The content `div` of the tab. |
 |  | `aria-hidden=true` | Only if the component implements a feature to control whether the content should be persisted. |
 |  | `aria-labelledby=.k-tabstrip-item id` | Refers to the tab element that controls the panel. |
-| `.k-tabstrip .k-button` | `aria-hidden=true` | Introduce aria-hidden attribute for the scrollable buttons. The buttons are not included in the tabsequence. Navigating through arrow keys would |
+| `.k-tabstrip .k-button` | `aria-hidden=true` | Introduce "aria-hidden" attribute for the scrollable buttons. The buttons are not included in the tabsequence. Navigating through arrow keys would |
 
 ## Resources
 
diff --git a/components/tilelayout/accessibility/wai-aria-support.md b/components/tilelayout/accessibility/wai-aria-support.md
@@ -31,7 +31,7 @@ This section lists the selectors, attributes, and behavior patterns supported by
 |  | `tabindex=0` | Makes the item wrapper element focusable. |
 |  | `aria-keyshortcuts=Enter` | Announces Enter as an available key shortcut when the item is focused. |
 |  | `aria-dropeffect=execute` | Announces that an action, supported by the drop-target (resizing or reordering) will be executed when the item is dropped. |
-|  | `aria-grabbed=true/false` | The aria-grabbed state indicates an element's 'grabbed' state in a drag-and-drop operation. |
+|  | `aria-grabbed=true/false` | The "aria-grabbed" state indicates an element's 'grabbed' state in a drag-and-drop operation. |
 | `.k-tilelayout-item-header .k-card-title` | `id` | Unique and deterministic identifier to link the header text element to the focusable wrapper. |
 
 ## Section 508
diff --git a/components/toolbar/accessibility/wai-aria-support.md b/components/toolbar/accessibility/wai-aria-support.md
@@ -27,13 +27,13 @@ This section lists the selectors, attributes, and behavior patterns supported by
 | -------- | --------- | ----- |
 | `.k-toolbar` | `role=toolbar` | The component role. |
 |  | `aria-label` or `aria-labelledby` | Must be supplied on each toolbar only when the application contains more than one toolbars. |
-| `.k-toolbar .k-toolbar-overflow-button:has(.k-svg-i-more-vertical)` | `aria-haspopup=menu` | The value of the `aria-haspopup` attribute of the button that opens the overflow popup. |
-|  | `aria-expanded=true/false` | The value of the `aria-expanded` attribute of the button that opens the overflow popup. |
+| `.k-toolbar .k-toolbar-overflow-button:has(.k-svg-i-more-vertical)` | `aria-haspopup=menu` | The value of the "aria-haspopup" attribute of the button that opens the overflow popup. |
+|  | `aria-expanded=true/false` | The value of the "aria-expanded" attribute of the button that opens the overflow popup. |
 |  | `aria-controls=.k-toolbar-popup .k-menu-group id` | Indicates the connection between the toggle button and the content it controls. |
 |  | `aria-label` or `title` | The button that opens the overflow popup must have a descriptive text set, as it contains only an icon (no text). |
 | `.k-toolbar-popup .k-menu-group` | `role=menu` | The role of the tools wrapper in the overflow section. |
 |  | `aria-labelledby=.k-toolbar .k-toolbar-overflow-button:has(.k-svg-i-more-vertical) id` | Associates the title of the menu toggle button. |
-| `.k-toolbar .k-toolbar-overflow-button:has(.k-svg-i-more-horizontal)` | `aria-expanded=true/false` | The value of the `aria-expanded` attribute of the button that opens the overflow section. |
+| `.k-toolbar .k-toolbar-overflow-button:has(.k-svg-i-more-horizontal)` | `aria-expanded=true/false` | The value of the "aria-expanded" attribute of the button that opens the overflow section. |
 |  | `aria-label` or `title` | The button that opens the overflow section must have a descriptive text set, as it contains only an icon (no text). |
 |  | `aria-controls=.k-toolbar-popup .k-toolbar-items-list id` | Indicates the connection between the toggle button and the content it controls. |
 | `.k-toolbar-popup .k-toolbar-items-list` | `role=toolbar` | The role of the tools wrapper in the overflow section. |
diff --git a/components/upload/accessibility/wai-aria-support.md b/components/upload/accessibility/wai-aria-support.md
diff --git a/components/window/accessibility/wai-aria-support.md b/components/window/accessibility/wai-aria-support.md
