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

package/dist/meta/numerictextbox.json

@@ -0,0 +1,142 @@
+{
+  "component": "numerictextbox",
+  "name": "Numerictextbox",
+  "components": [
+    {
+      "name": "NumericTextbox",
+      "isPrimary": true,
+      "rootClass": "k-numerictextbox",
+      "options": [
+        {
+          "name": "size",
+          "values": [
+            "small",
+            "medium",
+            "large"
+          ],
+          "default": null
+        },
+        {
+          "name": "rounded",
+          "values": [
+            "none",
+            "small",
+            "medium",
+            "large",
+            "full"
+          ],
+          "default": null
+        },
+        {
+          "name": "fillMode",
+          "values": [
+            "solid",
+            "flat",
+            "outline"
+          ],
+          "default": null
+        }
+      ],
+      "states": [
+        "hover",
+        "focus",
+        "valid",
+        "invalid",
+        "loading",
+        "required",
+        "disabled",
+        "readonly"
+      ],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "role=\"spinbutton\"",
+          "description": "Announces the spin button capabilities of the NumericTextBox."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-label|aria-labelledby",
+          "description": "The input requires an accessible name (provided by consuming app)."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-valuenow",
+          "description": "Announces the current value of the component."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-valuemin",
+          "description": "Announces the minimum allowed value."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-valuemax",
+          "description": "Announces the maximum allowed value."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-invalid=\"true\"",
+          "description": "Rendered when the NumericTextBox is in an invalid state."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-describedby",
+          "description": "Points to the hint or error message."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-disabled=\"true\"",
+          "description": "Rendered when the NumericTextBox is disabled."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"button\"",
+          "description": "Describes the role of the spin buttons."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-label",
+          "description": "The button element requires discernible text."
+        }
+      ],
+      "keyboard": [
+        {
+          "trigger": "ArrowUp",
+          "behavior": "Increases the value of the focused NumericTextBox with the step."
+        },
+        {
+          "trigger": "ArrowDown",
+          "behavior": "Decreases the value of the focused NumericTextBox with the step."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Spin buttons",
+          "behavior": "Up and down arrow buttons increment and decrement the value."
+        },
+        {
+          "trigger": "Min / Max",
+          "behavior": "Enforces a configurable minimum and maximum value."
+        },
+        {
+          "trigger": "Step",
+          "behavior": "The increment step size is configurable."
+        },
+        {
+          "trigger": "Format",
+          "behavior": "The value is displayed using the configured number format."
+        },
+        {
+          "trigger": "Disabled state",
+          "behavior": "When disabled, the input and spin buttons are non-interactive."
+        }
+      ]
+    }
+  ],
+  "resources": [
+    {
+      "url": "https://www.w3.org/WAI/ARIA/apg/patterns/spinbutton/",
+      "text": "WAI-ARIA Authoring Practices: Spinbutton Pattern"
+    }
+  ]
+}

package/dist/meta/orgchart.json

@@ -0,0 +1,141 @@
+{
+  "component": "orgchart",
+  "name": "Orgchart",
+  "components": [
+    {
+      "name": "Orgchart",
+      "isPrimary": true,
+      "rootClass": "k-orgchart",
+      "options": [],
+      "states": [],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "role=\"tree\"",
+          "description": "The root div element of the OrgChart. Contains all its top level items."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-orientation=\"horizontal\"",
+          "description": "Specifies the orientation of the OrgChart tree."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"group\"",
+          "description": "The element that groups nodes visually with a title and expand/collapse button."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"presentation\"",
+          "description": "The node container must not break the tree-treeitem relationship."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"treeitem\"",
+          "description": "The node wrapper representing the treeitem in the hierarchical structure."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-level",
+          "description": "Announces the level of the tree node item. The value of level is number-based (>=1)."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-keyshortcuts=\"Enter\"",
+          "description": "Announces that the edit menu of the OrgChart can be activated via the Enter key."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-expanded=\"true\"|\\\"false\"",
+          "description": "Present when a node has subitems. Announces the expanded state of the node."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-owns",
+          "description": "Present when a node has subitems. The value is the id of the group containing child nodes."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-selected=\"true\"",
+          "description": "Announces the selected (focused) item in the OrgChart."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-selected=\"false\"",
+          "description": "Announces the not selected (focused) items in the OrgChart."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"button\"",
+          "description": "Specifies the menu icon of the item is a button."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-label=\"Edit menu\"",
+          "description": "Provides an accessible name for the edit button."
+        },
+        {
+          "prop": null,
+          "attribute": "tabindex=\"-1\"",
+          "description": "The Edit menu button must not be part of the page tab sequence."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"presentation\"",
+          "description": "The expand/collapse button is decorative."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-hidden=\"true\"",
+          "description": "Hides the button from assistive technology."
+        },
+        {
+          "prop": null,
+          "attribute": "tabindex=\"-1\"",
+          "description": "The expand/collapse button must not be part of the page tab sequence."
+        }
+      ],
+      "keyboard": [],
+      "ux": [
+        {
+          "trigger": "Node hierarchy",
+          "behavior": "Renders organizational nodes in a top-down tree layout."
+        },
+        {
+          "trigger": "Expand / Collapse",
+          "behavior": "Branch nodes can be collapsed to hide their subtree."
+        },
+        {
+          "trigger": "Edit mode",
+          "behavior": "Nodes can be added, edited, and removed."
+        },
+        {
+          "trigger": "Zoom and pan",
+          "behavior": "The chart canvas supports zooming and panning."
+        }
+      ]
+    },
+    {
+      "name": "OrgchartGroup",
+      "isPrimary": false,
+      "rootClass": "k-orgchart-group",
+      "options": [],
+      "states": [],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "role=\"tree\"",
+          "description": "Applied when level=1."
+        }
+      ],
+      "keyboard": [],
+      "ux": []
+    }
+  ],
+  "resources": [
+    {
+      "url": "https://www.w3.org/WAI/ARIA/apg/example-index/treeview/treeview-1/treeview-1a.html",
+      "text": "ARIA practices File Directory Treeview Example"
+    }
+  ]
+}

package/dist/meta/otp.json

@@ -0,0 +1,145 @@
+{
+  "component": "otp",
+  "name": "Otp",
+  "components": [
+    {
+      "name": "OneTimePassword",
+      "isPrimary": true,
+      "rootClass": "k-otp",
+      "options": [
+        {
+          "name": "size",
+          "values": [
+            "small",
+            "medium",
+            "large"
+          ],
+          "default": null
+        }
+      ],
+      "states": [
+        "invalid",
+        "disabled"
+      ],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "role=\"group\"",
+          "description": "Sets the proper role for the OTP."
+        },
+        {
+          "prop": null,
+          "attribute": "type=\"hidden\"",
+          "description": "The hidden input holding the OTP inputs value."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-hidden=\"true\"",
+          "description": "Hides the hidden input from assistive technologies."
+        }
+      ],
+      "keyboard": [
+        {
+          "trigger": "Typing in the input",
+          "behavior": "Sets the value in the input and moves the focus to the next focusable input in the OTP. (if any)"
+        },
+        {
+          "trigger": "Tab",
+          "behavior": "Focuses the next input in the OTP. If the focus is on the last input, focuses the next focusable element on the page."
+        },
+        {
+          "trigger": "Shift + Tab",
+          "behavior": "Focuses the previous input in the OTP. If the focus is on the first input, focuses the previous focusable element before the OTP."
+        },
+        {
+          "trigger": "ArrowRight",
+          "behavior": "Moves the focus to the next focusable input in the OTP. (if any)"
+        },
+        {
+          "trigger": "ArrowLeft",
+          "behavior": "Moves the focus to the previous focusable input in the OTP. (if any)"
+        },
+        {
+          "trigger": "Backspace",
+          "behavior": "Deletes the value of the focused input and moves the focus on the previous input. (if any)."
+        },
+        {
+          "trigger": "Delete",
+          "behavior": "Deletes the value of the focused input."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Auto-advance",
+          "behavior": "Focus moves to the next input automatically after each character is entered."
+        },
+        {
+          "trigger": "Paste",
+          "behavior": "Pasting a code string fills all inputs at once."
+        },
+        {
+          "trigger": "Separator",
+          "behavior": "Groups of inputs can be visually separated by divider characters."
+        },
+        {
+          "trigger": "Masked",
+          "behavior": "Characters can be hidden like a password field."
+        }
+      ]
+    },
+    {
+      "name": "OneTimePasswordInput",
+      "isPrimary": false,
+      "rootClass": "k-otp-input",
+      "options": [
+        {
+          "name": "size",
+          "values": [
+            "small",
+            "medium",
+            "large"
+          ],
+          "default": null
+        },
+        {
+          "name": "rounded",
+          "values": [
+            "none",
+            "small",
+            "medium",
+            "large",
+            "full"
+          ],
+          "default": null
+        },
+        {
+          "name": "fillMode",
+          "values": [
+            "solid",
+            "flat",
+            "outline"
+          ],
+          "default": null
+        }
+      ],
+      "states": [
+        "hover",
+        "focus",
+        "valid",
+        "invalid",
+        "required",
+        "disabled",
+        "readonly"
+      ],
+      "aria": [],
+      "keyboard": [],
+      "ux": []
+    }
+  ],
+  "resources": [
+    {
+      "url": "https://www.w3.org/TR/wai-aria-1.2/#textbox",
+      "text": "WAI-ARIA Specification for the TextBox"
+    }
+  ]
+}

package/dist/meta/overlay.json

