@ui5/webcomponents-ai 0.0.0-9261ac932 → 0.0.0-95afb1087

package/dist/PromptInput.d.ts

@@ -1,8 +1,9 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import type ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
-import "@ui5/webcomponents-icons/dist/paper-plane.js";
-import type { IInputSuggestionItem, InputEventDetail } from "@ui5/webcomponents/dist/Input.js";
+import type { IInputSuggestionItem } from "@ui5/webcomponents/dist/Input.js";
+import type Input from "@ui5/webcomponents/dist/Input.js";
+import type { UI5CustomEvent } from "@ui5/webcomponents-base/dist/index.js";
 /**
  * @class
  * ### Overview
@@ -13,7 +14,7 @@ import type { IInputSuggestionItem, InputEventDetail } from "@ui5/webcomponents/
  *
  * ### ES6 Module Import
  *
- * `import "@ui5/webcomponents-ai/dist/PromptInput.js
+ * `import "@ui5/webcomponents-ai/dist/PromptInput.js"`
  * @class
  * @constructor
  * @public
@@ -21,6 +22,11 @@ import type { IInputSuggestionItem, InputEventDetail } from "@ui5/webcomponents/
  * @experimental The **@ui5/webcomponents-ai** package is under development and considered experimental - components' APIs are subject to change.
  */
 declare class PromptInput extends UI5Element {
+    eventDetails: {
+        submit: void;
+        input: void;
+        change: void;
+    };
     /**
      * Defines the value of the component.
      *
@@ -102,8 +108,6 @@ declare class PromptInput extends UI5Element {
     /**
      * Defines whether the component should show suggestions, if such are present.
      *
-     * **Note:** You need to import the `InputSuggestions` module
-     * from `"@ui5/webcomponents/dist/features/InputSuggestions.js"` to enable this functionality.
      * @default false
      * @public
      */
@@ -116,11 +120,6 @@ declare class PromptInput extends UI5Element {
      *
      * **Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.
      *
-     * **Note:** Importing the Input Suggestions Support feature:
-     *
-     * `import "@ui5/webcomponents/dist/features/InputSuggestions.js";`
-     *
-     * automatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.
      * @public
      */
     suggestionItems: Array<IInputSuggestionItem>;
@@ -139,10 +138,10 @@ declare class PromptInput extends UI5Element {
     valueStateMessage: Array<HTMLElement>;
     static i18nBundle: I18nBundle;
     _onkeydown(e: KeyboardEvent): void;
-    _onInnerInput(e: CustomEvent<InputEventDetail>): void;
+    _onInnerInput(e: UI5CustomEvent<Input, "input">): void;
     _onInnerChange(): void;
     _onButtonClick(): void;
-    _onTypeAhead(e: CustomEvent): void;
+    _onTypeAhead(e: UI5CustomEvent<Input, "type-ahead">): void;
     get _exceededText(): string | undefined;
     get _maxLenght(): number | undefined;
     get _submitButtonDisabled(): boolean;

package/dist/PromptInput.js

@@ -8,17 +8,13 @@ var PromptInput_1;
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
-import event from "@ui5/webcomponents-base/dist/decorators/event.js";
+import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
-import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
-import "@ui5/webcomponents-icons/dist/paper-plane.js";
-import Input from "@ui5/webcomponents/dist/Input.js";
-import Label from "@ui5/webcomponents/dist/Label.js";
-import Button from "@ui5/webcomponents/dist/Button.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import { isEnter, } from "@ui5/webcomponents-base/dist/Keys.js";
 import { PROMPT_INPUT_CHARACTERS_LEFT, PROMPT_INPUT_CHARACTERS_EXCEEDED, } from "./generated/i18n/i18n-defaults.js";
-import PromptInputTemplate from "./generated/templates/PromptInputTemplate.lit.js";
+import PromptInputTemplate from "./PromptInputTemplate.js";
 // Styles
 import PromptInputCss from "./generated/themes/PromptInput.css.js";
 /**
@@ -31,7 +27,7 @@ import PromptInputCss from "./generated/themes/PromptInput.css.js";
  *
  * ### ES6 Module Import
  *
- * `import "@ui5/webcomponents-ai/dist/PromptInput.js
+ * `import "@ui5/webcomponents-ai/dist/PromptInput.js"`
  * @class
  * @constructor
  * @public
@@ -98,8 +94,6 @@ let PromptInput = PromptInput_1 = class PromptInput extends UI5Element {
         /**
          * Defines whether the component should show suggestions, if such are present.
          *
-         * **Note:** You need to import the `InputSuggestions` module
-         * from `"@ui5/webcomponents/dist/features/InputSuggestions.js"` to enable this functionality.
          * @default false
          * @public
          */
@@ -111,7 +105,7 @@ let PromptInput = PromptInput_1 = class PromptInput extends UI5Element {
         }
     }
     _onInnerInput(e) {
-        this.value = e.target.value;
+        this.value = e.currentTarget.value;
         this.fireDecoratorEvent("input");
     }
     _onInnerChange() {
@@ -121,7 +115,7 @@ let PromptInput = PromptInput_1 = class PromptInput extends UI5Element {
         this.fireDecoratorEvent("submit");
     }
     _onTypeAhead(e) {
-        this.value = e.target.value;
+        this.value = e.currentTarget.value;
     }
     get _exceededText() {
         if (this.showExceededText) {
@@ -188,14 +182,9 @@ __decorate([
 PromptInput = PromptInput_1 = __decorate([
     customElement({
         tag: "ui5-ai-prompt-input",
-        renderer: litRender,
+        renderer: jsxRenderer,
         styles: PromptInputCss,
         template: PromptInputTemplate,
-        dependencies: [
-            Input,
-            Label,
-            Button,
-        ],
     })
     /**
      * Fired when the input operation has finished by pressing Enter

package/dist/PromptInput.js.map

@@ -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 i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.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\tbubbles: true,\n})\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\tbubbles: true,\n})\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\", {\n\tbubbles: true,\n})\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\t@i18n(\"@ui5/webcomponents-ai\")\n\tstatic i18nBundle: I18nBundle;\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireDecoratorEvent(\"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.fireDecoratorEvent(\"input\");\n\t}\n\n\t_onInnerChange() {\n\t\tthis.fireDecoratorEvent(\"change\");\n\t}\n\n\t_onButtonClick() {\n\t\tthis.fireDecoratorEvent(\"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"]}
+{"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-strict.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport type { IInputSuggestionItem } from \"@ui5/webcomponents/dist/Input.js\";\nimport type Input from \"@ui5/webcomponents/dist/Input.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 \"./PromptInputTemplate.js\";\n\n// Styles\nimport PromptInputCss from \"./generated/themes/PromptInput.css.js\";\nimport type { UI5CustomEvent } from \"@ui5/webcomponents-base/dist/index.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: jsxRenderer,\n\tstyles: PromptInputCss,\n\ttemplate: PromptInputTemplate,\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\tbubbles: true,\n})\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\tbubbles: true,\n})\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\", {\n\tbubbles: true,\n})\nclass PromptInput extends UI5Element {\n\teventDetails!: {\n\t\tsubmit: void;\n\t\tinput: void;\n\t\tchange: void;\n\t}\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 * @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 * @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\t@i18n(\"@ui5/webcomponents-ai\")\n\tstatic i18nBundle: I18nBundle;\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireDecoratorEvent(\"submit\");\n\t\t}\n\t}\n\n\t_onInnerInput(e: UI5CustomEvent<Input, \"input\">) {\n\t\tthis.value = e.currentTarget.value;\n\n\t\tthis.fireDecoratorEvent(\"input\");\n\t}\n\n\t_onInnerChange() {\n\t\tthis.fireDecoratorEvent(\"change\");\n\t}\n\n\t_onButtonClick() {\n\t\tthis.fireDecoratorEvent(\"submit\");\n\t}\n\n\t_onTypeAhead(e: UI5CustomEvent<Input, \"type-ahead\">): void {\n\t\tthis.value = e.currentTarget.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/PromptInputTemplate.d.ts

@@ -0,0 +1,2 @@
+import type PromptInput from "./PromptInput.js";
+export default function PromptInputTemplate(this: PromptInput): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/PromptInputTemplate.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import Label from "@ui5/webcomponents/dist/Label.js";
+import Input from "@ui5/webcomponents/dist/Input.js";
+import Button from "@ui5/webcomponents/dist/Button.js";
+import paperPlane from "@ui5/webcomponents-icons/dist/paper-plane.js";
+export default function PromptInputTemplate() {
+    return (_jsxs("div", { class: "ai-prompt-input-wrapper", children: [this.label &&
+                _jsx(Label, { for: "input", children: this.label }), _jsxs("div", { class: "ai-prompt-input-form-wrapper", children: [_jsxs("div", { class: "ai-prompt-inner-input-wrapper", children: [_jsxs(Input, { id: "input", value: this.value, placeholder: this.placeholder, valueState: this.valueState, showClearIcon: this.showClearIcon, disabled: this.disabled, readonly: this.readonly, showSuggestions: this.showSuggestions, onKeyDown: this._onkeydown, onInput: this._onInnerInput, onChange: this._onInnerChange, onTypeAhead: this._onTypeAhead, children: [_jsx("slot", {}), this.valueStateMessage.length > 0 &&
+                                        _jsx("slot", { name: "valueStateMessage", slot: "valueStateMessage" })] }), this.showExceededText &&
+                                _jsx(Label, { class: "ai-prompt-input-counter", children: this._exceededText })] }), _jsx(Button, { icon: paperPlane, disabled: this._submitButtonDisabled, class: "ai-prompt-input-button", design: "Emphasized", onClick: this._onButtonClick })] })] }));
+}
+//# sourceMappingURL=PromptInputTemplate.js.map

package/dist/PromptInputTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptInputTemplate.js","sourceRoot":"","sources":["../src/PromptInputTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,UAAU,MAAM,8CAA8C,CAAC;AAEtE,MAAM,CAAC,OAAO,UAAU,mBAAmB;IAC1C,OAAO,CACN,eAAK,KAAK,EAAC,yBAAyB,aAClC,IAAI,CAAC,KAAK;gBACV,KAAC,KAAK,IAAC,GAAG,EAAC,OAAO,YAAE,IAAI,CAAC,KAAK,GAAS,EAGxC,eAAK,KAAK,EAAC,8BAA8B,aACxC,eAAK,KAAK,EAAC,+BAA+B,aACzC,MAAC,KAAK,IACL,EAAE,EAAC,OAAO,EACV,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,WAAW,EAAE,IAAI,CAAC,YAAY,aAE9B,gBAAa,EACZ,IAAI,CAAC,iBAAiB,CAAC,MAAM,GAAG,CAAC;wCACjC,eAAM,IAAI,EAAC,mBAAmB,EAAC,IAAI,EAAC,mBAAmB,GAAQ,IAEzD,EAEP,IAAI,CAAC,gBAAgB;gCACrB,KAAC,KAAK,IAAC,KAAK,EAAC,yBAAyB,YAAE,IAAI,CAAC,aAAa,GAAS,IAE/D,EACN,KAAC,MAAM,IACN,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAE,IAAI,CAAC,qBAAqB,EACpC,KAAK,EAAC,wBAAwB,EAC9B,MAAM,EAAC,YAAY,EACnB,OAAO,EAAE,IAAI,CAAC,cAAc,GACpB,IACJ,IACD,CAAC,CAAC;AACV,CAAC","sourcesContent":["import type PromptInput from \"./PromptInput.js\";\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 paperPlane from \"@ui5/webcomponents-icons/dist/paper-plane.js\";\n\nexport default function PromptInputTemplate(this: PromptInput) {\n\treturn (\n\t\t<div class=\"ai-prompt-input-wrapper\">\n\t\t\t{this.label &&\n\t\t\t\t<Label for=\"input\">{this.label}</Label>\n\t\t\t}\n\n\t\t\t<div class=\"ai-prompt-input-form-wrapper\">\n\t\t\t\t<div class=\"ai-prompt-inner-input-wrapper\">\n\t\t\t\t\t<Input\n\t\t\t\t\t\tid=\"input\"\n\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\tvalueState={this.valueState}\n\t\t\t\t\t\tshowClearIcon={this.showClearIcon}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\treadonly={this.readonly}\n\t\t\t\t\t\tshowSuggestions={this.showSuggestions}\n\t\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\t\tonInput={this._onInnerInput}\n\t\t\t\t\t\tonChange={this._onInnerChange}\n\t\t\t\t\t\tonTypeAhead={this._onTypeAhead}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t{this.valueStateMessage.length > 0 &&\n\t\t\t\t\t\t\t<slot name=\"valueStateMessage\" slot=\"valueStateMessage\"></slot>\n\t\t\t\t\t\t}\n\t\t\t\t\t</Input>\n\n\t\t\t\t\t{this.showExceededText &&\n\t\t\t\t\t\t<Label class=\"ai-prompt-input-counter\">{this._exceededText}</Label>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t\t<Button\n\t\t\t\t\ticon={paperPlane}\n\t\t\t\t\tdisabled={this._submitButtonDisabled}\n\t\t\t\t\tclass=\"ai-prompt-input-button\"\n\t\t\t\t\tdesign=\"Emphasized\"\n\t\t\t\t\tonClick={this._onButtonClick}>\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</div>);\n}\n"]}

package/dist/TextArea.d.ts

@@ -0,0 +1,118 @@
+import { BaseTextArea } from "@ui5/webcomponents/dist/TextArea.js";
+import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+type TextAreaVersionChangeEventDetail = {
+    backwards: boolean;
+};
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-ai-textarea` component extends the standard TextArea with Writing Assistant capabilities.
+ * It provides AI-powered text generation, editing suggestions, and version management functionality.
+ *
+ * ### Structure
+ * The `ui5-ai-textarea` consists of the following elements:
+ * - TextArea: The main text input area with all standard textarea functionality
+ * - WritingAssistant: Dedicated toolbar containing:
+ *   - Versioning: A component with left/right navigation buttons and a label for browsing AI-generated versions
+ *   - AI Button: Opens a menu that can be extended with custom AI generation options through slotting
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents-ai/dist/TextArea.js";`
+ *
+ * @constructor
+ * @extends BaseTextArea
+ * @experimental The **@ui5/webcomponents-ai** package is under development and considered experimental - components' APIs are subject to change.
+ * @since 2.16.0
+ * @public
+ * @slot {HTMLElement} menu Defines a slot for `ui5-menu` integration. This slot allows you to pass a `ui5-menu` instance that will be associated with the assistant.
+ */
+declare class TextArea extends BaseTextArea {
+    eventDetails: BaseTextArea["eventDetails"] & {
+        "version-change": TextAreaVersionChangeEventDetail;
+        "stop-generation": void;
+    };
+    private _keydownHandler?;
+    /**
+     * Defines whether the `ui5-ai-textarea` is currently in a loading(processing) state.
+     *
+     * @default false
+     * @public
+     */
+    loading: boolean;
+    /**
+     * Defines the prompt description of the current action.
+     *
+     * @default ""
+     * @public
+     */
+    promptDescription: string;
+    /**
+     * Indicates the index of the currently displayed version.
+     *
+     *
+     * @default 0
+     * @public
+     */
+    currentVersion: number;
+    /**
+     * Indicates the total number of result versions available.
+     *
+     * Notes:
+     * Versioning is hidden if the value is `0`
+     *
+     * @default 0
+     * @public
+     */
+    totalVersions: number;
+    menu: Array<HTMLElement>;
+    static i18nBundle: I18nBundle;
+    static onDefine(): Promise<void>;
+    /**
+     * Handles the click event for the "Previous Version" button.
+     * Updates the current version index and syncs content.
+     */
+    _handlePreviousVersionClick(): void;
+    /**
+     * Handles the click event for the "Next Version" button.
+     * Updates the current version index and syncs content.
+     */
+    _handleNextVersionClick(): void;
+    /**
+     * Handles the version change event from the writing assistant.
+     */
+    _handleVersionChange(e: CustomEvent<{
+        backwards: boolean;
+    }>): void;
+    /**
+     * Handles keydown events for keyboard shortcuts.
+     * @private
+     */
+    _handleKeydown(keyboardEvent: KeyboardEvent): void;
+    /**
+     * Overrides the parent's onAfterRendering to add keydown handler.
+     * @private
+     */
+    onAfterRendering(): void;
+    /**
+     * Handles the generate click event from the AI toolbar.
+     * Opens the AI menu and sets the opener element.
+     *
+     * @private
+     */
+    _handleAIButtonClick: (e: CustomEvent<{
+        clickTarget?: HTMLElement;
+    }>) => void;
+    get _ariaLabel(): string;
+    /**
+     * Handles the stop generation event from the AI toolbar.
+     * Fires the stop-generation event to notify listeners.
+     *
+     * @private
+     */
+    handleStopGeneration: () => void;
+}
+export type { TextAreaVersionChangeEventDetail };
+export default TextArea;

package/dist/TextArea.js

@@ -0,0 +1,230 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var TextArea_1;
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
+import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
+import { BaseTextArea } from "@ui5/webcomponents/dist/TextArea.js";
+import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import { WRITING_ASSISTANT_LABEL, } from "./generated/i18n/i18n-defaults.js";
+// Styles
+import TextAreaCss from "./generated/themes/TextArea.css.js";
+import textareaStyles from "@ui5/webcomponents/dist/generated/themes/TextArea.css.js";
+import valueStateMessageStyles from "@ui5/webcomponents/dist/generated/themes/ValueStateMessage.css.js";
+// Templates
+import TextAreaTemplate from "./TextAreaTemplate.js";
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-ai-textarea` component extends the standard TextArea with Writing Assistant capabilities.
+ * It provides AI-powered text generation, editing suggestions, and version management functionality.
+ *
+ * ### Structure
+ * The `ui5-ai-textarea` consists of the following elements:
+ * - TextArea: The main text input area with all standard textarea functionality
+ * - WritingAssistant: Dedicated toolbar containing:
+ *   - Versioning: A component with left/right navigation buttons and a label for browsing AI-generated versions
+ *   - AI Button: Opens a menu that can be extended with custom AI generation options through slotting
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents-ai/dist/TextArea.js";`
+ *
+ * @constructor
+ * @extends BaseTextArea
+ * @experimental The **@ui5/webcomponents-ai** package is under development and considered experimental - components' APIs are subject to change.
+ * @since 2.16.0
+ * @public
+ * @slot {HTMLElement} menu Defines a slot for `ui5-menu` integration. This slot allows you to pass a `ui5-menu` instance that will be associated with the assistant.
+ */
+let TextArea = TextArea_1 = class TextArea extends BaseTextArea {
+    constructor() {
+        super(...arguments);
+        /**
+         * Defines whether the `ui5-ai-textarea` is currently in a loading(processing) state.
+         *
+         * @default false
+         * @public
+         */
+        this.loading = false;
+        /**
+         * Defines the prompt description of the current action.
+         *
+         * @default ""
+         * @public
+         */
+        this.promptDescription = "";
+        /**
+         * Indicates the index of the currently displayed version.
+         *
+         *
+         * @default 0
+         * @public
+         */
+        this.currentVersion = 0;
+        /**
+         * Indicates the total number of result versions available.
+         *
+         * Notes:
+         * Versioning is hidden if the value is `0`
+         *
+         * @default 0
+         * @public
+         */
+        this.totalVersions = 0;
+        /**
+         * Handles the generate click event from the AI toolbar.
+         * Opens the AI menu and sets the opener element.
+         *
+         * @private
+         */
+        this._handleAIButtonClick = (e) => {
+            const menuNodes = this.getSlottedNodes("menu");
+            if (menuNodes.length === 0) {
+                return;
+            }
+            if (!e.detail?.clickTarget) {
+                return;
+            }
+            const menu = menuNodes[0];
+            if (menu && typeof menu.open !== "undefined") {
+                menu.opener = e.detail.clickTarget;
+                menu.open = true;
+            }
+        };
+        /**
+         * Handles the stop generation event from the AI toolbar.
+         * Fires the stop-generation event to notify listeners.
+         *
+         * @private
+         */
+        this.handleStopGeneration = () => {
+            this.fireDecoratorEvent("stop-generation");
+        };
+    }
+    static async onDefine() {
+        TextArea_1.i18nBundle = await getI18nBundle("@ui5/webcomponents-ai");
+    }
+    /**
+     * Handles the click event for the "Previous Version" button.
+     * Updates the current version index and syncs content.
+     */
+    _handlePreviousVersionClick() {
+        this.fireDecoratorEvent("version-change", { backwards: true });
+    }
+    /**
+     * Handles the click event for the "Next Version" button.
+     * Updates the current version index and syncs content.
+     */
+    _handleNextVersionClick() {
+        this.fireDecoratorEvent("version-change", { backwards: false });
+    }
+    /**
+     * Handles the version change event from the writing assistant.
+     */
+    _handleVersionChange(e) {
+        if (e.detail.backwards) {
+            this._handlePreviousVersionClick();
+        }
+        else {
+            this._handleNextVersionClick();
+        }
+    }
+    /**
+     * Handles keydown events for keyboard shortcuts.
+     * @private
+     */
+    _handleKeydown(keyboardEvent) {
+        const isCtrlOrCmd = keyboardEvent.ctrlKey || keyboardEvent.metaKey;
+        const isShift = keyboardEvent.shiftKey;
+        if (isShift && keyboardEvent.key.toLowerCase() === "f4") {
+            const toolbar = this.shadowRoot?.querySelector("[ui5-ai-writing-assistant]");
+            const aiButton = toolbar?.shadowRoot?.querySelector("#ai-menu-btn");
+            if (aiButton) {
+                aiButton.focus();
+            }
+            return;
+        }
+        if (this.totalVersions > 1) {
+            if (isCtrlOrCmd && isShift && keyboardEvent.key.toLowerCase() === "z") {
+                keyboardEvent.preventDefault();
+                this._handlePreviousVersionClick();
+                return;
+            }
+            if (isCtrlOrCmd && isShift && keyboardEvent.key.toLowerCase() === "y") {
+                keyboardEvent.preventDefault();
+                this._handleNextVersionClick();
+            }
+        }
+    }
+    /**
+     * Overrides the parent's onAfterRendering to add keydown handler.
+     * @private
+     */
+    onAfterRendering() {
+        super.onAfterRendering();
+        // Add keydown event listener to the textarea
+        const textarea = this.shadowRoot?.querySelector("textarea");
+        if (textarea && !this._keydownHandler) {
+            this._keydownHandler = this._handleKeydown.bind(this);
+            textarea.addEventListener("keydown", this._keydownHandler);
+        }
+    }
+    get _ariaLabel() {
+        return this.accessibleName || TextArea_1.i18nBundle.getText(WRITING_ASSISTANT_LABEL);
+    }
+};
+__decorate([
+    property({ type: Boolean })
+], TextArea.prototype, "loading", void 0);
+__decorate([
+    property()
+], TextArea.prototype, "promptDescription", void 0);
+__decorate([
+    property({ type: Number })
+], TextArea.prototype, "currentVersion", void 0);
+__decorate([
+    property({ type: Number })
+], TextArea.prototype, "totalVersions", void 0);
+__decorate([
+    slot({ type: HTMLElement })
+], TextArea.prototype, "menu", void 0);
+TextArea = TextArea_1 = __decorate([
+    customElement({
+        tag: "ui5-ai-textarea",
+        languageAware: true,
+        renderer: jsxRenderer,
+        template: TextAreaTemplate,
+        styles: [
+            textareaStyles,
+            valueStateMessageStyles,
+            TextAreaCss,
+        ],
+    })
+    /**
+     * Fired when the user clicks on version navigation buttons.
+     *
+     * @param {boolean} backwards - Indicates if navigation is backwards (true) or forwards (false, default).
+     * @public
+     */
+    ,
+    event("version-change")
+    /**
+     * Fired when the user requests to stop AI text generation.
+     *
+     * @public
+     */
+    ,
+    event("stop-generation")
+], TextArea);
+TextArea.define();
+export default TextArea;
+//# sourceMappingURL=TextArea.js.map

package/dist/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\n\nimport { BaseTextArea } from \"@ui5/webcomponents/dist/TextArea.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport {\n\tWRITING_ASSISTANT_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\n// Styles\nimport TextAreaCss from \"./generated/themes/TextArea.css.js\";\nimport textareaStyles from \"@ui5/webcomponents/dist/generated/themes/TextArea.css.js\";\nimport valueStateMessageStyles from \"@ui5/webcomponents/dist/generated/themes/ValueStateMessage.css.js\";\n\n// Templates\nimport TextAreaTemplate from \"./TextAreaTemplate.js\";\n\ntype TextAreaVersionChangeEventDetail = {\n\tbackwards: boolean,\n};\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-ai-textarea` component extends the standard TextArea with Writing Assistant capabilities.\n * It provides AI-powered text generation, editing suggestions, and version management functionality.\n *\n * ### Structure\n * The `ui5-ai-textarea` consists of the following elements:\n * - TextArea: The main text input area with all standard textarea functionality\n * - WritingAssistant: Dedicated toolbar containing:\n *   - Versioning: A component with left/right navigation buttons and a label for browsing AI-generated versions\n *   - AI Button: Opens a menu that can be extended with custom AI generation options through slotting\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents-ai/dist/TextArea.js\";`\n *\n * @constructor\n * @extends BaseTextArea\n * @experimental The **@ui5/webcomponents-ai** package is under development and considered experimental - components' APIs are subject to change.\n * @since 2.16.0\n * @public\n * @slot {HTMLElement} menu Defines a slot for `ui5-menu` integration. This slot allows you to pass a `ui5-menu` instance that will be associated with the assistant.\n */\n@customElement({\n\ttag: \"ui5-ai-textarea\",\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: TextAreaTemplate,\n\tstyles: [\n\t\ttextareaStyles,\n\t\tvalueStateMessageStyles,\n\t\tTextAreaCss,\n\t],\n})\n\n/**\n * Fired when the user clicks on version navigation buttons.\n *\n * @param {boolean} backwards - Indicates if navigation is backwards (true) or forwards (false, default).\n * @public\n */\n@event(\"version-change\")\n\n/**\n * Fired when the user requests to stop AI text generation.\n *\n * @public\n */\n@event(\"stop-generation\")\n\nclass TextArea extends BaseTextArea {\n\teventDetails!: BaseTextArea[\"eventDetails\"] & {\n\t\t\"version-change\": TextAreaVersionChangeEventDetail;\n\t\t\"stop-generation\": void;\n\t};\n\n\t// Store bound handler for proper cleanup\n\tprivate _keydownHandler?: (event: KeyboardEvent) => void;\n\n\t/**\n\t * Defines whether the `ui5-ai-textarea` is currently in a loading(processing) state.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tloading = false;\n\n\t/**\n\t * Defines the prompt description of the current action.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tpromptDescription = \"\";\n\n\t/**\n\t * Indicates the index of the currently displayed version.\n\t *\n\t *\n\t * @default 0\n\t * @public\n\t */\n\t@property({ type: Number })\n\tcurrentVersion = 0;\n\n\t/**\n\t * Indicates the total number of result versions available.\n\t *\n\t * Notes:\n\t * Versioning is hidden if the value is `0`\n\t *\n\t * @default 0\n\t * @public\n\t */\n\t@property({ type: Number })\n\ttotalVersions = 0;\n\n\t@slot({ type: HTMLElement })\n\tmenu!: Array<HTMLElement>;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tstatic async onDefine() {\n\t\tTextArea.i18nBundle = await getI18nBundle(\"@ui5/webcomponents-ai\");\n\t}\n\n\t/**\n\t * Handles the click event for the \"Previous Version\" button.\n\t * Updates the current version index and syncs content.\n\t */\n\t_handlePreviousVersionClick(): void {\n\t\tthis.fireDecoratorEvent(\"version-change\", { backwards: true });\n\t}\n\n\t/**\n\t * Handles the click event for the \"Next Version\" button.\n\t * Updates the current version index and syncs content.\n\t */\n\t_handleNextVersionClick(): void {\n\t\tthis.fireDecoratorEvent(\"version-change\", { backwards: false });\n\t}\n\n\t/**\n\t * Handles the version change event from the writing assistant.\n\t */\n\t_handleVersionChange(e: CustomEvent<{ backwards: boolean }>): void {\n\t\tif (e.detail.backwards) {\n\t\t\tthis._handlePreviousVersionClick();\n\t\t} else {\n\t\t\tthis._handleNextVersionClick();\n\t\t}\n\t}\n\n\t/**\n\t * Handles keydown events for keyboard shortcuts.\n\t * @private\n\t */\n\t_handleKeydown(keyboardEvent: KeyboardEvent) {\n\t\tconst isCtrlOrCmd = keyboardEvent.ctrlKey || keyboardEvent.metaKey;\n\t\tconst isShift = keyboardEvent.shiftKey;\n\n\t\tif (isShift && keyboardEvent.key.toLowerCase() === \"f4\") {\n\t\t\tconst toolbar = this.shadowRoot?.querySelector(\"[ui5-ai-writing-assistant]\") as HTMLElement;\n\t\t\tconst aiButton = toolbar?.shadowRoot?.querySelector(\"#ai-menu-btn\") as HTMLElement;\n\n\t\t\tif (aiButton) {\n\t\t\t\taiButton.focus();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.totalVersions > 1) {\n\t\t\tif (isCtrlOrCmd && isShift && keyboardEvent.key.toLowerCase() === \"z\") {\n\t\t\t\tkeyboardEvent.preventDefault();\n\t\t\t\tthis._handlePreviousVersionClick();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (isCtrlOrCmd && isShift && keyboardEvent.key.toLowerCase() === \"y\") {\n\t\t\t\tkeyboardEvent.preventDefault();\n\t\t\t\tthis._handleNextVersionClick();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Overrides the parent's onAfterRendering to add keydown handler.\n\t * @private\n\t */\n\tonAfterRendering() {\n\t\tsuper.onAfterRendering();\n\n\t\t// Add keydown event listener to the textarea\n\t\tconst textarea = this.shadowRoot?.querySelector(\"textarea\");\n\t\tif (textarea && !this._keydownHandler) {\n\t\t\tthis._keydownHandler = this._handleKeydown.bind(this);\n\t\t\ttextarea.addEventListener(\"keydown\", this._keydownHandler);\n\t\t}\n\t}\n\n\t/**\n\t * Handles the generate click event from the AI toolbar.\n\t * Opens the AI menu and sets the opener element.\n\t *\n\t * @private\n\t */\n\t_handleAIButtonClick = (e: CustomEvent<{ clickTarget?: HTMLElement }>) => {\n\t\tconst menuNodes = this.getSlottedNodes(\"menu\");\n\t\tif (menuNodes.length === 0) {\n\t\t\treturn;\n\t\t}\n\t\tif (!e.detail?.clickTarget) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst menu = menuNodes[0] as HTMLElement & { opener?: HTMLElement; open?: boolean };\n\t\tif (menu && typeof menu.open !== \"undefined\") {\n\t\t\tmenu.opener = e.detail.clickTarget;\n\t\t\tmenu.open = true;\n\t\t}\n\t}\n\tget _ariaLabel() {\n\t\treturn this.accessibleName || TextArea.i18nBundle.getText(WRITING_ASSISTANT_LABEL);\n\t}\n\n\t/**\n\t * Handles the stop generation event from the AI toolbar.\n\t * Fires the stop-generation event to notify listeners.\n\t *\n\t * @private\n\t */\n\thandleStopGeneration = () => {\n\t\tthis.fireDecoratorEvent(\"stop-generation\");\n\t}\n}\n\nTextArea.define();\n\nexport type { TextAreaVersionChangeEventDetail };\nexport default TextArea;\n"]}

package/dist/TextAreaTemplate.d.ts

@@ -0,0 +1,2 @@
+import type TextArea from "./TextArea.js";
+export default function TextAreaTemplate(this: TextArea): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/TextAreaTemplate.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import WritingAssistant from "./WritingAssistant.js";
+import BusyIndicator from "@ui5/webcomponents/dist/BusyIndicator.js";
+import TextAreaPopoverTemplate from "@ui5/webcomponents/dist/TextAreaPopoverTemplate.js";
+export default function TextAreaTemplate() {
+    return (_jsxs("div", { class: "ui5-ai-textarea-root", children: [_jsxs("div", { class: this.classes.root, onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, children: [_jsxs("div", { class: "ui5-textarea-wrapper", children: [this.growing &&
+                                _jsx("div", { id: `${this._id}-mirror`, class: "ui5-textarea-mirror", "aria-hidden": "true", children: this._mirrorText.map(mirrorText => {
+                                        return (_jsxs(_Fragment, { children: [mirrorText.text, _jsx("br", {})] }));
+                                    }) }), _jsx(BusyIndicator, { id: `${this._id}-busyIndicator`, active: this.loading, class: "ui5-textarea-busy-indicator", children: _jsx("textarea", { id: `${this._id}-inner`, class: "ui5-textarea-inner", part: "textarea", placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, "aria-label": this._ariaLabel, "aria-describedby": this.ariaDescribedBy, "aria-invalid": this._ariaInvalid, "aria-required": this.required, maxlength: this._exceededTextProps.calcedMaxLength, value: this.value, "data-sap-focus-ref": true, onInput: this._oninput, onChange: this._onchange, onKeyUp: this._onkeyup, onKeyDown: this._onkeydown, onSelect: this._onselect, onScroll: this._onscroll }) }), _jsx("div", { part: "footer", children: _jsx("slot", { name: "footer", children: _jsx(WritingAssistant, { loading: this.loading, currentVersion: this.currentVersion, totalVersions: this.totalVersions, promptDescription: this.promptDescription, onButtonClick: this._handleAIButtonClick, onStopGeneration: this.handleStopGeneration, onVersionChange: this._handleVersionChange }) }) })] }), this.showExceededText &&
+                        _jsx("span", { class: "ui5-textarea-exceeded-text", children: this._exceededTextProps.exceededText }), this.hasValueState &&
+                        _jsx("span", { id: `${this._id}-valueStateDesc`, class: "ui5-hidden-text", children: this.ariaValueStateHiddenText })] }), TextAreaPopoverTemplate.call(this), _jsx("div", { "aria-live": "polite", "aria-atomic": "true", class: "ui5-hidden-text", children: this.loading ? this.promptDescription : "" }), _jsx("div", { id: "ai-menu-wrapper", children: _jsx("slot", { name: "menu" }) })] }));
+}
+//# sourceMappingURL=TextAreaTemplate.js.map

package/dist/TextAreaTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaTemplate.js","sourceRoot":"","sources":["../src/TextAreaTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,aAAa,MAAM,0CAA0C,CAAC;AACrE,OAAO,uBAAuB,MAAM,oDAAoD,CAAC;AAEzF,MAAM,CAAC,OAAO,UAAU,gBAAgB;IACvC,OAAO,CACN,eAAK,KAAK,EAAC,sBAAsB,aAChC,eACC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EACxB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,aAE5B,eAAK,KAAK,EAAC,sBAAsB,aAC/B,IAAI,CAAC,OAAO;gCACb,cAAK,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,SAAS,EAAE,KAAK,EAAC,qBAAqB,iBAAa,MAAM,YAC3E,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;wCAClC,OAAO,CACN,8BACE,UAAU,CAAC,IAAI,EAChB,cAAM,IACJ,CACH,CAAC;oCACH,CAAC,CAAC,GACG,EAEN,KAAC,aAAa,IACb,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,gBAAgB,EAC/B,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,KAAK,EAAC,6BAA6B,YAEnC,mBACC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,EACvB,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAC,UAAU,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,gBACX,IAAI,CAAC,UAAU,sBACT,IAAI,CAAC,eAAe,kBACxB,IAAI,CAAC,YAAY,mBAChB,IAAI,CAAC,QAAQ,EAC5B,SAAS,EAAE,IAAI,CAAC,kBAAkB,CAAC,eAAe,EAClD,KAAK,EAAE,IAAI,CAAC,KAAK,8BAEjB,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,QAAQ,EAAE,IAAI,CAAC,SAAS,GACd,GACI,EAChB,cAAK,IAAI,EAAC,QAAQ,YACjB,eAAM,IAAI,EAAC,QAAQ,YAClB,KAAC,gBAAgB,IAChB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,aAAa,EAAE,IAAI,CAAC,oBAAoB,EACxC,gBAAgB,EAAE,IAAI,CAAC,oBAAoB,EAC3C,eAAe,EAAE,IAAI,CAAC,oBAAoB,GACzC,GACI,GACF,IACD,EAEL,IAAI,CAAC,gBAAgB;wBACtB,eAAM,KAAK,EAAC,4BAA4B,YAAE,IAAI,CAAC,kBAAkB,CAAC,YAAY,GAAQ,EAGrF,IAAI,CAAC,aAAa;wBACnB,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,iBAAiB,EAAE,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,wBAAwB,GAAQ,IAEjG,EAEL,uBAAuB,CAAC,IAAI,CAAC,IAAI,CAAC,EAGnC,2BAAe,QAAQ,iBAAa,MAAM,EAAC,KAAK,EAAC,iBAAiB,YAChE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,GACtC,EAEN,cAAK,EAAE,EAAC,iBAAiB,YACxB,eAAM,IAAI,EAAC,MAAM,GAAQ,GACpB,IACD,CACN,CAAC;AACH,CAAC","sourcesContent":["import type TextArea from \"./TextArea.js\";\nimport WritingAssistant from \"./WritingAssistant.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport TextAreaPopoverTemplate from \"@ui5/webcomponents/dist/TextAreaPopoverTemplate.js\";\n\nexport default function TextAreaTemplate(this: TextArea) {\n\treturn (\n\t\t<div class=\"ui5-ai-textarea-root\">\n\t\t\t<div\n\t\t\t\tclass={this.classes.root}\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t>\n\t\t\t\t<div class=\"ui5-textarea-wrapper\">\n\t\t\t\t\t{this.growing &&\n\t\t\t\t\t<div id={`${this._id}-mirror`} class=\"ui5-textarea-mirror\" aria-hidden=\"true\">\n\t\t\t\t\t\t{this._mirrorText.map(mirrorText => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t{mirrorText.text}\n\t\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</div>\n\t\t\t\t\t}\n\t\t\t\t\t<BusyIndicator\n\t\t\t\t\t\tid={`${this._id}-busyIndicator`}\n\t\t\t\t\t\tactive={this.loading}\n\t\t\t\t\t\tclass=\"ui5-textarea-busy-indicator\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\tid={`${this._id}-inner`}\n\t\t\t\t\t\t\tclass=\"ui5-textarea-inner\"\n\t\t\t\t\t\t\tpart=\"textarea\"\n\t\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\treadonly={this.readonly}\n\t\t\t\t\t\t\taria-label={this._ariaLabel}\n\t\t\t\t\t\t\taria-describedby={this.ariaDescribedBy}\n\t\t\t\t\t\t\taria-invalid={this._ariaInvalid}\n\t\t\t\t\t\t\taria-required={this.required}\n\t\t\t\t\t\t\tmaxlength={this._exceededTextProps.calcedMaxLength}\n\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\t\t\tonInput={this._oninput}\n\t\t\t\t\t\t\tonChange={this._onchange}\n\t\t\t\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\t\t\tonSelect={this._onselect}\n\t\t\t\t\t\t\tonScroll={this._onscroll}>\n\t\t\t\t\t\t</textarea>\n\t\t\t\t\t</BusyIndicator>\n\t\t\t\t\t<div part=\"footer\">\n\t\t\t\t\t\t<slot name=\"footer\">\n\t\t\t\t\t\t\t<WritingAssistant\n\t\t\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\t\t\tcurrentVersion={this.currentVersion}\n\t\t\t\t\t\t\t\ttotalVersions={this.totalVersions}\n\t\t\t\t\t\t\t\tpromptDescription={this.promptDescription}\n\t\t\t\t\t\t\t\tonButtonClick={this._handleAIButtonClick}\n\t\t\t\t\t\t\t\tonStopGeneration={this.handleStopGeneration}\n\t\t\t\t\t\t\t\tonVersionChange={this._handleVersionChange}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</slot>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t{this.showExceededText &&\n\t\t\t\t<span class=\"ui5-textarea-exceeded-text\">{this._exceededTextProps.exceededText}</span>\n\t\t\t\t}\n\n\t\t\t\t{this.hasValueState &&\n\t\t\t\t<span id={`${this._id}-valueStateDesc`} class=\"ui5-hidden-text\">{this.ariaValueStateHiddenText}</span>\n\t\t\t\t}\n\t\t\t</div>\n\n\t\t\t{TextAreaPopoverTemplate.call(this)}\n\n\t\t\t{/* ARIA live region for screen readers */}\n\t\t\t<div aria-live=\"polite\" aria-atomic=\"true\" class=\"ui5-hidden-text\">\n\t\t\t\t{this.loading ? this.promptDescription : \"\"}\n\t\t\t</div>\n\n\t\t\t<div id=\"ai-menu-wrapper\">\n\t\t\t\t<slot name=\"menu\"></slot>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"]}