@fundamental-ngx/platform 0.47.3 → 0.47.4-rc.0

package/fesm2022/fundamental-ngx-platform-form.mjs

@@ -25,10 +25,10 @@ import { FocusKeyManager } from '@angular/cdk/a11y';
 import { DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW, DELETE, BACKSPACE, ENTER, ESCAPE, CONTROL, TAB, SHIFT, ALT, NUMPAD_ZERO, NUMPAD_ONE, NUMPAD_TWO, NUMPAD_THREE, NUMPAD_FOUR, NUMPAD_FIVE, NUMPAD_SIX, NUMPAD_SEVEN, NUMPAD_EIGHT, NUMPAD_NINE, A, SPACE, PAGE_UP, PAGE_DOWN } from '@angular/cdk/keycodes';
 import { RadioButtonComponent as RadioButtonComponent$1 } from '@fundamental-ngx/core/radio';
 import { FdTranslatePipe } from '@fundamental-ngx/i18n';
-import * as i4 from '@fundamental-ngx/core/select';
-import { SelectModule, SelectComponent as SelectComponent$1 } from '@fundamental-ngx/core/select';
 import * as i6$1 from '@fundamental-ngx/core/list';
 import { ListComponent, ListSecondaryDirective, ListModule } from '@fundamental-ngx/core/list';
+import * as i4 from '@fundamental-ngx/core/select';
+import { SelectComponent as SelectComponent$1, SelectModule } from '@fundamental-ngx/core/select';
 import '@fundamental-ngx/core/calendar';
 import * as i2 from '@fundamental-ngx/core/datetime';
 import { DATE_TIME_FORMATS } from '@fundamental-ngx/core/datetime';
@@ -1375,7 +1375,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
 /** Change event object emitted by Platform Checkbox. */
 class PlatformCheckboxChange {
 }
-let nextUniqueId$2 = 0;
+let nextUniqueId$1 = 0;
 class CheckboxComponent extends BaseInput {
     // this is undesired to have "checked" input instead of "value"
     // but it was done this way initially and we have to keep this in order to not break anything
@@ -1408,7 +1408,7 @@ class CheckboxComponent extends BaseInput {
         this.checkedChange = new EventEmitter();
         // necessary to fulfill baseInput check.
         // case: fdp-checkbox passed in declarative fdp-checkbox-group without id and name.
-        this.name = `fdp-checkbox-${nextUniqueId$2++}`;
+        this.name = `fdp-checkbox-${nextUniqueId$1++}`;
         this.tabIndexValue = tabIndexValue;
     }
     /** update controller on checkbox state change */
@@ -1822,7 +1822,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
  * documents.
  */
 // Increasing integer for generating unique ids for radio components.
-let nextUniqueId$1 = 0;
+let nextUniqueId = 0;
 class RadioGroupComponent extends InLineLayoutCollectionBaseInput {
     /** Value of selected radio button */
     // eslint-disable-next-line @angular-eslint/no-input-rename
@@ -1857,7 +1857,7 @@ class RadioGroupComponent extends InLineLayoutCollectionBaseInput {
         this._selected = null;
         /** @hidden */
         this._destroy$ = new Subject();
-        this.id = `radio-group-${nextUniqueId$1++}`;
+        this.id = `radio-group-${nextUniqueId++}`;
     }
     /** Control Value Accessor */
     writeValue(value) {
@@ -2468,39 +2468,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
             args: [{ selector: 'fdp-dynamic-form-generator-editor', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], standalone: true, imports: [FormsModule, ReactiveFormsModule, TextAreaComponent], template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-textarea [id]=\"id\" [placeholder]=\"placeholder\" [name]=\"name\" [formControlName]=\"name\"></fdp-textarea>\n    </ng-container>\n</ng-container>\n" }]
         }], ctorParameters: function () { return []; } });
 
-// Increasing integer for generating unique ids for radio components.
-let nextUniqueId = 0;
-/**
- * Used to represent an option of the select component.
- */
-class OptionComponent {
-    constructor() {
-        /** Option id attribute */
-        this.id = `fdp-option-${nextUniqueId++}`;
-        /** Whether to disable this option specifically. */
-        this.disabled = false;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: OptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.7", type: OptionComponent, isStandalone: true, selector: "fdp-option", inputs: { id: "id", value: "value", disabled: "disabled" }, ngImport: i0, template: `<li fd-option [id]="id" [value]="value" [disabled]="disabled"><ng-content></ng-content></li>`, isInline: true, dependencies: [{ kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: OptionComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'fdp-option',
-                    template: `<li fd-option [id]="id" [value]="value" [disabled]="disabled"><ng-content></ng-content></li>`,
-                    encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    standalone: true,
-                    imports: [SelectModule]
-                }]
-        }], propDecorators: { id: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }] } });
-
 /**
  * Default options for Combobox
  */
@@ -2608,6 +2575,12 @@ class BaseSelect extends CollectionBaseInput {
         this.noWrapText = false;
         /** Turns on/off Adjustable Width feature */
         this.autoResize = false;
+        /**
+         * Action to perform when user shifts focus from the dropdown.
+         * - `close` will close the dropdown preserving previously selected value.
+         * - `closeAndSelect` will close the dropdown and select last focused dropdown item.
+         */
+        this.tabOutStrategy = 'close';
         /** Event emitted when item is selected. */
         this.selectionChange = new EventEmitter();
         /** @hidden */
@@ -2803,7 +2776,7 @@ class BaseSelect extends CollectionBaseInput {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: BaseSelect, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: SelectConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.7", type: BaseSelect, inputs: { maxHeight: "maxHeight", mobile: "mobile", group: "group", groupKey: "groupKey", secondaryKey: "secondaryKey", showSecondaryText: "showSecondaryText", glyph: "glyph", appendTo: "appendTo", triggerValue: "triggerValue", fillControlMode: "fillControlMode", secondaryTextAlignment: "secondaryTextAlignment", width: "width", readonly: "readonly", placeholder: "placeholder", closeOnOutsideClick: "closeOnOutsideClick", controlTemplate: "controlTemplate", ariaLabelledBy: "ariaLabelledBy", ariaLabel: "ariaLabel", mobileConfig: "mobileConfig", noValueLabel: "noValueLabel", noWrapText: "noWrapText", autoResize: "autoResize", firstColumnRatio: "firstColumnRatio", secondColumnRatio: "secondColumnRatio", minWidth: "minWidth", maxWidth: "maxWidth", list: "list" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "customTemplates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.7", type: BaseSelect, inputs: { maxHeight: "maxHeight", mobile: "mobile", group: "group", groupKey: "groupKey", secondaryKey: "secondaryKey", showSecondaryText: "showSecondaryText", glyph: "glyph", appendTo: "appendTo", triggerValue: "triggerValue", fillControlMode: "fillControlMode", secondaryTextAlignment: "secondaryTextAlignment", width: "width", readonly: "readonly", placeholder: "placeholder", closeOnOutsideClick: "closeOnOutsideClick", controlTemplate: "controlTemplate", ariaLabelledBy: "ariaLabelledBy", ariaLabel: "ariaLabel", mobileConfig: "mobileConfig", noValueLabel: "noValueLabel", noWrapText: "noWrapText", autoResize: "autoResize", firstColumnRatio: "firstColumnRatio", secondColumnRatio: "secondColumnRatio", minWidth: "minWidth", maxWidth: "maxWidth", tabOutStrategy: "tabOutStrategy", list: "list" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "customTemplates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }], usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: BaseSelect, decorators: [{
             type: Directive
@@ -2889,6 +2862,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
                 type: Input
             }], maxWidth: [{
                 type: Input
+            }], tabOutStrategy: [{
+                type: Input
             }], list: [{
                 type: Input
             }], selectionChange: [{
@@ -2997,11 +2972,11 @@ class SelectComponent extends BaseSelect {
         element.setAttribute('style', 'width: ' + proportion + '%; max-width: ' + proportion + '%');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: SelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i3.DynamicComponentService }, { token: SelectConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.7", type: SelectComponent, isStandalone: true, selector: "fdp-select", inputs: { value: "value", inline: "inline" }, providers: [DynamicComponentService, { provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], viewQueries: [{ propertyName: "select", first: true, predicate: SelectComponent$1, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [advancedStateMessage]=\"advancedStateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($event)\"\n    (isOpenChange)=\"_onOpenChange($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\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 [innerHTML]=\"optionItem.label\"></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                [innerHTML]=\"optionItem.secondaryText\"\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.32.0\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-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-readonly=true][aria-selected=false] .fd-select__text-content,.fd-select__control[readonly][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control.is-disabled[aria-selected=false] .fd-select__text-content,.fd-select__control:disabled[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-disabled=true][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"], dependencies: [{ kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i4.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.7", type: SelectComponent, isStandalone: true, selector: "fdp-select", inputs: { value: "value", inline: "inline" }, providers: [DynamicComponentService, { provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], viewQueries: [{ propertyName: "select", first: true, predicate: SelectComponent$1, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [advancedStateMessage]=\"advancedStateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    [tabOutStrategy]=\"tabOutStrategy\"\n    (valueChange)=\"_onSelection($event)\"\n    (isOpenChange)=\"_onOpenChange($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\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 [innerHTML]=\"optionItem.label\"></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                [innerHTML]=\"optionItem.secondaryText\"\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.32.0\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-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-readonly=true][aria-selected=false] .fd-select__text-content,.fd-select__control[readonly][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control.is-disabled[aria-selected=false] .fd-select__text-content,.fd-select__control:disabled[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-disabled=true][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"], dependencies: [{ kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "tabOutStrategy", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i4.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-select', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [DynamicComponentService, { provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], standalone: true, imports: [SelectModule, FormsModule, NgIf, NgFor, IconComponent, NgTemplateOutlet, NgClass, ListSecondaryDirective], template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [advancedStateMessage]=\"advancedStateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($event)\"\n    (isOpenChange)=\"_onOpenChange($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\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 [innerHTML]=\"optionItem.label\"></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                [innerHTML]=\"optionItem.secondaryText\"\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.32.0\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-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-readonly=true][aria-selected=false] .fd-select__text-content,.fd-select__control[readonly][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control.is-disabled[aria-selected=false] .fd-select__text-content,.fd-select__control:disabled[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-disabled=true][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"] }]
+            args: [{ selector: 'fdp-select', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [DynamicComponentService, { provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], standalone: true, imports: [SelectModule, FormsModule, NgIf, NgFor, IconComponent, NgTemplateOutlet, NgClass, ListSecondaryDirective], template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [advancedStateMessage]=\"advancedStateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    [tabOutStrategy]=\"tabOutStrategy\"\n    (valueChange)=\"_onSelection($event)\"\n    (isOpenChange)=\"_onOpenChange($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\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 [innerHTML]=\"optionItem.label\"></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                [innerHTML]=\"optionItem.secondaryText\"\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.32.0\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-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color);opacity:0}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-readonly=true][aria-selected=false] .fd-select__text-content,.fd-select__control[readonly][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control.is-disabled[aria-selected=false] .fd-select__text-content,.fd-select__control:disabled[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-disabled=true][aria-selected=false] .fd-select__text-content{visibility:hidden}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -3051,7 +3026,7 @@ class DynamicFormGeneratorSelectComponent extends BaseDynamicFormGeneratorContro
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: DynamicFormGeneratorSelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-dynamic-form-generator-select', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], standalone: true, imports: [FormsModule, ReactiveFormsModule, SelectComponent, OptionComponent], template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-select\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [inline]=\"formItem.guiOptions?.inline !== false\"\n            [name]=\"name\"\n            [list]=\"formItem.choices\"\n            [formControlName]=\"name\"\n            [secondaryKey]=\"formItem.secondaryKey\"\n            [showSecondaryText]=\"formItem.showSecondaryText ? formItem.showSecondaryText : false\"\n            [secondaryTextAlignment]=\"formItem.secondaryTextAlignment ? formItem.secondaryTextAlignment : 'right'\"\n            [controlTemplate]=\"formItem.controlTemplate\"\n        ></fdp-select>\n    </ng-container>\n</ng-container>\n" }]
+            args: [{ selector: 'fdp-dynamic-form-generator-select', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], standalone: true, imports: [FormsModule, ReactiveFormsModule, SelectComponent], template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-select\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [inline]=\"formItem.guiOptions?.inline !== false\"\n            [name]=\"name\"\n            [list]=\"formItem.choices\"\n            [formControlName]=\"name\"\n            [secondaryKey]=\"formItem.secondaryKey\"\n            [showSecondaryText]=\"formItem.showSecondaryText ? formItem.showSecondaryText : false\"\n            [secondaryTextAlignment]=\"formItem.secondaryTextAlignment ? formItem.secondaryTextAlignment : 'right'\"\n            [controlTemplate]=\"formItem.controlTemplate\"\n        ></fdp-select>\n    </ng-container>\n</ng-container>\n" }]
         }], ctorParameters: function () { return []; } });
 
 /**
@@ -6686,6 +6661,12 @@ class BaseCombobox extends CollectionBaseInput {
         this.closeOnOutsideClick = true;
         /** Whether list item options should be rendered as byline. */
         this.byline = false;
+        /**
+         * Action to perform when user shifts focus from the dropdown.
+         * - `close` will close the dropdown preserving previously selected value.
+         * - `closeAndSelect` will close the dropdown and select last focused dropdown item.
+         */
+        this.tabOutStrategy = 'closeAndSelect';
         /** Event emitted when data loading is started. */
         // eslint-disable-next-line @angular-eslint/no-output-on-prefix
         this.onDataRequested = new EventEmitter();
@@ -6910,6 +6891,13 @@ class BaseCombobox extends CollectionBaseInput {
     }
     /** @hidden */
     _close() {
+        if (this.tabOutStrategy === 'closeAndSelect') {
+            const focusedItem = this.listComponent.getActiveItem();
+            if (focusedItem) {
+                this.handleOptionItem(focusedItem.value);
+                return;
+            }
+        }
         this.inputText = this.value ? this.inputText : '';
         this.searchInputElement.nativeElement.focus();
         this.isOpenChangeHandle(false);
@@ -7164,7 +7152,7 @@ class BaseCombobox extends CollectionBaseInput {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: BaseCombobox, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i1$2.DialogConfig, optional: true }, { token: ComboboxConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.7", type: BaseCombobox, inputs: { maxHeight: "maxHeight", autoComplete: "autoComplete", entityClass: "entityClass", mobile: "mobile", mobileConfig: "mobileConfig", group: "group", groupKey: "groupKey", secondaryKey: "secondaryKey", showSecondaryText: "showSecondaryText", secondaryTextAlignment: "secondaryTextAlignment", autoResize: "autoResize", fillControlMode: "fillControlMode", buttonFocusable: "buttonFocusable", triggers: "triggers", closeOnOutsideClick: "closeOnOutsideClick", byline: "byline", dataSource: "dataSource", value: "value" }, outputs: { onDataRequested: "onDataRequested", onDataReceived: "onDataReceived" }, queries: [{ propertyName: "_customTemplates", predicate: TemplateDirective }, { propertyName: "_customItemDef", predicate: FDP_COMBOBOX_ITEM_DEF }], viewQueries: [{ propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.7", type: BaseCombobox, inputs: { maxHeight: "maxHeight", autoComplete: "autoComplete", entityClass: "entityClass", mobile: "mobile", mobileConfig: "mobileConfig", group: "group", groupKey: "groupKey", secondaryKey: "secondaryKey", showSecondaryText: "showSecondaryText", secondaryTextAlignment: "secondaryTextAlignment", autoResize: "autoResize", fillControlMode: "fillControlMode", buttonFocusable: "buttonFocusable", triggers: "triggers", closeOnOutsideClick: "closeOnOutsideClick", byline: "byline", dataSource: "dataSource", value: "value", tabOutStrategy: "tabOutStrategy" }, outputs: { onDataRequested: "onDataRequested", onDataReceived: "onDataReceived" }, queries: [{ propertyName: "_customTemplates", predicate: TemplateDirective }, { propertyName: "_customItemDef", predicate: FDP_COMBOBOX_ITEM_DEF }], viewQueries: [{ propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }], usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: BaseCombobox, decorators: [{
             type: Directive
@@ -7236,6 +7224,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
                 type: Input
             }], value: [{
                 type: Input
+            }], tabOutStrategy: [{
+                type: Input
             }], onDataRequested: [{
                 type: Output
             }], onDataReceived: [{
@@ -7410,7 +7400,7 @@ class ComboboxComponent extends BaseCombobox {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.7", type: ComboboxComponent, isStandalone: true, selector: "fdp-combobox", outputs: { selectionChange: "selectionChange" }, providers: [
             { provide: FD_FORM_FIELD_CONTROL, useExisting: ComboboxComponent, multi: true },
             contentDensityObserverProviders()
-        ], viewQueries: [{ propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        (keydown.tab)=\"_close()\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate; else customGroupItemTemplateRenderer\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-template #customGroupItemTemplateRenderer>\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                </ng-template>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                >\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                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n            >\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=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && 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; else customOptinItemTemplateRenderer\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-template #customOptinItemTemplateRenderer>\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    </ng-template>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate; else customSecondaryItemTemplateRenderer\">\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-template #customSecondaryItemTemplateRenderer>\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        </ng-template>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i6.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "ngmodule", type: ListModule }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i6$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        (keydown.tab)=\"_close()\"\n        (keydown.shift.tab)=\"_close()\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate; else customGroupItemTemplateRenderer\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-template #customGroupItemTemplateRenderer>\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                </ng-template>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                    [value]=\"optionItem\"\n                >\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                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n                [value]=\"optionItem\"\n            >\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=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && 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; else customOptinItemTemplateRenderer\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-template #customOptinItemTemplateRenderer>\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    </ng-template>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate; else customSecondaryItemTemplateRenderer\">\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-template #customSecondaryItemTemplateRenderer>\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        </ng-template>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i6.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "ngmodule", type: ListModule }, { kind: "component", type: i6$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i6$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i6$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i6$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i6$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: ComboboxComponent, decorators: [{
             type: Component,
@@ -7435,7 +7425,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
                         SearchHighlightPipe,
                         FdTranslatePipe,
                         ContentDensityModule
-                    ], template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        (keydown.tab)=\"_close()\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate; else customGroupItemTemplateRenderer\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-template #customGroupItemTemplateRenderer>\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                </ng-template>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                >\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                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n            >\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=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && 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; else customOptinItemTemplateRenderer\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-template #customOptinItemTemplateRenderer>\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    </ng-template>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate; else customSecondaryItemTemplateRenderer\">\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-template #customSecondaryItemTemplateRenderer>\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        </ng-template>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"] }]
+                    ], template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        (keydown.tab)=\"_close()\"\n        (keydown.shift.tab)=\"_close()\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate; else customGroupItemTemplateRenderer\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-template #customGroupItemTemplateRenderer>\n                    <ng-template\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-template>\n                </ng-template>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                    [value]=\"optionItem\"\n                >\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                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n                [value]=\"optionItem\"\n            >\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=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && 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; else customOptinItemTemplateRenderer\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-template #customOptinItemTemplateRenderer>\n        <ng-template\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-template>\n    </ng-template>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate; else customSecondaryItemTemplateRenderer\">\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-template #customSecondaryItemTemplateRenderer>\n            <ng-template\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-template>\n        </ng-template>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -10403,14 +10393,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
 
 class PlatformSelectModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: PlatformSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.7", ngImport: i0, type: PlatformSelectModule, imports: [SelectComponent, OptionComponent], exports: [SelectComponent, OptionComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: PlatformSelectModule, imports: [SelectComponent, OptionComponent] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.7", ngImport: i0, type: PlatformSelectModule, imports: [SelectComponent], exports: [SelectComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: PlatformSelectModule, imports: [SelectComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: PlatformSelectModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [SelectComponent, OptionComponent],
-                    exports: [SelectComponent, OptionComponent]
+                    imports: [SelectComponent],
+                    exports: [SelectComponent]
                 }]
         }] });
 
@@ -11436,5 +11426,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AutoCompleteDirective, BaseCombobox, BaseDynamicFormGeneratorControl, BaseMultiCombobox, BaseMultiInput, BaseSelect, COMBOBOX_COMPONENT, CSS_CLASS_NAME, CheckboxComponent, CheckboxGroupComponent, ComboboxComponent, ComboboxConfig, ComboboxItemDirective, ComboboxItemGroupDirective, ComboboxMobileComponent, ComboboxSecondaryItemDirective, ComboboxSelectedItemDirective, ComboboxSelectionChangeEvent, DEFAULT_COMPONENTS_LIST, DEFAULT_VALIDATION_ERRORS, DefaultGapLayout, DefaultHorizontalFieldLayout, DefaultHorizontalLabelLayout, DefaultVerticalFieldLayout, DefaultVerticalLabelLayout, DynamicFormControl, DynamicFormControlDirective, DynamicFormControlFieldDirective, DynamicFormControlGroup, DynamicFormGeneratorCheckboxComponent, DynamicFormGeneratorDatepickerComponent, DynamicFormGeneratorEditorComponent, DynamicFormGeneratorInputComponent, DynamicFormGeneratorMultiInputComponent, DynamicFormGeneratorObjectStatusComponent, DynamicFormGeneratorRadioComponent, DynamicFormGeneratorSelectComponent, DynamicFormGeneratorSwitchComponent, FDP_COMBOBOX_ITEM_DEF, FDP_FORM_ERROR_DIRECTIVE, FDP_FORM_FIELD_HINT_LAYOUT_CONFIG, FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT, FDP_FORM_GENERATOR_DEFAULT_HINT_OPTIONS, FDP_FORM_IGNORED_STATUSES, FORM_GENERATOR_CONFIG, FORM_GENERATOR_ITEM_CONFIG, FORM_GROUP_CHILD_FIELD_TOKEN, FdpComboboxItemDef, FdpFormGroupModule, FdpSelectionChangeEvent, Field, FieldGroup, FieldGroupRowValuePipe, FileUploaderInvalidChangeEvent, FileUploaderSelectionChangeEvent, FormFieldComponent, FormFieldControlExtrasComponent, FormFieldErrorDescriptionDirective, FormFieldErrorDirective, FormFieldErrorHeadingDirective, FormFieldGroupComponent, FormGeneratorComponent, FormGeneratorComponentsAccessorService, FormGeneratorFieldComponent, FormGeneratorService, FormGroupComponent, FormGroupHeaderComponent, GetHintOptionsPipe, INPUT_GROUP_CHILD_TOKEN, InputComponent, InputGroupAddonBodyComponent, InputGroupAddonComponent, InputGroupComponent, InputGroupConfig, InputGroupInputComponent, InputMessageGroupWithTemplate, MAP_LIMIT, MULTICOMBOBOX_COMPONENT, MULTIINPUT_COMPONENT, MultiComboboxComponent, MultiComboboxConfig, MultiComboboxMobileComponent, MultiComboboxSelectionChangeEvent, MultiInputConfig, MultiInputSelectionChangeEvent, NumberStepInputComponent, OptionComponent, PlatformAutoCompleteModule, PlatformCheckboxChange, PlatformCheckboxGroupModule, PlatformCheckboxModule, PlatformComboboxMobileModule, PlatformComboboxModule, PlatformDatePickerComponent, PlatformDatePickerModule, PlatformDatetimePickerComponent, PlatformDatetimePickerModule, PlatformFileUploaderComponent, PlatformFileUploaderModule, PlatformFormGeneratorModule, PlatformInputGroupModule, PlatformInputModule, PlatformMultiComboboxMobileModule, PlatformMultiComboboxModule, PlatformMultiInputComponent, PlatformMultiInputMobileComponent, PlatformMultiInputMobileModule, PlatformMultiInputModule, PlatformRadioGroupModule, PlatformSelectModule, PlatformStepInputModule, PlatformSwitchModule, PlatformTextAreaModule, PlatformTimePickerComponent, PlatformTimePickerModule, RadioButtonComponent, RadioGroupComponent, SelectComponent, SelectConfig, StepInputActionButton, StepInputAlign, StepInputChangeEvent, StepInputComponent, StepInputConfig, StepInputControlDirective, StepInputDecrementDirective, StepInputIncrementDirective, SwitchChangeEvent, SwitchComponent, SwitchConfig, TextAreaComponent, TextAreaConfig, addAndCutFloatingNumberDistortion, createMissingDateImplementationError$1 as createMissingDateImplementationError, defaultFormFieldHintOptions, defaultFormGeneratorConfig, defaultFormGeneratorConfigProvider, defaultFormGeneratorHintOptions, defaultFormGeneratorItemConfig, defaultFormGeneratorItemConfigProvider, dynamicFormFieldProvider, dynamicFormGroupChildProvider, formGroupProvider, getField, getFormField, getFormState, getNumberDecimalLength, inputGroupAddonChildProvider, inputGroupInputChildProvider, isFieldChild, isFieldGroupChild, isFieldGroupWrapperChild };
+export { AutoCompleteDirective, BaseCombobox, BaseDynamicFormGeneratorControl, BaseMultiCombobox, BaseMultiInput, BaseSelect, COMBOBOX_COMPONENT, CSS_CLASS_NAME, CheckboxComponent, CheckboxGroupComponent, ComboboxComponent, ComboboxConfig, ComboboxItemDirective, ComboboxItemGroupDirective, ComboboxMobileComponent, ComboboxSecondaryItemDirective, ComboboxSelectedItemDirective, ComboboxSelectionChangeEvent, DEFAULT_COMPONENTS_LIST, DEFAULT_VALIDATION_ERRORS, DefaultGapLayout, DefaultHorizontalFieldLayout, DefaultHorizontalLabelLayout, DefaultVerticalFieldLayout, DefaultVerticalLabelLayout, DynamicFormControl, DynamicFormControlDirective, DynamicFormControlFieldDirective, DynamicFormControlGroup, DynamicFormGeneratorCheckboxComponent, DynamicFormGeneratorDatepickerComponent, DynamicFormGeneratorEditorComponent, DynamicFormGeneratorInputComponent, DynamicFormGeneratorMultiInputComponent, DynamicFormGeneratorObjectStatusComponent, DynamicFormGeneratorRadioComponent, DynamicFormGeneratorSelectComponent, DynamicFormGeneratorSwitchComponent, FDP_COMBOBOX_ITEM_DEF, FDP_FORM_ERROR_DIRECTIVE, FDP_FORM_FIELD_HINT_LAYOUT_CONFIG, FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT, FDP_FORM_GENERATOR_DEFAULT_HINT_OPTIONS, FDP_FORM_IGNORED_STATUSES, FORM_GENERATOR_CONFIG, FORM_GENERATOR_ITEM_CONFIG, FORM_GROUP_CHILD_FIELD_TOKEN, FdpComboboxItemDef, FdpFormGroupModule, FdpSelectionChangeEvent, Field, FieldGroup, FieldGroupRowValuePipe, FileUploaderInvalidChangeEvent, FileUploaderSelectionChangeEvent, FormFieldComponent, FormFieldControlExtrasComponent, FormFieldErrorDescriptionDirective, FormFieldErrorDirective, FormFieldErrorHeadingDirective, FormFieldGroupComponent, FormGeneratorComponent, FormGeneratorComponentsAccessorService, FormGeneratorFieldComponent, FormGeneratorService, FormGroupComponent, FormGroupHeaderComponent, GetHintOptionsPipe, INPUT_GROUP_CHILD_TOKEN, InputComponent, InputGroupAddonBodyComponent, InputGroupAddonComponent, InputGroupComponent, InputGroupConfig, InputGroupInputComponent, InputMessageGroupWithTemplate, MAP_LIMIT, MULTICOMBOBOX_COMPONENT, MULTIINPUT_COMPONENT, MultiComboboxComponent, MultiComboboxConfig, MultiComboboxMobileComponent, MultiComboboxSelectionChangeEvent, MultiInputConfig, MultiInputSelectionChangeEvent, NumberStepInputComponent, PlatformAutoCompleteModule, PlatformCheckboxChange, PlatformCheckboxGroupModule, PlatformCheckboxModule, PlatformComboboxMobileModule, PlatformComboboxModule, PlatformDatePickerComponent, PlatformDatePickerModule, PlatformDatetimePickerComponent, PlatformDatetimePickerModule, PlatformFileUploaderComponent, PlatformFileUploaderModule, PlatformFormGeneratorModule, PlatformInputGroupModule, PlatformInputModule, PlatformMultiComboboxMobileModule, PlatformMultiComboboxModule, PlatformMultiInputComponent, PlatformMultiInputMobileComponent, PlatformMultiInputMobileModule, PlatformMultiInputModule, PlatformRadioGroupModule, PlatformSelectModule, PlatformStepInputModule, PlatformSwitchModule, PlatformTextAreaModule, PlatformTimePickerComponent, PlatformTimePickerModule, RadioButtonComponent, RadioGroupComponent, SelectComponent, SelectConfig, StepInputActionButton, StepInputAlign, StepInputChangeEvent, StepInputComponent, StepInputConfig, StepInputControlDirective, StepInputDecrementDirective, StepInputIncrementDirective, SwitchChangeEvent, SwitchComponent, SwitchConfig, TextAreaComponent, TextAreaConfig, addAndCutFloatingNumberDistortion, createMissingDateImplementationError$1 as createMissingDateImplementationError, defaultFormFieldHintOptions, defaultFormGeneratorConfig, defaultFormGeneratorConfigProvider, defaultFormGeneratorHintOptions, defaultFormGeneratorItemConfig, defaultFormGeneratorItemConfigProvider, dynamicFormFieldProvider, dynamicFormGroupChildProvider, formGroupProvider, getField, getFormField, getFormState, getNumberDecimalLength, inputGroupAddonChildProvider, inputGroupInputChildProvider, isFieldChild, isFieldGroupChild, isFieldGroupWrapperChild };
 //# sourceMappingURL=fundamental-ngx-platform-form.mjs.map