@@ -0,0 +1,30 @@
+{
+  "component": "overlay",
+  "name": "Overlay",
+  "components": [
+    {
+      "name": "Overlay",
+      "isPrimary": true,
+      "rootClass": "k-overlay",
+      "options": [],
+      "states": [],
+      "aria": [],
+      "keyboard": [],
+      "ux": [
+        {
+          "trigger": "Backdrop",
+          "behavior": "Renders a semi-transparent layer over the page content."
+        },
+        {
+          "trigger": "Click-outside",
+          "behavior": "Can trigger a close action on the associated dialog or panel when clicked."
+        },
+        {
+          "trigger": "Scroll lock",
+          "behavior": "Prevents the body from scrolling while the overlay is visible."
+        }
+      ]
+    }
+  ],
+  "resources": []
+}

package/dist/meta/pager.json

@@ -0,0 +1,169 @@
+{
+  "component": "pager",
+  "name": "Pager",
+  "components": [
+    {
+      "name": "Pager",
+      "isPrimary": true,
+      "rootClass": "k-pager",
+      "options": [
+        {
+          "name": "size",
+          "values": [
+            "small",
+            "medium",
+            "large"
+          ],
+          "default": null
+        }
+      ],
+      "states": [
+        "focus",
+        "disabled"
+      ],
+      "aria": [
+        {
+          "prop": null,
+          "attribute": "role=\"application\"",
+          "description": "Indicates that the pager has its own keyboard navigation implemented."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-roledescription=\"pager\"",
+          "description": "Clarifies the role of the Pager."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-keyshortcuts=\"Enter ArrowRight ArrowLeft\"",
+          "description": "Announces the available keyboard shortcuts."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-label",
+          "description": "Announces the currently selected page and the number of available pages."
+        },
+        {
+          "prop": null,
+          "attribute": "role=\"button\"",
+          "description": "Specifies the role of the navigation element."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-disabled=\"true\"",
+          "description": "Present when the navigation button is non-interactive."
+        },
+        {
+          "prop": null,
+          "attribute": "title",
+          "description": "Specifies the purpose of each navigation button."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-label|title",
+          "description": "Specifies the purpose of each page link, e.g., Page 6."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-current=\"page\"",
+          "description": "Present on the currently selected page element."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-label|aria-labelledby",
+          "description": "The DropDownList requires a label to specify its purpose."
+        },
+        {
+          "prop": null,
+          "attribute": "aria-label",
+          "description": "The input requires a label to specify its purpose."
+        }
+      ],
+      "keyboard": [
+        {
+          "trigger": "Home",
+          "behavior": "Loads the first page of data if the current page is not the first one."
+        },
+        {
+          "trigger": "End",
+          "behavior": "Loads the last page of data if the current page is not the last one."
+        },
+        {
+          "trigger": "Enter",
+          "behavior": "Activates the inner Pager navigation."
+        },
+        {
+          "trigger": "Tab",
+          "behavior": "Navigates to the next focusable element on the page."
+        },
+        {
+          "trigger": "Shift + Tab",
+          "behavior": "Navigates to the previous focusable element on the page."
+        },
+        {
+          "trigger": "ArrowLeft",
+          "behavior": "Loads the previous page of data, if any."
+        },
+        {
+          "trigger": "ArrowRight",
+          "behavior": "Loads the next page of data, if any."
+        },
+        {
+          "trigger": "PageUp",
+          "behavior": "Loads the previous page of data, if any."
+        },
+        {
+          "trigger": "PageDown",
+          "behavior": "Loads the next page of data, if any."
+        },
+        {
+          "trigger": "Escape",
+          "behavior": "Moves the focus back to the wrapper element. Deactivates the inner Pager navigation."
+        },
+        {
+          "trigger": "Tab",
+          "behavior": "Navigates to the next focusable element in the Pager. If the current focus is on the last element, moves the focus to the first focusable item in the component."
+        },
+        {
+          "trigger": "Shift + Tab",
+          "behavior": "Navigates to the previous focusable element in the Pager. If the current focus is on the first element, moves the focus to the last focusable item in the component."
+        },
+        {
+          "trigger": "Enter",
+          "behavior": "For button items, and Pager input executes the currently focused action (page change)."
+        }
+      ],
+      "ux": [
+        {
+          "trigger": "Page buttons",
+          "behavior": "Numbered buttons navigate directly to a specific page."
+        },
+        {
+          "trigger": "Next / Previous",
+          "behavior": "Arrow buttons navigate to the adjacent page."
+        },
+        {
+          "trigger": "First / Last",
+          "behavior": "Buttons jump to the first or last page."
+        },
+        {
+          "trigger": "Page size",
+          "behavior": "A dropdown selects the number of items displayed per page."
+        },
+        {
+          "trigger": "Item count",
+          "behavior": "Displays the total number of records and the currently visible range."
+        }
+      ]
+    }
+  ],
+  "resources": [
+    {
+      "url": "https://www.w3.org/TR/wai-aria-1.2/#navigation",
+      "text": "WAI-ARIA Specification for Navigation"
+    },
+    {
+      "url": "https://a11y-style-guide.com/style-guide/section-navigation.html#kssref-navigation-pagination",
+      "text": "Accessibility Style Guide: Pagination"
+    }
+  ]
+}