@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.
Files changed (138) hide show
  1. package/CHANGELOG.md +28 -0
  2. package/README.md +1 -4
  3. package/dist/Button.d.ts +76 -6
  4. package/dist/Button.js +170 -14
  5. package/dist/Button.js.map +1 -1
  6. package/dist/ButtonState.d.ts +60 -0
  7. package/dist/ButtonState.js +51 -0
  8. package/dist/ButtonState.js.map +1 -0
  9. package/dist/PromptInput.d.ts +108 -7
  10. package/dist/PromptInput.js +174 -9
  11. package/dist/PromptInput.js.map +1 -1
  12. package/dist/bundle.esm.js +1 -0
  13. package/dist/bundle.esm.js.map +1 -1
  14. package/dist/css/themes/Button.css +1 -0
  15. package/dist/css/themes/PromptInput.css +1 -0
  16. package/dist/custom-elements-internal.json +423 -7
  17. package/dist/custom-elements.json +371 -7
  18. package/dist/generated/assets/i18n/messagebundle_ar.json +1 -0
  19. package/dist/generated/assets/i18n/messagebundle_bg.json +1 -0
  20. package/dist/generated/assets/i18n/messagebundle_ca.json +1 -0
  21. package/dist/generated/assets/i18n/messagebundle_cnr.json +1 -0
  22. package/dist/generated/assets/i18n/messagebundle_cs.json +1 -0
  23. package/dist/generated/assets/i18n/messagebundle_cy.json +1 -0
  24. package/dist/generated/assets/i18n/messagebundle_da.json +1 -0
  25. package/dist/generated/assets/i18n/messagebundle_de.json +1 -0
  26. package/dist/generated/assets/i18n/messagebundle_el.json +1 -0
  27. package/dist/generated/assets/i18n/messagebundle_en.json +1 -0
  28. package/dist/generated/assets/i18n/messagebundle_en_GB.json +1 -0
  29. package/dist/generated/assets/i18n/messagebundle_en_US_saprigi.json +1 -0
  30. package/dist/generated/assets/i18n/messagebundle_es.json +1 -0
  31. package/dist/generated/assets/i18n/messagebundle_es_MX.json +1 -0
  32. package/dist/generated/assets/i18n/messagebundle_et.json +1 -0
  33. package/dist/generated/assets/i18n/messagebundle_fi.json +1 -0
  34. package/dist/generated/assets/i18n/messagebundle_fr.json +1 -0
  35. package/dist/generated/assets/i18n/messagebundle_fr_CA.json +1 -0
  36. package/dist/generated/assets/i18n/messagebundle_hi.json +1 -0
  37. package/dist/generated/assets/i18n/messagebundle_hr.json +1 -0
  38. package/dist/generated/assets/i18n/messagebundle_hu.json +1 -0
  39. package/dist/generated/assets/i18n/messagebundle_it.json +1 -0
  40. package/dist/generated/assets/i18n/messagebundle_iw.json +1 -0
  41. package/dist/generated/assets/i18n/messagebundle_ja.json +1 -0
  42. package/dist/generated/assets/i18n/messagebundle_kk.json +1 -0
  43. package/dist/generated/assets/i18n/messagebundle_ko.json +1 -0
  44. package/dist/generated/assets/i18n/messagebundle_lt.json +1 -0
  45. package/dist/generated/assets/i18n/messagebundle_lv.json +1 -0
  46. package/dist/generated/assets/i18n/messagebundle_mk.json +1 -0
  47. package/dist/generated/assets/i18n/messagebundle_ms.json +1 -0
  48. package/dist/generated/assets/i18n/messagebundle_nl.json +1 -0
  49. package/dist/generated/assets/i18n/messagebundle_no.json +1 -0
  50. package/dist/generated/assets/i18n/messagebundle_pl.json +1 -0
  51. package/dist/generated/assets/i18n/messagebundle_pt.json +1 -0
  52. package/dist/generated/assets/i18n/messagebundle_pt_PT.json +1 -0
  53. package/dist/generated/assets/i18n/messagebundle_ro.json +1 -0
  54. package/dist/generated/assets/i18n/messagebundle_ru.json +1 -0
  55. package/dist/generated/assets/i18n/messagebundle_sh.json +1 -0
  56. package/dist/generated/assets/i18n/messagebundle_sk.json +1 -0
  57. package/dist/generated/assets/i18n/messagebundle_sl.json +1 -0
  58. package/dist/generated/assets/i18n/messagebundle_sr.json +1 -0
  59. package/dist/generated/assets/i18n/messagebundle_sv.json +1 -0
  60. package/dist/generated/assets/i18n/messagebundle_th.json +1 -0
  61. package/dist/generated/assets/i18n/messagebundle_tr.json +1 -0
  62. package/dist/generated/assets/i18n/messagebundle_uk.json +1 -0
  63. package/dist/generated/assets/i18n/messagebundle_vi.json +1 -0
  64. package/dist/generated/assets/i18n/messagebundle_zh_CN.json +1 -0
  65. package/dist/generated/assets/i18n/messagebundle_zh_TW.json +1 -0
  66. package/dist/generated/i18n/i18n-defaults.d.ts +4 -1
  67. package/dist/generated/i18n/i18n-defaults.js +3 -0
  68. package/dist/generated/i18n/i18n-defaults.js.map +1 -1
  69. package/dist/generated/json-imports/i18n.d.ts +1 -0
  70. package/dist/generated/json-imports/i18n.js +113 -1
  71. package/dist/generated/json-imports/i18n.js.map +1 -1
  72. package/dist/generated/templates/ButtonTemplate.lit.js +2 -1
  73. package/dist/generated/templates/ButtonTemplate.lit.js.map +1 -1
  74. package/dist/generated/templates/PromptInputTemplate.lit.d.ts +4 -0
  75. package/dist/generated/templates/PromptInputTemplate.lit.js +8 -0
  76. package/dist/generated/templates/PromptInputTemplate.lit.js.map +1 -0
  77. package/dist/generated/themes/Button.css.js +2 -1
  78. package/dist/generated/themes/Button.css.js.map +1 -1
  79. package/dist/generated/themes/PromptInput.css.d.ts +3 -0
  80. package/dist/generated/themes/PromptInput.css.js +9 -0
  81. package/dist/generated/themes/PromptInput.css.js.map +1 -0
  82. package/dist/vscode.html-custom-data.json +93 -3
  83. package/dist/web-types.json +219 -8
  84. package/package.json +7 -7
  85. package/src/Button.hbs +17 -3
  86. package/src/PromptInput.hbs +31 -0
  87. package/src/i18n/messagebundle.properties +6 -0
  88. package/src/i18n/messagebundle_ar.properties +4 -0
  89. package/src/i18n/messagebundle_bg.properties +4 -0
  90. package/src/i18n/messagebundle_ca.properties +4 -0
  91. package/src/i18n/messagebundle_cnr.properties +4 -0
  92. package/src/i18n/messagebundle_cs.properties +4 -0
  93. package/src/i18n/messagebundle_cy.properties +4 -0
  94. package/src/i18n/messagebundle_da.properties +4 -0
  95. package/src/i18n/messagebundle_de.properties +4 -0
  96. package/src/i18n/messagebundle_el.properties +4 -0
  97. package/src/i18n/messagebundle_en.properties +4 -0
  98. package/src/i18n/messagebundle_en_GB.properties +4 -0
  99. package/src/i18n/messagebundle_en_US_saprigi.properties +4 -0
  100. package/src/i18n/messagebundle_es.properties +4 -0
  101. package/src/i18n/messagebundle_es_MX.properties +4 -0
  102. package/src/i18n/messagebundle_et.properties +4 -0
  103. package/src/i18n/messagebundle_fi.properties +4 -0
  104. package/src/i18n/messagebundle_fr.properties +4 -0
  105. package/src/i18n/messagebundle_fr_CA.properties +4 -0
  106. package/src/i18n/messagebundle_hi.properties +4 -0
  107. package/src/i18n/messagebundle_hr.properties +4 -0
  108. package/src/i18n/messagebundle_hu.properties +4 -0
  109. package/src/i18n/messagebundle_id.properties +4 -0
  110. package/src/i18n/messagebundle_it.properties +4 -0
  111. package/src/i18n/messagebundle_iw.properties +4 -0
  112. package/src/i18n/messagebundle_ja.properties +4 -0
  113. package/src/i18n/messagebundle_kk.properties +4 -0
  114. package/src/i18n/messagebundle_ko.properties +4 -0
  115. package/src/i18n/messagebundle_lt.properties +4 -0
  116. package/src/i18n/messagebundle_lv.properties +4 -0
  117. package/src/i18n/messagebundle_mk.properties +4 -0
  118. package/src/i18n/messagebundle_ms.properties +4 -0
  119. package/src/i18n/messagebundle_nl.properties +4 -0
  120. package/src/i18n/messagebundle_no.properties +4 -0
  121. package/src/i18n/messagebundle_pl.properties +4 -0
  122. package/src/i18n/messagebundle_pt.properties +4 -0
  123. package/src/i18n/messagebundle_pt_PT.properties +4 -0
  124. package/src/i18n/messagebundle_ro.properties +4 -0
  125. package/src/i18n/messagebundle_ru.properties +4 -0
  126. package/src/i18n/messagebundle_sh.properties +4 -0
  127. package/src/i18n/messagebundle_sk.properties +4 -0
  128. package/src/i18n/messagebundle_sl.properties +4 -0
  129. package/src/i18n/messagebundle_sr.properties +4 -0
  130. package/src/i18n/messagebundle_sv.properties +4 -0
  131. package/src/i18n/messagebundle_th.properties +4 -0
  132. package/src/i18n/messagebundle_tr.properties +4 -0
  133. package/src/i18n/messagebundle_uk.properties +4 -0
  134. package/src/i18n/messagebundle_vi.properties +4 -0
  135. package/src/i18n/messagebundle_zh_CN.properties +4 -0
  136. package/src/i18n/messagebundle_zh_TW.properties +4 -0
  137. package/src/themes/Button.css +88 -0
  138. package/src/themes/PromptInput.css +30 -0
