@fundamental-ngx/ui5-webcomponents-ai 0.60.2 → 0.60.3

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.
@@ -0,0 +1,90 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, booleanAttribute, inject, ElementRef, Injector, runInInjectionContext, effect, ChangeDetectionStrategy, Component } from '@angular/core';
3
+ import '@ui5/webcomponents-ai/dist/ButtonState.js';
4
+
5
+ class ButtonState {
6
+ constructor() {
7
+ /**
8
+ * Defines the name of the button state.
9
+ */
10
+ this.name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
11
+ /**
12
+ * Defines the text of the button in this state.
13
+ */
14
+ this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : []));
15
+ /**
16
+ * Defines the icon to be displayed as graphical element within the component before the text.
17
+ The SAP-icons font provides numerous options.
18
+
19
+ **Example:**
20
+
21
+ See all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
22
+ */
23
+ this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
24
+ /**
25
+ * Defines the icon to be displayed as graphical element within the component after the text.
26
+ The SAP-icons font provides numerous options.
27
+
28
+ **Example:**
29
+
30
+ See all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
31
+ */
32
+ this.endIcon = input(...(ngDevMode ? [undefined, { debugName: "endIcon" }] : []));
33
+ /**
34
+ * Defines if the component is in split button mode.
35
+ */
36
+ this.showArrowButton = input(false, { ...(ngDevMode ? { debugName: "showArrowButton" } : {}), transform: booleanAttribute }); // className is now passed
37
+ this.elementRef = inject(ElementRef);
38
+ this.injector = inject(Injector);
39
+ }
40
+ get element() {
41
+ return this.elementRef.nativeElement;
42
+ }
43
+ ngAfterViewInit() {
44
+ const wcElement = this.element;
45
+ const inputsToSync = [
46
+ 'name',
47
+ 'text',
48
+ 'icon',
49
+ 'endIcon',
50
+ 'showArrowButton',
51
+ ];
52
+ // Synchronize inputs (properties)
53
+ for (const inputName of inputsToSync) {
54
+ // Find the corresponding camelCase signal property on the Angular component
55
+ const signalName = inputName.replace(/-./g, (x) => x[1].toUpperCase());
56
+ // Use the Injector to run the effect in the correct context
57
+ if (this[signalName] && typeof this[signalName] === 'function') {
58
+ runInInjectionContext(this.injector, () => {
59
+ effect(() => {
60
+ // Read the signal value
61
+ const value = this[signalName]();
62
+ if (wcElement) {
63
+ // Write the value to the Web Component's property
64
+ wcElement[inputName] = value;
65
+ }
66
+ });
67
+ });
68
+ }
69
+ }
70
+ }
71
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ButtonState, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
72
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: ButtonState, isStandalone: true, selector: "ui5-ai-button-state, [ui5-ai-button-state]", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, endIcon: { classPropertyName: "endIcon", publicName: "endIcon", isSignal: true, isRequired: false, transformFunction: null }, showArrowButton: { classPropertyName: "showArrowButton", publicName: "showArrowButton", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["ui5ButtonState"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
73
+ }
74
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ButtonState, decorators: [{
75
+ type: Component,
76
+ args: [{
77
+ standalone: true,
78
+ selector: 'ui5-ai-button-state, [ui5-ai-button-state]',
79
+ template: '<ng-content></ng-content>',
80
+ exportAs: 'ui5ButtonState',
81
+ changeDetection: ChangeDetectionStrategy.OnPush,
82
+ }]
83
+ }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], endIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "endIcon", required: false }] }], showArrowButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showArrowButton", required: false }] }] } });
84
+
85
+ /**
86
+ * Generated bundle index. Do not edit.
87
+ */
88
+
89
+ export { ButtonState };
90
+ //# sourceMappingURL=fundamental-ngx-ui5-webcomponents-ai-button-state.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"fundamental-ngx-ui5-webcomponents-ai-button-state.mjs","sources":["../../../../libs/ui5-webcomponents-ai/button-state/index.ts","../../../../libs/ui5-webcomponents-ai/button-state/fundamental-ngx-ui5-webcomponents-ai-button-state.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-ai/dist/ButtonState.js';\nimport { default as _ButtonState } from '@ui5/webcomponents-ai/dist/ButtonState.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-ai-button-state, [ui5-ai-button-state]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5ButtonState',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonState implements AfterViewInit {\n\n /**\n * Defines the name of the button state.\n */\n name = input<typeof _ButtonState.prototype.name | undefined>();\n\n /**\n * Defines the text of the button in this state.\n */\n text = input<typeof _ButtonState.prototype.text | undefined>();\n\n /**\n * 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).\n */\n icon = input<typeof _ButtonState.prototype.icon | undefined>();\n\n /**\n * 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).\n */\n endIcon = input<typeof _ButtonState.prototype.endIcon | undefined>();\n\n /**\n * Defines if the component is in split button mode.\n */\n showArrowButton = input(false, { transform: booleanAttribute }); // className is now passed\n\n\n\n\n\n public elementRef: ElementRef<_ButtonState> = inject(ElementRef);\n public injector = inject(Injector);\n\n get element(): _ButtonState {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'name',\n 'text',\n 'icon',\n 'endIcon',\n 'showArrowButton',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n \n\n }\n}\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,156 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, booleanAttribute, output, inject, ElementRef, Injector, runInInjectionContext, effect, ChangeDetectionStrategy, Component } from '@angular/core';
3
+ import '@ui5/webcomponents-ai/dist/Button.js';
4
+
5
+ class Button {
6
+ constructor() {
7
+ /**
8
+ * Defines the component design.
9
+ */
10
+ this.design = input("Default", ...(ngDevMode ? [{ debugName: "design" }] : []));
11
+ /**
12
+ * Defines whether the component is disabled.
13
+ A disabled component can't be pressed or
14
+ focused, and it is not in the tab chain.
15
+ */
16
+ this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
17
+ /**
18
+ * Defines the current state of the component.
19
+ */
20
+ this.state = input(...(ngDevMode ? [undefined, { debugName: "state" }] : []));
21
+ /**
22
+ * Defines the active state of the arrow button in split mode.
23
+ Set to true when the button is in split mode and a menu with additional options
24
+ is opened by the arrow button. Set back to false when the menu is closed.
25
+ */
26
+ this.arrowButtonPressed = input(false, { ...(ngDevMode ? { debugName: "arrowButtonPressed" } : {}), transform: booleanAttribute });
27
+ /**
28
+ * Defines the additional accessibility attributes that will be applied to the component.
29
+
30
+ This property allows for fine-tuned control of ARIA attributes for screen reader support.
31
+ It accepts an object with the following optional fields:
32
+
33
+ - **root**: Accessibility attributes that will be applied to the root element.
34
+ - **hasPopup**: Indicates the availability and type of interactive popup element (such as a menu or dialog).
35
+ Accepts string values: `"dialog"`, `"grid"`, `"listbox"`, `"menu"`, or `"tree"`.
36
+ - **roleDescription**: Defines a human-readable description for the button's role.
37
+ Accepts any string value.
38
+ - **title**: Specifies a tooltip or description for screen readers.
39
+ Accepts any string value.
40
+ - **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or focus the button.
41
+
42
+ - **arrowButton**: Accessibility attributes that will be applied to the arrow (split) button element.
43
+ - **hasPopup**: Indicates the type of popup triggered by the arrow button.
44
+ Accepts string values: `"dialog"`, `"grid"`, `"listbox"`, `"menu"`, or `"tree"`.
45
+ - **expanded**: Indicates whether the popup controlled by the arrow button is currently expanded.
46
+ Accepts boolean values: `true` or `false`.
47
+ */
48
+ this.accessibilityAttributes = input({}, ...(ngDevMode ? [{ debugName: "accessibilityAttributes" }] : [])); // className is now passed
49
+ /**
50
+ * Fired when the component is activated either with a
51
+ mouse/tap or by using the Enter or Space key.
52
+ */
53
+ this.ui5Click = output();
54
+ /**
55
+ * Fired when the component is in split mode and after the arrow button
56
+ is activated either by clicking or tapping it or by using the [Arrow Up] / [Arrow Down],
57
+ [Alt] + [Arrow Up]/ [Arrow Down], or [F4] keyboard keys.
58
+ */
59
+ this.ui5ArrowButtonClick = output();
60
+ /**
61
+ * Available slots for content projection in this component.
62
+ *
63
+ * Slots allow you to insert custom content into predefined areas of the web component.
64
+ * Use the `slot` attribute on child elements to target specific slots.
65
+ *
66
+ * - **(default)**: Defines the available states of the component.
67
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that
68
+ you only use `ui5-ai-button-state` components in order to preserve the intended design.
69
+ *
70
+ * @example
71
+ * ```html
72
+ * <ui5-ai-button>
73
+ * <div slot="header">Custom header content</div>
74
+ * <p>Default slot content</p>
75
+ * </ui5-ai-button>
76
+ * ```
77
+ *
78
+ * @readonly
79
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
80
+ */
81
+ this.slots = [
82
+ {
83
+ "name": "default",
84
+ "description": "Defines the available states of the component.\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that\nyou only use `ui5-ai-button-state` components in order to preserve the intended design."
85
+ }
86
+ ];
87
+ this.elementRef = inject(ElementRef);
88
+ this.injector = inject(Injector);
89
+ }
90
+ get element() {
91
+ return this.elementRef.nativeElement;
92
+ }
93
+ ngAfterViewInit() {
94
+ const wcElement = this.element;
95
+ const inputsToSync = [
96
+ 'design',
97
+ 'disabled',
98
+ 'state',
99
+ 'arrowButtonPressed',
100
+ 'accessibilityAttributes',
101
+ ];
102
+ // Synchronize inputs (properties)
103
+ for (const inputName of inputsToSync) {
104
+ // Find the corresponding camelCase signal property on the Angular component
105
+ const signalName = inputName.replace(/-./g, (x) => x[1].toUpperCase());
106
+ // Use the Injector to run the effect in the correct context
107
+ if (this[signalName] && typeof this[signalName] === 'function') {
108
+ runInInjectionContext(this.injector, () => {
109
+ effect(() => {
110
+ // Read the signal value
111
+ const value = this[signalName]();
112
+ if (wcElement) {
113
+ // Write the value to the Web Component's property
114
+ wcElement[inputName] = value;
115
+ }
116
+ });
117
+ });
118
+ }
119
+ }
120
+ const outputsToSync = [
121
+ 'ui5Click',
122
+ 'ui5ArrowButtonClick',
123
+ ];
124
+ // Synchronize outputs (events)
125
+ for (const outputName of outputsToSync) {
126
+ // Map Angular output name to UI5 web component event name
127
+ const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);
128
+ // Ensure the output property exists and has an emit function before adding listener
129
+ if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {
130
+ // Cast the listener to the correct type to satisfy TypeScript
131
+ wcElement.addEventListener(eventName, (e) => {
132
+ this[outputName].emit(e);
133
+ });
134
+ }
135
+ }
136
+ }
137
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
138
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: Button, isStandalone: true, selector: "ui5-ai-button, [ui5-ai-button]", inputs: { design: { classPropertyName: "design", publicName: "design", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, arrowButtonPressed: { classPropertyName: "arrowButtonPressed", publicName: "arrowButtonPressed", isSignal: true, isRequired: false, transformFunction: null }, accessibilityAttributes: { classPropertyName: "accessibilityAttributes", publicName: "accessibilityAttributes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Click: "ui5Click", ui5ArrowButtonClick: "ui5ArrowButtonClick" }, exportAs: ["ui5Button"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
139
+ }
140
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Button, decorators: [{
141
+ type: Component,
142
+ args: [{
143
+ standalone: true,
144
+ selector: 'ui5-ai-button, [ui5-ai-button]',
145
+ template: '<ng-content></ng-content>',
146
+ exportAs: 'ui5Button',
147
+ changeDetection: ChangeDetectionStrategy.OnPush,
148
+ }]
149
+ }], propDecorators: { design: [{ type: i0.Input, args: [{ isSignal: true, alias: "design", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], arrowButtonPressed: [{ type: i0.Input, args: [{ isSignal: true, alias: "arrowButtonPressed", required: false }] }], accessibilityAttributes: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibilityAttributes", required: false }] }], ui5Click: [{ type: i0.Output, args: ["ui5Click"] }], ui5ArrowButtonClick: [{ type: i0.Output, args: ["ui5ArrowButtonClick"] }] } });
150
+
151
+ /**
152
+ * Generated bundle index. Do not edit.
153
+ */
154
+
155
+ export { Button };
156
+ //# sourceMappingURL=fundamental-ngx-ui5-webcomponents-ai-button.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"fundamental-ngx-ui5-webcomponents-ai-button.mjs","sources":["../../../../libs/ui5-webcomponents-ai/button/index.ts","../../../../libs/ui5-webcomponents-ai/button/fundamental-ngx-ui5-webcomponents-ai-button.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-ai/dist/Button.js';\nimport { default as _Button } from '@ui5/webcomponents-ai/dist/Button.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\n\nimport { default as ButtonDesign } from '@ui5/webcomponents/dist/types/ButtonDesign.js';\nimport { AIButtonAccessibilityAttributes } from '@ui5/webcomponents-ai/dist/Button.js';\n\n@Component({\n standalone: true,\n selector: 'ui5-ai-button, [ui5-ai-button]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5Button',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class Button implements AfterViewInit {\n\n /**\n * Defines the component design.\n */\n design = input<typeof _Button.prototype.design | undefined>(\"Default\");\n\n /**\n * Defines whether the component is disabled.\nA disabled component can't be pressed or\nfocused, and it is not in the tab chain.\n */\n disabled = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the current state of the component.\n */\n state = input<typeof _Button.prototype.state | undefined>();\n\n /**\n * Defines the active state of the arrow button in split mode.\nSet to true when the button is in split mode and a menu with additional options\nis opened by the arrow button. Set back to false when the menu is closed.\n */\n arrowButtonPressed = input(false, { transform: booleanAttribute });\n\n /**\n * Defines the additional accessibility attributes that will be applied to the component.\n\nThis property allows for fine-tuned control of ARIA attributes for screen reader support.\nIt accepts an object with the following optional fields:\n\n- **root**: Accessibility attributes that will be applied to the root element.\n - **hasPopup**: Indicates the availability and type of interactive popup element (such as a menu or dialog).\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **roleDescription**: Defines a human-readable description for the button's role.\n Accepts any string value.\n - **title**: Specifies a tooltip or description for screen readers.\n Accepts any string value.\n- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or focus the button.\n\n- **arrowButton**: Accessibility attributes that will be applied to the arrow (split) button element.\n - **hasPopup**: Indicates the type of popup triggered by the arrow button.\n Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n - **expanded**: Indicates whether the popup controlled by the arrow button is currently expanded.\n Accepts boolean values: `true` or `false`.\n */\n accessibilityAttributes = input<typeof _Button.prototype.accessibilityAttributes | undefined>({}); // className is now passed\n\n\n\n /**\n * Fired when the component is activated either with a\nmouse/tap or by using the Enter or Space key.\n */\n ui5Click = output<UI5CustomEvent<_Button, 'click'>>();\n\n /**\n * Fired when the component is in split mode and after the arrow button\nis activated either by clicking or tapping it or by using the [Arrow Up] / [Arrow Down],\n[Alt] + [Arrow Up]/ [Arrow Down], or [F4] keyboard keys.\n */\n ui5ArrowButtonClick = output<UI5CustomEvent<_Button, 'arrow-button-click'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **(default)**: Defines the available states of the component.\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that\nyou only use `ui5-ai-button-state` components in order to preserve the intended design.\n *\n * @example\n * ```html\n * <ui5-ai-button>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-ai-button>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"default\",\n \"description\": \"Defines the available states of the component.\\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that\\nyou only use `ui5-ai-button-state` components in order to preserve the intended design.\"\n }\n ];\n\n\n public elementRef: ElementRef<_Button> = inject(ElementRef);\n public injector = inject(Injector);\n\n get element(): _Button {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'design',\n 'disabled',\n 'state',\n 'arrowButtonPressed',\n 'accessibilityAttributes',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5Click',\n 'ui5ArrowButtonClick',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n// Re-export types for convenience\nexport { AIButtonAccessibilityAttributes } from '@ui5/webcomponents-ai/dist/Button.js';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,133 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, booleanAttribute, output, inject, ElementRef, Injector, runInInjectionContext, effect, ChangeDetectionStrategy, Component } from '@angular/core';
3
+ import '@ui5/webcomponents-ai/dist/Input.js';
4
+
5
+ class Input {
6
+ constructor() {
7
+ /**
8
+ * Indicates the index of the currently displayed version.
9
+ */
10
+ this.currentVersion = input(0, ...(ngDevMode ? [{ debugName: "currentVersion" }] : []));
11
+ /**
12
+ * Indicates the total number of result versions available.
13
+
14
+ When not set or set to 0, the versioning will be hidden.
15
+ */
16
+ this.totalVersions = input(0, ...(ngDevMode ? [{ debugName: "totalVersions" }] : []));
17
+ /**
18
+ * Defines whether the AI Writing Assistant is currently loading.
19
+
20
+ When `true`, indicates that an AI action is in progress.
21
+ */
22
+ this.loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : {}), transform: booleanAttribute }); // className is now passed
23
+ /**
24
+ * Fired when the user selects the AI button.
25
+ */
26
+ this.ui5ButtonClick = output();
27
+ /**
28
+ * Fired when an item from the AI actions menu is clicked.
29
+ */
30
+ this.ui5ItemClick = output();
31
+ /**
32
+ * Fired when the user selects the "Stop" button to stop ongoing AI text generation.
33
+ */
34
+ this.ui5StopGeneration = output();
35
+ /**
36
+ * Fired when the user selects the version navigation buttons.
37
+ */
38
+ this.ui5VersionChange = output();
39
+ /**
40
+ * Available slots for content projection in this component.
41
+ *
42
+ * Slots allow you to insert custom content into predefined areas of the web component.
43
+ * Use the `slot` attribute on child elements to target specific slots.
44
+ *
45
+ * - **actions**: Defines the items of the menu for the component.
46
+ *
47
+ * @example
48
+ * ```html
49
+ * <ui5-ai-input>
50
+ * <div slot="header">Custom header content</div>
51
+ * <p>Default slot content</p>
52
+ * </ui5-ai-input>
53
+ * ```
54
+ *
55
+ * @readonly
56
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
57
+ */
58
+ this.slots = [
59
+ {
60
+ "name": "actions",
61
+ "description": "Defines the items of the menu for the component."
62
+ }
63
+ ];
64
+ this.elementRef = inject(ElementRef);
65
+ this.injector = inject(Injector);
66
+ }
67
+ get element() {
68
+ return this.elementRef.nativeElement;
69
+ }
70
+ ngAfterViewInit() {
71
+ const wcElement = this.element;
72
+ const inputsToSync = [
73
+ 'currentVersion',
74
+ 'totalVersions',
75
+ 'loading',
76
+ ];
77
+ // Synchronize inputs (properties)
78
+ for (const inputName of inputsToSync) {
79
+ // Find the corresponding camelCase signal property on the Angular component
80
+ const signalName = inputName.replace(/-./g, (x) => x[1].toUpperCase());
81
+ // Use the Injector to run the effect in the correct context
82
+ if (this[signalName] && typeof this[signalName] === 'function') {
83
+ runInInjectionContext(this.injector, () => {
84
+ effect(() => {
85
+ // Read the signal value
86
+ const value = this[signalName]();
87
+ if (wcElement) {
88
+ // Write the value to the Web Component's property
89
+ wcElement[inputName] = value;
90
+ }
91
+ });
92
+ });
93
+ }
94
+ }
95
+ const outputsToSync = [
96
+ 'ui5ButtonClick',
97
+ 'ui5ItemClick',
98
+ 'ui5StopGeneration',
99
+ 'ui5VersionChange',
100
+ ];
101
+ // Synchronize outputs (events)
102
+ for (const outputName of outputsToSync) {
103
+ // Map Angular output name to UI5 web component event name
104
+ const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);
105
+ // Ensure the output property exists and has an emit function before adding listener
106
+ if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {
107
+ // Cast the listener to the correct type to satisfy TypeScript
108
+ wcElement.addEventListener(eventName, (e) => {
109
+ this[outputName].emit(e);
110
+ });
111
+ }
112
+ }
113
+ }
114
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Input, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
115
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: Input, isStandalone: true, selector: "ui5-ai-input, [ui5-ai-input]", inputs: { currentVersion: { classPropertyName: "currentVersion", publicName: "currentVersion", isSignal: true, isRequired: false, transformFunction: null }, totalVersions: { classPropertyName: "totalVersions", publicName: "totalVersions", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5ButtonClick: "ui5ButtonClick", ui5ItemClick: "ui5ItemClick", ui5StopGeneration: "ui5StopGeneration", ui5VersionChange: "ui5VersionChange" }, exportAs: ["ui5Input"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
116
+ }
117
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Input, decorators: [{
118
+ type: Component,
119
+ args: [{
120
+ standalone: true,
121
+ selector: 'ui5-ai-input, [ui5-ai-input]',
122
+ template: '<ng-content></ng-content>',
123
+ exportAs: 'ui5Input',
124
+ changeDetection: ChangeDetectionStrategy.OnPush,
125
+ }]
126
+ }], propDecorators: { currentVersion: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentVersion", required: false }] }], totalVersions: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalVersions", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], ui5ButtonClick: [{ type: i0.Output, args: ["ui5ButtonClick"] }], ui5ItemClick: [{ type: i0.Output, args: ["ui5ItemClick"] }], ui5StopGeneration: [{ type: i0.Output, args: ["ui5StopGeneration"] }], ui5VersionChange: [{ type: i0.Output, args: ["ui5VersionChange"] }] } });
127
+
128
+ /**
129
+ * Generated bundle index. Do not edit.
130
+ */
131
+
132
+ export { Input };
133
+ //# sourceMappingURL=fundamental-ngx-ui5-webcomponents-ai-input.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"fundamental-ngx-ui5-webcomponents-ai-input.mjs","sources":["../../../../libs/ui5-webcomponents-ai/input/index.ts","../../../../libs/ui5-webcomponents-ai/input/fundamental-ngx-ui5-webcomponents-ai-input.ts"],"sourcesContent":["\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n input,\n output,\n AfterViewInit,\n effect,\n runInInjectionContext,\n inject,\n Injector,\n booleanAttribute,\n computed,\n signal\n} from '@angular/core';\nimport '@ui5/webcomponents-ai/dist/Input.js';\nimport { default as _Input } from '@ui5/webcomponents-ai/dist/Input.js';\nimport { UI5CustomEvent } from '@ui5/webcomponents-base';\n\n\n\n@Component({\n standalone: true,\n selector: 'ui5-ai-input, [ui5-ai-input]',\n template: '<ng-content></ng-content>',\n exportAs: 'ui5Input',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class Input implements AfterViewInit {\n\n /**\n * Indicates the index of the currently displayed version.\n */\n currentVersion = input<typeof _Input.prototype.currentVersion | undefined>(0);\n\n /**\n * Indicates the total number of result versions available.\n\nWhen not set or set to 0, the versioning will be hidden.\n */\n totalVersions = input<typeof _Input.prototype.totalVersions | undefined>(0);\n\n /**\n * Defines whether the AI Writing Assistant is currently loading.\n\nWhen `true`, indicates that an AI action is in progress.\n */\n loading = input(false, { transform: booleanAttribute }); // className is now passed\n\n\n\n /**\n * Fired when the user selects the AI button.\n */\n ui5ButtonClick = output<UI5CustomEvent<_Input, 'button-click'>>();\n\n /**\n * Fired when an item from the AI actions menu is clicked.\n */\n ui5ItemClick = output<UI5CustomEvent<_Input, 'item-click'>>();\n\n /**\n * Fired when the user selects the \"Stop\" button to stop ongoing AI text generation.\n */\n ui5StopGeneration = output<UI5CustomEvent<_Input, 'stop-generation'>>();\n\n /**\n * Fired when the user selects the version navigation buttons.\n */\n ui5VersionChange = output<UI5CustomEvent<_Input, 'version-change'>>();\n\n /**\n * Available slots for content projection in this component.\n *\n * Slots allow you to insert custom content into predefined areas of the web component.\n * Use the `slot` attribute on child elements to target specific slots.\n *\n * - **actions**: Defines the items of the menu for the component.\n *\n * @example\n * ```html\n * <ui5-ai-input>\n * <div slot=\"header\">Custom header content</div>\n * <p>Default slot content</p>\n * </ui5-ai-input>\n * ```\n *\n * @readonly\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}\n */\n readonly slots = [\n {\n \"name\": \"actions\",\n \"description\": \"Defines the items of the menu for the component.\"\n }\n ];\n\n\n public elementRef: ElementRef<_Input> = inject(ElementRef);\n public injector = inject(Injector);\n\n get element(): _Input {\n return this.elementRef.nativeElement;\n }\n\n ngAfterViewInit(): void {\n const wcElement = this.element;\n \n const inputsToSync = [\n 'currentVersion',\n 'totalVersions',\n 'loading',\n ];\n \n // Synchronize inputs (properties)\n for (const inputName of inputsToSync) {\n // Find the corresponding camelCase signal property on the Angular component\n const signalName = inputName.replace(/-./g, (x: string) => x[1].toUpperCase());\n\n // Use the Injector to run the effect in the correct context\n if (this[signalName] && typeof this[signalName] === 'function') {\n runInInjectionContext(this.injector, () => {\n effect(() => {\n // Read the signal value\n const value = this[signalName]();\n if (wcElement) {\n // Write the value to the Web Component's property\n wcElement[inputName] = value;\n }\n });\n });\n }\n }\n \n \n const outputsToSync = [\n 'ui5ButtonClick',\n 'ui5ItemClick',\n 'ui5StopGeneration',\n 'ui5VersionChange',\n ];\n \n // Synchronize outputs (events)\n for (const outputName of outputsToSync) {\n // Map Angular output name to UI5 web component event name\n const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);\n // Ensure the output property exists and has an emit function before adding listener\n if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {\n // Cast the listener to the correct type to satisfy TypeScript\n wcElement.addEventListener(eventName, (e) => {\n\n this[outputName].emit(e as CustomEvent<any>);\n });\n }\n }\n \n\n }\n}\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,191 @@
1
+ import * as i0 from '@angular/core';
2
+ import { input, booleanAttribute, output, inject, ElementRef, Injector, runInInjectionContext, effect, ChangeDetectionStrategy, Component } from '@angular/core';
3
+ import '@ui5/webcomponents-ai/dist/PromptInput.js';
4
+
5
+ class PromptInput {
6
+ constructor() {
7
+ /**
8
+ * Defines the value of the component.
9
+ */
10
+ this.value = input("", ...(ngDevMode ? [{ debugName: "value" }] : []));
11
+ /**
12
+ * Defines a short hint intended to aid the user with data entry when the
13
+ component has no value.
14
+ */
15
+ this.placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
16
+ /**
17
+ * Defines the label of the input field.
18
+ */
19
+ this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
20
+ /**
21
+ * Defines whether the clear icon of the input will be shown.
22
+ */
23
+ this.showClearIcon = input(false, { ...(ngDevMode ? { debugName: "showClearIcon" } : {}), transform: booleanAttribute });
24
+ /**
25
+ * Determines whether the characters exceeding the maximum allowed character count are visible
26
+ in the component.
27
+
28
+ If set to `false`, the user is not allowed to enter more characters than what is set in the
29
+ `maxlength` property.
30
+ If set to `true` the characters exceeding the `maxlength` value are selected on
31
+ paste and the counter below the component displays their number.
32
+ */
33
+ this.showExceededText = input(false, { ...(ngDevMode ? { debugName: "showExceededText" } : {}), transform: booleanAttribute });
34
+ /**
35
+ * Defines whether the component is in disabled state.
36
+
37
+ **Note:** A disabled component is completely noninteractive.
38
+ */
39
+ this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
40
+ /**
41
+ * Defines whether the component is read-only.
42
+
43
+ **Note:** A read-only component is not editable,
44
+ but still provides visual feedback upon user interaction.
45
+ */
46
+ this.readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : {}), transform: booleanAttribute });
47
+ /**
48
+ * Sets the maximum number of characters available in the input field.
49
+ */
50
+ this.maxlength = input(...(ngDevMode ? [undefined, { debugName: "maxlength" }] : []));
51
+ /**
52
+ * Defines the value state of the component.
53
+ */
54
+ this.valueState = input("None", ...(ngDevMode ? [{ debugName: "valueState" }] : []));
55
+ /**
56
+ * Defines whether the component should show suggestions, if such are present.
57
+ */
58
+ this.showSuggestions = input(false, { ...(ngDevMode ? { debugName: "showSuggestions" } : {}), transform: booleanAttribute }); // className is now passed
59
+ /**
60
+ * Fired when the input operation has finished by pressing Enter
61
+ or AI button is clicked.
62
+ */
63
+ this.ui5Submit = output();
64
+ /**
65
+ * Fired when the value of the component changes at each keystroke,
66
+ and when a suggestion item has been selected.
67
+ */
68
+ this.ui5Input = output();
69
+ /**
70
+ * Fired when the input operation has finished by pressing Enter
71
+ or on focusout.
72
+ */
73
+ this.ui5Change = output();
74
+ /**
75
+ * Available slots for content projection in this component.
76
+ *
77
+ * Slots allow you to insert custom content into predefined areas of the web component.
78
+ * Use the `slot` attribute on child elements to target specific slots.
79
+ *
80
+ * - **(default)**: Defines the suggestion items.
81
+
82
+ **Note:** The suggestions would be displayed only if the `showSuggestions`
83
+ property is set to `true`.
84
+
85
+ **Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.
86
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
87
+ The value state message slot should contain only one root element.
88
+
89
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
90
+
91
+ **Note:** The `valueStateMessage` would be displayed,
92
+ when the component is in `Information`, `Critical` or `Negative` value state.
93
+ *
94
+ * @example
95
+ * ```html
96
+ * <ui5-ai-prompt-input>
97
+ * <div slot="header">Custom header content</div>
98
+ * <p>Default slot content</p>
99
+ * </ui5-ai-prompt-input>
100
+ * ```
101
+ *
102
+ * @readonly
103
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
104
+ */
105
+ this.slots = [
106
+ {
107
+ "name": "default",
108
+ "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."
109
+ },
110
+ {
111
+ "name": "valueStateMessage",
112
+ "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.",
113
+ "since": "2.0.0"
114
+ }
115
+ ];
116
+ this.elementRef = inject(ElementRef);
117
+ this.injector = inject(Injector);
118
+ }
119
+ get element() {
120
+ return this.elementRef.nativeElement;
121
+ }
122
+ ngAfterViewInit() {
123
+ const wcElement = this.element;
124
+ const inputsToSync = [
125
+ 'value',
126
+ 'placeholder',
127
+ 'label',
128
+ 'showClearIcon',
129
+ 'showExceededText',
130
+ 'disabled',
131
+ 'readonly',
132
+ 'maxlength',
133
+ 'valueState',
134
+ 'showSuggestions',
135
+ ];
136
+ // Synchronize inputs (properties)
137
+ for (const inputName of inputsToSync) {
138
+ // Find the corresponding camelCase signal property on the Angular component
139
+ const signalName = inputName.replace(/-./g, (x) => x[1].toUpperCase());
140
+ // Use the Injector to run the effect in the correct context
141
+ if (this[signalName] && typeof this[signalName] === 'function') {
142
+ runInInjectionContext(this.injector, () => {
143
+ effect(() => {
144
+ // Read the signal value
145
+ const value = this[signalName]();
146
+ if (wcElement) {
147
+ // Write the value to the Web Component's property
148
+ wcElement[inputName] = value;
149
+ }
150
+ });
151
+ });
152
+ }
153
+ }
154
+ const outputsToSync = [
155
+ 'ui5Submit',
156
+ 'ui5Input',
157
+ 'ui5Change',
158
+ ];
159
+ // Synchronize outputs (events)
160
+ for (const outputName of outputsToSync) {
161
+ // Map Angular output name to UI5 web component event name
162
+ const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);
163
+ // Ensure the output property exists and has an emit function before adding listener
164
+ if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {
165
+ // Cast the listener to the correct type to satisfy TypeScript
166
+ wcElement.addEventListener(eventName, (e) => {
167
+ this[outputName].emit(e);
168
+ });
169
+ }
170
+ }
171
+ }
172
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PromptInput, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
173
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: PromptInput, isStandalone: true, selector: "ui5-ai-prompt-input, [ui5-ai-prompt-input]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, showClearIcon: { classPropertyName: "showClearIcon", publicName: "showClearIcon", isSignal: true, isRequired: false, transformFunction: null }, showExceededText: { classPropertyName: "showExceededText", publicName: "showExceededText", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, valueState: { classPropertyName: "valueState", publicName: "valueState", isSignal: true, isRequired: false, transformFunction: null }, showSuggestions: { classPropertyName: "showSuggestions", publicName: "showSuggestions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Submit: "ui5Submit", ui5Input: "ui5Input", ui5Change: "ui5Change" }, exportAs: ["ui5PromptInput"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
174
+ }
175
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PromptInput, decorators: [{
176
+ type: Component,
177
+ args: [{
178
+ standalone: true,
179
+ selector: 'ui5-ai-prompt-input, [ui5-ai-prompt-input]',
180
+ template: '<ng-content></ng-content>',
181
+ exportAs: 'ui5PromptInput',
182
+ changeDetection: ChangeDetectionStrategy.OnPush,
183
+ }]
184
+ }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], showClearIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearIcon", required: false }] }], showExceededText: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExceededText", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], valueState: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueState", required: false }] }], showSuggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSuggestions", required: false }] }], ui5Submit: [{ type: i0.Output, args: ["ui5Submit"] }], ui5Input: [{ type: i0.Output, args: ["ui5Input"] }], ui5Change: [{ type: i0.Output, args: ["ui5Change"] }] } });
185
+
186
+ /**
187
+ * Generated bundle index. Do not edit.
188
+ */
189
+
190
+ export { PromptInput };
191
+ //# sourceMappingURL=fundamental-ngx-ui5-webcomponents-ai-prompt-input.mjs.map