@fundamental-ngx/core 0.33.4-rc.6 → 0.33.4

package/fesm2020/fundamental-ngx-core-checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"fundamental-ngx-core-checkbox.mjs","sources":["../../../../libs/core/src/lib/checkbox/checkbox/checkbox.component.ts","../../../../libs/core/src/lib/checkbox/checkbox/checkbox.component.html","../../../../libs/core/src/lib/checkbox/checkbox.module.ts","../../../../libs/core/src/lib/checkbox/fundamental-ngx-core-checkbox.ts"],"sourcesContent":["import {\n    Attribute,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ElementRef,\n    EventEmitter,\n    forwardRef,\n    HostBinding,\n    Inject,\n    Input,\n    OnDestroy,\n    OnInit,\n    Optional,\n    Output,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { FdCheckboxValues } from './fd-checkbox-values.interface';\nimport { Platform } from '@angular/cdk/platform';\nimport { LIST_ITEM_COMPONENT, ListItemInterface, KeyUtil, ContentDensityService } from '@fundamental-ngx/core/utils';\nimport equal from 'fast-deep-equal';\nimport { SPACE } from '@angular/cdk/keycodes';\nimport { Subscription } from 'rxjs';\nimport { FormStates } from '@fundamental-ngx/core/shared';\n\nlet checkboxUniqueId = 0;\n\nexport type fdCheckboxTypes = 'checked' | 'unchecked' | 'indeterminate' | 'force-checked';\n\n@Component({\n    selector: 'fd-checkbox',\n    templateUrl: './checkbox.component.html',\n    styleUrls: ['./checkbox.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            useExisting: forwardRef(() => CheckboxComponent),\n            multi: true\n        }\n    ],\n    host: { '[attr.tabindex]': '-1' }\n})\nexport class CheckboxComponent implements ControlValueAccessor, OnInit, OnDestroy {\n    /** @hidden */\n    @ViewChild('inputLabel')\n    inputLabel: ElementRef;\n\n    /** @hidden */\n    @ViewChild('labelElement')\n    labelElement: ElementRef;\n\n    /** Sets the `aria-label` attribute to the element. */\n    @Input()\n    ariaLabel = '';\n\n    /** Sets the `aria-labelledby` attribute to the element. */\n    @Input()\n    ariaLabelledBy = null;\n\n    /** Sets the `aria-describedby` attribute to the element. */\n    @Input()\n    ariaDescribedBy: string;\n\n    /** sets checkbox tooltip */\n    @Input()\n    title: string;\n\n    /** Sets [id] property of input, binds input with input label using [for] property. */\n    @Input()\n    inputId = `fd-checkbox-${checkboxUniqueId++}`;\n\n    /** State of control, changes visual appearance of control. */\n    @Input()\n    state: FormStates;\n\n    /** Sets [name] property of input. */\n    @Input()\n    name: string;\n\n    /** Sets text of control label. */\n    @Input()\n    label: string;\n\n    /** Allows to disable/enable control. */\n    @Input()\n    disabled: boolean;\n\n    /** Allows to minimize control to compact mode. */\n    @Input()\n    compact?: boolean;\n\n    /** Enables controls third state. */\n    @Input()\n    tristate: boolean;\n\n    /** Allows to prevent user from manually selecting controls third state. */\n    @Input()\n    tristateSelectable = true;\n\n    /** Assigns given class to checkbox label element */\n    @Input()\n    labelClass: string;\n\n    /** If it is mandatory field */\n    @Input()\n    required = false;\n\n    /** @hidden */\n    private _subscriptions = new Subscription();\n\n    /** Sets values returned by control. */\n    // eslint-disable-next-line @angular-eslint/no-input-rename\n    @Input('values')\n    set _values(checkboxValues: FdCheckboxValues) {\n        this.values = { ...this.values, ...checkboxValues };\n    }\n\n    /** @hidden */\n    @HostBinding('style.position')\n    readonly position = 'relative';\n\n    /** @hidden */\n    @HostBinding('style.outline')\n    readonly outline = 'none';\n\n    /** Emits event on focus change */\n    @Output() focusChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n    /** Values returned by control. */\n    public values: FdCheckboxValues = { trueValue: true, falseValue: false, thirdStateValue: null };\n    /** Stores current checkbox value. */\n    public checkboxValue: any;\n    /** Stores current checkbox state. */\n    public checkboxState: fdCheckboxTypes;\n    /** @hidden */\n    private _previousState: fdCheckboxTypes;\n\n    /** @hidden Reference to callback provided by FormControl.*/\n    public onTouched = (): void => {};\n    /** @hidden Reference to callback provided by FormControl.*/\n    public onValueChange: (value: any) => void = () => {};\n\n    /** @hidden */\n    constructor(\n        public elementRef: ElementRef,\n        @Attribute('tabIndexValue') public tabIndexValue: number = 0,\n        private _platform: Platform,\n        private _changeDetectorRef: ChangeDetectorRef,\n        @Optional() private _contentDensityService: ContentDensityService,\n        @Optional() @Inject(LIST_ITEM_COMPONENT) private _listItemComponent: ListItemInterface\n    ) {\n        this.tabIndexValue = tabIndexValue;\n    }\n\n    /** @hidden */\n    ngOnInit(): void {\n        if (this.compact === undefined && this._contentDensityService) {\n            this._subscriptions.add(\n                this._contentDensityService._isCompactDensity.subscribe((isCompact) => {\n                    this.compact = isCompact;\n                    this._changeDetectorRef.markForCheck();\n                })\n            );\n        }\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /** @hidden Used to define if control is in 'indeterminate' state.*/\n    get isIndeterminate(): boolean {\n        return this.checkboxState === 'indeterminate';\n    }\n\n    /** @hidden Used to define if control is in 'checked' / 'unchecked' state. */\n    get isChecked(): boolean {\n        return this.checkboxState === 'checked' || this.checkboxState === 'force-checked';\n    }\n\n    /** @hidden ControlValueAccessor interface\n     * - sets new control value\n     * - updates control state\n     * */\n    public writeValue(value: any): void {\n        this.checkboxValue = value;\n        this._setState();\n        this._detectChanges();\n    }\n\n    /** @hidden ControlValueAccessor interface method - sets onValueChange callback.*/\n    public registerOnChange(fn: any): void {\n        this.onValueChange = fn;\n    }\n\n    /** @hidden prevent event from propagating */\n    public muteKey(event: KeyboardEvent | MouseEvent): void {\n        event.stopPropagation();\n    }\n\n    /** @hidden ControlValueAccessor interface method - sets onTouched callback.*/\n    public registerOnTouched(fn: any): void {\n        this.onTouched = fn;\n    }\n\n    /** @hidden Called by FormControl - used to disable / enable control.*/\n    public setDisabledState(disabled: boolean): void {\n        this.disabled = disabled;\n        this._detectChanges();\n    }\n\n    /** @hidden Updates checkbox Indeterminate state on mouse click on IE11 */\n    public checkByClick(event: MouseEvent): void {\n        this._nextValueEvent(true, event);\n        this.muteKey(event);\n    }\n\n    /** @hidden Updates checkbox Indeterminate state on space bar key on IE11 */\n    public checkByKey(event: KeyboardEvent): void {\n        if (this._isSpaceBarEvent(event) && this._platform.TRIDENT) {\n            this._nextValueEvent();\n            this.muteKey(event);\n        }\n    }\n\n    /** @hidden Based on current control state:\n     * - sets next control value\n     * - emits new control value\n     * - updates control state based on new control value\n     * */\n    public nextValue(previousValue?: fdCheckboxTypes): void {\n        switch (previousValue || this.checkboxState) {\n            case 'checked':\n                this.checkboxValue = this.values.falseValue;\n                break;\n            case 'unchecked':\n                this.checkboxValue =\n                    this.tristate && this.tristateSelectable ? this.values.thirdStateValue : this.values.trueValue;\n                break;\n            case 'indeterminate':\n            case 'force-checked':\n                this.checkboxValue = this.values.trueValue;\n                this.inputLabel.nativeElement.checked = true;\n                break;\n            default:\n                this.checkboxValue =\n                    this.tristate && this.tristateSelectable ? this.values.thirdStateValue : this.values.trueValue;\n                break;\n        }\n        this._setState();\n        this.onValueChange(this.checkboxValue);\n        this._detectChanges();\n    }\n\n    /** Space event should be handled separately, when used inside list component and in firefox browser */\n    handleInputKeyUp(event: KeyboardEvent): void {\n        event.stopPropagation();\n        if (this._listItemComponent && this._platform.FIREFOX && KeyUtil.isKeyCode(event, SPACE)) {\n            event.preventDefault();\n        }\n    }\n\n    /** Handles blur event */\n    onBlur(): void {\n        if (typeof this.onTouched === 'function') {\n            this.onTouched();\n        }\n        this.focusChange.emit(false);\n    }\n    /** Handles focus event */\n    onFocus(): void {\n        this.focusChange.emit(true);\n    }\n\n    /** @hidden Based on current control value sets new control state. */\n    private _setState(): void {\n        if (equal(this.checkboxValue, this.values.trueValue)) {\n            this.checkboxState = 'checked';\n        } else if (equal(this.checkboxValue, this.values.falseValue)) {\n            this.checkboxState = 'unchecked';\n        } else if (this.tristate && equal(this.checkboxValue, this.values.thirdStateValue)) {\n            this.checkboxState = 'indeterminate';\n        } else if (!this.checkboxValue) {\n            this.checkboxState = 'unchecked';\n        }\n        this._previousState = this.checkboxState;\n    }\n\n    /** @hidden */\n    private _nextValueEvent(triggeredByClick?: boolean, event?: MouseEvent): void {\n        if (\n            this._platform.TRIDENT &&\n            this._previousState === 'indeterminate' &&\n            this.checkboxState === 'indeterminate'\n        ) {\n            this.checkboxState = 'force-checked';\n            this._detectChanges();\n            /** Prevents from keeping the old value */\n            if (triggeredByClick) {\n                this.nextValue('force-checked');\n                if (event) {\n                    this.muteKey(event);\n                    event.preventDefault();\n                }\n            }\n        }\n    }\n\n    /** @hidden Determines event source based on key code */\n    private _isSpaceBarEvent(event: KeyboardEvent): boolean {\n        return KeyUtil.isKeyCode(event, SPACE);\n    }\n\n    /** Method to trigger change detection in component */\n    private _detectChanges(): void {\n        if (!this._changeDetectorRef['destroyed']) {\n            this._changeDetectorRef.detectChanges();\n        }\n    }\n}\n","<input\n    #inputLabel\n    type=\"checkbox\"\n    class=\"fd-checkbox\"\n    [id]=\"inputId\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [indeterminate]=\"isIndeterminate\"\n    [attr.tabindex]=\"tabIndexValue\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-describedby]=\"ariaDescribedBy\"\n    [attr.aria-disabled]=\"disabled\"\n    [attr.aria-required]=\"required\"\n    [class.fd-checkbox--compact]=\"compact\"\n    [class]=\"state ? 'is-' + state : ''\"\n    [ngModel]=\"isChecked\"\n    (ngModelChange)=\"nextValue()\"\n    (keydown)=\"checkByKey($event)\"\n    (keyup)=\"handleInputKeyUp($event)\"\n    (click)=\"$event.stopPropagation()\"\n    (blur)=\"onBlur()\"\n    (focus)=\"onFocus()\"\n/>\n\n<label\n    class=\"fd-checkbox__label\"\n    #labelElement\n    [for]=\"inputId\"\n    [class]=\"labelClass\"\n    [attr.title]=\"title\"\n    [class.fd-checkbox__label--compact]=\"compact\"\n    [class.fd-checkbox__label--required]=\"required\"\n    (click)=\"checkByClick($event)\"\n>\n    <div class=\"fd-checkbox__label-container\">\n        <ng-container *ngIf=\"label\">\n            <span class=\"fd-checkbox__text\">\n                {{ label }}\n            </span>\n        </ng-container>\n\n        <ng-container *ngIf=\"!label\">\n            <span class=\"fd-checkbox__text\">\n                <ng-content></ng-content>\n            </span>\n        </ng-container>\n    </div>\n</label>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { CheckboxComponent } from './checkbox/checkbox.component';\nimport { FormsModule } from '@angular/forms';\n\n@NgModule({\n    declarations: [CheckboxComponent],\n    imports: [CommonModule, FormsModule],\n    exports: [CheckboxComponent]\n})\nexport class CheckboxModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"fundamental-ngx-core-checkbox.mjs","sources":["../../../../libs/core/src/lib/checkbox/checkbox/checkbox.component.ts","../../../../libs/core/src/lib/checkbox/checkbox/checkbox.component.html","../../../../libs/core/src/lib/checkbox/checkbox.module.ts","../../../../libs/core/src/lib/checkbox/fundamental-ngx-core-checkbox.ts"],"sourcesContent":["import {\n    Attribute,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ElementRef,\n    EventEmitter,\n    forwardRef,\n    HostBinding,\n    Inject,\n    Input,\n    OnDestroy,\n    OnInit,\n    Optional,\n    Output,\n    Renderer2,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { FdCheckboxValues } from './fd-checkbox-values.interface';\nimport { LIST_ITEM_COMPONENT, ListItemInterface, ContentDensityService } from '@fundamental-ngx/core/utils';\nimport equal from 'fast-deep-equal';\nimport { Subscription } from 'rxjs';\nimport { FormStates } from '@fundamental-ngx/core/shared';\n\nlet checkboxUniqueId = 0;\n\nexport type FdCheckboxTypes = 'checked' | 'unchecked' | 'indeterminate' | 'force-checked';\n\n@Component({\n    selector: 'fd-checkbox',\n    templateUrl: './checkbox.component.html',\n    styleUrls: ['./checkbox.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            useExisting: forwardRef(() => CheckboxComponent),\n            multi: true\n        }\n    ],\n    host: { '[attr.tabindex]': '-1' }\n})\nexport class CheckboxComponent implements ControlValueAccessor, OnInit, OnDestroy {\n    /** @hidden */\n    @ViewChild('inputElement')\n    inputElement: ElementRef<HTMLInputElement>;\n\n    /** @hidden */\n    @ViewChild('labelElement')\n    labelElement: ElementRef;\n\n    /** Sets the `aria-label` attribute to the element. */\n    @Input()\n    ariaLabel = '';\n\n    /** Current selection state of the checkbox component */\n    @Input()\n    set value(value: any) {\n        this.writeValue(value);\n    }\n    get value(): any {\n        return this.checkboxValue;\n    }\n\n    /** Sets the `aria-labelledby` attribute to the element. */\n    @Input()\n    ariaLabelledBy = null;\n\n    /** Sets the `aria-describedby` attribute to the element. */\n    @Input()\n    ariaDescribedBy: string;\n\n    /** sets checkbox tooltip */\n    @Input()\n    title: string;\n\n    /** Sets [id] property of input, binds input with input label using [for] property. */\n    @Input()\n    inputId = `fd-checkbox-${checkboxUniqueId++}`;\n\n    /** State of control, changes visual appearance of control. */\n    @Input()\n    state: FormStates;\n\n    /** Sets [name] property of input. */\n    @Input()\n    name: string;\n\n    /** Sets text of control label. */\n    @Input()\n    label: string;\n\n    /** Allows to disable/enable control. */\n    @Input()\n    disabled: boolean;\n\n    /** Allows to minimize control to compact mode. */\n    @Input()\n    compact?: boolean;\n\n    /** Enables controls third state. */\n    @Input()\n    tristate = false;\n\n    /** Allows to prevent user from manually selecting controls third state. */\n    @Input()\n    tristateSelectable = false;\n\n    /** Assigns given class to checkbox label element */\n    @Input()\n    labelClass: string;\n\n    /** If it is mandatory field */\n    @Input()\n    required = false;\n\n    /** @hidden */\n    private _subscriptions = new Subscription();\n\n    /** Sets values returned by control. */\n    // eslint-disable-next-line @angular-eslint/no-input-rename\n    @Input('values')\n    set _values(checkboxValues: FdCheckboxValues) {\n        this.values = { ...this.values, ...checkboxValues };\n    }\n\n    /** @hidden */\n    @HostBinding('style.position')\n    readonly position = 'relative';\n\n    /** @hidden */\n    @HostBinding('style.outline')\n    readonly outline = 'none';\n\n    /** Emits event on focus change */\n    @Output() focusChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n    /** Values returned by control. */\n    public values: FdCheckboxValues = { trueValue: true, falseValue: false, thirdStateValue: null };\n    /** Stores current checkbox value. */\n    public checkboxValue: any;\n    /** Stores current checkbox state. */\n    public checkboxState: FdCheckboxTypes;\n\n    /** @hidden Reference to callback provided by FormControl.*/\n    public onTouched = (): void => {};\n    /** @hidden Reference to callback provided by FormControl.*/\n    public onValueChange: (value: any) => void = () => {};\n\n    /** @hidden Used to define if control is in 'indeterminate' state.*/\n    get isIndeterminate(): boolean {\n        return this.checkboxState === 'indeterminate';\n    }\n\n    /** @hidden Used to define if control is in 'checked' / 'unchecked' state. */\n    get isChecked(): boolean {\n        return this.checkboxState === 'checked' || this.checkboxState === 'force-checked';\n    }\n\n    /** @hidden */\n    constructor(\n        public elementRef: ElementRef<Element>,\n        @Attribute('tabIndexValue') public tabIndexValue: number = 0,\n        private _changeDetectorRef: ChangeDetectorRef,\n        private renderer: Renderer2,\n        @Optional() private _contentDensityService: ContentDensityService,\n        @Optional() @Inject(LIST_ITEM_COMPONENT) private _listItemComponent: ListItemInterface\n    ) {\n        this.tabIndexValue = tabIndexValue;\n    }\n\n    /** @hidden */\n    ngOnInit(): void {\n        if (this.compact === undefined && this._contentDensityService) {\n            this._subscriptions.add(\n                this._contentDensityService._isCompactDensity.subscribe((isCompact) => {\n                    this.compact = isCompact;\n                    this._changeDetectorRef.markForCheck();\n                })\n            );\n        }\n    }\n\n    /** @hidden */\n    ngOnDestroy(): void {\n        this._subscriptions.unsubscribe();\n    }\n\n    /**\n     * @hidden ControlValueAccessor interface\n     * - sets new control value\n     * - updates control state\n     */\n    writeValue(value: any): void {\n        this.checkboxValue = value;\n        this._setState();\n        this._detectChanges();\n    }\n\n    /** @hidden ControlValueAccessor interface method - sets onValueChange callback.*/\n    registerOnChange(fn: any): void {\n        this.onValueChange = fn;\n    }\n\n    /** @hidden ControlValueAccessor interface method - sets onTouched callback.*/\n    registerOnTouched(fn: any): void {\n        this.onTouched = fn;\n    }\n\n    /** @hidden Called by FormControl - used to disable / enable control.*/\n    setDisabledState(disabled: boolean): void {\n        this.disabled = disabled;\n        this._detectChanges();\n    }\n\n    /**\n     * @hidden\n     * Based on current control state:\n     * - sets next control value\n     * - emits new control value\n     * - updates control state based on new control value\n     * */\n    nextValue(previousValue?: FdCheckboxTypes): void {\n        switch (previousValue || this.checkboxState) {\n            case 'checked':\n                this.checkboxValue = this.values.falseValue;\n                break;\n            case 'unchecked':\n                this.checkboxValue =\n                    this.tristate && this.tristateSelectable ? this.values.thirdStateValue : this.values.trueValue;\n                break;\n            case 'indeterminate':\n            case 'force-checked':\n                this.checkboxValue = this.values.trueValue;\n                this.renderer.setProperty(this.inputElement.nativeElement, 'checked', 'true');\n                break;\n            default:\n                this.checkboxValue =\n                    this.tristate && this.tristateSelectable ? this.values.thirdStateValue : this.values.trueValue;\n                break;\n        }\n        this._setState();\n        this.onValueChange(this.checkboxValue);\n        this._detectChanges();\n    }\n\n    /** @hidden handles blur event */\n    _onBlur(): void {\n        if (typeof this.onTouched === 'function') {\n            this.onTouched();\n        }\n        this.focusChange.emit(false);\n    }\n    /** @hidden handles focus event */\n    _onFocus(): void {\n        this.focusChange.emit(true);\n    }\n\n    /** @hidden handles click on the label associated with native checkbox input */\n    _onLabelClick(event: Event): void {\n        // We have to stop propagation for click events on the input label.\n        // By default, when a user clicks on a label element, a generated click event will be\n        // dispatched on the associated input element. This will lead to duplicated \"click\" event dispatched from the component\n        event.stopPropagation();\n    }\n\n    /** @hidden handles click on the native checkbox input */\n    _onInputClick(event: PointerEvent): void {\n        // When there's a click event dispatched from the input, we have to catch it, process and then re-dispatch it further.\n        // This is needed in order to set the value to the component before any external listeners will receive it.\n        // Otherwise checkbox might be out of sync.\n        event.stopPropagation();\n        this.nextValue();\n        this.elementRef.nativeElement.dispatchEvent(new PointerEvent(event.type, event));\n    }\n\n    /** @hidden Based on current control value sets new control state. */\n    private _setState(): void {\n        if (equal(this.checkboxValue, this.values.trueValue)) {\n            this.checkboxState = 'checked';\n        } else if (equal(this.checkboxValue, this.values.falseValue)) {\n            this.checkboxState = 'unchecked';\n        } else if (this.tristate && equal(this.checkboxValue, this.values.thirdStateValue)) {\n            this.checkboxState = 'indeterminate';\n        } else if (!this.checkboxValue) {\n            this.checkboxState = 'unchecked';\n        }\n    }\n\n    /** Method to trigger change detection in component */\n    private _detectChanges(): void {\n        if (!this._changeDetectorRef['destroyed']) {\n            this._changeDetectorRef.detectChanges();\n        }\n    }\n}\n","<input\n    #inputElement\n    type=\"checkbox\"\n    class=\"fd-checkbox\"\n    [id]=\"inputId\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [indeterminate]=\"isIndeterminate\"\n    [checked]=\"isChecked\"\n    [attr.tabindex]=\"tabIndexValue\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-describedby]=\"ariaDescribedBy\"\n    [attr.aria-disabled]=\"disabled\"\n    [attr.aria-required]=\"required\"\n    [class.fd-checkbox--compact]=\"compact\"\n    [class]=\"state ? 'is-' + state : ''\"\n    (click)=\"_onInputClick($event)\"\n    (blur)=\"_onBlur()\"\n    (focus)=\"_onFocus()\"\n/>\n\n<label\n    class=\"fd-checkbox__label\"\n    #labelElement\n    [for]=\"inputId\"\n    [class]=\"labelClass\"\n    [attr.title]=\"title\"\n    [class.fd-checkbox__label--compact]=\"compact\"\n    [class.fd-checkbox__label--required]=\"required\"\n    (click)=\"_onLabelClick($event)\"\n>\n    <div class=\"fd-checkbox__label-container\">\n        <ng-container *ngIf=\"label\">\n            <span class=\"fd-checkbox__text\">\n                {{ label }}\n            </span>\n        </ng-container>\n\n        <ng-container *ngIf=\"!label\">\n            <span class=\"fd-checkbox__text\">\n                <ng-content></ng-content>\n            </span>\n        </ng-container>\n    </div>\n</label>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { CheckboxComponent } from './checkbox/checkbox.component';\nimport { FormsModule } from '@angular/forms';\n\n@NgModule({\n    declarations: [CheckboxComponent],\n    imports: [CommonModule, FormsModule],\n    exports: [CheckboxComponent]\n})\nexport class CheckboxModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2020/fundamental-ngx-core-input-group.mjs

@@ -362,7 +362,7 @@ InputGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
             useExisting: forwardRef(() => InputGroupComponent),
             multi: true
         }
-    ], queries: [{ propertyName: "inputElement", first: true, predicate: InputGroupInputDirective, descendants: true }, { propertyName: "addOnElement", first: true, predicate: InputGroupAddOnDirective, descendants: true }], viewQueries: [{ propertyName: "_button", first: true, predicate: ["button"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n    class=\"fd-input-group\"\n    [class.fd-input-group--inline]=\"inline\"\n    [class.is-disabled]=\"disabled\"\n    [class.is-readonly]=\"readonly\"\n    [class.fd-shellbar__input-group]=\"inShellbar\"\n    [class.fd-input-group--control]=\"isControl\"\n    [class.is-focus]=\"isFocused && showFocus && !_isButtonFocused\"\n    [class]=\"state ? 'is-' + state : ' '\"\n>\n    <ng-container *ngIf=\"placement !== 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"!addOnElement && (glyph || addOnText)\">\n        <span\n            *ngIf=\"button\"\n            fd-input-group-addon\n            [compact]=\"compact\"\n            [button]=\"true\"\n            [placement]=\"placement\"\n            [class.fd-shellbar__input-group__addon]=\"inShellbar\"\n        >\n            <button\n                #button\n                fd-button\n                class=\"fd-input-group__button\"\n                type=\"button\"\n                fdType=\"transparent\"\n                [compact]=\"compact\"\n                [id]=\"_addOnButtonId\"\n                [attr.tabindex]=\"buttonFocusable ? 0 : -1\"\n                [attr.title]=\"iconTitle || glyphAriaLabel || glyph\"\n                [glyph]=\"glyph\"\n                [class.fd-shellbar__button]=\"inShellbar\"\n                [class.is-expanded]=\"isExpanded\"\n                [attr.aria-expanded]=\"inShellbar ? isExpanded : null\"\n                [ariaLabel]=\"glyphAriaLabel || glyph || addOnText\"\n                [attr.aria-controls]=\"input\"\n                [disabled]=\"disabled\"\n                (mousedown)=\"preventFocus($event)\"\n                (click)=\"buttonClicked($event)\"\n            >\n                <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            </button>\n        </span>\n\n        <span\n            *ngIf=\"!button\"\n            fd-input-group-addon\n            [id]=\"_addOnNonButtonId\"\n            [compact]=\"compact\"\n            [placement]=\"placement\"\n            [attr.aria-label]=\"glyphAriaLabel || glyph || addOnText\"\n            [attr.title]=\"iconTitle || glyph || addOnText\"\n        >\n            <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            <span *ngIf=\"glyph\" [className]=\"'sap-icon--' + glyph\"></span>\n        </span>\n    </ng-container>\n\n    <ng-container *ngIf=\"placement === 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #input>\n    <ng-container *ngIf=\"inputTemplate\">\n        <ng-container *ngTemplateOutlet=\"inputTemplate\"></ng-container>\n    </ng-container>\n    <input\n        [(ngModel)]=\"inputText\"\n        [id]=\"_inputId\"\n        [attr.aria-labelledby]=\"_getAriaLabelledbyIdsForInput()\"\n        [class.fd-shellbar__input-group__input]=\"inShellbar\"\n        fd-input-group-input\n        [compact]=\"compact\"\n        [type]=\"type\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        *ngIf=\"!inputElement && !inputTemplate\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.aria-required]=\"required\"\n        (search)=\"onSearchEvent($event)\"\n    />\n</ng-template>\n", styles: ["/*!\n.fd-input\n*/.fd-input{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;text-overflow:ellipsis;color:#32363a;color:var(--sapField_TextColor, #32363a);background-color:#fff;background-color:var(--sapField_Background, #fff);border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);outline:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-left:.75rem;padding-right:.75rem;min-width:2.75rem;width:100%;height:2.25rem;margin-top:.25rem;margin-bottom:.25rem;padding:0 .625rem;z-index:1;cursor:text;overflow:hidden;text-shadow:none;text-shadow:var(--fdInput_Text_Shadow, none)}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{font-style:italic;color:#74777a;color:var(--sapField_PlaceholderTextColor, #74777a)}.fd-input::selection{color:#fff;color:var(--sapContent_ContrastTextColor, #fff);background-color:#0854a0;background-color:var(--sapSelectedColor, #0854a0)}.fd-input.is-hover,.fd-input:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input.is-success.is-hover,.fd-input.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input.is-error.is-hover,.fd-input.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input.is-alert,.fd-input.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input.is-alert.is-hover,.fd-input.is-alert:hover,.fd-input.is-warning.is-hover,.fd-input.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input.is-information.is-hover,.fd-input.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input.is-focus,.fd-input:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-information,.fd-input.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.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{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:transparent}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:transparent}.fd-input::-ms-clear{display:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input:last-child{margin-bottom:.25rem}.fd-input--compact{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}.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}/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 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-input-group+(--inline, --control)\n    .fd-input-group__addon+(--button)\n*/.fd-input-group{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);background-color:#fff;background-color:var(--sapField_Background, #fff);width:100%;overflow:hidden;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group.is-hover,.fd-input-group:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input-group.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input-group.is-alert,.fd-input-group.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover,.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input-group.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input-group.is-focus,.fd-input-group:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-information,.fd-input-group.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:transparent}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:transparent}.fd-input-group.is-focus,.fd-input-group:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group>:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>:not(:first-child):not(:last-child){border-radius:0}.fd-input-group>[dir=rtl],[dir=rtl] .fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>[dir=rtl]:first-child,[dir=rtl] .fd-input-group>:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>[dir=rtl]:last-child,[dir=rtl] .fd-input-group>:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group .fd-input-group__input{background-color:transparent;border:none;flex:1 1 10rem;padding-right:.25rem;padding-left:.25rem;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{z-index:5;outline:0;box-shadow:none}.fd-input-group .fd-input-group__input.is-disabled,.fd-input-group .fd-input-group__input:disabled,.fd-input-group .fd-input-group__input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group .fd-input-group__input:nth-child(1){padding-left:.625rem}.fd-input-group .fd-input-group__input:nth-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-child(1){padding-right:.625rem;padding-left:0}.fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:.625rem}.fd-input-group .fd-input-group__input:nth-last-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:0;padding-left:.625rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;justify-content:center;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#6a6d70;color:var(--sapContent_NonInteractiveIconColor, #6a6d70);background:0 0!important;font-size:1rem;font-size:var(--sapFontLargeSize, 1rem);min-width:2.25rem;min-height:2.25rem;padding-left:.625rem;padding-right:.625rem}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:1rem;font-size:var(--sapFontLargeSize, 1rem)}.fd-input-group__addon--compact{min-width:2rem;min-height:1.625rem}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{padding:0;display:flex;flex-direction:column;border:none;border-radius:.0625rem}.fd-input-group__addon--button .fd-input-group__button{border-radius:0;height:100%;max-height:100%}.fd-input-group__addon--button .fd-input-group__button:nth-child(n+1){margin:0}.fd-input-group__addon--button>*{border-radius:0}.fd-input-group__addon--button:first-child{border-radius:.0625rem 0 0 .0625rem}.fd-input-group__addon--button:last-child{border-radius:0 .0625rem .0625rem 0}.fd-input-group__addon--button:not(:first-child):not(:last-child) .fd-input-group__button{border-radius:0}.fd-input-group__addon--button[dir=rtl]:first-child,[dir=rtl] .fd-input-group__addon--button:first-child{border-radius:0 .0625rem .0625rem 0;margin-right:0}.fd-input-group__addon--button[dir=rtl]:last-child,[dir=rtl] .fd-input-group__addon--button:last-child{border-radius:.0625rem 0 0 .0625rem;margin-left:0}.fd-input-group__button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;width:100%;z-index:auto!important;position:static!important}.fd-input-group__button.is-focus,.fd-input-group__button:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#0854a0;outline-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group__button.is-focus.fd-input-group--toggled,.fd-input-group__button:focus.fd-input-group--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group__button:before{display:none!important}.fd-input-group .fd-button.fd-input-group__button{border-color:transparent}.fd-input-group--control .fd-input-group__button.is-expanded{background-color:#0854a0;background-color:var(--sapButton_Active_Background, #0854a0);color:#fff;color:var(--sapButton_Active_TextColor, #fff)}.fd-input-group--control .fd-input-group__button.is-expanded.is-focus,.fd-input-group--control .fd-input-group__button.is-expanded:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted);outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group--control.is-hover .fd-input-group__button,.fd-input-group--control:hover .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-hover .fd-input-group__button[dir=rtl],.fd-input-group--control:hover .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-hover .fd-input-group__button,[dir=rtl] .fd-input-group--control:hover .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button,.fd-input-group--control:active .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button[dir=rtl],.fd-input-group--control:active .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-active .fd-input-group__button,[dir=rtl] .fd-input-group--control:active .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}fd-input-group .fd-input-group__addon--button.fd-input-group__addon--textarea>*{max-height:100%;height:100%}fd-input-group .fd-input-group__input,fd-input-group .fd-input-group__input:hover{background:none}\n"], components: [{ type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: InputGroupAddOnDirective, selector: "[fd-input-group-addon]", inputs: ["class", "placement", "compact", "type", "state", "button"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class", "compact"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    ], queries: [{ propertyName: "inputElement", first: true, predicate: InputGroupInputDirective, descendants: true }, { propertyName: "addOnElement", first: true, predicate: InputGroupAddOnDirective, descendants: true }], viewQueries: [{ propertyName: "_button", first: true, predicate: ["button"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n    class=\"fd-input-group\"\n    [class.fd-input-group--inline]=\"inline\"\n    [class.is-disabled]=\"disabled\"\n    [class.is-readonly]=\"readonly\"\n    [class.fd-shellbar__input-group]=\"inShellbar\"\n    [class.fd-input-group--control]=\"isControl\"\n    [class.is-focus]=\"isFocused && showFocus && !_isButtonFocused\"\n    [class]=\"state ? 'is-' + state : ' '\"\n>\n    <ng-container *ngIf=\"placement !== 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"!addOnElement && (glyph || addOnText)\">\n        <span\n            *ngIf=\"button\"\n            fd-input-group-addon\n            [compact]=\"compact\"\n            [button]=\"true\"\n            [placement]=\"placement\"\n            [class.fd-shellbar__input-group__addon]=\"inShellbar\"\n        >\n            <button\n                #button\n                fd-button\n                class=\"fd-input-group__button\"\n                type=\"button\"\n                fdType=\"transparent\"\n                [compact]=\"compact\"\n                [id]=\"_addOnButtonId\"\n                [attr.tabindex]=\"buttonFocusable ? 0 : -1\"\n                [attr.title]=\"iconTitle || glyphAriaLabel || glyph\"\n                [glyph]=\"glyph\"\n                [class.fd-shellbar__button]=\"inShellbar\"\n                [class.is-expanded]=\"isExpanded\"\n                [attr.aria-expanded]=\"inShellbar ? isExpanded : null\"\n                [ariaLabel]=\"glyphAriaLabel || glyph || addOnText\"\n                [attr.aria-controls]=\"input\"\n                [disabled]=\"disabled\"\n                (mousedown)=\"preventFocus($event)\"\n                (click)=\"buttonClicked($event)\"\n            >\n                <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            </button>\n        </span>\n\n        <span\n            *ngIf=\"!button\"\n            fd-input-group-addon\n            [id]=\"_addOnNonButtonId\"\n            [compact]=\"compact\"\n            [placement]=\"placement\"\n            [attr.aria-label]=\"glyphAriaLabel || glyph || addOnText\"\n            [attr.title]=\"iconTitle || glyph || addOnText\"\n        >\n            <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            <span *ngIf=\"glyph\" [className]=\"'sap-icon--' + glyph\"></span>\n        </span>\n    </ng-container>\n\n    <ng-container *ngIf=\"placement === 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #input>\n    <ng-container *ngIf=\"inputTemplate\">\n        <ng-container *ngTemplateOutlet=\"inputTemplate\"></ng-container>\n    </ng-container>\n    <input\n        [(ngModel)]=\"inputText\"\n        [id]=\"_inputId\"\n        [attr.aria-labelledby]=\"_getAriaLabelledbyIdsForInput()\"\n        [class.fd-shellbar__input-group__input]=\"inShellbar\"\n        fd-input-group-input\n        [compact]=\"compact\"\n        [type]=\"type\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        *ngIf=\"!inputElement && !inputTemplate\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.aria-required]=\"required\"\n        (search)=\"onSearchEvent($event)\"\n    />\n</ng-template>\n", styles: ["/*!\n.fd-input\n*/.fd-input{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;text-overflow:ellipsis;color:#32363a;color:var(--sapField_TextColor, #32363a);background-color:#fff;background-color:var(--sapField_Background, #fff);border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);outline:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-left:.75rem;padding-right:.75rem;min-width:2.75rem;width:100%;height:2.25rem;margin-top:.25rem;margin-bottom:.25rem;padding:0 .625rem;z-index:1;cursor:text;overflow:hidden;text-shadow:none;text-shadow:var(--fdInput_Text_Shadow, none)}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{font-style:italic;color:#74777a;color:var(--sapField_PlaceholderTextColor, #74777a)}.fd-input::selection{color:#fff;color:var(--sapContent_ContrastTextColor, #fff);background-color:#0854a0;background-color:var(--sapSelectedColor, #0854a0)}.fd-input.is-hover,.fd-input:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input.is-success.is-hover,.fd-input.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input.is-error.is-hover,.fd-input.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input.is-alert,.fd-input.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input.is-alert.is-hover,.fd-input.is-alert:hover,.fd-input.is-warning.is-hover,.fd-input.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input.is-information.is-hover,.fd-input.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input.is-focus,.fd-input:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-information,.fd-input.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.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{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:transparent}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:transparent}.fd-input::-ms-clear{display:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input:last-child{margin-bottom:.25rem}.fd-input--compact{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}.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}/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 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-input-group+(--inline, --control)\n    .fd-input-group__addon+(--button)\n*/.fd-input-group{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);background-color:#fff;background-color:var(--sapField_Background, #fff);width:100%;overflow:hidden;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group.is-hover,.fd-input-group:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input-group.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input-group.is-alert,.fd-input-group.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover,.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input-group.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input-group.is-focus,.fd-input-group:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-information,.fd-input-group.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:transparent}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:transparent}.fd-input-group.is-focus,.fd-input-group:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group>:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>:not(:first-child):not(:last-child){border-radius:0}.fd-input-group>[dir=rtl],[dir=rtl] .fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>[dir=rtl]:first-child,[dir=rtl] .fd-input-group>:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>[dir=rtl]:last-child,[dir=rtl] .fd-input-group>:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group .fd-input-group__input{background-color:transparent;border:none;flex:1 1 10rem;padding-right:.25rem;padding-left:.25rem;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{z-index:5;outline:0;box-shadow:none}.fd-input-group .fd-input-group__input.is-disabled,.fd-input-group .fd-input-group__input:disabled,.fd-input-group .fd-input-group__input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group .fd-input-group__input:nth-child(1){padding-left:.625rem}.fd-input-group .fd-input-group__input:nth-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-child(1){padding-right:.625rem;padding-left:0}.fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:.625rem}.fd-input-group .fd-input-group__input:nth-last-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:0;padding-left:.625rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;justify-content:center;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#6a6d70;color:var(--sapContent_NonInteractiveIconColor, #6a6d70);background:0 0!important;font-size:1rem;font-size:var(--sapFontLargeSize, 1rem);min-width:2.25rem;min-height:2.25rem;padding-left:.625rem;padding-right:.625rem}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:1rem;font-size:var(--sapFontLargeSize, 1rem)}.fd-input-group__addon--compact{min-width:2rem;min-height:1.625rem}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{padding:0;display:flex;flex-direction:column;border:none;border-radius:.0625rem}.fd-input-group__addon--button .fd-input-group__button{border-radius:0;height:100%;max-height:100%}.fd-input-group__addon--button .fd-input-group__button:nth-child(n+1){margin:0}.fd-input-group__addon--button>*{border-radius:0}.fd-input-group__addon--button:first-child{border-radius:.0625rem 0 0 .0625rem}.fd-input-group__addon--button:last-child{border-radius:0 .0625rem .0625rem 0}.fd-input-group__addon--button:not(:first-child):not(:last-child) .fd-input-group__button{border-radius:0}.fd-input-group__addon--button[dir=rtl]:first-child,[dir=rtl] .fd-input-group__addon--button:first-child{border-radius:0 .0625rem .0625rem 0;margin-right:0}.fd-input-group__addon--button[dir=rtl]:last-child,[dir=rtl] .fd-input-group__addon--button:last-child{border-radius:.0625rem 0 0 .0625rem;margin-left:0}.fd-input-group__button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;width:100%;z-index:auto!important;position:static!important}.fd-input-group__button.is-focus,.fd-input-group__button:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#0854a0;outline-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group__button.is-focus.fd-input-group--toggled,.fd-input-group__button:focus.fd-input-group--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group__button:before{display:none!important}.fd-input-group .fd-button.fd-input-group__button{border-color:transparent}.fd-input-group--control .fd-input-group__button.is-expanded{background-color:#0854a0;background-color:var(--sapButton_Active_Background, #0854a0);color:#fff;color:var(--sapButton_Active_TextColor, #fff)}.fd-input-group--control .fd-input-group__button.is-expanded.is-focus,.fd-input-group--control .fd-input-group__button.is-expanded:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted);outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group--control.is-hover .fd-input-group__button,.fd-input-group--control:hover .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-hover .fd-input-group__button[dir=rtl],.fd-input-group--control:hover .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-hover .fd-input-group__button,[dir=rtl] .fd-input-group--control:hover .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button,.fd-input-group--control:active .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button[dir=rtl],.fd-input-group--control:active .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-active .fd-input-group__button,[dir=rtl] .fd-input-group--control:active .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}fd-input-group .fd-input-group{margin:.25rem 0}fd-input-group .fd-input-group__addon--button.fd-input-group__addon--textarea>*{max-height:100%;height:100%}fd-input-group .fd-input-group__input,fd-input-group .fd-input-group__input:hover{background:none}\n"], components: [{ type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: InputGroupAddOnDirective, selector: "[fd-input-group-addon]", inputs: ["class", "placement", "compact", "type", "state", "button"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class", "compact"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.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: "13.1.2", ngImport: i0, type: InputGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-input-group', providers: [
@@ -371,7 +371,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
                             useExisting: forwardRef(() => InputGroupComponent),
                             multi: true
                         }
-                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"fd-input-group\"\n    [class.fd-input-group--inline]=\"inline\"\n    [class.is-disabled]=\"disabled\"\n    [class.is-readonly]=\"readonly\"\n    [class.fd-shellbar__input-group]=\"inShellbar\"\n    [class.fd-input-group--control]=\"isControl\"\n    [class.is-focus]=\"isFocused && showFocus && !_isButtonFocused\"\n    [class]=\"state ? 'is-' + state : ' '\"\n>\n    <ng-container *ngIf=\"placement !== 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"!addOnElement && (glyph || addOnText)\">\n        <span\n            *ngIf=\"button\"\n            fd-input-group-addon\n            [compact]=\"compact\"\n            [button]=\"true\"\n            [placement]=\"placement\"\n            [class.fd-shellbar__input-group__addon]=\"inShellbar\"\n        >\n            <button\n                #button\n                fd-button\n                class=\"fd-input-group__button\"\n                type=\"button\"\n                fdType=\"transparent\"\n                [compact]=\"compact\"\n                [id]=\"_addOnButtonId\"\n                [attr.tabindex]=\"buttonFocusable ? 0 : -1\"\n                [attr.title]=\"iconTitle || glyphAriaLabel || glyph\"\n                [glyph]=\"glyph\"\n                [class.fd-shellbar__button]=\"inShellbar\"\n                [class.is-expanded]=\"isExpanded\"\n                [attr.aria-expanded]=\"inShellbar ? isExpanded : null\"\n                [ariaLabel]=\"glyphAriaLabel || glyph || addOnText\"\n                [attr.aria-controls]=\"input\"\n                [disabled]=\"disabled\"\n                (mousedown)=\"preventFocus($event)\"\n                (click)=\"buttonClicked($event)\"\n            >\n                <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            </button>\n        </span>\n\n        <span\n            *ngIf=\"!button\"\n            fd-input-group-addon\n            [id]=\"_addOnNonButtonId\"\n            [compact]=\"compact\"\n            [placement]=\"placement\"\n            [attr.aria-label]=\"glyphAriaLabel || glyph || addOnText\"\n            [attr.title]=\"iconTitle || glyph || addOnText\"\n        >\n            <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            <span *ngIf=\"glyph\" [className]=\"'sap-icon--' + glyph\"></span>\n        </span>\n    </ng-container>\n\n    <ng-container *ngIf=\"placement === 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #input>\n    <ng-container *ngIf=\"inputTemplate\">\n        <ng-container *ngTemplateOutlet=\"inputTemplate\"></ng-container>\n    </ng-container>\n    <input\n        [(ngModel)]=\"inputText\"\n        [id]=\"_inputId\"\n        [attr.aria-labelledby]=\"_getAriaLabelledbyIdsForInput()\"\n        [class.fd-shellbar__input-group__input]=\"inShellbar\"\n        fd-input-group-input\n        [compact]=\"compact\"\n        [type]=\"type\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        *ngIf=\"!inputElement && !inputTemplate\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.aria-required]=\"required\"\n        (search)=\"onSearchEvent($event)\"\n    />\n</ng-template>\n", styles: ["/*!\n.fd-input\n*/.fd-input{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;text-overflow:ellipsis;color:#32363a;color:var(--sapField_TextColor, #32363a);background-color:#fff;background-color:var(--sapField_Background, #fff);border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);outline:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-left:.75rem;padding-right:.75rem;min-width:2.75rem;width:100%;height:2.25rem;margin-top:.25rem;margin-bottom:.25rem;padding:0 .625rem;z-index:1;cursor:text;overflow:hidden;text-shadow:none;text-shadow:var(--fdInput_Text_Shadow, none)}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{font-style:italic;color:#74777a;color:var(--sapField_PlaceholderTextColor, #74777a)}.fd-input::selection{color:#fff;color:var(--sapContent_ContrastTextColor, #fff);background-color:#0854a0;background-color:var(--sapSelectedColor, #0854a0)}.fd-input.is-hover,.fd-input:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input.is-success.is-hover,.fd-input.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input.is-error.is-hover,.fd-input.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input.is-alert,.fd-input.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input.is-alert.is-hover,.fd-input.is-alert:hover,.fd-input.is-warning.is-hover,.fd-input.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input.is-information.is-hover,.fd-input.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input.is-focus,.fd-input:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-information,.fd-input.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.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{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:transparent}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:transparent}.fd-input::-ms-clear{display:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input:last-child{margin-bottom:.25rem}.fd-input--compact{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}.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}/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 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-input-group+(--inline, --control)\n    .fd-input-group__addon+(--button)\n*/.fd-input-group{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);background-color:#fff;background-color:var(--sapField_Background, #fff);width:100%;overflow:hidden;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group.is-hover,.fd-input-group:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input-group.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input-group.is-alert,.fd-input-group.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover,.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input-group.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input-group.is-focus,.fd-input-group:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-information,.fd-input-group.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:transparent}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:transparent}.fd-input-group.is-focus,.fd-input-group:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group>:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>:not(:first-child):not(:last-child){border-radius:0}.fd-input-group>[dir=rtl],[dir=rtl] .fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>[dir=rtl]:first-child,[dir=rtl] .fd-input-group>:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>[dir=rtl]:last-child,[dir=rtl] .fd-input-group>:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group .fd-input-group__input{background-color:transparent;border:none;flex:1 1 10rem;padding-right:.25rem;padding-left:.25rem;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{z-index:5;outline:0;box-shadow:none}.fd-input-group .fd-input-group__input.is-disabled,.fd-input-group .fd-input-group__input:disabled,.fd-input-group .fd-input-group__input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group .fd-input-group__input:nth-child(1){padding-left:.625rem}.fd-input-group .fd-input-group__input:nth-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-child(1){padding-right:.625rem;padding-left:0}.fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:.625rem}.fd-input-group .fd-input-group__input:nth-last-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:0;padding-left:.625rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;justify-content:center;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#6a6d70;color:var(--sapContent_NonInteractiveIconColor, #6a6d70);background:0 0!important;font-size:1rem;font-size:var(--sapFontLargeSize, 1rem);min-width:2.25rem;min-height:2.25rem;padding-left:.625rem;padding-right:.625rem}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:1rem;font-size:var(--sapFontLargeSize, 1rem)}.fd-input-group__addon--compact{min-width:2rem;min-height:1.625rem}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{padding:0;display:flex;flex-direction:column;border:none;border-radius:.0625rem}.fd-input-group__addon--button .fd-input-group__button{border-radius:0;height:100%;max-height:100%}.fd-input-group__addon--button .fd-input-group__button:nth-child(n+1){margin:0}.fd-input-group__addon--button>*{border-radius:0}.fd-input-group__addon--button:first-child{border-radius:.0625rem 0 0 .0625rem}.fd-input-group__addon--button:last-child{border-radius:0 .0625rem .0625rem 0}.fd-input-group__addon--button:not(:first-child):not(:last-child) .fd-input-group__button{border-radius:0}.fd-input-group__addon--button[dir=rtl]:first-child,[dir=rtl] .fd-input-group__addon--button:first-child{border-radius:0 .0625rem .0625rem 0;margin-right:0}.fd-input-group__addon--button[dir=rtl]:last-child,[dir=rtl] .fd-input-group__addon--button:last-child{border-radius:.0625rem 0 0 .0625rem;margin-left:0}.fd-input-group__button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;width:100%;z-index:auto!important;position:static!important}.fd-input-group__button.is-focus,.fd-input-group__button:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#0854a0;outline-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group__button.is-focus.fd-input-group--toggled,.fd-input-group__button:focus.fd-input-group--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group__button:before{display:none!important}.fd-input-group .fd-button.fd-input-group__button{border-color:transparent}.fd-input-group--control .fd-input-group__button.is-expanded{background-color:#0854a0;background-color:var(--sapButton_Active_Background, #0854a0);color:#fff;color:var(--sapButton_Active_TextColor, #fff)}.fd-input-group--control .fd-input-group__button.is-expanded.is-focus,.fd-input-group--control .fd-input-group__button.is-expanded:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted);outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group--control.is-hover .fd-input-group__button,.fd-input-group--control:hover .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-hover .fd-input-group__button[dir=rtl],.fd-input-group--control:hover .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-hover .fd-input-group__button,[dir=rtl] .fd-input-group--control:hover .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button,.fd-input-group--control:active .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button[dir=rtl],.fd-input-group--control:active .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-active .fd-input-group__button,[dir=rtl] .fd-input-group--control:active .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}fd-input-group .fd-input-group__addon--button.fd-input-group__addon--textarea>*{max-height:100%;height:100%}fd-input-group .fd-input-group__input,fd-input-group .fd-input-group__input:hover{background:none}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"fd-input-group\"\n    [class.fd-input-group--inline]=\"inline\"\n    [class.is-disabled]=\"disabled\"\n    [class.is-readonly]=\"readonly\"\n    [class.fd-shellbar__input-group]=\"inShellbar\"\n    [class.fd-input-group--control]=\"isControl\"\n    [class.is-focus]=\"isFocused && showFocus && !_isButtonFocused\"\n    [class]=\"state ? 'is-' + state : ' '\"\n>\n    <ng-container *ngIf=\"placement !== 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n\n    <ng-content></ng-content>\n\n    <ng-container *ngIf=\"!addOnElement && (glyph || addOnText)\">\n        <span\n            *ngIf=\"button\"\n            fd-input-group-addon\n            [compact]=\"compact\"\n            [button]=\"true\"\n            [placement]=\"placement\"\n            [class.fd-shellbar__input-group__addon]=\"inShellbar\"\n        >\n            <button\n                #button\n                fd-button\n                class=\"fd-input-group__button\"\n                type=\"button\"\n                fdType=\"transparent\"\n                [compact]=\"compact\"\n                [id]=\"_addOnButtonId\"\n                [attr.tabindex]=\"buttonFocusable ? 0 : -1\"\n                [attr.title]=\"iconTitle || glyphAriaLabel || glyph\"\n                [glyph]=\"glyph\"\n                [class.fd-shellbar__button]=\"inShellbar\"\n                [class.is-expanded]=\"isExpanded\"\n                [attr.aria-expanded]=\"inShellbar ? isExpanded : null\"\n                [ariaLabel]=\"glyphAriaLabel || glyph || addOnText\"\n                [attr.aria-controls]=\"input\"\n                [disabled]=\"disabled\"\n                (mousedown)=\"preventFocus($event)\"\n                (click)=\"buttonClicked($event)\"\n            >\n                <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            </button>\n        </span>\n\n        <span\n            *ngIf=\"!button\"\n            fd-input-group-addon\n            [id]=\"_addOnNonButtonId\"\n            [compact]=\"compact\"\n            [placement]=\"placement\"\n            [attr.aria-label]=\"glyphAriaLabel || glyph || addOnText\"\n            [attr.title]=\"iconTitle || glyph || addOnText\"\n        >\n            <ng-container *ngIf=\"!glyph\">{{ addOnText }}</ng-container>\n            <span *ngIf=\"glyph\" [className]=\"'sap-icon--' + glyph\"></span>\n        </span>\n    </ng-container>\n\n    <ng-container *ngIf=\"placement === 'before' && !inputElement\">\n        <ng-container *ngTemplateOutlet=\"input\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #input>\n    <ng-container *ngIf=\"inputTemplate\">\n        <ng-container *ngTemplateOutlet=\"inputTemplate\"></ng-container>\n    </ng-container>\n    <input\n        [(ngModel)]=\"inputText\"\n        [id]=\"_inputId\"\n        [attr.aria-labelledby]=\"_getAriaLabelledbyIdsForInput()\"\n        [class.fd-shellbar__input-group__input]=\"inShellbar\"\n        fd-input-group-input\n        [compact]=\"compact\"\n        [type]=\"type\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        *ngIf=\"!inputElement && !inputTemplate\"\n        [attr.placeholder]=\"placeholder\"\n        [attr.aria-required]=\"required\"\n        (search)=\"onSearchEvent($event)\"\n    />\n</ng-template>\n", styles: ["/*!\n.fd-input\n*/.fd-input{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;white-space:nowrap;text-overflow:ellipsis;color:#32363a;color:var(--sapField_TextColor, #32363a);background-color:#fff;background-color:var(--sapField_Background, #fff);border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);outline:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-left:.75rem;padding-right:.75rem;min-width:2.75rem;width:100%;height:2.25rem;margin-top:.25rem;margin-bottom:.25rem;padding:0 .625rem;z-index:1;cursor:text;overflow:hidden;text-shadow:none;text-shadow:var(--fdInput_Text_Shadow, none)}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{font-style:italic;color:#74777a;color:var(--sapField_PlaceholderTextColor, #74777a)}.fd-input::selection{color:#fff;color:var(--sapContent_ContrastTextColor, #fff);background-color:#0854a0;background-color:var(--sapSelectedColor, #0854a0)}.fd-input.is-hover,.fd-input:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input.is-success.is-hover,.fd-input.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input.is-error.is-hover,.fd-input.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input.is-alert,.fd-input.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input.is-alert.is-hover,.fd-input.is-alert:hover,.fd-input.is-warning.is-hover,.fd-input.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input.is-information.is-hover,.fd-input.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input.is-focus,.fd-input:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-information,.fd-input.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.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{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:transparent}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:transparent}.fd-input::-ms-clear{display:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input:last-child{margin-bottom:.25rem}.fd-input--compact{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}.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}/*!\n * Fundamental Library Styles v0.21.0-rc.92\n * Copyright (c) 2022 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-input-group+(--inline, --control)\n    .fd-input-group__addon+(--button)\n*/.fd-input-group{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;border-style:solid;border-width:.0625rem;border-width:var(--sapField_BorderWidth, .0625rem);border-color:#89919a;border-color:var(--sapField_BorderColor, #89919a);border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem);background-color:#fff;background-color:var(--sapField_Background, #fff);width:100%;overflow:hidden;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group.is-hover,.fd-input-group:hover{background-color:#fff;background-color:var(--sapField_Hover_Background, #fff);border-color:#0854a0;border-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group.is-success{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e);border-width:.0625rem;border-width:var(--sapField_SuccessBorderWidth, .0625rem);border-style:solid;border-style:var(--sapField_SuccessBorderStyle, solid)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{background-color:#fff;background-color:var(--sapField_SuccessBackground, #fff);border-color:#107e3e;border-color:var(--sapField_SuccessColor, #107e3e)}.fd-input-group.is-error{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00);border-width:.125rem;border-width:var(--sapField_InvalidBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InvalidBorderStyle, solid)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{background-color:#fff;background-color:var(--sapField_InvalidBackground, #fff);border-color:#b00;border-color:var(--sapField_InvalidColor, #b00)}.fd-input-group.is-alert,.fd-input-group.is-warning{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);font-style:normal;font-style:var(--fdInput_State_Text_Style, normal);font-weight:400;font-weight:var(--fdInput_State_Font_Weight, normal);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c);border-width:.125rem;border-width:var(--sapField_WarningBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_WarningBorderStyle, solid)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover,.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{background-color:#fff;background-color:var(--sapField_WarningBackground, #fff);border-color:#df6e0c;border-color:var(--sapField_WarningColor, #df6e0c)}.fd-input-group.is-information{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1);border-width:.125rem;border-width:var(--sapField_InformationBorderWidth, .125rem);border-style:solid;border-style:var(--sapField_InformationBorderStyle, solid)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{background-color:#fff;background-color:var(--sapField_InformationBackground, #fff);border-color:#0a6ed1;border-color:var(--sapField_InformationColor, #0a6ed1)}.fd-input-group.is-focus,.fd-input-group:focus{z-index:5;box-shadow:none;outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-information,.fd-input-group.is-warning{border-width:.125rem;border-style:solid;border-style:var(--fdInput_State_Border_Type, solid)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5;box-shadow:none;outline-offset:-.25rem}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:transparent}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{background-color:#f2f2f280;background-color:var(--sapField_ReadOnly_Background, rgba(242, 242, 242, .5));border-color:#89919a;border-color:var(--sapField_ReadOnly_BorderColor, #89919a)}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:transparent}.fd-input-group.is-focus,.fd-input-group:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted)}.fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group>:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>:not(:first-child):not(:last-child){border-radius:0}.fd-input-group>[dir=rtl],[dir=rtl] .fd-input-group>*{border-radius:.125rem;border-radius:var(--sapField_BorderCornerRadius, .125rem)}.fd-input-group>[dir=rtl]:first-child,[dir=rtl] .fd-input-group>:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.fd-input-group>[dir=rtl]:last-child,[dir=rtl] .fd-input-group>:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.fd-input-group .fd-input-group__input{background-color:transparent;border:none;flex:1 1 10rem;padding-right:.25rem;padding-left:.25rem;text-shadow:none;text-shadow:var(--fdInputGroup_Text_Shadow, none)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{z-index:5;outline:0;box-shadow:none}.fd-input-group .fd-input-group__input.is-disabled,.fd-input-group .fd-input-group__input:disabled,.fd-input-group .fd-input-group__input[aria-disabled=true]{pointer-events:none;opacity:.4;opacity:var(--sapContent_DisabledOpacity, .4)}.fd-input-group .fd-input-group__input:nth-child(1){padding-left:.625rem}.fd-input-group .fd-input-group__input:nth-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-child(1){padding-right:.625rem;padding-left:0}.fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:.625rem}.fd-input-group .fd-input-group__input:nth-last-child(1)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:nth-last-child(1){padding-right:0;padding-left:.625rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{font-size:.875rem;font-size:var(--sapFontSize, .875rem);line-height:1.4;line-height:var(--sapContent_LineHeight, 1.4);color:#32363a;color:var(--sapTextColor, #32363a);font-family:\"72\",\"72full\",Arial,Helvetica,sans-serif;font-family:var(--sapFontFamily, \"72\", \"72full\", Arial, Helvetica, sans-serif);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;display:flex;justify-content:center;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#6a6d70;color:var(--sapContent_NonInteractiveIconColor, #6a6d70);background:0 0!important;font-size:1rem;font-size:var(--sapFontLargeSize, 1rem);min-width:2.25rem;min-height:2.25rem;padding-left:.625rem;padding-right:.625rem}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:1rem;font-size:var(--sapFontLargeSize, 1rem)}.fd-input-group__addon--compact{min-width:2rem;min-height:1.625rem}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{padding:0;display:flex;flex-direction:column;border:none;border-radius:.0625rem}.fd-input-group__addon--button .fd-input-group__button{border-radius:0;height:100%;max-height:100%}.fd-input-group__addon--button .fd-input-group__button:nth-child(n+1){margin:0}.fd-input-group__addon--button>*{border-radius:0}.fd-input-group__addon--button:first-child{border-radius:.0625rem 0 0 .0625rem}.fd-input-group__addon--button:last-child{border-radius:0 .0625rem .0625rem 0}.fd-input-group__addon--button:not(:first-child):not(:last-child) .fd-input-group__button{border-radius:0}.fd-input-group__addon--button[dir=rtl]:first-child,[dir=rtl] .fd-input-group__addon--button:first-child{border-radius:0 .0625rem .0625rem 0;margin-right:0}.fd-input-group__addon--button[dir=rtl]:last-child,[dir=rtl] .fd-input-group__addon--button:last-child{border-radius:.0625rem 0 0 .0625rem;margin-left:0}.fd-input-group__button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;width:100%;z-index:auto!important;position:static!important}.fd-input-group__button.is-focus,.fd-input-group__button:focus{z-index:5;outline:.0625rem dotted #000;outline:var(--sapContent_FocusWidth, .0625rem) var(--sapContent_FocusStyle, dotted) var(--sapContent_FocusColor, #000);outline-offset:-.1875rem;outline-color:#0854a0;outline-color:var(--sapField_Hover_BorderColor, #0854a0)}.fd-input-group__button.is-focus.fd-input-group--toggled,.fd-input-group__button:focus.fd-input-group--toggled{outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group__button:before{display:none!important}.fd-input-group .fd-button.fd-input-group__button{border-color:transparent}.fd-input-group--control .fd-input-group__button.is-expanded{background-color:#0854a0;background-color:var(--sapButton_Active_Background, #0854a0);color:#fff;color:var(--sapButton_Active_TextColor, #fff)}.fd-input-group--control .fd-input-group__button.is-expanded.is-focus,.fd-input-group--control .fd-input-group__button.is-expanded:focus{outline-offset:-.1875rem;outline-width:.0625rem;outline-width:var(--sapContent_FocusWidth, .0625rem);outline-color:#000;outline-color:var(--sapContent_FocusColor, #000);outline-style:dotted;outline-style:var(--sapContent_FocusStyle, dotted);outline-color:#fff;outline-color:var(--sapContent_ContrastFocusColor, #fff)}.fd-input-group--control.is-hover .fd-input-group__button,.fd-input-group--control:hover .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-hover .fd-input-group__button[dir=rtl],.fd-input-group--control:hover .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-hover .fd-input-group__button,[dir=rtl] .fd-input-group--control:hover .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button,.fd-input-group--control:active .fd-input-group__button{border-left:solid .0625rem transparent;border-left:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group--control.is-active .fd-input-group__button[dir=rtl],.fd-input-group--control:active .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group--control.is-active .fd-input-group__button,[dir=rtl] .fd-input-group--control:active .fd-input-group__button{border-left:none;border-right:solid .0625rem transparent;border-right:var(--fdInputGroup_ControlButton_SideBorder, solid var(--sapButton_BorderWidth, .0625rem) transparent)}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}fd-input-group .fd-input-group{margin:.25rem 0}fd-input-group .fd-input-group__addon--button.fd-input-group__addon--textarea>*{max-height:100%;height:100%}fd-input-group .fd-input-group__input,fd-input-group .fd-input-group__input:hover{background:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.ContentDensityService, decorators: [{
                     type: Optional
                 }] }, { type: Document, decorators: [{

package/fesm2020/fundamental-ngx-core-list.mjs

@@ -139,7 +139,11 @@ class ListItemComponent extends ListFocusItem {
     onClick(event) {
         this.clicked.emit(event);
         if (this.checkbox && !this.link) {
-            this.checkbox.nextValue();
+            if (!this.checkbox.elementRef.nativeElement.contains(event.target)) {
+                // clicking on the checkbox is not suppressed
+                // so we should only process clicks if clicked on the list-item, not checkbox itself
+                this.checkbox.nextValue();
+            }
         }
         if (this.radio && !this.link) {
             this.radio.labelClicked(event);