@@ -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 Label from "@ui5/webcomponents/dist/Label.js";
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 property from "@ui5/webcomponents-base/dist/decorators/property.js";
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 PromptInput is an AI component.
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
- PromptInput = __decorate([
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;
@@ -1 +1 @@
1
- {"version":3,"file":"PromptInput.js","sourceRoot":"","sources":["../src/PromptInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAE7E,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAE3E;;;;;;;;;;;;;;GAcG;AAUH,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;CAQnC,CAAA;AADA;IADC,QAAQ,EAAE;0CACI;AAPV,WAAW;IAThB,aAAa,CAAC;QACd,GAAG,EAAE,qBAAqB;QAC1B,QAAQ,EAAE,SAAS;QACnB,YAAY,EAAE;YACb,KAAK;YACL,KAAK;YACL,MAAM;SACN;KACD,CAAC;GACI,WAAW,CAQhB;AAED,WAAW,CAAC,MAAM,EAAE,CAAC;AAErB,eAAe,WAAW,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\n\nimport Label from \"@ui5/webcomponents/dist/Label.js\";\nimport Input from \"@ui5/webcomponents/dist/Input.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The PromptInput is an AI component.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents-ai/dist/PromptInput.js\";`\n * @constructor\n * @extends UI5Element\n * @since 2.0\n * @public\n */\n@customElement({\n\ttag: \"ui5-ai-prompt-input\",\n\trenderer: litRender,\n\tdependencies: [\n\t\tInput,\n\t\tLabel,\n\t\tButton,\n\t],\n})\nclass PromptInput extends UI5Element {\n\t/**\n\t * Defines the value of the PromptInput.\n\t * @public\n\t * @default \"\"\n\t */\n\t@property()\n\tvalue!: string;\n}\n\nPromptInput.define();\n\nexport default PromptInput;\n"]}
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"]}
@@ -3,6 +3,7 @@ import testAssets from "@ui5/webcomponents/dist/bundle.esm.js";
3
3
  // AI assets
4
4
  import "./Assets.js";
5
5
  import "./Button.js";
6
+ import "./ButtonState.js";
6
7
  import "./PromptInput.js";
7
8
  export default testAssets;
8
9
  //# sourceMappingURL=bundle.esm.js.map
@@ -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}