@fundamental-ngx/core 0.40.4-rc.6 → 0.40.5

package/fesm2015/fundamental-ngx-core-micro-process-flow.mjs

@@ -47,9 +47,9 @@ class MicroProcessFlowFocusableItemDirective {
         (_a = this._microProcessFlow) === null || _a === void 0 ? void 0 : _a.canItemsReceiveFocus.next(true);
     }
 }
-MicroProcessFlowFocusableItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowFocusableItemDirective, deps: [{ token: i0.ElementRef }, { token: MICRO_PROCESS_FLOW, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-MicroProcessFlowFocusableItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.8", type: MicroProcessFlowFocusableItemDirective, selector: "[fdMicroProcessFlowFocusableItem], [fd-micro-process-flow-focusable-item]", host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" }, classAttribute: "fd-micro-process-flow__focusable-item" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowFocusableItemDirective, decorators: [{
+MicroProcessFlowFocusableItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowFocusableItemDirective, deps: [{ token: i0.ElementRef }, { token: MICRO_PROCESS_FLOW, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+MicroProcessFlowFocusableItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: MicroProcessFlowFocusableItemDirective, selector: "[fdMicroProcessFlowFocusableItem], [fd-micro-process-flow-focusable-item]", host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" }, classAttribute: "fd-micro-process-flow__focusable-item" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowFocusableItemDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[fdMicroProcessFlowFocusableItem], [fd-micro-process-flow-focusable-item]',
@@ -94,9 +94,9 @@ class MicroProcessFlowItemComponent {
         }
     }
 }
-MicroProcessFlowItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-MicroProcessFlowItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: MicroProcessFlowItemComponent, selector: "fd-micro-process-flow-item", inputs: { state: "state", intermediate: "intermediate" }, host: { properties: { "class.fd-micro-process-flow__item--positive": "state === \"positive\"", "class.fd-micro-process-flow__item--critical": "state === \"critical\"", "class.fd-micro-process-flow__item--negative": "state === \"negative\"", "class.fd-micro-process-flow__item--information": "state === \"information\"" }, classAttribute: "fd-micro-process-flow__item" }, queries: [{ propertyName: "focusableElement", first: true, predicate: MicroProcessFlowFocusableItemDirective, descendants: true }], ngImport: i0, template: "<div class=\"fd-micro-process-flow__content\">\n    <div class=\"fd-micro-process-flow__content-wrapper\">\n        <ng-content></ng-content>\n    </div>\n    <div\n        class=\"fd-micro-process-flow__connector\"\n        *ngIf=\"!_lastItem\"\n        [class.fd-micro-process-flow__connector--intermediate]=\"intermediate\"\n    >\n        <ng-content select=\"[fd-micro-process-flow-intermediary-item]\"></ng-content>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowItemComponent, decorators: [{
+MicroProcessFlowItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+MicroProcessFlowItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MicroProcessFlowItemComponent, selector: "fd-micro-process-flow-item", inputs: { state: "state", intermediate: "intermediate" }, host: { properties: { "class.fd-micro-process-flow__item--positive": "state === \"positive\"", "class.fd-micro-process-flow__item--critical": "state === \"critical\"", "class.fd-micro-process-flow__item--negative": "state === \"negative\"", "class.fd-micro-process-flow__item--information": "state === \"information\"" }, classAttribute: "fd-micro-process-flow__item" }, queries: [{ propertyName: "focusableElement", first: true, predicate: MicroProcessFlowFocusableItemDirective, descendants: true }], ngImport: i0, template: "<div class=\"fd-micro-process-flow__content\">\n    <div class=\"fd-micro-process-flow__content-wrapper\">\n        <ng-content></ng-content>\n    </div>\n    <div\n        class=\"fd-micro-process-flow__connector\"\n        *ngIf=\"!_lastItem\"\n        [class.fd-micro-process-flow__connector--intermediate]=\"intermediate\"\n    >\n        <ng-content select=\"[fd-micro-process-flow-intermediary-item]\"></ng-content>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-micro-process-flow-item', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'fd-micro-process-flow__item',
@@ -361,15 +361,15 @@ class MicroProcessFlowComponent {
         return this._focusedElementIndex === -1 ? this.previousItemsCount : this._focusedElementIndex;
     }
 }
-MicroProcessFlowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.RtlService, optional: true }, { token: i2.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component });
-MicroProcessFlowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: MicroProcessFlowComponent, selector: "fd-micro-process-flow", inputs: { independentSteps: "independentSteps", transitionSpeed: "transitionSpeed", transitionTimingFunction: "transitionTimingFunction" }, host: { listeners: { "keydown": "handleKeyboardEvent($event)" }, properties: { "class.fd-micro-process-flow--independent-steps": "independentSteps" }, classAttribute: "fd-micro-process-flow" }, providers: [
+MicroProcessFlowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.RtlService, optional: true }, { token: i2.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component });
+MicroProcessFlowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MicroProcessFlowComponent, selector: "fd-micro-process-flow", inputs: { independentSteps: "independentSteps", transitionSpeed: "transitionSpeed", transitionTimingFunction: "transitionTimingFunction" }, host: { listeners: { "keydown": "handleKeyboardEvent($event)" }, properties: { "class.fd-micro-process-flow--independent-steps": "independentSteps" }, classAttribute: "fd-micro-process-flow" }, providers: [
         {
             provide: MICRO_PROCESS_FLOW,
             useExisting: MicroProcessFlowComponent
         },
         contentDensityObserverProviders()
     ], queries: [{ propertyName: "items", predicate: MicroProcessFlowItemComponent }, { propertyName: "focusableItems", predicate: MicroProcessFlowFocusableItemDirective, descendants: true }], viewQueries: [{ propertyName: "_wrapperContainer", first: true, predicate: ["wrapperContainer"], descendants: true }, { propertyName: "_container", first: true, predicate: ["container"], descendants: true }, { propertyName: "_goNextButton", first: true, predicate: ["goNextButton"], descendants: true }], ngImport: i0, template: "<a\n    tabindex=\"0\"\n    class=\"fd-micro-process-flow__link-previous\"\n    role=\"button\"\n    type=\"button\"\n    (click)=\"goBack()\"\n    (keypress)=\"onKeypressHandler(-1, $event)\"\n    *ngIf=\"showPreviousButton\"\n>\n    {{ previousItemsCount }}\n</a>\n<div class=\"fd-micro-process-flow__overflow-container\" #container>\n    <div\n        class=\"fd-micro-process-flow__wrapper\"\n        #wrapperContainer\n        [style.transition-duration]=\"transitionSpeed + 'ms'\"\n        [style.transition-timing-function]=\"transitionTimingFunction\"\n    >\n        <ng-content select=\"fd-micro-process-flow-item\"></ng-content>\n    </div>\n</div>\n<a\n    tabindex=\"0\"\n    class=\"fd-micro-process-flow__link-next\"\n    role=\"button\"\n    type=\"button\"\n    (click)=\"goNext()\"\n    (keypress)=\"onKeypressHandler(1, $event)\"\n    *ngIf=\"showNextButton\"\n    #goNextButton\n>\n    {{ nextItemsCount }}\n</a>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */:root{--fdMicro_Process_Flow_Item_Background:var(--sapNeutralBackground);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNeutralBorderColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--fdMicro_Process_Flow_Item_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--fdMicro_Process_Flow_Item_Border_Color);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Width:2.75rem;--fdMicro_Process_Flow_Item_Min_Width:1.875rem;--fdMicro_Process_Flow_Compact_Item_Width:2rem;--fdMicro_Process_Flow_Compact_Item_Min_Width:1.375rem;--fdMicro_Process_Flow_Connector_Width:1.125rem;--fdMicro_Process_Flow_Compact_Connector_Width:.625rem;--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontLargeSize);--fdMicro_Process_Flow_Visible_items:8;--fdMicro_Process_Flow_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem);--fdMicro_Process_Flow_Compact_Max_Container_Width:calc(var(--fdMicro_Process_Flow_Compact_Item_Width)*(var(--fdMicro_Process_Flow_Visible_items) + 1) + .0625rem)}.fd-micro-process-flow{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:row;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;max-width:var(--fdMicro_Process_Flow_Max_Container_Width);padding:0}.fd-micro-process-flow:after,.fd-micro-process-flow:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow--independent-steps .fd-micro-process-flow__connector:before{border-color:transparent}.fd-micro-process-flow__wrapper{-webkit-box-sizing:border-box;-webkit-transition-property:-webkit-transform;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:row;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;transition-property:transform}.fd-micro-process-flow__wrapper:after,.fd-micro-process-flow__wrapper:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__overflow-container{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:row;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;width:100%}.fd-micro-process-flow__overflow-container:after,.fd-micro-process-flow__overflow-container:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next,.fd-micro-process-flow__link-previous{-webkit-box-sizing:border-box;-webkit-box-pack:start;-ms-flex-pack:start;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:flex-start;line-height:var(--sapContent_LineHeight);margin:0;padding:0 .313rem;text-shadow:var(--sapContent_TextShadow)}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__link-next.is-focus,.fd-micro-process-flow__link-next:focus,.fd-micro-process-flow__link-previous.is-focus,.fd-micro-process-flow__link-previous:focus{outline-color:var(--sapContent_FocusColor);outline-offset:-.1875rem;outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-micro-process-flow__link-next:after,.fd-micro-process-flow__link-next:before,.fd-micro-process-flow__link-previous:after,.fd-micro-process-flow__link-previous:before{-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;color:var(--sapButton_TextColor);display:flex;font-family:SAP-icons;justify-content:center;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-micro-process-flow__link-next.is-hover:after,.fd-micro-process-flow__link-next.is-hover:before,.fd-micro-process-flow__link-next:hover:after,.fd-micro-process-flow__link-next:hover:before,.fd-micro-process-flow__link-previous.is-hover:after,.fd-micro-process-flow__link-previous.is-hover:before,.fd-micro-process-flow__link-previous:hover:after,.fd-micro-process-flow__link-previous:hover:before{color:var(--sapButton_Hover_TextColor)}.fd-micro-process-flow__link-previous:before{content:\"\\e067\";padding-right:.313rem}.fd-micro-process-flow__link-previous[dir=rtl]:before,[dir=rtl] .fd-micro-process-flow__link-previous:before{content:\"\\e066\";padding-left:.313rem;padding-right:0}.fd-micro-process-flow__link-next{justify-content:flex-end}.fd-micro-process-flow__link-next:after{content:\"\\e066\";padding-left:.313rem}.fd-micro-process-flow__link-next[dir=rtl]:after,[dir=rtl] .fd-micro-process-flow__link-next:after{content:\"\\e067\";padding-left:0;padding-right:.313rem}.fd-micro-process-flow .fd-micro-process-flow__item{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:stretch;-ms-flex-align:stretch;-webkit-box-pack:start;-ms-flex-pack:start;align-items:stretch;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;justify-content:flex-start;line-height:var(--sapContent_LineHeight);margin:0;margin:calc(var(--sapContent_FocusWidth) + var(--sapContent_FocusWidth)) 0;padding:0 0 0 .1875rem;position:relative}.fd-micro-process-flow .fd-micro-process-flow__item:after,.fd-micro-process-flow .fd-micro-process-flow__item:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__item--positive{--fdMicro_Process_Flow_Item_Background:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapPositiveElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Success_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--information{--fdMicro_Process_Flow_Item_Background:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapInformativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Information_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--negative{--fdMicro_Process_Flow_Item_Background:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapNegativeElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Negative_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item--critical{--fdMicro_Process_Flow_Item_Background:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Border_Color:var(--sapCriticalElementColor);--fdMicro_Process_Flow_Item_Hover_Background:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Hover_Border_Color:var(--sapButton_Critical_Hover_Background);--fdMicro_Process_Flow_Item_Active_Background:var(--sapHighlightColor);--fdMicro_Process_Flow_Item_Active_Border_Color:var(--sapHighlightColor);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow .fd-micro-process-flow__item[dir=rtl],[dir=rtl] .fd-micro-process-flow .fd-micro-process-flow__item{padding-left:0;padding-right:.1875rem}.fd-micro-process-flow .fd-micro-process-flow__item .fd-status-indicator .fdstatus-indicator__svg{width:auto}.fd-micro-process-flow__focusable-item.is-focus,.fd-micro-process-flow__focusable-item:focus{outline-color:var(--sapContent_FocusColor);outline-offset:.0625rem;outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-micro-process-flow .fd-micro-process-flow__icon-container{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:var(--fdMicro_Process_Flow_Item_Background);border:0;border:.0625rem solid var(--fdMicro_Process_Flow_Item_Border_Color);border-radius:50%;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width);padding:0}.fd-micro-process-flow .fd-micro-process-flow__icon-container:after,.fd-micro-process-flow .fd-micro-process-flow__icon-container:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow .fd-micro-process-flow__icon-container .fd-micro-process-flow__icon{color:var(--fdMicro_Process_Flow_Icon_Color);font-size:var(--fdMicro_Process_Flow_Icon_Font_Size)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-hover,.fd-micro-process-flow .fd-micro-process-flow__icon-container:hover{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Hover_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Hover_Border_Color)}.fd-micro-process-flow .fd-micro-process-flow__icon-container.is-active,.fd-micro-process-flow .fd-micro-process-flow__icon-container:active{--fdMicro_Process_Flow_Item_Background:var(--fdMicro_Process_Flow_Item_Active_Background);--fdMicro_Process_Flow_Item_Border_Color:var(--fdMicro_Process_Flow_Item_Active_Border_Color);--fdMicro_Process_Flow_Icon_Color:var(--fdMicro_Process_Flow_Active_Icon_Color)}.fd-micro-process-flow__content{-webkit-box-sizing:border-box;-webkit-box-pack:start;-ms-flex-pack:start;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:flex-start;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--fdMicro_Process_Flow_Item_Min_Width);min-width:var(--fdMicro_Process_Flow_Item_Min_Width);padding:0;width:100%}.fd-micro-process-flow__content:after,.fd-micro-process-flow__content:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-flex:1;-ms-flex-positive:1;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-grow:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0 0 0 .1875rem;min-width:var(--fdMicro_Process_Flow_Connector_Width);padding:0;position:relative}.fd-micro-process-flow__connector:after,.fd-micro-process-flow__connector:before{box-sizing:inherit;font-size:inherit}.fd-micro-process-flow__connector[dir=rtl],[dir=rtl] .fd-micro-process-flow__connector{margin-left:0;margin-right:.1875rem}.fd-micro-process-flow__connector:before{border-bottom:.0625rem solid var(--sapContent_ForegroundBorderColor);content:\"\";display:block;position:absolute;width:100%;z-index:1}.fd-micro-process-flow__connector--intermediate:after{background:var(--sapNegativeElementColor);bottom:0;content:\"\";display:block;left:50%;margin-left:-.125rem;position:absolute;top:0;width:.25rem;z-index:2}.fd-micro-process-flow__connector .fd-micro-process-flow__intermediary-item{line-height:1;position:relative;z-index:3}.fd-micro-process-flow[class*=-compact],.fd-micro-process-flow[class*=-condensed],[class*=-compact] .fd-micro-process-flow:not([class*=-cozy]),[class*=-condensed] .fd-micro-process-flow:not([class*=-cozy]){--fdMicro_Process_Flow_Item_Min_Width:var(--fdMicro_Process_Flow_Compact_Item_Min_Width);--fdMicro_Process_Flow_Connector_Width:var(--fdMicro_Process_Flow_Compact_Connector_Width);--fdMicro_Process_Flow_Icon_Font_Size:var(--sapFontSmallSize);--fdMicro_Process_Flow_Item_Width:var(--fdMicro_Process_Flow_Compact_Item_Width);--fdMicro_Process_Flow_Max_Container_Width:var(--fdMicro_Process_Flow_Compact_Max_Container_Width)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-micro-process-flow', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'fd-micro-process-flow',
