@fundamental-ngx/platform 0.44.1-rc.3 → 0.45.0

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

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Directive, Input, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, Injectable, Inject, forwardRef, isDevMode, EventEmitter, TemplateRef, ElementRef, Optional, Self, SkipSelf, Output, ViewChild, ContentChildren, Host, Attribute, ViewChildren, HostListener, NgModule, Injector, Pipe, LOCALE_ID } from '@angular/core';
+import { InjectionToken, Directive, Input, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, Injectable, Inject, forwardRef, EventEmitter, TemplateRef, ElementRef, Optional, Self, SkipSelf, Output, ViewChild, ContentChildren, Host, Attribute, ViewChildren, HostListener, NgModule, Injector, Pipe, isDevMode, LOCALE_ID } from '@angular/core';
 import * as i1$1 from '@angular/forms';
 import { Validators, FormControl, FormGroup, FormsModule, ReactiveFormsModule, NgControl, NgForm, FormGroupDirective } from '@angular/forms';
 import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
@@ -8,9 +8,8 @@ import { uniqBy, merge as merge$1, cloneDeep } from 'lodash-es';
 import * as i14 from 'rxjs';
 import { Subject, BehaviorSubject, tap, combineLatest, filter, Subscription, merge, fromEvent, isObservable, firstValueFrom, of, timer, interval } from 'rxjs';
 import { distinctUntilChanged, map, takeUntil, switchMap, startWith, debounceTime, filter as filter$1, take, skip } from 'rxjs/operators';
-import { warnOnce } from '@fundamental-ngx/core/utils';
 import * as i1 from '@fundamental-ngx/platform/shared';
-import { ColumnLayoutGridClass, ResponsiveBreakPointConfig, RESPONSIVE_BREAKPOINTS_CONFIG, FormFieldGroup, BaseInput, InLineLayoutCollectionBaseInput, coerceArraySafe, CollectionBaseInput, isOptionItem, isJsObject, isString, MatchingStrategy, isFunction, isDataSource, ArrayMultiInputDataSource, ObservableMultiInputDataSource, MultiInputDataSource, DATA_PROVIDERS, PlatformContentDensityDeprecationsModule, ArrayComboBoxDataSource, ObservableComboBoxDataSource, ComboBoxDataSource, FormGroupContainer, ArrayMultiComboBoxDataSource, ObservableMultiComboBoxDataSource, isSelectableOptionItem, MultiComboBoxDataSource } from '@fundamental-ngx/platform/shared';
+import { ColumnLayoutGridClass, ResponsiveBreakPointConfig, RESPONSIVE_BREAKPOINTS_CONFIG, FormFieldGroup, BaseInput, InLineLayoutCollectionBaseInput, coerceArraySafe, CollectionBaseInput, isOptionItem, isJsObject, isString, MatchingStrategy, isFunction, isDataSource, ArrayMultiInputDataSource, ObservableMultiInputDataSource, MultiInputDataSource, DATA_PROVIDERS, ArrayComboBoxDataSource, ObservableComboBoxDataSource, ComboBoxDataSource, FormGroupContainer, ArrayMultiComboBoxDataSource, ObservableMultiComboBoxDataSource, isSelectableOptionItem, MultiComboBoxDataSource } from '@fundamental-ngx/platform/shared';
 import * as i4 from '@fundamental-ngx/core/form';
 import { FormInputMessageGroupComponent, FormItemModule, FormGroupModule, FormModule, FormControlModule, FormMessageModule, FormInputMessageGroupModule } from '@fundamental-ngx/core/form';
 import * as i3 from '@angular/common';
@@ -25,7 +24,7 @@ import { IconModule } from '@fundamental-ngx/core/icon';
 import * as i7 from '@fundamental-ngx/core/link';
 import { LinkModule } from '@fundamental-ngx/core/link';
 import * as i3$2 from '@fundamental-ngx/cdk/utils';
-import { warnOnce as warnOnce$1, RangeSelector, KeyUtil, TemplateDirective, isFunction as isFunction$1, selectStrategy, PipeModule, TemplateModule, DynamicComponentService, resizeObservable, InitialFocusModule, OnlyDigitsModule } from '@fundamental-ngx/cdk/utils';
+import { RangeSelector, KeyUtil, warnOnce, TemplateDirective, isFunction as isFunction$1, selectStrategy, PipeModule, TemplateModule, DynamicComponentService, resizeObservable, InitialFocusModule, OnlyDigitsModule } from '@fundamental-ngx/cdk/utils';
 import { SelectionModel } from '@angular/cdk/collections';
 import * as i2$1 from '@fundamental-ngx/core/checkbox';
 import { CheckboxComponent as CheckboxComponent$1, CheckboxModule } from '@fundamental-ngx/core/checkbox';
@@ -58,7 +57,7 @@ import { BarModule } from '@fundamental-ngx/core/bar';
 import * as i5$3 from '@fundamental-ngx/core/button';
 import { ButtonModule } from '@fundamental-ngx/core/button';
 import * as i5$2 from '@fundamental-ngx/core/content-density';
-import { contentDensityObserverProviders, CONTENT_DENSITY_DIRECTIVE, ContentDensityGlobalKeyword, ContentDensityModule, DeprecatedCompactDirective } from '@fundamental-ngx/core/content-density';
+import { contentDensityObserverProviders, CONTENT_DENSITY_DIRECTIVE, ContentDensityGlobalKeyword, ContentDensityModule } from '@fundamental-ngx/core/content-density';
 import equal from 'fast-deep-equal';
 import * as i10 from '@fundamental-ngx/core/input-group';
 import { InputGroupModule } from '@fundamental-ngx/core/input-group';
@@ -377,35 +376,6 @@ const formGroupChildProvider$2 = {
  *
  */
 class FormFieldComponent {
-    /**
-     * @deprecated use `hint.placement` input instead
-     * Defines hint placement
-     */
-    set hintPlacement(value) {
-        warnOnce('Property hintPlacement is deprecated. Use `hint.placement` instead.');
-        this._hintPlacement = value;
-    }
-    get hintPlacement() {
-        return this._hintPlacement;
-    }
-    /**
-     * @deprecated
-     * Use labelColumnLayout, fieldColumnLayout and gapColumnLayout properties.
-     * Define form field label placement
-     */
-    set labelLayout(value) {
-        if (isDevMode()) {
-            warnOnce('LabelLayout input property is deprecated. Please use labelColumnLayout, fieldColumnLayout and gapColumnLayout properties instead');
-        }
-        this._labelLayout = value;
-        this.labelColumnLayout =
-            this._labelLayout === 'horizontal' ? DefaultHorizontalLabelLayout : DefaultVerticalLabelLayout;
-        this.fieldColumnLayout =
-            this._labelLayout === 'horizontal' ? DefaultHorizontalFieldLayout : DefaultVerticalFieldLayout;
-    }
-    get labelLayout() {
-        return this._labelLayout;
-    }
     /** object for placing field in column in each screen layout */
     set columnLayout(layout) {
         if (!layout) {
@@ -639,7 +609,7 @@ class FormFieldComponent {
     }
     /** @hidden */
     ngOnChanges(changes) {
-        if (changes.hint || changes.hintPlacement) {
+        if (changes.hint) {
             this._updateHintOptions();
             this._formFieldLayoutService.setNeedsInlineHelp(this, (this.hintOptions.target === 'input' || this.hintOptions.target === 'auto') && !!this.hint);
         }
@@ -919,14 +889,12 @@ class FormFieldComponent {
         if (typeof this.hint === 'string' || this.hint instanceof TemplateRef) {
             this.hintOptions = {
                 ...this._defaultHintOptions,
-                placement: this.hintPlacement ? this.hintPlacement : this._defaultHintOptions.placement,
                 content: this.hint
             };
         }
         else if (typeof this.hint === 'object') {
             this.hintOptions = {
                 ...this._defaultHintOptions,
-                placement: this.hintPlacement ? this.hintPlacement : this._defaultHintOptions.placement,
                 ...this.hint
             };
         }
@@ -944,7 +912,7 @@ class FormFieldComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.FormGroupContainer, optional: true }, { token: i1.FormFieldGroup, optional: true }, { token: RESPONSIVE_BREAKPOINTS_CONFIG, optional: true }, { token: i1.ResponsiveBreakpointsService }, { token: FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT }, { token: FDP_FORM_FIELD_HINT_LAYOUT_CONFIG }, { token: FormFieldLayoutService, self: true }, { token: FormFieldLayoutService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldComponent, selector: "fdp-form-field", inputs: { label: "label", id: "id", hintPlacement: "hintPlacement", hint: "hint", labelLayout: "labelLayout", noLabelLayout: "noLabelLayout", validators: "validators", rank: "rank", placeholder: "placeholder", column: "column", columnLayout: "columnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", i18Strings: "i18Strings", required: "required", editable: "editable", columns: "columns", disabled: "disabled", colon: "colon", formGroupContainer: "formGroupContainer" }, outputs: { onChange: "onChange", onColumnChange: "onColumnChange" }, providers: [formFieldProvider$1, formGroupChildProvider$2, FormFieldLayoutService], queries: [{ propertyName: "formFieldExtras", first: true, predicate: FormFieldControlExtrasComponent, descendants: true, read: ElementRef }, { propertyName: "_errorDirectiveQuery", predicate: FormFieldErrorDirective }], viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true, static: true }, { propertyName: "labelCol", first: true, predicate: ["labelCol"], descendants: true }, { propertyName: "inputMessageGroup", first: true, predicate: InputMessageGroupWithTemplate, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<ng-template #renderer>\n    <div [horizontal]=\"true\" fd-form-item class=\"fd-row\">\n        <div\n            class=\"fd-col\"\n            #labelCol\n            [class]=\"_labelColumnLayoutClass\"\n            *ngIf=\"!noLabelLayout\"\n            [style.margin-bottom.px]=\"_controlExtrasHeightPx\"\n        >\n            <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n        </div>\n        <ng-container *ngTemplateOutlet=\"withFormMessage\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"gapTemplate\"></ng-container>\n    </div>\n    <span aria-hidden=\"true\" style=\"display: none\" [id]=\"'fdp-form-hint-' + id\">\n        <ng-container *ngIf=\"isStringHint(hintOptions.content); else hintTemplate\">\n            {{ hintOptions.content }}\n        </ng-container>\n        <ng-template #hintTemplate>\n            <ng-template [ngTemplateOutlet]=\"$any(hintOptions.content)\"></ng-template>\n        </ng-template>\n    </span>\n</ng-template>\n\n<ng-template #withFormMessage>\n    <fdp-input-message-group\n        class=\"fd-col\"\n        [class]=\"_fieldColumnLayoutClass\"\n        [attr.aria-labelledby]=\"'fdp-form-label-' + id\"\n    >\n        <!--\n         Todo: we should extend this on FormGroup Level and have error trigger strategy that will be applied to\n         all the field e.g.: [triggers]=\"['mouseenter', 'mouseleave']\"\n         -->\n\n        <ng-template #triggerItem>\n            <ng-content></ng-content>\n        </ng-template>\n\n        <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n            <fd-form-message *ngFor=\"let error of groupedErrors\" [type]=\"error.directive.type\">\n                <ng-template\n                    [ngIf]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n                <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                    <br />\n                </ng-container>\n                <ng-template\n                    [ngIf]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n            </fd-form-message>\n        </ng-container>\n\n        <fd-form-message *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\" type=\"error\">\n            <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n            </ng-container>\n        </fd-form-message>\n    </fdp-input-message-group>\n</ng-template>\n\n<ng-template #labelTemplate>\n    <ng-container *ngIf=\"hintTarget === 'label'; else withoutHint\">\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [inlineHelpContent]=\"hintOptions.content\"\n            [inlineHelpBodyPlacement]=\"hintOptions.placement || 'top'\"\n            [inlineHelpPlacement]=\"hintOptions.position || 'after'\"\n            [inlineHelpGlyph]=\"hintOptions.glyph || ''\"\n            [inlineHelpTriggers]=\"hintOptions.trigger || []\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n            [colon]=\"colon\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-container>\n    <ng-template #withoutHint>\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [colon]=\"colon\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-template>\n</ng-template>\n\n<ng-template #gapTemplate>\n    <ng-container *ngIf=\"hintTarget === 'input' && hintOptions.content; else withoutHint\">\n        <div class=\"fd-col fd-form-field-inline-help-container\" [class]=\"_gapColumnLayoutClass\">\n            <span fd-link [undecorated]=\"true\">\n                <fd-icon\n                    [fd-inline-help]=\"hintOptions.content\"\n                    [glyph]=\"hintOptions.glyph\"\n                    [placement]=\"hintOptions.placement || null\"\n                    [triggers]=\"hintOptions.trigger || []\"\n                    tabindex=\"0\"\n                >\n                </fd-icon>\n            </span>\n        </div>\n    </ng-container>\n    <ng-template #withoutHint>\n        <div class=\"fd-col\" [class]=\"_gapColumnLayoutClass\"></div>\n    </ng-template>\n</ng-template>\n", styles: [".fd-form-label__wrapper{display:flex;width:100%;white-space:nowrap}.fd-form-field-inline-help-container{overflow:visible!important}.fd-form-field-inline-help-container [class*=sap-icon]{margin:0}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i4.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "checkbox", "radio", "alignLabelEnd", "inlineHelpTitle", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help", "fd-inline-help-template"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: InputMessageGroupWithTemplate, selector: "fdp-input-message-group" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldComponent, selector: "fdp-form-field", inputs: { label: "label", id: "id", hint: "hint", noLabelLayout: "noLabelLayout", validators: "validators", rank: "rank", placeholder: "placeholder", column: "column", columnLayout: "columnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", i18Strings: "i18Strings", required: "required", editable: "editable", columns: "columns", disabled: "disabled", colon: "colon", formGroupContainer: "formGroupContainer" }, outputs: { onChange: "onChange", onColumnChange: "onColumnChange" }, providers: [formFieldProvider$1, formGroupChildProvider$2, FormFieldLayoutService], queries: [{ propertyName: "formFieldExtras", first: true, predicate: FormFieldControlExtrasComponent, descendants: true, read: ElementRef }, { propertyName: "_errorDirectiveQuery", predicate: FormFieldErrorDirective }], viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true, static: true }, { propertyName: "labelCol", first: true, predicate: ["labelCol"], descendants: true }, { propertyName: "inputMessageGroup", first: true, predicate: InputMessageGroupWithTemplate, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<ng-template #renderer>\n    <div [horizontal]=\"true\" fd-form-item class=\"fd-row\">\n        <div\n            class=\"fd-col\"\n            #labelCol\n            [class]=\"_labelColumnLayoutClass\"\n            *ngIf=\"!noLabelLayout\"\n            [style.margin-bottom.px]=\"_controlExtrasHeightPx\"\n        >\n            <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n        </div>\n        <ng-container *ngTemplateOutlet=\"withFormMessage\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"gapTemplate\"></ng-container>\n    </div>\n    <span aria-hidden=\"true\" style=\"display: none\" [id]=\"'fdp-form-hint-' + id\">\n        <ng-container *ngIf=\"isStringHint(hintOptions.content); else hintTemplate\">\n            {{ hintOptions.content }}\n        </ng-container>\n        <ng-template #hintTemplate>\n            <ng-template [ngTemplateOutlet]=\"$any(hintOptions.content)\"></ng-template>\n        </ng-template>\n    </span>\n</ng-template>\n\n<ng-template #withFormMessage>\n    <fdp-input-message-group\n        class=\"fd-col\"\n        [class]=\"_fieldColumnLayoutClass\"\n        [attr.aria-labelledby]=\"'fdp-form-label-' + id\"\n    >\n        <!--\n         Todo: we should extend this on FormGroup Level and have error trigger strategy that will be applied to\n         all the field e.g.: [triggers]=\"['mouseenter', 'mouseleave']\"\n         -->\n\n        <ng-template #triggerItem>\n            <ng-content></ng-content>\n        </ng-template>\n\n        <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n            <fd-form-message *ngFor=\"let error of groupedErrors\" [type]=\"error.directive.type\">\n                <ng-template\n                    [ngIf]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n                <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                    <br />\n                </ng-container>\n                <ng-template\n                    [ngIf]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n            </fd-form-message>\n        </ng-container>\n\n        <fd-form-message *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\" type=\"error\">\n            <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n            </ng-container>\n        </fd-form-message>\n    </fdp-input-message-group>\n</ng-template>\n\n<ng-template #labelTemplate>\n    <ng-container *ngIf=\"hintTarget === 'label'; else withoutHint\">\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [inlineHelpContent]=\"hintOptions.content\"\n            [inlineHelpBodyPlacement]=\"hintOptions.placement || 'top'\"\n            [inlineHelpPlacement]=\"hintOptions.position || 'after'\"\n            [inlineHelpGlyph]=\"hintOptions.glyph || ''\"\n            [inlineHelpTriggers]=\"hintOptions.trigger || []\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n            [colon]=\"colon\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-container>\n    <ng-template #withoutHint>\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [colon]=\"colon\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-template>\n</ng-template>\n\n<ng-template #gapTemplate>\n    <ng-container *ngIf=\"hintTarget === 'input' && hintOptions.content; else withoutHint\">\n        <div class=\"fd-col fd-form-field-inline-help-container\" [class]=\"_gapColumnLayoutClass\">\n            <span fd-link [undecorated]=\"true\">\n                <fd-icon\n                    [fd-inline-help]=\"hintOptions.content\"\n                    [glyph]=\"hintOptions.glyph\"\n                    [placement]=\"hintOptions.placement || null\"\n                    [triggers]=\"hintOptions.trigger || []\"\n                    tabindex=\"0\"\n                >\n                </fd-icon>\n            </span>\n        </div>\n    </ng-container>\n    <ng-template #withoutHint>\n        <div class=\"fd-col\" [class]=\"_gapColumnLayoutClass\"></div>\n    </ng-template>\n</ng-template>\n", styles: [".fd-form-label__wrapper{display:flex;width:100%;white-space:nowrap}.fd-form-field-inline-help-container{overflow:visible!important}.fd-form-field-inline-help-container [class*=sap-icon]{margin:0}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i4.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: InputMessageGroupWithTemplate, selector: "fdp-input-message-group" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
@@ -974,12 +942,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], id: [{
                 type: Input
-            }], hintPlacement: [{
-                type: Input
             }], hint: [{
                 type: Input
-            }], labelLayout: [{
-                type: Input
             }], noLabelLayout: [{
                 type: Input
             }], validators: [{
@@ -1371,13 +1335,6 @@ class PlatformCheckboxChange {
 }
 let nextUniqueId$2 = 0;
 class CheckboxComponent extends BaseInput {
-    /** @deprecated */
-    set isBinary(value) {
-        if (isDevMode()) {
-            warnOnce$1('"isBinary" is deprecated and has no effect anymore \n' +
-                'Checkbox is binary by default. Use "tristate" input if you need to have indeterminate checkbox.');
-        }
-    }
     // 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
     /**
@@ -1390,14 +1347,6 @@ class CheckboxComponent extends BaseInput {
     get value() {
         return this.getValue();
     }
-    /** value for checkbox control when it's state is checked. */
-    // eslint-disable-next-line @angular-eslint/no-input-rename
-    set checkboxTrueValue(trueValue) {
-        if (isDevMode()) {
-            warnOnce$1('"value" input is deprecated. Use "values" instead');
-        }
-        this.values = this.values ? { ...this.values, trueValue } : { trueValue };
-    }
     /** @hidden */
     constructor(elementRef, ngControl, controlContainer, ngForm, formField, formControl, _changeDetector, tabIndexValue = 0) {
         super(_changeDetector, elementRef, ngControl, controlContainer, ngForm, formField, formControl);
@@ -1413,31 +1362,11 @@ class CheckboxComponent extends BaseInput {
          * Emitting checked event for non-form checkbox
          */
         this.checkedChange = new EventEmitter();
-        /**
-         * @deprecated use "checkedChange" instead
-         * Emitting checkbox change event
-         */
-        this.change = new EventEmitter();
-        /**
-         * @deprecated rely on checkbox state directly instead
-         * Event emitted when the checkbox's `indeterminate` value changes.
-         */
-        this.indeterminateChange = 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.tabIndexValue = tabIndexValue;
     }
-    /** @hidden */
-    ngOnInit() {
-        super.ngOnInit();
-        if (this.change.observed) {
-            warnOnce$1('`change` event is deprecated. Use `checkedChange` instead');
-        }
-        if (this.indeterminateChange.observed) {
-            warnOnce$1('`indeterminateChange` event is deprecated. Use `indeterminate` instead');
-        }
-    }
     /** update controller on checkbox state change */
     onModelChange(value) {
         this.value = value;
@@ -1452,11 +1381,9 @@ class CheckboxComponent extends BaseInput {
         const event = new PlatformCheckboxChange();
         event.source = this;
         event.checked = this.value;
-        this.change.emit(event);
-        this.indeterminateChange.emit(this.value === this.coreCheckbox?.values.thirdStateValue);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxComponent, deps: [{ 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, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i0.ChangeDetectorRef }, { token: 'tabIndexValue', attribute: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxComponent, selector: "fdp-checkbox", inputs: { title: "title", label: "label", tristate: "tristate", isBinary: "isBinary", value: ["checked", "value"], tristateSelectable: "tristateSelectable", checkboxTrueValue: ["value", "checkboxTrueValue"], values: "values", standalone: "standalone" }, outputs: { checkedChange: "checkedChange", change: "change", indeterminateChange: "indeterminateChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxComponent), multi: true }], viewQueries: [{ propertyName: "coreCheckbox", first: true, predicate: CheckboxComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div fd-form-item>\n    <fd-checkbox\n        [inputId]=\"id\"\n        [name]=\"name\"\n        [disabled]=\"disabled\"\n        [label]=\"label\"\n        [tristate]=\"tristate\"\n        [values]=\"values\"\n        [tristateSelectable]=\"tristateSelectable\"\n        [state]=\"state\"\n        [title]=\"title\"\n        [required]=\"required\"\n        [ariaLabel]=\"ariaLabel || null\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"value\"\n        [standalone]=\"standalone\"\n        (ngModelChange)=\"onModelChange($event)\"\n        (focusChange)=\"_onFocusChanged($event)\"\n    >\n        <ng-content></ng-content>\n    </fd-checkbox>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxComponent, selector: "fdp-checkbox", inputs: { title: "title", label: "label", tristate: "tristate", value: ["checked", "value"], tristateSelectable: "tristateSelectable", values: "values", standalone: "standalone" }, outputs: { checkedChange: "checkedChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxComponent), multi: true }], viewQueries: [{ propertyName: "coreCheckbox", first: true, predicate: CheckboxComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div fd-form-item>\n    <fd-checkbox\n        [inputId]=\"id\"\n        [name]=\"name\"\n        [disabled]=\"disabled\"\n        [label]=\"label\"\n        [tristate]=\"tristate\"\n        [values]=\"values\"\n        [tristateSelectable]=\"tristateSelectable\"\n        [state]=\"state\"\n        [title]=\"title\"\n        [required]=\"required\"\n        [ariaLabel]=\"ariaLabel || null\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"value\"\n        [standalone]=\"standalone\"\n        (ngModelChange)=\"onModelChange($event)\"\n        (focusChange)=\"_onFocusChanged($event)\"\n    >\n        <ng-content></ng-content>\n    </fd-checkbox>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
@@ -1500,38 +1427,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], tristate: [{
                 type: Input
-            }], isBinary: [{
-                type: Input
             }], value: [{
                 type: Input,
                 args: ['checked']
             }], tristateSelectable: [{
                 type: Input
-            }], checkboxTrueValue: [{
-                type: Input,
-                args: ['value']
             }], values: [{
                 type: Input
             }], standalone: [{
                 type: Input
             }], checkedChange: [{
                 type: Output
-            }], change: [{
-                type: Output
-            }], indeterminateChange: [{
-                type: Output
             }], coreCheckbox: [{
                 type: ViewChild,
                 args: [CheckboxComponent$1]
             }] } });
 
-let warnedAboutChecked = false;
-const warnAboutChecked = () => {
-    if (isDevMode() && !warnedAboutChecked) {
-        warnOnce$1('The fdp-checkbox-group[checked] property is deprecated. Use fdp-checkbox-group[value] instead');
-        warnedAboutChecked = true;
-    }
-};
 /**
  * Checkbox group implementation based on the
  * https://github.com/SAP/fundamental-ngx/wiki/Platform:-CheckboxGroup-Technical-Design
@@ -1557,18 +1468,6 @@ class CheckboxGroupComponent extends InLineLayoutCollectionBaseInput {
     get isInline() {
         return this._inlineCurrentValue$.value;
     }
-    /**
-     * @deprecated
-     * Establishes two way binding, when checkbox group used outside form.
-     */
-    set checked(checkedValues) {
-        warnAboutChecked();
-        this.value = checkedValues;
-    }
-    get checked() {
-        warnAboutChecked();
-        return this.value;
-    }
     /** @hidden */
     constructor(cd, elementRef, _responsiveBreakpointsService, ngControl, controlContainer, ngForm, formField, formControl, _defaultResponsiveBreakPointConfig) {
         super(cd, elementRef, _responsiveBreakpointsService, ngControl, controlContainer, ngForm, formField, formControl, _defaultResponsiveBreakPointConfig);
@@ -1576,15 +1475,10 @@ class CheckboxGroupComponent extends InLineLayoutCollectionBaseInput {
         this._defaultResponsiveBreakPointConfig = _defaultResponsiveBreakPointConfig;
         /** Emits checked change event */
         this.valueChange = new EventEmitter();
-        /**
-         * @deprecated - use "valueChange" instead
-         * Emits checked change event
-         */
-        this.checkedChange = this.valueChange;
-        /** @hidden */
-        this._rangeSelector = new RangeSelector();
         /** @hidden */
         this._selectionModel = new SelectionModel(true);
+        /** @hidden */
+        this._rangeSelector = new RangeSelector();
     }
     /**
      * @hidden
@@ -1635,10 +1529,6 @@ class CheckboxGroupComponent extends InLineLayoutCollectionBaseInput {
         super.writeValue(coerceArraySafe(selectedValue));
         this._updateSelectionModelByValue();
     }
-    /** @inheritdoc */
-    setValue(value, emitOnChange = true) {
-        super.setValue(coerceArraySafe(value), emitOnChange);
-    }
     /**
      * access display value for objects, acts as checkbox label.
      */
@@ -1655,6 +1545,10 @@ class CheckboxGroupComponent extends InLineLayoutCollectionBaseInput {
     getListItemDisabledValue(item) {
         return this.disabled || !!item?.disabled;
     }
+    /** @inheritdoc */
+    setValue(value, emitOnChange = true) {
+        super.setValue(coerceArraySafe(value), emitOnChange);
+    }
     /** @hidden */
     _setValueBySelectionModel() {
         super.setValue(this._selectionModel.selected);
@@ -1667,7 +1561,7 @@ class CheckboxGroupComponent extends InLineLayoutCollectionBaseInput {
         this._cd.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.ResponsiveBreakpointsService }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: RESPONSIVE_BREAKPOINTS_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxGroupComponent, selector: "fdp-checkbox-group", inputs: { value: "value", isInline: "isInline", checked: "checked" }, outputs: { valueChange: "valueChange", checkedChange: "checkedChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxGroupComponent), multi: true }], queries: [{ propertyName: "contentCheckboxes", predicate: CheckboxComponent }], viewQueries: [{ propertyName: "viewCheckboxes", predicate: CheckboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"group\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let checkbox of contentCheckboxes; let i = index\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    checkboxtmpt;\n                    context: {\n                        id: id + i,\n                        idx: i,\n                        source: 'contentChildren',\n                        name: name,\n                        checkboxValue: checkbox.coreCheckbox?.values?.trueValue,\n                        labeltext: checkbox.label,\n                        disabled: disabled || checkbox.disabled,\n                        ariaLabel: checkbox.ariaLabel,\n                        ariaLabelledBy: checkbox.ariaLabelledBy,\n                        ariaDescribedBy: checkbox.ariaDescribedBy,\n                        title: checkbox.title\n                    }\n                \"\n            >\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngFor=\"let item of list; let i = index\">\n        <ng-container\n            *ngTemplateOutlet=\"\n                checkboxtmpt;\n                context: {\n                    id: id + i,\n                    idx: i,\n                    source: 'list',\n                    name: name,\n                    checkboxValue: getLookupValue(item),\n                    labeltext: getDisplayValue(item),\n                    disabled: getListItemDisabledValue(item)\n                }\n            \"\n        >\n        </ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template\n    #checkboxtmpt\n    let-id=\"id\"\n    let-idx=\"idx\"\n    let-source=\"source\"\n    let-name=\"name\"\n    let-checkboxValue=\"checkboxValue\"\n    let-labeltext=\"labeltext\"\n    let-checkboxDisabled=\"disabled\"\n    let-ariaLabel=\"ariaLabel\"\n    let-ariaLabelledBy=\"ariaLabelledBy\"\n    let-ariaDescribedBy=\"ariaDescribedBy\"\n    let-title=\"title\"\n>\n    <fdp-checkbox\n        [id]=\"id\"\n        [name]=\"name\"\n        [values]=\"{ trueValue: checkboxValue }\"\n        [label]=\"labeltext\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [title]=\"title\"\n        [disabled]=\"checkboxDisabled\"\n        [state]=\"state\"\n        [ngModel]=\"_selectionModel.isSelected(checkboxValue) ? checkboxValue : false\"\n        (ngModelChange)=\"onModelChanged($event, checkboxValue)\"\n        (click)=\"onCheckboxClick(idx, source, $event)\"\n    >\n    </fdp-checkbox>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CheckboxComponent, selector: "fdp-checkbox", inputs: ["title", "label", "tristate", "isBinary", "checked", "tristateSelectable", "value", "values", "standalone"], outputs: ["checkedChange", "change", "indeterminateChange"] }, { 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: "component", type: i4.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxGroupComponent, selector: "fdp-checkbox-group", inputs: { value: "value", isInline: "isInline" }, outputs: { valueChange: "valueChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxGroupComponent), multi: true }], queries: [{ propertyName: "contentCheckboxes", predicate: CheckboxComponent }], viewQueries: [{ propertyName: "viewCheckboxes", predicate: CheckboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"group\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let checkbox of contentCheckboxes; let i = index\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    checkboxtmpt;\n                    context: {\n                        id: id + i,\n                        idx: i,\n                        source: 'contentChildren',\n                        name: name,\n                        checkboxValue: checkbox.coreCheckbox?.values?.trueValue,\n                        labeltext: checkbox.label,\n                        disabled: disabled || checkbox.disabled,\n                        ariaLabel: checkbox.ariaLabel,\n                        ariaLabelledBy: checkbox.ariaLabelledBy,\n                        ariaDescribedBy: checkbox.ariaDescribedBy,\n                        title: checkbox.title\n                    }\n                \"\n            >\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngFor=\"let item of list; let i = index\">\n        <ng-container\n            *ngTemplateOutlet=\"\n                checkboxtmpt;\n                context: {\n                    id: id + i,\n                    idx: i,\n                    source: 'list',\n                    name: name,\n                    checkboxValue: getLookupValue(item),\n                    labeltext: getDisplayValue(item),\n                    disabled: getListItemDisabledValue(item)\n                }\n            \"\n        >\n        </ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template\n    #checkboxtmpt\n    let-id=\"id\"\n    let-idx=\"idx\"\n    let-source=\"source\"\n    let-name=\"name\"\n    let-checkboxValue=\"checkboxValue\"\n    let-labeltext=\"labeltext\"\n    let-checkboxDisabled=\"disabled\"\n    let-ariaLabel=\"ariaLabel\"\n    let-ariaLabelledBy=\"ariaLabelledBy\"\n    let-ariaDescribedBy=\"ariaDescribedBy\"\n    let-title=\"title\"\n>\n    <fdp-checkbox\n        [id]=\"id\"\n        [name]=\"name\"\n        [values]=\"{ trueValue: checkboxValue }\"\n        [label]=\"labeltext\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [title]=\"title\"\n        [disabled]=\"checkboxDisabled\"\n        [state]=\"state\"\n        [ngModel]=\"_selectionModel.isSelected(checkboxValue) ? checkboxValue : false\"\n        (ngModelChange)=\"onModelChanged($event, checkboxValue)\"\n        (click)=\"onCheckboxClick(idx, source, $event)\"\n    >\n    </fdp-checkbox>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CheckboxComponent, selector: "fdp-checkbox", inputs: ["title", "label", "tristate", "checked", "tristateSelectable", "values", "standalone"], outputs: ["checkedChange"] }, { 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: "component", type: i4.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxGroupComponent, decorators: [{
             type: Component,
@@ -1714,8 +1608,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], isInline: [{
                 type: Input
-            }], checked: [{
-                type: Input
             }], contentCheckboxes: [{
                 type: ContentChildren,
                 args: [CheckboxComponent]
@@ -1724,8 +1616,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 args: [CheckboxComponent]
             }], valueChange: [{
                 type: Output
-            }], checkedChange: [{
-                type: Output
             }] } });
 
 class DynamicFormGeneratorCheckboxComponent extends BaseDynamicFormGeneratorControl {
@@ -1734,7 +1624,7 @@ class DynamicFormGeneratorCheckboxComponent extends BaseDynamicFormGeneratorCont
         super();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorCheckboxComponent, selector: "fdp-dynamic-form-generator-checkbox", usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-checkbox-group\n            [id]=\"id\"\n            [isInline]=\"formItem.guiOptions?.inline || false\"\n            [inlineLayout]=\"formItem.guiOptions?.inlineLayout\"\n            [name]=\"name\"\n            [list]=\"choices\"\n            [formControlName]=\"name\"\n        ></fdp-checkbox-group>\n    </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: CheckboxGroupComponent, selector: "fdp-checkbox-group", inputs: ["value", "isInline", "checked"], outputs: ["valueChange", "checkedChange"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorCheckboxComponent, selector: "fdp-dynamic-form-generator-checkbox", usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-checkbox-group\n            [id]=\"id\"\n            [isInline]=\"formItem.guiOptions?.inline || false\"\n            [inlineLayout]=\"formItem.guiOptions?.inlineLayout\"\n            [name]=\"name\"\n            [list]=\"choices\"\n            [formControlName]=\"name\"\n        ></fdp-checkbox-group>\n    </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: CheckboxGroupComponent, selector: "fdp-checkbox-group", inputs: ["value", "isInline"], outputs: ["valueChange"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorCheckboxComponent, decorators: [{
             type: Component,
@@ -1750,22 +1640,6 @@ class RadioButtonComponent extends BaseInput {
     get value() {
         return super.getValue();
     }
-    /**
-     * @deprecated
-     * set state of individual radio.Used by RBG to set radio states
-     */
-    set stateType(state) {
-        if (isDevMode()) {
-            warnOnce('"stateType" is deprecated. Use "state" instead');
-        }
-        super.state = state;
-    }
-    get stateType() {
-        if (isDevMode()) {
-            warnOnce('"stateType" is deprecated. Use "state" instead');
-        }
-        return super.state;
-    }
     /** @hidden */
     constructor(cd, elementRef, ngControl, controlContainer, ngForm, formField, formControl) {
         super(cd, elementRef, ngControl, controlContainer, ngForm, formField, formControl);
@@ -1830,7 +1704,7 @@ class RadioButtonComponent extends BaseInput {
         this._cd.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioButtonComponent, 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, skipSelf: true }, { 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.1.0", type: RadioButtonComponent, selector: "fdp-radio-button", inputs: { title: "title", tabIndex: "tabIndex", value: "value", stateType: "stateType", forceRender: "forceRender" }, outputs: { checked: "checked" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true }, { propertyName: "coreRadioButton", first: true, predicate: RadioButtonComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #renderer>\n    <fd-radio-button\n        [id]=\"id\"\n        [name]=\"name\"\n        [value]=\"value\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        [tabIndex]=\"_isChecked ? 0 : tabIndex\"\n        [title]=\"title\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"_currentValue\"\n        (ngModelChange)=\"_valueChange($event, true)\"\n    >\n        <ng-content></ng-content>\n    </fd-radio-button>\n</ng-template>\n\n<ng-container *ngIf=\"forceRender\">\n    <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i3$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RadioButtonComponent, selector: "fdp-radio-button", inputs: { title: "title", tabIndex: "tabIndex", value: "value", forceRender: "forceRender" }, outputs: { checked: "checked" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true }, { propertyName: "coreRadioButton", first: true, predicate: RadioButtonComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #renderer>\n    <fd-radio-button\n        [id]=\"id\"\n        [name]=\"name\"\n        [value]=\"value\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        [tabIndex]=\"_isChecked ? 0 : tabIndex\"\n        [title]=\"title\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"_currentValue\"\n        (ngModelChange)=\"_valueChange($event, true)\"\n    >\n        <ng-content></ng-content>\n    </fd-radio-button>\n</ng-template>\n\n<ng-container *ngIf=\"forceRender\">\n    <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i3$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioButtonComponent, decorators: [{
             type: Component,
@@ -1871,8 +1745,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], value: [{
                 type: Input
-            }], stateType: [{
-                type: Input
             }], forceRender: [{
                 type: Input
             }], renderer: [{
@@ -2083,7 +1955,7 @@ class RadioGroupComponent extends InLineLayoutCollectionBaseInput {
             .length === 0);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.ResponsiveBreakpointsService }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: RESPONSIVE_BREAKPOINTS_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RadioGroupComponent, selector: "fdp-radio-group", inputs: { value: ["selected", "value"], isInline: "isInline", hasNoValue: "hasNoValue", noValueLabel: "noValueLabel" }, outputs: { change: "change" }, host: { listeners: { "keydown": "_handleKeydown($event)" } }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => RadioGroupComponent), multi: true }], queries: [{ propertyName: "contentRadioButtons", predicate: RadioButtonComponent }], viewQueries: [{ propertyName: "viewRadioButtons", predicate: RadioButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"radiogroup\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-orientation]=\"isInline ? 'horizontal' : 'vertical'\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let radio of contentRadioButtons\">\n            <div fd-form-item>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        radio?.renderer || null;\n                        context: {\n                            name: name,\n                            value: radio.value,\n                            state: state,\n                            disabled: disabled || radio.disabled,\n                            ariaLabel: radio.ariaLabel,\n                            ariaLabelledBy: radio.ariaLabelledBy,\n                            ariaDescribedBy: radio.ariaDescribedBy,\n                            title: radio.title\n                        }\n                    \"\n                ></ng-container>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngIf=\"hasNoValue\">\n        <div fd-form-item>\n            <fdp-radio-button [name]=\"name\" value=\"None\" [state]=\"state\" [disabled]=\"disabled\" [forceRender]=\"true\">\n                {{ noValueLabel }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n    <ng-container *ngFor=\"let item of list\">\n        <div fd-form-item>\n            <fdp-radio-button\n                [name]=\"name\"\n                [value]=\"lookupValue(item)\"\n                [state]=\"state\"\n                [disabled]=\"_getListItemDisabledValue(item)\"\n                [forceRender]=\"true\"\n            >\n                {{ getDisplayValue(item) }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i4.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "component", type: RadioButtonComponent, selector: "fdp-radio-button", inputs: ["title", "tabIndex", "value", "stateType", "forceRender"], outputs: ["checked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RadioGroupComponent, selector: "fdp-radio-group", inputs: { value: ["selected", "value"], isInline: "isInline", hasNoValue: "hasNoValue", noValueLabel: "noValueLabel" }, outputs: { change: "change" }, host: { listeners: { "keydown": "_handleKeydown($event)" } }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => RadioGroupComponent), multi: true }], queries: [{ propertyName: "contentRadioButtons", predicate: RadioButtonComponent }], viewQueries: [{ propertyName: "viewRadioButtons", predicate: RadioButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"radiogroup\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-orientation]=\"isInline ? 'horizontal' : 'vertical'\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let radio of contentRadioButtons\">\n            <div fd-form-item>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        radio?.renderer || null;\n                        context: {\n                            name: name,\n                            value: radio.value,\n                            state: state,\n                            disabled: disabled || radio.disabled,\n                            ariaLabel: radio.ariaLabel,\n                            ariaLabelledBy: radio.ariaLabelledBy,\n                            ariaDescribedBy: radio.ariaDescribedBy,\n                            title: radio.title\n                        }\n                    \"\n                ></ng-container>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngIf=\"hasNoValue\">\n        <div fd-form-item>\n            <fdp-radio-button [name]=\"name\" value=\"None\" [state]=\"state\" [disabled]=\"disabled\" [forceRender]=\"true\">\n                {{ noValueLabel }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n    <ng-container *ngFor=\"let item of list\">\n        <div fd-form-item>\n            <fdp-radio-button\n                [name]=\"name\"\n                [value]=\"lookupValue(item)\"\n                [state]=\"state\"\n                [disabled]=\"_getListItemDisabledValue(item)\"\n                [forceRender]=\"true\"\n            >\n                {{ getDisplayValue(item) }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i4.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "component", type: RadioButtonComponent, selector: "fdp-radio-button", inputs: ["title", "tabIndex", "value", "forceRender"], outputs: ["checked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioGroupComponent, decorators: [{
             type: Component,
@@ -2185,21 +2057,6 @@ const VALID_WRAP_TYPES = ['hard', 'soft', 'off'];
  *
  */
 class TextAreaComponent extends BaseInput {
-    /**
-     * @deprecated
-     * set state of individual checkbox. Used by CBG to set checkbox states */
-    set stateType(state) {
-        if (isDevMode()) {
-            warnOnce$1('"stateType" is deprecated. Use "state" instead');
-        }
-        super.state = state;
-    }
-    get stateType() {
-        if (isDevMode()) {
-            warnOnce$1('"stateType" is deprecated. Use "state" instead');
-        }
-        return super.state;
-    }
     /**
      * The textarea's value
      */
@@ -2453,7 +2310,7 @@ class TextAreaComponent extends BaseInput {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: TextAreaComponent, 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, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: TextAreaConfig }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: TextAreaComponent, selector: "fdp-textarea", inputs: { height: "height", growingMaxLines: "growingMaxLines", cols: "cols", wrapType: "wrapType", readonly: "readonly", maxLength: "maxLength", showExceededText: "showExceededText", growing: "growing", stateType: "stateType", value: "value" }, host: { listeners: { "keyup": "handleBackPress($event)" } }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: TextAreaComponent, selector: "fdp-textarea", inputs: { height: "height", growingMaxLines: "growingMaxLines", cols: "cols", wrapType: "wrapType", readonly: "readonly", maxLength: "maxLength", showExceededText: "showExceededText", growing: "growing", value: "value" }, host: { listeners: { "keyup": "handleBackPress($event)" } }, providers: [
             {
                 provide: FD_FORM_FIELD_CONTROL,
                 useExisting: TextAreaComponent,
@@ -2516,8 +2373,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], growing: [{
                 type: Input
-            }], stateType: [{
-                type: Input
             }], value: [{
                 type: Input
             }], _textareaCounter: [{
@@ -2534,7 +2389,7 @@ class DynamicFormGeneratorEditorComponent extends BaseDynamicFormGeneratorContro
         super();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorEditorComponent, selector: "fdp-dynamic-form-generator-editor", usesInheritance: true, ngImport: i0, 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", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: TextAreaComponent, selector: "fdp-textarea", inputs: ["height", "growingMaxLines", "cols", "wrapType", "readonly", "maxLength", "showExceededText", "growing", "stateType", "value"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorEditorComponent, selector: "fdp-dynamic-form-generator-editor", usesInheritance: true, ngImport: i0, 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", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: TextAreaComponent, selector: "fdp-textarea", inputs: ["height", "growingMaxLines", "cols", "wrapType", "readonly", "maxLength", "showExceededText", "growing", "value"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorEditorComponent, decorators: [{
             type: Component,
@@ -2576,7 +2431,7 @@ class FdpSelectionChangeEvent {
     constructor(payload // Contains selected item
     ) {
         this.payload = payload;
-        warnOnce$1('FdpSelectionChangeEvent will be removed in future versions in favour of plain value emission');
+        warnOnce('FdpSelectionChangeEvent will be removed in future versions in favour of plain value emission');
     }
 }
 class BaseSelect extends CollectionBaseInput {
@@ -2942,22 +2797,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
             }] } });
 
 class SelectComponent extends BaseSelect {
-    /**
-     * @deprecated
-     * Holds the control state of select
-     */
-    set selectState(state) {
-        if (isDevMode()) {
-            warnOnce$1('"selectState" is deprecated. Use "state" instead');
-        }
-        super.state = state;
-    }
-    get selectState() {
-        if (isDevMode()) {
-            warnOnce$1('"selectState" is deprecated. Use "state" instead');
-        }
-        return super.state;
-    }
     /**
      * Directly sets value to the component that at the ends up at writeValue as well fires
      * change detections
@@ -3046,7 +2885,7 @@ class SelectComponent extends BaseSelect {
         element.setAttribute('style', 'width: ' + proportion + '%; max-width: ' + proportion + '%');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", 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$2.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.1.0", type: SelectComponent, selector: "fdp-select", inputs: { selectState: "selectState", value: "value", inline: "inline" }, providers: [{ 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]=\"value\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($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.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-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:none;-moz-appearance:none;-webkit-appearance: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: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;height:2.25rem;justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:2.25rem;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{background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle)}.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);z-index:5}.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-error{background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle)}.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);z-index:5}.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-warning{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.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);z-index:5}.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-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);z-index:5}.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-information{background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle)}.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);z-index:5}.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-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)}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius)}.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)}.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);border-radius:var(--fdInput_ReadOnly_Border_Radius);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{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);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);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.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background: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 .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 .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 .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 .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 .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 .fd-select__button{height:100%;margin-left:.25rem}.fd-select__control .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button{margin-left:0;margin-right:.25rem}.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-expanded,.fd-select__control[aria-expanded=true]{box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-expanded .fd-select__button,.fd-select__control[aria-expanded=true] .fd-select__button{--fdInput_Group_Button_Text_Color:var(--sapButton_Active_TextColor);--fdInput_Group_Button_Background:var(--sapField_BackgroundStyle);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control.is-expanded[dir=rtl] .fd-select__button,.fd-select__control[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-expanded .fd-select__button,[dir=rtl] .fd-select__control[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-expanded.is-focus,.fd-select__control.is-expanded:focus,.fd-select__control[aria-expanded=true].is-focus,.fd-select__control[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-expanded.is-hover .fd-select__button,.fd-select__control.is-expanded:hover .fd-select__button,.fd-select__control[aria-expanded=true].is-hover .fd-select__button,.fd-select__control[aria-expanded=true]:hover .fd-select__button{--fdInput_Group_Button_Text_Color:var(--sapButton_Active_TextColor);--fdInput_Group_Button_Background:var(--sapField_BackgroundStyle);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background-color:var(--sapButton_Selected_Hover_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color_Hover);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control.is-expanded.is-hover[dir=rtl] .fd-select__button,.fd-select__control.is-expanded:hover[dir=rtl] .fd-select__button,.fd-select__control[aria-expanded=true].is-hover[dir=rtl] .fd-select__button,.fd-select__control[aria-expanded=true]:hover[dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-expanded.is-hover .fd-select__button,[dir=rtl] .fd-select__control.is-expanded:hover .fd-select__button,[dir=rtl] .fd-select__control[aria-expanded=true].is-hover .fd-select__button,[dir=rtl] .fd-select__control[aria-expanded=true]:hover .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color_Hover)}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.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_Success_Box_Shadow_Hover);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Success_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-success.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-success[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-success.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-success[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-success.is-expanded.is-focus,.fd-select__control.is-success.is-expanded:focus,.fd-select__control.is-success[aria-expanded=true].is-focus,.fd-select__control.is-success[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.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_Error_Box_Shadow_Hover);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Error_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-error.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-error[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-error.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-error[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-error.is-expanded.is-focus,.fd-select__control.is-error.is-expanded:focus,.fd-select__control.is-error[aria-expanded=true].is-focus,.fd-select__control.is-error[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.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_Warning_Box_Shadow_Hover);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-warning.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-warning[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-warning.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-warning[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-warning.is-expanded.is-focus,.fd-select__control.is-warning.is-expanded:focus,.fd-select__control.is-warning[aria-expanded=true].is-focus,.fd-select__control.is-warning[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.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_Warning_Box_Shadow_Hover);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-alert.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-alert[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-alert.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-alert[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-alert.is-expanded.is-focus,.fd-select__control.is-alert.is-expanded:focus,.fd-select__control.is-alert[aria-expanded=true].is-focus,.fd-select__control.is-alert[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.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_Information_Box_Shadow_Hover);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Information_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-information.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-information[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-information.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-information[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-information.is-expanded.is-focus,.fd-select__control.is-information.is-expanded:focus,.fd-select__control.is-information[aria-expanded=true].is-focus,.fd-select__control.is-information[aria-expanded=true]:focus{box-shadow:none;z-index:5}.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: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7$2.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i7$2.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: SelectComponent, selector: "fdp-select", inputs: { value: "value", inline: "inline" }, providers: [{ 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]=\"value\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($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.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-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:none;-moz-appearance:none;-webkit-appearance: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: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;height:2.25rem;justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:2.25rem;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{background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle)}.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);z-index:5}.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-error{background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle)}.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);z-index:5}.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-warning{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.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);z-index:5}.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-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);z-index:5}.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-information{background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle)}.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);z-index:5}.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-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)}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius)}.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)}.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);border-radius:var(--fdInput_ReadOnly_Border_Radius);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{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);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);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.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background: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 .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 .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 .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 .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 .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 .fd-select__button{height:100%;margin-left:.25rem}.fd-select__control .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button{margin-left:0;margin-right:.25rem}.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-expanded,.fd-select__control[aria-expanded=true]{box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-expanded .fd-select__button,.fd-select__control[aria-expanded=true] .fd-select__button{--fdInput_Group_Button_Text_Color:var(--sapButton_Active_TextColor);--fdInput_Group_Button_Background:var(--sapField_BackgroundStyle);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control.is-expanded[dir=rtl] .fd-select__button,.fd-select__control[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-expanded .fd-select__button,[dir=rtl] .fd-select__control[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-expanded.is-focus,.fd-select__control.is-expanded:focus,.fd-select__control[aria-expanded=true].is-focus,.fd-select__control[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-expanded.is-hover .fd-select__button,.fd-select__control.is-expanded:hover .fd-select__button,.fd-select__control[aria-expanded=true].is-hover .fd-select__button,.fd-select__control[aria-expanded=true]:hover .fd-select__button{--fdInput_Group_Button_Text_Color:var(--sapButton_Active_TextColor);--fdInput_Group_Button_Background:var(--sapField_BackgroundStyle);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background-color:var(--sapButton_Selected_Hover_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color_Hover);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control.is-expanded.is-hover[dir=rtl] .fd-select__button,.fd-select__control.is-expanded:hover[dir=rtl] .fd-select__button,.fd-select__control[aria-expanded=true].is-hover[dir=rtl] .fd-select__button,.fd-select__control[aria-expanded=true]:hover[dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-expanded.is-hover .fd-select__button,[dir=rtl] .fd-select__control.is-expanded:hover .fd-select__button,[dir=rtl] .fd-select__control[aria-expanded=true].is-hover .fd-select__button,[dir=rtl] .fd-select__control[aria-expanded=true]:hover .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color_Hover)}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.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_Success_Box_Shadow_Hover);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Success_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-success.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-success[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-success.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-success[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-success.is-expanded.is-focus,.fd-select__control.is-success.is-expanded:focus,.fd-select__control.is-success[aria-expanded=true].is-focus,.fd-select__control.is-success[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.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_Error_Box_Shadow_Hover);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Error_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-error.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-error[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-error.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-error[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-error.is-expanded.is-focus,.fd-select__control.is-error.is-expanded:focus,.fd-select__control.is-error[aria-expanded=true].is-focus,.fd-select__control.is-error[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.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_Warning_Box_Shadow_Hover);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-warning.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-warning[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-warning.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-warning[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-warning.is-expanded.is-focus,.fd-select__control.is-warning.is-expanded:focus,.fd-select__control.is-warning[aria-expanded=true].is-focus,.fd-select__control.is-warning[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.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_Warning_Box_Shadow_Hover);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-alert.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-alert[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-alert.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-alert[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-alert.is-expanded.is-focus,.fd-select__control.is-alert.is-expanded:focus,.fd-select__control.is-alert[aria-expanded=true].is-focus,.fd-select__control.is-alert[aria-expanded=true]:focus{box-shadow:none;z-index:5}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.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_Information_Box_Shadow_Hover);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapButton_Selected_Background);border-left-color:var(--fdSelect_Expanded_Button_Border_Left_Color);box-shadow:var(--fdInput_Information_Box_Shadow_Hover);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{color:var(--fdInput_Group_Button_Text_Color)}.fd-select__control.is-information.is-expanded[dir=rtl] .fd-select__button,.fd-select__control.is-information[aria-expanded=true][dir=rtl] .fd-select__button,[dir=rtl] .fd-select__control.is-information.is-expanded .fd-select__button,[dir=rtl] .fd-select__control.is-information[aria-expanded=true] .fd-select__button{border-left-color:transparent;border-right-color:var(--fdSelect_Expanded_Button_Border_Left_Color)}.fd-select__control.is-information.is-expanded.is-focus,.fd-select__control.is-information.is-expanded:focus,.fd-select__control.is-information[aria-expanded=true].is-focus,.fd-select__control.is-information[aria-expanded=true]:focus{box-shadow:none;z-index:5}.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: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7$2.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i7$2.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.1.0", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
@@ -3081,9 +2920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 }, {
                     type: Inject,
                     args: [FD_FORM_FIELD_CONTROL]
-                }] }]; }, propDecorators: { selectState: [{
-                type: Input
-            }], value: [{
+                }] }]; }, propDecorators: { value: [{
                 type: Input
             }], inline: [{
                 type: Input
@@ -3098,7 +2935,7 @@ class DynamicFormGeneratorSelectComponent extends BaseDynamicFormGeneratorContro
         super();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorSelectComponent, selector: "fdp-dynamic-form-generator-select", usesInheritance: true, ngImport: i0, 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", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: SelectComponent, selector: "fdp-select", inputs: ["selectState", "value", "inline"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorSelectComponent, selector: "fdp-dynamic-form-generator-select", usesInheritance: true, ngImport: i0, 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", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: SelectComponent, selector: "fdp-select", inputs: ["value", "inline"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorSelectComponent, decorators: [{
             type: Component,
@@ -3126,39 +2963,6 @@ class PlatformDatePickerComponent extends BaseInput {
     get value() {
         return super.getValue();
     }
-    /**
-     * @deprecated use i18n capabilities instead (being translated in core date picker)
-     * Aria label for the date picker input.
-     */
-    set dateInputLabel(value) {
-        warnOnce$1('Property dateInputLabel is deprecated. Use i18n capabilities (being translated in core date picker) instead.');
-        this._dateInputLabel = value;
-    }
-    get dateInputLabel() {
-        return this._dateInputLabel;
-    }
-    /**
-     * @deprecated use i18n capabilities instead (being translated in core date picker)
-     * Aria label for the datepicker input.
-     */
-    set dateRangeInputLabel(value) {
-        warnOnce$1('Property dateRangeInputLabel is deprecated. Use i18n capabilities (being translated in core date picker) instead.');
-        this._dateRangeInputLabel = value;
-    }
-    get dateRangeInputLabel() {
-        return this._dateRangeInputLabel;
-    }
-    /**
-     * @deprecated use i18n capabilities instead (being translated in core date picker)
-     * Aria label for the button to show/hide the calendar.
-     */
-    set displayCalendarToggleLabel(value) {
-        warnOnce$1('Property displayCalendarToggleLabel is deprecated. Use i18n capabilities (being translated in core date picker) instead.');
-        this._displayCalendarToggleLabel = value;
-    }
-    get displayCalendarToggleLabel() {
-        return this._displayCalendarToggleLabel;
-    }
     /**
      *  The state of the form control - applies css classes.
      *  Can be `success`, `error`, `warning`, `information` or blank for default.
@@ -3172,23 +2976,6 @@ class PlatformDatePickerComponent extends BaseInput {
         }
         return super.state;
     }
-    /**
-     * @deprecated
-     *  The state of the form control - applies css classes.
-     *  Can be `success`, `error`, `warning`, `information` or blank for default.
-     */
-    set datepickerState(state) {
-        if (isDevMode()) {
-            warnOnce$1('"datepickerState" is deprecated. Use "state" instead');
-        }
-        this.state = state;
-    }
-    get datepickerState() {
-        if (isDevMode()) {
-            warnOnce$1('"datepickerState" is deprecated. Use "state" instead');
-        }
-        return this.state;
-    }
     /** @hidden */
     constructor(_changeDetectorRef, elementRef, ngControl, controlContainer, ngForm, formField, formControl, _dateTimeAdapter, _dateTimeFormats) {
         super(_changeDetectorRef, elementRef, ngControl, controlContainer, ngForm, formField, formControl);
@@ -3289,17 +3076,14 @@ class PlatformDatePickerComponent extends BaseInput {
         this._datePickerValid = true;
         /**
          * Function used to disable certain dates in the calendar.
-         * @param value
          */
         this.disableFunction = () => false;
         /**
          * Function used to disable certain dates in the calendar for the range start selection.
-         * @param value
          */
         this.disableRangeStartFunction = () => false;
         /**
          * Function used to disable certain dates in the calendar for the range end selection.
-         * @param value
          */
         this.disableRangeEndFunction = () => false;
         /**
@@ -3358,13 +3142,13 @@ class PlatformDatePickerComponent extends BaseInput {
         this._changeDetectorRef.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerComponent, 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: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i2$2.DatetimeAdapter, optional: true }, { token: DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformDatePickerComponent, selector: "fdp-date-picker", inputs: { value: "value", type: "type", selectedDate: "selectedDate", selectedRangeDate: "selectedRangeDate", startingDayOfWeek: "startingDayOfWeek", rangeHoverEffect: "rangeHoverEffect", useValidation: "useValidation", dateInputLabel: "dateInputLabel", dateRangeInputLabel: "dateRangeInputLabel", displayCalendarToggleLabel: "displayCalendarToggleLabel", showTodayButton: "showTodayButton", todayButtonLabel: "todayButtonLabel", allowNull: "allowNull", activeView: "activeView", placement: "placement", appendTo: "appendTo", closeOnDateChoose: "closeOnDateChoose", state: "state", datepickerState: "datepickerState", buttonFocusable: "buttonFocusable", specialDaysRules: "specialDaysRules", yearGrid: "yearGrid", aggregatedYearGrid: "aggregatedYearGrid", markWeekends: "markWeekends", showWeekNumbers: "showWeekNumbers", isOpen: "isOpen", inline: "inline", processInputOnBlur: "processInputOnBlur", preventScrollOnFocus: "preventScrollOnFocus", disableFunction: "disableFunction", disableRangeStartFunction: "disableRangeStartFunction", disableRangeEndFunction: "disableRangeEndFunction" }, outputs: { isOpenChange: "isOpenChange", selectedDateChange: "selectedDateChange", selectedRangeDateChange: "selectedRangeDateChange", activeViewChange: "activeViewChange" }, host: { listeners: { "blur": "onTouched()" } }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformDatePickerComponent, multi: true }], viewQueries: [{ propertyName: "fdDatePickerComponent", first: true, predicate: DatePickerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-date-picker\n    [inputId]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [type]=\"type\"\n    [state]=\"state\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [selectedDate]=\"selectedDate\"\n    [showTodayButton]=\"showTodayButton\"\n    [todayButtonLabel]=\"todayButtonLabel\"\n    [selectedRangeDate]=\"selectedRangeDate\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [rangeHoverEffect]=\"rangeHoverEffect\"\n    [useValidation]=\"useValidation\"\n    [dateInputLabel]=\"dateInputLabel\"\n    [dateRangeInputLabel]=\"dateRangeInputLabel\"\n    [displayCalendarToggleLabel]=\"displayCalendarToggleLabel\"\n    [allowNull]=\"allowNull\"\n    [activeView]=\"activeView\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [disabled]=\"disabled\"\n    [closeOnDateChoose]=\"closeOnDateChoose\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [isOpen]=\"isOpen\"\n    [disableFunction]=\"disableFunction\"\n    [disableRangeStartFunction]=\"disableRangeStartFunction\"\n    [disableRangeEndFunction]=\"disableRangeEndFunction\"\n    [inline]=\"inline\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDateChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (selectedDateChange)=\"handleSelectedDateChange($event)\"\n    (selectedRangeDateChange)=\"handleSelectedRangeDateChange($event)\"\n>\n    <ng-content></ng-content>\n</fd-date-picker>\n", dependencies: [{ kind: "component", type: i3$3.DatePickerComponent, selector: "fd-date-picker", inputs: ["type", "placeholder", "inputId", "required", "message", "messageTriggers", "selectedDate", "selectedRangeDate", "startingDayOfWeek", "rangeHoverEffect", "useValidation", "dateInputLabel", "dateRangeInputLabel", "displayCalendarToggleLabel", "valueStateSuccessMessage", "valueStateInformationMessage", "valueStateWarningMessage", "valueStateErrorMessage", "allowNull", "activeView", "placement", "appendTo", "disabled", "closeOnDateChoose", "showTodayButton", "todayButtonLabel", "previousButtonDisableFunction", "nextButtonDisableFunction", "state", "buttonFocusable", "specialDaysRules", "yearGrid", "aggregatedYearGrid", "markWeekends", "showWeekNumbers", "isOpen", "inline", "ariaLabelledBy", "processInputOnBlur", "preventScrollOnFocus", "disableFunction", "disableRangeStartFunction", "disableRangeEndFunction"], outputs: ["isOpenChange", "selectedDateChange", "selectedRangeDateChange", "activeViewChange"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformDatePickerComponent, selector: "fdp-date-picker", inputs: { value: "value", type: "type", selectedDate: "selectedDate", selectedRangeDate: "selectedRangeDate", startingDayOfWeek: "startingDayOfWeek", rangeHoverEffect: "rangeHoverEffect", useValidation: "useValidation", showTodayButton: "showTodayButton", todayButtonLabel: "todayButtonLabel", allowNull: "allowNull", activeView: "activeView", placement: "placement", appendTo: "appendTo", closeOnDateChoose: "closeOnDateChoose", state: "state", buttonFocusable: "buttonFocusable", specialDaysRules: "specialDaysRules", yearGrid: "yearGrid", aggregatedYearGrid: "aggregatedYearGrid", markWeekends: "markWeekends", showWeekNumbers: "showWeekNumbers", isOpen: "isOpen", inline: "inline", processInputOnBlur: "processInputOnBlur", preventScrollOnFocus: "preventScrollOnFocus", disableFunction: "disableFunction", disableRangeStartFunction: "disableRangeStartFunction", disableRangeEndFunction: "disableRangeEndFunction" }, outputs: { isOpenChange: "isOpenChange", selectedDateChange: "selectedDateChange", selectedRangeDateChange: "selectedRangeDateChange", activeViewChange: "activeViewChange" }, host: { listeners: { "blur": "onTouched()" } }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformDatePickerComponent, multi: true }], viewQueries: [{ propertyName: "fdDatePickerComponent", first: true, predicate: DatePickerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-date-picker\n    [inputId]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [type]=\"type\"\n    [state]=\"state\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [selectedDate]=\"selectedDate\"\n    [showTodayButton]=\"showTodayButton\"\n    [todayButtonLabel]=\"todayButtonLabel\"\n    [selectedRangeDate]=\"selectedRangeDate\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [rangeHoverEffect]=\"rangeHoverEffect\"\n    [useValidation]=\"useValidation\"\n    [allowNull]=\"allowNull\"\n    [activeView]=\"activeView\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [disabled]=\"disabled\"\n    [closeOnDateChoose]=\"closeOnDateChoose\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [isOpen]=\"isOpen\"\n    [disableFunction]=\"disableFunction\"\n    [disableRangeStartFunction]=\"disableRangeStartFunction\"\n    [disableRangeEndFunction]=\"disableRangeEndFunction\"\n    [inline]=\"inline\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDateChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (selectedDateChange)=\"handleSelectedDateChange($event)\"\n    (selectedRangeDateChange)=\"handleSelectedRangeDateChange($event)\"\n>\n    <ng-content></ng-content>\n</fd-date-picker>\n", dependencies: [{ kind: "component", type: i3$3.DatePickerComponent, selector: "fd-date-picker", inputs: ["type", "placeholder", "inputId", "required", "message", "messageTriggers", "selectedDate", "selectedRangeDate", "startingDayOfWeek", "rangeHoverEffect", "useValidation", "allowNull", "activeView", "placement", "appendTo", "disabled", "closeOnDateChoose", "showTodayButton", "todayButtonLabel", "previousButtonDisableFunction", "nextButtonDisableFunction", "state", "buttonFocusable", "specialDaysRules", "yearGrid", "aggregatedYearGrid", "markWeekends", "showWeekNumbers", "isOpen", "inline", "ariaLabelledBy", "processInputOnBlur", "preventScrollOnFocus", "disableFunction", "disableRangeStartFunction", "disableRangeEndFunction"], outputs: ["isOpenChange", "selectedDateChange", "selectedRangeDateChange", "activeViewChange"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fdp-date-picker', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformDatePickerComponent, multi: true }], host: {
                         '(blur)': 'onTouched()'
-                    }, template: "<fd-date-picker\n    [inputId]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [type]=\"type\"\n    [state]=\"state\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [selectedDate]=\"selectedDate\"\n    [showTodayButton]=\"showTodayButton\"\n    [todayButtonLabel]=\"todayButtonLabel\"\n    [selectedRangeDate]=\"selectedRangeDate\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [rangeHoverEffect]=\"rangeHoverEffect\"\n    [useValidation]=\"useValidation\"\n    [dateInputLabel]=\"dateInputLabel\"\n    [dateRangeInputLabel]=\"dateRangeInputLabel\"\n    [displayCalendarToggleLabel]=\"displayCalendarToggleLabel\"\n    [allowNull]=\"allowNull\"\n    [activeView]=\"activeView\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [disabled]=\"disabled\"\n    [closeOnDateChoose]=\"closeOnDateChoose\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [isOpen]=\"isOpen\"\n    [disableFunction]=\"disableFunction\"\n    [disableRangeStartFunction]=\"disableRangeStartFunction\"\n    [disableRangeEndFunction]=\"disableRangeEndFunction\"\n    [inline]=\"inline\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDateChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (selectedDateChange)=\"handleSelectedDateChange($event)\"\n    (selectedRangeDateChange)=\"handleSelectedRangeDateChange($event)\"\n>\n    <ng-content></ng-content>\n</fd-date-picker>\n" }]
+                    }, template: "<fd-date-picker\n    [inputId]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [type]=\"type\"\n    [state]=\"state\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [selectedDate]=\"selectedDate\"\n    [showTodayButton]=\"showTodayButton\"\n    [todayButtonLabel]=\"todayButtonLabel\"\n    [selectedRangeDate]=\"selectedRangeDate\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [rangeHoverEffect]=\"rangeHoverEffect\"\n    [useValidation]=\"useValidation\"\n    [allowNull]=\"allowNull\"\n    [activeView]=\"activeView\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [disabled]=\"disabled\"\n    [closeOnDateChoose]=\"closeOnDateChoose\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [isOpen]=\"isOpen\"\n    [disableFunction]=\"disableFunction\"\n    [disableRangeStartFunction]=\"disableRangeStartFunction\"\n    [disableRangeEndFunction]=\"disableRangeEndFunction\"\n    [inline]=\"inline\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDateChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (selectedDateChange)=\"handleSelectedDateChange($event)\"\n    (selectedRangeDateChange)=\"handleSelectedRangeDateChange($event)\"\n>\n    <ng-content></ng-content>\n</fd-date-picker>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -3416,12 +3200,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], useValidation: [{
                 type: Input
-            }], dateInputLabel: [{
-                type: Input
-            }], dateRangeInputLabel: [{
-                type: Input
-            }], displayCalendarToggleLabel: [{
-                type: Input
             }], showTodayButton: [{
                 type: Input
             }], todayButtonLabel: [{
@@ -3438,8 +3216,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], state: [{
                 type: Input
-            }], datepickerState: [{
-                type: Input
             }], buttonFocusable: [{
                 type: Input
             }], specialDaysRules: [{
@@ -3495,7 +3271,7 @@ class DynamicFormGeneratorDatepickerComponent extends BaseDynamicFormGeneratorCo
         super();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorDatepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorDatepickerComponent, selector: "fdp-dynamic-form-generator-datepicker", usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-date-picker\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [name]=\"name\"\n            [formControlName]=\"name\"\n            [inline]=\"formItem.guiOptions?.inline !== false\"\n            [allowNull]=\"false\"\n        ></fdp-date-picker>\n    </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: PlatformDatePickerComponent, selector: "fdp-date-picker", inputs: ["value", "type", "selectedDate", "selectedRangeDate", "startingDayOfWeek", "rangeHoverEffect", "useValidation", "dateInputLabel", "dateRangeInputLabel", "displayCalendarToggleLabel", "showTodayButton", "todayButtonLabel", "allowNull", "activeView", "placement", "appendTo", "closeOnDateChoose", "state", "datepickerState", "buttonFocusable", "specialDaysRules", "yearGrid", "aggregatedYearGrid", "markWeekends", "showWeekNumbers", "isOpen", "inline", "processInputOnBlur", "preventScrollOnFocus", "disableFunction", "disableRangeStartFunction", "disableRangeEndFunction"], outputs: ["isOpenChange", "selectedDateChange", "selectedRangeDateChange", "activeViewChange"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: DynamicFormGeneratorDatepickerComponent, selector: "fdp-dynamic-form-generator-datepicker", usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-date-picker\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [name]=\"name\"\n            [formControlName]=\"name\"\n            [inline]=\"formItem.guiOptions?.inline !== false\"\n            [allowNull]=\"false\"\n        ></fdp-date-picker>\n    </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: PlatformDatePickerComponent, selector: "fdp-date-picker", inputs: ["value", "type", "selectedDate", "selectedRangeDate", "startingDayOfWeek", "rangeHoverEffect", "useValidation", "showTodayButton", "todayButtonLabel", "allowNull", "activeView", "placement", "appendTo", "closeOnDateChoose", "state", "buttonFocusable", "specialDaysRules", "yearGrid", "aggregatedYearGrid", "markWeekends", "showWeekNumbers", "isOpen", "inline", "processInputOnBlur", "preventScrollOnFocus", "disableFunction", "disableRangeStartFunction", "disableRangeEndFunction"], outputs: ["isOpenChange", "selectedDateChange", "selectedRangeDateChange", "activeViewChange"] }], viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DynamicFormGeneratorDatepickerComponent, decorators: [{
             type: Component,
@@ -3581,7 +3357,7 @@ class SwitchComponent extends BaseInput {
         this.switchChange.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: SwitchComponent, 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, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: SwitchConfig }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: SwitchComponent, selector: "fdp-switch", inputs: { ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", semantic: "semantic" }, outputs: { switchChange: "switchChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SwitchComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<fd-switch\n    [id]=\"id\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [semantic]=\"semantic\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledby\"\n    [checked]=\"switchCurrentValue\"\n    (checkedChange)=\"onValueChange($event)\"\n></fd-switch>\n", dependencies: [{ kind: "component", type: i3$4.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "disabled", "id", "name", "required", "checked", "semantic", "ariaLabel", "ariaLabelledby", "ariaLabelledBy", "semanticAcceptLabel", "semanticDeclineLabel"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: SwitchComponent, selector: "fdp-switch", inputs: { ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", semantic: "semantic" }, outputs: { switchChange: "switchChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SwitchComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<fd-switch\n    [id]=\"id\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [semantic]=\"semantic\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledby\"\n    [checked]=\"switchCurrentValue\"\n    (checkedChange)=\"onValueChange($event)\"\n></fd-switch>\n", dependencies: [{ kind: "component", type: i3$4.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "disabled", "id", "name", "required", "checked", "semantic", "ariaLabel", "ariaLabelledBy"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: SwitchComponent, decorators: [{
             type: Component,
@@ -4296,7 +4072,7 @@ class PlatformMultiInputMobileComponent extends MobileModeBase {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DialogService }, { token: MULTIINPUT_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformMultiInputMobileComponent, selector: "fdp-multi-input-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"_handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\" class=\"fdp-multi-dialog-input\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"_handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"_handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".fdp-multi-dialog-input{display:inline!important}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$3.BarElementDirective, selector: "fd-bar-element", inputs: ["isTitle", "fullWidth"] }, { kind: "component", type: i2$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformMultiInputMobileComponent, selector: "fdp-multi-input-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"_handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\" class=\"fdp-multi-dialog-input\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"_handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"_handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".fdp-multi-dialog-input{display:inline!important}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$3.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileComponent, decorators: [{
             type: Component,
@@ -4800,7 +4576,7 @@ class PlatformMultiInputComponent extends BaseMultiInput {
                 multi: true
             },
             contentDensityObserverProviders()
-        ], viewQueries: [{ propertyName: "listTemplateDD", first: true, predicate: ListComponent$1, descendants: true }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_listItems", predicate: BaseListItem, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fd-multi-input\">\n    <ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n</div>\n<ng-template #desktopTemplate>\n    <fd-popover\n        additionalBodyClass=\"fdp-multi-input__list-container\"\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"(!autoResize && minWidth) || 0\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\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-input-group\n        [button]=\"true\"\n        [buttonFocusable]=\"buttonFocusable\"\n        [isControl]=\"true\"\n        glyph=\"value-help\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        (keydown)=\"removeSelectedTokens($event)\"\n        (addOnButtonClicked)=\"addOnButtonClick($event)\"\n        (click)=\"onInputGroupClicked()\"\n        [glyphAriaLabel]=\"glyphAriaLabel\"\n    >\n        <span [attr.id]=\"tokenHiddenId\" aria-hidden=\"true\" class=\"fdp-multi-input__invisible-text\"\n            >Contains {{ selected.length || 'no' }} token</span\n        >\n        <fd-tokenizer\n            *ngIf=\"selected\"\n            [tokenizerFocusable]=\"false\"\n            [compactCollapse]=\"true\"\n            #tokenizer\n            class=\"fd-multi-input-tokenizer-custom\"\n            (moreClickedEvent)=\"moreClicked()\"\n            tabindex=\"-1\"\n            role=\"listbox\"\n        >\n            <fd-token\n                [readOnly]=\"disabled\"\n                (onCloseClick)=\"removeToken(token)\"\n                *ngFor=\"let token of selected; let i = index\"\n                [attr.aria-posinset]=\"i\"\n                [attr.aria-setsize]=\"selected.length\"\n            >\n                <span>{{ token.label | displayFnPipe : displayFn }}</span>\n            </fd-token>\n\n            <input\n                #searchInputElement\n                type=\"text\"\n                class=\"fd-input fd-multi-input-tokenizer-input fd-tokenizer__input\"\n                fdp-auto-complete\n                autocomplete=\"off\"\n                (onComplete)=\"_onAutoComplete($event)\"\n                (keydown.enter)=\"_onKeydownEnter($event)\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [inputText]=\"inputText\"\n                [options]=\"_suggestions\"\n                fd-input-group-input\n                fd-form-control\n                [attr.id]=\"id\"\n                [disabled]=\"disabled\"\n                [(ngModel)]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged()\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                (blur)=\"tokenizer._hideTokens()\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                aria-haspopup=\"listbox\"\n                [attr.aria-readonly]=\"readonly\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-required]=\"required\"\n                [attr.aria-describedby]=\"tokenHiddenId\"\n                aria-roledescription=\"Multi Value Input\"\n                fdkInitialFocus\n                [enabled]=\"autofocus\"\n            />\n        </fd-tokenizer>\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <fdp-list\n        [noBorder]=\"true\"\n        #listTemplateDD\n        [hasByLine]=\"hasByLine\"\n        [selectionMode]=\"selectionMode\"\n        *ngIf=\"_suggestions && _suggestions.length\"\n        role=\"listbox\"\n        aria-multiselectable=\"true\"\n    >\n        <ng-container *ngIf=\"!isGroup\">\n            <fdp-standard-list-item\n                *ngFor=\"let listItem of _suggestions\"\n                [title]=\"listItem.label\"\n                [description]=\"listItem.description || ''\"\n                [avatarSrc]=\"listItem.avatarSrc\"\n                [value]=\"listItem.value\"\n                (itemSelected)=\"selectionMode !== 'multi' && addToArray(listItem, true)\"\n                (itemCheckboxSelected)=\"_checkboxSelected(listItem, $event)\"\n                (buttonClicked)=\"deleteToken(listItem)\"\n                role=\"option\"\n            >\n            </fdp-standard-list-item>\n        </ng-container>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <fdp-list-group-header [groupHeaderTitle]=\"group.label\"></fdp-list-group-header>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <fdp-standard-list-item\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    [title]=\"optionItem.label\"\n                    [value]=\"optionItem.value\"\n                    (itemSelected)=\"addToArray(optionItem, true)\"\n                    (itemCheckboxSelected)=\"addToArray(optionItem, false)\"\n                    (buttonClicked)=\"deleteToken(optionItem)\"\n                    role=\"option\"\n                >\n                </fdp-standard-list-item>\n            </ng-container>\n        </ng-container>\n    </fdp-list>\n</ng-template>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-input__list-container.fd-popover__body{width:100%;overflow:hidden;position:relative}.fdp-multi-input__invisible-text{display:none!important}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i7$3.ListComponent, selector: "fdp-list", inputs: ["selectedItems", "ariaSetsize", "ariaMultiselectable", "loadTitle", "loadingLabel", "delayTime", "itemSize", "loadMore", "loadOnScroll", "role", "listType", "maxHeight", "noBorder", "scrollOffsetPercentage", "selection", "selectionMode", "value", "rowSelection", "dataSource", "navigated", "navigationIndicator", "hasByLine", "hasObject", "unreadIndicator"], outputs: ["selectedItemChange"] }, { kind: "component", type: i7$3.ListGroupHeaderComponent, selector: "fdp-list-group-header", inputs: ["groupHeaderTitle", "grpheaderTitle"] }, { kind: "component", type: i7$3.StandardListItemComponent, selector: "fdp-standard-list-item" }, { kind: "component", type: i8.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i8.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "directive", type: i3$2.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "pipe", type: i3$2.DisplayFnPipe, name: "displayFnPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "listTemplateDD", first: true, predicate: ListComponent$1, descendants: true }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_listItems", predicate: BaseListItem, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fd-multi-input\">\n    <ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n</div>\n<ng-template #desktopTemplate>\n    <fd-popover\n        additionalBodyClass=\"fdp-multi-input__list-container\"\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"(!autoResize && minWidth) || 0\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\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-input-group\n        [button]=\"true\"\n        [buttonFocusable]=\"buttonFocusable\"\n        [isControl]=\"true\"\n        glyph=\"value-help\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        (keydown)=\"removeSelectedTokens($event)\"\n        (addOnButtonClicked)=\"addOnButtonClick($event)\"\n        (click)=\"onInputGroupClicked()\"\n        [glyphAriaLabel]=\"glyphAriaLabel\"\n    >\n        <span [attr.id]=\"tokenHiddenId\" aria-hidden=\"true\" class=\"fdp-multi-input__invisible-text\"\n            >Contains {{ selected.length || 'no' }} token</span\n        >\n        <fd-tokenizer\n            *ngIf=\"selected\"\n            [tokenizerFocusable]=\"false\"\n            [compactCollapse]=\"true\"\n            #tokenizer\n            class=\"fd-multi-input-tokenizer-custom\"\n            (moreClickedEvent)=\"moreClicked()\"\n            tabindex=\"-1\"\n            role=\"listbox\"\n        >\n            <fd-token\n                [readOnly]=\"disabled\"\n                (onCloseClick)=\"removeToken(token)\"\n                *ngFor=\"let token of selected; let i = index\"\n                [attr.aria-posinset]=\"i\"\n                [attr.aria-setsize]=\"selected.length\"\n            >\n                <span>{{ token.label | displayFnPipe : displayFn }}</span>\n            </fd-token>\n\n            <input\n                #searchInputElement\n                type=\"text\"\n                class=\"fd-input fd-multi-input-tokenizer-input fd-tokenizer__input\"\n                fdp-auto-complete\n                autocomplete=\"off\"\n                (onComplete)=\"_onAutoComplete($event)\"\n                (keydown.enter)=\"_onKeydownEnter($event)\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [inputText]=\"inputText\"\n                [options]=\"_suggestions\"\n                fd-input-group-input\n                fd-form-control\n                [attr.id]=\"id\"\n                [disabled]=\"disabled\"\n                [(ngModel)]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged()\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                (blur)=\"tokenizer._hideTokens()\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                aria-haspopup=\"listbox\"\n                [attr.aria-readonly]=\"readonly\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-required]=\"required\"\n                [attr.aria-describedby]=\"tokenHiddenId\"\n                aria-roledescription=\"Multi Value Input\"\n                fdkInitialFocus\n                [enabled]=\"autofocus\"\n            />\n        </fd-tokenizer>\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <fdp-list\n        [noBorder]=\"true\"\n        #listTemplateDD\n        [hasByLine]=\"hasByLine\"\n        [selectionMode]=\"selectionMode\"\n        *ngIf=\"_suggestions && _suggestions.length\"\n        role=\"listbox\"\n        aria-multiselectable=\"true\"\n    >\n        <ng-container *ngIf=\"!isGroup\">\n            <fdp-standard-list-item\n                *ngFor=\"let listItem of _suggestions\"\n                [title]=\"listItem.label\"\n                [description]=\"listItem.description || ''\"\n                [avatar]=\"listItem.avatarSrc\"\n                [value]=\"listItem.value\"\n                (itemSelected)=\"selectionMode !== 'multi' && addToArray(listItem, true)\"\n                (itemCheckboxSelected)=\"_checkboxSelected(listItem, $event)\"\n                (buttonClicked)=\"deleteToken(listItem)\"\n                role=\"option\"\n            >\n            </fdp-standard-list-item>\n        </ng-container>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <fdp-list-group-header [groupHeaderTitle]=\"group.label\"></fdp-list-group-header>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <fdp-standard-list-item\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    [title]=\"optionItem.label\"\n                    [value]=\"optionItem.value\"\n                    (itemSelected)=\"addToArray(optionItem, true)\"\n                    (itemCheckboxSelected)=\"addToArray(optionItem, false)\"\n                    (buttonClicked)=\"deleteToken(optionItem)\"\n                    role=\"option\"\n                >\n                </fdp-standard-list-item>\n            </ng-container>\n        </ng-container>\n    </fdp-list>\n</ng-template>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-input__list-container.fd-popover__body{width:100%;overflow:hidden;position:relative}.fdp-multi-input__invisible-text{display:none!important}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i7$3.ListComponent, selector: "fdp-list", inputs: ["selectedItems", "ariaSetsize", "ariaMultiselectable", "loadTitle", "loadingLabel", "delayTime", "itemSize", "loadMore", "loadOnScroll", "role", "listType", "maxHeight", "noBorder", "scrollOffsetPercentage", "selection", "selectionMode", "value", "rowSelection", "dataSource", "navigated", "navigationIndicator", "hasByLine", "hasObject", "unreadIndicator"], outputs: ["selectedItemChange"] }, { kind: "component", type: i7$3.ListGroupHeaderComponent, selector: "fdp-list-group-header", inputs: ["groupHeaderTitle"] }, { kind: "component", type: i7$3.StandardListItemComponent, selector: "fdp-standard-list-item" }, { kind: "component", type: i8.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i8.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "directive", type: i3$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "pipe", type: i3$2.DisplayFnPipe, name: "displayFnPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputComponent, decorators: [{
             type: Component,
@@ -4811,7 +4587,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                             multi: true
                         },
                         contentDensityObserverProviders()
-                    ], template: "<div class=\"fd-multi-input\">\n    <ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n</div>\n<ng-template #desktopTemplate>\n    <fd-popover\n        additionalBodyClass=\"fdp-multi-input__list-container\"\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"(!autoResize && minWidth) || 0\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\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-input-group\n        [button]=\"true\"\n        [buttonFocusable]=\"buttonFocusable\"\n        [isControl]=\"true\"\n        glyph=\"value-help\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        (keydown)=\"removeSelectedTokens($event)\"\n        (addOnButtonClicked)=\"addOnButtonClick($event)\"\n        (click)=\"onInputGroupClicked()\"\n        [glyphAriaLabel]=\"glyphAriaLabel\"\n    >\n        <span [attr.id]=\"tokenHiddenId\" aria-hidden=\"true\" class=\"fdp-multi-input__invisible-text\"\n            >Contains {{ selected.length || 'no' }} token</span\n        >\n        <fd-tokenizer\n            *ngIf=\"selected\"\n            [tokenizerFocusable]=\"false\"\n            [compactCollapse]=\"true\"\n            #tokenizer\n            class=\"fd-multi-input-tokenizer-custom\"\n            (moreClickedEvent)=\"moreClicked()\"\n            tabindex=\"-1\"\n            role=\"listbox\"\n        >\n            <fd-token\n                [readOnly]=\"disabled\"\n                (onCloseClick)=\"removeToken(token)\"\n                *ngFor=\"let token of selected; let i = index\"\n                [attr.aria-posinset]=\"i\"\n                [attr.aria-setsize]=\"selected.length\"\n            >\n                <span>{{ token.label | displayFnPipe : displayFn }}</span>\n            </fd-token>\n\n            <input\n                #searchInputElement\n                type=\"text\"\n                class=\"fd-input fd-multi-input-tokenizer-input fd-tokenizer__input\"\n                fdp-auto-complete\n                autocomplete=\"off\"\n                (onComplete)=\"_onAutoComplete($event)\"\n                (keydown.enter)=\"_onKeydownEnter($event)\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [inputText]=\"inputText\"\n                [options]=\"_suggestions\"\n                fd-input-group-input\n                fd-form-control\n                [attr.id]=\"id\"\n                [disabled]=\"disabled\"\n                [(ngModel)]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged()\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                (blur)=\"tokenizer._hideTokens()\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                aria-haspopup=\"listbox\"\n                [attr.aria-readonly]=\"readonly\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-required]=\"required\"\n                [attr.aria-describedby]=\"tokenHiddenId\"\n                aria-roledescription=\"Multi Value Input\"\n                fdkInitialFocus\n                [enabled]=\"autofocus\"\n            />\n        </fd-tokenizer>\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <fdp-list\n        [noBorder]=\"true\"\n        #listTemplateDD\n        [hasByLine]=\"hasByLine\"\n        [selectionMode]=\"selectionMode\"\n        *ngIf=\"_suggestions && _suggestions.length\"\n        role=\"listbox\"\n        aria-multiselectable=\"true\"\n    >\n        <ng-container *ngIf=\"!isGroup\">\n            <fdp-standard-list-item\n                *ngFor=\"let listItem of _suggestions\"\n                [title]=\"listItem.label\"\n                [description]=\"listItem.description || ''\"\n                [avatarSrc]=\"listItem.avatarSrc\"\n                [value]=\"listItem.value\"\n                (itemSelected)=\"selectionMode !== 'multi' && addToArray(listItem, true)\"\n                (itemCheckboxSelected)=\"_checkboxSelected(listItem, $event)\"\n                (buttonClicked)=\"deleteToken(listItem)\"\n                role=\"option\"\n            >\n            </fdp-standard-list-item>\n        </ng-container>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <fdp-list-group-header [groupHeaderTitle]=\"group.label\"></fdp-list-group-header>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <fdp-standard-list-item\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    [title]=\"optionItem.label\"\n                    [value]=\"optionItem.value\"\n                    (itemSelected)=\"addToArray(optionItem, true)\"\n                    (itemCheckboxSelected)=\"addToArray(optionItem, false)\"\n                    (buttonClicked)=\"deleteToken(optionItem)\"\n                    role=\"option\"\n                >\n                </fdp-standard-list-item>\n            </ng-container>\n        </ng-container>\n    </fdp-list>\n</ng-template>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-input__list-container.fd-popover__body{width:100%;overflow:hidden;position:relative}.fdp-multi-input__invisible-text{display:none!important}\n"] }]
+                    ], template: "<div class=\"fd-multi-input\">\n    <ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n</div>\n<ng-template #desktopTemplate>\n    <fd-popover\n        additionalBodyClass=\"fdp-multi-input__list-container\"\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"(!autoResize && minWidth) || 0\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\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-input-group\n        [button]=\"true\"\n        [buttonFocusable]=\"buttonFocusable\"\n        [isControl]=\"true\"\n        glyph=\"value-help\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        (keydown)=\"removeSelectedTokens($event)\"\n        (addOnButtonClicked)=\"addOnButtonClick($event)\"\n        (click)=\"onInputGroupClicked()\"\n        [glyphAriaLabel]=\"glyphAriaLabel\"\n    >\n        <span [attr.id]=\"tokenHiddenId\" aria-hidden=\"true\" class=\"fdp-multi-input__invisible-text\"\n            >Contains {{ selected.length || 'no' }} token</span\n        >\n        <fd-tokenizer\n            *ngIf=\"selected\"\n            [tokenizerFocusable]=\"false\"\n            [compactCollapse]=\"true\"\n            #tokenizer\n            class=\"fd-multi-input-tokenizer-custom\"\n            (moreClickedEvent)=\"moreClicked()\"\n            tabindex=\"-1\"\n            role=\"listbox\"\n        >\n            <fd-token\n                [readOnly]=\"disabled\"\n                (onCloseClick)=\"removeToken(token)\"\n                *ngFor=\"let token of selected; let i = index\"\n                [attr.aria-posinset]=\"i\"\n                [attr.aria-setsize]=\"selected.length\"\n            >\n                <span>{{ token.label | displayFnPipe : displayFn }}</span>\n            </fd-token>\n\n            <input\n                #searchInputElement\n                type=\"text\"\n                class=\"fd-input fd-multi-input-tokenizer-input fd-tokenizer__input\"\n                fdp-auto-complete\n                autocomplete=\"off\"\n                (onComplete)=\"_onAutoComplete($event)\"\n                (keydown.enter)=\"_onKeydownEnter($event)\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [inputText]=\"inputText\"\n                [options]=\"_suggestions\"\n                fd-input-group-input\n                fd-form-control\n                [attr.id]=\"id\"\n                [disabled]=\"disabled\"\n                [(ngModel)]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged()\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                (blur)=\"tokenizer._hideTokens()\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                aria-haspopup=\"listbox\"\n                [attr.aria-readonly]=\"readonly\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-required]=\"required\"\n                [attr.aria-describedby]=\"tokenHiddenId\"\n                aria-roledescription=\"Multi Value Input\"\n                fdkInitialFocus\n                [enabled]=\"autofocus\"\n            />\n        </fd-tokenizer>\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <fdp-list\n        [noBorder]=\"true\"\n        #listTemplateDD\n        [hasByLine]=\"hasByLine\"\n        [selectionMode]=\"selectionMode\"\n        *ngIf=\"_suggestions && _suggestions.length\"\n        role=\"listbox\"\n        aria-multiselectable=\"true\"\n    >\n        <ng-container *ngIf=\"!isGroup\">\n            <fdp-standard-list-item\n                *ngFor=\"let listItem of _suggestions\"\n                [title]=\"listItem.label\"\n                [description]=\"listItem.description || ''\"\n                [avatar]=\"listItem.avatarSrc\"\n                [value]=\"listItem.value\"\n                (itemSelected)=\"selectionMode !== 'multi' && addToArray(listItem, true)\"\n                (itemCheckboxSelected)=\"_checkboxSelected(listItem, $event)\"\n                (buttonClicked)=\"deleteToken(listItem)\"\n                role=\"option\"\n            >\n            </fdp-standard-list-item>\n        </ng-container>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <fdp-list-group-header [groupHeaderTitle]=\"group.label\"></fdp-list-group-header>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <fdp-standard-list-item\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    [title]=\"optionItem.label\"\n                    [value]=\"optionItem.value\"\n                    (itemSelected)=\"addToArray(optionItem, true)\"\n                    (itemCheckboxSelected)=\"addToArray(optionItem, false)\"\n                    (buttonClicked)=\"deleteToken(optionItem)\"\n                    role=\"option\"\n                >\n                </fdp-standard-list-item>\n            </ng-container>\n        </ng-container>\n    </fdp-list>\n</ng-template>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-input__list-container.fd-popover__body{width:100%;overflow:hidden;position:relative}.fdp-multi-input__invisible-text{display:none!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -5593,7 +5369,7 @@ class FormGeneratorFieldComponent {
         return error.heading && error.description && error.type;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGeneratorFieldComponent, deps: [{ token: FormGeneratorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGeneratorFieldComponent, selector: "fdp-form-generator-field", inputs: { field: "field", form: "form", i18n: "i18n", formFieldName: "formFieldName", formGroupNamePath: "formGroupNamePath", rank: "rank", shouldShow: "shouldShow", hintOptions: "hintOptions" }, providers: [formFieldProvider, formGroupChildProvider], viewQueries: [{ propertyName: "fieldRenderer", first: true, predicate: i0.forwardRef(function () { return FormFieldComponent; }), descendants: true }], ngImport: i0, template: "<fdp-form-field\n    [hint]=\"hintOptions\"\n    [placeholder]=\"_placeholder\"\n    [id]=\"field.formItem.id || formFieldName\"\n    [column]=\"field.formItem.guiOptions?.column || 1\"\n    [columnLayout]=\"field.formItem.guiOptions?.columnLayout\"\n    [colon]=\"field.formItem.guiOptions?.appendColon === true\"\n    [label]=\"field.formItem.message\"\n    [validators]=\"field.formItem.validators || []\"\n    [required]=\"field.formItem.required\"\n    [rank]=\"rank\"\n    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n    [noLabelLayout]=\"field.formItem.guiOptions?.noLabelLayout || false\"\n    [formGroup]=\"form\"\n    #formField\n>\n    <ng-container *ngFor=\"let error of _errorModels\">\n        <span *fdpFormFieldError=\"error.type; let directiveError\">\n            <ng-container *ngIf=\"_isAdvancedError(directiveError)\">\n                <ng-container *ngIf=\"directiveError.heading\">\n                    <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                        {{ validationError.heading }}\n                    </span>\n                </ng-container>\n                <ng-container *ngIf=\"directiveError.description\">\n                    <span *fdpFormFieldErrorDescription=\"let validationError\">\n                        {{ validationError.description }}\n                    </span>\n                </ng-container>\n            </ng-container>\n            <ng-container *ngIf=\"!_isAdvancedError(directiveError)\">\n                <span *fdpFormFieldErrorHeading=\"let validationError\">\n                    {{ error.value ? error.value : validationError }}\n                </span>\n            </ng-container>\n        </span>\n    </ng-container>\n    <ng-container\n        [formField]=\"formField\"\n        [form]=\"form\"\n        [formGroupNamePath]=\"formGroupNamePath\"\n        fdpDynamicFormControl\n        [id]=\"field.formItem.id || formFieldName\"\n        [name]=\"formFieldName\"\n        [formItem]=\"field.formItem\"\n    >\n    </ng-container>\n</fdp-form-field>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormFieldComponent, selector: "fdp-form-field", inputs: ["label", "id", "hintPlacement", "hint", "labelLayout", "noLabelLayout", "validators", "rank", "placeholder", "column", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "i18Strings", "required", "editable", "columns", "disabled", "colon", "formGroupContainer"], outputs: ["onChange", "onColumnChange"] }, { kind: "directive", type: FormFieldErrorDirective, selector: "[fdpFormFieldError]", inputs: ["fdpFormFieldErrorAs", "fdpFormFieldError", "fdpFormFieldErrorType"] }, { kind: "directive", type: FormFieldErrorHeadingDirective, selector: "[fdpFormFieldErrorHeading]", inputs: ["fdpFormFieldErrorHeadingAs", "fdpFormFieldErrorHeadingType"] }, { kind: "directive", type: FormFieldErrorDescriptionDirective, selector: "[fdpFormFieldErrorDescription]", inputs: ["fdpFormFieldErrorDescriptionAs"] }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: DynamicFormControlDirective, selector: "[fdpDynamicFormControl]", inputs: ["formItem", "id", "name", "form", "formGroupNamePath", "formField"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGeneratorFieldComponent, selector: "fdp-form-generator-field", inputs: { field: "field", form: "form", i18n: "i18n", formFieldName: "formFieldName", formGroupNamePath: "formGroupNamePath", rank: "rank", shouldShow: "shouldShow", hintOptions: "hintOptions" }, providers: [formFieldProvider, formGroupChildProvider], viewQueries: [{ propertyName: "fieldRenderer", first: true, predicate: i0.forwardRef(function () { return FormFieldComponent; }), descendants: true }], ngImport: i0, template: "<fdp-form-field\n    [hint]=\"hintOptions\"\n    [placeholder]=\"_placeholder\"\n    [id]=\"field.formItem.id || formFieldName\"\n    [column]=\"field.formItem.guiOptions?.column || 1\"\n    [columnLayout]=\"field.formItem.guiOptions?.columnLayout\"\n    [colon]=\"field.formItem.guiOptions?.appendColon === true\"\n    [label]=\"field.formItem.message\"\n    [validators]=\"field.formItem.validators || []\"\n    [required]=\"field.formItem.required\"\n    [rank]=\"rank\"\n    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n    [noLabelLayout]=\"field.formItem.guiOptions?.noLabelLayout || false\"\n    [formGroup]=\"form\"\n    #formField\n>\n    <ng-container *ngFor=\"let error of _errorModels\">\n        <span *fdpFormFieldError=\"error.type; let directiveError\">\n            <ng-container *ngIf=\"_isAdvancedError(directiveError)\">\n                <ng-container *ngIf=\"directiveError.heading\">\n                    <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                        {{ validationError.heading }}\n                    </span>\n                </ng-container>\n                <ng-container *ngIf=\"directiveError.description\">\n                    <span *fdpFormFieldErrorDescription=\"let validationError\">\n                        {{ validationError.description }}\n                    </span>\n                </ng-container>\n            </ng-container>\n            <ng-container *ngIf=\"!_isAdvancedError(directiveError)\">\n                <span *fdpFormFieldErrorHeading=\"let validationError\">\n                    {{ error.value ? error.value : validationError }}\n                </span>\n            </ng-container>\n        </span>\n    </ng-container>\n    <ng-container\n        [formField]=\"formField\"\n        [form]=\"form\"\n        [formGroupNamePath]=\"formGroupNamePath\"\n        fdpDynamicFormControl\n        [id]=\"field.formItem.id || formFieldName\"\n        [name]=\"formFieldName\"\n        [formItem]=\"field.formItem\"\n    >\n    </ng-container>\n</fdp-form-field>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormFieldComponent, selector: "fdp-form-field", inputs: ["label", "id", "hint", "noLabelLayout", "validators", "rank", "placeholder", "column", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "i18Strings", "required", "editable", "columns", "disabled", "colon", "formGroupContainer"], outputs: ["onChange", "onColumnChange"] }, { kind: "directive", type: FormFieldErrorDirective, selector: "[fdpFormFieldError]", inputs: ["fdpFormFieldErrorAs", "fdpFormFieldError", "fdpFormFieldErrorType"] }, { kind: "directive", type: FormFieldErrorHeadingDirective, selector: "[fdpFormFieldErrorHeading]", inputs: ["fdpFormFieldErrorHeadingAs", "fdpFormFieldErrorHeadingType"] }, { kind: "directive", type: FormFieldErrorDescriptionDirective, selector: "[fdpFormFieldErrorDescription]", inputs: ["fdpFormFieldErrorDescriptionAs"] }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: DynamicFormControlDirective, selector: "[fdpDynamicFormControl]", inputs: ["formItem", "id", "name", "form", "formGroupNamePath", "formField"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGeneratorFieldComponent, decorators: [{
             type: Component,
@@ -5674,65 +5450,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformCheckboxModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, declarations: [CheckboxComponent], imports: [CommonModule,
-            FormsModule,
-            CheckboxModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            FormItemModule,
-            ContentDensityModule], exports: [CheckboxComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, imports: [CommonModule,
-            FormsModule,
-            CheckboxModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            FormItemModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, declarations: [CheckboxComponent], imports: [CommonModule, FormsModule, CheckboxModule, PipeModule, FormItemModule, ContentDensityModule], exports: [CheckboxComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, imports: [CommonModule, FormsModule, CheckboxModule, PipeModule, FormItemModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [CheckboxComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        CheckboxModule,
-                        PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        FormItemModule,
-                        ContentDensityModule
-                    ],
-                    exports: [CheckboxComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    imports: [CommonModule, FormsModule, CheckboxModule, PipeModule, FormItemModule, ContentDensityModule],
+                    exports: [CheckboxComponent, ContentDensityModule]
                 }]
         }] });
 
 class PlatformCheckboxGroupModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, declarations: [CheckboxGroupComponent], imports: [CommonModule,
-            PlatformCheckboxModule,
-            FormsModule,
-            FormGroupModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [CheckboxGroupComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, imports: [CommonModule,
-            PlatformCheckboxModule,
-            FormsModule,
-            FormGroupModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, declarations: [CheckboxGroupComponent], imports: [CommonModule, PlatformCheckboxModule, FormsModule, FormGroupModule, ContentDensityModule], exports: [CheckboxGroupComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, imports: [CommonModule, PlatformCheckboxModule, FormsModule, FormGroupModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        PlatformCheckboxModule,
-                        FormsModule,
-                        FormGroupModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [CheckboxGroupComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule],
+                    imports: [CommonModule, PlatformCheckboxModule, FormsModule, FormGroupModule, ContentDensityModule],
+                    exports: [CheckboxGroupComponent, ContentDensityModule],
                     declarations: [CheckboxGroupComponent]
                 }]
         }] });
@@ -6456,7 +6195,7 @@ class ComboboxMobileComponent extends MobileModeBase {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DialogService }, { token: COMBOBOX_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: ComboboxMobileComponent, selector: "fdp-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$3.BarElementDirective, selector: "fd-bar-element", inputs: ["isTitle", "fullWidth"] }, { kind: "component", type: i2$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "component", type: i3$5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: ComboboxMobileComponent, selector: "fdp-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$3.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "component", type: i3$5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxMobileComponent, decorators: [{
             type: Component,
@@ -6645,7 +6384,7 @@ class ComboboxComponent extends BaseCombobox {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: ComboboxComponent, 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 {{ !!stateMessage && 'fdp-combobox__list--message' }}\"\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    >\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        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\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-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (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\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: [".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: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "pipe", type: i3$2.SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], 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 {{ !!stateMessage && 'fdp-combobox__list--message' }}\"\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    >\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        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\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-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (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\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: [".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: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "pipe", type: i3$2.SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxComponent, decorators: [{
             type: Component,
@@ -6715,8 +6454,7 @@ class PlatformComboboxModule {
             PlatformAutoCompleteModule,
             FormModule,
             I18nModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [ComboboxComponent, TemplateModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            ContentDensityModule], exports: [ComboboxComponent, TemplateModule, ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, providers: [DynamicComponentService], imports: [CommonModule,
             FormsModule,
             InputGroupModule,
@@ -6727,8 +6465,7 @@ class PlatformComboboxModule {
             PlatformAutoCompleteModule,
             FormModule,
             I18nModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, TemplateModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            ContentDensityModule, TemplateModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, decorators: [{
             type: NgModule,
@@ -6745,45 +6482,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         PlatformAutoCompleteModule,
                         FormModule,
                         I18nModule,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule
                     ],
                     providers: [DynamicComponentService],
-                    exports: [ComboboxComponent, TemplateModule, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    exports: [ComboboxComponent, TemplateModule, ContentDensityModule]
                 }]
         }] });
 
 class PlatformDatePickerModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerModule, declarations: [PlatformDatePickerComponent], imports: [CommonModule,
-            DatePickerModule,
-            FormsModule,
-            ReactiveFormsModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [PlatformDatePickerComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerModule, imports: [CommonModule,
-            DatePickerModule,
-            FormsModule,
-            ReactiveFormsModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerModule, declarations: [PlatformDatePickerComponent], imports: [CommonModule, DatePickerModule, FormsModule, ReactiveFormsModule, PipeModule, ContentDensityModule], exports: [PlatformDatePickerComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerModule, imports: [CommonModule, DatePickerModule, FormsModule, ReactiveFormsModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatePickerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [PlatformDatePickerComponent],
-                    imports: [
-                        CommonModule,
-                        DatePickerModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [PlatformDatePickerComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    imports: [CommonModule, DatePickerModule, FormsModule, ReactiveFormsModule, PipeModule, ContentDensityModule],
+                    exports: [PlatformDatePickerComponent, ContentDensityModule]
                 }]
         }] });
 
@@ -6804,28 +6520,6 @@ class PlatformDatetimePickerComponent extends BaseInput {
     get value() {
         return super.getValue();
     }
-    /**
-     * @deprecated use i18n capabilities instead (being translated in core datetime picker)
-     * Aria label for the datetime picker input.
-     */
-    set datetimeInputLabel(value) {
-        warnOnce('Property datetimeInputLabel is deprecated. Use i18n capabilities (being translated in core datetime picker) instead.');
-        this._datetimeInputLabel = value;
-    }
-    get datetimeInputLabel() {
-        return this._datetimeInputLabel;
-    }
-    /**
-     * @deprecated use i18n capabilities instead (being translated in core datetime picker)
-     * Aria label for the button to show/hide the calendar.
-     */
-    set displayDatetimeToggleLabel(value) {
-        warnOnce('Property displayDatetimeToggleLabel is deprecated. Use i18n capabilities (being translated in core datetime picker) instead.');
-        this._displayDatetimeToggleLabel = value;
-    }
-    get displayDatetimeToggleLabel() {
-        return this._displayDatetimeToggleLabel;
-    }
     /**
      *  The state of the form control - applies css classes.
      *  Can be `success`, `error`, `warning`, `information` or blank for default.
@@ -6840,28 +6534,6 @@ class PlatformDatetimePickerComponent extends BaseInput {
         }
         return super.state;
     }
-    /**
-     * @deprecated use i18n capabilities instead
-     * Text and aria-label of the DateTimePicker 'OK' button.
-     */
-    set okLabel(value) {
-        warnOnce('Property okLabel is deprecated. Use i18n capabilities instead.');
-        this._okLabel = value;
-    }
-    get okLabel() {
-        return this._okLabel;
-    }
-    /**
-     * @deprecated use i18n capabilities instead
-     * Text and aria-label of the DateTimePicker 'Cancel' button.
-     */
-    set cancelLabel(value) {
-        warnOnce('Property cancelLabel is deprecated. Use i18n capabilities instead.');
-        this._cancelLabel = value;
-    }
-    get cancelLabel() {
-        return this._cancelLabel;
-    }
     /** @hidden */
     get _isRequired() {
         return !!this.formField?.required;
@@ -7045,11 +6717,11 @@ class PlatformDatetimePickerComponent extends BaseInput {
         customPopoverEl.style.display = 'inline';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerComponent, 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: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i2$2.DatetimeAdapter, optional: true }, { token: DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformDatetimePickerComponent, selector: "fdp-datetime-picker", inputs: { value: "value", placement: "placement", appendTo: "appendTo", meridian: "meridian", displaySeconds: "displaySeconds", displayMinutes: "displayMinutes", displayHours: "displayHours", useValidation: "useValidation", isOpen: "isOpen", startingDayOfWeek: "startingDayOfWeek", activeView: "activeView", datetimeInputLabel: "datetimeInputLabel", displayDatetimeToggleLabel: "displayDatetimeToggleLabel", allowNull: "allowNull", keepTwoDigitsTime: "keepTwoDigitsTime", state: "state", buttonFocusable: "buttonFocusable", specialDaysRules: "specialDaysRules", yearGrid: "yearGrid", aggregatedYearGrid: "aggregatedYearGrid", markWeekends: "markWeekends", spinnerButtons: "spinnerButtons", showWeekNumbers: "showWeekNumbers", showFooter: "showFooter", processInputOnBlur: "processInputOnBlur", preventScrollOnFocus: "preventScrollOnFocus", okLabel: "okLabel", cancelLabel: "cancelLabel", disableFunction: "disableFunction" }, outputs: { isOpenChange: "isOpenChange", activeViewChange: "activeViewChange", datetimeChange: "datetimeChange", onClose: "onClose" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformDatetimePickerComponent, multi: true }], viewQueries: [{ propertyName: "dateTimePickerComponent", first: true, predicate: DatetimePickerComponent, descendants: true }, { propertyName: "_elRef", first: true, predicate: DatetimePickerComponent, descendants: true, read: ElementRef, static: true }, { propertyName: "_control", first: true, predicate: DatetimePickerComponent, descendants: true, read: NgControl, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-datetime-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"_isRequired\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [useValidation]=\"useValidation\"\n    [isOpen]=\"isOpen\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [activeView]=\"activeView\"\n    [datetimeInputLabel]=\"datetimeInputLabel\"\n    [displayDatetimeToggleLabel]=\"displayDatetimeToggleLabel\"\n    [allowNull]=\"allowNull && !_isRequired\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [showFooter]=\"showFooter\"\n    [disableFunction]=\"disableFunction\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDatetimeInputChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (touched)=\"onTouched()\"\n>\n    <ng-content></ng-content>\n</fd-datetime-picker>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$6.DatetimePickerComponent, selector: "fd-datetime-picker", inputs: ["placeholder", "placement", "appendTo", "disabled", "inputId", "required", "meridian", "displaySeconds", "ariaLabelledBy", "message", "messageTriggers", "displayMinutes", "displayHours", "useValidation", "date", "isOpen", "startingDayOfWeek", "activeView", "datetimeInputLabel", "displayDatetimeToggleLabel", "displayTypeDateLabel", "displayTypeTimeLabel", "allowNull", "keepTwoDigitsTime", "state", "buttonFocusable", "specialDaysRules", "yearGrid", "aggregatedYearGrid", "markWeekends", "spinnerButtons", "showWeekNumbers", "showFooter", "processInputOnBlur", "preventScrollOnFocus", "okLabel", "cancelLabel", "disableFunction"], outputs: ["isOpenChange", "activeViewChange", "dateChange", "calendarChange", "timeChange", "onClose", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformDatetimePickerComponent, selector: "fdp-datetime-picker", inputs: { value: "value", placement: "placement", appendTo: "appendTo", meridian: "meridian", displaySeconds: "displaySeconds", displayMinutes: "displayMinutes", displayHours: "displayHours", useValidation: "useValidation", isOpen: "isOpen", startingDayOfWeek: "startingDayOfWeek", activeView: "activeView", allowNull: "allowNull", keepTwoDigitsTime: "keepTwoDigitsTime", state: "state", buttonFocusable: "buttonFocusable", specialDaysRules: "specialDaysRules", yearGrid: "yearGrid", aggregatedYearGrid: "aggregatedYearGrid", markWeekends: "markWeekends", spinnerButtons: "spinnerButtons", showWeekNumbers: "showWeekNumbers", showFooter: "showFooter", processInputOnBlur: "processInputOnBlur", preventScrollOnFocus: "preventScrollOnFocus", disableFunction: "disableFunction" }, outputs: { isOpenChange: "isOpenChange", activeViewChange: "activeViewChange", datetimeChange: "datetimeChange", onClose: "onClose" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformDatetimePickerComponent, multi: true }], viewQueries: [{ propertyName: "dateTimePickerComponent", first: true, predicate: DatetimePickerComponent, descendants: true }, { propertyName: "_elRef", first: true, predicate: DatetimePickerComponent, descendants: true, read: ElementRef, static: true }, { propertyName: "_control", first: true, predicate: DatetimePickerComponent, descendants: true, read: NgControl, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-datetime-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"_isRequired\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [useValidation]=\"useValidation\"\n    [isOpen]=\"isOpen\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [activeView]=\"activeView\"\n    [allowNull]=\"allowNull && !_isRequired\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [showFooter]=\"showFooter\"\n    [disableFunction]=\"disableFunction\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDatetimeInputChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (touched)=\"onTouched()\"\n>\n    <ng-content></ng-content>\n</fd-datetime-picker>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$6.DatetimePickerComponent, selector: "fd-datetime-picker", inputs: ["placeholder", "placement", "appendTo", "disabled", "inputId", "required", "meridian", "displaySeconds", "ariaLabelledBy", "message", "messageTriggers", "displayMinutes", "displayHours", "useValidation", "date", "isOpen", "startingDayOfWeek", "activeView", "allowNull", "keepTwoDigitsTime", "state", "buttonFocusable", "specialDaysRules", "yearGrid", "aggregatedYearGrid", "markWeekends", "spinnerButtons", "showWeekNumbers", "showFooter", "processInputOnBlur", "preventScrollOnFocus", "disableFunction"], outputs: ["isOpenChange", "activeViewChange", "dateChange", "calendarChange", "timeChange", "onClose", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-datetime-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformDatetimePickerComponent, multi: true }], template: "<fd-datetime-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"_isRequired\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [useValidation]=\"useValidation\"\n    [isOpen]=\"isOpen\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [activeView]=\"activeView\"\n    [datetimeInputLabel]=\"datetimeInputLabel\"\n    [displayDatetimeToggleLabel]=\"displayDatetimeToggleLabel\"\n    [allowNull]=\"allowNull && !_isRequired\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [showFooter]=\"showFooter\"\n    [disableFunction]=\"disableFunction\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDatetimeInputChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (touched)=\"onTouched()\"\n>\n    <ng-content></ng-content>\n</fd-datetime-picker>\n" }]
+            args: [{ selector: 'fdp-datetime-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformDatetimePickerComponent, multi: true }], template: "<fd-datetime-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"_isRequired\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [placement]=\"placement\"\n    [appendTo]=\"appendTo\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [useValidation]=\"useValidation\"\n    [isOpen]=\"isOpen\"\n    [startingDayOfWeek]=\"startingDayOfWeek\"\n    [activeView]=\"activeView\"\n    [allowNull]=\"allowNull && !_isRequired\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [specialDaysRules]=\"specialDaysRules\"\n    [yearGrid]=\"yearGrid\"\n    [aggregatedYearGrid]=\"aggregatedYearGrid\"\n    [markWeekends]=\"markWeekends\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [showWeekNumbers]=\"showWeekNumbers\"\n    [showFooter]=\"showFooter\"\n    [disableFunction]=\"disableFunction\"\n    [processInputOnBlur]=\"processInputOnBlur\"\n    [preventScrollOnFocus]=\"preventScrollOnFocus\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"handleDatetimeInputChange($event)\"\n    (activeViewChange)=\"handleActiveViewChange($event)\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (touched)=\"onTouched()\"\n>\n    <ng-content></ng-content>\n</fd-datetime-picker>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -7109,10 +6781,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], activeView: [{
                 type: Input
-            }], datetimeInputLabel: [{
-                type: Input
-            }], displayDatetimeToggleLabel: [{
-                type: Input
             }], allowNull: [{
                 type: Input
             }], keepTwoDigitsTime: [{
@@ -7139,10 +6807,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], preventScrollOnFocus: [{
                 type: Input
-            }], okLabel: [{
-                type: Input
-            }], cancelLabel: [{
-                type: Input
             }], isOpenChange: [{
                 type: Output
             }], activeViewChange: [{
@@ -7166,35 +6830,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformDatetimePickerModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerModule, declarations: [PlatformDatetimePickerComponent], imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            DatetimePickerModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [PlatformDatetimePickerComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerModule, imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            DatetimePickerModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerModule, declarations: [PlatformDatetimePickerComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule, DatetimePickerModule, PipeModule, ContentDensityModule], exports: [PlatformDatetimePickerComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerModule, imports: [CommonModule, FormsModule, ReactiveFormsModule, DatetimePickerModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformDatetimePickerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [PlatformDatetimePickerComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        DatetimePickerModule,
-                        PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [PlatformDatetimePickerComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    imports: [CommonModule, FormsModule, ReactiveFormsModule, DatetimePickerModule, PipeModule, ContentDensityModule],
+                    exports: [PlatformDatetimePickerComponent, ContentDensityModule]
                 }]
         }] });
 
@@ -7301,7 +6945,7 @@ class FormGroupHeaderComponent {
         return;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupHeaderComponent, selector: "[fdp-form-group-header]", inputs: { fieldGroup: "fieldGroup" }, host: { properties: { "class.fd-form-group__header": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'before'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<h6 class=\"fd-form-group__header-text\">\n    {{ fieldGroup?.label }}\n</h6>\n\n<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'after'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<ng-template #inlineHelpRef>\n    <span *ngIf=\"hintOptions\" fd-link [undecorated]=\"true\">\n        <fd-icon\n            [style.vertical-align]=\"'middle'\"\n            [fd-inline-help]=\"hintOptions.content\"\n            [glyph]=\"hintOptions.glyph\"\n            [placement]=\"hintOptions.placement || null\"\n            [triggers]=\"hintOptions.trigger || []\"\n            tabindex=\"0\"\n        ></fd-icon>\n    </span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help", "fd-inline-help-template"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupHeaderComponent, selector: "[fdp-form-group-header]", inputs: { fieldGroup: "fieldGroup" }, host: { properties: { "class.fd-form-group__header": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'before'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<h6 class=\"fd-form-group__header-text\">\n    {{ fieldGroup?.label }}\n</h6>\n\n<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'after'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<ng-template #inlineHelpRef>\n    <span *ngIf=\"hintOptions\" fd-link [undecorated]=\"true\">\n        <fd-icon\n            [style.vertical-align]=\"'middle'\"\n            [fd-inline-help]=\"hintOptions.content\"\n            [glyph]=\"hintOptions.glyph\"\n            [placement]=\"hintOptions.placement || null\"\n            [triggers]=\"hintOptions.trigger || []\"\n            tabindex=\"0\"\n        ></fd-icon>\n    </span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupHeaderComponent, decorators: [{
             type: Component,
@@ -7423,25 +7067,6 @@ let formGroupUniqueId = 0;
  *
  */
 class FormGroupComponent {
-    /**
-     * @deprecated
-     * Use labelColumnLayout, fieldColumnLayout and gapColumnLayout properties.
-     *
-     * Defines form field label placement.
-     */
-    set labelLayout(value) {
-        if (isDevMode()) {
-            warnOnce$1('LabelLayout input property is deprecated. Please use labelColumnLayout, fieldColumnLayout and gapColumnLayout properties instead');
-        }
-        this._labelLayout = value;
-        this.labelColumnLayout =
-            this._labelLayout === 'horizontal' ? DefaultHorizontalLabelLayout : DefaultVerticalLabelLayout;
-        this.fieldColumnLayout =
-            this._labelLayout === 'horizontal' ? DefaultHorizontalFieldLayout : DefaultVerticalFieldLayout;
-    }
-    get labelLayout() {
-        return this._labelLayout;
-    }
     /**
      * Defines column layout for inline items.
      */
@@ -7513,8 +7138,6 @@ class FormGroupComponent {
         /** @hidden */
         this._useForm = false;
         /** @hidden */
-        this._hintPlacement = 'right';
-        /** @hidden */
         this._destroyed = new Subject();
         /** @hidden */
         this._subscriptions = new Subscription();
@@ -7709,7 +7332,6 @@ class FormGroupComponent {
      */
     _updateFormFieldProperties(formField) {
         if (this.unifiedLayout) {
-            formField.hintPlacement = this._hintPlacement;
             formField.editable = this.editable;
             formField.noLabelLayout = this.noLabelLayout;
         }
@@ -7792,7 +7414,7 @@ class FormGroupComponent {
             .subscribe(() => this._cd.markForCheck()));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.ControlContainer, optional: true }, { token: i5$2.ContentDensityObserver }, { token: FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupComponent, selector: "fdp-form-group", inputs: { id: "id", name: "name", editable: "editable", noLabelLayout: "noLabelLayout", class: "class", hint: "hint", labelLayout: "labelLayout", inlineColumnLayout: "inlineColumnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", formGroup: "formGroup", topTitle: "topTitle", mainTitle: "mainTitle", hideMainTItle: "hideMainTItle", object: "object", i18Strings: "i18Strings", useForm: "useForm", columnLayout: "columnLayout", unifiedLayout: "unifiedLayout" }, outputs: { onSubmit: "onSubmit" }, providers: [formGroupProvider, FormFieldLayoutService, contentDensityObserverProviders()], queries: [{ propertyName: "i18Template", first: true, predicate: ["i18n"], descendants: true, static: true }, { propertyName: "_errorDirectives", predicate: FormFieldErrorDirective }, { propertyName: "formGroupChildren", predicate: FORM_GROUP_CHILD_FIELD_TOKEN, descendants: true }], viewQueries: [{ propertyName: "nativeForm", first: true, predicate: ["nativeForm"], descendants: true, read: NgForm }], usesOnChanges: true, ngImport: i0, template: "<form #nativeForm (ngSubmit)=\"onSubmit.emit($event)\" *ngIf=\"useForm; else body\" [id]=\"id\" [name]=\"name\">\n    <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n</form>\n\n<ng-template #body>\n    <!--  Render fields and field groups with assigned columns -->\n    <ng-container *ngTemplateOutlet=\"fields\"></ng-container>\n</ng-template>\n\n<ng-template #fields>\n    <div *ngIf=\"mainTitle && !hideMainTItle\" class=\"fd-form-header\">\n        <ng-template [ngTemplateOutlet]=\"mainTitleTemplate\"></ng-template>\n    </div>\n\n    <div\n        class=\"fd-container fd-form-layout-grid-container\"\n        [class.is-compact]=\"contentDensityObserver.isCompact$ | async\"\n    >\n        <div *ngFor=\"let column of formRows | keyvalue; trackBy: trackByFn\" class=\"fd-row\">\n            <div\n                *ngFor=\"let fields of column | fieldGroupRowValue | keyvalue; trackBy: trackByFn; let index = index\"\n                class=\"fd-col fd-form-group\"\n                [class]=\"xlCol\"\n            >\n                <div class=\"fd-row\" *ngIf=\"$fieldGroup(column.value) as value\">\n                    <div class=\"fd-col\">\n                        <div *ngIf=\"value.label\" fdp-form-group-header [fieldGroup]=\"index === 0 ? value : null\"></div>\n                    </div>\n                </div>\n\n                <div *ngFor=\"let field of fields.value; trackBy: trackByFieldName\" class=\"fd-row fd-form-item\">\n                    <div class=\"fd-col\" [class]=\"_inlineColumnLayoutClass\" [style.order]=\"field.rank\">\n                        <ng-container *ngTemplateOutlet=\"field?.renderer || null\"></ng-container>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<!-- For nested form-group -->\n<ng-content select=\"fdp-form-group\"></ng-content>\n\n<ng-template #mainTitleTemplate>\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'before'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <h5 class=\"fd-form-header__text\">\n        {{ mainTitle }}\n    </h5>\n\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'after'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <ng-template #hintTemplate>\n        <span fd-link [undecorated]=\"true\">\n            <fd-icon\n                [fd-inline-help]=\"_hintOptions.content\"\n                [glyph]=\"_hintOptions.glyph\"\n                [placement]=\"_hintOptions.placement || null\"\n                [triggers]=\"_hintOptions.trigger || []\"\n                tabindex=\"0\"\n            ></fd-icon>\n        </span>\n    </ng-template>\n</ng-template>\n", styles: [".fd-col,.fd-container,.fd-row{-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:0;padding:0}.fd-col:after,.fd-col:before,.fd-container:after,.fd-container:before,.fd-row:after,.fd-row:before{box-sizing:inherit;font-size:inherit}.fd-container{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;padding:0 .25rem;position:relative}.fd-container .fd-row{margin-left:-.25rem;margin-right:-.25rem;min-width:calc(100% + .5rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.25rem;padding-top:.25rem}.fd-container.fd-container--no-gap .fd-row,.fd-container.fd-container--no-horizontal-gap .fd-row{margin-left:0;margin-right:0}.fd-container.fd-container--no-gap .fd-row .fd-col,.fd-container.fd-container--no-horizontal-gap .fd-row .fd-col{padding-left:0;padding-right:0}.fd-container.fd-container--no-gap>.fd-row>.fd-col,.fd-container.fd-container--no-vertical-gap>.fd-row>.fd-col{padding-bottom:0;padding-top:0}.fd-container[dir=rtl],[dir=rtl] .fd-container{direction:rtl}.fd-row{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;min-width:100%;position:relative}.fd-col{max-width:100%;min-width:100%;padding-left:.25rem;padding-right:.25rem}.fd-col--0{max-width:0;min-width:0%}.fd-col--offset-0{margin-left:0}.fd-col--offset-0[dir=rtl],[dir=rtl] .fd-col--offset-0{margin-left:0;margin-right:0}.fd-col--offset-after-0{margin-right:0}.fd-col--offset-after-0[dir=rtl],[dir=rtl] .fd-col--offset-after-0{margin-left:0;margin-right:0}.fd-col--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col--offset-1{margin-left:8.3333333333%}.fd-col--offset-1[dir=rtl],[dir=rtl] .fd-col--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col--offset-after-1{margin-right:8.3333333333%}.fd-col--offset-after-1[dir=rtl],[dir=rtl] .fd-col--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col--offset-2{margin-left:16.6666666667%}.fd-col--offset-2[dir=rtl],[dir=rtl] .fd-col--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col--offset-after-2{margin-right:16.6666666667%}.fd-col--offset-after-2[dir=rtl],[dir=rtl] .fd-col--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col--3{max-width:25%;min-width:25%}.fd-col--offset-3{margin-left:25%}.fd-col--offset-3[dir=rtl],[dir=rtl] .fd-col--offset-3{margin-left:0;margin-right:25%}.fd-col--offset-after-3{margin-right:25%}.fd-col--offset-after-3[dir=rtl],[dir=rtl] .fd-col--offset-after-3{margin-left:25%;margin-right:0}.fd-col--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col--offset-4{margin-left:33.3333333333%}.fd-col--offset-4[dir=rtl],[dir=rtl] .fd-col--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col--offset-after-4{margin-right:33.3333333333%}.fd-col--offset-after-4[dir=rtl],[dir=rtl] .fd-col--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col--offset-5{margin-left:41.6666666667%}.fd-col--offset-5[dir=rtl],[dir=rtl] .fd-col--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col--offset-after-5{margin-right:41.6666666667%}.fd-col--offset-after-5[dir=rtl],[dir=rtl] .fd-col--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col--6{max-width:50%;min-width:50%}.fd-col--offset-6{margin-left:50%}.fd-col--offset-6[dir=rtl],[dir=rtl] .fd-col--offset-6{margin-left:0;margin-right:50%}.fd-col--offset-after-6{margin-right:50%}.fd-col--offset-after-6[dir=rtl],[dir=rtl] .fd-col--offset-after-6{margin-left:50%;margin-right:0}.fd-col--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col--offset-7{margin-left:58.3333333333%}.fd-col--offset-7[dir=rtl],[dir=rtl] .fd-col--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col--offset-after-7{margin-right:58.3333333333%}.fd-col--offset-after-7[dir=rtl],[dir=rtl] .fd-col--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col--offset-8{margin-left:66.6666666667%}.fd-col--offset-8[dir=rtl],[dir=rtl] .fd-col--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col--offset-after-8{margin-right:66.6666666667%}.fd-col--offset-after-8[dir=rtl],[dir=rtl] .fd-col--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col--9{max-width:75%;min-width:75%}.fd-col--offset-9{margin-left:75%}.fd-col--offset-9[dir=rtl],[dir=rtl] .fd-col--offset-9{margin-left:0;margin-right:75%}.fd-col--offset-after-9{margin-right:75%}.fd-col--offset-after-9[dir=rtl],[dir=rtl] .fd-col--offset-after-9{margin-left:75%;margin-right:0}.fd-col--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col--offset-10{margin-left:83.3333333333%}.fd-col--offset-10[dir=rtl],[dir=rtl] .fd-col--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col--offset-after-10{margin-right:83.3333333333%}.fd-col--offset-after-10[dir=rtl],[dir=rtl] .fd-col--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col--offset-11{margin-left:91.6666666667%}.fd-col--offset-11[dir=rtl],[dir=rtl] .fd-col--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col--offset-after-11{margin-right:91.6666666667%}.fd-col--offset-after-11[dir=rtl],[dir=rtl] .fd-col--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col--12{max-width:100%;min-width:100%}.fd-col--offset-12{margin-left:100%}.fd-col--offset-12[dir=rtl],[dir=rtl] .fd-col--offset-12{margin-left:0;margin-right:100%}.fd-col--offset-after-12{margin-right:100%}.fd-col--offset-after-12[dir=rtl],[dir=rtl] .fd-col--offset-after-12{margin-left:100%;margin-right:0}.fd-col--full{flex:1;max-width:none;min-width:8.3333333333%}.fd-col--wrap{flex-wrap:wrap}@media (min-width: 600px){.fd-container{padding:0 .5rem}.fd-container .fd-row{margin-left:-.5rem;margin-right:-.5rem;min-width:calc(100% + 1rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.5rem;padding-top:.5rem}.fd-col{padding-left:.5rem;padding-right:.5rem}.fd-col-md--0{max-width:0;min-width:0%}.fd-col-md--offset-0{margin-left:0}.fd-col-md--offset-0[dir=rtl],[dir=rtl] .fd-col-md--offset-0{margin-left:0;margin-right:0}.fd-col-md--offset-after-0{margin-right:0}.fd-col-md--offset-after-0[dir=rtl],[dir=rtl] .fd-col-md--offset-after-0{margin-left:0;margin-right:0}.fd-col-md--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-md--offset-1{margin-left:8.3333333333%}.fd-col-md--offset-1[dir=rtl],[dir=rtl] .fd-col-md--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-md--offset-after-1{margin-right:8.3333333333%}.fd-col-md--offset-after-1[dir=rtl],[dir=rtl] .fd-col-md--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-md--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-md--offset-2{margin-left:16.6666666667%}.fd-col-md--offset-2[dir=rtl],[dir=rtl] .fd-col-md--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-md--offset-after-2{margin-right:16.6666666667%}.fd-col-md--offset-after-2[dir=rtl],[dir=rtl] .fd-col-md--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-md--3{max-width:25%;min-width:25%}.fd-col-md--offset-3{margin-left:25%}.fd-col-md--offset-3[dir=rtl],[dir=rtl] .fd-col-md--offset-3{margin-left:0;margin-right:25%}.fd-col-md--offset-after-3{margin-right:25%}.fd-col-md--offset-after-3[dir=rtl],[dir=rtl] .fd-col-md--offset-after-3{margin-left:25%;margin-right:0}.fd-col-md--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-md--offset-4{margin-left:33.3333333333%}.fd-col-md--offset-4[dir=rtl],[dir=rtl] .fd-col-md--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-md--offset-after-4{margin-right:33.3333333333%}.fd-col-md--offset-after-4[dir=rtl],[dir=rtl] .fd-col-md--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-md--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-md--offset-5{margin-left:41.6666666667%}.fd-col-md--offset-5[dir=rtl],[dir=rtl] .fd-col-md--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-md--offset-after-5{margin-right:41.6666666667%}.fd-col-md--offset-after-5[dir=rtl],[dir=rtl] .fd-col-md--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-md--6{max-width:50%;min-width:50%}.fd-col-md--offset-6{margin-left:50%}.fd-col-md--offset-6[dir=rtl],[dir=rtl] .fd-col-md--offset-6{margin-left:0;margin-right:50%}.fd-col-md--offset-after-6{margin-right:50%}.fd-col-md--offset-after-6[dir=rtl],[dir=rtl] .fd-col-md--offset-after-6{margin-left:50%;margin-right:0}.fd-col-md--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-md--offset-7{margin-left:58.3333333333%}.fd-col-md--offset-7[dir=rtl],[dir=rtl] .fd-col-md--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-md--offset-after-7{margin-right:58.3333333333%}.fd-col-md--offset-after-7[dir=rtl],[dir=rtl] .fd-col-md--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-md--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-md--offset-8{margin-left:66.6666666667%}.fd-col-md--offset-8[dir=rtl],[dir=rtl] .fd-col-md--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-md--offset-after-8{margin-right:66.6666666667%}.fd-col-md--offset-after-8[dir=rtl],[dir=rtl] .fd-col-md--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-md--9{max-width:75%;min-width:75%}.fd-col-md--offset-9{margin-left:75%}.fd-col-md--offset-9[dir=rtl],[dir=rtl] .fd-col-md--offset-9{margin-left:0;margin-right:75%}.fd-col-md--offset-after-9{margin-right:75%}.fd-col-md--offset-after-9[dir=rtl],[dir=rtl] .fd-col-md--offset-after-9{margin-left:75%;margin-right:0}.fd-col-md--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-md--offset-10{margin-left:83.3333333333%}.fd-col-md--offset-10[dir=rtl],[dir=rtl] .fd-col-md--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-md--offset-after-10{margin-right:83.3333333333%}.fd-col-md--offset-after-10[dir=rtl],[dir=rtl] .fd-col-md--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-md--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-md--offset-11{margin-left:91.6666666667%}.fd-col-md--offset-11[dir=rtl],[dir=rtl] .fd-col-md--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-md--offset-after-11{margin-right:91.6666666667%}.fd-col-md--offset-after-11[dir=rtl],[dir=rtl] .fd-col-md--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-md--12{max-width:100%;min-width:100%}.fd-col-md--offset-12{margin-left:100%}.fd-col-md--offset-12[dir=rtl],[dir=rtl] .fd-col-md--offset-12{margin-left:0;margin-right:100%}.fd-col-md--offset-after-12{margin-right:100%}.fd-col-md--offset-after-12[dir=rtl],[dir=rtl] .fd-col-md--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1024px){.fd-col-lg--0{max-width:0;min-width:0%}.fd-col-lg--offset-0{margin-left:0}.fd-col-lg--offset-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-0{margin-left:0;margin-right:0}.fd-col-lg--offset-after-0{margin-right:0}.fd-col-lg--offset-after-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-0{margin-left:0;margin-right:0}.fd-col-lg--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-lg--offset-1{margin-left:8.3333333333%}.fd-col-lg--offset-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-lg--offset-after-1{margin-right:8.3333333333%}.fd-col-lg--offset-after-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-lg--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-lg--offset-2{margin-left:16.6666666667%}.fd-col-lg--offset-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-lg--offset-after-2{margin-right:16.6666666667%}.fd-col-lg--offset-after-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-lg--3{max-width:25%;min-width:25%}.fd-col-lg--offset-3{margin-left:25%}.fd-col-lg--offset-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-3{margin-left:0;margin-right:25%}.fd-col-lg--offset-after-3{margin-right:25%}.fd-col-lg--offset-after-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-3{margin-left:25%;margin-right:0}.fd-col-lg--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-lg--offset-4{margin-left:33.3333333333%}.fd-col-lg--offset-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-lg--offset-after-4{margin-right:33.3333333333%}.fd-col-lg--offset-after-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-lg--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-lg--offset-5{margin-left:41.6666666667%}.fd-col-lg--offset-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-lg--offset-after-5{margin-right:41.6666666667%}.fd-col-lg--offset-after-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-lg--6{max-width:50%;min-width:50%}.fd-col-lg--offset-6{margin-left:50%}.fd-col-lg--offset-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-6{margin-left:0;margin-right:50%}.fd-col-lg--offset-after-6{margin-right:50%}.fd-col-lg--offset-after-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-6{margin-left:50%;margin-right:0}.fd-col-lg--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-lg--offset-7{margin-left:58.3333333333%}.fd-col-lg--offset-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-lg--offset-after-7{margin-right:58.3333333333%}.fd-col-lg--offset-after-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-lg--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-lg--offset-8{margin-left:66.6666666667%}.fd-col-lg--offset-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-lg--offset-after-8{margin-right:66.6666666667%}.fd-col-lg--offset-after-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-lg--9{max-width:75%;min-width:75%}.fd-col-lg--offset-9{margin-left:75%}.fd-col-lg--offset-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-9{margin-left:0;margin-right:75%}.fd-col-lg--offset-after-9{margin-right:75%}.fd-col-lg--offset-after-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-9{margin-left:75%;margin-right:0}.fd-col-lg--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-lg--offset-10{margin-left:83.3333333333%}.fd-col-lg--offset-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-lg--offset-after-10{margin-right:83.3333333333%}.fd-col-lg--offset-after-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-lg--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-lg--offset-11{margin-left:91.6666666667%}.fd-col-lg--offset-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-lg--offset-after-11{margin-right:91.6666666667%}.fd-col-lg--offset-after-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-lg--12{max-width:100%;min-width:100%}.fd-col-lg--offset-12{margin-left:100%}.fd-col-lg--offset-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-12{margin-left:0;margin-right:100%}.fd-col-lg--offset-after-12{margin-right:100%}.fd-col-lg--offset-after-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1440px){.fd-col-xl--0{max-width:0;min-width:0%}.fd-col-xl--offset-0{margin-left:0}.fd-col-xl--offset-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-0{margin-left:0;margin-right:0}.fd-col-xl--offset-after-0{margin-right:0}.fd-col-xl--offset-after-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-0{margin-left:0;margin-right:0}.fd-col-xl--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-xl--offset-1{margin-left:8.3333333333%}.fd-col-xl--offset-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-xl--offset-after-1{margin-right:8.3333333333%}.fd-col-xl--offset-after-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-xl--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-xl--offset-2{margin-left:16.6666666667%}.fd-col-xl--offset-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-xl--offset-after-2{margin-right:16.6666666667%}.fd-col-xl--offset-after-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-xl--3{max-width:25%;min-width:25%}.fd-col-xl--offset-3{margin-left:25%}.fd-col-xl--offset-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-3{margin-left:0;margin-right:25%}.fd-col-xl--offset-after-3{margin-right:25%}.fd-col-xl--offset-after-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-3{margin-left:25%;margin-right:0}.fd-col-xl--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-xl--offset-4{margin-left:33.3333333333%}.fd-col-xl--offset-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-xl--offset-after-4{margin-right:33.3333333333%}.fd-col-xl--offset-after-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-xl--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-xl--offset-5{margin-left:41.6666666667%}.fd-col-xl--offset-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-xl--offset-after-5{margin-right:41.6666666667%}.fd-col-xl--offset-after-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-xl--6{max-width:50%;min-width:50%}.fd-col-xl--offset-6{margin-left:50%}.fd-col-xl--offset-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-6{margin-left:0;margin-right:50%}.fd-col-xl--offset-after-6{margin-right:50%}.fd-col-xl--offset-after-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-6{margin-left:50%;margin-right:0}.fd-col-xl--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-xl--offset-7{margin-left:58.3333333333%}.fd-col-xl--offset-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-xl--offset-after-7{margin-right:58.3333333333%}.fd-col-xl--offset-after-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-xl--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-xl--offset-8{margin-left:66.6666666667%}.fd-col-xl--offset-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-xl--offset-after-8{margin-right:66.6666666667%}.fd-col-xl--offset-after-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-xl--9{max-width:75%;min-width:75%}.fd-col-xl--offset-9{margin-left:75%}.fd-col-xl--offset-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-9{margin-left:0;margin-right:75%}.fd-col-xl--offset-after-9{margin-right:75%}.fd-col-xl--offset-after-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-9{margin-left:75%;margin-right:0}.fd-col-xl--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-xl--offset-10{margin-left:83.3333333333%}.fd-col-xl--offset-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-xl--offset-after-10{margin-right:83.3333333333%}.fd-col-xl--offset-after-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-xl--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-xl--offset-11{margin-left:91.6666666667%}.fd-col-xl--offset-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-xl--offset-after-11{margin-right:91.6666666667%}.fd-col-xl--offset-after-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-xl--12{max-width:100%;min-width:100%}.fd-col-xl--offset-12{margin-left:100%}.fd-col-xl--offset-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-12{margin-left:0;margin-right:100%}.fd-col-xl--offset-after-12{margin-right:100%}.fd-col-xl--offset-after-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-12{margin-left:100%;margin-right:0}}.fd-container.fd-form-layout-grid-container .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group{padding:1rem!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-group{padding:0!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-right:0;white-space:normal}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-left:0;margin-right:0}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-right:.5rem}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-left:.5rem;padding-right:0}.fd-container.fd-form-layout-grid-container .fd-row{flex-direction:row}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{overflow:hidden;padding-bottom:0;padding-top:0;text-overflow:ellipsis;white-space:nowrap}.fd-container.fd-form-layout-grid-container .fd-row .fd-col:not(.fd-form-group){align-self:center}@media (min-width: 0){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:right;text-align:right}}@media (min-width: 0) and (max-width: 599px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 600px){.fd-container.fd-form-layout-grid-container{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row{margin:0 -.25rem;min-width:calc(100% + .5rem)}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:right;text-align:right}}@media (min-width: 600px) and (max-width: 1023px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1024px){.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:right;text-align:right}}@media (min-width: 1024px) and (max-width: 1443px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1440px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:right;text-align:right}}/*!\n.fd-section+(--full-bleed, --no-border)\n    .fd-section__header\n        .fd-section__title\n        .fd-section__actions\n    .fd-section__footer\n*/.fd-section{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_Background);border:0;border-bottom:none;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:0;padding:1rem .5rem 1.5rem}.fd-section:after,.fd-section:before{box-sizing:inherit;font-size:inherit}.fd-section:after{clear:both;content:\"\";display:table}@media (min-width: 600px){.fd-section{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section{padding-left:3rem;padding-right:3rem}}.fd-section--no-border,.fd-section:last-child{border-bottom:0}.fd-section--bleed,.fd-section--full-bleed{-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:0;padding:0}.fd-section--bleed:after,.fd-section--bleed:before,.fd-section--full-bleed:after,.fd-section--full-bleed:before{box-sizing:inherit;font-size:inherit}.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:3rem;padding-right:3rem}}.fd-section__header{-webkit-box-sizing:border-box;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 1.5rem;min-height:1.5rem;padding:0}.fd-section__header:after,.fd-section__header:before{box-sizing:inherit;font-size:inherit}.fd-section__title{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTitleColor);flex:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader2Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);line-height:2rem;margin:0;padding:0}.fd-section__title:after,.fd-section__title:before{box-sizing:inherit;font-size:inherit}.fd-section__actions{-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:0 0 0 auto;padding:0}.fd-section__actions:after,.fd-section__actions:before{box-sizing:inherit;font-size:inherit}.fd-section__footer{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section__footer:after,.fd-section__footer:before{box-sizing:inherit;font-size:inherit}/*!\n  .fd-form-group(--inline)\n*/.fd-form-group{-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:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-form-header\n   .fd-form-header__text\n*/.fd-form-header{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 1rem;width:100%}.fd-form-header:after,.fd-form-header:before{box-sizing:inherit;font-size:inherit}.fd-form-header__text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader4Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-header__text:after,.fd-form-header__text:before{box-sizing:inherit;font-size:inherit}fdp-form-group{display:block}.fd-form-label{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help", "fd-inline-help-template"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link], [fd-breadcrumb-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: FormGroupHeaderComponent, selector: "[fdp-form-group-header]", inputs: ["fieldGroup"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: FieldGroupRowValuePipe, name: "fieldGroupRowValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupComponent, selector: "fdp-form-group", inputs: { id: "id", name: "name", editable: "editable", noLabelLayout: "noLabelLayout", class: "class", hint: "hint", inlineColumnLayout: "inlineColumnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", formGroup: "formGroup", topTitle: "topTitle", mainTitle: "mainTitle", hideMainTItle: "hideMainTItle", object: "object", i18Strings: "i18Strings", useForm: "useForm", columnLayout: "columnLayout", unifiedLayout: "unifiedLayout" }, outputs: { onSubmit: "onSubmit" }, providers: [formGroupProvider, FormFieldLayoutService, contentDensityObserverProviders()], queries: [{ propertyName: "i18Template", first: true, predicate: ["i18n"], descendants: true, static: true }, { propertyName: "_errorDirectives", predicate: FormFieldErrorDirective }, { propertyName: "formGroupChildren", predicate: FORM_GROUP_CHILD_FIELD_TOKEN, descendants: true }], viewQueries: [{ propertyName: "nativeForm", first: true, predicate: ["nativeForm"], descendants: true, read: NgForm }], usesOnChanges: true, ngImport: i0, template: "<form #nativeForm (ngSubmit)=\"onSubmit.emit($event)\" *ngIf=\"useForm; else body\" [id]=\"id\" [name]=\"name\">\n    <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n</form>\n\n<ng-template #body>\n    <!--  Render fields and field groups with assigned columns -->\n    <ng-container *ngTemplateOutlet=\"fields\"></ng-container>\n</ng-template>\n\n<ng-template #fields>\n    <div *ngIf=\"mainTitle && !hideMainTItle\" class=\"fd-form-header\">\n        <ng-template [ngTemplateOutlet]=\"mainTitleTemplate\"></ng-template>\n    </div>\n\n    <div\n        class=\"fd-container fd-form-layout-grid-container\"\n        [class.is-compact]=\"contentDensityObserver.isCompact$ | async\"\n    >\n        <div *ngFor=\"let column of formRows | keyvalue; trackBy: trackByFn\" class=\"fd-row\">\n            <div\n                *ngFor=\"let fields of column | fieldGroupRowValue | keyvalue; trackBy: trackByFn; let index = index\"\n                class=\"fd-col fd-form-group\"\n                [class]=\"xlCol\"\n            >\n                <div class=\"fd-row\" *ngIf=\"$fieldGroup(column.value) as value\">\n                    <div class=\"fd-col\">\n                        <div *ngIf=\"value.label\" fdp-form-group-header [fieldGroup]=\"index === 0 ? value : null\"></div>\n                    </div>\n                </div>\n\n                <div *ngFor=\"let field of fields.value; trackBy: trackByFieldName\" class=\"fd-row fd-form-item\">\n                    <div class=\"fd-col\" [class]=\"_inlineColumnLayoutClass\" [style.order]=\"field.rank\">\n                        <ng-container *ngTemplateOutlet=\"field?.renderer || null\"></ng-container>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<!-- For nested form-group -->\n<ng-content select=\"fdp-form-group\"></ng-content>\n\n<ng-template #mainTitleTemplate>\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'before'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <h5 class=\"fd-form-header__text\">\n        {{ mainTitle }}\n    </h5>\n\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'after'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <ng-template #hintTemplate>\n        <span fd-link [undecorated]=\"true\">\n            <fd-icon\n                [fd-inline-help]=\"_hintOptions.content\"\n                [glyph]=\"_hintOptions.glyph\"\n                [placement]=\"_hintOptions.placement || null\"\n                [triggers]=\"_hintOptions.trigger || []\"\n                tabindex=\"0\"\n            ></fd-icon>\n        </span>\n    </ng-template>\n</ng-template>\n", styles: [".fd-col,.fd-container,.fd-row{-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:0;padding:0}.fd-col:after,.fd-col:before,.fd-container:after,.fd-container:before,.fd-row:after,.fd-row:before{box-sizing:inherit;font-size:inherit}.fd-container{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;padding:0 .25rem;position:relative}.fd-container .fd-row{margin-left:-.25rem;margin-right:-.25rem;min-width:calc(100% + .5rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.25rem;padding-top:.25rem}.fd-container.fd-container--no-gap .fd-row,.fd-container.fd-container--no-horizontal-gap .fd-row{margin-left:0;margin-right:0}.fd-container.fd-container--no-gap .fd-row .fd-col,.fd-container.fd-container--no-horizontal-gap .fd-row .fd-col{padding-left:0;padding-right:0}.fd-container.fd-container--no-gap>.fd-row>.fd-col,.fd-container.fd-container--no-vertical-gap>.fd-row>.fd-col{padding-bottom:0;padding-top:0}.fd-container[dir=rtl],[dir=rtl] .fd-container{direction:rtl}.fd-row{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;min-width:100%;position:relative}.fd-col{max-width:100%;min-width:100%;padding-left:.25rem;padding-right:.25rem}.fd-col--0{max-width:0;min-width:0%}.fd-col--offset-0{margin-left:0}.fd-col--offset-0[dir=rtl],[dir=rtl] .fd-col--offset-0{margin-left:0;margin-right:0}.fd-col--offset-after-0{margin-right:0}.fd-col--offset-after-0[dir=rtl],[dir=rtl] .fd-col--offset-after-0{margin-left:0;margin-right:0}.fd-col--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col--offset-1{margin-left:8.3333333333%}.fd-col--offset-1[dir=rtl],[dir=rtl] .fd-col--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col--offset-after-1{margin-right:8.3333333333%}.fd-col--offset-after-1[dir=rtl],[dir=rtl] .fd-col--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col--offset-2{margin-left:16.6666666667%}.fd-col--offset-2[dir=rtl],[dir=rtl] .fd-col--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col--offset-after-2{margin-right:16.6666666667%}.fd-col--offset-after-2[dir=rtl],[dir=rtl] .fd-col--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col--3{max-width:25%;min-width:25%}.fd-col--offset-3{margin-left:25%}.fd-col--offset-3[dir=rtl],[dir=rtl] .fd-col--offset-3{margin-left:0;margin-right:25%}.fd-col--offset-after-3{margin-right:25%}.fd-col--offset-after-3[dir=rtl],[dir=rtl] .fd-col--offset-after-3{margin-left:25%;margin-right:0}.fd-col--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col--offset-4{margin-left:33.3333333333%}.fd-col--offset-4[dir=rtl],[dir=rtl] .fd-col--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col--offset-after-4{margin-right:33.3333333333%}.fd-col--offset-after-4[dir=rtl],[dir=rtl] .fd-col--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col--offset-5{margin-left:41.6666666667%}.fd-col--offset-5[dir=rtl],[dir=rtl] .fd-col--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col--offset-after-5{margin-right:41.6666666667%}.fd-col--offset-after-5[dir=rtl],[dir=rtl] .fd-col--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col--6{max-width:50%;min-width:50%}.fd-col--offset-6{margin-left:50%}.fd-col--offset-6[dir=rtl],[dir=rtl] .fd-col--offset-6{margin-left:0;margin-right:50%}.fd-col--offset-after-6{margin-right:50%}.fd-col--offset-after-6[dir=rtl],[dir=rtl] .fd-col--offset-after-6{margin-left:50%;margin-right:0}.fd-col--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col--offset-7{margin-left:58.3333333333%}.fd-col--offset-7[dir=rtl],[dir=rtl] .fd-col--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col--offset-after-7{margin-right:58.3333333333%}.fd-col--offset-after-7[dir=rtl],[dir=rtl] .fd-col--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col--offset-8{margin-left:66.6666666667%}.fd-col--offset-8[dir=rtl],[dir=rtl] .fd-col--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col--offset-after-8{margin-right:66.6666666667%}.fd-col--offset-after-8[dir=rtl],[dir=rtl] .fd-col--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col--9{max-width:75%;min-width:75%}.fd-col--offset-9{margin-left:75%}.fd-col--offset-9[dir=rtl],[dir=rtl] .fd-col--offset-9{margin-left:0;margin-right:75%}.fd-col--offset-after-9{margin-right:75%}.fd-col--offset-after-9[dir=rtl],[dir=rtl] .fd-col--offset-after-9{margin-left:75%;margin-right:0}.fd-col--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col--offset-10{margin-left:83.3333333333%}.fd-col--offset-10[dir=rtl],[dir=rtl] .fd-col--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col--offset-after-10{margin-right:83.3333333333%}.fd-col--offset-after-10[dir=rtl],[dir=rtl] .fd-col--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col--offset-11{margin-left:91.6666666667%}.fd-col--offset-11[dir=rtl],[dir=rtl] .fd-col--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col--offset-after-11{margin-right:91.6666666667%}.fd-col--offset-after-11[dir=rtl],[dir=rtl] .fd-col--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col--12{max-width:100%;min-width:100%}.fd-col--offset-12{margin-left:100%}.fd-col--offset-12[dir=rtl],[dir=rtl] .fd-col--offset-12{margin-left:0;margin-right:100%}.fd-col--offset-after-12{margin-right:100%}.fd-col--offset-after-12[dir=rtl],[dir=rtl] .fd-col--offset-after-12{margin-left:100%;margin-right:0}.fd-col--full{flex:1;max-width:none;min-width:8.3333333333%}.fd-col--wrap{flex-wrap:wrap}@media (min-width: 600px){.fd-container{padding:0 .5rem}.fd-container .fd-row{margin-left:-.5rem;margin-right:-.5rem;min-width:calc(100% + 1rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.5rem;padding-top:.5rem}.fd-col{padding-left:.5rem;padding-right:.5rem}.fd-col-md--0{max-width:0;min-width:0%}.fd-col-md--offset-0{margin-left:0}.fd-col-md--offset-0[dir=rtl],[dir=rtl] .fd-col-md--offset-0{margin-left:0;margin-right:0}.fd-col-md--offset-after-0{margin-right:0}.fd-col-md--offset-after-0[dir=rtl],[dir=rtl] .fd-col-md--offset-after-0{margin-left:0;margin-right:0}.fd-col-md--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-md--offset-1{margin-left:8.3333333333%}.fd-col-md--offset-1[dir=rtl],[dir=rtl] .fd-col-md--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-md--offset-after-1{margin-right:8.3333333333%}.fd-col-md--offset-after-1[dir=rtl],[dir=rtl] .fd-col-md--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-md--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-md--offset-2{margin-left:16.6666666667%}.fd-col-md--offset-2[dir=rtl],[dir=rtl] .fd-col-md--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-md--offset-after-2{margin-right:16.6666666667%}.fd-col-md--offset-after-2[dir=rtl],[dir=rtl] .fd-col-md--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-md--3{max-width:25%;min-width:25%}.fd-col-md--offset-3{margin-left:25%}.fd-col-md--offset-3[dir=rtl],[dir=rtl] .fd-col-md--offset-3{margin-left:0;margin-right:25%}.fd-col-md--offset-after-3{margin-right:25%}.fd-col-md--offset-after-3[dir=rtl],[dir=rtl] .fd-col-md--offset-after-3{margin-left:25%;margin-right:0}.fd-col-md--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-md--offset-4{margin-left:33.3333333333%}.fd-col-md--offset-4[dir=rtl],[dir=rtl] .fd-col-md--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-md--offset-after-4{margin-right:33.3333333333%}.fd-col-md--offset-after-4[dir=rtl],[dir=rtl] .fd-col-md--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-md--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-md--offset-5{margin-left:41.6666666667%}.fd-col-md--offset-5[dir=rtl],[dir=rtl] .fd-col-md--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-md--offset-after-5{margin-right:41.6666666667%}.fd-col-md--offset-after-5[dir=rtl],[dir=rtl] .fd-col-md--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-md--6{max-width:50%;min-width:50%}.fd-col-md--offset-6{margin-left:50%}.fd-col-md--offset-6[dir=rtl],[dir=rtl] .fd-col-md--offset-6{margin-left:0;margin-right:50%}.fd-col-md--offset-after-6{margin-right:50%}.fd-col-md--offset-after-6[dir=rtl],[dir=rtl] .fd-col-md--offset-after-6{margin-left:50%;margin-right:0}.fd-col-md--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-md--offset-7{margin-left:58.3333333333%}.fd-col-md--offset-7[dir=rtl],[dir=rtl] .fd-col-md--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-md--offset-after-7{margin-right:58.3333333333%}.fd-col-md--offset-after-7[dir=rtl],[dir=rtl] .fd-col-md--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-md--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-md--offset-8{margin-left:66.6666666667%}.fd-col-md--offset-8[dir=rtl],[dir=rtl] .fd-col-md--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-md--offset-after-8{margin-right:66.6666666667%}.fd-col-md--offset-after-8[dir=rtl],[dir=rtl] .fd-col-md--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-md--9{max-width:75%;min-width:75%}.fd-col-md--offset-9{margin-left:75%}.fd-col-md--offset-9[dir=rtl],[dir=rtl] .fd-col-md--offset-9{margin-left:0;margin-right:75%}.fd-col-md--offset-after-9{margin-right:75%}.fd-col-md--offset-after-9[dir=rtl],[dir=rtl] .fd-col-md--offset-after-9{margin-left:75%;margin-right:0}.fd-col-md--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-md--offset-10{margin-left:83.3333333333%}.fd-col-md--offset-10[dir=rtl],[dir=rtl] .fd-col-md--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-md--offset-after-10{margin-right:83.3333333333%}.fd-col-md--offset-after-10[dir=rtl],[dir=rtl] .fd-col-md--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-md--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-md--offset-11{margin-left:91.6666666667%}.fd-col-md--offset-11[dir=rtl],[dir=rtl] .fd-col-md--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-md--offset-after-11{margin-right:91.6666666667%}.fd-col-md--offset-after-11[dir=rtl],[dir=rtl] .fd-col-md--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-md--12{max-width:100%;min-width:100%}.fd-col-md--offset-12{margin-left:100%}.fd-col-md--offset-12[dir=rtl],[dir=rtl] .fd-col-md--offset-12{margin-left:0;margin-right:100%}.fd-col-md--offset-after-12{margin-right:100%}.fd-col-md--offset-after-12[dir=rtl],[dir=rtl] .fd-col-md--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1024px){.fd-col-lg--0{max-width:0;min-width:0%}.fd-col-lg--offset-0{margin-left:0}.fd-col-lg--offset-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-0{margin-left:0;margin-right:0}.fd-col-lg--offset-after-0{margin-right:0}.fd-col-lg--offset-after-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-0{margin-left:0;margin-right:0}.fd-col-lg--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-lg--offset-1{margin-left:8.3333333333%}.fd-col-lg--offset-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-lg--offset-after-1{margin-right:8.3333333333%}.fd-col-lg--offset-after-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-lg--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-lg--offset-2{margin-left:16.6666666667%}.fd-col-lg--offset-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-lg--offset-after-2{margin-right:16.6666666667%}.fd-col-lg--offset-after-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-lg--3{max-width:25%;min-width:25%}.fd-col-lg--offset-3{margin-left:25%}.fd-col-lg--offset-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-3{margin-left:0;margin-right:25%}.fd-col-lg--offset-after-3{margin-right:25%}.fd-col-lg--offset-after-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-3{margin-left:25%;margin-right:0}.fd-col-lg--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-lg--offset-4{margin-left:33.3333333333%}.fd-col-lg--offset-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-lg--offset-after-4{margin-right:33.3333333333%}.fd-col-lg--offset-after-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-lg--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-lg--offset-5{margin-left:41.6666666667%}.fd-col-lg--offset-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-lg--offset-after-5{margin-right:41.6666666667%}.fd-col-lg--offset-after-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-lg--6{max-width:50%;min-width:50%}.fd-col-lg--offset-6{margin-left:50%}.fd-col-lg--offset-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-6{margin-left:0;margin-right:50%}.fd-col-lg--offset-after-6{margin-right:50%}.fd-col-lg--offset-after-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-6{margin-left:50%;margin-right:0}.fd-col-lg--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-lg--offset-7{margin-left:58.3333333333%}.fd-col-lg--offset-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-lg--offset-after-7{margin-right:58.3333333333%}.fd-col-lg--offset-after-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-lg--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-lg--offset-8{margin-left:66.6666666667%}.fd-col-lg--offset-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-lg--offset-after-8{margin-right:66.6666666667%}.fd-col-lg--offset-after-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-lg--9{max-width:75%;min-width:75%}.fd-col-lg--offset-9{margin-left:75%}.fd-col-lg--offset-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-9{margin-left:0;margin-right:75%}.fd-col-lg--offset-after-9{margin-right:75%}.fd-col-lg--offset-after-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-9{margin-left:75%;margin-right:0}.fd-col-lg--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-lg--offset-10{margin-left:83.3333333333%}.fd-col-lg--offset-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-lg--offset-after-10{margin-right:83.3333333333%}.fd-col-lg--offset-after-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-lg--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-lg--offset-11{margin-left:91.6666666667%}.fd-col-lg--offset-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-lg--offset-after-11{margin-right:91.6666666667%}.fd-col-lg--offset-after-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-lg--12{max-width:100%;min-width:100%}.fd-col-lg--offset-12{margin-left:100%}.fd-col-lg--offset-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-12{margin-left:0;margin-right:100%}.fd-col-lg--offset-after-12{margin-right:100%}.fd-col-lg--offset-after-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1440px){.fd-col-xl--0{max-width:0;min-width:0%}.fd-col-xl--offset-0{margin-left:0}.fd-col-xl--offset-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-0{margin-left:0;margin-right:0}.fd-col-xl--offset-after-0{margin-right:0}.fd-col-xl--offset-after-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-0{margin-left:0;margin-right:0}.fd-col-xl--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-xl--offset-1{margin-left:8.3333333333%}.fd-col-xl--offset-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-xl--offset-after-1{margin-right:8.3333333333%}.fd-col-xl--offset-after-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-xl--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-xl--offset-2{margin-left:16.6666666667%}.fd-col-xl--offset-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-xl--offset-after-2{margin-right:16.6666666667%}.fd-col-xl--offset-after-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-xl--3{max-width:25%;min-width:25%}.fd-col-xl--offset-3{margin-left:25%}.fd-col-xl--offset-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-3{margin-left:0;margin-right:25%}.fd-col-xl--offset-after-3{margin-right:25%}.fd-col-xl--offset-after-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-3{margin-left:25%;margin-right:0}.fd-col-xl--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-xl--offset-4{margin-left:33.3333333333%}.fd-col-xl--offset-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-xl--offset-after-4{margin-right:33.3333333333%}.fd-col-xl--offset-after-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-xl--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-xl--offset-5{margin-left:41.6666666667%}.fd-col-xl--offset-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-xl--offset-after-5{margin-right:41.6666666667%}.fd-col-xl--offset-after-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-xl--6{max-width:50%;min-width:50%}.fd-col-xl--offset-6{margin-left:50%}.fd-col-xl--offset-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-6{margin-left:0;margin-right:50%}.fd-col-xl--offset-after-6{margin-right:50%}.fd-col-xl--offset-after-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-6{margin-left:50%;margin-right:0}.fd-col-xl--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-xl--offset-7{margin-left:58.3333333333%}.fd-col-xl--offset-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-xl--offset-after-7{margin-right:58.3333333333%}.fd-col-xl--offset-after-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-xl--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-xl--offset-8{margin-left:66.6666666667%}.fd-col-xl--offset-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-xl--offset-after-8{margin-right:66.6666666667%}.fd-col-xl--offset-after-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-xl--9{max-width:75%;min-width:75%}.fd-col-xl--offset-9{margin-left:75%}.fd-col-xl--offset-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-9{margin-left:0;margin-right:75%}.fd-col-xl--offset-after-9{margin-right:75%}.fd-col-xl--offset-after-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-9{margin-left:75%;margin-right:0}.fd-col-xl--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-xl--offset-10{margin-left:83.3333333333%}.fd-col-xl--offset-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-xl--offset-after-10{margin-right:83.3333333333%}.fd-col-xl--offset-after-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-xl--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-xl--offset-11{margin-left:91.6666666667%}.fd-col-xl--offset-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-xl--offset-after-11{margin-right:91.6666666667%}.fd-col-xl--offset-after-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-xl--12{max-width:100%;min-width:100%}.fd-col-xl--offset-12{margin-left:100%}.fd-col-xl--offset-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-12{margin-left:0;margin-right:100%}.fd-col-xl--offset-after-12{margin-right:100%}.fd-col-xl--offset-after-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-12{margin-left:100%;margin-right:0}}.fd-container.fd-form-layout-grid-container .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group{padding:1rem!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-group{padding:0!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-right:0;white-space:normal}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-left:0;margin-right:0}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-right:.5rem}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-left:.5rem;padding-right:0}.fd-container.fd-form-layout-grid-container .fd-row{flex-direction:row}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{overflow:hidden;padding-bottom:0;padding-top:0;text-overflow:ellipsis;white-space:nowrap}.fd-container.fd-form-layout-grid-container .fd-row .fd-col:not(.fd-form-group){align-self:center}@media (min-width: 0){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:right;text-align:right}}@media (min-width: 0) and (max-width: 599px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 600px){.fd-container.fd-form-layout-grid-container{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row{margin:0 -.25rem;min-width:calc(100% + .5rem)}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:right;text-align:right}}@media (min-width: 600px) and (max-width: 1023px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1024px){.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:right;text-align:right}}@media (min-width: 1024px) and (max-width: 1443px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1440px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:right;text-align:right}}/*!\n.fd-section+(--full-bleed, --no-border)\n    .fd-section__header\n        .fd-section__title\n        .fd-section__actions\n    .fd-section__footer\n*/.fd-section{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_Background);border:0;border-bottom:none;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:0;padding:1rem .5rem 1.5rem}.fd-section:after,.fd-section:before{box-sizing:inherit;font-size:inherit}.fd-section:after{clear:both;content:\"\";display:table}@media (min-width: 600px){.fd-section{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section{padding-left:3rem;padding-right:3rem}}.fd-section--no-border,.fd-section:last-child{border-bottom:0}.fd-section--bleed,.fd-section--full-bleed{-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:0;padding:0}.fd-section--bleed:after,.fd-section--bleed:before,.fd-section--full-bleed:after,.fd-section--full-bleed:before{box-sizing:inherit;font-size:inherit}.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:3rem;padding-right:3rem}}.fd-section__header{-webkit-box-sizing:border-box;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 1.5rem;min-height:1.5rem;padding:0}.fd-section__header:after,.fd-section__header:before{box-sizing:inherit;font-size:inherit}.fd-section__title{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTitleColor);flex:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader2Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);line-height:2rem;margin:0;padding:0}.fd-section__title:after,.fd-section__title:before{box-sizing:inherit;font-size:inherit}.fd-section__actions{-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:0 0 0 auto;padding:0}.fd-section__actions:after,.fd-section__actions:before{box-sizing:inherit;font-size:inherit}.fd-section__footer{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section__footer:after,.fd-section__footer:before{box-sizing:inherit;font-size:inherit}/*!\n  .fd-form-group(--inline)\n*/.fd-form-group{-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:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-form-header\n   .fd-form-header__text\n*/.fd-form-header{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 1rem;width:100%}.fd-form-header:after,.fd-form-header:before{box-sizing:inherit;font-size:inherit}.fd-form-header__text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader4Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-header__text:after,.fd-form-header__text:before{box-sizing:inherit;font-size:inherit}fdp-form-group{display:block}.fd-form-label{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: FormGroupHeaderComponent, selector: "[fdp-form-group-header]", inputs: ["fieldGroup"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: FieldGroupRowValuePipe, name: "fieldGroupRowValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupComponent, decorators: [{
             type: Component,
@@ -7814,8 +7436,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], hint: [{
                 type: Input
-            }], labelLayout: [{
-                type: Input
             }], inlineColumnLayout: [{
                 type: Input
             }], labelColumnLayout: [{
@@ -7895,25 +7515,6 @@ class FormGeneratorComponent {
     get formItems() {
         return this._formItems;
     }
-    /**
-     * @deprecated
-     * Use labelColumnLayout, fieldColumnLayout and gapColumnLayout properties.
-     *
-     * Defines form field label placement.
-     */
-    set labelLayout(value) {
-        if (isDevMode()) {
-            warnOnce$1('LabelLayout input property is deprecated. Please use labelColumnLayout, fieldColumnLayout and gapColumnLayout properties instead');
-        }
-        this._labelLayout = value;
-        this.labelColumnLayout =
-            this._labelLayout === 'horizontal' ? DefaultHorizontalLabelLayout : DefaultVerticalLabelLayout;
-        this.fieldColumnLayout =
-            this._labelLayout === 'horizontal' ? DefaultHorizontalFieldLayout : DefaultVerticalFieldLayout;
-    }
-    get labelLayout() {
-        return this._labelLayout;
-    }
     /** Array of form field controls. */
     get formFields() {
         return this.fields
@@ -8052,33 +7653,6 @@ class FormGeneratorComponent {
         this.formValue$.next(formValue);
         this.form.markAsPristine();
     }
-    /**
-     * @hidden
-     */
-    async _generateForm() {
-        this.formLoading = true;
-        this.loading$.next(this.formLoading);
-        const form = await this._fgService.generateForm(this.formName, this.formItems);
-        this._formValueSubscription?.unsubscribe();
-        this.form = form;
-        this.formControlItems = this._getOrderedControls(form.controls);
-        this.shouldShowFields = await this._fgService.checkVisibleFormItems(this.form);
-        this._formValueSubscription = this.form.valueChanges
-            .pipe(debounceTime(50), takeUntil(this._onDestroy$))
-            .subscribe(async () => {
-            this.shouldShowFields = await this._fgService.checkVisibleFormItems(this.form);
-            this._cd.markForCheck();
-        });
-        this.formLoading = false;
-        this._firstLoadingDone = true;
-        this._cd.detectChanges();
-        this.formCreated.emit(this.form);
-        this.loading$.next(this.formLoading);
-        if (!this.formGroup) {
-            return;
-        }
-        this._listenToSubmit();
-    }
     /**
      *
      * @hidden
@@ -8094,10 +7668,6 @@ class FormGeneratorComponent {
     submit() {
         this.formGroup.onSubmit(new Event('submit'));
     }
-    /** @hidden */
-    _getOrderedControls(controls) {
-        return Object.values(controls).sort((a, b) => (a.formItem?.rank ?? -Infinity) - (b.formItem?.rank ?? -Infinity));
-    }
     /**
      * @description
      * Used for extracting hintOptions from GuiOptions. This will coerce string | HintOptions to FieldHintOptions,
@@ -8109,17 +7679,14 @@ class FormGeneratorComponent {
             return;
         }
         const formItemHintOptions = guiOptions.hint;
-        const placement = guiOptions.hintPlacement || this._defaultHintOptions.placement;
         if (typeof formItemHintOptions === 'string' || formItemHintOptions instanceof TemplateRef) {
             return {
                 ...this._defaultHintOptions,
-                placement,
                 content: formItemHintOptions
             };
         }
         return {
             ...this._defaultHintOptions,
-            placement,
             ...formItemHintOptions
         };
     }
@@ -8127,6 +7694,37 @@ class FormGeneratorComponent {
     _isAdvancedError(error) {
         return error.heading && error.description && error.type;
     }
+    /**
+     * @hidden
+     */
+    async _generateForm() {
+        this.formLoading = true;
+        this.loading$.next(this.formLoading);
+        const form = await this._fgService.generateForm(this.formName, this.formItems);
+        this._formValueSubscription?.unsubscribe();
+        this.form = form;
+        this.formControlItems = this._getOrderedControls(form.controls);
+        this.shouldShowFields = await this._fgService.checkVisibleFormItems(this.form);
+        this._formValueSubscription = this.form.valueChanges
+            .pipe(debounceTime(50), takeUntil(this._onDestroy$))
+            .subscribe(async () => {
+            this.shouldShowFields = await this._fgService.checkVisibleFormItems(this.form);
+            this._cd.markForCheck();
+        });
+        this.formLoading = false;
+        this._firstLoadingDone = true;
+        this._cd.detectChanges();
+        this.formCreated.emit(this.form);
+        this.loading$.next(this.formLoading);
+        if (!this.formGroup) {
+            return;
+        }
+        this._listenToSubmit();
+    }
+    /** @hidden */
+    _getOrderedControls(controls) {
+        return Object.values(controls).sort((a, b) => (a.formItem?.rank ?? -Infinity) - (b.formItem?.rank ?? -Infinity));
+    }
     /** @hidden */
     _getErrors() {
         const returnErrors = [];
@@ -8153,7 +7751,7 @@ class FormGeneratorComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGeneratorComponent, deps: [{ token: FormGeneratorService }, { token: i0.ChangeDetectorRef }, { token: FDP_FORM_GENERATOR_DEFAULT_HINT_OPTIONS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGeneratorComponent, selector: "fdp-form-generator", inputs: { formName: "formName", formItems: "formItems", mainTitle: "mainTitle", hideMainTItle: "hideMainTItle", hint: "hint", columnLayout: "columnLayout", labelLayout: "labelLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", unifiedLayout: "unifiedLayout", inlineColumnLayout: "inlineColumnLayout", noAdditionalContent: "noAdditionalContent" }, outputs: { formCreated: "formCreated", formSubmitted: "formSubmitted", formSubmittedStatus: "formSubmittedStatus" }, viewQueries: [{ propertyName: "ngForm", first: true, predicate: NgForm, descendants: true }, { propertyName: "formGroup", first: true, predicate: FormGroupDirective, descendants: true }, { propertyName: "fields", predicate: FormGeneratorFieldComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<fd-busy-indicator *ngIf=\"_firstLoadingDone; else loadingTemplate\" [loading]=\"formLoading\" [block]=\"true\">\n    <fdp-form-group\n        *ngIf=\"form\"\n        [hint]=\"hint\"\n        [mainTitle]=\"mainTitle\"\n        [hideMainTItle]=\"hideMainTItle\"\n        [formGroup]=\"form\"\n        [columnLayout]=\"columnLayout\"\n        [labelColumnLayout]=\"labelColumnLayout\"\n        [fieldColumnLayout]=\"fieldColumnLayout\"\n        [gapColumnLayout]=\"gapColumnLayout\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [inlineColumnLayout]=\"inlineColumnLayout\"\n        [useForm]=\"true\"\n    >\n        <ng-container *ngFor=\"let error of _errorModels\">\n            <span *fdpFormFieldError=\"error.type; let directiveError\">\n                <ng-container *ngIf=\"_isAdvancedError(directiveError)\">\n                    <ng-container *ngIf=\"directiveError.heading\">\n                        <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                            {{ validationError.heading }}\n                        </span>\n                    </ng-container>\n                    <ng-container *ngIf=\"directiveError.description\">\n                        <span *fdpFormFieldErrorDescription=\"let validationError\">\n                            {{ validationError.description }}\n                        </span>\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!_isAdvancedError(directiveError)\">\n                    <span *fdpFormFieldErrorHeading=\"let validationError\">\n                        {{ error.value ? error.value : validationError }}\n                    </span>\n                </ng-container>\n            </span>\n        </ng-container>\n        <ng-container *ngFor=\"let field of formControlItems; trackBy: _trackFn\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    field.type === 'field' ? fieldRenderer : groupRenderer;\n                    context: { field: field, formFieldName: field.formItem.name, rank: field.formItem?.rank || 0 }\n                \"\n            ></ng-container>\n            <ng-template\n                #fieldRenderer\n                let-field=\"field\"\n                let-formFieldName=\"formFieldName\"\n                let-formGroupName=\"formGroupName\"\n                let-rank=\"rank\"\n            >\n                <ng-container\n                    *fdpDynamicFormControlField=\"field; show: shouldShowFields[field.formItem.name] !== false\"\n                >\n                    <fdp-form-generator-field\n                        [hintOptions]=\"getHintOptions(field.formItem.guiOptions)\"\n                        [form]=\"form\"\n                        [shouldShow]=\"shouldShowFields[field.formItem.name] !== false\"\n                        [field]=\"field\"\n                        [formFieldName]=\"formFieldName\"\n                        [formGroupNamePath]=\"formGroupName\"\n                        [rank]=\"rank\"\n                    ></fdp-form-generator-field>\n                </ng-container>\n            </ng-template>\n            <ng-template #groupRenderer>\n                <fdp-form-field-group\n                    [hintOptions]=\"getHintOptions(field.formItem.guiOptions)\"\n                    [label]=\"field.formItem.message || ''\"\n                    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n                    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n                    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n                    [formName]=\"field.formItem.name\"\n                >\n                    <ng-container *ngFor=\"let groupField of field | getOrderedFieldControls\">\n                        <ng-container\n                            *fdpDynamicFormControlField=\"\n                                groupField;\n                                show: shouldShowFields[groupField.formItem.name!] !== false\n                            \"\n                        >\n                            <fdp-form-generator-field\n                                [hintOptions]=\"getHintOptions(groupField.formItem.guiOptions)\"\n                                [form]=\"form\"\n                                [field]=\"groupField\"\n                                [shouldShow]=\"shouldShowFields[groupField.formItem.name!] !== false\"\n                                [formFieldName]=\"groupField.formItem.name\"\n                                [formGroupNamePath]=\"field.formItem.name\"\n                                [rank]=\"groupField.formItem.rank || 0\"\n                            ></fdp-form-generator-field>\n                        </ng-container>\n                    </ng-container>\n                </fdp-form-field-group>\n            </ng-template>\n        </ng-container>\n        <fdp-form-field *ngIf=\"!noAdditionalContent\" [column]=\"1\" [rank]=\"formControlItems.length + 1\">\n            <!-- For user-defined elements, like submit button -->\n            <ng-content></ng-content>\n        </fdp-form-field>\n    </fdp-form-group>\n</fd-busy-indicator>\n\n<ng-template #loadingTemplate>\n    <fd-skeleton width=\"100%\" height=\"100px\" style=\"padding: 1rem\">\n        <svg:rect x=\"0\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"35%\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"35%\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"0\" y=\"60\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"80\" rx=\"4\" width=\"25%\" height=\"16\" />\n    </fd-skeleton>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FormGroupComponent, selector: "fdp-form-group", inputs: ["id", "name", "editable", "noLabelLayout", "class", "hint", "labelLayout", "inlineColumnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "formGroup", "topTitle", "mainTitle", "hideMainTItle", "object", "i18Strings", "useForm", "columnLayout", "unifiedLayout"], outputs: ["onSubmit"] }, { kind: "component", type: FormFieldComponent, selector: "fdp-form-field", inputs: ["label", "id", "hintPlacement", "hint", "labelLayout", "noLabelLayout", "validators", "rank", "placeholder", "column", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "i18Strings", "required", "editable", "columns", "disabled", "colon", "formGroupContainer"], outputs: ["onChange", "onColumnChange"] }, { kind: "component", type: FormFieldGroupComponent, selector: "fdp-form-field-group", inputs: ["label", "formName", "formGroupContainer", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "hintOptions"] }, { kind: "directive", type: FormFieldErrorDirective, selector: "[fdpFormFieldError]", inputs: ["fdpFormFieldErrorAs", "fdpFormFieldError", "fdpFormFieldErrorType"] }, { kind: "directive", type: FormFieldErrorHeadingDirective, selector: "[fdpFormFieldErrorHeading]", inputs: ["fdpFormFieldErrorHeadingAs", "fdpFormFieldErrorHeadingType"] }, { kind: "directive", type: FormFieldErrorDescriptionDirective, selector: "[fdpFormFieldErrorDescription]", inputs: ["fdpFormFieldErrorDescriptionAs"] }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i10$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i11.SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }, { kind: "directive", type: DynamicFormControlFieldDirective, selector: "[fdpDynamicFormControlField]", inputs: ["fdpDynamicFormControlField", "fdpDynamicFormControlFieldShow"] }, { kind: "component", type: FormGeneratorFieldComponent, selector: "fdp-form-generator-field", inputs: ["field", "form", "i18n", "formFieldName", "formGroupNamePath", "rank", "shouldShow", "hintOptions"] }, { kind: "pipe", type: GetOrderedFieldControlsPipe, name: "getOrderedFieldControls" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGeneratorComponent, selector: "fdp-form-generator", inputs: { formName: "formName", formItems: "formItems", mainTitle: "mainTitle", hideMainTItle: "hideMainTItle", hint: "hint", columnLayout: "columnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", unifiedLayout: "unifiedLayout", inlineColumnLayout: "inlineColumnLayout", noAdditionalContent: "noAdditionalContent" }, outputs: { formCreated: "formCreated", formSubmitted: "formSubmitted", formSubmittedStatus: "formSubmittedStatus" }, viewQueries: [{ propertyName: "ngForm", first: true, predicate: NgForm, descendants: true }, { propertyName: "formGroup", first: true, predicate: FormGroupDirective, descendants: true }, { propertyName: "fields", predicate: FormGeneratorFieldComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<fd-busy-indicator *ngIf=\"_firstLoadingDone; else loadingTemplate\" [loading]=\"formLoading\" [block]=\"true\">\n    <fdp-form-group\n        *ngIf=\"form\"\n        [hint]=\"hint\"\n        [mainTitle]=\"mainTitle\"\n        [hideMainTItle]=\"hideMainTItle\"\n        [formGroup]=\"form\"\n        [columnLayout]=\"columnLayout\"\n        [labelColumnLayout]=\"labelColumnLayout\"\n        [fieldColumnLayout]=\"fieldColumnLayout\"\n        [gapColumnLayout]=\"gapColumnLayout\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [inlineColumnLayout]=\"inlineColumnLayout\"\n        [useForm]=\"true\"\n    >\n        <ng-container *ngFor=\"let error of _errorModels\">\n            <span *fdpFormFieldError=\"error.type; let directiveError\">\n                <ng-container *ngIf=\"_isAdvancedError(directiveError)\">\n                    <ng-container *ngIf=\"directiveError.heading\">\n                        <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                            {{ validationError.heading }}\n                        </span>\n                    </ng-container>\n                    <ng-container *ngIf=\"directiveError.description\">\n                        <span *fdpFormFieldErrorDescription=\"let validationError\">\n                            {{ validationError.description }}\n                        </span>\n                    </ng-container>\n                </ng-container>\n                <ng-container *ngIf=\"!_isAdvancedError(directiveError)\">\n                    <span *fdpFormFieldErrorHeading=\"let validationError\">\n                        {{ error.value ? error.value : validationError }}\n                    </span>\n                </ng-container>\n            </span>\n        </ng-container>\n        <ng-container *ngFor=\"let field of formControlItems; trackBy: _trackFn\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    field.type === 'field' ? fieldRenderer : groupRenderer;\n                    context: { field: field, formFieldName: field.formItem.name, rank: field.formItem?.rank || 0 }\n                \"\n            ></ng-container>\n            <ng-template\n                #fieldRenderer\n                let-field=\"field\"\n                let-formFieldName=\"formFieldName\"\n                let-formGroupName=\"formGroupName\"\n                let-rank=\"rank\"\n            >\n                <ng-container\n                    *fdpDynamicFormControlField=\"field; show: shouldShowFields[field.formItem.name] !== false\"\n                >\n                    <fdp-form-generator-field\n                        [hintOptions]=\"getHintOptions(field.formItem.guiOptions)\"\n                        [form]=\"form\"\n                        [shouldShow]=\"shouldShowFields[field.formItem.name] !== false\"\n                        [field]=\"field\"\n                        [formFieldName]=\"formFieldName\"\n                        [formGroupNamePath]=\"formGroupName\"\n                        [rank]=\"rank\"\n                    ></fdp-form-generator-field>\n                </ng-container>\n            </ng-template>\n            <ng-template #groupRenderer>\n                <fdp-form-field-group\n                    [hintOptions]=\"getHintOptions(field.formItem.guiOptions)\"\n                    [label]=\"field.formItem.message || ''\"\n                    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n                    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n                    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n                    [formName]=\"field.formItem.name\"\n                >\n                    <ng-container *ngFor=\"let groupField of field | getOrderedFieldControls\">\n                        <ng-container\n                            *fdpDynamicFormControlField=\"\n                                groupField;\n                                show: shouldShowFields[groupField.formItem.name!] !== false\n                            \"\n                        >\n                            <fdp-form-generator-field\n                                [hintOptions]=\"getHintOptions(groupField.formItem.guiOptions)\"\n                                [form]=\"form\"\n                                [field]=\"groupField\"\n                                [shouldShow]=\"shouldShowFields[groupField.formItem.name!] !== false\"\n                                [formFieldName]=\"groupField.formItem.name\"\n                                [formGroupNamePath]=\"field.formItem.name\"\n                                [rank]=\"groupField.formItem.rank || 0\"\n                            ></fdp-form-generator-field>\n                        </ng-container>\n                    </ng-container>\n                </fdp-form-field-group>\n            </ng-template>\n        </ng-container>\n        <fdp-form-field *ngIf=\"!noAdditionalContent\" [column]=\"1\" [rank]=\"formControlItems.length + 1\">\n            <!-- For user-defined elements, like submit button -->\n            <ng-content></ng-content>\n        </fdp-form-field>\n    </fdp-form-group>\n</fd-busy-indicator>\n\n<ng-template #loadingTemplate>\n    <fd-skeleton width=\"100%\" height=\"100px\" style=\"padding: 1rem\">\n        <svg:rect x=\"0\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"35%\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"35%\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"0\" y=\"60\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"80\" rx=\"4\" width=\"25%\" height=\"16\" />\n    </fd-skeleton>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FormGroupComponent, selector: "fdp-form-group", inputs: ["id", "name", "editable", "noLabelLayout", "class", "hint", "inlineColumnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "formGroup", "topTitle", "mainTitle", "hideMainTItle", "object", "i18Strings", "useForm", "columnLayout", "unifiedLayout"], outputs: ["onSubmit"] }, { kind: "component", type: FormFieldComponent, selector: "fdp-form-field", inputs: ["label", "id", "hint", "noLabelLayout", "validators", "rank", "placeholder", "column", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "i18Strings", "required", "editable", "columns", "disabled", "colon", "formGroupContainer"], outputs: ["onChange", "onColumnChange"] }, { kind: "component", type: FormFieldGroupComponent, selector: "fdp-form-field-group", inputs: ["label", "formName", "formGroupContainer", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "hintOptions"] }, { kind: "directive", type: FormFieldErrorDirective, selector: "[fdpFormFieldError]", inputs: ["fdpFormFieldErrorAs", "fdpFormFieldError", "fdpFormFieldErrorType"] }, { kind: "directive", type: FormFieldErrorHeadingDirective, selector: "[fdpFormFieldErrorHeading]", inputs: ["fdpFormFieldErrorHeadingAs", "fdpFormFieldErrorHeadingType"] }, { kind: "directive", type: FormFieldErrorDescriptionDirective, selector: "[fdpFormFieldErrorDescription]", inputs: ["fdpFormFieldErrorDescriptionAs"] }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i10$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i11.SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }, { kind: "directive", type: DynamicFormControlFieldDirective, selector: "[fdpDynamicFormControlField]", inputs: ["fdpDynamicFormControlField", "fdpDynamicFormControlFieldShow"] }, { kind: "component", type: FormGeneratorFieldComponent, selector: "fdp-form-generator-field", inputs: ["field", "form", "i18n", "formFieldName", "formGroupNamePath", "rank", "shouldShow", "hintOptions"] }, { kind: "pipe", type: GetOrderedFieldControlsPipe, name: "getOrderedFieldControls" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGeneratorComponent, decorators: [{
             type: Component,
@@ -8173,8 +7771,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], columnLayout: [{
                 type: Input
-            }], labelLayout: [{
-                type: Input
             }], labelColumnLayout: [{
                 type: Input
             }], fieldColumnLayout: [{
@@ -8206,62 +7802,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformInputModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, declarations: [InputComponent], imports: [CommonModule,
-            FormModule,
-            FormsModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [InputComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, imports: [CommonModule,
-            FormModule,
-            FormsModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, declarations: [InputComponent], imports: [CommonModule, FormModule, FormsModule, PipeModule, ContentDensityModule], exports: [InputComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, imports: [CommonModule, FormModule, FormsModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [InputComponent],
-                    imports: [
-                        CommonModule,
-                        FormModule,
-                        FormsModule,
-                        PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [InputComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    imports: [CommonModule, FormModule, FormsModule, PipeModule, ContentDensityModule],
+                    exports: [InputComponent, ContentDensityModule]
                 }]
         }] });
 
-class DeprecatedFormGroupCompactDirective extends DeprecatedCompactDirective {
-    /** @hidden */
-    constructor() {
-        super('fdp-form-group');
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DeprecatedFormGroupCompactDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: DeprecatedFormGroupCompactDirective, selector: "fdp-form-group[compact]", providers: [
-            {
-                provide: CONTENT_DENSITY_DIRECTIVE,
-                useExisting: forwardRef(() => DeprecatedFormGroupCompactDirective)
-            }
-        ], usesInheritance: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: DeprecatedFormGroupCompactDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/directive-selector
-                    selector: 'fdp-form-group[compact]',
-                    providers: [
-                        {
-                            provide: CONTENT_DENSITY_DIRECTIVE,
-                            useExisting: forwardRef(() => DeprecatedFormGroupCompactDirective)
-                        }
-                    ]
-                }]
-        }], ctorParameters: function () { return []; } });
-
 const EXPORTABLE_DECLARATIONS = [
     FormGroupComponent,
     FormFieldComponent,
@@ -8270,7 +7822,6 @@ const EXPORTABLE_DECLARATIONS = [
     FormFieldControlExtrasComponent,
     FormGroupHeaderComponent,
     FieldGroupRowValuePipe,
-    DeprecatedFormGroupCompactDirective,
     FormFieldErrorDirective,
     FormFieldErrorHeadingDirective,
     FormFieldErrorDescriptionDirective
@@ -8284,7 +7835,6 @@ class FdpFormGroupModule {
             FormFieldControlExtrasComponent,
             FormGroupHeaderComponent,
             FieldGroupRowValuePipe,
-            DeprecatedFormGroupCompactDirective,
             FormFieldErrorDirective,
             FormFieldErrorHeadingDirective,
             FormFieldErrorDescriptionDirective], imports: [CommonModule,
@@ -8302,7 +7852,6 @@ class FdpFormGroupModule {
             FormFieldControlExtrasComponent,
             FormGroupHeaderComponent,
             FieldGroupRowValuePipe,
-            DeprecatedFormGroupCompactDirective,
             FormFieldErrorDirective,
             FormFieldErrorHeadingDirective,
             FormFieldErrorDescriptionDirective, ContentDensityModule] }); }
@@ -8379,12 +7928,7 @@ class PlatformSelectModule {
             IconModule,
             ReactiveFormsModule,
             SelectModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [SelectComponent,
-            OptionComponent,
-            TemplateModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule] }); }
+            ContentDensityModule], exports: [SelectComponent, OptionComponent, TemplateModule, ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, providers: [DynamicComponentService], imports: [CommonModule,
             FormsModule,
             InputGroupModule,
@@ -8396,10 +7940,7 @@ class PlatformSelectModule {
             IconModule,
             ReactiveFormsModule,
             SelectModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, TemplateModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule] }); }
+            ContentDensityModule, TemplateModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, decorators: [{
             type: NgModule,
@@ -8417,17 +7958,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         IconModule,
                         ReactiveFormsModule,
                         SelectModule,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule
                     ],
                     providers: [DynamicComponentService],
-                    exports: [
-                        SelectComponent,
-                        OptionComponent,
-                        TemplateModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ]
+                    exports: [SelectComponent, OptionComponent, TemplateModule, ContentDensityModule]
                 }]
         }] });
 
@@ -8439,20 +7973,14 @@ class PlatformRadioGroupModule {
             RadioModule,
             ReactiveFormsModule,
             PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [RadioGroupComponent,
-            RadioButtonComponent,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule] }); }
+            ContentDensityModule], exports: [RadioGroupComponent, RadioButtonComponent, ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, imports: [CommonModule,
             FormModule,
             FormsModule,
             RadioModule,
             ReactiveFormsModule,
             PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule,
-            ContentDensityModule] }); }
+            ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, decorators: [{
             type: NgModule,
@@ -8464,15 +7992,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         RadioModule,
                         ReactiveFormsModule,
                         PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [
-                        RadioGroupComponent,
-                        RadioButtonComponent,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule
                     ],
+                    exports: [RadioGroupComponent, RadioButtonComponent, ContentDensityModule],
                     declarations: [RadioGroupComponent, RadioButtonComponent]
                 }]
         }] });
@@ -8484,17 +8006,15 @@ class PlatformTextAreaModule {
             ReactiveFormsModule,
             FormControlModule,
             PipeModule,
-            PlatformContentDensityDeprecationsModule,
             ContentDensityModule,
-            I18nModule], exports: [TextAreaComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            I18nModule], exports: [TextAreaComponent, ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
             FormControlModule,
             PipeModule,
-            PlatformContentDensityDeprecationsModule,
             ContentDensityModule,
-            I18nModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            I18nModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, decorators: [{
             type: NgModule,
@@ -8505,43 +8025,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         ReactiveFormsModule,
                         FormControlModule,
                         PipeModule,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule,
                         I18nModule
                     ],
-                    exports: [TextAreaComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule],
+                    exports: [TextAreaComponent, ContentDensityModule],
                     declarations: [TextAreaComponent]
                 }]
         }] });
 
 class PlatformSwitchModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, declarations: [SwitchComponent], imports: [CommonModule,
-            FormsModule,
-            SwitchModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [SwitchComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, imports: [CommonModule,
-            FormsModule,
-            SwitchModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, declarations: [SwitchComponent], imports: [CommonModule, FormsModule, SwitchModule, PipeModule, ContentDensityModule], exports: [SwitchComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, imports: [CommonModule, FormsModule, SwitchModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [SwitchComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        SwitchModule,
-                        PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [SwitchComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    imports: [CommonModule, FormsModule, SwitchModule, PipeModule, ContentDensityModule],
+                    exports: [SwitchComponent, ContentDensityModule]
                 }]
         }] });
 
@@ -9406,7 +8908,7 @@ class MultiComboboxMobileComponent extends MobileModeBase {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DialogService }, { token: MULTICOMBOBOX_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: MultiComboboxMobileComponent, selector: "fdp-multi-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$3.BarElementDirective, selector: "fd-bar-element", inputs: ["isTitle", "fullWidth"] }, { kind: "component", type: i2$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "component", type: i3$5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5$3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: MultiComboboxMobileComponent, selector: "fdp-multi-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$3.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$3.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "component", type: i3$5.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5$3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxMobileComponent, decorators: [{
             type: Component,
@@ -9466,7 +8968,7 @@ class MultiComboboxComponent extends BaseMultiCombobox {
          */
         this._selectedSuggestions = [];
         if (!deprecationWarningShown && isDevMode()) {
-            warnOnce$1(`[DEPRECATION] Platform Multi Combobox component is deprecated since v0.39.0. Please migrate to Core's version.`);
+            warnOnce(`[DEPRECATION] Platform Multi Combobox component is deprecated since v0.39.0. Please migrate to Core's version.`);
             deprecationWarningShown = true;
         }
     }
@@ -9707,7 +9209,7 @@ class MultiComboboxComponent extends BaseMultiCombobox {
                 multi: true
             },
             contentDensityObserverProviders()
-        ], viewQueries: [{ propertyName: "mobileControlTemplate", first: true, predicate: ["mobileControlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fdp-multi-combobox\">\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\" *ngIf=\"mobile\"></ng-container>\n\n    <fd-popover\n        *ngIf=\"!mobile\"\n        additionalBodyClass=\"fd-popover-custom-list fdp-multi-combobox__list-container\"\n        (isOpenChange)=\"popoverOpenChangeHandle($event)\"\n        [isOpen]=\"isOpen\"\n        [triggers]=\"[]\"\n        [disabled]=\"disabled\"\n        [fillControlMode]=\"fillControlMode\"\n    >\n        <fd-popover-control>\n            <ng-container>\n                <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n            </ng-container>\n        </fd-popover-control>\n        <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            class=\"fdp-multi-combobox-input-group-custom\"\n            [state]=\"state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"disabled || readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled || readonly\"\n            [attr.aria-readonly]=\"readonly\"\n            [glyphAriaLabel]=\"ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && onPrimaryButtonClick(false)\"\n            (keydown)=\"navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                #tokenizer\n                [compactCollapse]=\"true\"\n                *ngIf=\"_selectedSuggestions\"\n                [tokenizerFocusable]=\"false\"\n                class=\"fdp-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"moreClicked()\"\n            >\n                <fd-token\n                    [readOnly]=\"disabled\"\n                    (onCloseClick)=\"removeToken(token, $event)\"\n                    *ngFor=\"let token of _selectedSuggestions\"\n                >\n                    {{ token.label }}\n                </fd-token>\n\n                <input\n                    #searchInputElement\n                    fdp-auto-complete\n                    (onComplete)=\"onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    [mobile]=\"mobile\"\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                    fd-form-control\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()\"\n                    [placeholder]=\"placeholder\"\n                    (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"readonly\"\n                    [attr.aria-readonly]=\"readonly\"\n                    [attr.aria-required]=\"required\"\n                    class=\"fd-tokenizer__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n\n        <fd-form-message\n            *ngIf=\"mobile && isOpen ? false : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"id + '-input-group-container'\"\n        class=\"fdp-multi-combobox-input-group-custom\"\n        [state]=\"state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"disabled || readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"disabled || readonly\"\n        [attr.aria-readonly]=\"readonly\"\n        [glyphAriaLabel]=\"ariaLabel\"\n    >\n        <input\n            fdp-auto-complete\n            (onComplete)=\"onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            [mobile]=\"mobile\"\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            fd-form-control\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()\"\n            [placeholder]=\"placeholder\"\n            (focus)=\"onTouched()\"\n            (blur)=\"!mobile && onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"readonly\"\n            [attr.aria-readonly]=\"readonly\"\n        />\n    </fd-input-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-multi-combobox__list fd-list--multi-input\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.minWidth]=\"!mobile && minWidth + 'px'\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        aria-multiselectable=\"true\"\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        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <label fd-list-item fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && close()\"\n                    (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (click)=\"!mobile && onOptionClicked($event, i)\"\n                (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                [selected]=\"!!optionItem.selected\"\n            >\n                <fd-checkbox\n                    (click)=\"onOptionCheckboxClicked($event, i)\"\n                    (ngModelChange)=\"toggleSelection(optionItem)\"\n                    [ngModel]=\"optionItem.selected\"\n                >\n                </fd-checkbox>\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"optionItem.selected && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(optionItem.selected && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight : inputText\"\n        ></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-margin--tiny{margin:.5rem!important}.fd-margin--sm{margin:1rem!important}.fd-margin--md{margin:2rem!important}.fd-margin--lg{margin:3rem!important}.fd-margin--none{margin:0!important}.fd-margin-top--tiny{margin-top:.5rem!important}.fd-margin-top--sm{margin-top:1rem!important}.fd-margin-top--md{margin-top:2rem!important}.fd-margin-top--lg{margin-top:3rem!important}.fd-margin-top--none{margin-top:0!important}.fd-margin-end--tiny{margin-right:.5rem!important}.fd-margin-end--tiny[dir=rtl],[dir=rtl] .fd-margin-end--tiny{margin-left:.5rem!important;margin-right:0!important}.fd-margin-end--sm{margin-right:1rem!important}.fd-margin-end--sm[dir=rtl],[dir=rtl] .fd-margin-end--sm{margin-left:1rem!important;margin-right:0!important}.fd-margin-end--md{margin-right:2rem!important}.fd-margin-end--md[dir=rtl],[dir=rtl] .fd-margin-end--md{margin-left:2rem!important;margin-right:0!important}.fd-margin-end--lg{margin-right:3rem!important}.fd-margin-end--lg[dir=rtl],[dir=rtl] .fd-margin-end--lg{margin-left:3rem!important;margin-right:0!important}.fd-margin-end--none{margin-right:0}.fd-margin-end--none[dir=rtl],[dir=rtl] .fd-margin-end--none{margin-left:0!important}.fd-margin-bottom--tiny{margin-bottom:.5rem!important}.fd-margin-bottom--sm{margin-bottom:1rem!important}.fd-margin-bottom--md{margin-bottom:2rem!important}.fd-margin-bottom--lg{margin-bottom:3rem!important}.fd-margin-bottom--none{margin-bottom:0!important}.fd-margin-begin--tiny{margin-left:.5rem!important}.fd-margin-begin--tiny[dir=rtl],[dir=rtl] .fd-margin-begin--tiny{margin-left:0!important;margin-right:.5rem!important}.fd-margin-begin--sm{margin-left:1rem!important}.fd-margin-begin--sm[dir=rtl],[dir=rtl] .fd-margin-begin--sm{margin-left:0!important;margin-right:1rem!important}.fd-margin-begin--md{margin-left:2rem!important}.fd-margin-begin--md[dir=rtl],[dir=rtl] .fd-margin-begin--md{margin-left:0!important;margin-right:2rem!important}.fd-margin-begin--lg{margin-left:3rem!important}.fd-margin-begin--lg[dir=rtl],[dir=rtl] .fd-margin-begin--lg{margin-left:0!important;margin-right:3rem!important}.fd-margin-begin--none{margin-left:0}.fd-margin-begin--none[dir=rtl],[dir=rtl] .fd-margin-begin--none{margin-right:0!important}.fd-margin-top-bottom--tiny{margin-bottom:.5rem!important;margin-top:.5rem!important}.fd-margin-top-bottom--sm{margin-bottom:1rem!important;margin-top:1rem!important}.fd-margin-top-bottom--md{margin-bottom:2rem!important;margin-top:2rem!important}.fd-margin-top-bottom--lg{margin-bottom:3rem!important;margin-top:3rem!important}.fd-margin-begin-end--tiny{margin-left:.5rem!important;margin-right:.5rem!important}.fd-margin-begin-end--sm{margin-left:1rem!important;margin-right:1rem!important}.fd-margin-begin-end--md{margin-left:2rem!important;margin-right:2rem!important}.fd-margin-begin-end--lg{margin-left:3rem!important;margin-right:3rem!important}.fd-margin-responsive--sm{margin:0 0 1rem!important}.fd-margin-responsive--md{margin:1rem!important}.fd-margin-responsive--lg{margin:1rem 2rem!important}.fd-margin-responsive--xl{margin:1rem 3rem!important}.fd-margin-negative-begin-end--tiny{margin:0 -.5rem!important}.fd-margin-negative-begin-end--sm{margin:0 -1rem!important}.fd-margin-negative-begin-end--md{margin:0 -2rem!important}.fd-margin-negative-begin-end--lg{margin:0 -3rem!important}.fdp-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}.fdp-multi-combobox-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fdp-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fdp-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i2$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i8.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i8.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "ariaDescribedBy", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "selectedListItemScreenReaderText", "navigatedListItemScreenReaderText", "navigatableListItemScreenReaderText"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "pipe", type: i3$2.SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "mobileControlTemplate", first: true, predicate: ["mobileControlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fdp-multi-combobox\">\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\" *ngIf=\"mobile\"></ng-container>\n\n    <fd-popover\n        *ngIf=\"!mobile\"\n        additionalBodyClass=\"fd-popover-custom-list fdp-multi-combobox__list-container\"\n        (isOpenChange)=\"popoverOpenChangeHandle($event)\"\n        [isOpen]=\"isOpen\"\n        [triggers]=\"[]\"\n        [disabled]=\"disabled\"\n        [fillControlMode]=\"fillControlMode\"\n    >\n        <fd-popover-control>\n            <ng-container>\n                <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n            </ng-container>\n        </fd-popover-control>\n        <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            class=\"fdp-multi-combobox-input-group-custom\"\n            [state]=\"state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"disabled || readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled || readonly\"\n            [attr.aria-readonly]=\"readonly\"\n            [glyphAriaLabel]=\"ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && onPrimaryButtonClick(false)\"\n            (keydown)=\"navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                #tokenizer\n                [compactCollapse]=\"true\"\n                *ngIf=\"_selectedSuggestions\"\n                [tokenizerFocusable]=\"false\"\n                class=\"fdp-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"moreClicked()\"\n            >\n                <fd-token\n                    [readOnly]=\"disabled\"\n                    (onCloseClick)=\"removeToken(token, $event)\"\n                    *ngFor=\"let token of _selectedSuggestions\"\n                >\n                    {{ token.label }}\n                </fd-token>\n\n                <input\n                    #searchInputElement\n                    fdp-auto-complete\n                    (onComplete)=\"onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    [mobile]=\"mobile\"\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                    fd-form-control\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()\"\n                    [placeholder]=\"placeholder\"\n                    (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"readonly\"\n                    [attr.aria-readonly]=\"readonly\"\n                    [attr.aria-required]=\"required\"\n                    class=\"fd-tokenizer__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n\n        <fd-form-message\n            *ngIf=\"mobile && isOpen ? false : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"id + '-input-group-container'\"\n        class=\"fdp-multi-combobox-input-group-custom\"\n        [state]=\"state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"disabled || readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"disabled || readonly\"\n        [attr.aria-readonly]=\"readonly\"\n        [glyphAriaLabel]=\"ariaLabel\"\n    >\n        <input\n            fdp-auto-complete\n            (onComplete)=\"onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            [mobile]=\"mobile\"\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            fd-form-control\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()\"\n            [placeholder]=\"placeholder\"\n            (focus)=\"onTouched()\"\n            (blur)=\"!mobile && onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"readonly\"\n            [attr.aria-readonly]=\"readonly\"\n        />\n    </fd-input-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-multi-combobox__list fd-list--multi-input\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.minWidth]=\"!mobile && minWidth + 'px'\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        aria-multiselectable=\"true\"\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        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <label fd-list-item fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && close()\"\n                    (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (click)=\"!mobile && onOptionClicked($event, i)\"\n                (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                [selected]=\"!!optionItem.selected\"\n            >\n                <fd-checkbox\n                    (click)=\"onOptionCheckboxClicked($event, i)\"\n                    (ngModelChange)=\"toggleSelection(optionItem)\"\n                    [ngModel]=\"optionItem.selected\"\n                >\n                </fd-checkbox>\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"optionItem.selected && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(optionItem.selected && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight : inputText\"\n        ></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-margin--tiny{margin:.5rem!important}.fd-margin--sm{margin:1rem!important}.fd-margin--md{margin:2rem!important}.fd-margin--lg{margin:3rem!important}.fd-margin--none{margin:0!important}.fd-margin-top--tiny{margin-top:.5rem!important}.fd-margin-top--sm{margin-top:1rem!important}.fd-margin-top--md{margin-top:2rem!important}.fd-margin-top--lg{margin-top:3rem!important}.fd-margin-top--none{margin-top:0!important}.fd-margin-end--tiny{margin-right:.5rem!important}.fd-margin-end--tiny[dir=rtl],[dir=rtl] .fd-margin-end--tiny{margin-left:.5rem!important;margin-right:0!important}.fd-margin-end--sm{margin-right:1rem!important}.fd-margin-end--sm[dir=rtl],[dir=rtl] .fd-margin-end--sm{margin-left:1rem!important;margin-right:0!important}.fd-margin-end--md{margin-right:2rem!important}.fd-margin-end--md[dir=rtl],[dir=rtl] .fd-margin-end--md{margin-left:2rem!important;margin-right:0!important}.fd-margin-end--lg{margin-right:3rem!important}.fd-margin-end--lg[dir=rtl],[dir=rtl] .fd-margin-end--lg{margin-left:3rem!important;margin-right:0!important}.fd-margin-end--none{margin-right:0}.fd-margin-end--none[dir=rtl],[dir=rtl] .fd-margin-end--none{margin-left:0!important}.fd-margin-bottom--tiny{margin-bottom:.5rem!important}.fd-margin-bottom--sm{margin-bottom:1rem!important}.fd-margin-bottom--md{margin-bottom:2rem!important}.fd-margin-bottom--lg{margin-bottom:3rem!important}.fd-margin-bottom--none{margin-bottom:0!important}.fd-margin-begin--tiny{margin-left:.5rem!important}.fd-margin-begin--tiny[dir=rtl],[dir=rtl] .fd-margin-begin--tiny{margin-left:0!important;margin-right:.5rem!important}.fd-margin-begin--sm{margin-left:1rem!important}.fd-margin-begin--sm[dir=rtl],[dir=rtl] .fd-margin-begin--sm{margin-left:0!important;margin-right:1rem!important}.fd-margin-begin--md{margin-left:2rem!important}.fd-margin-begin--md[dir=rtl],[dir=rtl] .fd-margin-begin--md{margin-left:0!important;margin-right:2rem!important}.fd-margin-begin--lg{margin-left:3rem!important}.fd-margin-begin--lg[dir=rtl],[dir=rtl] .fd-margin-begin--lg{margin-left:0!important;margin-right:3rem!important}.fd-margin-begin--none{margin-left:0}.fd-margin-begin--none[dir=rtl],[dir=rtl] .fd-margin-begin--none{margin-right:0!important}.fd-margin-top-bottom--tiny{margin-bottom:.5rem!important;margin-top:.5rem!important}.fd-margin-top-bottom--sm{margin-bottom:1rem!important;margin-top:1rem!important}.fd-margin-top-bottom--md{margin-bottom:2rem!important;margin-top:2rem!important}.fd-margin-top-bottom--lg{margin-bottom:3rem!important;margin-top:3rem!important}.fd-margin-begin-end--tiny{margin-left:.5rem!important;margin-right:.5rem!important}.fd-margin-begin-end--sm{margin-left:1rem!important;margin-right:1rem!important}.fd-margin-begin-end--md{margin-left:2rem!important;margin-right:2rem!important}.fd-margin-begin-end--lg{margin-left:3rem!important;margin-right:3rem!important}.fd-margin-responsive--sm{margin:0 0 1rem!important}.fd-margin-responsive--md{margin:1rem!important}.fd-margin-responsive--lg{margin:1rem 2rem!important}.fd-margin-responsive--xl{margin:1rem 3rem!important}.fd-margin-negative-begin-end--tiny{margin:0 -.5rem!important}.fd-margin-negative-begin-end--sm{margin:0 -1rem!important}.fd-margin-negative-begin-end--md{margin:0 -2rem!important}.fd-margin-negative-begin-end--lg{margin:0 -3rem!important}.fdp-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}.fdp-multi-combobox-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fdp-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fdp-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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: "component", type: i2$1.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i8.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i8.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary] ,[fdListSecondary]" }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "pipe", type: i3$2.SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxComponent, decorators: [{
             type: Component,
@@ -9786,8 +9288,7 @@ class PlatformMultiComboboxModule {
             StandardListItemModule,
             PlatformAutoCompleteModule,
             I18nModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [MultiComboboxComponent, TemplateModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            ContentDensityModule], exports: [MultiComboboxComponent, TemplateModule, ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, providers: [DynamicComponentService], imports: [CommonModule,
             FormsModule,
             CheckboxModule,
@@ -9802,8 +9303,7 @@ class PlatformMultiComboboxModule {
             StandardListItemModule,
             PlatformAutoCompleteModule,
             I18nModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, TemplateModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            ContentDensityModule, TemplateModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, decorators: [{
             type: NgModule,
@@ -9824,11 +9324,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         StandardListItemModule,
                         PlatformAutoCompleteModule,
                         I18nModule,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule
                     ],
                     providers: [DynamicComponentService],
-                    exports: [MultiComboboxComponent, TemplateModule, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    exports: [MultiComboboxComponent, TemplateModule, ContentDensityModule]
                 }]
         }] });
 
@@ -9844,9 +9343,8 @@ class PlatformMultiInputModule {
             InputGroupModule,
             PlatformAutoCompleteModule,
             FormModule,
-            PlatformContentDensityDeprecationsModule,
             ContentDensityModule,
-            InitialFocusModule], exports: [PlatformMultiInputComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            InitialFocusModule], exports: [PlatformMultiInputComponent, ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, imports: [CommonModule,
             FormsModule,
             PlatformListModule,
@@ -9857,9 +9355,8 @@ class PlatformMultiInputModule {
             InputGroupModule,
             PlatformAutoCompleteModule,
             FormModule,
-            PlatformContentDensityDeprecationsModule,
             ContentDensityModule,
-            InitialFocusModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            InitialFocusModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, decorators: [{
             type: NgModule,
@@ -9876,11 +9373,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         InputGroupModule,
                         PlatformAutoCompleteModule,
                         FormModule,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule,
                         InitialFocusModule
                     ],
-                    exports: [PlatformMultiInputComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    exports: [PlatformMultiInputComponent, ContentDensityModule]
                 }]
         }] });
 
@@ -10450,22 +9946,12 @@ class PlatformInputGroupModule {
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, declarations: [InputGroupComponent,
             InputGroupAddonComponent,
             InputGroupAddonBodyComponent,
-            InputGroupInputComponent], imports: [CommonModule,
-            FormsModule,
-            PlatformInputModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [PlatformInputModule,
+            InputGroupInputComponent], imports: [CommonModule, FormsModule, PlatformInputModule, ContentDensityModule], exports: [PlatformInputModule,
             InputGroupComponent,
             InputGroupAddonComponent,
             InputGroupInputComponent,
-            PlatformContentDensityDeprecationsModule,
             ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, imports: [CommonModule,
-            FormsModule,
-            PlatformInputModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformInputModule,
-            PlatformContentDensityDeprecationsModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, imports: [CommonModule, FormsModule, PlatformInputModule, ContentDensityModule, PlatformInputModule,
             ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, decorators: [{
@@ -10477,19 +9963,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         InputGroupAddonBodyComponent,
                         InputGroupInputComponent
                     ],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        PlatformInputModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
+                    imports: [CommonModule, FormsModule, PlatformInputModule, ContentDensityModule],
                     exports: [
                         PlatformInputModule,
                         InputGroupComponent,
                         InputGroupAddonComponent,
                         InputGroupInputComponent,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule
                     ]
                 }]
@@ -10520,27 +9999,6 @@ class FileUploaderSelectionChangeEvent {
     }
 }
 class PlatformFileUploaderComponent extends BaseInput {
-    /**
-     * @deprecated
-     * set state of individual checkbox. Used by CBG to set checkbox states */
-    set stateType(state) {
-        if (isDevMode()) {
-            warnOnce$1('"stateType" is deprecated. Use "state" instead');
-        }
-        super.state = state;
-    }
-    get stateType() {
-        if (isDevMode()) {
-            warnOnce$1('"stateType" is deprecated. Use "state" instead');
-        }
-        return super.state;
-    }
-    /**
-     * Control Value Accessor
-     */
-    writeValue(value) {
-        super.writeValue(value);
-    }
     /** Sets value file data*/
     set value(value) {
         super.setValue(value);
@@ -10566,6 +10024,12 @@ class PlatformFileUploaderComponent extends BaseInput {
         /** Event emitted when invalid file is uploded. */
         this.invalidFileChange = new EventEmitter();
     }
+    /**
+     * Control Value Accessor
+     */
+    writeValue(value) {
+        super.writeValue(value);
+    }
     /** @hidden */
     ngOnInit() {
         super.ngOnInit();
@@ -10583,7 +10047,7 @@ class PlatformFileUploaderComponent extends BaseInput {
         this.invalidFileChange.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderComponent, 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, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i5$2.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformFileUploaderComponent, selector: "fdp-file-uploader", inputs: { buttonLabel: "buttonLabel", buttonAriaLabel: "buttonAriaLabel", dragndrop: "dragndrop", maxFileSize: "maxFileSize", minFileSize: "minFileSize", multiple: "multiple", accept: "accept", fileLimit: "fileLimit", stateType: "stateType", value: "value" }, outputs: { selectionChange: "selectionChange", invalidFileChange: "invalidFileChange" }, providers: [contentDensityObserverProviders()], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\n    [id]=\"id\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [placeholder]=\"placeholder\"\n    [buttonLabel]=\"buttonLabel\"\n    [buttonAriaLabel]=\"buttonAriaLabel\"\n    [disabled]=\"disabled\"\n    [accept]=\"accept\"\n    [multiple]=\"multiple\"\n    [maxFileSize]=\"maxFileSize\"\n    [minFileSize]=\"minFileSize\"\n    [state]=\"state\"\n    [required]=\"required\"\n    [width]=\"width\"\n    [(ngModel)]=\"value\"\n    (selectedInvalidFiles)=\"handleInvalidFiles($event)\"\n    (selectedFilesChanged)=\"handleFileChange($event)\"\n></fd-file-uploader>\n", dependencies: [{ kind: "component", type: i3$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformFileUploaderComponent, selector: "fdp-file-uploader", inputs: { buttonLabel: "buttonLabel", buttonAriaLabel: "buttonAriaLabel", dragndrop: "dragndrop", maxFileSize: "maxFileSize", minFileSize: "minFileSize", multiple: "multiple", accept: "accept", fileLimit: "fileLimit", value: "value" }, outputs: { selectionChange: "selectionChange", invalidFileChange: "invalidFileChange" }, providers: [contentDensityObserverProviders()], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\n    [id]=\"id\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [placeholder]=\"placeholder\"\n    [buttonLabel]=\"buttonLabel\"\n    [buttonAriaLabel]=\"buttonAriaLabel\"\n    [disabled]=\"disabled\"\n    [accept]=\"accept\"\n    [multiple]=\"multiple\"\n    [maxFileSize]=\"maxFileSize\"\n    [minFileSize]=\"minFileSize\"\n    [state]=\"state\"\n    [required]=\"required\"\n    [width]=\"width\"\n    [(ngModel)]=\"value\"\n    (selectedInvalidFiles)=\"handleInvalidFiles($event)\"\n    (selectedFilesChanged)=\"handleFileChange($event)\"\n></fd-file-uploader>\n", dependencies: [{ kind: "component", type: i3$7.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderComponent, decorators: [{
             type: Component,
@@ -10634,8 +10098,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 type: Input
             }], fileLimit: [{
                 type: Input
-            }], stateType: [{
-                type: Input
             }], selectionChange: [{
                 type: Output
             }], invalidFileChange: [{
@@ -10646,32 +10108,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformFileUploaderModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, declarations: [PlatformFileUploaderComponent], imports: [CommonModule,
-            FileUploaderModule,
-            FormsModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [PlatformFileUploaderComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, imports: [CommonModule,
-            FileUploaderModule,
-            FormsModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, declarations: [PlatformFileUploaderComponent], imports: [CommonModule, FileUploaderModule, FormsModule, PipeModule, ContentDensityModule], exports: [PlatformFileUploaderComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, imports: [CommonModule, FileUploaderModule, FormsModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [PlatformFileUploaderComponent],
-                    imports: [
-                        CommonModule,
-                        FileUploaderModule,
-                        FormsModule,
-                        PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [PlatformFileUploaderComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    imports: [CommonModule, FileUploaderModule, FormsModule, PipeModule, ContentDensityModule],
+                    exports: [PlatformFileUploaderComponent, ContentDensityModule]
                 }]
         }] });
 
@@ -11389,7 +10834,7 @@ class NumberStepInputComponent extends StepInputComponent {
             { provide: FD_FORM_FIELD_CONTROL, useExisting: NumberStepInputComponent, multi: true },
             { provide: StepInputComponent, useExisting: NumberStepInputComponent },
             contentDensityObserverProviders()
-        ], usesInheritance: true, ngImport: i0, template: "<fd-form-input-message-group>\n    <div\n        class=\"fd-step-input\"\n        [class.is-focus]=\"focused\"\n        [class.is-readonly]=\"!editable\"\n        [class.is-disabled]=\"disabled\"\n        [class.fd-step-input--without-buttons]=\"showLabels\"\n        [class]=\"state ? 'is-' + state : ''\"\n    >\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'less'\"\n            fdpStepInputDecrement\n            [attr.aria-disabled]=\"disabled || !canDecrement\"\n            [attr.title]=\"decrementLabel\"\n            [attr.aria-label]=\"decrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? decrementLabel : '' }}\n        </button>\n        <input\n            #inputElementRef\n            class=\"fd-input fd-input--no-number-spinner fd-step-input__input\"\n            [id]=\"id\"\n            [name]=\"name\"\n            [disabled]=\"disabled\"\n            [readonly]=\"!editable\"\n            [attr.placeholder]=\"placeholder || ''\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-describedby]=\"description ? id + '__description' : ''\"\n            [attr.aria-required]=\"required\"\n            [style.textAlign]=\"_align\"\n            fdpStepInputControl\n            type=\"text\"\n            inputmode=\"numeric\"\n            fdkOnlyDigits\n            [decimal]=\"true\"\n        />\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'add'\"\n            fdpStepInputIncrement\n            [attr.aria-disabled]=\"disabled || !canIncrement\"\n            [attr.title]=\"incrementLabel\"\n            [attr.aria-label]=\"incrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? incrementLabel : '' }}\n        </button>\n    </div>\n    <fd-form-message *ngIf=\"stateMessage\" [type]=\"state\" [innerHTML]=\"stateMessage\"></fd-form-message>\n</fd-form-input-message-group>\n<span *ngIf=\"description\" [id]=\"id + '__description'\" class=\"fd-form-label fd-form-label--unit-description\">\n    {{ description }}\n</span>\n", styles: [".fd-input{-webkit-box-sizing:border-box;-webkit-box-shadow:none;-webkit-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.25rem;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:2.25rem;min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;padding:var(--fdInput_Field_Padding, 0 .625rem);text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input[dir=rtl]::placeholder,[dir=rtl] .fd-input::placeholder{text-indent:.125rem}.fd-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input::-ms-clear{display:none}.fd-input.is-hover,.fd-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input.is-focus,.fd-input:focus{-webkit-box-shadow:none;background:var(--sapField_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-input[type=search]::-webkit-search-cancel-button,.fd-input[type=search]::-webkit-search-decoration,.fd-input[type=search]::-webkit-search-results-button,.fd-input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input[class*=-compact],.fd-input[class*=-condensed],[class*=-compact] .fd-input:not([class*=-cozy]),[class*=-condensed] .fd-input:not([class*=-cozy]){box-sizing:border-box;height:1.625rem;margin:var(--fdInput_Field_Compact_Margin, .1875rem 0);min-height:1.625rem;min-width:var(--fdInput_Field_Compact_Min_Width, 2rem);padding:var(--fdInput_Field_Compact_Padding, 0 .5rem)}.fd-input--no-number-spinner{-moz-appearance:textfield}.fd-input--no-number-spinner::-webkit-inner-spin-button,.fd-input--no-number-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.fd-input.right-align{text-align:right}.fd-input.is-success{background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle)}.fd-input.is-success.is-hover,.fd-input.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-input.is-success.is-focus,.fd-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color);z-index:5}.fd-input.is-success.is-focus.is-hover,.fd-input.is-success.is-focus:hover,.fd-input.is-success:focus.is-hover,.fd-input.is-success:focus:hover{box-shadow:none}.fd-input.is-error{background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle)}.fd-input.is-error.is-hover,.fd-input.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-input.is-error.is-focus,.fd-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color);z-index:5}.fd-input.is-error.is-focus.is-hover,.fd-input.is-error.is-focus:hover,.fd-input.is-error:focus.is-hover,.fd-input.is-error:focus:hover{box-shadow:none}.fd-input.is-warning{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input.is-warning.is-hover,.fd-input.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-input.is-warning.is-focus,.fd-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-warning.is-focus.is-hover,.fd-input.is-warning.is-focus:hover,.fd-input.is-warning:focus.is-hover,.fd-input.is-warning:focus:hover{box-shadow:none}.fd-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input.is-alert.is-hover,.fd-input.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-input.is-alert.is-focus,.fd-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-alert.is-focus.is-hover,.fd-input.is-alert.is-focus:hover,.fd-input.is-alert:focus.is-hover,.fd-input.is-alert:focus:hover{box-shadow:none}.fd-input.is-information{background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle)}.fd-input.is-information.is-hover,.fd-input.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-input.is-information.is-focus,.fd-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color);z-index:5}.fd-input.is-information.is-focus.is-hover,.fd-input.is-information.is-focus:hover,.fd-input.is-information:focus.is-hover,.fd-input.is-information:focus:hover{box-shadow:none}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert::placeholder,.fd-input.is-error::placeholder,.fd-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus,.fd-input.is-error.is-focus,.fd-input.is-error:focus,.fd-input.is-information.is-focus,.fd-input.is-information:focus,.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius)}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly.is-hover,.fd-input.is-readonly:hover,.fd-input[aria-readonly=true].is-hover,.fd-input[aria-readonly=true]:hover,.fd-input[readonly].is-hover,.fd-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);box-shadow:none}.fd-input.is-readonly.is-focus,.fd-input.is-readonly:focus,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true]:focus,.fd-input[readonly].is-focus,.fd-input[readonly]:focus{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);z-index:5}/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-step-input{--fdStepInput_Button_Width:2.125rem;--fdStepInput_Bordered_Button_Width:2rem;-webkit-box-sizing:border-box;-webkit-box-shadow:none;-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.25rem;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:2.25rem;min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;position:relative;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;width:auto;z-index:1}.fd-step-input:after,.fd-step-input:before{box-sizing:inherit;font-size:inherit}.fd-step-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-step-input[dir=rtl]::placeholder,[dir=rtl] .fd-step-input::placeholder{text-indent:.125rem}.fd-step-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-step-input::-ms-clear{display:none}.fd-step-input.is-hover,.fd-step-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-step-input.is-focus,.fd-step-input:focus{-webkit-box-shadow:none;background:var(--sapField_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-step-input:focus-within{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset_Focus_Within);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input.is-success{background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle)}.fd-step-input.is-success.is-hover,.fd-step-input.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-step-input.is-success.is-focus,.fd-step-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color);z-index:5}.fd-step-input.is-success.is-focus.is-hover,.fd-step-input.is-success.is-focus:hover,.fd-step-input.is-success:focus.is-hover,.fd-step-input.is-success:focus:hover{box-shadow:none}.fd-step-input.is-success:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success:focus-within.is-hover,.fd-step-input.is-success:focus-within:hover{box-shadow:none}.fd-step-input.is-error{background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle)}.fd-step-input.is-error.is-hover,.fd-step-input.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-step-input.is-error.is-focus,.fd-step-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color);z-index:5}.fd-step-input.is-error.is-focus.is-hover,.fd-step-input.is-error.is-focus:hover,.fd-step-input.is-error:focus.is-hover,.fd-step-input.is-error:focus:hover{box-shadow:none}.fd-step-input.is-error:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error:focus-within.is-hover,.fd-step-input.is-error:focus-within:hover{box-shadow:none}.fd-step-input.is-warning{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-step-input.is-warning.is-hover,.fd-step-input.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-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-step-input.is-warning.is-focus.is-hover,.fd-step-input.is-warning.is-focus:hover,.fd-step-input.is-warning:focus.is-hover,.fd-step-input.is-warning:focus:hover{box-shadow:none}.fd-step-input.is-warning:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning:focus-within.is-hover,.fd-step-input.is-warning:focus-within:hover{box-shadow:none}.fd-step-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-step-input.is-alert.is-hover,.fd-step-input.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-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-step-input.is-alert.is-focus.is-hover,.fd-step-input.is-alert.is-focus:hover,.fd-step-input.is-alert:focus.is-hover,.fd-step-input.is-alert:focus:hover{box-shadow:none}.fd-step-input.is-alert:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert:focus-within.is-hover,.fd-step-input.is-alert:focus-within:hover{box-shadow:none}.fd-step-input.is-information{background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle)}.fd-step-input.is-information.is-hover,.fd-step-input.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-step-input.is-information.is-focus,.fd-step-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color);z-index:5}.fd-step-input.is-information.is-focus.is-hover,.fd-step-input.is-information.is-focus:hover,.fd-step-input.is-information:focus.is-hover,.fd-step-input.is-information:focus:hover{box-shadow:none}.fd-step-input.is-information:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information:focus-within.is-hover,.fd-step-input.is-information:focus-within:hover{box-shadow:none}.fd-step-input.is-alert,.fd-step-input.is-error,.fd-step-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert::placeholder,.fd-step-input.is-error::placeholder,.fd-step-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus,.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus,.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus,.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-step-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-step-input.is-disabled,.fd-step-input:disabled,.fd-step-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-step-input.is-disabled::placeholder,.fd-step-input:disabled::placeholder,.fd-step-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly,.fd-step-input[aria-readonly=true],.fd-step-input[readonly]{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius)}.fd-step-input.is-readonly::placeholder,.fd-step-input[aria-readonly=true]::placeholder,.fd-step-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly.is-hover,.fd-step-input.is-readonly:hover,.fd-step-input[aria-readonly=true].is-hover,.fd-step-input[aria-readonly=true]:hover,.fd-step-input[readonly].is-hover,.fd-step-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);box-shadow:none}.fd-step-input.is-readonly.is-focus,.fd-step-input.is-readonly:focus,.fd-step-input[aria-readonly=true].is-focus,.fd-step-input[aria-readonly=true]:focus,.fd-step-input[readonly].is-focus,.fd-step-input[readonly]:focus{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);z-index:5}.fd-step-input .fd-step-input__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:first-child[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-hover,.fd-step-input .fd-step-input__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-hover[dir=rtl],.fd-step-input .fd-step-input__button:first-child:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-active,.fd-step-input .fd-step-input__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-active[dir=rtl],.fd-step-input .fd-step-input__button:first-child:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-active,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover,.fd-step-input .fd-step-input__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active,.fd-step-input .fd-step-input__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-active,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button{background:var(--fdInput_Group_Button_Background);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-step-input .fd-step-input__button:before{display:none!important}.fd-step-input .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-step-input .fd-step-input__button.is-active,.fd-step-input .fd-step-input__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-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button.is-hover,.fd-step-input.is-success .fd-step-input__button:active,.fd-step-input.is-success .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button.is-hover,.fd-step-input.is-error .fd-step-input__button:active,.fd-step-input.is-error .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button.is-hover,.fd-step-input.is-warning .fd-step-input__button:active,.fd-step-input.is-warning .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button.is-hover,.fd-step-input.is-alert .fd-step-input__button:active,.fd-step-input.is-alert .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button.is-hover,.fd-step-input.is-information .fd-step-input__button:active,.fd-step-input.is-information .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width);width:var(--fdStepInput_Button_Width)}.fd-step-input .fd-step-input__button.fd-button:after,.fd-step-input .fd-step-input__button.fd-button:before{font-size:.875rem;margin:0}.fd-step-input .fd-step-input__button.fd-button.is-focus,.fd-step-input .fd-step-input__button.fd-button:focus{outline:none;z-index:5}.fd-step-input .fd-step-input__button.fd-button.is-focus:after,.fd-step-input .fd-step-input__button.fd-button:focus:after{display:none}.fd-step-input .fd-step-input__button.fd-button.is-focus.is-hover,.fd-step-input .fd-step-input__button.fd-button.is-focus:hover,.fd-step-input .fd-step-input__button.fd-button:focus.is-hover,.fd-step-input .fd-step-input__button.fd-button:focus:hover{z-index:auto}.fd-step-input__input.fd-input{background:none;background-color:transparent;border:none;margin:0;padding:0 .25rem;text-align:right}.fd-step-input__input.fd-input[dir=rtl],[dir=rtl] .fd-step-input__input.fd-input{text-align:left}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input.is-hover,.fd-step-input__input.fd-input:focus,.fd-step-input__input.fd-input:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input:focus{outline:none;z-index:5}.fd-step-input__container{align-items:center;display:flex}.fd-step-input.is-error .fd-step-input__button.fd-button,.fd-step-input.is-information .fd-step-input__button.fd-button,.fd-step-input.is-warning .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Bordered_Button_Width);width:var(--fdStepInput_Bordered_Button_Width)}.fd-step-input[class*=-compact],.fd-step-input[class*=-condensed],[class*=-compact] .fd-step-input:not([class*=-cozy]),[class*=-condensed] .fd-step-input:not([class*=-cozy]){--fdStepInput_Bordered_Button_Width:1.375rem;--fdStepInput_Button_Width:1.5rem;--fdInput_Field_Compact_Padding:0 .25rem;height:1.625rem;min-height:1.625rem}.fd-step-input[class*=-compact] .fd-step-input__input.fd-input,.fd-step-input[class*=-condensed] .fd-step-input__input.fd-input,[class*=-compact] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input,[class*=-condensed] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input{height:100%}.fd-step-input.is-readonly .fd-step-input__button.fd-button{display:none}.fd-step-input.is-readonly:focus-within{background:var(--sapField_Focus_Background);border-radius:var(--sapField_BorderCornerRadius)}.fd-step-input.is-readonly:focus-within .fd-step-input__input{background:transparent}.fd-step-input{display:flex}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$2.OnlyDigitsDirective, selector: "[fdkOnlyDigits], [fdOnlyDigits], [fd-only-digits]", inputs: ["decimal", "decimalSeparator"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "directive", type: StepInputDecrementDirective, selector: "[fdpStepInputDecrement]" }, { kind: "directive", type: StepInputIncrementDirective, selector: "[fdpStepInputIncrement]" }, { kind: "directive", type: StepInputControlDirective, selector: "[fdpStepInputControl]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<fd-form-input-message-group>\n    <div\n        class=\"fd-step-input\"\n        [class.is-focus]=\"focused\"\n        [class.is-readonly]=\"!editable\"\n        [class.is-disabled]=\"disabled\"\n        [class.fd-step-input--without-buttons]=\"showLabels\"\n        [class]=\"state ? 'is-' + state : ''\"\n    >\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'less'\"\n            fdpStepInputDecrement\n            [attr.aria-disabled]=\"disabled || !canDecrement\"\n            [attr.title]=\"decrementLabel\"\n            [attr.aria-label]=\"decrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? decrementLabel : '' }}\n        </button>\n        <input\n            #inputElementRef\n            class=\"fd-input fd-input--no-number-spinner fd-step-input__input\"\n            [id]=\"id\"\n            [name]=\"name\"\n            [disabled]=\"disabled\"\n            [readonly]=\"!editable\"\n            [attr.placeholder]=\"placeholder || ''\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-describedby]=\"description ? id + '__description' : ''\"\n            [attr.aria-required]=\"required\"\n            [style.textAlign]=\"_align\"\n            fdpStepInputControl\n            type=\"text\"\n            inputmode=\"numeric\"\n            fdkOnlyDigits\n            [decimal]=\"true\"\n        />\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'add'\"\n            fdpStepInputIncrement\n            [attr.aria-disabled]=\"disabled || !canIncrement\"\n            [attr.title]=\"incrementLabel\"\n            [attr.aria-label]=\"incrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? incrementLabel : '' }}\n        </button>\n    </div>\n    <fd-form-message *ngIf=\"stateMessage\" [type]=\"state\" [innerHTML]=\"stateMessage\"></fd-form-message>\n</fd-form-input-message-group>\n<span *ngIf=\"description\" [id]=\"id + '__description'\" class=\"fd-form-label fd-form-label--unit-description\">\n    {{ description }}\n</span>\n", styles: [".fd-input{-webkit-box-sizing:border-box;-webkit-box-shadow:none;-webkit-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.25rem;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:2.25rem;min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;padding:var(--fdInput_Field_Padding, 0 .625rem);text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input[dir=rtl]::placeholder,[dir=rtl] .fd-input::placeholder{text-indent:.125rem}.fd-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input::-ms-clear{display:none}.fd-input.is-hover,.fd-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input.is-focus,.fd-input:focus{-webkit-box-shadow:none;background:var(--sapField_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-input[type=search]::-webkit-search-cancel-button,.fd-input[type=search]::-webkit-search-decoration,.fd-input[type=search]::-webkit-search-results-button,.fd-input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input[class*=-compact],.fd-input[class*=-condensed],[class*=-compact] .fd-input:not([class*=-cozy]),[class*=-condensed] .fd-input:not([class*=-cozy]){box-sizing:border-box;height:1.625rem;margin:var(--fdInput_Field_Compact_Margin, .1875rem 0);min-height:1.625rem;min-width:var(--fdInput_Field_Compact_Min_Width, 2rem);padding:var(--fdInput_Field_Compact_Padding, 0 .5rem)}.fd-input--no-number-spinner{-moz-appearance:textfield}.fd-input--no-number-spinner::-webkit-inner-spin-button,.fd-input--no-number-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.fd-input.right-align{text-align:right}.fd-input.is-success{background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle)}.fd-input.is-success.is-hover,.fd-input.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-input.is-success.is-focus,.fd-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color);z-index:5}.fd-input.is-success.is-focus.is-hover,.fd-input.is-success.is-focus:hover,.fd-input.is-success:focus.is-hover,.fd-input.is-success:focus:hover{box-shadow:none}.fd-input.is-error{background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle)}.fd-input.is-error.is-hover,.fd-input.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-input.is-error.is-focus,.fd-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color);z-index:5}.fd-input.is-error.is-focus.is-hover,.fd-input.is-error.is-focus:hover,.fd-input.is-error:focus.is-hover,.fd-input.is-error:focus:hover{box-shadow:none}.fd-input.is-warning{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input.is-warning.is-hover,.fd-input.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-input.is-warning.is-focus,.fd-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-warning.is-focus.is-hover,.fd-input.is-warning.is-focus:hover,.fd-input.is-warning:focus.is-hover,.fd-input.is-warning:focus:hover{box-shadow:none}.fd-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input.is-alert.is-hover,.fd-input.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-input.is-alert.is-focus,.fd-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-alert.is-focus.is-hover,.fd-input.is-alert.is-focus:hover,.fd-input.is-alert:focus.is-hover,.fd-input.is-alert:focus:hover{box-shadow:none}.fd-input.is-information{background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle)}.fd-input.is-information.is-hover,.fd-input.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-input.is-information.is-focus,.fd-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color);z-index:5}.fd-input.is-information.is-focus.is-hover,.fd-input.is-information.is-focus:hover,.fd-input.is-information:focus.is-hover,.fd-input.is-information:focus:hover{box-shadow:none}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert::placeholder,.fd-input.is-error::placeholder,.fd-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus,.fd-input.is-error.is-focus,.fd-input.is-error:focus,.fd-input.is-information.is-focus,.fd-input.is-information:focus,.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius)}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly.is-hover,.fd-input.is-readonly:hover,.fd-input[aria-readonly=true].is-hover,.fd-input[aria-readonly=true]:hover,.fd-input[readonly].is-hover,.fd-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);box-shadow:none}.fd-input.is-readonly.is-focus,.fd-input.is-readonly:focus,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true]:focus,.fd-input[readonly].is-focus,.fd-input[readonly]:focus{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);z-index:5}/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-step-input{--fdStepInput_Button_Width:2.125rem;--fdStepInput_Bordered_Button_Width:2rem;-webkit-box-sizing:border-box;-webkit-box-shadow:none;-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.25rem;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:2.25rem;min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;position:relative;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;width:auto;z-index:1}.fd-step-input:after,.fd-step-input:before{box-sizing:inherit;font-size:inherit}.fd-step-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-step-input[dir=rtl]::placeholder,[dir=rtl] .fd-step-input::placeholder{text-indent:.125rem}.fd-step-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-step-input::-ms-clear{display:none}.fd-step-input.is-hover,.fd-step-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-step-input.is-focus,.fd-step-input:focus{-webkit-box-shadow:none;background:var(--sapField_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-step-input:focus-within{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset_Focus_Within);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input.is-success{background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle)}.fd-step-input.is-success.is-hover,.fd-step-input.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-step-input.is-success.is-focus,.fd-step-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color);z-index:5}.fd-step-input.is-success.is-focus.is-hover,.fd-step-input.is-success.is-focus:hover,.fd-step-input.is-success:focus.is-hover,.fd-step-input.is-success:focus:hover{box-shadow:none}.fd-step-input.is-success:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success:focus-within.is-hover,.fd-step-input.is-success:focus-within:hover{box-shadow:none}.fd-step-input.is-error{background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle)}.fd-step-input.is-error.is-hover,.fd-step-input.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-step-input.is-error.is-focus,.fd-step-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color);z-index:5}.fd-step-input.is-error.is-focus.is-hover,.fd-step-input.is-error.is-focus:hover,.fd-step-input.is-error:focus.is-hover,.fd-step-input.is-error:focus:hover{box-shadow:none}.fd-step-input.is-error:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error:focus-within.is-hover,.fd-step-input.is-error:focus-within:hover{box-shadow:none}.fd-step-input.is-warning{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-step-input.is-warning.is-hover,.fd-step-input.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-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-step-input.is-warning.is-focus.is-hover,.fd-step-input.is-warning.is-focus:hover,.fd-step-input.is-warning:focus.is-hover,.fd-step-input.is-warning:focus:hover{box-shadow:none}.fd-step-input.is-warning:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning:focus-within.is-hover,.fd-step-input.is-warning:focus-within:hover{box-shadow:none}.fd-step-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-step-input.is-alert.is-hover,.fd-step-input.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-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-step-input.is-alert.is-focus.is-hover,.fd-step-input.is-alert.is-focus:hover,.fd-step-input.is-alert:focus.is-hover,.fd-step-input.is-alert:focus:hover{box-shadow:none}.fd-step-input.is-alert:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert:focus-within.is-hover,.fd-step-input.is-alert:focus-within:hover{box-shadow:none}.fd-step-input.is-information{background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle)}.fd-step-input.is-information.is-hover,.fd-step-input.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-step-input.is-information.is-focus,.fd-step-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color);z-index:5}.fd-step-input.is-information.is-focus.is-hover,.fd-step-input.is-information.is-focus:hover,.fd-step-input.is-information:focus.is-hover,.fd-step-input.is-information:focus:hover{box-shadow:none}.fd-step-input.is-information:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information:focus-within.is-hover,.fd-step-input.is-information:focus-within:hover{box-shadow:none}.fd-step-input.is-alert,.fd-step-input.is-error,.fd-step-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert::placeholder,.fd-step-input.is-error::placeholder,.fd-step-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus,.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus,.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus,.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-step-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-step-input.is-disabled,.fd-step-input:disabled,.fd-step-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-step-input.is-disabled::placeholder,.fd-step-input:disabled::placeholder,.fd-step-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly,.fd-step-input[aria-readonly=true],.fd-step-input[readonly]{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius)}.fd-step-input.is-readonly::placeholder,.fd-step-input[aria-readonly=true]::placeholder,.fd-step-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly.is-hover,.fd-step-input.is-readonly:hover,.fd-step-input[aria-readonly=true].is-hover,.fd-step-input[aria-readonly=true]:hover,.fd-step-input[readonly].is-hover,.fd-step-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);box-shadow:none}.fd-step-input.is-readonly.is-focus,.fd-step-input.is-readonly:focus,.fd-step-input[aria-readonly=true].is-focus,.fd-step-input[aria-readonly=true]:focus,.fd-step-input[readonly].is-focus,.fd-step-input[readonly]:focus{background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);border-radius:var(--fdInput_ReadOnly_Border_Radius);z-index:5}.fd-step-input .fd-step-input__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:first-child[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-hover,.fd-step-input .fd-step-input__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-hover[dir=rtl],.fd-step-input .fd-step-input__button:first-child:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-active,.fd-step-input .fd-step-input__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-active[dir=rtl],.fd-step-input .fd-step-input__button:first-child:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-active,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover,.fd-step-input .fd-step-input__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active,.fd-step-input .fd-step-input__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-active,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button{background:var(--fdInput_Group_Button_Background);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-step-input .fd-step-input__button:before{display:none!important}.fd-step-input .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-step-input .fd-step-input__button.is-active,.fd-step-input .fd-step-input__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-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button.is-hover,.fd-step-input.is-success .fd-step-input__button:active,.fd-step-input.is-success .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button.is-hover,.fd-step-input.is-error .fd-step-input__button:active,.fd-step-input.is-error .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button.is-hover,.fd-step-input.is-warning .fd-step-input__button:active,.fd-step-input.is-warning .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button.is-hover,.fd-step-input.is-alert .fd-step-input__button:active,.fd-step-input.is-alert .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button.is-hover,.fd-step-input.is-information .fd-step-input__button:active,.fd-step-input.is-information .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width);width:var(--fdStepInput_Button_Width)}.fd-step-input .fd-step-input__button.fd-button:after,.fd-step-input .fd-step-input__button.fd-button:before{font-size:.875rem;margin:0}.fd-step-input .fd-step-input__button.fd-button.is-focus,.fd-step-input .fd-step-input__button.fd-button:focus{outline:none;z-index:5}.fd-step-input .fd-step-input__button.fd-button.is-focus:after,.fd-step-input .fd-step-input__button.fd-button:focus:after{display:none}.fd-step-input .fd-step-input__button.fd-button.is-focus.is-hover,.fd-step-input .fd-step-input__button.fd-button.is-focus:hover,.fd-step-input .fd-step-input__button.fd-button:focus.is-hover,.fd-step-input .fd-step-input__button.fd-button:focus:hover{z-index:auto}.fd-step-input__input.fd-input{background:none;background-color:transparent;border:none;margin:0;padding:0 .25rem;text-align:right}.fd-step-input__input.fd-input[dir=rtl],[dir=rtl] .fd-step-input__input.fd-input{text-align:left}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input.is-hover,.fd-step-input__input.fd-input:focus,.fd-step-input__input.fd-input:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input:focus{outline:none;z-index:5}.fd-step-input__container{align-items:center;display:flex}.fd-step-input.is-error .fd-step-input__button.fd-button,.fd-step-input.is-information .fd-step-input__button.fd-button,.fd-step-input.is-warning .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Bordered_Button_Width);width:var(--fdStepInput_Bordered_Button_Width)}.fd-step-input[class*=-compact],.fd-step-input[class*=-condensed],[class*=-compact] .fd-step-input:not([class*=-cozy]),[class*=-condensed] .fd-step-input:not([class*=-cozy]){--fdStepInput_Bordered_Button_Width:1.375rem;--fdStepInput_Button_Width:1.5rem;--fdInput_Field_Compact_Padding:0 .25rem;height:1.625rem;min-height:1.625rem}.fd-step-input[class*=-compact] .fd-step-input__input.fd-input,.fd-step-input[class*=-condensed] .fd-step-input__input.fd-input,[class*=-compact] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input,[class*=-condensed] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input{height:100%}.fd-step-input.is-readonly .fd-step-input__button.fd-button{display:none}.fd-step-input.is-readonly:focus-within{background:var(--sapField_Focus_Background);border-radius:var(--sapField_BorderCornerRadius)}.fd-step-input.is-readonly:focus-within .fd-step-input__input{background:transparent}.fd-step-input{display:flex}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$2.OnlyDigitsDirective, selector: "[fdkOnlyDigits]", inputs: ["decimal", "decimalSeparator"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "directive", type: StepInputDecrementDirective, selector: "[fdpStepInputDecrement]" }, { kind: "directive", type: StepInputIncrementDirective, selector: "[fdpStepInputIncrement]" }, { kind: "directive", type: StepInputControlDirective, selector: "[fdpStepInputControl]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: NumberStepInputComponent, decorators: [{
             type: Component,
@@ -11449,8 +10894,7 @@ class PlatformStepInputModule {
             OnlyDigitsModule,
             FormInputMessageGroupModule,
             FormMessageModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [NumberStepInputComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            ContentDensityModule], exports: [NumberStepInputComponent, ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, imports: [CommonModule,
             FormsModule,
             PipeModule,
@@ -11458,8 +10902,7 @@ class PlatformStepInputModule {
             OnlyDigitsModule,
             FormInputMessageGroupModule,
             FormMessageModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+            ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, decorators: [{
             type: NgModule,
@@ -11472,7 +10915,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         OnlyDigitsModule,
                         FormInputMessageGroupModule,
                         FormMessageModule,
-                        PlatformContentDensityDeprecationsModule,
                         ContentDensityModule
                     ],
                     declarations: [
@@ -11481,7 +10923,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         StepInputControlDirective,
                         NumberStepInputComponent
                     ],
-                    exports: [NumberStepInputComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    exports: [NumberStepInputComponent, ContentDensityModule]
                 }]
         }] });
 
@@ -11503,7 +10945,7 @@ class PlatformTimePickerComponent extends BaseInput {
      */
     set meridian(value) {
         // eslint-disable-next-line max-len
-        warnOnce$1('Property meridian is deprecated.' +
+        warnOnce('Property meridian is deprecated.' +
             ' Use Meridian is deprecated.' +
             ' Use displayFormat and parseFormat inputs or DateTimeFormats.display.timeInput and DateTimeFormats.parse.timeInput instead. instead.');
         this._meridian = value;
@@ -11662,35 +11104,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformTimePickerModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, declarations: [PlatformTimePickerComponent], imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            TimePickerModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule], exports: [PlatformTimePickerComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            TimePickerModule,
-            PipeModule,
-            PlatformContentDensityDeprecationsModule,
-            ContentDensityModule, PlatformContentDensityDeprecationsModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, declarations: [PlatformTimePickerComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule, TimePickerModule, PipeModule, ContentDensityModule], exports: [PlatformTimePickerComponent, ContentDensityModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, imports: [CommonModule, FormsModule, ReactiveFormsModule, TimePickerModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [PlatformTimePickerComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        TimePickerModule,
-                        PipeModule,
-                        PlatformContentDensityDeprecationsModule,
-                        ContentDensityModule
-                    ],
-                    exports: [PlatformTimePickerComponent, PlatformContentDensityDeprecationsModule, ContentDensityModule]
+                    imports: [CommonModule, FormsModule, ReactiveFormsModule, TimePickerModule, PipeModule, ContentDensityModule],
+                    exports: [PlatformTimePickerComponent, ContentDensityModule]
                 }]
         }] });
 
@@ -11698,5 +11120,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AutoCompleteDirective, BaseCombobox, BaseDynamicFormGeneratorControl, BaseMultiCombobox, BaseMultiInput, BaseSelect, COMBOBOX_COMPONENT, CSS_CLASS_NAME, CheckboxComponent, CheckboxGroupComponent, ComboboxComponent, ComboboxConfig, ComboboxMobileComponent, ComboboxSelectionChangeEvent, DEFAULT_COMPONENTS_LIST, DEFAULT_VALIDATION_ERRORS, DefaultGapLayout, DefaultHorizontalFieldLayout, DefaultHorizontalLabelLayout, DefaultVerticalFieldLayout, DefaultVerticalLabelLayout, DeprecatedFormGroupCompactDirective, DynamicFormControl, DynamicFormControlDirective, DynamicFormControlFieldDirective, DynamicFormControlGroup, DynamicFormGeneratorCheckboxComponent, DynamicFormGeneratorDatepickerComponent, DynamicFormGeneratorEditorComponent, DynamicFormGeneratorInputComponent, DynamicFormGeneratorMultiInputComponent, DynamicFormGeneratorObjectStatusComponent, DynamicFormGeneratorRadioComponent, DynamicFormGeneratorSelectComponent, DynamicFormGeneratorSwitchComponent, 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, FdpFormGroupModule, FdpSelectionChangeEvent, Field, FieldGroup, FieldGroupRowValuePipe, FileUploaderInvalidChangeEvent, FileUploaderSelectionChangeEvent, FormFieldComponent, FormFieldControlExtrasComponent, FormFieldErrorDescriptionDirective, FormFieldErrorDirective, FormFieldErrorHeadingDirective, FormFieldGroupComponent, FormGeneratorComponent, FormGeneratorComponentsAccessorService, FormGeneratorFieldComponent, FormGeneratorService, FormGroupComponent, FormGroupHeaderComponent, 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, ComboboxMobileComponent, 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_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, FdpFormGroupModule, FdpSelectionChangeEvent, Field, FieldGroup, FieldGroupRowValuePipe, FileUploaderInvalidChangeEvent, FileUploaderSelectionChangeEvent, FormFieldComponent, FormFieldControlExtrasComponent, FormFieldErrorDescriptionDirective, FormFieldErrorDirective, FormFieldErrorHeadingDirective, FormFieldGroupComponent, FormGeneratorComponent, FormGeneratorComponentsAccessorService, FormGeneratorFieldComponent, FormGeneratorService, FormGroupComponent, FormGroupHeaderComponent, 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 };
 //# sourceMappingURL=fundamental-ngx-platform-form.mjs.map