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

package/dist/meta/card.json

@@ -0,0 +1,88 @@
+{
+  "component": "card",
+  "name": "Card",
+  "components": [
+    {
+      "name": "Card",
+      "isPrimary": true,
+      "rootClass": "k-card",
+      "options": [],
+      "states": [
+        "hover",
+        "focus",
+        "selected",
+        "disabled"
+      ],
+      "aria": [],
+      "keyboard": [],
+      "ux": [
+        {
+          "trigger": "Content container",
+          "behavior": "Groups related content in a visually elevated surface."
+        },
+        {
+          "trigger": "Header and footer",
+          "behavior": "Optional header and footer sections hold titles and actions."
+        },
+        {
+          "trigger": "Media",
+          "behavior": "Supports an image or other media element at the top of the card."
+        },
+        {
+          "trigger": "Actions",
+          "behavior": "Optional action buttons are placed in the card body or footer."
+        }
+      ]
+    },
+    {
+      "name": "CardList",
+      "isPrimary": true,
+      "rootClass": "k-card-list",
+      "options": [],
+      "states": [],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "role=\"list\"",
+          "description": "The card list container announces its list role."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"listitem\"",
+          "description": "Each card in the list has the listitem role."
+        },
+        {
+          "prop": null,
+          "attribute": "tabindex=\"0\"",
+          "description": "The card is focusable when navigatable."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-describedby=\".k-card-title id\"",
+          "description": "Associate the card to its title element."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-keyshortcuts=\"Enter\"",
+          "description": "Announces the Enter key for navigation inside the card."
+        }
+      ],
+      "keyboard": [],
+      "ux": []
+    },
+    {
+      "name": "CardWrap",
+      "isPrimary": true,
+      "rootClass": "k-card-wrap",
+      "options": [],
+      "states": [
+        "focus",
+        "selected"
+      ],
+      "aria": [],
+      "keyboard": [],
+      "ux": []
+    }
+  ],
+  "resources": []
+}

package/dist/meta/chart-wizard.json

@@ -0,0 +1,43 @@
+{
+  "component": "chart-wizard",
+  "name": "ChartWizard",
+  "components": [
+    {
+      "name": "ChartWizard",
+      "isPrimary": true,
+      "rootClass": "k-chart-wizard",
+      "options": [],
+      "states": [],
+      "aria": [],
+      "keyboard": [
+        {
+          "trigger": "Tab",
+          "behavior": "Navigates the content in the ChartWizard - the Window, Export button, Chart, Splitter, TabStrip tabs and content, each ExpansionPanel, each Chart type button."
+        },
+        {
+          "trigger": "Enter",
+          "behavior": "Triggers click event on the focused button."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Multi-step",
+          "behavior": "Guides the user through chart creation in a series of steps."
+        },
+        {
+          "trigger": "Live preview",
+          "behavior": "Displays a real-time preview of the chart as options are configured."
+        },
+        {
+          "trigger": "Chart type selection",
+          "behavior": "The user picks the desired chart type from a visual list."
+        },
+        {
+          "trigger": "Data binding",
+          "behavior": "Connects the chart to a data source in a dedicated step."
+        }
+      ]
+    }
+  ],
+  "resources": []
+}

package/dist/meta/chart.json