@@ -420,9 +420,9 @@ class MicroProcessFlowIconComponent {
         this.font = 'SAP-icons';
     }
 }
-MicroProcessFlowIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MicroProcessFlowIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: MicroProcessFlowIconComponent, selector: "fd-micro-process-flow-icon", inputs: { glyph: "glyph", font: "font", class: "class", ariaLabel: "ariaLabel" }, host: { classAttribute: "fd-micro-process-flow__icon-container" }, ngImport: i0, template: "<fd-icon\n    class=\"fd-micro-process-flow__icon\"\n    [ariaLabel]=\"ariaLabel\"\n    [glyph]=\"glyph\"\n    [class]=\"class\"\n    [font]=\"font\"\n></fd-icon>\n", dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowIconComponent, decorators: [{
+MicroProcessFlowIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+MicroProcessFlowIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MicroProcessFlowIconComponent, selector: "fd-micro-process-flow-icon", inputs: { glyph: "glyph", font: "font", class: "class", ariaLabel: "ariaLabel" }, host: { classAttribute: "fd-micro-process-flow__icon-container" }, ngImport: i0, template: "<fd-icon\n    class=\"fd-micro-process-flow__icon\"\n    [ariaLabel]=\"ariaLabel\"\n    [glyph]=\"glyph\"\n    [class]=\"class\"\n    [font]=\"font\"\n></fd-icon>\n", dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowIconComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-micro-process-flow-icon', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'fd-micro-process-flow__icon-container'
@@ -439,9 +439,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
 
 class MicroProcessFlowIntermediaryItemDirective {
 }
-MicroProcessFlowIntermediaryItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowIntermediaryItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-MicroProcessFlowIntermediaryItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.8", type: MicroProcessFlowIntermediaryItemDirective, selector: "[fdMicroProcessFlowIntermediaryItem], [fd-micro-process-flow-intermediary-item]", host: { classAttribute: "fd-micro-process-flow__intermediary-item" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowIntermediaryItemDirective, decorators: [{
+MicroProcessFlowIntermediaryItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowIntermediaryItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+MicroProcessFlowIntermediaryItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: MicroProcessFlowIntermediaryItemDirective, selector: "[fdMicroProcessFlowIntermediaryItem], [fd-micro-process-flow-intermediary-item]", host: { classAttribute: "fd-micro-process-flow__intermediary-item" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowIntermediaryItemDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[fdMicroProcessFlowIntermediaryItem], [fd-micro-process-flow-intermediary-item]',
@@ -457,14 +457,14 @@ class DeprecatedMicroProcessFlowContentDensityDirective extends DeprecatedCompac
         super('fd-micro-process-flow');
     }
 }
-DeprecatedMicroProcessFlowContentDensityDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: DeprecatedMicroProcessFlowContentDensityDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-DeprecatedMicroProcessFlowContentDensityDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.8", type: DeprecatedMicroProcessFlowContentDensityDirective, selector: "fd-micro-process-flow[compact]", providers: [
+DeprecatedMicroProcessFlowContentDensityDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: DeprecatedMicroProcessFlowContentDensityDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+DeprecatedMicroProcessFlowContentDensityDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: DeprecatedMicroProcessFlowContentDensityDirective, selector: "fd-micro-process-flow[compact]", providers: [
         {
             provide: CONTENT_DENSITY_DIRECTIVE,
             useExisting: forwardRef(() => DeprecatedMicroProcessFlowContentDensityDirective)
         }
     ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: DeprecatedMicroProcessFlowContentDensityDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: DeprecatedMicroProcessFlowContentDensityDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -480,8 +480,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
 
 class MicroProcessFlowModule {
 }
-MicroProcessFlowModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-MicroProcessFlowModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowModule, declarations: [MicroProcessFlowComponent,
+MicroProcessFlowModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+MicroProcessFlowModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowModule, declarations: [MicroProcessFlowComponent,
         MicroProcessFlowItemComponent,
         MicroProcessFlowIconComponent,
         MicroProcessFlowIntermediaryItemDirective,
@@ -493,8 +493,8 @@ MicroProcessFlowModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
         MicroProcessFlowFocusableItemDirective,
         ContentDensityModule,
         DeprecatedMicroProcessFlowContentDensityDirective] });
-MicroProcessFlowModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowModule, imports: [CommonModule, IconModule, ContentDensityModule, ContentDensityModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MicroProcessFlowModule, decorators: [{
+MicroProcessFlowModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowModule, imports: [CommonModule, IconModule, ContentDensityModule, ContentDensityModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MicroProcessFlowModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [

package/fesm2015/fundamental-ngx-core-multi-combobox.mjs

@@ -119,9 +119,9 @@ class MultiComboboxConfig {
         this.providers = new Map();
     }
 }
-MultiComboboxConfig.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-MultiComboboxConfig.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxConfig, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxConfig, decorators: [{
+MultiComboboxConfig.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+MultiComboboxConfig.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxConfig, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxConfig, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -504,9 +504,9 @@ class BaseMultiCombobox {
         this._cd.detectChanges();
     }
 }
-BaseMultiCombobox.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: BaseMultiCombobox, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-BaseMultiCombobox.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.8", type: BaseMultiCombobox, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: BaseMultiCombobox, decorators: [{
+BaseMultiCombobox.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: BaseMultiCombobox, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+BaseMultiCombobox.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: BaseMultiCombobox, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: BaseMultiCombobox, decorators: [{
             type: Directive
         }] });
 
@@ -575,9 +575,9 @@ class MobileMultiComboboxComponent extends MobileModeBase {
         this.dialogRef = this._dialogService.open(this.dialogTemplate, Object.assign(Object.assign({ mobile: true }, this.dialogConfig), { backdropClickCloseable: false, escKeyCloseable: false, container: this._elementRef.nativeElement, disablePaddings: true }));
     }
 }
-MobileMultiComboboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MobileMultiComboboxComponent, deps: [{ token: i0.ElementRef }, { token: i1.DialogService }, { token: MULTI_COMBOBOX_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MobileMultiComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: MobileMultiComboboxComponent, selector: "fd-mobile-multi-combobox", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\" [innerText]=\"mobileConfig.title\"></h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i3.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "component", type: i4.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i1$1.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.FdTranslatePipe, name: "fdTranslate" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MobileMultiComboboxComponent, decorators: [{
+MobileMultiComboboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MobileMultiComboboxComponent, deps: [{ token: i0.ElementRef }, { token: i1.DialogService }, { token: MULTI_COMBOBOX_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+MobileMultiComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MobileMultiComboboxComponent, selector: "fd-mobile-multi-combobox", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\" [innerText]=\"mobileConfig.title\"></h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i3.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "component", type: i3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "component", type: i4.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i1$1.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i6.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.FdTranslatePipe, name: "fdTranslate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MobileMultiComboboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-mobile-multi-combobox', template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\" [innerText]=\"mobileConfig.title\"></h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n" }]
         }], ctorParameters: function () {
@@ -597,10 +597,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
 
 class MobileMultiComboboxModule {
 }
-MobileMultiComboboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MobileMultiComboboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-MobileMultiComboboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: MobileMultiComboboxModule, declarations: [MobileMultiComboboxComponent], imports: [CommonModule, BarModule, DialogModule, ButtonModule, CommonModule, I18nModule], exports: [MobileMultiComboboxComponent] });
-MobileMultiComboboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MobileMultiComboboxModule, imports: [CommonModule, BarModule, DialogModule, ButtonModule, CommonModule, I18nModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MobileMultiComboboxModule, decorators: [{
+MobileMultiComboboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MobileMultiComboboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+MobileMultiComboboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: MobileMultiComboboxModule, declarations: [MobileMultiComboboxComponent], imports: [CommonModule, BarModule, DialogModule, ButtonModule, CommonModule, I18nModule], exports: [MobileMultiComboboxComponent] });
+MobileMultiComboboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MobileMultiComboboxModule, imports: [CommonModule, BarModule, DialogModule, ButtonModule, CommonModule, I18nModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MobileMultiComboboxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, BarModule, DialogModule, ButtonModule, CommonModule, I18nModule],
@@ -988,6 +988,7 @@ class MultiComboboxComponent extends BaseMultiCombobox {
      * @hidden
      */
     _onInputKeydownHandler(event) {
+        var _a;
         if (this._cva.readonly) {
             return;
         }
@@ -1017,14 +1018,8 @@ class MultiComboboxComponent extends BaseMultiCombobox {
         else if (!KeyUtil.isKeyCode(event, [...this._nonOpeningKeys, CONTROL])) {
             this._showList(true);
             const acceptedKeys = !KeyUtil.isKeyType(event, 'alphabetical') && !KeyUtil.isKeyType(event, 'numeric');
-            if (acceptedKeys) {
-                // SetTimeout is needed for input to receive new value.
-                setTimeout(() => {
-                    var _a;
-                    if (this.isEmptyValue) {
-                        (_a = this.listComponent) === null || _a === void 0 ? void 0 : _a.setItemActive(0);
-                    }
-                });
+            if (this.isEmptyValue && acceptedKeys) {
+                (_a = this.listComponent) === null || _a === void 0 ? void 0 : _a.setItemActive(0);
             }
         }
     }
@@ -1155,8 +1150,8 @@ class MultiComboboxComponent extends BaseMultiCombobox {
         });
     }
 }
-MultiComboboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxComponent, deps: [{ token: i0.Injector }, { token: i0.ViewContainerRef }, { token: i1$1.DynamicComponentService }], target: i0.ɵɵFactoryTarget.Component });
-MultiComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: MultiComboboxComponent, selector: "fd-multi-combobox", inputs: { selectedItems: "selectedItems", maxHeight: "maxHeight", buttonFocusable: "buttonFocusable", autoComplete: "autoComplete", entityClass: "entityClass", mobile: "mobile", mobileConfig: "mobileConfig", group: "group", groupKey: "groupKey", secondaryKey: "secondaryKey", showSecondaryText: "showSecondaryText", secondaryTextAlignment: "secondaryTextAlignment", autoResize: "autoResize", openDropdownOnAddOnClicked: "openDropdownOnAddOnClicked", value: "value", fillControlMode: "fillControlMode", addonIconTitle: "addonIconTitle", invalidEntryMessage: "invalidEntryMessage", limitless: "limitless", lookupKey: "lookupKey", displayKey: "displayKey", list: "list", invalidEntryDisplayTime: "invalidEntryDisplayTime" }, outputs: { selectionChange: "selectionChange", isOpenChange: "isOpenChange", addOnButtonClicked: "addOnButtonClicked", dataRequested: "dataRequested", dataReceived: "dataReceived" }, providers: [
+MultiComboboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxComponent, deps: [{ token: i0.Injector }, { token: i0.ViewContainerRef }, { token: i1$1.DynamicComponentService }], target: i0.ɵɵFactoryTarget.Component });
+MultiComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MultiComboboxComponent, selector: "fd-multi-combobox", inputs: { selectedItems: "selectedItems", maxHeight: "maxHeight", buttonFocusable: "buttonFocusable", autoComplete: "autoComplete", entityClass: "entityClass", mobile: "mobile", mobileConfig: "mobileConfig", group: "group", groupKey: "groupKey", secondaryKey: "secondaryKey", showSecondaryText: "showSecondaryText", secondaryTextAlignment: "secondaryTextAlignment", autoResize: "autoResize", openDropdownOnAddOnClicked: "openDropdownOnAddOnClicked", value: "value", fillControlMode: "fillControlMode", addonIconTitle: "addonIconTitle", invalidEntryMessage: "invalidEntryMessage", limitless: "limitless", lookupKey: "lookupKey", displayKey: "displayKey", list: "list", invalidEntryDisplayTime: "invalidEntryDisplayTime" }, outputs: { selectionChange: "selectionChange", isOpenChange: "isOpenChange", addOnButtonClicked: "addOnButtonClicked", dataRequested: "dataRequested", dataReceived: "dataReceived" }, providers: [
         CvaControl,
         contentDensityObserverProviders(),
         {
@@ -1169,7 +1164,7 @@ MultiComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
         },
         DestroyedService
     ], queries: [{ propertyName: "customTemplates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "listComponent", first: true, predicate: FD_LIST_COMPONENT, descendants: true }, { propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true, read: ElementRef }, { propertyName: "mobileControlTemplate", first: true, predicate: ["mobileControlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_tokenizer", first: true, predicate: TokenizerComponent, descendants: true }, { propertyName: "_inputGroup", first: true, predicate: ["inputGroup"], descendants: true, read: ElementRef }], usesInheritance: true, hostDirectives: [{ directive: i2$1.CvaDirective, inputs: ["id", "inputId", "placeholder", "placeholder", "state", "state", "stateMessage", "stateMessage", "disabled", "disabled", "readonly", "readonly", "name", "name"] }, { directive: i3$1.DataSourceDirective, inputs: ["dataSource", "dataSource"], outputs: ["dataChanged", "dataChanged"] }], ngImport: i0, template: "<div class=\"fd-multi-combobox\">\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\" *ngIf=\"mobile\"></ng-container>\n\n    <fd-popover\n        *ngIf=\"!mobile\"\n        additionalBodyClass=\"fd-popover-custom-list fd-multi-combobox__list-container\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [isOpen]=\"isOpen\"\n        [triggers]=\"[]\"\n        [disabled]=\"this._cva.disabled\"\n        [fillControlMode]=\"fillControlMode\"\n    >\n        <fd-popover-control>\n            <ng-container>\n                <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n            </ng-container>\n        </fd-popover-control>\n        <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            #inputGroup\n            [id]=\"this._cva.id + '-input-group-container'\"\n            [state]=\"this._cva.state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!this._cva.readonly\"\n            [glyph]=\"!this._cva.readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"this._cva.disabled || this._cva.readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"this._cva.disabled || this._cva.readonly\"\n            [attr.aria-readonly]=\"this._cva.readonly\"\n            [glyphAriaLabel]=\"this._cva.ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && _onPrimaryButtonClick(false)\"\n            (keydown)=\"_navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                *ngIf=\"_selectedSuggestions\"\n                [tokenizerFocusable]=\"false\"\n                [compactCollapse]=\"true\"\n                #tokenizer\n                class=\"fd-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"_moreClicked()\"\n            >\n                <fd-token\n                    [readOnly]=\"this._cva.disabled\"\n                    (onCloseClick)=\"_removeToken(token, $event)\"\n                    *ngFor=\"let token of _selectedSuggestions\"\n                >\n                    {{ token.label }}\n                </fd-token>\n\n                <input\n                    #searchInputElement\n                    fdkAutoComplete\n                    (onComplete)=\"_onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [attr.aria-label]=\"this._cva.ariaLabel\"\n                    [attr.aria-labelledby]=\"this._cva.ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? this._cva.id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"this._cva.id\"\n                    [name]=\"this._cva.name\"\n                    (keydown)=\"_onInputKeydownHandler($event)\"\n                    [disabled]=\"this._cva.disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"_searchTermChanged()\"\n                    [placeholder]=\"this._cva.placeholder\"\n                    (focus)=\"this._cva.onTouched(); tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && _onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"this._cva.readonly\"\n                    [attr.aria-readonly]=\"this._cva.readonly\"\n                    [attr.aria-required]=\"this._cva.required\"\n                    [displayFn]=\"_displayFn\"\n                    class=\"fd-tokenizer__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n\n        <fd-form-message\n            *ngIf=\"mobile && isOpen ? false : !!this._cva.stateMessage\"\n            [type]=\"this._cva.state\"\n            [innerHtml]=\"this._cva.stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"this._cva.id + '-input-group-container'\"\n        class=\"fd-multi-combobox-input-group-custom\"\n        [state]=\"this._cva.state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"this._cva.disabled || this._cva.readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"this._cva.disabled || this._cva.readonly\"\n        [attr.aria-readonly]=\"this._cva.readonly\"\n        [glyphAriaLabel]=\"this._cva.ariaLabel\"\n    >\n        <input\n            fdkAutoComplete\n            (onComplete)=\"_onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [attr.aria-label]=\"this._cva.ariaLabel\"\n            [attr.aria-labelledby]=\"this._cva.ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? this._cva.id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"this._cva.id\"\n            [name]=\"this._cva.name\"\n            (keydown)=\"_onInputKeydownHandler($event)\"\n            [disabled]=\"this._cva.disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"_searchTermChanged()\"\n            [placeholder]=\"this._cva.placeholder\"\n            (focus)=\"this._cva.onTouched()\"\n            (blur)=\"!mobile && _onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"this._cva.readonly\"\n            [attr.aria-readonly]=\"this._cva.readonly\"\n            [displayFn]=\"_displayFn\"\n        />\n    </fd-input-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        (focusEscapeList)=\"_handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fd-multi-combobox__list fd-list--multi-input\"\n        [id]=\"this._cva.id + '-result'\"\n        role=\"listbox\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.minWidth]=\"!mobile && minWidth + 'px'\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        [attr.aria-labelledby]=\"this._cva.id + '-search'\"\n        aria-multiselectable=\"true\"\n    >\n        <fd-form-message\n            *ngIf=\"!!this._cva.stateMessage\"\n            [type]=\"this._cva.state\"\n            [innerHtml]=\"this._cva.stateMessage\"\n        ></fd-form-message>\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <label fd-list-item fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && close()\"\n                    (keyDown)=\"_onItemKeyDownHandler($event, i)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"_onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"_toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (click)=\"!mobile && _onOptionClicked($event, i)\"\n                (keyDown)=\"_onItemKeyDownHandler($event, i)\"\n                [selected]=\"!!optionItem.selected\"\n            >\n                <fd-checkbox\n                    (click)=\"_onOptionCheckboxClicked($event, i)\"\n                    (ngModelChange)=\"_toggleSelection(optionItem)\"\n                    [ngModel]=\"optionItem.selected\"\n                >\n                </fd-checkbox>\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"optionItem.selected && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(optionItem.selected && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight : inputText\"\n        ></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-margin--tiny{margin:.5rem!important}.fd-margin--sm{margin:1rem!important}.fd-margin--md{margin:2rem!important}.fd-margin--lg{margin:3rem!important}.fd-margin--none{margin:0!important}.fd-margin-top--tiny{margin-top:.5rem!important}.fd-margin-top--sm{margin-top:1rem!important}.fd-margin-top--md{margin-top:2rem!important}.fd-margin-top--lg{margin-top:3rem!important}.fd-margin-top--none{margin-top:0!important}.fd-margin-end--tiny{margin-right:.5rem!important}.fd-margin-end--tiny[dir=rtl],[dir=rtl] .fd-margin-end--tiny{margin-left:.5rem!important;margin-right:0!important}.fd-margin-end--sm{margin-right:1rem!important}.fd-margin-end--sm[dir=rtl],[dir=rtl] .fd-margin-end--sm{margin-left:1rem!important;margin-right:0!important}.fd-margin-end--md{margin-right:2rem!important}.fd-margin-end--md[dir=rtl],[dir=rtl] .fd-margin-end--md{margin-left:2rem!important;margin-right:0!important}.fd-margin-end--lg{margin-right:3rem!important}.fd-margin-end--lg[dir=rtl],[dir=rtl] .fd-margin-end--lg{margin-left:3rem!important;margin-right:0!important}.fd-margin-end--none{margin-right:0}.fd-margin-end--none[dir=rtl],[dir=rtl] .fd-margin-end--none{margin-left:0!important}.fd-margin-bottom--tiny{margin-bottom:.5rem!important}.fd-margin-bottom--sm{margin-bottom:1rem!important}.fd-margin-bottom--md{margin-bottom:2rem!important}.fd-margin-bottom--lg{margin-bottom:3rem!important}.fd-margin-bottom--none{margin-bottom:0!important}.fd-margin-begin--tiny{margin-left:.5rem!important}.fd-margin-begin--tiny[dir=rtl],[dir=rtl] .fd-margin-begin--tiny{margin-left:0!important;margin-right:.5rem!important}.fd-margin-begin--sm{margin-left:1rem!important}.fd-margin-begin--sm[dir=rtl],[dir=rtl] .fd-margin-begin--sm{margin-left:0!important;margin-right:1rem!important}.fd-margin-begin--md{margin-left:2rem!important}.fd-margin-begin--md[dir=rtl],[dir=rtl] .fd-margin-begin--md{margin-left:0!important;margin-right:2rem!important}.fd-margin-begin--lg{margin-left:3rem!important}.fd-margin-begin--lg[dir=rtl],[dir=rtl] .fd-margin-begin--lg{margin-left:0!important;margin-right:3rem!important}.fd-margin-begin--none{margin-left:0}.fd-margin-begin--none[dir=rtl],[dir=rtl] .fd-margin-begin--none{margin-right:0!important}.fd-margin-top-bottom--tiny{margin-bottom:.5rem!important;margin-top:.5rem!important}.fd-margin-top-bottom--sm{margin-bottom:1rem!important;margin-top:1rem!important}.fd-margin-top-bottom--md{margin-bottom:2rem!important;margin-top:2rem!important}.fd-margin-top-bottom--lg{margin-bottom:3rem!important;margin-top:3rem!important}.fd-margin-begin-end--tiny{margin-left:.5rem!important;margin-right:.5rem!important}.fd-margin-begin-end--sm{margin-left:1rem!important;margin-right:1rem!important}.fd-margin-begin-end--md{margin-left:2rem!important;margin-right:2rem!important}.fd-margin-begin-end--lg{margin-left:3rem!important;margin-right:3rem!important}.fd-margin-responsive--sm{margin:0 0 1rem!important}.fd-margin-responsive--md{margin:1rem!important}.fd-margin-responsive--lg{margin:1rem 2rem!important}.fd-margin-responsive--xl{margin:1rem 3rem!important}.fd-margin-negative-begin-end--tiny{margin:0 -.5rem!important}.fd-margin-negative-begin-end--sm{margin:0 -1rem!important}.fd-margin-negative-begin-end--md{margin:0 -2rem!important}.fd-margin-negative-begin-end--lg{margin:0 -3rem!important}.fd-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}[class*=--compact] .fd-multi-combobox-tokenizer-custom:not([class*=\"--cozy\"]):not([class*=\"--condensed\"]),.is-compact .fd-multi-combobox-tokenizer-custom:not(.is-cozy):not(.is-condensed),.fd-multi-combobox-tokenizer-custom[class*=--compact],.fd-multi-combobox-tokenizer-custom.is-compact{width:calc(100% - 2rem)}.fd-multi-combobox-input-group-custom{display:inline-block}.fd-multi-combobox .fd-popover-custom{display:block}.fd-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fd-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fd-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}.fd-multi-combobox__list-container fd-form-message{max-width:100%;border-radius:0!important}.fd-dialog__body fd-form-message{display:block;max-width:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i5.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i5.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i6$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7$1.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i7$1.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i8.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i8.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "component", type: i9.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i9.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "component", type: i9.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i9.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: i10.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i10.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i10.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i10.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i10.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "directive", type: i11.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i11.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.AutoCompleteDirective, selector: "[fdkAutoComplete], [fdAutoComplete], [fd-auto-complete]", inputs: ["options", "inputText", "enable", "displayFn"], outputs: ["onComplete"] }, { kind: "pipe", type: i7.FdTranslatePipe, name: "fdTranslate" }, { kind: "pipe", type: i1$1.SearchHighlightPipe, name: "highlight" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-multi-combobox', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
                         {
@@ -1282,8 +1277,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImpor
 
 class MultiComboboxModule {
 }
-MultiComboboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-MultiComboboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxModule, declarations: [MultiComboboxComponent], imports: [CommonModule,
+MultiComboboxModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+MultiComboboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxModule, declarations: [MultiComboboxComponent], imports: [CommonModule,
         I18nModule,
         PopoverModule,
         CheckboxModule,
@@ -1295,7 +1290,7 @@ MultiComboboxModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ver
         PipeModule,
         AutoCompleteModule,
         ContentDensityModule], exports: [MultiComboboxComponent] });
-MultiComboboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxModule, providers: [DynamicComponentService], imports: [CommonModule,
+MultiComboboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxModule, providers: [DynamicComponentService], imports: [CommonModule,
         I18nModule,
         PopoverModule,
         CheckboxModule,
@@ -1307,7 +1302,7 @@ MultiComboboxModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", ver
         PipeModule,
         AutoCompleteModule,
         ContentDensityModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: MultiComboboxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MultiComboboxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [