@fundamental-ngx/ui5-webcomponents 0.59.1-rc.8 → 0.59.1

package/fesm2022/fundamental-ngx-ui5-webcomponents.mjs

@@ -26,6 +26,7 @@ export { default as FormItemSpacing } from '@ui5/webcomponents/dist/types/FormIt
 export { default as Highlight } from '@ui5/webcomponents/dist/types/Highlight.js';
 export { default as IconDesign } from '@ui5/webcomponents/dist/types/IconDesign.js';
 export { default as IconMode } from '@ui5/webcomponents/dist/types/IconMode.js';
+export { default as InputSuggestionsFilter } from '@ui5/webcomponents/dist/types/InputSuggestionsFilter.js';
 export { default as InputType } from '@ui5/webcomponents/dist/types/InputType.js';
 export { default as InteractiveAreaSize } from '@ui5/webcomponents/dist/types/InteractiveAreaSize.js';
 export { default as LinkAccessibleRole } from '@ui5/webcomponents/dist/types/LinkAccessibleRole.js';
@@ -71,6 +72,7 @@ import * as i0 from '@angular/core';
 import { inject, ElementRef, ChangeDetectorRef, forwardRef, Directive, input, booleanAttribute, output, Injector, runInInjectionContext, effect, ChangeDetectionStrategy, Component, computed, signal, Injectable } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import '@ui5/webcomponents/dist/Avatar.js';
+import '@ui5/webcomponents/dist/AvatarBadge.js';
 import '@ui5/webcomponents/dist/AvatarGroup.js';
 import '@ui5/webcomponents/dist/Bar.js';
 import '@ui5/webcomponents/dist/Breadcrumbs.js';