@@ -0,0 +1,128 @@
+{
+  "component": "chart",
+  "name": "Chart",
+  "components": [
+    {
+      "name": "Chart",
+      "isPrimary": true,
+      "rootClass": "k-chart",
+      "options": [],
+      "states": [],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "role=\"graphics-document document\"",
+          "description": "Identifies the chart surface as a graphics document for assistive technology."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-roledescription",
+          "description": "Provides a human-readable description of the chart type (e.g. \"Sales by year\")."
+        },
+        {
+          "prop": null,
+          "attribute": "tabindex=\"0\"",
+          "description": "Makes the chart surface keyboard focusable."
+        }
+      ],
+      "keyboard": [
+        {
+          "trigger": "Tab",
+          "behavior": "Moves focus to the Legend items, focusing the first legend item. If legend is not available, moves focus to the next focusable element."
+        },
+        {
+          "trigger": "Shift + Tab",
+          "behavior": "Moves focus to the previous focusable element."
+        },
+        {
+          "trigger": "ArrowUp or ArrowDown",
+          "behavior": "Navigates between series for categorical, scatter/polar charts; moves between items for funnel; moves clockwise/anti-clockwise for radar column; moves away/towards center for radar line/area."
+        },
+        {
+          "trigger": "ArrowLeft or ArrowRight",
+          "behavior": "Navigates between data points within a series for categorical, scatter/polar, and radar charts."
+        },
+        {
+          "trigger": "ArrowUp (donut)",
+          "behavior": "Moves focus to the outer series."
+        },
+        {
+          "trigger": "ArrowDown (donut)",
+          "behavior": "Moves focus to the inner series."
+        },
+        {
+          "trigger": "ArrowRight (donut/pie)",
+          "behavior": "Moves through points of the series in a clockwise direction."
+        },
+        {
+          "trigger": "ArrowLeft (donut/pie)",
+          "behavior": "Moves through points of the series in an anti-clockwise direction."
+        },
+        {
+          "trigger": "Enter",
+          "behavior": "Triggers the click action for the focused series point or legend item."
+        },
+        {
+          "trigger": "Escape",
+          "behavior": "Closes the series tooltip; second press returns focus to the chart root."
+        },
+        {
+          "trigger": "Tab (legend)",
+          "behavior": "Moves focus to the next focusable element on the page."
+        },
+        {
+          "trigger": "Shift + Tab (legend)",
+          "behavior": "Moves focus to the chart area, focusing the first point in the first series."
+        },
+        {
+          "trigger": "ArrowUp or ArrowLeft (legend)",
+          "behavior": "Moves focus to the previous legend item. Cycles to the last item at the beginning."
+        },
+        {
+          "trigger": "ArrowDown or ArrowRight (legend)",
+          "behavior": "Moves focus to the next legend item. Cycles to the first item at the end."
+        },
+        {
+          "trigger": "Enter (legend)",
+          "behavior": "Toggles the series visibility."
+        },
+        {
+          "trigger": "Escape (legend)",
+          "behavior": "Moves focus to the root element of the chart."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Tooltip",
+          "behavior": "Shows data labels or values when hovering over data points or series."
+        },
+        {
+          "trigger": "Legend",
+          "behavior": "Identifies each series; clicking a legend item toggles its visibility."
+        },
+        {
+          "trigger": "Zoom and pan",
+          "behavior": "Supports mouse-wheel zoom and click-drag panning on large datasets."
+        },
+        {
+          "trigger": "Export",
+          "behavior": "Can export the chart as a PNG image or PDF document."
+        }
+      ]
+    }
+  ],
+  "resources": [
+    {
+      "url": "https://www.w3.org/TR/graphics-aria-1.0/#graphics-document",
+      "text": "WAI-ARIA Graphics Module — graphics-document role"
+    },
+    {
+      "url": "https://a11y-style-guide.com/style-guide/section-media.html#kssref-media-svgs",
+      "text": "Accessibility Style Guide: SVGs"
+    },
+    {
+      "url": "https://www.w3.org/WAI/WCAG22/Understanding/keyboard.html",
+      "text": "WCAG 2.1.1 Keyboard"
+    }
+  ]
+}

package/dist/meta/chat.json

@@ -0,0 +1,87 @@
+{
+  "component": "chat",
+  "name": "Chat",
+  "components": [
+    {
+      "name": "Chat",
+      "isPrimary": true,
+      "rootClass": "k-chat",
+      "options": [],
+      "states": [],
+      "aria": [],
+      "keyboard": [
+        {
+          "trigger": "ArrowUp",
+          "behavior": "Selects and focuses the previous Chat bubble"
+        },
+        {
+          "trigger": "ArrowDown",
+          "behavior": "Selects and focuses the next Chat bubble"
+        },
+        {
+          "trigger": "Home",
+          "behavior": "Selects and focuses the first Chat bubble"
+        },
+        {
+          "trigger": "End",
+          "behavior": "Selects and focuses the last Chat bubble"
+        },
+        {
+          "trigger": "Enter or Space",
+          "behavior": "Triggers a click action on the element."
+        },
+        {
+          "trigger": "Enter",
+          "behavior": "Sends the message."
+        },
+        {
+          "trigger": "Shift + Enter",
+          "behavior": "Start a new line in the textarea message box."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Message list",
+          "behavior": "Displays a scrollable list of messages from the user and the agent."
+        },
+        {
+          "trigger": "Input",
+          "behavior": "A text input at the bottom lets the user compose and send messages."
+        },
+        {
+          "trigger": "Toolbar",
+          "behavior": "An optional toolbar above the input provides additional actions."
+        },
+        {
+          "trigger": "Typing indicator",
+          "behavior": "Shows an animated indicator while the other party is responding."
+        },
+        {
+          "trigger": "Suggestions",
+          "behavior": "Displays quick-reply suggestion chips above the input."
+        }
+      ]
+    },
+    {
+      "name": "ChatMessage",
+      "isPrimary": false,
+      "rootClass": "k-message",
+      "options": [],
+      "states": [
+        "hover",
+        "selected",
+        "active",
+        "focus"
+      ],
+      "aria": [],
+      "keyboard": [],
+      "ux": []
+    }
+  ],
+  "resources": [
+    {
+      "url": "https://www.w3.org/TR/wai-aria-1.2/#log",
+      "text": "WAI-ARIA specification for log"
+    }
+  ]
+}

package/dist/meta/checkbox.json

@@ -0,0 +1,137 @@
+{
+  "component": "checkbox",
+  "name": "Checkbox",
+  "components": [
+    {
+      "name": "Checkbox",
+      "isPrimary": true,
+      "rootClass": "k-checkbox",
+      "options": [
+        {
+          "name": "size",
+          "values": [
+            "small",
+            "medium",
+            "large"
+          ],
+          "default": null
+        },
+        {
+          "name": "rounded",
+          "values": [
+            "none",
+            "small",
+            "medium",
+            "large",
+            "full"
+          ],
+          "default": null
+        }
+      ],
+      "states": [
+        "hover",
+        "focus",
+        "valid",
+        "invalid",
+        "required",
+        "disabled",
+        "checked",
+        "indeterminate"
+      ],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "aria-label|aria-labelledby",
+          "description": "The input requires an accessible name to which it will be assigned."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-checked=\"true\"|\\\"false\"|\\\"mixed\"",
+          "description": "For native checkboxes the checked state is handled by the browser. aria-checked is used for custom implementations."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-describedby",
+          "description": "Points to the hint or error message for the checkbox."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-disabled=\"true\"",
+          "description": "For native checkboxes use the HTML disabled attribute. aria-disabled for custom implementations."
+        },
+        {
+          "prop": null,
+          "attribute": "role",
+          "description": "override for the wrapper span (e.g., role=\"none\" in Treeview context)"
+        }
+      ],
+      "keyboard": [
+        {
+          "trigger": "Space",
+          "behavior": "Toggles the checked state. Regardless of the indeterminate state, the key always considers the `Value` of the CheckBox."
+        },
+        {
+          "trigger": "Shift + Tab",
+          "behavior": "Moves focus to the previous checkbox."
+        },
+        {
+          "trigger": "ArrowDown or ArrowRight",
+          "behavior": "Moves focus to the next checkbox."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Toggle",
+          "behavior": "Clicking toggles between checked and unchecked states."
+        },
+        {
+          "trigger": "Indeterminate",
+          "behavior": "Can be set to an indeterminate (partial-selection) state programmatically."
+        },
+        {
+          "trigger": "Label",
+          "behavior": "An associated label element describes the purpose of the checkbox."
+        },
+        {
+          "trigger": "Disabled state",
+          "behavior": "When disabled, the checkbox cannot be toggled."
+        }
+      ]
+    },
+    {
+      "name": "CheckboxGroup",
+      "isPrimary": true,
+      "rootClass": "k-checkbox-list",
+      "options": [],
+      "states": [],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "aria-invalid=\"true\"",
+          "description": "Rendered only when the CheckBox is in a form and announces the invalid state."
+        }
+      ],
+      "keyboard": [],
+      "ux": [
+        {
+          "trigger": "Option set",
+          "behavior": "Renders a labelled group of related checkboxes."
+        },
+        {
+          "trigger": "Layout",
+          "behavior": "Items can be arranged horizontally or vertically."
+        },
+        {
+          "trigger": "Disabled group",
+          "behavior": "When the group is disabled, all contained checkboxes are non-interactive."
+        }
+      ]
+    }
+  ],
+  "resources": [
+    {
+      "url": "https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/",
+      "text": "WAI-ARIA Authoring Practices: CheckBox Pattern"
+    }
+  ]
+}

package/dist/meta/checkpoint.json

@@ -0,0 +1,41 @@
+{
+  "component": "checkpoint",
+  "name": "Checkpoint",
+  "components": [
+    {
+      "name": "Checkpoint",
+      "isPrimary": true,
+      "rootClass": "k-checkpoint",
+      "options": [],
+      "states": [],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "aria-hidden=\"true\"",
+          "description": "The gradient separator lines are decorative and hidden from assistive technologies."
+        }
+      ],
+      "keyboard": [
+        {
+          "trigger": "Tab",
+          "behavior": "Focusing an interactive descendant (e.g. a Button) reveals the checkpoint via `:focus-within`."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Hover reveal",
+          "behavior": "Hidden by default and faded in on hover of the checkpoint or when a descendant (e.g. a Button) receives focus."
+        },
+        {
+          "trigger": "Always visible",
+          "behavior": "Set the `visible` prop to keep the checkpoint permanently shown, bypassing the hover/focus reveal."
+        },
+        {
+          "trigger": "Conversation UI",
+          "behavior": "When the checkpoint's retry option is used within a conversation UI, the sender's text should be populated into the conversation UI input."
+        }
+      ]
+    }
+  ],
+  "resources": []
+}