|
2 | 2 |
|
3 | 3 | import '@ui5/webcomponents-ai/dist/Button.js'; |
4 | 4 | import type ButtonDesign from '@ui5/webcomponents/dist/types/ButtonDesign.js'; |
| 5 | +import type { AIButtonAccessibilityAttributes } from '@ui5/webcomponents-ai/dist/Button.js'; |
5 | 6 | import { withWebComponent } from '@ui5/webcomponents-react-base'; |
6 | 7 | import type { CommonProps, Ui5CustomEvent, Ui5DomRef } from '@ui5/webcomponents-react-base'; |
7 | 8 | import type { ReactNode } from 'react'; |
8 | 9 |
|
9 | 10 | interface ButtonAttributes { |
| 11 | + /** |
| 12 | + * Defines the additional accessibility attributes that will be applied to the component. |
| 13 | + * |
| 14 | + * This property allows for fine-tuned control of ARIA attributes for screen reader support. |
| 15 | + * It accepts an object with the following optional fields: |
| 16 | + * |
| 17 | + * - **root**: Accessibility attributes that will be applied to the root element. |
| 18 | + * - **hasPopup**: Indicates the availability and type of interactive popup element (such as a menu or dialog). |
| 19 | + * Accepts string values: `"dialog"`, `"grid"`, `"listbox"`, `"menu"`, or `"tree"`. |
| 20 | + * - **roleDescription**: Defines a human-readable description for the button's role. |
| 21 | + * Accepts any string value. |
| 22 | + * |
| 23 | + * - **arrowButton**: Accessibility attributes that will be applied to the arrow (split) button element. |
| 24 | + * - **hasPopup**: Indicates the type of popup triggered by the arrow button. |
| 25 | + * Accepts string values: `"dialog"`, `"grid"`, `"listbox"`, `"menu"`, or `"tree"`. |
| 26 | + * - **expanded**: Indicates whether the popup controlled by the arrow button is currently expanded. |
| 27 | + * Accepts boolean values: `true` or `false`. |
| 28 | + * |
| 29 | + * **Note:** Available since [v2.6.0](https://github.com/SAP/ui5-webcomponents/releases/tag/v2.6.0) of **@ui5/webcomponents-ai**. |
| 30 | + * @default {} |
| 31 | + */ |
| 32 | + accessibilityAttributes?: AIButtonAccessibilityAttributes; |
| 33 | + |
10 | 34 | /** |
11 | 35 | * Defines the active state of the arrow button in split mode. |
12 | 36 | * Set to true when the button is in split mode and a menu with additional options |
@@ -97,7 +121,7 @@ interface ButtonPropTypes |
97 | 121 | */ |
98 | 122 | const Button = withWebComponent<ButtonPropTypes, ButtonDomRef>( |
99 | 123 | 'ui5-ai-button', |
100 | | - ['design', 'state'], |
| 124 | + ['accessibilityAttributes', 'design', 'state'], |
101 | 125 | ['arrowButtonPressed', 'disabled'], |
102 | 126 | [], |
103 | 127 | ['arrow-button-click', 'click'], |
|
0 commit comments