@@ -380,8 +382,7 @@ class Avatar {
          * - **badge**: Defines the optional badge that will be used for visual affordance.
       
       **Note:** While the slot allows for custom badges, to achieve
-      the Fiori design, you can use the `ui5-tag` with `ui5-icon`
-      in the corresponding `icon` slot, without text nodes.
+      the Fiori design, use the `ui5-avatar-badge` component.
          *
          * @example
          * ```html
@@ -402,7 +403,7 @@ class Avatar {
             },
             {
                 "name": "badge",
-                "description": "Defines the optional badge that will be used for visual affordance.\n\n**Note:** While the slot allows for custom badges, to achieve\nthe Fiori design, you can use the `ui5-tag` with `ui5-icon`\nin the corresponding `icon` slot, without text nodes.",
+                "description": "Defines the optional badge that will be used for visual affordance.\n\n**Note:** While the slot allows for custom badges, to achieve\nthe Fiori design, use the `ui5-avatar-badge` component.",
                 "since": "1.7.0"
             }
         ];
@@ -474,6 +475,72 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                 }]
         }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], fallbackIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "fallbackIcon", required: false }] }], initials: [{ type: i0.Input, args: [{ isSignal: true, alias: "initials", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], colorScheme: [{ type: i0.Input, args: [{ isSignal: true, alias: "colorScheme", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibilityAttributes: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibilityAttributes", required: false }] }], ui5Click: [{ type: i0.Output, args: ["ui5Click"] }] } });
 
+class AvatarBadge {
+    constructor() {
+        /**
+         * Defines the icon name to be displayed inside the badge.
+      
+      **Note:** You should import the desired icon first, then use its name as "icon".
+      
+      `import "@ui5/webcomponents-icons/dist/{icon_name}.js"`
+         */
+        this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
+        /**
+         * Defines the state of the badge, which determines its styling.
+      
+      Available options:
+      - `None` (default) - Standard appearance
+      - `Positive` - Green, used for success/approved states
+      - `Critical` - Orange, used for warning states
+      - `Negative` - Red, used for error/rejected states
+      - `Information` - Blue, used for informational states
+         */
+        this.state = input("None", ...(ngDevMode ? [{ debugName: "state" }] : [])); // className is now passed
+        this.elementRef = inject(ElementRef);
+        this.injector = inject(Injector);
+    }
+    get element() {
+        return this.elementRef.nativeElement;
+    }
+    ngAfterViewInit() {
+        const wcElement = this.element;
+        const inputsToSync = [
+            'icon',
+            'state',
+        ];
+        // Synchronize inputs (properties)
+        for (const inputName of inputsToSync) {
+            // Find the corresponding camelCase signal property on the Angular component
+            const signalName = inputName.replace(/-./g, (x) => x[1].toUpperCase());
+            // Use the Injector to run the effect in the correct context
+            if (this[signalName] && typeof this[signalName] === 'function') {
+                runInInjectionContext(this.injector, () => {
+                    effect(() => {
+                        // Read the signal value
+                        const value = this[signalName]();
+                        if (wcElement) {
+                            // Write the value to the Web Component's property
+                            wcElement[inputName] = value;
+                        }
+                    });
+                });
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarBadge, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: AvatarBadge, isStandalone: true, selector: "ui5-avatar-badge, [ui5-avatar-badge]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["ui5AvatarBadge"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarBadge, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: 'ui5-avatar-badge, [ui5-avatar-badge]',
+                    template: '<ng-content></ng-content>',
+                    exportAs: 'ui5AvatarBadge',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }] } });
+
 class AvatarGroup {
     constructor() {
         /**
@@ -2451,7 +2518,11 @@ class ColorPalettePopover {
       When using this attribute in a declarative way, you must only use the `id` (as a string) of the element at which you want to show the popover.
       You can only set the `opener` attribute to a DOM Reference when using JavaScript.
          */
-        this.opener = input(...(ngDevMode ? [undefined, { debugName: "opener" }] : [])); // className is now passed
+        this.opener = input(...(ngDevMode ? [undefined, { debugName: "opener" }] : []));
+        /**
+         * Determines on which side the component is placed at.
+         */
+        this.placement = input("Bottom", ...(ngDevMode ? [{ debugName: "placement" }] : [])); // className is now passed
         /**
          * Fired when the user selects a color.
          */
@@ -2500,6 +2571,7 @@ class ColorPalettePopover {
             'defaultColor',
             'open',
             'opener',
+            'placement',
         ];
         // Synchronize inputs (properties)
         for (const inputName of inputsToSync) {
@@ -2537,7 +2609,7 @@ class ColorPalettePopover {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ColorPalettePopover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: ColorPalettePopover, isStandalone: true, selector: "ui5-color-palette-popover, [ui5-color-palette-popover]", inputs: { showRecentColors: { classPropertyName: "showRecentColors", publicName: "showRecentColors", isSignal: true, isRequired: false, transformFunction: null }, showMoreColors: { classPropertyName: "showMoreColors", publicName: "showMoreColors", isSignal: true, isRequired: false, transformFunction: null }, showDefaultColor: { classPropertyName: "showDefaultColor", publicName: "showDefaultColor", isSignal: true, isRequired: false, transformFunction: null }, defaultColor: { classPropertyName: "defaultColor", publicName: "defaultColor", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, opener: { classPropertyName: "opener", publicName: "opener", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5ItemClick: "ui5ItemClick", ui5Close: "ui5Close" }, exportAs: ["ui5ColorPalettePopover"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: ColorPalettePopover, isStandalone: true, selector: "ui5-color-palette-popover, [ui5-color-palette-popover]", inputs: { showRecentColors: { classPropertyName: "showRecentColors", publicName: "showRecentColors", isSignal: true, isRequired: false, transformFunction: null }, showMoreColors: { classPropertyName: "showMoreColors", publicName: "showMoreColors", isSignal: true, isRequired: false, transformFunction: null }, showDefaultColor: { classPropertyName: "showDefaultColor", publicName: "showDefaultColor", isSignal: true, isRequired: false, transformFunction: null }, defaultColor: { classPropertyName: "defaultColor", publicName: "defaultColor", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, opener: { classPropertyName: "opener", publicName: "opener", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5ItemClick: "ui5ItemClick", ui5Close: "ui5Close" }, exportAs: ["ui5ColorPalettePopover"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ColorPalettePopover, decorators: [{
             type: Component,
@@ -2548,7 +2620,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     exportAs: 'ui5ColorPalettePopover',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { showRecentColors: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRecentColors", required: false }] }], showMoreColors: [{ type: i0.Input, args: [{ isSignal: true, alias: "showMoreColors", required: false }] }], showDefaultColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDefaultColor", required: false }] }], defaultColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultColor", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], opener: [{ type: i0.Input, args: [{ isSignal: true, alias: "opener", required: false }] }], ui5ItemClick: [{ type: i0.Output, args: ["ui5ItemClick"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
+        }], propDecorators: { showRecentColors: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRecentColors", required: false }] }], showMoreColors: [{ type: i0.Input, args: [{ isSignal: true, alias: "showMoreColors", required: false }] }], showDefaultColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDefaultColor", required: false }] }], defaultColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultColor", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], opener: [{ type: i0.Input, args: [{ isSignal: true, alias: "opener", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], ui5ItemClick: [{ type: i0.Output, args: ["ui5ItemClick"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
 
 class ColorPicker {
     constructor() {
@@ -3186,11 +3258,19 @@ class DatePicker {
     }
     /**
      * Currently selected date represented as a Local JavaScript Date instance.
+  Note: this getter can only be reliably used after the component is fully defined. Use dateValueAsync which resolves only when this condition is met.
      * @readonly This property is managed by the web component.
      */
     get dateValue() {
         return this.element?.dateValue ?? null;
     }
+    /**
+     * Promise that resolves to the currently selected date represented as a Local JavaScript Date instance.
+     * @readonly This property is managed by the web component.
+     */
+    get dateValueAsync() {
+        return this.element?.dateValueAsync ?? Promise;
+    }
     get element() {
         return this.elementRef.nativeElement;
     }
@@ -3463,6 +3543,13 @@ class DateRangePicker {
     get endDateValue() {
         return this.element?.endDateValue ?? null;
     }
+    /**
+     * Promise that resolves to the currently selected date represented as a Local JavaScript Date instance.
+     * @readonly This property is managed by the web component.
+     */
+    get dateValueAsync() {
+        return this.element?.dateValueAsync ?? Promise;
+    }
     get element() {
         return this.elementRef.nativeElement;
     }
@@ -3705,11 +3792,19 @@ class DateTimePicker {
     }
     /**
      * Currently selected date represented as a Local JavaScript Date instance.
+  Note: this getter can only be reliably used after the component is fully defined. Use dateValueAsync which resolves only when this condition is met.
      * @readonly This property is managed by the web component.
      */
     get dateValue() {
         return this.element?.dateValue ?? null;
     }
+    /**
+     * Promise that resolves to the currently selected date represented as a Local JavaScript Date instance.
+     * @readonly This property is managed by the web component.
+     */
+    get dateValueAsync() {
+        return this.element?.dateValueAsync ?? Promise;
+    }
     get element() {
         return this.elementRef.nativeElement;
     }
@@ -4915,7 +5010,11 @@ class Input {
       The picker will not open if the `showSuggestions` property is set to `false`, the input is disabled or the input is readonly.
       The picker will close automatically and `close` event will be fired if the input is not in the viewport.
          */
-        this.open = input(false, { ...(ngDevMode ? { debugName: "open" } : {}), transform: booleanAttribute }); // className is now passed
+        this.open = input(false, { ...(ngDevMode ? { debugName: "open" } : {}), transform: booleanAttribute });
+        /**
+         * Defines the filter type of the component.
+         */
+        this.filter = input("None", ...(ngDevMode ? [{ debugName: "filter" }] : [])); // className is now passed
         /**
          * Fired when the input operation has finished by pressing Enter or on focusout.
          */
@@ -5018,6 +5117,7 @@ class Input {
             'accessibleDescriptionRef',
             'showClearIcon',
             'open',
+            'filter',
         ];
         // Synchronize inputs (properties)
         for (const inputName of inputsToSync) {
@@ -5059,7 +5159,7 @@ class Input {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Input, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: Input, isStandalone: true, selector: "ui5-input, [ui5-input]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, noTypeahead: { classPropertyName: "noTypeahead", publicName: "noTypeahead", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, valueState: { classPropertyName: "valueState", publicName: "valueState", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, showSuggestions: { classPropertyName: "showSuggestions", publicName: "showSuggestions", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, showClearIcon: { classPropertyName: "showClearIcon", publicName: "showClearIcon", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Change: "ui5Change", ui5Input: "ui5Input", ui5Select: "ui5Select", ui5SelectionChange: "ui5SelectionChange", ui5Open: "ui5Open", ui5Close: "ui5Close" }, exportAs: ["ui5Input"], hostDirectives: [{ directive: i1.GenericControlValueAccessor }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: Input, isStandalone: true, selector: "ui5-input, [ui5-input]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, noTypeahead: { classPropertyName: "noTypeahead", publicName: "noTypeahead", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, valueState: { classPropertyName: "valueState", publicName: "valueState", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, showSuggestions: { classPropertyName: "showSuggestions", publicName: "showSuggestions", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, showClearIcon: { classPropertyName: "showClearIcon", publicName: "showClearIcon", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Change: "ui5Change", ui5Input: "ui5Input", ui5Select: "ui5Select", ui5SelectionChange: "ui5SelectionChange", ui5Open: "ui5Open", ui5Close: "ui5Close" }, exportAs: ["ui5Input"], hostDirectives: [{ directive: i1.GenericControlValueAccessor }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Input, decorators: [{
             type: Component,
@@ -5071,7 +5171,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     hostDirectives: [GenericControlValueAccessor$1],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], noTypeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTypeahead", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueState: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueState", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], showSuggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSuggestions", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], showClearIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearIcon", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5Change: [{ type: i0.Output, args: ["ui5Change"] }], ui5Input: [{ type: i0.Output, args: ["ui5Input"] }], ui5Select: [{ type: i0.Output, args: ["ui5Select"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
+        }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], noTypeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTypeahead", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueState: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueState", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], showSuggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSuggestions", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], showClearIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearIcon", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], ui5Change: [{ type: i0.Output, args: ["ui5Change"] }], ui5Input: [{ type: i0.Output, args: ["ui5Input"] }], ui5Select: [{ type: i0.Output, args: ["ui5Select"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
 
 class Label {
     constructor() {
@@ -5436,6 +5536,12 @@ class List {
          * Defines the delay in milliseconds, after which the loading indicator will show up for this component.
          */
         this.loadingDelay = input(1000, ...(ngDevMode ? [{ debugName: "loadingDelay" }] : []));
+        /**
+         * Indicates whether the List header is sticky or not.
+      If stickyHeader is set to true, then whenever you scroll the content or
+      the application, the header of the list will be always visible.
+         */
+        this.stickyHeader = input(false, { ...(ngDevMode ? { debugName: "stickyHeader" } : {}), transform: booleanAttribute });
         /**
          * Defines the accessible name of the component.
          */
@@ -5587,6 +5693,7 @@ class List {
             'growingButtonText',
             'loading',
             'loadingDelay',
+            'stickyHeader',
             'accessibleName',
             'accessibilityAttributes',
             'accessibleNameRef',
@@ -5636,7 +5743,7 @@ class List {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: List, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: List, isStandalone: true, selector: "ui5-list, [ui5-list]", inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, footerText: { classPropertyName: "footerText", publicName: "footerText", isSignal: true, isRequired: false, transformFunction: null }, indent: { classPropertyName: "indent", publicName: "indent", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, noDataText: { classPropertyName: "noDataText", publicName: "noDataText", isSignal: true, isRequired: false, transformFunction: null }, separators: { classPropertyName: "separators", publicName: "separators", isSignal: true, isRequired: false, transformFunction: null }, growing: { classPropertyName: "growing", publicName: "growing", isSignal: true, isRequired: false, transformFunction: null }, growingButtonText: { classPropertyName: "growingButtonText", publicName: "growingButtonText", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingDelay: { classPropertyName: "loadingDelay", publicName: "loadingDelay", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibilityAttributes: { classPropertyName: "accessibilityAttributes", publicName: "accessibilityAttributes", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5ItemClick: "ui5ItemClick", ui5ItemClose: "ui5ItemClose", ui5ItemToggle: "ui5ItemToggle", ui5ItemDelete: "ui5ItemDelete", ui5SelectionChange: "ui5SelectionChange", ui5LoadMore: "ui5LoadMore", ui5MoveOver: "ui5MoveOver", ui5Move: "ui5Move" }, exportAs: ["ui5List"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: List, isStandalone: true, selector: "ui5-list, [ui5-list]", inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, footerText: { classPropertyName: "footerText", publicName: "footerText", isSignal: true, isRequired: false, transformFunction: null }, indent: { classPropertyName: "indent", publicName: "indent", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, noDataText: { classPropertyName: "noDataText", publicName: "noDataText", isSignal: true, isRequired: false, transformFunction: null }, separators: { classPropertyName: "separators", publicName: "separators", isSignal: true, isRequired: false, transformFunction: null }, growing: { classPropertyName: "growing", publicName: "growing", isSignal: true, isRequired: false, transformFunction: null }, growingButtonText: { classPropertyName: "growingButtonText", publicName: "growingButtonText", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingDelay: { classPropertyName: "loadingDelay", publicName: "loadingDelay", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibilityAttributes: { classPropertyName: "accessibilityAttributes", publicName: "accessibilityAttributes", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5ItemClick: "ui5ItemClick", ui5ItemClose: "ui5ItemClose", ui5ItemToggle: "ui5ItemToggle", ui5ItemDelete: "ui5ItemDelete", ui5SelectionChange: "ui5SelectionChange", ui5LoadMore: "ui5LoadMore", ui5MoveOver: "ui5MoveOver", ui5Move: "ui5Move" }, exportAs: ["ui5List"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: List, decorators: [{
             type: Component,
@@ -5647,7 +5754,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     exportAs: 'ui5List',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { headerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerText", required: false }] }], footerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerText", required: false }] }], indent: [{ type: i0.Input, args: [{ isSignal: true, alias: "indent", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], noDataText: [{ type: i0.Input, args: [{ isSignal: true, alias: "noDataText", required: false }] }], separators: [{ type: i0.Input, args: [{ isSignal: true, alias: "separators", required: false }] }], growing: [{ type: i0.Input, args: [{ isSignal: true, alias: "growing", required: false }] }], growingButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "growingButtonText", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], loadingDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingDelay", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibilityAttributes: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibilityAttributes", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], accessibleRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleRole", required: false }] }], ui5ItemClick: [{ type: i0.Output, args: ["ui5ItemClick"] }], ui5ItemClose: [{ type: i0.Output, args: ["ui5ItemClose"] }], ui5ItemToggle: [{ type: i0.Output, args: ["ui5ItemToggle"] }], ui5ItemDelete: [{ type: i0.Output, args: ["ui5ItemDelete"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }], ui5LoadMore: [{ type: i0.Output, args: ["ui5LoadMore"] }], ui5MoveOver: [{ type: i0.Output, args: ["ui5MoveOver"] }], ui5Move: [{ type: i0.Output, args: ["ui5Move"] }] } });
+        }], propDecorators: { headerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerText", required: false }] }], footerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerText", required: false }] }], indent: [{ type: i0.Input, args: [{ isSignal: true, alias: "indent", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], noDataText: [{ type: i0.Input, args: [{ isSignal: true, alias: "noDataText", required: false }] }], separators: [{ type: i0.Input, args: [{ isSignal: true, alias: "separators", required: false }] }], growing: [{ type: i0.Input, args: [{ isSignal: true, alias: "growing", required: false }] }], growingButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "growingButtonText", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], loadingDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingDelay", required: false }] }], stickyHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyHeader", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibilityAttributes: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibilityAttributes", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], accessibleRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleRole", required: false }] }], ui5ItemClick: [{ type: i0.Output, args: ["ui5ItemClick"] }], ui5ItemClose: [{ type: i0.Output, args: ["ui5ItemClose"] }], ui5ItemToggle: [{ type: i0.Output, args: ["ui5ItemToggle"] }], ui5ItemDelete: [{ type: i0.Output, args: ["ui5ItemDelete"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }], ui5LoadMore: [{ type: i0.Output, args: ["ui5LoadMore"] }], ui5MoveOver: [{ type: i0.Output, args: ["ui5MoveOver"] }], ui5Move: [{ type: i0.Output, args: ["ui5Move"] }] } });
 
 class ListItemCustom {
     constructor() {
@@ -6836,6 +6943,10 @@ class MultiComboBox {
          * Defines whether the component is required.
          */
         this.required = input(false, { ...(ngDevMode ? { debugName: "required" } : {}), transform: booleanAttribute });
+        /**
+         * Indicates whether a loading indicator should be shown in the picker.
+         */
+        this.loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : {}), transform: booleanAttribute });
         /**
          * Defines the filter type of the component.
          */
@@ -6880,6 +6991,12 @@ class MultiComboBox {
          * Fired when selection is changed by user interaction.
          */
         this.ui5SelectionChange = output();
+        /**
+         * Fired before the value state of the component is updated internally.
+      The event is preventable, meaning that if it's default action is
+      prevented, the component will not update the value state.
+         */
+        this.ui5ValueStateChange = output();
         /**
          * Available slots for content projection in this component.
          *
@@ -6941,6 +7058,7 @@ class MultiComboBox {
             'valueState',
             'readonly',
             'required',
+            'loading',
             'filter',
             'showClearIcon',
             'accessibleName',
@@ -6972,6 +7090,7 @@ class MultiComboBox {
             'ui5Open',
             'ui5Close',
             'ui5SelectionChange',
+            'ui5ValueStateChange',
         ];
         // Synchronize outputs (events)
         for (const outputName of outputsToSync) {
@@ -6987,7 +7106,7 @@ class MultiComboBox {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: MultiComboBox, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: MultiComboBox, isStandalone: true, selector: "ui5-multi-combobox, [ui5-multi-combobox]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, noTypeahead: { classPropertyName: "noTypeahead", publicName: "noTypeahead", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, noValidation: { classPropertyName: "noValidation", publicName: "noValidation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, valueState: { classPropertyName: "valueState", publicName: "valueState", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, showClearIcon: { classPropertyName: "showClearIcon", publicName: "showClearIcon", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Change: "ui5Change", ui5Input: "ui5Input", ui5Open: "ui5Open", ui5Close: "ui5Close", ui5SelectionChange: "ui5SelectionChange" }, exportAs: ["ui5MultiComboBox"], hostDirectives: [{ directive: i1.GenericControlValueAccessor }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: MultiComboBox, isStandalone: true, selector: "ui5-multi-combobox, [ui5-multi-combobox]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, noTypeahead: { classPropertyName: "noTypeahead", publicName: "noTypeahead", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, noValidation: { classPropertyName: "noValidation", publicName: "noValidation", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, valueState: { classPropertyName: "valueState", publicName: "valueState", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, showClearIcon: { classPropertyName: "showClearIcon", publicName: "showClearIcon", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, showSelectAll: { classPropertyName: "showSelectAll", publicName: "showSelectAll", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Change: "ui5Change", ui5Input: "ui5Input", ui5Open: "ui5Open", ui5Close: "ui5Close", ui5SelectionChange: "ui5SelectionChange", ui5ValueStateChange: "ui5ValueStateChange" }, exportAs: ["ui5MultiComboBox"], hostDirectives: [{ directive: i1.GenericControlValueAccessor }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: MultiComboBox, decorators: [{
             type: Component,
@@ -6999,7 +7118,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     hostDirectives: [GenericControlValueAccessor$1],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], noTypeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTypeahead", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], noValidation: [{ type: i0.Input, args: [{ isSignal: true, alias: "noValidation", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valueState: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueState", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], showClearIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearIcon", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], showSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectAll", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5Change: [{ type: i0.Output, args: ["ui5Change"] }], ui5Input: [{ type: i0.Output, args: ["ui5Input"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }] } });
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], noTypeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTypeahead", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], noValidation: [{ type: i0.Input, args: [{ isSignal: true, alias: "noValidation", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valueState: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueState", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], showClearIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearIcon", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], showSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectAll", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5Change: [{ type: i0.Output, args: ["ui5Change"] }], ui5Input: [{ type: i0.Output, args: ["ui5Input"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }], ui5ValueStateChange: [{ type: i0.Output, args: ["ui5ValueStateChange"] }] } });
 
 class MultiComboBoxItem {
     constructor() {
@@ -7288,7 +7407,11 @@ class MultiInput {
       The picker will not open if the `showSuggestions` property is set to `false`, the input is disabled or the input is readonly.
       The picker will close automatically and `close` event will be fired if the input is not in the viewport.
          */
-        this.open = input(false, { ...(ngDevMode ? { debugName: "open" } : {}), transform: booleanAttribute }); // className is now passed
+        this.open = input(false, { ...(ngDevMode ? { debugName: "open" } : {}), transform: booleanAttribute });
+        /**
+         * Defines the filter type of the component.
+         */
+        this.filter = input("None", ...(ngDevMode ? [{ debugName: "filter" }] : [])); // className is now passed
         /**
          * Fired when the value help icon is pressed
       and F4 or ALT/OPTION + ARROW_UP/ARROW_DOWN keyboard keys are used.
@@ -7406,6 +7529,7 @@ class MultiInput {
             'accessibleDescriptionRef',
             'showClearIcon',
             'open',
+            'filter',
         ];
         // Synchronize inputs (properties)
         for (const inputName of inputsToSync) {
@@ -7449,7 +7573,7 @@ class MultiInput {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: MultiInput, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: MultiInput, isStandalone: true, selector: "ui5-multi-input, [ui5-multi-input]", inputs: { showValueHelpIcon: { classPropertyName: "showValueHelpIcon", publicName: "showValueHelpIcon", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, noTypeahead: { classPropertyName: "noTypeahead", publicName: "noTypeahead", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", 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 }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, showClearIcon: { classPropertyName: "showClearIcon", publicName: "showClearIcon", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5ValueHelpTrigger: "ui5ValueHelpTrigger", ui5TokenDelete: "ui5TokenDelete", ui5Change: "ui5Change", ui5Input: "ui5Input", ui5Select: "ui5Select", ui5SelectionChange: "ui5SelectionChange", ui5Open: "ui5Open", ui5Close: "ui5Close" }, exportAs: ["ui5MultiInput"], hostDirectives: [{ directive: i1.GenericControlValueAccessor }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: MultiInput, isStandalone: true, selector: "ui5-multi-input, [ui5-multi-input]", inputs: { showValueHelpIcon: { classPropertyName: "showValueHelpIcon", publicName: "showValueHelpIcon", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, noTypeahead: { classPropertyName: "noTypeahead", publicName: "noTypeahead", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", 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 }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, showClearIcon: { classPropertyName: "showClearIcon", publicName: "showClearIcon", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5ValueHelpTrigger: "ui5ValueHelpTrigger", ui5TokenDelete: "ui5TokenDelete", ui5Change: "ui5Change", ui5Input: "ui5Input", ui5Select: "ui5Select", ui5SelectionChange: "ui5SelectionChange", ui5Open: "ui5Open", ui5Close: "ui5Close" }, exportAs: ["ui5MultiInput"], hostDirectives: [{ directive: i1.GenericControlValueAccessor }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: MultiInput, decorators: [{
             type: Component,
@@ -7461,7 +7585,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     hostDirectives: [GenericControlValueAccessor$1],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { showValueHelpIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValueHelpIcon", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], noTypeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTypeahead", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueState: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueState", required: false }] }], showSuggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSuggestions", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], showClearIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearIcon", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5ValueHelpTrigger: [{ type: i0.Output, args: ["ui5ValueHelpTrigger"] }], ui5TokenDelete: [{ type: i0.Output, args: ["ui5TokenDelete"] }], ui5Change: [{ type: i0.Output, args: ["ui5Change"] }], ui5Input: [{ type: i0.Output, args: ["ui5Input"] }], ui5Select: [{ type: i0.Output, args: ["ui5Select"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
+        }], propDecorators: { showValueHelpIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValueHelpIcon", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], noTypeahead: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTypeahead", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueState: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueState", required: false }] }], showSuggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSuggestions", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], showClearIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearIcon", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], ui5ValueHelpTrigger: [{ type: i0.Output, args: ["ui5ValueHelpTrigger"] }], ui5TokenDelete: [{ type: i0.Output, args: ["ui5TokenDelete"] }], ui5Change: [{ type: i0.Output, args: ["ui5Change"] }], ui5Input: [{ type: i0.Output, args: ["ui5Input"] }], ui5Select: [{ type: i0.Output, args: ["ui5Select"] }], ui5SelectionChange: [{ type: i0.Output, args: ["ui5SelectionChange"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
 
 class Option {
     constructor() {
@@ -7825,7 +7949,7 @@ class Popover {
         this.verticalAlign = input("Center", ...(ngDevMode ? [{ debugName: "verticalAlign" }] : []));
         /**
          * Defines whether the component should close when
-      clicking/tapping outside of the popover.
+      clicking/tapping outside the popover.
       If enabled, it blocks any interaction with the background.
          */
         this.modal = input(false, { ...(ngDevMode ? { debugName: "modal" } : {}), transform: booleanAttribute });
@@ -7838,6 +7962,11 @@ class Popover {
       over the target.
          */
         this.allowTargetOverlap = input(false, { ...(ngDevMode ? { debugName: "allowTargetOverlap" } : {}), transform: booleanAttribute });
+        /**
+         * Determines whether the component is resizable.
+      **Note:** This property is effective only on desktop devices.
+         */
+        this.resizable = input(false, { ...(ngDevMode ? { debugName: "resizable" } : {}), transform: booleanAttribute });
         /**
          * Defines the ID or DOM Reference of the element at which the popover is shown.
       When using this attribute in a declarative way, you must only use the `id` (as a string) of the element at which you want to show the popover.
@@ -7951,6 +8080,7 @@ class Popover {
             'modal',
             'hideArrow',
             'allowTargetOverlap',
+            'resizable',
             'opener',
             'initialFocus',
             'preventFocusRestore',
@@ -8000,7 +8130,7 @@ class Popover {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Popover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: Popover, isStandalone: true, selector: "ui5-popover, [ui5-popover]", inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlign: { classPropertyName: "horizontalAlign", publicName: "horizontalAlign", isSignal: true, isRequired: false, transformFunction: null }, verticalAlign: { classPropertyName: "verticalAlign", publicName: "verticalAlign", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, hideArrow: { classPropertyName: "hideArrow", publicName: "hideArrow", isSignal: true, isRequired: false, transformFunction: null }, allowTargetOverlap: { classPropertyName: "allowTargetOverlap", publicName: "allowTargetOverlap", isSignal: true, isRequired: false, transformFunction: null }, opener: { classPropertyName: "opener", publicName: "opener", isSignal: true, isRequired: false, transformFunction: null }, initialFocus: { classPropertyName: "initialFocus", publicName: "initialFocus", isSignal: true, isRequired: false, transformFunction: null }, preventFocusRestore: { classPropertyName: "preventFocusRestore", publicName: "preventFocusRestore", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, preventInitialFocus: { classPropertyName: "preventInitialFocus", publicName: "preventInitialFocus", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5BeforeOpen: "ui5BeforeOpen", ui5Open: "ui5Open", ui5BeforeClose: "ui5BeforeClose", ui5Close: "ui5Close" }, exportAs: ["ui5Popover"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: Popover, isStandalone: true, selector: "ui5-popover, [ui5-popover]", inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlign: { classPropertyName: "horizontalAlign", publicName: "horizontalAlign", isSignal: true, isRequired: false, transformFunction: null }, verticalAlign: { classPropertyName: "verticalAlign", publicName: "verticalAlign", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, hideArrow: { classPropertyName: "hideArrow", publicName: "hideArrow", isSignal: true, isRequired: false, transformFunction: null }, allowTargetOverlap: { classPropertyName: "allowTargetOverlap", publicName: "allowTargetOverlap", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, opener: { classPropertyName: "opener", publicName: "opener", isSignal: true, isRequired: false, transformFunction: null }, initialFocus: { classPropertyName: "initialFocus", publicName: "initialFocus", isSignal: true, isRequired: false, transformFunction: null }, preventFocusRestore: { classPropertyName: "preventFocusRestore", publicName: "preventFocusRestore", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, preventInitialFocus: { classPropertyName: "preventInitialFocus", publicName: "preventInitialFocus", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5BeforeOpen: "ui5BeforeOpen", ui5Open: "ui5Open", ui5BeforeClose: "ui5BeforeClose", ui5Close: "ui5Close" }, exportAs: ["ui5Popover"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Popover, decorators: [{
             type: Component,
@@ -8011,7 +8141,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     exportAs: 'ui5Popover',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { headerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerText", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], horizontalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalAlign", required: false }] }], verticalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "verticalAlign", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], hideArrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideArrow", required: false }] }], allowTargetOverlap: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowTargetOverlap", required: false }] }], opener: [{ type: i0.Input, args: [{ isSignal: true, alias: "opener", required: false }] }], initialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFocus", required: false }] }], preventFocusRestore: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventFocusRestore", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleRole", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], preventInitialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventInitialFocus", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5BeforeOpen: [{ type: i0.Output, args: ["ui5BeforeOpen"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5BeforeClose: [{ type: i0.Output, args: ["ui5BeforeClose"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
+        }], propDecorators: { headerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerText", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], horizontalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalAlign", required: false }] }], verticalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "verticalAlign", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], hideArrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideArrow", required: false }] }], allowTargetOverlap: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowTargetOverlap", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], opener: [{ type: i0.Input, args: [{ isSignal: true, alias: "opener", required: false }] }], initialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFocus", required: false }] }], preventFocusRestore: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventFocusRestore", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleRole", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], preventInitialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventInitialFocus", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5BeforeOpen: [{ type: i0.Output, args: ["ui5BeforeOpen"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5BeforeClose: [{ type: i0.Output, args: ["ui5BeforeClose"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
 
 class ProgressIndicator {
     constructor() {
@@ -8521,7 +8651,7 @@ class ResponsivePopover {
         this.verticalAlign = input("Center", ...(ngDevMode ? [{ debugName: "verticalAlign" }] : []));
         /**
          * Defines whether the component should close when
-      clicking/tapping outside of the popover.
+      clicking/tapping outside the popover.
       If enabled, it blocks any interaction with the background.
          */
         this.modal = input(false, { ...(ngDevMode ? { debugName: "modal" } : {}), transform: booleanAttribute });
@@ -8534,6 +8664,11 @@ class ResponsivePopover {
       over the target.
          */
         this.allowTargetOverlap = input(false, { ...(ngDevMode ? { debugName: "allowTargetOverlap" } : {}), transform: booleanAttribute });
+        /**
+         * Determines whether the component is resizable.
+      **Note:** This property is effective only on desktop devices.
+         */
+        this.resizable = input(false, { ...(ngDevMode ? { debugName: "resizable" } : {}), transform: booleanAttribute });
         /**
          * Defines the ID or DOM Reference of the element at which the popover is shown.
       When using this attribute in a declarative way, you must only use the `id` (as a string) of the element at which you want to show the popover.
@@ -8647,6 +8782,7 @@ class ResponsivePopover {
             'modal',
             'hideArrow',
             'allowTargetOverlap',
+            'resizable',
             'opener',
             'initialFocus',
             'preventFocusRestore',
@@ -8696,7 +8832,7 @@ class ResponsivePopover {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ResponsivePopover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: ResponsivePopover, isStandalone: true, selector: "ui5-responsive-popover, [ui5-responsive-popover]", inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlign: { classPropertyName: "horizontalAlign", publicName: "horizontalAlign", isSignal: true, isRequired: false, transformFunction: null }, verticalAlign: { classPropertyName: "verticalAlign", publicName: "verticalAlign", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, hideArrow: { classPropertyName: "hideArrow", publicName: "hideArrow", isSignal: true, isRequired: false, transformFunction: null }, allowTargetOverlap: { classPropertyName: "allowTargetOverlap", publicName: "allowTargetOverlap", isSignal: true, isRequired: false, transformFunction: null }, opener: { classPropertyName: "opener", publicName: "opener", isSignal: true, isRequired: false, transformFunction: null }, initialFocus: { classPropertyName: "initialFocus", publicName: "initialFocus", isSignal: true, isRequired: false, transformFunction: null }, preventFocusRestore: { classPropertyName: "preventFocusRestore", publicName: "preventFocusRestore", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, preventInitialFocus: { classPropertyName: "preventInitialFocus", publicName: "preventInitialFocus", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5BeforeOpen: "ui5BeforeOpen", ui5Open: "ui5Open", ui5BeforeClose: "ui5BeforeClose", ui5Close: "ui5Close" }, exportAs: ["ui5ResponsivePopover"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: ResponsivePopover, isStandalone: true, selector: "ui5-responsive-popover, [ui5-responsive-popover]", inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, horizontalAlign: { classPropertyName: "horizontalAlign", publicName: "horizontalAlign", isSignal: true, isRequired: false, transformFunction: null }, verticalAlign: { classPropertyName: "verticalAlign", publicName: "verticalAlign", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, hideArrow: { classPropertyName: "hideArrow", publicName: "hideArrow", isSignal: true, isRequired: false, transformFunction: null }, allowTargetOverlap: { classPropertyName: "allowTargetOverlap", publicName: "allowTargetOverlap", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, opener: { classPropertyName: "opener", publicName: "opener", isSignal: true, isRequired: false, transformFunction: null }, initialFocus: { classPropertyName: "initialFocus", publicName: "initialFocus", isSignal: true, isRequired: false, transformFunction: null }, preventFocusRestore: { classPropertyName: "preventFocusRestore", publicName: "preventFocusRestore", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescription: { classPropertyName: "accessibleDescription", publicName: "accessibleDescription", isSignal: true, isRequired: false, transformFunction: null }, accessibleDescriptionRef: { classPropertyName: "accessibleDescriptionRef", publicName: "accessibleDescriptionRef", isSignal: true, isRequired: false, transformFunction: null }, preventInitialFocus: { classPropertyName: "preventInitialFocus", publicName: "preventInitialFocus", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5BeforeOpen: "ui5BeforeOpen", ui5Open: "ui5Open", ui5BeforeClose: "ui5BeforeClose", ui5Close: "ui5Close" }, exportAs: ["ui5ResponsivePopover"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ResponsivePopover, decorators: [{
             type: Component,
@@ -8707,7 +8843,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     exportAs: 'ui5ResponsivePopover',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { headerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerText", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], horizontalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalAlign", required: false }] }], verticalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "verticalAlign", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], hideArrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideArrow", required: false }] }], allowTargetOverlap: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowTargetOverlap", required: false }] }], opener: [{ type: i0.Input, args: [{ isSignal: true, alias: "opener", required: false }] }], initialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFocus", required: false }] }], preventFocusRestore: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventFocusRestore", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleRole", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], preventInitialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventInitialFocus", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5BeforeOpen: [{ type: i0.Output, args: ["ui5BeforeOpen"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5BeforeClose: [{ type: i0.Output, args: ["ui5BeforeClose"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
+        }], propDecorators: { headerText: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerText", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], horizontalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalAlign", required: false }] }], verticalAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "verticalAlign", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], hideArrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideArrow", required: false }] }], allowTargetOverlap: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowTargetOverlap", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], opener: [{ type: i0.Input, args: [{ isSignal: true, alias: "opener", required: false }] }], initialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFocus", required: false }] }], preventFocusRestore: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventFocusRestore", required: false }] }], accessibleName: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleName", required: false }] }], accessibleNameRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleNameRef", required: false }] }], accessibleRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleRole", required: false }] }], accessibleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescription", required: false }] }], accessibleDescriptionRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessibleDescriptionRef", required: false }] }], preventInitialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventInitialFocus", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], ui5BeforeOpen: [{ type: i0.Output, args: ["ui5BeforeOpen"] }], ui5Open: [{ type: i0.Output, args: ["ui5Open"] }], ui5BeforeClose: [{ type: i0.Output, args: ["ui5BeforeClose"] }], ui5Close: [{ type: i0.Output, args: ["ui5Close"] }] } });
 
 class SegmentedButton {
     constructor() {
@@ -14184,5 +14320,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { Avatar, AvatarGroup, Bar, Breadcrumbs, BreadcrumbsItem, BusyIndicator, Button, ButtonBadge, Calendar, CalendarDate, CalendarDateRange, CalendarLegend, CalendarLegendItem, Card, CardHeader, Carousel, CheckBox, ColorPalette, ColorPaletteItem, ColorPalettePopover, ColorPicker, ComboBox, ComboBoxItem, ComboBoxItemGroup, DatePicker, DateRangePicker, DateTimePicker, Dialog, DynamicDateRange, ExpandableText, FileUploader, Form, FormGroup, FormItem, GenericControlValueAccessor, Icon, Input, Label, Link, List, ListItemCustom, ListItemGroup, ListItemStandard, Menu, MenuItem, MenuItemGroup, MenuSeparator, MessageStrip, MultiComboBox, MultiComboBoxItem, MultiComboBoxItemGroup, MultiInput, Option, OptionCustom, Panel, Popover, ProgressIndicator, RadioButton, RangeSlider, RatingIndicator, ResponsivePopover, SegmentedButton, SegmentedButtonItem, Select, Slider, SpecialCalendarDate, SplitButton, StepInput, SuggestionItem, SuggestionItemCustom, SuggestionItemGroup, Switch, Tab, TabContainer, TabSeparator, Table, TableCell, TableGrowing, TableHeaderCell, TableHeaderCellActionAI, TableHeaderRow, TableRow, TableRowAction, TableRowActionNavigation, TableSelection, TableSelectionMulti, TableSelectionSingle, TableVirtualizer, Tag, Text, TextArea, TimePicker, Title, Toast, ToggleButton, Token, Tokenizer, Toolbar, ToolbarButton, ToolbarSelect, ToolbarSelectOption, ToolbarSeparator, ToolbarSpacer, Tree, TreeItem, TreeItemCustom, Ui5WebcomponentsMainThemingService };
+export { Avatar, AvatarBadge, AvatarGroup, Bar, Breadcrumbs, BreadcrumbsItem, BusyIndicator, Button, ButtonBadge, Calendar, CalendarDate, CalendarDateRange, CalendarLegend, CalendarLegendItem, Card, CardHeader, Carousel, CheckBox, ColorPalette, ColorPaletteItem, ColorPalettePopover, ColorPicker, ComboBox, ComboBoxItem, ComboBoxItemGroup, DatePicker, DateRangePicker, DateTimePicker, Dialog, DynamicDateRange, ExpandableText, FileUploader, Form, FormGroup, FormItem, GenericControlValueAccessor, Icon, Input, Label, Link, List, ListItemCustom, ListItemGroup, ListItemStandard, Menu, MenuItem, MenuItemGroup, MenuSeparator, MessageStrip, MultiComboBox, MultiComboBoxItem, MultiComboBoxItemGroup, MultiInput, Option, OptionCustom, Panel, Popover, ProgressIndicator, RadioButton, RangeSlider, RatingIndicator, ResponsivePopover, SegmentedButton, SegmentedButtonItem, Select, Slider, SpecialCalendarDate, SplitButton, StepInput, SuggestionItem, SuggestionItemCustom, SuggestionItemGroup, Switch, Tab, TabContainer, TabSeparator, Table, TableCell, TableGrowing, TableHeaderCell, TableHeaderCellActionAI, TableHeaderRow, TableRow, TableRowAction, TableRowActionNavigation, TableSelection, TableSelectionMulti, TableSelectionSingle, TableVirtualizer, Tag, Text, TextArea, TimePicker, Title, Toast, ToggleButton, Token, Tokenizer, Toolbar, ToolbarButton, ToolbarSelect, ToolbarSelectOption, ToolbarSeparator, ToolbarSpacer, Tree, TreeItem, TreeItemCustom, Ui5WebcomponentsMainThemingService };
 //# sourceMappingURL=fundamental-ngx-ui5-webcomponents.mjs.map