@ui5/webcomponents-ai 2.0.1 → 2.1.0-rc.1

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 (12) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/PromptInput.d.ts +27 -2
  3. package/dist/PromptInput.js +22 -4
  4. package/dist/PromptInput.js.map +1 -1
  5. package/dist/custom-elements-internal.json +51 -32
  6. package/dist/custom-elements.json +23 -0
  7. package/dist/generated/templates/PromptInputTemplate.lit.js +1 -1
  8. package/dist/generated/templates/PromptInputTemplate.lit.js.map +1 -1
  9. package/dist/vscode.html-custom-data.json +6 -1
  10. package/dist/web-types.json +16 -2
  11. package/package.json +7 -7
  12. package/src/PromptInput.hbs +5 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,25 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [2.1.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v2.1.0-rc.0...v2.1.0-rc.1) (2024-07-18)
7
+
8
+
9
+ ### Features
10
+
11
+ * **ui5-prompt-input:** implement suggestions ([#9390](https://github.com/SAP/ui5-webcomponents/issues/9390)) ([a261cfb](https://github.com/SAP/ui5-webcomponents/commit/a261cfbfa06328e1f496a8a2acd1e4b22e78243d))
12
+
13
+
14
+
15
+
16
+
17
+ # [2.1.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v2.0.1...v2.1.0-rc.0) (2024-07-11)
18
+
19
+ **Note:** Version bump only for package @ui5/webcomponents-ai
20
+
21
+
22
+
23
+
24
+
6
25
  ## [2.0.1](https://github.com/SAP/ui5-webcomponents/compare/v2.0.0...v2.0.1) (2024-07-05)
7
26
 
8
27
  **Note:** Version bump only for package @ui5/webcomponents-ai
package/dist/PromptInput.d.ts CHANGED
@@ -2,7 +2,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
2
2
  import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
3
3
  import type ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
4
4
  import "@ui5/webcomponents-icons/dist/paper-plane.js";
5
- import type { InputEventDetail } from "@ui5/webcomponents/dist/Input.js";
5
+ import type { IInputSuggestionItem, InputEventDetail } from "@ui5/webcomponents/dist/Input.js";
6
6
  /**
7
7
  * @class
8
8
  * ### Overview
@@ -99,6 +99,31 @@ declare class PromptInput extends UI5Element {
99
99
  * @public
100
100
  */
101
101
  valueState: `${ValueState}`;
102
+ /**
103
+ * Defines whether the component should show suggestions, if such are present.
104
+ *
105
+ * **Note:** You need to import the `InputSuggestions` module
106
+ * from `"@ui5/webcomponents/dist/features/InputSuggestions.js"` to enable this functionality.
107
+ * @default false
108
+ * @public
109
+ */
110
+ showSuggestions: boolean;
111
+ /**
112
+ * Defines the suggestion items.
113
+ *
114
+ * **Note:** The suggestions would be displayed only if the `showSuggestions`
115
+ * property is set to `true`.
116
+ *
117
+ * **Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.
118
+ *
119
+ * **Note:** Importing the Input Suggestions Support feature:
120
+ *
121
+ * `import "@ui5/webcomponents/dist/features/InputSuggestions.js";`
122
+ *
123
+ * automatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.
124
+ * @public
125
+ */
126
+ suggestionItems: Array<IInputSuggestionItem>;
102
127
  /**
103
128
  * Defines the value state message that will be displayed as pop up under the component.
104
129
  * The value state message slot should contain only one root element.
@@ -114,11 +139,11 @@ declare class PromptInput extends UI5Element {
114
139
  valueStateMessage: Array<HTMLElement>;
115
140
  static i18nBundle: I18nBundle;
116
141
  static onDefine(): Promise<void>;
117
- constructor();
118
142
  _onkeydown(e: KeyboardEvent): void;
119
143
  _onInnerInput(e: CustomEvent<InputEventDetail>): void;
120
144
  _onInnerChange(): void;
121
145
  _onButtonClick(): void;
146
+ _onTypeAhead(e: CustomEvent): void;
122
147
  get _exceededText(): string | undefined;
123
148
  get _maxLenght(): number | undefined;
124
149
  get _submitButtonDisabled(): boolean;
package/dist/PromptInput.js CHANGED
@@ -39,11 +39,8 @@ import PromptInputCss from "./generated/themes/PromptInput.css.js";
39
39
  * @experimental The **@ui5/webcomponents-ai** package is under development and considered experimental - components' APIs are subject to change.
40
40
  */
41
41
  let PromptInput = PromptInput_1 = class PromptInput extends UI5Element {
42
- static async onDefine() {
43
- PromptInput_1.i18nBundle = await getI18nBundle("@ui5/webcomponents-ai");
44
- }
45
42
  constructor() {
46
- super();
43
+ super(...arguments);
47
44
  /**
48
45
  * Defines the value of the component.
49
46
  *
@@ -98,6 +95,18 @@ let PromptInput = PromptInput_1 = class PromptInput extends UI5Element {
98
95
  * @public
99
96
  */
100
97
  this.valueState = "None";
98
+ /**
99
+ * Defines whether the component should show suggestions, if such are present.
100
+ *
101
+ * **Note:** You need to import the `InputSuggestions` module
102
+ * from `"@ui5/webcomponents/dist/features/InputSuggestions.js"` to enable this functionality.
103
+ * @default false
104
+ * @public
105
+ */
106
+ this.showSuggestions = false;
107
+ }
108
+ static async onDefine() {
109
+ PromptInput_1.i18nBundle = await getI18nBundle("@ui5/webcomponents-ai");
101
110
  }
102
111
  _onkeydown(e) {
103
112
  if (isEnter(e)) {
@@ -114,6 +123,9 @@ let PromptInput = PromptInput_1 = class PromptInput extends UI5Element {
114
123
  _onButtonClick() {
115
124
  this.fireEvent("submit");
116
125
  }
126
+ _onTypeAhead(e) {
127
+ this.value = e.target.value;
128
+ }
117
129
  get _exceededText() {
118
130
  if (this.showExceededText) {
119
131
  let leftCharactersCount;
@@ -161,6 +173,12 @@ __decorate([
161
173
  __decorate([
162
174
  property()
163
175
  ], PromptInput.prototype, "valueState", void 0);
176
+ __decorate([
177
+ property({ type: Boolean })
178
+ ], PromptInput.prototype, "showSuggestions", void 0);
179
+ __decorate([
180
+ slot({ type: HTMLElement, "default": true })
181
+ ], PromptInput.prototype, "suggestionItems", void 0);
164
182
  __decorate([
165
183
  slot({
166
184
  type: HTMLElement,
package/dist/PromptInput.js.map CHANGED
@@ -1 +1 @@
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"]}
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 { IInputSuggestionItem, 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 whether the component should show suggestions, if such are present.\n\t *\n\t * **Note:** You need to import the `InputSuggestions` module\n\t * from `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowSuggestions = false;\n\n\t/**\n\t * Defines the suggestion items.\n\t *\n\t * **Note:** The suggestions would be displayed only if the `showSuggestions`\n\t * property is set to `true`.\n\t *\n\t * **Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.\n\t *\n\t * **Note:** Importing the Input Suggestions Support feature:\n\t *\n\t * `import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\t *\n\t * automatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.\n\t * @public\n\t */\n\t\t@slot({ type: HTMLElement, \"default\": true })\n\t\tsuggestionItems!: Array<IInputSuggestionItem>;\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\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\t_onTypeAhead(e: CustomEvent): void {\n\t\tthis.value = (e.target as Input).value;\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/custom-elements-internal.json CHANGED
@@ -50,8 +50,7 @@
50
50
  },
51
51
  "default": "\"Default\"",
52
52
  "description": "Defines the component design.",
53
- "privacy": "public",
54
- "_ui5validator": "String"
53
+ "privacy": "public"
55
54
  },
56
55
  {
57
56
  "kind": "field",
@@ -61,8 +60,7 @@
61
60
  },
62
61
  "default": "false",
63
62
  "description": "Defines whether the component is disabled.\nA disabled component can't be pressed or\nfocused, and it is not in the tab chain.",
64
- "privacy": "public",
65
- "_ui5validator": "Boolean"
63
+ "privacy": "public"
66
64
  },
67
65
  {
68
66
  "kind": "field",
@@ -72,8 +70,7 @@
72
70
  },
73
71
  "description": "Defines the current state of the component.",
74
72
  "default": "undefined",
75
- "privacy": "public",
76
- "_ui5validator": "String"
73
+ "privacy": "public"
77
74
  }
78
75
  ],
79
76
  "events": [
@@ -163,8 +160,7 @@
163
160
  },
164
161
  "description": "Defines the name of the button state.",
165
162
  "default": "undefined",
166
- "privacy": "public",
167
- "_ui5validator": "String"
163
+ "privacy": "public"
168
164
  },
169
165
  {
170
166
  "kind": "field",
@@ -174,8 +170,7 @@
174
170
  },
175
171
  "description": "Defines the text of the button in this state.",
176
172
  "default": "undefined",
177
- "privacy": "public",
178
- "_ui5validator": "String"
173
+ "privacy": "public"
179
174
  },
180
175
  {
181
176
  "kind": "field",
@@ -185,8 +180,7 @@
185
180
  },
186
181
  "description": "Defines the icon to be displayed as graphical element within the component before 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).",
187
182
  "default": "undefined",
188
- "privacy": "public",
189
- "_ui5validator": "String"
183
+ "privacy": "public"
190
184
  },
191
185
  {
192
186
  "kind": "field",
@@ -196,8 +190,7 @@
196
190
  },
197
191
  "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).",
198
192
  "default": "undefined",
199
- "privacy": "public",
200
- "_ui5validator": "String"
193
+ "privacy": "public"
201
194
  }
202
195
  ],
203
196
  "attributes": [
@@ -279,6 +272,22 @@
279
272
  "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",
280
273
  "name": "PromptInput",
281
274
  "slots": [
275
+ {
276
+ "name": "default",
277
+ "description": "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\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.",
278
+ "_ui5propertyName": "suggestionItems",
279
+ "_ui5type": {
280
+ "text": "Array<IInputSuggestionItem>",
281
+ "references": [
282
+ {
283
+ "name": "IInputSuggestionItem",
284
+ "package": "@ui5/webcomponents",
285
+ "module": "dist/Input.js"
286
+ }
287
+ ]
288
+ },
289
+ "_ui5privacy": "public"
290
+ },
282
291
  {
283
292
  "name": "valueStateMessage",
284
293
  "description": "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.",
@@ -299,8 +308,7 @@
299
308
  "default": "\"\"",
300
309
  "description": "Defines the value of the component.",
301
310
  "privacy": "public",
302
- "_ui5since": "2.0.0",
303
- "_ui5validator": "String"
311
+ "_ui5since": "2.0.0"
304
312
  },
305
313
  {
306
314
  "kind": "field",
@@ -311,8 +319,7 @@
311
319
  "description": "Defines a short hint intended to aid the user with data entry when the\ncomponent has no value.",
312
320
  "default": "undefined",
313
321
  "privacy": "public",
314
- "_ui5since": "2.0.0",
315
- "_ui5validator": "String"
322
+ "_ui5since": "2.0.0"
316
323
  },
317
324
  {
318
325
  "kind": "field",
@@ -323,8 +330,7 @@
323
330
  "description": "Defines the label of the input field.",
324
331
  "default": "undefined",
325
332
  "privacy": "public",
326
- "_ui5since": "2.0.0",
327
- "_ui5validator": "String"
333
+ "_ui5since": "2.0.0"
328
334
  },
329
335
  {
330
336
  "kind": "field",
@@ -335,8 +341,7 @@
335
341
  "default": "false",
336
342
  "description": "Defines whether the clear icon of the input will be shown.",
337
343
  "privacy": "public",
338
- "_ui5since": "2.0.0",
339
- "_ui5validator": "Boolean"
344
+ "_ui5since": "2.0.0"
340
345
  },
341
346
  {
342
347
  "kind": "field",
@@ -347,8 +352,7 @@
347
352
  "default": "false",
348
353
  "description": "Determines whether the characters exceeding the maximum allowed character count are visible\nin the component.\n\nIf set to `false`, the user is not allowed to enter more characters than what is set in the\n`maxlength` property.\nIf set to `true` the characters exceeding the `maxlength` value are selected on\npaste and the counter below the component displays their number.",
349
354
  "privacy": "public",
350
- "_ui5since": "2.0.0",
351
- "_ui5validator": "Boolean"
355
+ "_ui5since": "2.0.0"
352
356
  },
353
357
  {
354
358
  "kind": "field",
@@ -359,8 +363,7 @@
359
363
  "default": "false",
360
364
  "description": "Defines whether the component is in disabled state.\n\n**Note:** A disabled component is completely noninteractive.",
361
365
  "privacy": "public",
362
- "_ui5since": "2.0.0",
363
- "_ui5validator": "Boolean"
366
+ "_ui5since": "2.0.0"
364
367
  },
365
368
  {
366
369
  "kind": "field",
@@ -371,8 +374,7 @@
371
374
  "default": "false",
372
375
  "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.",
373
376
  "privacy": "public",
374
- "_ui5since": "2.0.0",
375
- "_ui5validator": "Boolean"
377
+ "_ui5since": "2.0.0"
376
378
  },
377
379
  {
378
380
  "kind": "field",
@@ -383,8 +385,7 @@
383
385
  "description": "Sets the maximum number of characters available in the input field.",
384
386
  "default": "undefined",
385
387
  "privacy": "public",
386
- "_ui5since": "2.0.0",
387
- "_ui5validator": "Number"
388
+ "_ui5since": "2.0.0"
388
389
  },
389
390
  {
390
391
  "kind": "field",
@@ -402,8 +403,17 @@
402
403
  "default": "\"None\"",
403
404
  "description": "Defines the value state of the component.",
404
405
  "privacy": "public",
405
- "_ui5since": "2.0.0",
406
- "_ui5validator": "String"
406
+ "_ui5since": "2.0.0"
407
+ },
408
+ {
409
+ "kind": "field",
410
+ "name": "showSuggestions",
411
+ "type": {
412
+ "text": "boolean"
413
+ },
414
+ "default": "false",
415
+ "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
416
+ "privacy": "public"
407
417
  }
408
418
  ],
409
419
  "events": [
@@ -516,6 +526,15 @@
516
526
  "type": {
517
527
  "text": "\"Positive\" | \"Negative\" | \"None\" | \"Critical\" | \"Information\""
518
528
  }
529
+ },
530
+ {
531
+ "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
532
+ "name": "show-suggestions",
533
+ "default": "false",
534
+ "fieldName": "showSuggestions",
535
+ "type": {
536
+ "text": "boolean"
537
+ }
519
538
  }
520
539
  ],
521
540
  "superclass": {
package/dist/custom-elements.json CHANGED
@@ -252,6 +252,10 @@
252
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",
253
253
  "name": "PromptInput",
254
254
  "slots": [
255
+ {
256
+ "name": "default",
257
+ "description": "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\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience."
258
+ },
255
259
  {
256
260
  "name": "valueStateMessage",
257
261
  "description": "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."
@@ -354,6 +358,16 @@
354
358
  "default": "\"None\"",
355
359
  "description": "Defines the value state of the component.",
356
360
  "privacy": "public"
361
+ },
362
+ {
363
+ "kind": "field",
364
+ "name": "showSuggestions",
365
+ "type": {
366
+ "text": "boolean"
367
+ },
368
+ "default": "false",
369
+ "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
370
+ "privacy": "public"
357
371
  }
358
372
  ],
359
373
  "events": [
@@ -460,6 +474,15 @@
460
474
  "type": {
461
475
  "text": "\"Positive\" | \"Negative\" | \"None\" | \"Critical\" | \"Information\""
462
476
  }
477
+ },
478
+ {
479
+ "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
480
+ "name": "show-suggestions",
481
+ "default": "false",
482
+ "fieldName": "showSuggestions",
483
+ "type": {
484
+ "text": "boolean"
485
+ }
463
486
  }
464
487
  ],
465
488
  "superclass": {
package/dist/generated/templates/PromptInputTemplate.lit.js CHANGED
@@ -1,6 +1,6 @@
1
1
  /* eslint no-unused-vars: 0 */
2
2
  import { html, ifDefined, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
3
- function block0(context, tags, suffix) { return suffix ? html `<div class="ai-prompt-input-wrapper">${this.label ? block1.call(this, context, tags, suffix) : undefined}<div class="ai-prompt-input-form-wrapper"><div class="ai-prompt-inner-input-wrapper"><${scopeTag("ui5-input", tags, suffix)} id="input" .value="${ifDefined(this.value)}" placeholder="${ifDefined(this.placeholder)}" value-state="${ifDefined(this.valueState)}" ?show-clear-icon=${this.showClearIcon} ?disabled="${this.disabled}" ?readonly="${this.readonly}" @keydown="${this._onkeydown}" @ui5-input="${ifDefined(this._onInnerInput)}" @ui5-change="${ifDefined(this._onInnerChange)}">${this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined}</${scopeTag("ui5-input", tags, suffix)}>${this.showExceededText ? block3.call(this, context, tags, suffix) : undefined}</div><${scopeTag("ui5-button", tags, suffix)} ?disabled=${this._submitButtonDisabled} class="ai-prompt-input-button" design="Emphasized" icon="paper-plane" @click="${this._onButtonClick}"></${scopeTag("ui5-button", tags, suffix)}></div></div>` : html `<div class="ai-prompt-input-wrapper">${this.label ? block1.call(this, context, tags, suffix) : undefined}<div class="ai-prompt-input-form-wrapper"><div class="ai-prompt-inner-input-wrapper"><ui5-input id="input" .value="${ifDefined(this.value)}" placeholder="${ifDefined(this.placeholder)}" value-state="${ifDefined(this.valueState)}" ?show-clear-icon=${this.showClearIcon} ?disabled="${this.disabled}" ?readonly="${this.readonly}" @keydown="${this._onkeydown}" @ui5-input="${ifDefined(this._onInnerInput)}" @ui5-change="${ifDefined(this._onInnerChange)}">${this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined}</ui5-input>${this.showExceededText ? block3.call(this, context, tags, suffix) : undefined}</div><ui5-button ?disabled=${this._submitButtonDisabled} class="ai-prompt-input-button" design="Emphasized" icon="paper-plane" @click="${this._onButtonClick}"></ui5-button></div></div>`; }
3
+ function block0(context, tags, suffix) { return suffix ? html `<div class="ai-prompt-input-wrapper">${this.label ? block1.call(this, context, tags, suffix) : undefined}<div class="ai-prompt-input-form-wrapper"><div class="ai-prompt-inner-input-wrapper"><${scopeTag("ui5-input", tags, suffix)} id="input" .value="${ifDefined(this.value)}" placeholder="${ifDefined(this.placeholder)}" value-state="${ifDefined(this.valueState)}" ?show-clear-icon=${this.showClearIcon} ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?show-suggestions="${this.showSuggestions}" @keydown="${this._onkeydown}" @ui5-input="${ifDefined(this._onInnerInput)}" @ui5-change="${ifDefined(this._onInnerChange)}" @ui5-type-ahead="${ifDefined(this._onTypeAhead)}"><slot></slot>${this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined}</${scopeTag("ui5-input", tags, suffix)}>${this.showExceededText ? block3.call(this, context, tags, suffix) : undefined}</div><${scopeTag("ui5-button", tags, suffix)} ?disabled=${this._submitButtonDisabled} class="ai-prompt-input-button" design="Emphasized" icon="paper-plane" @click="${this._onButtonClick}"></${scopeTag("ui5-button", tags, suffix)}></div></div>` : html `<div class="ai-prompt-input-wrapper">${this.label ? block1.call(this, context, tags, suffix) : undefined}<div class="ai-prompt-input-form-wrapper"><div class="ai-prompt-inner-input-wrapper"><ui5-input id="input" .value="${ifDefined(this.value)}" placeholder="${ifDefined(this.placeholder)}" value-state="${ifDefined(this.valueState)}" ?show-clear-icon=${this.showClearIcon} ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?show-suggestions="${this.showSuggestions}" @keydown="${this._onkeydown}" @ui5-input="${ifDefined(this._onInnerInput)}" @ui5-change="${ifDefined(this._onInnerChange)}" @ui5-type-ahead="${ifDefined(this._onTypeAhead)}"><slot></slot>${this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined}</ui5-input>${this.showExceededText ? block3.call(this, context, tags, suffix) : undefined}</div><ui5-button ?disabled=${this._submitButtonDisabled} class="ai-prompt-input-button" design="Emphasized" icon="paper-plane" @click="${this._onButtonClick}"></ui5-button></div></div>`; }
4
4
  function block1(context, tags, suffix) { return suffix ? html `<${scopeTag("ui5-label", tags, suffix)} for="input">${ifDefined(this.label)}</${scopeTag("ui5-label", tags, suffix)}>` : html `<ui5-label for="input">${ifDefined(this.label)}</ui5-label>`; }
5
5
  function block2(context, tags, suffix) { return html `<slot name="valueStateMessage" slot="valueStateMessage"></slot>`; }
6
6
  function block3(context, tags, suffix) { return suffix ? html `<${scopeTag("ui5-label", tags, suffix)} class="ai-prompt-input-counter">${ifDefined(this._exceededText)}</${scopeTag("ui5-label", tags, suffix)}>` : html `<ui5-label class="ai-prompt-input-counter">${ifDefined(this._exceededText)}</ui5-label>`; }
package/dist/generated/templates/PromptInputTemplate.lit.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PromptInputTemplate.lit.js","sourceRoot":"","sources":["../../../src/generated/templates/PromptInputTemplate.lit.ts"],"names":[],"mappings":"AAAA,8BAA8B;AAC9B,OAAO,EAAE,IAAI,EAAmC,SAAS,EAAc,QAAQ,EAAE,MAAM,sDAAsD,CAAC;AAK9I,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,wCAAyC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,yFAAyF,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,uBAAuB,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,sBAAsB,IAAI,CAAC,aAAa,eAAe,IAAI,CAAC,QAAQ,gBAAgB,IAAI,CAAC,QAAQ,eAAe,IAAI,CAAC,UAAU,iBAAiB,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,KAAM,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,KAAK,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,IAAK,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,UAAU,QAAQ,CAAC,YAAY,EAAE,IAAI,EAAE,MAAM,CAAC,cAAc,IAAI,CAAC,qBAAqB,kFAAkF,IAAI,CAAC,cAAc,OAAO,QAAQ,CAAC,YAAY,EAAE,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAA,wCAAyC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,sHAAsH,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,sBAAsB,IAAI,CAAC,aAAa,eAAe,IAAI,CAAC,QAAQ,gBAAgB,IAAI,CAAC,QAAQ,eAAe,IAAI,CAAC,UAAU,iBAAiB,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,KAAM,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,eAAgB,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,+BAA+B,IAAI,CAAC,qBAAqB,kFAAkF,IAAI,CAAC,cAAc,6BAA6B,CAAC,CAAA,CAAC;AACtjE,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,IAAI,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,gBAAgB,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAA,0BAA0B,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA,CAAC;AACxT,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,iEAAiE,CAAC,CAAA,CAAC;AACrL,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,IAAI,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,oCAAoC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAA,8CAA8C,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAA,CAAC;AAGhX,eAAe,MAAM,CAAC","sourcesContent":["/* eslint no-unused-vars: 0 */\nimport { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport type UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\n\timport type PromptInput from \"../../PromptInput.js\";\n\timport type { ClassMapValue } from \"@ui5/webcomponents-base/dist/types.js\";\n\t\nfunction block0 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class=\"ai-prompt-input-wrapper\">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class=\"ai-prompt-input-form-wrapper\"><div class=\"ai-prompt-inner-input-wrapper\"><${scopeTag(\"ui5-input\", tags, suffix)} id=\"input\" .value=\"${ifDefined(this.value)}\" placeholder=\"${ifDefined(this.placeholder)}\" value-state=\"${ifDefined(this.valueState)}\" ?show-clear-icon=${this.showClearIcon} ?disabled=\"${this.disabled}\" ?readonly=\"${this.readonly}\" @keydown=\"${this._onkeydown}\" @ui5-input=\"${ifDefined(this._onInnerInput)}\" @ui5-change=\"${ifDefined(this._onInnerChange)}\">${ this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined }</${scopeTag(\"ui5-input\", tags, suffix)}>${ this.showExceededText ? block3.call(this, context, tags, suffix) : undefined }</div><${scopeTag(\"ui5-button\", tags, suffix)} ?disabled=${this._submitButtonDisabled} class=\"ai-prompt-input-button\" design=\"Emphasized\" icon=\"paper-plane\" @click=\"${this._onButtonClick}\"></${scopeTag(\"ui5-button\", tags, suffix)}></div></div>` : html`<div class=\"ai-prompt-input-wrapper\">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class=\"ai-prompt-input-form-wrapper\"><div class=\"ai-prompt-inner-input-wrapper\"><ui5-input id=\"input\" .value=\"${ifDefined(this.value)}\" placeholder=\"${ifDefined(this.placeholder)}\" value-state=\"${ifDefined(this.valueState)}\" ?show-clear-icon=${this.showClearIcon} ?disabled=\"${this.disabled}\" ?readonly=\"${this.readonly}\" @keydown=\"${this._onkeydown}\" @ui5-input=\"${ifDefined(this._onInnerInput)}\" @ui5-change=\"${ifDefined(this._onInnerChange)}\">${ this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined }</ui5-input>${ this.showExceededText ? block3.call(this, context, tags, suffix) : undefined }</div><ui5-button ?disabled=${this._submitButtonDisabled} class=\"ai-prompt-input-button\" design=\"Emphasized\" icon=\"paper-plane\" @click=\"${this._onButtonClick}\"></ui5-button></div></div>`;}\nfunction block1 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag(\"ui5-label\", tags, suffix)} for=\"input\">${ifDefined(this.label)}</${scopeTag(\"ui5-label\", tags, suffix)}>` : html`<ui5-label for=\"input\">${ifDefined(this.label)}</ui5-label>`;}\nfunction block2 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot name=\"valueStateMessage\" slot=\"valueStateMessage\"></slot>`;}\nfunction block3 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag(\"ui5-label\", tags, suffix)} class=\"ai-prompt-input-counter\">${ifDefined(this._exceededText)}</${scopeTag(\"ui5-label\", tags, suffix)}>` : html`<ui5-label class=\"ai-prompt-input-counter\">${ifDefined(this._exceededText)}</ui5-label>`;}\n\n\nexport default block0;"]}
1
+ {"version":3,"file":"PromptInputTemplate.lit.js","sourceRoot":"","sources":["../../../src/generated/templates/PromptInputTemplate.lit.ts"],"names":[],"mappings":"AAAA,8BAA8B;AAC9B,OAAO,EAAE,IAAI,EAAmC,SAAS,EAAc,QAAQ,EAAE,MAAM,sDAAsD,CAAC;AAK9I,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,wCAAyC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,yFAAyF,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,uBAAuB,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,sBAAsB,IAAI,CAAC,aAAa,eAAe,IAAI,CAAC,QAAQ,gBAAgB,IAAI,CAAC,QAAQ,wBAAwB,IAAI,CAAC,eAAe,eAAe,IAAI,CAAC,UAAU,iBAAiB,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,sBAAsB,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,kBAAmB,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,KAAK,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,IAAK,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,UAAU,QAAQ,CAAC,YAAY,EAAE,IAAI,EAAE,MAAM,CAAC,cAAc,IAAI,CAAC,qBAAqB,kFAAkF,IAAI,CAAC,cAAc,OAAO,QAAQ,CAAC,YAAY,EAAE,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAA,wCAAyC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,sHAAsH,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,sBAAsB,IAAI,CAAC,aAAa,eAAe,IAAI,CAAC,QAAQ,gBAAgB,IAAI,CAAC,QAAQ,wBAAwB,IAAI,CAAC,eAAe,eAAe,IAAI,CAAC,UAAU,iBAAiB,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,sBAAsB,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,kBAAmB,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,eAAgB,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,+BAA+B,IAAI,CAAC,qBAAqB,kFAAkF,IAAI,CAAC,cAAc,6BAA6B,CAAC,CAAA,CAAC;AAC5wE,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,IAAI,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,gBAAgB,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAA,0BAA0B,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA,CAAC;AACxT,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,iEAAiE,CAAC,CAAA,CAAC;AACrL,SAAS,MAAM,CAAqB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,IAAI,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,oCAAoC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAA,8CAA8C,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAA,CAAC;AAGhX,eAAe,MAAM,CAAC","sourcesContent":["/* eslint no-unused-vars: 0 */\nimport { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport type UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\n\timport type PromptInput from \"../../PromptInput.js\";\n\timport type { ClassMapValue } from \"@ui5/webcomponents-base/dist/types.js\";\n\t\nfunction block0 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class=\"ai-prompt-input-wrapper\">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class=\"ai-prompt-input-form-wrapper\"><div class=\"ai-prompt-inner-input-wrapper\"><${scopeTag(\"ui5-input\", tags, suffix)} id=\"input\" .value=\"${ifDefined(this.value)}\" placeholder=\"${ifDefined(this.placeholder)}\" value-state=\"${ifDefined(this.valueState)}\" ?show-clear-icon=${this.showClearIcon} ?disabled=\"${this.disabled}\" ?readonly=\"${this.readonly}\" ?show-suggestions=\"${this.showSuggestions}\" @keydown=\"${this._onkeydown}\" @ui5-input=\"${ifDefined(this._onInnerInput)}\" @ui5-change=\"${ifDefined(this._onInnerChange)}\" @ui5-type-ahead=\"${ifDefined(this._onTypeAhead)}\"><slot></slot>${ this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined }</${scopeTag(\"ui5-input\", tags, suffix)}>${ this.showExceededText ? block3.call(this, context, tags, suffix) : undefined }</div><${scopeTag(\"ui5-button\", tags, suffix)} ?disabled=${this._submitButtonDisabled} class=\"ai-prompt-input-button\" design=\"Emphasized\" icon=\"paper-plane\" @click=\"${this._onButtonClick}\"></${scopeTag(\"ui5-button\", tags, suffix)}></div></div>` : html`<div class=\"ai-prompt-input-wrapper\">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class=\"ai-prompt-input-form-wrapper\"><div class=\"ai-prompt-inner-input-wrapper\"><ui5-input id=\"input\" .value=\"${ifDefined(this.value)}\" placeholder=\"${ifDefined(this.placeholder)}\" value-state=\"${ifDefined(this.valueState)}\" ?show-clear-icon=${this.showClearIcon} ?disabled=\"${this.disabled}\" ?readonly=\"${this.readonly}\" ?show-suggestions=\"${this.showSuggestions}\" @keydown=\"${this._onkeydown}\" @ui5-input=\"${ifDefined(this._onInnerInput)}\" @ui5-change=\"${ifDefined(this._onInnerChange)}\" @ui5-type-ahead=\"${ifDefined(this._onTypeAhead)}\"><slot></slot>${ this.valueStateMessage.length ? block2.call(this, context, tags, suffix) : undefined }</ui5-input>${ this.showExceededText ? block3.call(this, context, tags, suffix) : undefined }</div><ui5-button ?disabled=${this._submitButtonDisabled} class=\"ai-prompt-input-button\" design=\"Emphasized\" icon=\"paper-plane\" @click=\"${this._onButtonClick}\"></ui5-button></div></div>`;}\nfunction block1 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag(\"ui5-label\", tags, suffix)} for=\"input\">${ifDefined(this.label)}</${scopeTag(\"ui5-label\", tags, suffix)}>` : html`<ui5-label for=\"input\">${ifDefined(this.label)}</ui5-label>`;}\nfunction block2 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot name=\"valueStateMessage\" slot=\"valueStateMessage\"></slot>`;}\nfunction block3 (this: PromptInput, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag(\"ui5-label\", tags, suffix)} class=\"ai-prompt-input-counter\">${ifDefined(this._exceededText)}</${scopeTag(\"ui5-label\", tags, suffix)}>` : html`<ui5-label class=\"ai-prompt-input-counter\">${ifDefined(this._exceededText)}</ui5-label>`;}\n\n\nexport default block0;"]}
package/dist/vscode.html-custom-data.json CHANGED
@@ -59,7 +59,7 @@
59
59
  },
60
60
  {
61
61
  "name": "ui5-ai-prompt-input",
62
- "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\n\n\n\n### **Events:**\n - **submit** - Fired when the input operation has finished by pressing Enter\nor AI button is clicked.\n- **input** - Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected.\n- **change** - Fired when the input operation has finished by pressing Enter\nor on focusout.\n\n### **Slots:**\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.",
62
+ "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\n\n\n\n### **Events:**\n - **submit** - Fired when the input operation has finished by pressing Enter\nor AI button is clicked.\n- **input** - Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected.\n- **change** - Fired when the input operation has finished by pressing Enter\nor on focusout.\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\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.\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.",
63
63
  "attributes": [
64
64
  {
65
65
  "name": "value",
@@ -111,6 +111,11 @@
111
111
  { "name": "Critical" },
112
112
  { "name": "Information" }
113
113
  ]
114
+ },
115
+ {
116
+ "name": "show-suggestions",
117
+ "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
118
+ "values": []
114
119
  }
115
120
  ],
116
121
  "references": []
package/dist/web-types.json CHANGED
@@ -1,7 +1,7 @@
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.0.1",
4
+ "version": "2.1.0-rc.1",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -125,7 +125,7 @@
125
125
  },
126
126
  {
127
127
  "name": "ui5-ai-prompt-input",
128
- "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 - **submit** - Fired when the input operation has finished by pressing Enter\nor AI button is clicked.\n- **input** - Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected.\n- **change** - Fired when the input operation has finished by pressing Enter\nor on focusout.\n\n### **Slots:**\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.",
128
+ "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 - **submit** - Fired when the input operation has finished by pressing Enter\nor AI button is clicked.\n- **input** - Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected.\n- **change** - Fired when the input operation has finished by pressing Enter\nor on focusout.\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\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.\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.",
129
129
  "doc-url": "",
130
130
  "attributes": [
131
131
  {
@@ -175,9 +175,18 @@
175
175
  "type": "\"Positive\" | \"Negative\" | \"None\" | \"Critical\" | \"Information\"",
176
176
  "default": "\"None\""
177
177
  }
178
+ },
179
+ {
180
+ "name": "show-suggestions",
181
+ "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
182
+ "value": { "type": "boolean", "default": "false" }
178
183
  }
179
184
  ],
180
185
  "slots": [
186
+ {
187
+ "name": "default",
188
+ "description": "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\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience."
189
+ },
181
190
  {
182
191
  "name": "valueStateMessage",
183
192
  "description": "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."
@@ -245,6 +254,11 @@
245
254
  "value": {
246
255
  "type": "\"Positive\" | \"Negative\" | \"None\" | \"Critical\" | \"Information\""
247
256
  }
257
+ },
258
+ {
259
+ "name": "show-suggestions",
260
+ "description": "Defines whether the component should show suggestions, if such are present.\n\n**Note:** You need to import the `InputSuggestions` module\nfrom `\"@ui5/webcomponents/dist/features/InputSuggestions.js\"` to enable this functionality.",
261
+ "value": { "type": "boolean" }
248
262
  }
249
263
  ],
250
264
  "events": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ui5/webcomponents-ai",
3
- "version": "2.0.1",
3
+ "version": "2.1.0-rc.1",
4
4
  "description": "UI5 Web Components: webcomponents.ai",
5
5
  "ui5": {
6
6
  "webComponentsPackage": true
@@ -45,14 +45,14 @@
45
45
  "directory": "packages/ai"
46
46
  },
47
47
  "dependencies": {
48
- "@ui5/webcomponents": "2.0.1",
49
- "@ui5/webcomponents-base": "2.0.1",
50
- "@ui5/webcomponents-icons": "2.0.1",
51
- "@ui5/webcomponents-theming": "2.0.1"
48
+ "@ui5/webcomponents": "2.1.0-rc.1",
49
+ "@ui5/webcomponents-base": "2.1.0-rc.1",
50
+ "@ui5/webcomponents-icons": "2.1.0-rc.1",
51
+ "@ui5/webcomponents-theming": "2.1.0-rc.1"
52
52
  },
53
53
  "devDependencies": {
54
- "@ui5/webcomponents-tools": "2.0.1",
54
+ "@ui5/webcomponents-tools": "2.1.0-rc.1",
55
55
  "chromedriver": "^125.0.0"
56
56
  },
57
- "gitHead": "9b383e20fc3b22750f92f103c54e13529992fc74"
57
+ "gitHead": "87939ef793d60480ba9571b194223cf5ac8ba031"
58
58
  }
package/src/PromptInput.hbs CHANGED
@@ -13,10 +13,15 @@
13
13
  ?show-clear-icon={{showClearIcon}}
14
14
  ?disabled="{{disabled}}"
15
15
  ?readonly="{{readonly}}"
16
+ ?show-suggestions="{{showSuggestions}}"
16
17
  @keydown="{{_onkeydown}}"
17
18
  @ui5-input="{{_onInnerInput}}"
18
19
  @ui5-change="{{_onInnerChange}}"
20
+ @ui5-type-ahead="{{_onTypeAhead}}"
19
21
  >
22
+ {{!-- suggestions --}}
23
+ <slot></slot>
24
+
20
25
  {{#if valueStateMessage.length}}
21
26
  <slot name="valueStateMessage" slot="valueStateMessage"></slot>
22
27
  {{/if}}