@ui5/webcomponents-ai 2.20.0-rc.2 → 2.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -0
- package/dist/.tsbuildinfo +1 -1
- package/dist/Input.d.ts +2 -4
- package/dist/Input.js +2 -2
- package/dist/Input.js.map +1 -1
- package/dist/ToolbarLabel.d.ts +1 -1
- package/dist/ToolbarLabel.js +1 -1
- package/dist/ToolbarLabel.js.map +1 -1
- package/dist/custom-elements-internal.json +1781 -484
- package/dist/custom-elements.json +1484 -356
- package/dist/vscode.html-custom-data.json +97 -46
- package/dist/web-types.json +262 -127
- package/package.json +10 -8
package/dist/web-types.json
CHANGED
|
@@ -1,16 +1,29 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
|
|
3
3
|
"name": "@ui5/webcomponents-ai",
|
|
4
|
-
"version": "2.20.0
|
|
4
|
+
"version": "2.20.0",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
8
8
|
"elements": [
|
|
9
9
|
{
|
|
10
10
|
"name": "ui5-ai-button",
|
|
11
|
-
"description": "### Overview\n\nThe `ui5-ai-button` component serves as a button for AI-related scenarios. Users can trigger actions by clicking or tapping the `ui5-ai-button`\nor by pressing keyboard keys like [Enter] or [Space].\n\n### Usage\n\nFor the `ui5-ai-button` user interface, you can define one or more button states by placing `ui5-ai-button-state` components in their default slot.\nEach state has a name for identification and can include text, an icon, and an end icon, as needed for its purpose.\nYou can define a split mode for the `ui5-ai-button`, which will results in displaying an arrow button for additional actions.\n\nYou can choose from a set of predefined designs for `ui5-ai-button` (as in `ui5-button`) to match the desired styling.\n\nThe `ui5-ai-button` can be activated by clicking or tapping it. You can change the button state in the click event handler. When the button is\nin split mode, you can activate the default button action by clicking or tapping it, or by pressing keyboard keys like [Enter] or [Space].\nYou can activate the arrow button by clicking or tapping it, or by pressing keyboard keys like [Arrow Up], [Arrow Down], or [F4].\nTo display additional actions, you can attach a menu to the arrow button.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-ai/dist/Button.js\";`\n---\n\n\n### **Events:**\n - **
|
|
11
|
+
"description": "### Overview\n\nThe `ui5-ai-button` component serves as a button for AI-related scenarios. Users can trigger actions by clicking or tapping the `ui5-ai-button`\nor by pressing keyboard keys like [Enter] or [Space].\n\n### Usage\n\nFor the `ui5-ai-button` user interface, you can define one or more button states by placing `ui5-ai-button-state` components in their default slot.\nEach state has a name for identification and can include text, an icon, and an end icon, as needed for its purpose.\nYou can define a split mode for the `ui5-ai-button`, which will results in displaying an arrow button for additional actions.\n\nYou can choose from a set of predefined designs for `ui5-ai-button` (as in `ui5-button`) to match the desired styling.\n\nThe `ui5-ai-button` can be activated by clicking or tapping it. You can change the button state in the click event handler. When the button is\nin split mode, you can activate the default button action by clicking or tapping it, or by pressing keyboard keys like [Enter] or [Space].\nYou can activate the arrow button by clicking or tapping it, or by pressing keyboard keys like [Arrow Up], [Arrow Down], or [F4].\nTo display additional actions, you can attach a menu to the arrow button.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-ai/dist/Button.js\";`\n---\n\n\n### **Events:**\n - **arrow-button-click** - Fired when the component is in split mode and after the arrow button\nis activated either by clicking or tapping it or by using the [Arrow Up] / [Arrow Down],\n[Alt] + [Arrow Up]/ [Arrow Down], or [F4] keyboard keys.\n- **click** - Fired when the component is activated either with a\nmouse/tap or by using the Enter or Space key.\n\n### **Slots:**\n - **default** - Defines the available states of the component.\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that\nyou only use `ui5-ai-button-state` components in order to preserve the intended design.",
|
|
12
12
|
"doc-url": "",
|
|
13
13
|
"attributes": [
|
|
14
|
+
{
|
|
15
|
+
"name": "accessibility-attributes",
|
|
16
|
+
"description": "Defines the additional accessibility attributes that will be applied to the component.\n\nThis property allows for fine-tuned control of ARIA attributes for screen reader support.\nIt accepts an object with the following optional fields:\n\n- **root**: Accessibility attributes that will be applied to the root element.\n - **hasPopup**: Indicates the availability and type of interactive popup element (such as a menu or dialog).\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **roleDescription**: Defines a human-readable description for the button's role.\n Accepts any string value.\n - **title**: Specifies a tooltip or description for screen readers.\n Accepts any string value.\n- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or focus the button.\n\n- **arrowButton**: Accessibility attributes that will be applied to the arrow (split) button element.\n - **hasPopup**: Indicates the type of popup triggered by the arrow button.\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **expanded**: Indicates whether the popup controlled by the arrow button is currently expanded.\n Accepts boolean values: `true` or `false`.",
|
|
17
|
+
"value": {
|
|
18
|
+
"type": "AIButtonAccessibilityAttributes",
|
|
19
|
+
"default": "{}"
|
|
20
|
+
}
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"name": "arrow-button-pressed",
|
|
24
|
+
"description": "Defines the active state of the arrow button in split mode.\nSet to true when the button is in split mode and a menu with additional options\nis opened by the arrow button. Set back to false when the menu is closed.",
|
|
25
|
+
"value": { "type": "boolean", "default": "false" }
|
|
26
|
+
},
|
|
14
27
|
{
|
|
15
28
|
"name": "design",
|
|
16
29
|
"description": "Defines the component design.",
|
|
@@ -28,19 +41,6 @@
|
|
|
28
41
|
"name": "state",
|
|
29
42
|
"description": "Defines the current state of the component.",
|
|
30
43
|
"value": { "type": "string | undefined", "default": "undefined" }
|
|
31
|
-
},
|
|
32
|
-
{
|
|
33
|
-
"name": "arrow-button-pressed",
|
|
34
|
-
"description": "Defines the active state of the arrow button in split mode.\nSet to true when the button is in split mode and a menu with additional options\nis opened by the arrow button. Set back to false when the menu is closed.",
|
|
35
|
-
"value": { "type": "boolean", "default": "false" }
|
|
36
|
-
},
|
|
37
|
-
{
|
|
38
|
-
"name": "accessibility-attributes",
|
|
39
|
-
"description": "Defines the additional accessibility attributes that will be applied to the component.\n\nThis property allows for fine-tuned control of ARIA attributes for screen reader support.\nIt accepts an object with the following optional fields:\n\n- **root**: Accessibility attributes that will be applied to the root element.\n - **hasPopup**: Indicates the availability and type of interactive popup element (such as a menu or dialog).\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **roleDescription**: Defines a human-readable description for the button's role.\n Accepts any string value.\n - **title**: Specifies a tooltip or description for screen readers.\n Accepts any string value.\n- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or focus the button.\n\n- **arrowButton**: Accessibility attributes that will be applied to the arrow (split) button element.\n - **hasPopup**: Indicates the type of popup triggered by the arrow button.\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **expanded**: Indicates whether the popup controlled by the arrow button is currently expanded.\n Accepts boolean values: `true` or `false`.",
|
|
40
|
-
"value": {
|
|
41
|
-
"type": "AIButtonAccessibilityAttributes",
|
|
42
|
-
"default": "{}"
|
|
43
|
-
}
|
|
44
44
|
}
|
|
45
45
|
],
|
|
46
46
|
"slots": [
|
|
@@ -50,17 +50,27 @@
|
|
|
50
50
|
}
|
|
51
51
|
],
|
|
52
52
|
"events": [
|
|
53
|
-
{
|
|
54
|
-
"name": "click",
|
|
55
|
-
"description": "Fired when the component is activated either with a\nmouse/tap or by using the Enter or Space key."
|
|
56
|
-
},
|
|
57
53
|
{
|
|
58
54
|
"name": "arrow-button-click",
|
|
59
55
|
"description": "Fired when the component is in split mode and after the arrow button\nis activated either by clicking or tapping it or by using the [Arrow Up] / [Arrow Down],\n[Alt] + [Arrow Up]/ [Arrow Down], or [F4] keyboard keys."
|
|
56
|
+
},
|
|
57
|
+
{
|
|
58
|
+
"name": "click",
|
|
59
|
+
"description": "Fired when the component is activated either with a\nmouse/tap or by using the Enter or Space key."
|
|
60
60
|
}
|
|
61
61
|
],
|
|
62
62
|
"js": {
|
|
63
63
|
"properties": [
|
|
64
|
+
{
|
|
65
|
+
"name": "accessibility-attributes",
|
|
66
|
+
"description": "Defines the additional accessibility attributes that will be applied to the component.\n\nThis property allows for fine-tuned control of ARIA attributes for screen reader support.\nIt accepts an object with the following optional fields:\n\n- **root**: Accessibility attributes that will be applied to the root element.\n - **hasPopup**: Indicates the availability and type of interactive popup element (such as a menu or dialog).\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **roleDescription**: Defines a human-readable description for the button's role.\n Accepts any string value.\n - **title**: Specifies a tooltip or description for screen readers.\n Accepts any string value.\n- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or focus the button.\n\n- **arrowButton**: Accessibility attributes that will be applied to the arrow (split) button element.\n - **hasPopup**: Indicates the type of popup triggered by the arrow button.\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **expanded**: Indicates whether the popup controlled by the arrow button is currently expanded.\n Accepts boolean values: `true` or `false`.",
|
|
67
|
+
"value": { "type": "AIButtonAccessibilityAttributes" }
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
"name": "arrow-button-pressed",
|
|
71
|
+
"description": "Defines the active state of the arrow button in split mode.\nSet to true when the button is in split mode and a menu with additional options\nis opened by the arrow button. Set back to false when the menu is closed.",
|
|
72
|
+
"value": { "type": "boolean" }
|
|
73
|
+
},
|
|
64
74
|
{
|
|
65
75
|
"name": "design",
|
|
66
76
|
"description": "Defines the component design.",
|
|
@@ -77,26 +87,16 @@
|
|
|
77
87
|
"name": "state",
|
|
78
88
|
"description": "Defines the current state of the component.",
|
|
79
89
|
"value": { "type": "string | undefined" }
|
|
80
|
-
},
|
|
81
|
-
{
|
|
82
|
-
"name": "arrow-button-pressed",
|
|
83
|
-
"description": "Defines the active state of the arrow button in split mode.\nSet to true when the button is in split mode and a menu with additional options\nis opened by the arrow button. Set back to false when the menu is closed.",
|
|
84
|
-
"value": { "type": "boolean" }
|
|
85
|
-
},
|
|
86
|
-
{
|
|
87
|
-
"name": "accessibility-attributes",
|
|
88
|
-
"description": "Defines the additional accessibility attributes that will be applied to the component.\n\nThis property allows for fine-tuned control of ARIA attributes for screen reader support.\nIt accepts an object with the following optional fields:\n\n- **root**: Accessibility attributes that will be applied to the root element.\n - **hasPopup**: Indicates the availability and type of interactive popup element (such as a menu or dialog).\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **roleDescription**: Defines a human-readable description for the button's role.\n Accepts any string value.\n - **title**: Specifies a tooltip or description for screen readers.\n Accepts any string value.\n- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or focus the button.\n\n- **arrowButton**: Accessibility attributes that will be applied to the arrow (split) button element.\n - **hasPopup**: Indicates the type of popup triggered by the arrow button.\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **expanded**: Indicates whether the popup controlled by the arrow button is currently expanded.\n Accepts boolean values: `true` or `false`.",
|
|
89
|
-
"value": { "type": "AIButtonAccessibilityAttributes" }
|
|
90
90
|
}
|
|
91
91
|
],
|
|
92
92
|
"events": [
|
|
93
|
-
{
|
|
94
|
-
"name": "click",
|
|
95
|
-
"description": "Fired when the component is activated either with a\nmouse/tap or by using the Enter or Space key."
|
|
96
|
-
},
|
|
97
93
|
{
|
|
98
94
|
"name": "arrow-button-click",
|
|
99
95
|
"description": "Fired when the component is in split mode and after the arrow button\nis activated either by clicking or tapping it or by using the [Arrow Up] / [Arrow Down],\n[Alt] + [Arrow Up]/ [Arrow Down], or [F4] keyboard keys."
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
"name": "click",
|
|
99
|
+
"description": "Fired when the component is activated either with a\nmouse/tap or by using the Enter or Space key."
|
|
100
100
|
}
|
|
101
101
|
]
|
|
102
102
|
}
|
|
@@ -107,13 +107,8 @@
|
|
|
107
107
|
"doc-url": "",
|
|
108
108
|
"attributes": [
|
|
109
109
|
{
|
|
110
|
-
"name": "
|
|
111
|
-
"description": "Defines the
|
|
112
|
-
"value": { "type": "string | undefined", "default": "undefined" }
|
|
113
|
-
},
|
|
114
|
-
{
|
|
115
|
-
"name": "text",
|
|
116
|
-
"description": "Defines the text of the button in this state.",
|
|
110
|
+
"name": "end-icon",
|
|
111
|
+
"description": "Defines the icon to be displayed as graphical element within the component after the text.\nThe SAP-icons font provides numerous options.\n\n**Example:**\n\nSee all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).",
|
|
117
112
|
"value": { "type": "string | undefined", "default": "undefined" }
|
|
118
113
|
},
|
|
119
114
|
{
|
|
@@ -122,27 +117,27 @@
|
|
|
122
117
|
"value": { "type": "string | undefined", "default": "undefined" }
|
|
123
118
|
},
|
|
124
119
|
{
|
|
125
|
-
"name": "
|
|
126
|
-
"description": "Defines the
|
|
120
|
+
"name": "name",
|
|
121
|
+
"description": "Defines the name of the button state.",
|
|
127
122
|
"value": { "type": "string | undefined", "default": "undefined" }
|
|
128
123
|
},
|
|
129
124
|
{
|
|
130
125
|
"name": "show-arrow-button",
|
|
131
126
|
"description": "Defines if the component is in split button mode.",
|
|
132
127
|
"value": { "type": "boolean", "default": "false" }
|
|
128
|
+
},
|
|
129
|
+
{
|
|
130
|
+
"name": "text",
|
|
131
|
+
"description": "Defines the text of the button in this state.",
|
|
132
|
+
"value": { "type": "string | undefined", "default": "undefined" }
|
|
133
133
|
}
|
|
134
134
|
],
|
|
135
135
|
"events": [],
|
|
136
136
|
"js": {
|
|
137
137
|
"properties": [
|
|
138
138
|
{
|
|
139
|
-
"name": "
|
|
140
|
-
"description": "Defines the
|
|
141
|
-
"value": { "type": "string | undefined" }
|
|
142
|
-
},
|
|
143
|
-
{
|
|
144
|
-
"name": "text",
|
|
145
|
-
"description": "Defines the text of the button in this state.",
|
|
139
|
+
"name": "end-icon",
|
|
140
|
+
"description": "Defines the icon to be displayed as graphical element within the component after the text.\nThe SAP-icons font provides numerous options.\n\n**Example:**\n\nSee all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).",
|
|
146
141
|
"value": { "type": "string | undefined" }
|
|
147
142
|
},
|
|
148
143
|
{
|
|
@@ -151,14 +146,19 @@
|
|
|
151
146
|
"value": { "type": "string | undefined" }
|
|
152
147
|
},
|
|
153
148
|
{
|
|
154
|
-
"name": "
|
|
155
|
-
"description": "Defines the
|
|
149
|
+
"name": "name",
|
|
150
|
+
"description": "Defines the name of the button state.",
|
|
156
151
|
"value": { "type": "string | undefined" }
|
|
157
152
|
},
|
|
158
153
|
{
|
|
159
154
|
"name": "show-arrow-button",
|
|
160
155
|
"description": "Defines if the component is in split button mode.",
|
|
161
156
|
"value": { "type": "boolean" }
|
|
157
|
+
},
|
|
158
|
+
{
|
|
159
|
+
"name": "text",
|
|
160
|
+
"description": "Defines the text of the button in this state.",
|
|
161
|
+
"value": { "type": "string | undefined" }
|
|
162
162
|
}
|
|
163
163
|
],
|
|
164
164
|
"events": []
|
|
@@ -174,15 +174,15 @@
|
|
|
174
174
|
"description": "Indicates the index of the currently displayed version.",
|
|
175
175
|
"value": { "type": "number", "default": "0" }
|
|
176
176
|
},
|
|
177
|
-
{
|
|
178
|
-
"name": "total-versions",
|
|
179
|
-
"description": "Indicates the total number of result versions available.\n\nWhen not set or set to 0, the versioning will be hidden.",
|
|
180
|
-
"value": { "type": "number", "default": "0" }
|
|
181
|
-
},
|
|
182
177
|
{
|
|
183
178
|
"name": "loading",
|
|
184
179
|
"description": "Defines whether the AI Writing Assistant is currently loading.\n\nWhen `true`, indicates that an AI action is in progress.",
|
|
185
180
|
"value": { "type": "boolean", "default": "false" }
|
|
181
|
+
},
|
|
182
|
+
{
|
|
183
|
+
"name": "total-versions",
|
|
184
|
+
"description": "Indicates the total number of result versions available.\n\nWhen not set or set to 0, the versioning will be hidden.",
|
|
185
|
+
"value": { "type": "number", "default": "0" }
|
|
186
186
|
}
|
|
187
187
|
],
|
|
188
188
|
"slots": [
|
|
@@ -216,15 +216,15 @@
|
|
|
216
216
|
"description": "Indicates the index of the currently displayed version.",
|
|
217
217
|
"value": { "type": "number" }
|
|
218
218
|
},
|
|
219
|
-
{
|
|
220
|
-
"name": "total-versions",
|
|
221
|
-
"description": "Indicates the total number of result versions available.\n\nWhen not set or set to 0, the versioning will be hidden.",
|
|
222
|
-
"value": { "type": "number" }
|
|
223
|
-
},
|
|
224
219
|
{
|
|
225
220
|
"name": "loading",
|
|
226
221
|
"description": "Defines whether the AI Writing Assistant is currently loading.\n\nWhen `true`, indicates that an AI action is in progress.",
|
|
227
222
|
"value": { "type": "boolean" }
|
|
223
|
+
},
|
|
224
|
+
{
|
|
225
|
+
"name": "total-versions",
|
|
226
|
+
"description": "Indicates the total number of result versions available.\n\nWhen not set or set to 0, the versioning will be hidden.",
|
|
227
|
+
"value": { "type": "number" }
|
|
228
228
|
}
|
|
229
229
|
],
|
|
230
230
|
"events": [
|
|
@@ -249,13 +249,23 @@
|
|
|
249
249
|
},
|
|
250
250
|
{
|
|
251
251
|
"name": "ui5-ai-prompt-input",
|
|
252
|
-
"description": "### Overview\n\nThe `ui5-ai-prompt-input` component allows the user to write custom instructions in natural language, so that AI is guided to generate content tailored to user needs.\n\n**Note:** The web component is in an experimental state\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-ai/dist/PromptInput.js\"`\n---\n\n\n### **Events:**\n - **
|
|
252
|
+
"description": "### Overview\n\nThe `ui5-ai-prompt-input` component allows the user to write custom instructions in natural language, so that AI is guided to generate content tailored to user needs.\n\n**Note:** The web component is in an experimental state\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-ai/dist/PromptInput.js\"`\n---\n\n\n### **Events:**\n - **change** - Fired when the input operation has finished by pressing Enter\nor on focusout.\n- **input** - Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected.\n- **submit** - Fired when the input operation has finished by pressing Enter\nor AI button is clicked.\n\n### **Slots:**\n - **default** - Defines the suggestion items.\n\n**Note:** The suggestions would be displayed only if the `showSuggestions`\nproperty is set to `true`.\n\n**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.\n- **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
|
|
253
253
|
"doc-url": "",
|
|
254
254
|
"attributes": [
|
|
255
255
|
{
|
|
256
|
-
"name": "
|
|
257
|
-
"description": "Defines the
|
|
258
|
-
"value": { "type": "
|
|
256
|
+
"name": "disabled",
|
|
257
|
+
"description": "Defines whether the component is in disabled state.\n\n**Note:** A disabled component is completely noninteractive.",
|
|
258
|
+
"value": { "type": "boolean", "default": "false" }
|
|
259
|
+
},
|
|
260
|
+
{
|
|
261
|
+
"name": "label",
|
|
262
|
+
"description": "Defines the label of the input field.",
|
|
263
|
+
"value": { "type": "string | undefined", "default": "undefined" }
|
|
264
|
+
},
|
|
265
|
+
{
|
|
266
|
+
"name": "maxlength",
|
|
267
|
+
"description": "Sets the maximum number of characters available in the input field.",
|
|
268
|
+
"value": { "type": "number | undefined", "default": "undefined" }
|
|
259
269
|
},
|
|
260
270
|
{
|
|
261
271
|
"name": "placeholder",
|
|
@@ -263,9 +273,9 @@
|
|
|
263
273
|
"value": { "type": "string | undefined", "default": "undefined" }
|
|
264
274
|
},
|
|
265
275
|
{
|
|
266
|
-
"name": "
|
|
267
|
-
"description": "Defines the
|
|
268
|
-
"value": { "type": "
|
|
276
|
+
"name": "readonly",
|
|
277
|
+
"description": "Defines whether the component is read-only.\n\n**Note:** A read-only component is not editable,\nbut still provides visual feedback upon user interaction.",
|
|
278
|
+
"value": { "type": "boolean", "default": "false" }
|
|
269
279
|
},
|
|
270
280
|
{
|
|
271
281
|
"name": "show-clear-icon",
|
|
@@ -278,19 +288,14 @@
|
|
|
278
288
|
"value": { "type": "boolean", "default": "false" }
|
|
279
289
|
},
|
|
280
290
|
{
|
|
281
|
-
"name": "
|
|
282
|
-
"description": "Defines whether the component
|
|
283
|
-
"value": { "type": "boolean", "default": "false" }
|
|
284
|
-
},
|
|
285
|
-
{
|
|
286
|
-
"name": "readonly",
|
|
287
|
-
"description": "Defines whether the component is read-only.\n\n**Note:** A read-only component is not editable,\nbut still provides visual feedback upon user interaction.",
|
|
291
|
+
"name": "show-suggestions",
|
|
292
|
+
"description": "Defines whether the component should show suggestions, if such are present.",
|
|
288
293
|
"value": { "type": "boolean", "default": "false" }
|
|
289
294
|
},
|
|
290
295
|
{
|
|
291
|
-
"name": "
|
|
292
|
-
"description": "
|
|
293
|
-
"value": { "type": "
|
|
296
|
+
"name": "value",
|
|
297
|
+
"description": "Defines the value of the component.",
|
|
298
|
+
"value": { "type": "string", "default": "\"\"" }
|
|
294
299
|
},
|
|
295
300
|
{
|
|
296
301
|
"name": "value-state",
|
|
@@ -299,11 +304,6 @@
|
|
|
299
304
|
"type": "\"Positive\" | \"Negative\" | \"None\" | \"Critical\" | \"Information\"",
|
|
300
305
|
"default": "\"None\""
|
|
301
306
|
}
|
|
302
|
-
},
|
|
303
|
-
{
|
|
304
|
-
"name": "show-suggestions",
|
|
305
|
-
"description": "Defines whether the component should show suggestions, if such are present.",
|
|
306
|
-
"value": { "type": "boolean", "default": "false" }
|
|
307
307
|
}
|
|
308
308
|
],
|
|
309
309
|
"slots": [
|
|
@@ -318,24 +318,34 @@
|
|
|
318
318
|
],
|
|
319
319
|
"events": [
|
|
320
320
|
{
|
|
321
|
-
"name": "
|
|
322
|
-
"description": "Fired when the input operation has finished by pressing Enter\nor
|
|
321
|
+
"name": "change",
|
|
322
|
+
"description": "Fired when the input operation has finished by pressing Enter\nor on focusout."
|
|
323
323
|
},
|
|
324
324
|
{
|
|
325
325
|
"name": "input",
|
|
326
326
|
"description": "Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected."
|
|
327
327
|
},
|
|
328
328
|
{
|
|
329
|
-
"name": "
|
|
330
|
-
"description": "Fired when the input operation has finished by pressing Enter\nor
|
|
329
|
+
"name": "submit",
|
|
330
|
+
"description": "Fired when the input operation has finished by pressing Enter\nor AI button is clicked."
|
|
331
331
|
}
|
|
332
332
|
],
|
|
333
333
|
"js": {
|
|
334
334
|
"properties": [
|
|
335
335
|
{
|
|
336
|
-
"name": "
|
|
337
|
-
"description": "Defines the
|
|
338
|
-
"value": { "type": "
|
|
336
|
+
"name": "disabled",
|
|
337
|
+
"description": "Defines whether the component is in disabled state.\n\n**Note:** A disabled component is completely noninteractive.",
|
|
338
|
+
"value": { "type": "boolean" }
|
|
339
|
+
},
|
|
340
|
+
{
|
|
341
|
+
"name": "label",
|
|
342
|
+
"description": "Defines the label of the input field.",
|
|
343
|
+
"value": { "type": "string | undefined" }
|
|
344
|
+
},
|
|
345
|
+
{
|
|
346
|
+
"name": "maxlength",
|
|
347
|
+
"description": "Sets the maximum number of characters available in the input field.",
|
|
348
|
+
"value": { "type": "number | undefined" }
|
|
339
349
|
},
|
|
340
350
|
{
|
|
341
351
|
"name": "placeholder",
|
|
@@ -343,9 +353,9 @@
|
|
|
343
353
|
"value": { "type": "string | undefined" }
|
|
344
354
|
},
|
|
345
355
|
{
|
|
346
|
-
"name": "
|
|
347
|
-
"description": "Defines the
|
|
348
|
-
"value": { "type": "
|
|
356
|
+
"name": "readonly",
|
|
357
|
+
"description": "Defines whether the component is read-only.\n\n**Note:** A read-only component is not editable,\nbut still provides visual feedback upon user interaction.",
|
|
358
|
+
"value": { "type": "boolean" }
|
|
349
359
|
},
|
|
350
360
|
{
|
|
351
361
|
"name": "show-clear-icon",
|
|
@@ -358,19 +368,14 @@
|
|
|
358
368
|
"value": { "type": "boolean" }
|
|
359
369
|
},
|
|
360
370
|
{
|
|
361
|
-
"name": "
|
|
362
|
-
"description": "Defines whether the component
|
|
363
|
-
"value": { "type": "boolean" }
|
|
364
|
-
},
|
|
365
|
-
{
|
|
366
|
-
"name": "readonly",
|
|
367
|
-
"description": "Defines whether the component is read-only.\n\n**Note:** A read-only component is not editable,\nbut still provides visual feedback upon user interaction.",
|
|
371
|
+
"name": "show-suggestions",
|
|
372
|
+
"description": "Defines whether the component should show suggestions, if such are present.",
|
|
368
373
|
"value": { "type": "boolean" }
|
|
369
374
|
},
|
|
370
375
|
{
|
|
371
|
-
"name": "
|
|
372
|
-
"description": "
|
|
373
|
-
"value": { "type": "
|
|
376
|
+
"name": "value",
|
|
377
|
+
"description": "Defines the value of the component.",
|
|
378
|
+
"value": { "type": "string" }
|
|
374
379
|
},
|
|
375
380
|
{
|
|
376
381
|
"name": "value-state",
|
|
@@ -378,34 +383,34 @@
|
|
|
378
383
|
"value": {
|
|
379
384
|
"type": "\"Positive\" | \"Negative\" | \"None\" | \"Critical\" | \"Information\""
|
|
380
385
|
}
|
|
381
|
-
},
|
|
382
|
-
{
|
|
383
|
-
"name": "show-suggestions",
|
|
384
|
-
"description": "Defines whether the component should show suggestions, if such are present.",
|
|
385
|
-
"value": { "type": "boolean" }
|
|
386
386
|
}
|
|
387
387
|
],
|
|
388
388
|
"events": [
|
|
389
389
|
{
|
|
390
|
-
"name": "
|
|
391
|
-
"description": "Fired when the input operation has finished by pressing Enter\nor
|
|
390
|
+
"name": "change",
|
|
391
|
+
"description": "Fired when the input operation has finished by pressing Enter\nor on focusout."
|
|
392
392
|
},
|
|
393
393
|
{
|
|
394
394
|
"name": "input",
|
|
395
395
|
"description": "Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected."
|
|
396
396
|
},
|
|
397
397
|
{
|
|
398
|
-
"name": "
|
|
399
|
-
"description": "Fired when the input operation has finished by pressing Enter\nor
|
|
398
|
+
"name": "submit",
|
|
399
|
+
"description": "Fired when the input operation has finished by pressing Enter\nor AI button is clicked."
|
|
400
400
|
}
|
|
401
401
|
]
|
|
402
402
|
}
|
|
403
403
|
},
|
|
404
404
|
{
|
|
405
405
|
"name": "ui5-ai-textarea",
|
|
406
|
-
"description": "### Overview\n\nThe `ui5-ai-textarea` component extends the standard TextArea with Writing Assistant capabilities.\nIt provides AI-powered text generation, editing suggestions, and version management functionality.\n\n### Structure\nThe `ui5-ai-textarea` consists of the following elements:\n- TextArea: The main text input area with all standard textarea functionality\n- WritingAssistant: Dedicated toolbar containing:\n - Versioning: A component with left/right navigation buttons and a label for browsing AI-generated versions\n - AI Button: Opens a menu that can be extended with custom AI generation options through slotting\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-ai/dist/TextArea.js\";`\n---\n\n\n### **Events:**\n - **
|
|
406
|
+
"description": "### Overview\n\nThe `ui5-ai-textarea` component extends the standard TextArea with Writing Assistant capabilities.\nIt provides AI-powered text generation, editing suggestions, and version management functionality.\n\n### Structure\nThe `ui5-ai-textarea` consists of the following elements:\n- TextArea: The main text input area with all standard textarea functionality\n- WritingAssistant: Dedicated toolbar containing:\n - Versioning: A component with left/right navigation buttons and a label for browsing AI-generated versions\n - AI Button: Opens a menu that can be extended with custom AI generation options through slotting\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-ai/dist/TextArea.js\";`\n---\n\n\n### **Events:**\n - **stop-generation** - Fired when the user requests to stop AI text generation.\n- **version-change** - Fired when the user clicks on version navigation buttons.\n\n### **Slots:**\n - **menu** - Defines a slot for `ui5-menu` integration. This slot allows you to pass a `ui5-menu` instance that will be associated with the assistant.",
|
|
407
407
|
"doc-url": "",
|
|
408
408
|
"attributes": [
|
|
409
|
+
{
|
|
410
|
+
"name": "current-version",
|
|
411
|
+
"description": "Indicates the index of the currently displayed version.",
|
|
412
|
+
"value": { "type": "number", "default": "0" }
|
|
413
|
+
},
|
|
409
414
|
{
|
|
410
415
|
"name": "loading",
|
|
411
416
|
"description": "Defines whether the `ui5-ai-textarea` is currently in a loading(processing) state.",
|
|
@@ -416,11 +421,6 @@
|
|
|
416
421
|
"description": "Defines the prompt description of the current action.",
|
|
417
422
|
"value": { "type": "string", "default": "\"\"" }
|
|
418
423
|
},
|
|
419
|
-
{
|
|
420
|
-
"name": "current-version",
|
|
421
|
-
"description": "Indicates the index of the currently displayed version.",
|
|
422
|
-
"value": { "type": "number", "default": "0" }
|
|
423
|
-
},
|
|
424
424
|
{
|
|
425
425
|
"name": "total-versions",
|
|
426
426
|
"description": "Indicates the total number of result versions available.\n\nNotes:\nVersioning is hidden if the value is `0`",
|
|
@@ -434,17 +434,22 @@
|
|
|
434
434
|
}
|
|
435
435
|
],
|
|
436
436
|
"events": [
|
|
437
|
-
{
|
|
438
|
-
"name": "version-change",
|
|
439
|
-
"description": "Fired when the user clicks on version navigation buttons."
|
|
440
|
-
},
|
|
441
437
|
{
|
|
442
438
|
"name": "stop-generation",
|
|
443
439
|
"description": "Fired when the user requests to stop AI text generation."
|
|
440
|
+
},
|
|
441
|
+
{
|
|
442
|
+
"name": "version-change",
|
|
443
|
+
"description": "Fired when the user clicks on version navigation buttons."
|
|
444
444
|
}
|
|
445
445
|
],
|
|
446
446
|
"js": {
|
|
447
447
|
"properties": [
|
|
448
|
+
{
|
|
449
|
+
"name": "current-version",
|
|
450
|
+
"description": "Indicates the index of the currently displayed version.",
|
|
451
|
+
"value": { "type": "number" }
|
|
452
|
+
},
|
|
448
453
|
{
|
|
449
454
|
"name": "loading",
|
|
450
455
|
"description": "Defines whether the `ui5-ai-textarea` is currently in a loading(processing) state.",
|
|
@@ -456,13 +461,78 @@
|
|
|
456
461
|
"value": { "type": "string" }
|
|
457
462
|
},
|
|
458
463
|
{
|
|
459
|
-
"name": "
|
|
460
|
-
"description": "Indicates the
|
|
464
|
+
"name": "total-versions",
|
|
465
|
+
"description": "Indicates the total number of result versions available.\n\nNotes:\nVersioning is hidden if the value is `0`",
|
|
461
466
|
"value": { "type": "number" }
|
|
467
|
+
}
|
|
468
|
+
],
|
|
469
|
+
"events": [
|
|
470
|
+
{
|
|
471
|
+
"name": "stop-generation",
|
|
472
|
+
"description": "Fired when the user requests to stop AI text generation."
|
|
462
473
|
},
|
|
463
474
|
{
|
|
464
|
-
"name": "
|
|
465
|
-
"description": "
|
|
475
|
+
"name": "version-change",
|
|
476
|
+
"description": "Fired when the user clicks on version navigation buttons."
|
|
477
|
+
}
|
|
478
|
+
]
|
|
479
|
+
}
|
|
480
|
+
},
|
|
481
|
+
{
|
|
482
|
+
"name": "ui5-ai-toolbar-label",
|
|
483
|
+
"description": "### Overview\nThe `ui5-ai-toolbar-label` represents a text label,\nused in the `ui5-toolbar`.\n\n### ES6 Module Import\n`import \"@ui5/webcomponents-ai/dist/ToolbarLabel.js\";`\n---\n",
|
|
484
|
+
"doc-url": "",
|
|
485
|
+
"attributes": [
|
|
486
|
+
{
|
|
487
|
+
"name": "text",
|
|
488
|
+
"description": "Defines the text of the label.",
|
|
489
|
+
"value": { "type": "string", "default": "\"\"" }
|
|
490
|
+
}
|
|
491
|
+
],
|
|
492
|
+
"events": [],
|
|
493
|
+
"js": {
|
|
494
|
+
"properties": [
|
|
495
|
+
{
|
|
496
|
+
"name": "text",
|
|
497
|
+
"description": "Defines the text of the label.",
|
|
498
|
+
"value": { "type": "string" }
|
|
499
|
+
}
|
|
500
|
+
],
|
|
501
|
+
"events": []
|
|
502
|
+
}
|
|
503
|
+
},
|
|
504
|
+
{
|
|
505
|
+
"name": "ui5-ai-versioning",
|
|
506
|
+
"description": "### Overview\n\nThe `ui5-ai-versioning` component provides navigation controls for AI-generated content versions.\nIt displays the current version index and total versions, with previous/next navigation buttons.\nThis component extends ToolbarItem to participate in toolbar overflow behavior as a single unit.\n\n### Structure\nThe `ui5-ai-versioning` consists of the following elements:\n- Previous Button: Navigates to the previous version (disabled when at first version)\n- Version Counter: Shows current version / total versions (e.g., \"2 / 5\")\n- Next Button: Navigates to the nex\nt version (disabled when at last version)\n\n### Focus Management\nThe component automatically manages focus when users reach version boundaries,\nmoving focus to the available navigation button when one becomes disabled.\n\n### Responsive Behavior\nWhen used in a toolbar, the entire versioning component (buttons + label) will overflow\ntogether as a single unit when there is insufficient space.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-ai/dist/Versioning.js\";`\n---\n\n\n### **Events:**\n - **version-change** - Fired when the user clicks on version navigation buttons.",
|
|
507
|
+
"doc-url": "",
|
|
508
|
+
"attributes": [
|
|
509
|
+
{
|
|
510
|
+
"name": "current-step",
|
|
511
|
+
"description": "Indicates the index of the currently displayed result version.\n\nThis property represents the current position in the version history.",
|
|
512
|
+
"value": { "type": "number", "default": "0" }
|
|
513
|
+
},
|
|
514
|
+
{
|
|
515
|
+
"name": "total-steps",
|
|
516
|
+
"description": "The total number of available result versions.\n\nNote: Versioning is hidden if the value is `0`.",
|
|
517
|
+
"value": { "type": "number", "default": "0" }
|
|
518
|
+
}
|
|
519
|
+
],
|
|
520
|
+
"events": [
|
|
521
|
+
{
|
|
522
|
+
"name": "version-change",
|
|
523
|
+
"description": "Fired when the user clicks on version navigation buttons."
|
|
524
|
+
}
|
|
525
|
+
],
|
|
526
|
+
"js": {
|
|
527
|
+
"properties": [
|
|
528
|
+
{
|
|
529
|
+
"name": "current-step",
|
|
530
|
+
"description": "Indicates the index of the currently displayed result version.\n\nThis property represents the current position in the version history.",
|
|
531
|
+
"value": { "type": "number" }
|
|
532
|
+
},
|
|
533
|
+
{
|
|
534
|
+
"name": "total-steps",
|
|
535
|
+
"description": "The total number of available result versions.\n\nNote: Versioning is hidden if the value is `0`.",
|
|
466
536
|
"value": { "type": "number" }
|
|
467
537
|
}
|
|
468
538
|
],
|
|
@@ -470,10 +540,75 @@
|
|
|
470
540
|
{
|
|
471
541
|
"name": "version-change",
|
|
472
542
|
"description": "Fired when the user clicks on version navigation buttons."
|
|
543
|
+
}
|
|
544
|
+
]
|
|
545
|
+
}
|
|
546
|
+
},
|
|
547
|
+
{
|
|
548
|
+
"name": "ui5-ai-writing-assistant",
|
|
549
|
+
"description": "### Overview\n\nThe `ui5-ai-textarea-toolbar` component provides a specialized toolbar for AI TextArea functionality.\nIt manages different states of the AI assistant and provides version navigation capabilities.\n\n### Structure\nThe `ui5-ai-textarea-toolbar` consists of the following elements:\n- AI Generate Button: Triggers AI text generation or stops ongoing generation\n- Version Navigation: Allows navigation between multiple AI-generated results\n- Action Label: Displays the current AI action being performed\n\n### ES6 Module Import\n\n`import \"@sap-webcomponents/ai/dist/WritingAssistant.js\";`\n---\n\n\n### **Events:**\n - **button-click** - Fired when the user clicks on the AI button.\n- **stop-generation** - Fired when the user clicks on the \"Stop\" button to stop ongoing AI text generation.\n- **version-change** - Fired when the user clicks on version navigation buttons.\n\n### **Methods:**\n - **handleButtonClick(): _void_** - Handles the click event for the AI generate button.\nToggles between generate and stop states based on current button state.",
|
|
550
|
+
"doc-url": "",
|
|
551
|
+
"attributes": [
|
|
552
|
+
{
|
|
553
|
+
"name": "current-version",
|
|
554
|
+
"description": "Indicates the index of the currently displayed result version.\n\nThe index is **0-based** (i.e. `0` represents the first result).\nThis property is synchronized with the parent AI TextArea component.",
|
|
555
|
+
"value": { "type": "number", "default": "0" }
|
|
556
|
+
},
|
|
557
|
+
{
|
|
558
|
+
"name": "prompt-description",
|
|
559
|
+
"description": "Defines the prompt description of the Writing Assistant.\n\nThis text is displayed in the toolbar to indicate the current or last\nperformed AI action (e.g., \"Generated text\", \"Simplified text\").",
|
|
560
|
+
"value": { "type": "string", "default": "\"\"" }
|
|
561
|
+
},
|
|
562
|
+
{
|
|
563
|
+
"name": "total-versions",
|
|
564
|
+
"description": "Indicates the total number of result versions available.\n\nThis property determines whether version navigation controls are displayed.\nWhen totalVersions > 0, previous/next buttons become available.",
|
|
565
|
+
"value": { "type": "number", "default": "0" }
|
|
566
|
+
}
|
|
567
|
+
],
|
|
568
|
+
"events": [
|
|
569
|
+
{
|
|
570
|
+
"name": "button-click",
|
|
571
|
+
"description": "Fired when the user clicks on the AI button."
|
|
572
|
+
},
|
|
573
|
+
{
|
|
574
|
+
"name": "stop-generation",
|
|
575
|
+
"description": "Fired when the user clicks on the \"Stop\" button to stop ongoing AI text generation."
|
|
576
|
+
},
|
|
577
|
+
{
|
|
578
|
+
"name": "version-change",
|
|
579
|
+
"description": "Fired when the user clicks on version navigation buttons."
|
|
580
|
+
}
|
|
581
|
+
],
|
|
582
|
+
"js": {
|
|
583
|
+
"properties": [
|
|
584
|
+
{
|
|
585
|
+
"name": "current-version",
|
|
586
|
+
"description": "Indicates the index of the currently displayed result version.\n\nThe index is **0-based** (i.e. `0` represents the first result).\nThis property is synchronized with the parent AI TextArea component.",
|
|
587
|
+
"value": { "type": "number" }
|
|
588
|
+
},
|
|
589
|
+
{
|
|
590
|
+
"name": "prompt-description",
|
|
591
|
+
"description": "Defines the prompt description of the Writing Assistant.\n\nThis text is displayed in the toolbar to indicate the current or last\nperformed AI action (e.g., \"Generated text\", \"Simplified text\").",
|
|
592
|
+
"value": { "type": "string" }
|
|
593
|
+
},
|
|
594
|
+
{
|
|
595
|
+
"name": "total-versions",
|
|
596
|
+
"description": "Indicates the total number of result versions available.\n\nThis property determines whether version navigation controls are displayed.\nWhen totalVersions > 0, previous/next buttons become available.",
|
|
597
|
+
"value": { "type": "number" }
|
|
598
|
+
}
|
|
599
|
+
],
|
|
600
|
+
"events": [
|
|
601
|
+
{
|
|
602
|
+
"name": "button-click",
|
|
603
|
+
"description": "Fired when the user clicks on the AI button."
|
|
473
604
|
},
|
|
474
605
|
{
|
|
475
606
|
"name": "stop-generation",
|
|
476
|
-
"description": "Fired when the user
|
|
607
|
+
"description": "Fired when the user clicks on the \"Stop\" button to stop ongoing AI text generation."
|
|
608
|
+
},
|
|
609
|
+
{
|
|
610
|
+
"name": "version-change",
|
|
611
|
+
"description": "Fired when the user clicks on version navigation buttons."
|
|
477
612
|
}
|
|
478
613
|
]
|
|
479
614
|
}
|