@ui5/webcomponents-ai 2.0.0-rc.5 → 2.0.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 +28 -0
- package/README.md +1 -4
- package/dist/Button.d.ts +76 -6
- package/dist/Button.js +170 -14
- package/dist/Button.js.map +1 -1
- package/dist/ButtonState.d.ts +60 -0
- package/dist/ButtonState.js +51 -0
- package/dist/ButtonState.js.map +1 -0
- package/dist/PromptInput.d.ts +108 -7
- package/dist/PromptInput.js +174 -9
- package/dist/PromptInput.js.map +1 -1
- package/dist/bundle.esm.js +1 -0
- package/dist/bundle.esm.js.map +1 -1
- package/dist/css/themes/Button.css +1 -0
- package/dist/css/themes/PromptInput.css +1 -0
- package/dist/custom-elements-internal.json +423 -7
- package/dist/custom-elements.json +371 -7
- package/dist/generated/assets/i18n/messagebundle_ar.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_bg.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_ca.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_cnr.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_cs.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_cy.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_da.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_de.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_el.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_en.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_en_GB.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_en_US_saprigi.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_es.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_es_MX.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_et.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_fi.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_fr.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_fr_CA.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_hi.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_hr.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_hu.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_it.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_iw.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_ja.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_kk.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_ko.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_lt.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_lv.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_mk.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_ms.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_nl.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_no.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_pl.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_pt.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_pt_PT.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_ro.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_ru.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_sh.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_sk.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_sl.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_sr.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_sv.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_th.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_tr.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_uk.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_vi.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_zh_CN.json +1 -0
- package/dist/generated/assets/i18n/messagebundle_zh_TW.json +1 -0
- package/dist/generated/i18n/i18n-defaults.d.ts +4 -1
- package/dist/generated/i18n/i18n-defaults.js +3 -0
- package/dist/generated/i18n/i18n-defaults.js.map +1 -1
- package/dist/generated/json-imports/i18n.d.ts +1 -0
- package/dist/generated/json-imports/i18n.js +113 -1
- package/dist/generated/json-imports/i18n.js.map +1 -1
- package/dist/generated/templates/ButtonTemplate.lit.js +2 -1
- package/dist/generated/templates/ButtonTemplate.lit.js.map +1 -1
- package/dist/generated/templates/PromptInputTemplate.lit.d.ts +4 -0
- package/dist/generated/templates/PromptInputTemplate.lit.js +8 -0
- package/dist/generated/templates/PromptInputTemplate.lit.js.map +1 -0
- package/dist/generated/themes/Button.css.js +2 -1
- package/dist/generated/themes/Button.css.js.map +1 -1
- package/dist/generated/themes/PromptInput.css.d.ts +3 -0
- package/dist/generated/themes/PromptInput.css.js +9 -0
- package/dist/generated/themes/PromptInput.css.js.map +1 -0
- package/dist/vscode.html-custom-data.json +93 -3
- package/dist/web-types.json +219 -8
- package/package.json +7 -7
- package/src/Button.hbs +17 -3
- package/src/PromptInput.hbs +31 -0
- package/src/i18n/messagebundle.properties +6 -0
- package/src/i18n/messagebundle_ar.properties +4 -0
- package/src/i18n/messagebundle_bg.properties +4 -0
- package/src/i18n/messagebundle_ca.properties +4 -0
- package/src/i18n/messagebundle_cnr.properties +4 -0
- package/src/i18n/messagebundle_cs.properties +4 -0
- package/src/i18n/messagebundle_cy.properties +4 -0
- package/src/i18n/messagebundle_da.properties +4 -0
- package/src/i18n/messagebundle_de.properties +4 -0
- package/src/i18n/messagebundle_el.properties +4 -0
- package/src/i18n/messagebundle_en.properties +4 -0
- package/src/i18n/messagebundle_en_GB.properties +4 -0
- package/src/i18n/messagebundle_en_US_saprigi.properties +4 -0
- package/src/i18n/messagebundle_es.properties +4 -0
- package/src/i18n/messagebundle_es_MX.properties +4 -0
- package/src/i18n/messagebundle_et.properties +4 -0
- package/src/i18n/messagebundle_fi.properties +4 -0
- package/src/i18n/messagebundle_fr.properties +4 -0
- package/src/i18n/messagebundle_fr_CA.properties +4 -0
- package/src/i18n/messagebundle_hi.properties +4 -0
- package/src/i18n/messagebundle_hr.properties +4 -0
- package/src/i18n/messagebundle_hu.properties +4 -0
- package/src/i18n/messagebundle_id.properties +4 -0
- package/src/i18n/messagebundle_it.properties +4 -0
- package/src/i18n/messagebundle_iw.properties +4 -0
- package/src/i18n/messagebundle_ja.properties +4 -0
- package/src/i18n/messagebundle_kk.properties +4 -0
- package/src/i18n/messagebundle_ko.properties +4 -0
- package/src/i18n/messagebundle_lt.properties +4 -0
- package/src/i18n/messagebundle_lv.properties +4 -0
- package/src/i18n/messagebundle_mk.properties +4 -0
- package/src/i18n/messagebundle_ms.properties +4 -0
- package/src/i18n/messagebundle_nl.properties +4 -0
- package/src/i18n/messagebundle_no.properties +4 -0
- package/src/i18n/messagebundle_pl.properties +4 -0
- package/src/i18n/messagebundle_pt.properties +4 -0
- package/src/i18n/messagebundle_pt_PT.properties +4 -0
- package/src/i18n/messagebundle_ro.properties +4 -0
- package/src/i18n/messagebundle_ru.properties +4 -0
- package/src/i18n/messagebundle_sh.properties +4 -0
- package/src/i18n/messagebundle_sk.properties +4 -0
- package/src/i18n/messagebundle_sl.properties +4 -0
- package/src/i18n/messagebundle_sr.properties +4 -0
- package/src/i18n/messagebundle_sv.properties +4 -0
- package/src/i18n/messagebundle_th.properties +4 -0
- package/src/i18n/messagebundle_tr.properties +4 -0
- package/src/i18n/messagebundle_uk.properties +4 -0
- package/src/i18n/messagebundle_vi.properties +4 -0
- package/src/i18n/messagebundle_zh_CN.properties +4 -0
- package/src/i18n/messagebundle_zh_TW.properties +4 -0
- package/src/themes/Button.css +88 -0
- package/src/themes/PromptInput.css +30 -0
package/dist/PromptInput.js
CHANGED
@@ -4,43 +4,208 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
4
4
|
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
6
6
|
};
|
7
|
+
var PromptInput_1;
|
7
8
|
import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
|
8
9
|
import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
|
10
|
+
import property from "@ui5/webcomponents-base/dist/decorators/property.js";
|
11
|
+
import event from "@ui5/webcomponents-base/dist/decorators/event.js";
|
12
|
+
import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
|
9
13
|
import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
|
10
|
-
import
|
14
|
+
import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
|
15
|
+
import "@ui5/webcomponents-icons/dist/paper-plane.js";
|
11
16
|
import Input from "@ui5/webcomponents/dist/Input.js";
|
17
|
+
import Label from "@ui5/webcomponents/dist/Label.js";
|
12
18
|
import Button from "@ui5/webcomponents/dist/Button.js";
|
13
|
-
import
|
19
|
+
import { isEnter, } from "@ui5/webcomponents-base/dist/Keys.js";
|
20
|
+
import { PROMPT_INPUT_CHARACTERS_LEFT, PROMPT_INPUT_CHARACTERS_EXCEEDED, } from "./generated/i18n/i18n-defaults.js";
|
21
|
+
import PromptInputTemplate from "./generated/templates/PromptInputTemplate.lit.js";
|
22
|
+
// Styles
|
23
|
+
import PromptInputCss from "./generated/themes/PromptInput.css.js";
|
14
24
|
/**
|
15
25
|
* @class
|
16
|
-
*
|
17
26
|
* ### Overview
|
18
27
|
*
|
19
|
-
* The
|
28
|
+
* The `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.
|
29
|
+
*
|
30
|
+
* **Note:** The web component is in an experimental state
|
20
31
|
*
|
21
32
|
* ### ES6 Module Import
|
22
33
|
*
|
23
|
-
* `import "@ui5/webcomponents-ai/dist/PromptInput.js
|
34
|
+
* `import "@ui5/webcomponents-ai/dist/PromptInput.js
|
35
|
+
* @class
|
24
36
|
* @constructor
|
25
|
-
* @extends UI5Element
|
26
|
-
* @since 2.0
|
27
37
|
* @public
|
38
|
+
* @extends UI5Element
|
39
|
+
* @experimental The **@ui5/webcomponents-ai** package is under development and considered experimental - components' APIs are subject to change.
|
28
40
|
*/
|
29
|
-
let PromptInput = class PromptInput extends UI5Element {
|
41
|
+
let PromptInput = PromptInput_1 = class PromptInput extends UI5Element {
|
42
|
+
static async onDefine() {
|
43
|
+
PromptInput_1.i18nBundle = await getI18nBundle("@ui5/webcomponents-ai");
|
44
|
+
}
|
45
|
+
constructor() {
|
46
|
+
super();
|
47
|
+
/**
|
48
|
+
* Defines the value of the component.
|
49
|
+
*
|
50
|
+
* @default ""
|
51
|
+
* @since 2.0.0
|
52
|
+
* @public
|
53
|
+
*/
|
54
|
+
this.value = "";
|
55
|
+
/**
|
56
|
+
* Defines whether the clear icon of the input will be shown.
|
57
|
+
* @default false
|
58
|
+
* @public
|
59
|
+
* @since 2.0.0
|
60
|
+
*/
|
61
|
+
this.showClearIcon = false;
|
62
|
+
/**
|
63
|
+
* Determines whether the characters exceeding the maximum allowed character count are visible
|
64
|
+
* in the component.
|
65
|
+
*
|
66
|
+
* If set to `false`, the user is not allowed to enter more characters than what is set in the
|
67
|
+
* `maxlength` property.
|
68
|
+
* If set to `true` the characters exceeding the `maxlength` value are selected on
|
69
|
+
* paste and the counter below the component displays their number.
|
70
|
+
* @default false
|
71
|
+
* @public
|
72
|
+
* @since 2.0.0
|
73
|
+
*/
|
74
|
+
this.showExceededText = false;
|
75
|
+
/**
|
76
|
+
* Defines whether the component is in disabled state.
|
77
|
+
*
|
78
|
+
* **Note:** A disabled component is completely noninteractive.
|
79
|
+
* @default false
|
80
|
+
* @public
|
81
|
+
* @since 2.0.0
|
82
|
+
*/
|
83
|
+
this.disabled = false;
|
84
|
+
/**
|
85
|
+
* Defines whether the component is read-only.
|
86
|
+
*
|
87
|
+
* **Note:** A read-only component is not editable,
|
88
|
+
* but still provides visual feedback upon user interaction.
|
89
|
+
* @default false
|
90
|
+
* @public
|
91
|
+
* @since 2.0.0
|
92
|
+
*/
|
93
|
+
this.readonly = false;
|
94
|
+
/**
|
95
|
+
* Defines the value state of the component.
|
96
|
+
* @default "None"
|
97
|
+
* @since 2.0.0
|
98
|
+
* @public
|
99
|
+
*/
|
100
|
+
this.valueState = "None";
|
101
|
+
}
|
102
|
+
_onkeydown(e) {
|
103
|
+
if (isEnter(e)) {
|
104
|
+
this.fireEvent("submit");
|
105
|
+
}
|
106
|
+
}
|
107
|
+
_onInnerInput(e) {
|
108
|
+
this.value = e.target.value;
|
109
|
+
this.fireEvent("input");
|
110
|
+
}
|
111
|
+
_onInnerChange() {
|
112
|
+
this.fireEvent("change");
|
113
|
+
}
|
114
|
+
_onButtonClick() {
|
115
|
+
this.fireEvent("submit");
|
116
|
+
}
|
117
|
+
get _exceededText() {
|
118
|
+
if (this.showExceededText) {
|
119
|
+
let leftCharactersCount;
|
120
|
+
const maxLength = this.maxlength;
|
121
|
+
if (maxLength !== undefined) {
|
122
|
+
leftCharactersCount = maxLength - this.value.length;
|
123
|
+
if (leftCharactersCount >= 0) {
|
124
|
+
return PromptInput_1.i18nBundle.getText(PROMPT_INPUT_CHARACTERS_LEFT, leftCharactersCount);
|
125
|
+
}
|
126
|
+
return PromptInput_1.i18nBundle.getText(PROMPT_INPUT_CHARACTERS_EXCEEDED, Math.abs(leftCharactersCount));
|
127
|
+
}
|
128
|
+
}
|
129
|
+
}
|
130
|
+
get _maxLenght() {
|
131
|
+
return this.maxlength || undefined;
|
132
|
+
}
|
133
|
+
get _submitButtonDisabled() {
|
134
|
+
return (this.value.length <= 0) || this.disabled || this.readonly;
|
135
|
+
}
|
30
136
|
};
|
31
137
|
__decorate([
|
32
138
|
property()
|
33
139
|
], PromptInput.prototype, "value", void 0);
|
34
|
-
|
140
|
+
__decorate([
|
141
|
+
property()
|
142
|
+
], PromptInput.prototype, "placeholder", void 0);
|
143
|
+
__decorate([
|
144
|
+
property()
|
145
|
+
], PromptInput.prototype, "label", void 0);
|
146
|
+
__decorate([
|
147
|
+
property({ type: Boolean })
|
148
|
+
], PromptInput.prototype, "showClearIcon", void 0);
|
149
|
+
__decorate([
|
150
|
+
property({ type: Boolean })
|
151
|
+
], PromptInput.prototype, "showExceededText", void 0);
|
152
|
+
__decorate([
|
153
|
+
property({ type: Boolean })
|
154
|
+
], PromptInput.prototype, "disabled", void 0);
|
155
|
+
__decorate([
|
156
|
+
property({ type: Boolean })
|
157
|
+
], PromptInput.prototype, "readonly", void 0);
|
158
|
+
__decorate([
|
159
|
+
property({ type: Number })
|
160
|
+
], PromptInput.prototype, "maxlength", void 0);
|
161
|
+
__decorate([
|
162
|
+
property()
|
163
|
+
], PromptInput.prototype, "valueState", void 0);
|
164
|
+
__decorate([
|
165
|
+
slot({
|
166
|
+
type: HTMLElement,
|
167
|
+
invalidateOnChildChange: true,
|
168
|
+
})
|
169
|
+
], PromptInput.prototype, "valueStateMessage", void 0);
|
170
|
+
PromptInput = PromptInput_1 = __decorate([
|
35
171
|
customElement({
|
36
172
|
tag: "ui5-ai-prompt-input",
|
37
173
|
renderer: litRender,
|
174
|
+
styles: PromptInputCss,
|
175
|
+
template: PromptInputTemplate,
|
38
176
|
dependencies: [
|
39
177
|
Input,
|
40
178
|
Label,
|
41
179
|
Button,
|
42
180
|
],
|
43
181
|
})
|
182
|
+
/**
|
183
|
+
* Fired when the input operation has finished by pressing Enter
|
184
|
+
* or AI button is clicked.
|
185
|
+
*
|
186
|
+
* @since 2.0.0
|
187
|
+
* @public
|
188
|
+
*/
|
189
|
+
,
|
190
|
+
event("submit")
|
191
|
+
/**
|
192
|
+
* Fired when the value of the component changes at each keystroke,
|
193
|
+
* and when a suggestion item has been selected.
|
194
|
+
*
|
195
|
+
* @since 2.0.0
|
196
|
+
* @public
|
197
|
+
*/
|
198
|
+
,
|
199
|
+
event("input")
|
200
|
+
/**
|
201
|
+
* Fired when the input operation has finished by pressing Enter
|
202
|
+
* or on focusout.
|
203
|
+
*
|
204
|
+
* @since 2.0.0
|
205
|
+
* @public
|
206
|
+
*/
|
207
|
+
,
|
208
|
+
event("change")
|
44
209
|
], PromptInput);
|
45
210
|
PromptInput.define();
|
46
211
|
export default PromptInput;
|
package/dist/PromptInput.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"PromptInput.js","sourceRoot":"","sources":["../src/PromptInput.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"file":"PromptInput.js","sourceRoot":"","sources":["../src/PromptInput.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport \"@ui5/webcomponents-icons/dist/paper-plane.js\";\nimport type { InputEventDetail } from \"@ui5/webcomponents/dist/Input.js\";\nimport Input from \"@ui5/webcomponents/dist/Input.js\";\nimport Label from \"@ui5/webcomponents/dist/Label.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport {\n\tisEnter,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport {\n\tPROMPT_INPUT_CHARACTERS_LEFT,\n\tPROMPT_INPUT_CHARACTERS_EXCEEDED,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nimport PromptInputTemplate from \"./generated/templates/PromptInputTemplate.lit.js\";\n\n// Styles\nimport PromptInputCss from \"./generated/themes/PromptInput.css.js\";\n\n/**\n * @class\n * ### Overview\n *\n * The `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 * @class\n * @constructor\n * @public\n * @extends UI5Element\n * @experimental The **@ui5/webcomponents-ai** package is under development and considered experimental - components' APIs are subject to change.\n */\n@customElement({\n\ttag: \"ui5-ai-prompt-input\",\n\trenderer: litRender,\n\tstyles: PromptInputCss,\n\ttemplate: PromptInputTemplate,\n\tdependencies: [\n\t\tInput,\n\t\tLabel,\n\t\tButton,\n\t],\n})\n\n/**\n * Fired when the input operation has finished by pressing Enter\n * or AI button is clicked.\n *\n * @since 2.0.0\n * @public\n */\n@event(\"submit\")\n\n/**\n * Fired when the value of the component changes at each keystroke,\n * and when a suggestion item has been selected.\n *\n * @since 2.0.0\n * @public\n */\n@event(\"input\")\n\n/**\n * Fired when the input operation has finished by pressing Enter\n * or on focusout.\n *\n * @since 2.0.0\n * @public\n */\n@event(\"change\")\nclass PromptInput extends UI5Element {\n\t/**\n\t * Defines the value of the component.\n\t *\n\t * @default \"\"\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@property()\n\tvalue = \"\";\n\n\t/**\n\t * Defines a short hint intended to aid the user with data entry when the\n\t * component has no value.\n\t * @default undefined\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@property()\n\tplaceholder?: string;\n\n\t/**\n\t * Defines the label of the input field.\n\t *\n\t * @default undefined\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@property()\n\tlabel?: string;\n\n\t/**\n\t * Defines whether the clear icon of the input will be shown.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tshowClearIcon = false;\n\n\t/**\n\t * Determines whether the characters exceeding the maximum allowed character count are visible\n\t * in the component.\n\t *\n\t * If set to `false`, the user is not allowed to enter more characters than what is set in the\n\t * `maxlength` property.\n\t * If set to `true` the characters exceeding the `maxlength` value are selected on\n\t * paste and the counter below the component displays their number.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tshowExceededText = false;\n\n\t/**\n\t * Defines whether the component is in disabled state.\n\t *\n\t * **Note:** A disabled component is completely noninteractive.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/**\n\t * Defines whether the component is read-only.\n\t *\n\t * **Note:** A read-only component is not editable,\n\t * but still provides visual feedback upon user interaction.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\treadonly = false;\n\n\t/**\n\t * Sets the maximum number of characters available in the input field.\n\t *\n\t * @default undefined\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@property({ type: Number })\n\tmaxlength?: number;\n\n\t/**\n\t * Defines the value state of the component.\n\t * @default \"None\"\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@property()\n\tvalueState: `${ValueState}` = \"None\"\n\n\t/**\n\t * Defines the value state message that will be displayed as pop up under the component.\n\t * The value state message slot should contain only one root element.\n\t *\n\t * **Note:** If not specified, a default text (in the respective language) will be displayed.\n\t *\n\t * **Note:** The `valueStateMessage` would be displayed,\n\t * when the component is in `Information`, `Critical` or `Negative` value state.\n\t *\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\tinvalidateOnChildChange: true,\n\t})\n\tvalueStateMessage!: Array<HTMLElement>;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tstatic async onDefine() {\n\t\tPromptInput.i18nBundle = await getI18nBundle(\"@ui5/webcomponents-ai\");\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireEvent(\"submit\");\n\t\t}\n\t}\n\n\t_onInnerInput(e: CustomEvent<InputEventDetail>) {\n\t\tthis.value = (e.target as Input).value;\n\n\t\tthis.fireEvent(\"input\");\n\t}\n\n\t_onInnerChange() {\n\t\tthis.fireEvent(\"change\");\n\t}\n\n\t_onButtonClick() {\n\t\tthis.fireEvent(\"submit\");\n\t}\n\n\tget _exceededText() {\n\t\tif (this.showExceededText) {\n\t\t\tlet leftCharactersCount;\n\t\t\tconst maxLength = this.maxlength;\n\n\t\t\tif (maxLength !== undefined) {\n\t\t\t\tleftCharactersCount = maxLength - this.value.length;\n\n\t\t\t\tif (leftCharactersCount >= 0) {\n\t\t\t\t\treturn PromptInput.i18nBundle.getText(PROMPT_INPUT_CHARACTERS_LEFT, leftCharactersCount);\n\t\t\t\t}\n\n\t\t\t\treturn PromptInput.i18nBundle.getText(PROMPT_INPUT_CHARACTERS_EXCEEDED, Math.abs(leftCharactersCount));\n\t\t\t}\n\t\t}\n\t}\n\n\tget _maxLenght() {\n\t\treturn this.maxlength || undefined;\n\t}\n\n\tget _submitButtonDisabled() {\n\t\treturn (this.value.length <= 0) || this.disabled || this.readonly;\n\t}\n}\n\nPromptInput.define();\n\nexport default PromptInput;\n"]}
|
package/dist/bundle.esm.js
CHANGED
package/dist/bundle.esm.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"bundle.esm.js","sourceRoot":"","sources":["../src/bundle.esm.ts"],"names":[],"mappings":"AAAA,sDAAsD;AACtD,OAAO,UAAU,MAAM,uCAAuC,CAAC;AAE/D,YAAY;AACZ,OAAO,aAAa,CAAC;AAErB,OAAmB,aAAa,CAAC;AACjC,OAAwB,kBAAkB,CAAC;AAE3C,eAAe,UAAU,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\nimport testAssets from \"@ui5/webcomponents/dist/bundle.esm.js\";\n\n// AI assets\nimport \"./Assets.js\";\n\nimport Button from \"./Button.js\";\nimport PromptInput from \"./PromptInput.js\";\n\nexport default testAssets;\n"]}
|
1
|
+
{"version":3,"file":"bundle.esm.js","sourceRoot":"","sources":["../src/bundle.esm.ts"],"names":[],"mappings":"AAAA,sDAAsD;AACtD,OAAO,UAAU,MAAM,uCAAuC,CAAC;AAE/D,YAAY;AACZ,OAAO,aAAa,CAAC;AAErB,OAAmB,aAAa,CAAC;AACjC,OAAwB,kBAAkB,CAAC;AAC3C,OAAwB,kBAAkB,CAAC;AAE3C,eAAe,UAAU,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\nimport testAssets from \"@ui5/webcomponents/dist/bundle.esm.js\";\n\n// AI assets\nimport \"./Assets.js\";\n\nimport Button from \"./Button.js\";\nimport ButtonState from \"./ButtonState.js\";\nimport PromptInput from \"./PromptInput.js\";\n\nexport default testAssets;\n"]}
|
@@ -0,0 +1 @@
|
|
1
|
+
:host{display:inline-block}:host([disabled]){pointer-events:none}.ui5-ai-button-text{display:inline-block}:host([icon-only]) .ui5-ai-button-text{min-width:0;margin-inline-start:0}.ui5-ai-button-hidden{position:absolute;top:-10000px;left:-10000px;visibility:hidden;display:block;width:fit-content}:host [ui5-button]:not(.ui5-ai-button-hidden){width:auto;position:relative;transition:width .18s cubic-bezier(.67,1,.95,1.3) .12s}:host ::part(icon){opacity:1;transform:translateY(0)}:host(:not([fade-out]):not([fade-mid]):not([fade-in])) .ui5-ai-button-text,:host(:not([fade-out]):not([fade-mid]):not([fade-in])) ::part(endIcon){opacity:1;transform:translateY(0)}:host([fade-out]:not([fade-mid])) ::part(icon){opacity:0;transform:translateY(-1rem);transition:opacity .05s ease-in-out 25ms,transform .1s ease-in-out 0s}:host([fade-out]:not([fade-mid])) .ui5-ai-button-text,:host([fade-out]:not([fade-mid])) ::part(endIcon){opacity:0;transform:translateY(-1rem);transition:opacity .06s ease-in-out .12s,transform .08s ease-in-out .12s}:host([fade-mid]) ::part(icon){opacity:0;transform:translateY(1rem)}:host([fade-mid]) .ui5-ai-button-text,:host([fade-mid]) ::part(endIcon){opacity:0;transform:translateY(1rem);transition:none}:host([fade-in]) ::part(icon){opacity:1;transform:translateY(0);transition:opacity .05s ease-in-out 25ms,transform .1s ease-in-out 0s}:host([fade-in]) .ui5-ai-button-text,:host([fade-in]) ::part(endIcon){opacity:1;transform:translateY(0);transition:opacity .06s ease-in-out .12s,transform .08s ease-in-out .12s}
|
@@ -0,0 +1 @@
|
|
1
|
+
.ai-prompt-input-button{margin-left:.5rem;margin-top:3px}.ai-prompt-input-wrapper{display:flex;flex-direction:column;width:270px}.ai-prompt-input-form-wrapper{display:flex;flex:1}.ai-prompt-input-counter{font-size:.75rem;align-self:flex-end}#input{width:100%}.ai-prompt-inner-input-wrapper{display:flex;flex-direction:column;flex:1}
|