@progress/kendo-themes-html 14.7.1-dev.2 → 14.7.1-dev.3

package/dist/types/chip/chip-list.spec.d.ts

@@ -19,7 +19,6 @@ export type KendoChipListProps = KendoChipListOptions & {
  * @aria {aria-keyshortcuts="Enter Delete"} Announces the Delete action along with the default Enter key.
  * @aria {aria-multiselectable="true"} Indicates multiple selections are allowed.
  * @aria {aria-label} Accessible name for the chip list; required when role="listbox".
- * @aria {role="group"} Groups chips that each act as independent controls (e.g. popup triggers) rather than selectable options; `aria-orientation` is omitted since it is not supported on this role.
  * @ux {Chip group} Renders a horizontal or wrapping collection of chip elements.
  * @ux {Selection} Supports single or multi-selection across the chips in the list.
  * @ux {Add chip} Can include an add-chip control to allow the user to create new chips.

package/dist/types/chip/chip.spec.d.ts

@@ -28,16 +28,11 @@ export type KendoChipState = {
  * @ux {Removable} An optional remove icon allows the chip to be dismissed.
  * @ux {Icon or avatar} Can display an icon or avatar image alongside the label.
  * @ux {Disabled state} When disabled, the chip is non-interactive.
- * @aria {role="presentation" or "listitem"} Used for read-only, informational chips that must still be announced; `aria-pressed` is omitted for these.
- * @aria {aria-haspopup} Indicates the Chip opens a popup on activation instead of toggling a pressed state; `aria-pressed` is omitted when present.
- * @aria {tabindex="-1"} When used as a static label inside another focusable or roving-tabindex container (e.g. a TreeView row), the Chip must not be independently focusable; pairing it with `pointer-events: none` also lets clicks and hover pass through to that container.
  */
 export declare const Chip: KendoComponent<KendoChipProps & KendoChipState & React.HTMLAttributes<HTMLDivElement>>;
 /**
  * @keyboard {ArrowRight} Focuses the next chip in a horizontally oriented chiplist.
  * @keyboard {ArrowLeft} Focuses the previous chip in a horizontally oriented group.
- * @keyboard {ArrowDown} Focuses the next chip in a vertically stacked group (e.g. a field list).
- * @keyboard {ArrowUp} Focuses the previous chip in a vertically stacked group.
  * @keyboard {Enter or Space} Triggers a click action on the Chip.
  * @keyboard {Delete or Backspace} Removes the Chip when a delete action is configured.
  *

package/dist/types/datainsights-composer/datainsights-composer-fields.spec.d.ts

@@ -2,7 +2,12 @@ import type { KendoComponent } from '../_types/component';
 export declare const DATA_INSIGHTS_COMPOSER_FIELDS_CLASSNAME = "k-datainsights-composer-fields";
 /**
  * Wraps the row of field chips shown in the empty/prompt state.
- * @keyboard {Tab or Shift+Tab} Moves focus into or out of the chip group as a single stop (lands on the roving tab stop chip).
+ * @aria {role="group"} Groups data-source chips that act as popup triggers.
+ * @aria {aria-label} Names the data-source chip group.
+ * @aria {aria-haspopup="true"} Indicates that each data-source chip opens a popup.
+ * @aria {tabindex="0" or "-1"} Maintains one data-source chip in the tab order using roving tabindex.
+ * @keyboard {Tab} Moves focus into the group through its active roving-tabindex chip, or from that chip to the next focusable element.
+ * @keyboard {Shift+Tab} Moves focus from the active chip to the previous focusable element.
  * @keyboard {ArrowRight or ArrowLeft} Moves the roving tab stop between the data source chips, same as the standalone ChipList.
  * @keyboard {Enter or Space} Opens the Data Source popup for the focused chip.
  */

package/dist/types/datainsights-composer/datainsights-composer-history-checkpoint.spec.d.ts

@@ -16,8 +16,8 @@ export interface DataInsightsComposerHistoryCheckpointProps extends React.HTMLAt
  * @aria {role="option"} Each checkpoint is an option in the history listbox.
  * @aria {tabindex="-1"} Non-active checkpoints stay out of the tab order.
  * @keyboard {ArrowUp or ArrowDown} Moves the roving tab stop between checkpoints, same as a standard list.
- * @keyboard {Tab} From the active (focused) checkpoint, moves focus to its own restore button; the restore buttons of all other checkpoints have `tabindex="-1"` so Tab does not walk through them one by one.
- * @keyboard {Shift+Tab} From a restore button, returns focus to its own checkpoint.
+ * @keyboard {Tab} From the active checkpoint, moves focus to its restore button. From that button, or from the current checkpoint which has no restore action, moves focus outside the popup.
+ * @keyboard {Shift+Tab} From a restore button, returns focus to its own checkpoint. From the active checkpoint, moves focus to the previous focusable element outside the popup.
  * A history item with a timestamp and an optional restore action.
  */
 export declare const DataInsightsComposerHistoryCheckpoint: KendoComponent<DataInsightsComposerHistoryCheckpointProps>;

package/dist/types/datainsights-composer/datainsights-composer-popup.spec.d.ts

@@ -1,5 +1,16 @@
 import type { KendoComponent } from '../_types/component';
 export declare const DATA_INSIGHTS_COMPOSER_POPUP_CLASSNAME = "k-datainsights-composer-popup";
-/** Popup shell used by the Composer data-source and history views. */
+/**
+ * Popup shell used by the Composer data-source and history views.
+ * @aria {role="presentation"} Removes button semantics from field-label chips in data-source popups.
+ * @aria {tabindex="0" or "-1"} Uses roving tabindex for a standalone field list; chips embedded in TreeView items stay out of the tab order.
+ */
 export declare const DataInsightsComposerPopup: KendoComponent<React.HTMLAttributes<HTMLDivElement>>;
+/**
+ * @keyboard {ArrowDown} Moves to the next chip in a data-source field list, or from the browser search box to the first TreeView item.
+ * @keyboard {ArrowUp} Moves to the previous chip in a data-source field list, or from the first browser TreeView item to the search box.
+ * @keyboard {Tab} In a data-source field-list popup, moves focus into the list through its active roving-tabindex chip; pressing Tab again moves focus outside the popup.
+ * @keyboard {Shift+Tab} From the active chip in a data-source field-list popup, moves focus to the previous focusable element outside the popup.
+ * @keyboard {Escape} Closes the popup and returns focus to the element that opened it.
+ */
 export default DataInsightsComposerPopup;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-themes-html",
   "description": "A collection of HTML helpers used for developing Kendo UI themes",
-  "version": "14.7.1-dev.2",
+  "version": "14.7.1-dev.3",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [

package/src/chip/chip-list.spec.tsx

@@ -31,7 +31,6 @@ const defaultOptions = {
  * @aria {aria-keyshortcuts="Enter Delete"} Announces the Delete action along with the default Enter key.
  * @aria {aria-multiselectable="true"} Indicates multiple selections are allowed.
  * @aria {aria-label} Accessible name for the chip list; required when role="listbox".
- * @aria {role="group"} Groups chips that each act as independent controls (e.g. popup triggers) rather than selectable options; `aria-orientation` is omitted since it is not supported on this role.
  * @ux {Chip group} Renders a horizontal or wrapping collection of chip elements.
  * @ux {Selection} Supports single or multi-selection across the chips in the list.
  * @ux {Add chip} Can include an add-chip control to allow the user to create new chips.

package/src/chip/chip.spec.tsx

@@ -54,9 +54,6 @@ const defaultOptions = {
  * @ux {Removable} An optional remove icon allows the chip to be dismissed.
  * @ux {Icon or avatar} Can display an icon or avatar image alongside the label.
  * @ux {Disabled state} When disabled, the chip is non-interactive.
- * @aria {role="presentation" or "listitem"} Used for read-only, informational chips that must still be announced; `aria-pressed` is omitted for these.
- * @aria {aria-haspopup} Indicates the Chip opens a popup on activation instead of toggling a pressed state; `aria-pressed` is omitted when present.
- * @aria {tabindex="-1"} When used as a static label inside another focusable or roving-tabindex container (e.g. a TreeView row), the Chip must not be independently focusable; pairing it with `pointer-events: none` also lets clicks and hover pass through to that container.
  */
 export const Chip: KendoComponent<KendoChipProps & KendoChipState & React.HTMLAttributes<HTMLDivElement>> = (
     props: KendoChipProps &
@@ -141,8 +138,6 @@ Chip.folderName = CHIP_FOLDER_NAME;
 /**
  * @keyboard {ArrowRight} Focuses the next chip in a horizontally oriented chiplist.
  * @keyboard {ArrowLeft} Focuses the previous chip in a horizontally oriented group.
- * @keyboard {ArrowDown} Focuses the next chip in a vertically stacked group (e.g. a field list).
- * @keyboard {ArrowUp} Focuses the previous chip in a vertically stacked group.
  * @keyboard {Enter or Space} Triggers a click action on the Chip.
  * @keyboard {Delete or Backspace} Removes the Chip when a delete action is configured.
  *

package/src/datainsights-composer/datainsights-composer-fields.spec.tsx

@@ -6,7 +6,12 @@ export const DATA_INSIGHTS_COMPOSER_FIELDS_CLASSNAME = 'k-datainsights-composer-
 
 /**
  * Wraps the row of field chips shown in the empty/prompt state.
- * @keyboard {Tab or Shift+Tab} Moves focus into or out of the chip group as a single stop (lands on the roving tab stop chip).
+ * @aria {role="group"} Groups data-source chips that act as popup triggers.
+ * @aria {aria-label} Names the data-source chip group.
+ * @aria {aria-haspopup="true"} Indicates that each data-source chip opens a popup.
+ * @aria {tabindex="0" or "-1"} Maintains one data-source chip in the tab order using roving tabindex.
+ * @keyboard {Tab} Moves focus into the group through its active roving-tabindex chip, or from that chip to the next focusable element.
+ * @keyboard {Shift+Tab} Moves focus from the active chip to the previous focusable element.
  * @keyboard {ArrowRight or ArrowLeft} Moves the roving tab stop between the data source chips, same as the standalone ChipList.
  * @keyboard {Enter or Space} Opens the Data Source popup for the focused chip.
  */

package/src/datainsights-composer/datainsights-composer-history-checkpoint.spec.tsx

@@ -23,8 +23,8 @@ export interface DataInsightsComposerHistoryCheckpointProps extends React.HTMLAt
  * @aria {role="option"} Each checkpoint is an option in the history listbox.
  * @aria {tabindex="-1"} Non-active checkpoints stay out of the tab order.
  * @keyboard {ArrowUp or ArrowDown} Moves the roving tab stop between checkpoints, same as a standard list.
- * @keyboard {Tab} From the active (focused) checkpoint, moves focus to its own restore button; the restore buttons of all other checkpoints have `tabindex="-1"` so Tab does not walk through them one by one.
- * @keyboard {Shift+Tab} From a restore button, returns focus to its own checkpoint.
+ * @keyboard {Tab} From the active checkpoint, moves focus to its restore button. From that button, or from the current checkpoint which has no restore action, moves focus outside the popup.
+ * @keyboard {Shift+Tab} From a restore button, returns focus to its own checkpoint. From the active checkpoint, moves focus to the previous focusable element outside the popup.
  * A history item with a timestamp and an optional restore action.
  */
 export const DataInsightsComposerHistoryCheckpoint: KendoComponent<DataInsightsComposerHistoryCheckpointProps> = (props) => {

package/src/datainsights-composer/datainsights-composer-popup.spec.tsx

@@ -5,7 +5,11 @@ import { DATA_INSIGHTS_COMPOSER_FOLDER_NAME, DATA_INSIGHTS_COMPOSER_MODULE_NAME
 
 export const DATA_INSIGHTS_COMPOSER_POPUP_CLASSNAME = 'k-datainsights-composer-popup';
 
-/** Popup shell used by the Composer data-source and history views. */
+/**
+ * Popup shell used by the Composer data-source and history views.
+ * @aria {role="presentation"} Removes button semantics from field-label chips in data-source popups.
+ * @aria {tabindex="0" or "-1"} Uses roving tabindex for a standalone field list; chips embedded in TreeView items stay out of the tab order.
+ */
 export const DataInsightsComposerPopup: KendoComponent<React.HTMLAttributes<HTMLDivElement>> = (props) => {
     const { className, children, ...other } = props;
     return (
@@ -27,4 +31,12 @@ DataInsightsComposerPopup.defaultOptions = {};
 DataInsightsComposerPopup.moduleName = DATA_INSIGHTS_COMPOSER_MODULE_NAME;
 DataInsightsComposerPopup.folderName = DATA_INSIGHTS_COMPOSER_FOLDER_NAME;
 
+/**
+ * @keyboard {ArrowDown} Moves to the next chip in a data-source field list, or from the browser search box to the first TreeView item.
+ * @keyboard {ArrowUp} Moves to the previous chip in a data-source field list, or from the first browser TreeView item to the search box.
+ * @keyboard {Tab} In a data-source field-list popup, moves focus into the list through its active roving-tabindex chip; pressing Tab again moves focus outside the popup.
+ * @keyboard {Shift+Tab} From the active chip in a data-source field-list popup, moves focus to the previous focusable element outside the popup.
+ * @keyboard {Escape} Closes the popup and returns focus to the element that opened it.
+ */
+
 export default DataInsightsComposerPopup;

package/src/datainsights-composer/tests/datainsights-composer-history.tsx

@@ -1,4 +1,3 @@
-import { DataInsightsComposerHistoryPopup } from '../templates/datainsights-composer-history-popup';
 import { DataInsightsComposerHistoryCheckpoint, DataInsightsComposerPopupListGroupHeader } from '..';
 import { List, ListContent } from '../../list';
 import { Popup } from '../../popup';
@@ -13,10 +12,6 @@ const styles = `
 export default () => (
     <>
         <style>{styles}</style>
-        <div id="test-area">
-            <h3>History popup</h3>
-            <DataInsightsComposerHistoryPopup />
-        </div>
         <div id="test-area">
             <h3>History popup states</h3>
             <Popup className={classNames('k-list-container', 'k-datainsights-composer-popup')} containerRole="region" containerAriaLabel="History">