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

package/fesm2015/fundamental-ngx-core-avatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"fundamental-ngx-core-avatar.mjs","sources":["../../../../libs/core/src/lib/avatar/avatar.component.ts","../../../../libs/core/src/lib/avatar/avatar.component.html","../../../../libs/core/src/lib/avatar/avatar.module.ts","../../../../libs/core/src/lib/avatar/fundamental-ngx-core-avatar.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ElementRef,\n    HostBinding,\n    Input,\n    OnChanges,\n    OnInit,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport {\n    ANY_LANGUAGE_LETTERS_REGEX,\n    ColorAccent,\n    Size,\n    applyCssClass,\n    getRandomColorAccent,\n    CssClassBuilder\n} from '@fundamental-ngx/core/utils';\n\nlet avatarUniqueId = 0;\n\nconst ALTER_ICON_OPTIONS = {\n    CONTENT: 'content',\n    ALT: 'alt',\n    BACKUP: 'backup',\n    DEFAULT_ICON: 'default-icon'\n};\n\n@Component({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'fd-avatar',\n    templateUrl: './avatar.component.html',\n    styleUrls: ['./avatar.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class AvatarComponent implements OnChanges, OnInit, CssClassBuilder {\n    /** User's custom classes */\n    @Input()\n    class: string;\n\n    /** Id of the Avatar. */\n    @Input()\n    @HostBinding('attr.id')\n    id = `fd-avatar-${avatarUniqueId++}`;\n\n    /** Aria-label for Avatar. */\n    @Input()\n    @HostBinding('attr.aria-label')\n    ariaLabel: string = null;\n\n    /** Aria-Labelledby for element describing Avatar. */\n    @Input()\n    @HostBinding('attr.aria-labelledby')\n    ariaLabelledby: string = null;\n\n    /** Localized text for label */\n    @Input()\n    set label(value: string) {\n        this.ariaLabel = value || null;\n        this.abbreviate = this._getAbbreviate(value);\n    }\n\n    /** The size of the Avatar. Options include: *xs*, *s*, *m*, *l* and *xl*. */\n    @Input() size: Size = 'l';\n\n    /** The glyph name. */\n    @Input() glyph: string = null;\n\n    /** The glyph name for zoom icon. */\n    @Input() zoomGlyph: string = null;\n\n    /** Whether or not to apply a circle style to the Avatar. */\n    @Input() circle = false;\n\n    /** Whether or not to apply a transparent style to the Avatar. */\n    @Input() transparent = false;\n\n    /** Whether or not to apply background size contain style to the Avatar */\n    @Input() contain = false;\n\n    /** Whether or not to apply a placeholder background style to the Avatar. */\n    @Input() placeholder = false;\n\n    /** Whether or not to apply a tile background style to the Avatar. */\n    @Input() tile = false;\n\n    /** Whether or not to apply a border to the Avatar. */\n    @Input() border = false;\n\n    /** A number from 1 to 10 representing the background color of the Avatar. */\n    @Input() colorAccent: ColorAccent = null;\n\n    /** Whether or not to apply random background color to the Avatar. */\n    @Input() random = false;\n\n    /**\n     * @deprecated\n     * Deprecated according to Rename `backgroundImage` to `image`\n     * */\n    /** Background image url. */\n    @Input()\n    set backgroundImage(value: string) {\n        this._setImage(value);\n    }\n\n    /** Background image resource: url or base64. */\n    @Input()\n    set image(value: string) {\n        this._setImage(value);\n    }\n    get image(): string {\n        return this._image;\n    }\n\n    @Input()\n    set alterIcon(value: string) {\n        this._alterIcon = value;\n    }\n    get alterIcon(): string {\n        return this._alterIcon;\n    }\n\n    @Input()\n    set backupImage(value: string) {\n        this._backupImage = value;\n    }\n    get backupImage(): string {\n        return this._backupImage;\n    }\n\n    /** @hidden */\n    @HostBinding('style.background-image')\n    get bgImage(): string {\n        return this._bgImage;\n    }\n\n    /** @hidden */\n    @HostBinding('attr.role')\n    get role(): string {\n        return this.zoomGlyph ? 'button' : 'img';\n    }\n\n    /** @hidden */\n    @ViewChild('content')\n    set content(value: ElementRef) {\n        this._content = value;\n    }\n\n    /** @hidden */\n    abbreviate: string = null;\n\n    /** @hidden */\n    private _image: string = null;\n\n    /** @hidden */\n    private _alterIcon: string = null;\n\n    /** @hidden */\n    private _content: ElementRef = null;\n\n    /** @hidden */\n    private _backupImage: string = null;\n\n    /** @hidden */\n    private _bgImage: string = null;\n\n    /** If a default placeholder should be displayed */\n    get showDefault(): boolean {\n        return !this.abbreviate && !this._image && !this.glyph;\n    }\n\n    /** @hidden */\n    constructor(private _elementRef: ElementRef, private _cdr: ChangeDetectorRef) {}\n\n    /** @hidden */\n    ngOnInit(): void {\n        this.buildComponentCssClass();\n    }\n\n    /** @hidden */\n    ngOnChanges(): void {\n        this.buildComponentCssClass();\n    }\n\n    @applyCssClass\n    /** CssClassBuilder interface implementation\n     * function must return single string\n     * function is responsible for order which css classes are applied\n     */\n    buildComponentCssClass(): string[] {\n        return [\n            'fd-avatar',\n            this.size ? `fd-avatar--${this.size}` : '',\n            this.colorAccent && !this.random ? `fd-avatar--accent-color-${this.colorAccent}` : '',\n            this.random ? `fd-avatar--accent-color-${getRandomColorAccent()}` : '',\n            this.circle ? 'fd-avatar--circle' : '',\n            this.border ? 'fd-avatar--border' : '',\n            this.transparent ? 'fd-avatar--transparent' : '',\n            this.contain ? 'fd-avatar--background-contain' : '',\n            this.placeholder ? 'fd-avatar--placeholder' : '',\n            this.tile ? 'fd-avatar--tile' : '',\n            this.class\n        ];\n    }\n\n    /** @hidden */\n    elementRef(): ElementRef<any> {\n        return this._elementRef;\n    }\n\n    /** @hidden Get an abbreviate from the label or return null if not fit requirements */\n    private _getAbbreviate(label: string): string | null {\n        if (!label || this._image) {\n            return null;\n        }\n\n        const maxLettersCount = 3;\n        const firstLetters = label.split(' ').map((word) => word.charAt(0));\n        const abbreviate = firstLetters.join('');\n\n        if (firstLetters.length > maxLettersCount || !abbreviate.match(ANY_LANGUAGE_LETTERS_REGEX)) {\n            return null;\n        }\n\n        return abbreviate;\n    }\n\n    /** @hidden */\n    private _setImage(value: string): void {\n        this._image = value;\n\n        if (value) {\n            this._verifyImageUrl(value, (): void => {}, this._onErrorCallback);\n        } else {\n            this._bgImage = null;\n        }\n    }\n\n    /** @hidden */\n    private _verifyImageUrl(srcValue: string, onLoadCallback: () => void, onErrorCallback: () => void): void {\n        const img = new Image();\n        img.onload = onLoadCallback.bind(this);\n        img.onerror = onErrorCallback.bind(this);\n        img.src = srcValue;\n        this._assignBgImage(srcValue);\n    }\n\n    /** @hidden */\n    private _assignBgImage(srcValue: string): void {\n        this._bgImage = `url(${srcValue})`;\n    }\n\n    /** @hidden */\n    private _onErrorCallback(): void {\n        if (!this._alterIcon) {\n            this._showDefaultIcon();\n        } else {\n            const options = this._alterIcon.split('|');\n            for (let i = 0; i < options.length; i++) {\n                const option = options[i];\n\n                if (option === ALTER_ICON_OPTIONS.CONTENT) {\n                    const contentEl = this._content.nativeElement;\n                    const contentValue = contentEl.innerText.trim()[0];\n                    if (contentValue && contentValue !== '') {\n                        this.abbreviate = contentEl.innerText.trim()[0];\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.ALT) {\n                    const altValue = this.elementRef().nativeElement.getAttribute('alt');\n                    if (altValue && altValue !== '') {\n                        this.abbreviate = altValue.trim()[0];\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.BACKUP) {\n                    if (this._backupImage && this._backupImage !== '') {\n                        // Check if backupImage can be loaded successfully\n                        // If not, set default user icon\n                        this._verifyImageUrl(\n                            this._backupImage,\n                            () => {\n                                this._assignBgImage(this._backupImage);\n                                this._cdr.detectChanges();\n                            },\n                            () => {\n                                this._showDefaultIcon();\n                                this._cdr.detectChanges();\n                            }\n                        );\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.DEFAULT_ICON) {\n                    this._showDefaultIcon();\n                    break;\n                }\n\n                this._showDefaultIcon();\n            }\n        }\n\n        this._cdr.detectChanges();\n    }\n\n    /** @hidden */\n    private _showDefaultIcon(): void {\n        this.abbreviate = null;\n        this._image = null;\n        this.glyph = null;\n    }\n}\n","{{ abbreviate }}\n\n<i\n    *ngIf=\"zoomGlyph\"\n    role=\"presentation\"\n    class=\"fd-avatar__zoom-icon\"\n    [class]=\"zoomGlyph ? 'sap-icon--' + zoomGlyph : ''\"\n>\n</i>\n<i *ngIf=\"glyph\" class=\"fd-avatar__icon\" [class]=\"glyph ? ' sap-icon--' + glyph : ''\" role=\"presentation\"> </i>\n<i *ngIf=\"showDefault\" class=\"fd-avatar__icon sap-icon--person-placeholder\" role=\"presentation\"> </i>\n<div #content style=\"display: none\">\n    <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { AvatarComponent } from './avatar.component';\n\n@NgModule({\n    imports: [CommonModule],\n    exports: [AvatarComponent],\n    declarations: [AvatarComponent]\n})\nexport class AvatarModule {}\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-avatar.mjs","sources":["../../../../libs/core/src/lib/avatar/avatar.component.ts","../../../../libs/core/src/lib/avatar/avatar.component.html","../../../../libs/core/src/lib/avatar/avatar.module.ts","../../../../libs/core/src/lib/avatar/fundamental-ngx-core-avatar.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ElementRef,\n    HostBinding,\n    Input,\n    OnChanges,\n    OnInit,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport {\n    ANY_LANGUAGE_LETTERS_REGEX,\n    ColorAccent,\n    Size,\n    applyCssClass,\n    getRandomColorAccent,\n    CssClassBuilder\n} from '@fundamental-ngx/core/utils';\n\nlet avatarUniqueId = 0;\n\nconst ALTER_ICON_OPTIONS = {\n    CONTENT: 'content',\n    ALT: 'alt',\n    BACKUP: 'backup',\n    DEFAULT_ICON: 'default-icon'\n};\n\n@Component({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'fd-avatar',\n    templateUrl: './avatar.component.html',\n    styleUrls: ['./avatar.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class AvatarComponent implements OnChanges, OnInit, CssClassBuilder {\n    /** User's custom classes */\n    @Input()\n    class: string;\n\n    /** Id of the Avatar. */\n    @Input()\n    @HostBinding('attr.id')\n    id = `fd-avatar-${avatarUniqueId++}`;\n\n    /** Aria-label for Avatar. */\n    @Input()\n    @HostBinding('attr.aria-label')\n    ariaLabel: string = null;\n\n    /** Aria-Labelledby for element describing Avatar. */\n    @Input()\n    @HostBinding('attr.aria-labelledby')\n    ariaLabelledby: string = null;\n\n    /** Localized text for label */\n    @Input()\n    set label(value: string) {\n        this.ariaLabel = value || null;\n        this.abbreviate = this._getAbbreviate(value);\n    }\n\n    /** The size of the Avatar. Options include: *xs*, *s*, *m*, *l* and *xl*. */\n    @Input() size: Size = 'l';\n\n    /** The glyph name. */\n    @Input() glyph: string = null;\n\n    /** The glyph name for zoom icon. */\n    @Input() zoomGlyph: string = null;\n\n    /** Whether or not to apply a circle style to the Avatar. */\n    @Input() circle = false;\n\n    /** Whether or not to apply a transparent style to the Avatar. */\n    @Input() transparent = false;\n\n    /** Whether or not to apply background size contain style to the Avatar */\n    @Input() contain = false;\n\n    /** Whether or not to apply a placeholder background style to the Avatar. */\n    @Input() placeholder = false;\n\n    /** Whether or not to apply a tile background style to the Avatar. */\n    @Input() tile = false;\n\n    /** Whether or not to apply a border to the Avatar. */\n    @Input() border = false;\n\n    /** A number from 1 to 10 representing the background color of the Avatar. */\n    @Input() colorAccent: ColorAccent = null;\n\n    /** Whether or not to apply random background color to the Avatar. */\n    @Input() random = false;\n\n    /**\n     * @deprecated\n     * Deprecated according to Rename `backgroundImage` to `image`\n     * */\n    /** Background image url. */\n    @Input()\n    set backgroundImage(value: string) {\n        this._setImage(value);\n    }\n\n    /** Background image resource: url or base64. */\n    @Input()\n    set image(value: string) {\n        this._setImage(value);\n    }\n    get image(): string {\n        return this._image;\n    }\n\n    @Input()\n    set alterIcon(value: string) {\n        this._alterIcon = value;\n    }\n    get alterIcon(): string {\n        return this._alterIcon;\n    }\n\n    @Input()\n    set backupImage(value: string) {\n        this._backupImage = value;\n    }\n    get backupImage(): string {\n        return this._backupImage;\n    }\n\n    /** @hidden */\n    @HostBinding('style.background-image')\n    get bgImage(): string {\n        return this._bgImage;\n    }\n\n    /** @hidden */\n    @HostBinding('attr.role')\n    get role(): string {\n        return this.zoomGlyph ? 'button' : 'img';\n    }\n\n    /** @hidden */\n    @ViewChild('content')\n    set content(value: ElementRef) {\n        this._content = value;\n    }\n\n    /** @hidden */\n    abbreviate: string = null;\n\n    /** @hidden */\n    private _image: string = null;\n\n    /** @hidden */\n    private _alterIcon: string = null;\n\n    /** @hidden */\n    private _content: ElementRef = null;\n\n    /** @hidden */\n    private _backupImage: string = null;\n\n    /** @hidden */\n    private _bgImage: string = null;\n\n    /** If a default placeholder should be displayed */\n    get showDefault(): boolean {\n        return !this.abbreviate && !this._image && !this.glyph;\n    }\n\n    /** @hidden */\n    constructor(private _elementRef: ElementRef, private _cdr: ChangeDetectorRef) {}\n\n    /** @hidden */\n    ngOnInit(): void {\n        this.buildComponentCssClass();\n    }\n\n    /** @hidden */\n    ngOnChanges(): void {\n        this.buildComponentCssClass();\n    }\n\n    @applyCssClass\n    /** CssClassBuilder interface implementation\n     * function must return single string\n     * function is responsible for order which css classes are applied\n     */\n    buildComponentCssClass(): string[] {\n        return [\n            'fd-avatar',\n            this.size ? `fd-avatar--${this.size}` : '',\n            this.colorAccent && !this.random ? `fd-avatar--accent-color-${this.colorAccent}` : '',\n            this.random ? `fd-avatar--accent-color-${getRandomColorAccent()}` : '',\n            this.circle ? 'fd-avatar--circle' : '',\n            this.border ? 'fd-avatar--border' : '',\n            this.transparent ? 'fd-avatar--transparent' : '',\n            this.contain ? 'fd-avatar--background-contain' : '',\n            this.placeholder ? 'fd-avatar--placeholder' : '',\n            this.tile ? 'fd-avatar--tile' : '',\n            this.class\n        ];\n    }\n\n    /** @hidden */\n    elementRef(): ElementRef<any> {\n        return this._elementRef;\n    }\n\n    /** @hidden Get an abbreviate from the label or return null if not fit requirements */\n    private _getAbbreviate(label: string): string | null {\n        if (!label || this._image) {\n            return null;\n        }\n\n        return this._generateAbbreviation(label);\n    }\n\n    /** @hidden Get the abbrevation string */\n    private _generateAbbreviation(label: string): string | null {\n        const maxLettersCount = 3;\n        const firstLetters = label.split(' ').map((word) => word.charAt(0));\n        const abbreviate = firstLetters.join('');\n\n        if (firstLetters.length > maxLettersCount || !abbreviate.match(ANY_LANGUAGE_LETTERS_REGEX)) {\n            return null;\n        }\n\n        return abbreviate;\n    }\n\n    /** @hidden */\n    private _setImage(value: string): void {\n        this._image = value;\n\n        if (value) {\n            this._verifyImageUrl(value, (): void => {}, this._onErrorCallback);\n        } else {\n            this._bgImage = null;\n        }\n    }\n\n    /** @hidden */\n    private _verifyImageUrl(srcValue: string, onLoadCallback: () => void, onErrorCallback: () => void): void {\n        const img = new Image();\n        img.onload = onLoadCallback.bind(this);\n        img.onerror = onErrorCallback.bind(this);\n        img.src = srcValue;\n        this._assignBgImage(srcValue);\n    }\n\n    /** @hidden */\n    private _assignBgImage(srcValue: string): void {\n        this._bgImage = `url(${srcValue})`;\n    }\n\n    /** @hidden */\n    private _onErrorCallback(): void {\n        if (!this._alterIcon) {\n            this._showDefaultIcon();\n        } else {\n            const options = this._alterIcon.split('|');\n            for (let i = 0; i < options.length; i++) {\n                const option = options[i];\n\n                if (option === ALTER_ICON_OPTIONS.CONTENT) {\n                    const contentValue = this._content.nativeElement.innerText;\n                    if (contentValue && contentValue !== '') {\n                        this.abbreviate = this._generateAbbreviation(contentValue);\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.ALT) {\n                    const altValue = this.elementRef().nativeElement.getAttribute('alt');\n                    if (altValue && altValue !== '') {\n                        this.abbreviate = this._generateAbbreviation(altValue);\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.BACKUP) {\n                    if (this._backupImage && this._backupImage !== '') {\n                        // Check if backupImage can be loaded successfully\n                        // If not, set default user icon\n                        this._verifyImageUrl(\n                            this._backupImage,\n                            () => {\n                                this._assignBgImage(this._backupImage);\n                                this._cdr.detectChanges();\n                            },\n                            () => {\n                                this._showDefaultIcon();\n                                this._cdr.detectChanges();\n                            }\n                        );\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.DEFAULT_ICON) {\n                    this._showDefaultIcon();\n                    break;\n                }\n\n                this._showDefaultIcon();\n            }\n        }\n\n        this._cdr.detectChanges();\n    }\n\n    /** @hidden */\n    private _showDefaultIcon(): void {\n        this.abbreviate = null;\n        this._image = null;\n        this.glyph = null;\n    }\n}\n","{{ abbreviate }}\n\n<i\n    *ngIf=\"zoomGlyph\"\n    role=\"presentation\"\n    class=\"fd-avatar__zoom-icon\"\n    [class]=\"zoomGlyph ? 'sap-icon--' + zoomGlyph : ''\"\n>\n</i>\n<i *ngIf=\"glyph\" class=\"fd-avatar__icon\" [class]=\"glyph ? ' sap-icon--' + glyph : ''\" role=\"presentation\"> </i>\n<i *ngIf=\"showDefault\" class=\"fd-avatar__icon sap-icon--person-placeholder\" role=\"presentation\"> </i>\n<div #content style=\"display: none\">\n    <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { AvatarComponent } from './avatar.component';\n\n@NgModule({\n    imports: [CommonModule],\n    exports: [AvatarComponent],\n    declarations: [AvatarComponent]\n})\nexport class AvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

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

@@ -367,7 +367,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: [
@@ -376,7 +376,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

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

@@ -142,6 +142,10 @@ class AvatarComponent {
         if (!label || this._image) {
             return null;
         }
+        return this._generateAbbreviation(label);
+    }
+    /** @hidden Get the abbrevation string */
+    _generateAbbreviation(label) {
         const maxLettersCount = 3;
         const firstLetters = label.split(' ').map((word) => word.charAt(0));
         const abbreviate = firstLetters.join('');
@@ -182,10 +186,9 @@ class AvatarComponent {
             for (let i = 0; i < options.length; i++) {
                 const option = options[i];
                 if (option === ALTER_ICON_OPTIONS.CONTENT) {
-                    const contentEl = this._content.nativeElement;
-                    const contentValue = contentEl.innerText.trim()[0];
+                    const contentValue = this._content.nativeElement.innerText;
                     if (contentValue && contentValue !== '') {
-                        this.abbreviate = contentEl.innerText.trim()[0];
+                        this.abbreviate = this._generateAbbreviation(contentValue);
                         break;
                     }
                     continue;
@@ -193,7 +196,7 @@ class AvatarComponent {
                 if (option === ALTER_ICON_OPTIONS.ALT) {
                     const altValue = this.elementRef().nativeElement.getAttribute('alt');
                     if (altValue && altValue !== '') {
-                        this.abbreviate = altValue.trim()[0];
+                        this.abbreviate = this._generateAbbreviation(altValue);
                         break;
                     }
                     continue;

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

@@ -1 +1 @@
-{"version":3,"file":"fundamental-ngx-core-avatar.mjs","sources":["../../../../libs/core/src/lib/avatar/avatar.component.ts","../../../../libs/core/src/lib/avatar/avatar.component.html","../../../../libs/core/src/lib/avatar/avatar.module.ts","../../../../libs/core/src/lib/avatar/fundamental-ngx-core-avatar.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ElementRef,\n    HostBinding,\n    Input,\n    OnChanges,\n    OnInit,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport {\n    ANY_LANGUAGE_LETTERS_REGEX,\n    ColorAccent,\n    Size,\n    applyCssClass,\n    getRandomColorAccent,\n    CssClassBuilder\n} from '@fundamental-ngx/core/utils';\n\nlet avatarUniqueId = 0;\n\nconst ALTER_ICON_OPTIONS = {\n    CONTENT: 'content',\n    ALT: 'alt',\n    BACKUP: 'backup',\n    DEFAULT_ICON: 'default-icon'\n};\n\n@Component({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'fd-avatar',\n    templateUrl: './avatar.component.html',\n    styleUrls: ['./avatar.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class AvatarComponent implements OnChanges, OnInit, CssClassBuilder {\n    /** User's custom classes */\n    @Input()\n    class: string;\n\n    /** Id of the Avatar. */\n    @Input()\n    @HostBinding('attr.id')\n    id = `fd-avatar-${avatarUniqueId++}`;\n\n    /** Aria-label for Avatar. */\n    @Input()\n    @HostBinding('attr.aria-label')\n    ariaLabel: string = null;\n\n    /** Aria-Labelledby for element describing Avatar. */\n    @Input()\n    @HostBinding('attr.aria-labelledby')\n    ariaLabelledby: string = null;\n\n    /** Localized text for label */\n    @Input()\n    set label(value: string) {\n        this.ariaLabel = value || null;\n        this.abbreviate = this._getAbbreviate(value);\n    }\n\n    /** The size of the Avatar. Options include: *xs*, *s*, *m*, *l* and *xl*. */\n    @Input() size: Size = 'l';\n\n    /** The glyph name. */\n    @Input() glyph: string = null;\n\n    /** The glyph name for zoom icon. */\n    @Input() zoomGlyph: string = null;\n\n    /** Whether or not to apply a circle style to the Avatar. */\n    @Input() circle = false;\n\n    /** Whether or not to apply a transparent style to the Avatar. */\n    @Input() transparent = false;\n\n    /** Whether or not to apply background size contain style to the Avatar */\n    @Input() contain = false;\n\n    /** Whether or not to apply a placeholder background style to the Avatar. */\n    @Input() placeholder = false;\n\n    /** Whether or not to apply a tile background style to the Avatar. */\n    @Input() tile = false;\n\n    /** Whether or not to apply a border to the Avatar. */\n    @Input() border = false;\n\n    /** A number from 1 to 10 representing the background color of the Avatar. */\n    @Input() colorAccent: ColorAccent = null;\n\n    /** Whether or not to apply random background color to the Avatar. */\n    @Input() random = false;\n\n    /**\n     * @deprecated\n     * Deprecated according to Rename `backgroundImage` to `image`\n     * */\n    /** Background image url. */\n    @Input()\n    set backgroundImage(value: string) {\n        this._setImage(value);\n    }\n\n    /** Background image resource: url or base64. */\n    @Input()\n    set image(value: string) {\n        this._setImage(value);\n    }\n    get image(): string {\n        return this._image;\n    }\n\n    @Input()\n    set alterIcon(value: string) {\n        this._alterIcon = value;\n    }\n    get alterIcon(): string {\n        return this._alterIcon;\n    }\n\n    @Input()\n    set backupImage(value: string) {\n        this._backupImage = value;\n    }\n    get backupImage(): string {\n        return this._backupImage;\n    }\n\n    /** @hidden */\n    @HostBinding('style.background-image')\n    get bgImage(): string {\n        return this._bgImage;\n    }\n\n    /** @hidden */\n    @HostBinding('attr.role')\n    get role(): string {\n        return this.zoomGlyph ? 'button' : 'img';\n    }\n\n    /** @hidden */\n    @ViewChild('content')\n    set content(value: ElementRef) {\n        this._content = value;\n    }\n\n    /** @hidden */\n    abbreviate: string = null;\n\n    /** @hidden */\n    private _image: string = null;\n\n    /** @hidden */\n    private _alterIcon: string = null;\n\n    /** @hidden */\n    private _content: ElementRef = null;\n\n    /** @hidden */\n    private _backupImage: string = null;\n\n    /** @hidden */\n    private _bgImage: string = null;\n\n    /** If a default placeholder should be displayed */\n    get showDefault(): boolean {\n        return !this.abbreviate && !this._image && !this.glyph;\n    }\n\n    /** @hidden */\n    constructor(private _elementRef: ElementRef, private _cdr: ChangeDetectorRef) {}\n\n    /** @hidden */\n    ngOnInit(): void {\n        this.buildComponentCssClass();\n    }\n\n    /** @hidden */\n    ngOnChanges(): void {\n        this.buildComponentCssClass();\n    }\n\n    @applyCssClass\n    /** CssClassBuilder interface implementation\n     * function must return single string\n     * function is responsible for order which css classes are applied\n     */\n    buildComponentCssClass(): string[] {\n        return [\n            'fd-avatar',\n            this.size ? `fd-avatar--${this.size}` : '',\n            this.colorAccent && !this.random ? `fd-avatar--accent-color-${this.colorAccent}` : '',\n            this.random ? `fd-avatar--accent-color-${getRandomColorAccent()}` : '',\n            this.circle ? 'fd-avatar--circle' : '',\n            this.border ? 'fd-avatar--border' : '',\n            this.transparent ? 'fd-avatar--transparent' : '',\n            this.contain ? 'fd-avatar--background-contain' : '',\n            this.placeholder ? 'fd-avatar--placeholder' : '',\n            this.tile ? 'fd-avatar--tile' : '',\n            this.class\n        ];\n    }\n\n    /** @hidden */\n    elementRef(): ElementRef<any> {\n        return this._elementRef;\n    }\n\n    /** @hidden Get an abbreviate from the label or return null if not fit requirements */\n    private _getAbbreviate(label: string): string | null {\n        if (!label || this._image) {\n            return null;\n        }\n\n        const maxLettersCount = 3;\n        const firstLetters = label.split(' ').map((word) => word.charAt(0));\n        const abbreviate = firstLetters.join('');\n\n        if (firstLetters.length > maxLettersCount || !abbreviate.match(ANY_LANGUAGE_LETTERS_REGEX)) {\n            return null;\n        }\n\n        return abbreviate;\n    }\n\n    /** @hidden */\n    private _setImage(value: string): void {\n        this._image = value;\n\n        if (value) {\n            this._verifyImageUrl(value, (): void => {}, this._onErrorCallback);\n        } else {\n            this._bgImage = null;\n        }\n    }\n\n    /** @hidden */\n    private _verifyImageUrl(srcValue: string, onLoadCallback: () => void, onErrorCallback: () => void): void {\n        const img = new Image();\n        img.onload = onLoadCallback.bind(this);\n        img.onerror = onErrorCallback.bind(this);\n        img.src = srcValue;\n        this._assignBgImage(srcValue);\n    }\n\n    /** @hidden */\n    private _assignBgImage(srcValue: string): void {\n        this._bgImage = `url(${srcValue})`;\n    }\n\n    /** @hidden */\n    private _onErrorCallback(): void {\n        if (!this._alterIcon) {\n            this._showDefaultIcon();\n        } else {\n            const options = this._alterIcon.split('|');\n            for (let i = 0; i < options.length; i++) {\n                const option = options[i];\n\n                if (option === ALTER_ICON_OPTIONS.CONTENT) {\n                    const contentEl = this._content.nativeElement;\n                    const contentValue = contentEl.innerText.trim()[0];\n                    if (contentValue && contentValue !== '') {\n                        this.abbreviate = contentEl.innerText.trim()[0];\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.ALT) {\n                    const altValue = this.elementRef().nativeElement.getAttribute('alt');\n                    if (altValue && altValue !== '') {\n                        this.abbreviate = altValue.trim()[0];\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.BACKUP) {\n                    if (this._backupImage && this._backupImage !== '') {\n                        // Check if backupImage can be loaded successfully\n                        // If not, set default user icon\n                        this._verifyImageUrl(\n                            this._backupImage,\n                            () => {\n                                this._assignBgImage(this._backupImage);\n                                this._cdr.detectChanges();\n                            },\n                            () => {\n                                this._showDefaultIcon();\n                                this._cdr.detectChanges();\n                            }\n                        );\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.DEFAULT_ICON) {\n                    this._showDefaultIcon();\n                    break;\n                }\n\n                this._showDefaultIcon();\n            }\n        }\n\n        this._cdr.detectChanges();\n    }\n\n    /** @hidden */\n    private _showDefaultIcon(): void {\n        this.abbreviate = null;\n        this._image = null;\n        this.glyph = null;\n    }\n}\n","{{ abbreviate }}\n\n<i\n    *ngIf=\"zoomGlyph\"\n    role=\"presentation\"\n    class=\"fd-avatar__zoom-icon\"\n    [class]=\"zoomGlyph ? 'sap-icon--' + zoomGlyph : ''\"\n>\n</i>\n<i *ngIf=\"glyph\" class=\"fd-avatar__icon\" [class]=\"glyph ? ' sap-icon--' + glyph : ''\" role=\"presentation\"> </i>\n<i *ngIf=\"showDefault\" class=\"fd-avatar__icon sap-icon--person-placeholder\" role=\"presentation\"> </i>\n<div #content style=\"display: none\">\n    <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { AvatarComponent } from './avatar.component';\n\n@NgModule({\n    imports: [CommonModule],\n    exports: [AvatarComponent],\n    declarations: [AvatarComponent]\n})\nexport class AvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;AAqBA,IAAI,cAAc,GAAG,CAAC,CAAC;AAEvB,MAAM,kBAAkB,GAAG;IACvB,OAAO,EAAE,SAAS;IAClB,GAAG,EAAE,KAAK;IACV,MAAM,EAAE,QAAQ;IAChB,YAAY,EAAE,cAAc;CAC/B,CAAC;MAWW,eAAe;;IAyIxB,YAAoB,WAAuB,EAAU,IAAuB;QAAxD,gBAAW,GAAX,WAAW,CAAY;QAAU,SAAI,GAAJ,IAAI,CAAmB;;QAjI5E,OAAE,GAAG,aAAa,cAAc,EAAE,EAAE,CAAC;;QAKrC,cAAS,GAAW,IAAI,CAAC;;QAKzB,mBAAc,GAAW,IAAI,CAAC;;QAUrB,SAAI,GAAS,GAAG,CAAC;;QAGjB,UAAK,GAAW,IAAI,CAAC;;QAGrB,cAAS,GAAW,IAAI,CAAC;;QAGzB,WAAM,GAAG,KAAK,CAAC;;QAGf,gBAAW,GAAG,KAAK,CAAC;;QAGpB,YAAO,GAAG,KAAK,CAAC;;QAGhB,gBAAW,GAAG,KAAK,CAAC;;QAGpB,SAAI,GAAG,KAAK,CAAC;;QAGb,WAAM,GAAG,KAAK,CAAC;;QAGf,gBAAW,GAAgB,IAAI,CAAC;;QAGhC,WAAM,GAAG,KAAK,CAAC;;QAwDxB,eAAU,GAAW,IAAI,CAAC;;QAGlB,WAAM,GAAW,IAAI,CAAC;;QAGtB,eAAU,GAAW,IAAI,CAAC;;QAG1B,aAAQ,GAAe,IAAI,CAAC;;QAG5B,iBAAY,GAAW,IAAI,CAAC;;QAG5B,aAAQ,GAAW,IAAI,CAAC;KAQgD;;IApHhF,IACI,KAAK,CAAC,KAAa;QACnB,IAAI,CAAC,SAAS,GAAG,KAAK,IAAI,IAAI,CAAC;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;KAChD;;;;;;IAwCD,IACI,eAAe,CAAC,KAAa;QAC7B,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;KACzB;;IAGD,IACI,KAAK,CAAC,KAAa;QACnB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;KACzB;IACD,IAAI,KAAK;QACL,OAAO,IAAI,CAAC,MAAM,CAAC;KACtB;IAED,IACI,SAAS,CAAC,KAAa;QACvB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;KAC3B;IACD,IAAI,SAAS;QACT,OAAO,IAAI,CAAC,UAAU,CAAC;KAC1B;IAED,IACI,WAAW,CAAC,KAAa;QACzB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;KAC7B;IACD,IAAI,WAAW;QACX,OAAO,IAAI,CAAC,YAAY,CAAC;KAC5B;;IAGD,IACI,OAAO;QACP,OAAO,IAAI,CAAC,QAAQ,CAAC;KACxB;;IAGD,IACI,IAAI;QACJ,OAAO,IAAI,CAAC,SAAS,GAAG,QAAQ,GAAG,KAAK,CAAC;KAC5C;;IAGD,IACI,OAAO,CAAC,KAAiB;QACzB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;KACzB;;IAqBD,IAAI,WAAW;QACX,OAAO,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;KAC1D;;IAMD,QAAQ;QACJ,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;IAGD,WAAW;QACP,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;;;;IAOD,sBAAsB;QAClB,OAAO;YACH,WAAW;YACX,IAAI,CAAC,IAAI,GAAG,cAAc,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE;YAC1C,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,2BAA2B,IAAI,CAAC,WAAW,EAAE,GAAG,EAAE;YACrF,IAAI,CAAC,MAAM,GAAG,2BAA2B,oBAAoB,EAAE,EAAE,GAAG,EAAE;YACtE,IAAI,CAAC,MAAM,GAAG,mBAAmB,GAAG,EAAE;YACtC,IAAI,CAAC,MAAM,GAAG,mBAAmB,GAAG,EAAE;YACtC,IAAI,CAAC,WAAW,GAAG,wBAAwB,GAAG,EAAE;YAChD,IAAI,CAAC,OAAO,GAAG,+BAA+B,GAAG,EAAE;YACnD,IAAI,CAAC,WAAW,GAAG,wBAAwB,GAAG,EAAE;YAChD,IAAI,CAAC,IAAI,GAAG,iBAAiB,GAAG,EAAE;YAClC,IAAI,CAAC,KAAK;SACb,CAAC;KACL;;IAGD,UAAU;QACN,OAAO,IAAI,CAAC,WAAW,CAAC;KAC3B;;IAGO,cAAc,CAAC,KAAa;QAChC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,MAAM,EAAE;YACvB,OAAO,IAAI,CAAC;SACf;QAED,MAAM,eAAe,GAAG,CAAC,CAAC;QAC1B,MAAM,YAAY,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;QACpE,MAAM,UAAU,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAEzC,IAAI,YAAY,CAAC,MAAM,GAAG,eAAe,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,0BAA0B,CAAC,EAAE;YACxF,OAAO,IAAI,CAAC;SACf;QAED,OAAO,UAAU,CAAC;KACrB;;IAGO,SAAS,CAAC,KAAa;QAC3B,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QAEpB,IAAI,KAAK,EAAE;YACP,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,SAAc,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;SACtE;aAAM;YACH,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACxB;KACJ;;IAGO,eAAe,CAAC,QAAgB,EAAE,cAA0B,EAAE,eAA2B;QAC7F,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC;QACxB,GAAG,CAAC,MAAM,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACvC,GAAG,CAAC,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzC,GAAG,CAAC,GAAG,GAAG,QAAQ,CAAC;QACnB,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;KACjC;;IAGO,cAAc,CAAC,QAAgB;QACnC,IAAI,CAAC,QAAQ,GAAG,OAAO,QAAQ,GAAG,CAAC;KACtC;;IAGO,gBAAgB;QACpB,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;YAClB,IAAI,CAAC,gBAAgB,EAAE,CAAC;SAC3B;aAAM;YACH,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAC3C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBACrC,MAAM,MAAM,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;gBAE1B,IAAI,MAAM,KAAK,kBAAkB,CAAC,OAAO,EAAE;oBACvC,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC;oBAC9C,MAAM,YAAY,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;oBACnD,IAAI,YAAY,IAAI,YAAY,KAAK,EAAE,EAAE;wBACrC,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;wBAChD,MAAM;qBACT;oBAED,SAAS;iBACZ;gBAED,IAAI,MAAM,KAAK,kBAAkB,CAAC,GAAG,EAAE;oBACnC,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;oBACrE,IAAI,QAAQ,IAAI,QAAQ,KAAK,EAAE,EAAE;wBAC7B,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;wBACrC,MAAM;qBACT;oBAED,SAAS;iBACZ;gBAED,IAAI,MAAM,KAAK,kBAAkB,CAAC,MAAM,EAAE;oBACtC,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,KAAK,EAAE,EAAE;;;wBAG/C,IAAI,CAAC,eAAe,CAChB,IAAI,CAAC,YAAY,EACjB;4BACI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;4BACvC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;yBAC7B,EACD;4BACI,IAAI,CAAC,gBAAgB,EAAE,CAAC;4BACxB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;yBAC7B,CACJ,CAAC;wBACF,MAAM;qBACT;oBAED,SAAS;iBACZ;gBAED,IAAI,MAAM,KAAK,kBAAkB,CAAC,YAAY,EAAE;oBAC5C,IAAI,CAAC,gBAAgB,EAAE,CAAC;oBACxB,MAAM;iBACT;gBAED,IAAI,CAAC,gBAAgB,EAAE,CAAC;aAC3B;SACJ;QAED,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;KAC7B;;IAGO,gBAAgB;QACpB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QACnB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;KACrB;;4GA7RQ,eAAe;gGAAf,eAAe,4yBCvC5B,2eAcA;ADmLI;IALC,aAAa;;;;6DAmBb;2FAxKQ,eAAe;kBAT3B,SAAS;+BAGI,WAAW,iBAGN,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM;iIAK/C,KAAK;sBADJ,KAAK;gBAMN,EAAE;sBAFD,KAAK;;sBACL,WAAW;uBAAC,SAAS;gBAMtB,SAAS;sBAFR,KAAK;;sBACL,WAAW;uBAAC,iBAAiB;gBAM9B,cAAc;sBAFb,KAAK;;sBACL,WAAW;uBAAC,sBAAsB;gBAK/B,KAAK;sBADR,KAAK;gBAOG,IAAI;sBAAZ,KAAK;gBAGG,KAAK;sBAAb,KAAK;gBAGG,SAAS;sBAAjB,KAAK;gBAGG,MAAM;sBAAd,KAAK;gBAGG,WAAW;sBAAnB,KAAK;gBAGG,OAAO;sBAAf,KAAK;gBAGG,WAAW;sBAAnB,KAAK;gBAGG,IAAI;sBAAZ,KAAK;gBAGG,MAAM;sBAAd,KAAK;gBAGG,WAAW;sBAAnB,KAAK;gBAGG,MAAM;sBAAd,KAAK;gBAQF,eAAe;sBADlB,KAAK;gBAOF,KAAK;sBADR,KAAK;gBASF,SAAS;sBADZ,KAAK;gBASF,WAAW;sBADd,KAAK;gBAUF,OAAO;sBADV,WAAW;uBAAC,wBAAwB;gBAOjC,IAAI;sBADP,WAAW;uBAAC,WAAW;gBAOpB,OAAO;sBADV,SAAS;uBAAC,SAAS;;;;;;QA8CpB,sBAAsB;;MEvLb,YAAY;;yGAAZ,YAAY;0GAAZ,YAAY,iBAFN,eAAe,aAFpB,YAAY,aACZ,eAAe;0GAGhB,YAAY,YAJZ,CAAC,YAAY,CAAC;2FAId,YAAY;kBALxB,QAAQ;mBAAC;oBACN,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,eAAe,CAAC;oBAC1B,YAAY,EAAE,CAAC,eAAe,CAAC;iBAClC;;;ACTD;;;;;;"}
+{"version":3,"file":"fundamental-ngx-core-avatar.mjs","sources":["../../../../libs/core/src/lib/avatar/avatar.component.ts","../../../../libs/core/src/lib/avatar/avatar.component.html","../../../../libs/core/src/lib/avatar/avatar.module.ts","../../../../libs/core/src/lib/avatar/fundamental-ngx-core-avatar.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ElementRef,\n    HostBinding,\n    Input,\n    OnChanges,\n    OnInit,\n    ViewChild,\n    ViewEncapsulation\n} from '@angular/core';\nimport {\n    ANY_LANGUAGE_LETTERS_REGEX,\n    ColorAccent,\n    Size,\n    applyCssClass,\n    getRandomColorAccent,\n    CssClassBuilder\n} from '@fundamental-ngx/core/utils';\n\nlet avatarUniqueId = 0;\n\nconst ALTER_ICON_OPTIONS = {\n    CONTENT: 'content',\n    ALT: 'alt',\n    BACKUP: 'backup',\n    DEFAULT_ICON: 'default-icon'\n};\n\n@Component({\n    // TODO to be discussed\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'fd-avatar',\n    templateUrl: './avatar.component.html',\n    styleUrls: ['./avatar.component.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class AvatarComponent implements OnChanges, OnInit, CssClassBuilder {\n    /** User's custom classes */\n    @Input()\n    class: string;\n\n    /** Id of the Avatar. */\n    @Input()\n    @HostBinding('attr.id')\n    id = `fd-avatar-${avatarUniqueId++}`;\n\n    /** Aria-label for Avatar. */\n    @Input()\n    @HostBinding('attr.aria-label')\n    ariaLabel: string = null;\n\n    /** Aria-Labelledby for element describing Avatar. */\n    @Input()\n    @HostBinding('attr.aria-labelledby')\n    ariaLabelledby: string = null;\n\n    /** Localized text for label */\n    @Input()\n    set label(value: string) {\n        this.ariaLabel = value || null;\n        this.abbreviate = this._getAbbreviate(value);\n    }\n\n    /** The size of the Avatar. Options include: *xs*, *s*, *m*, *l* and *xl*. */\n    @Input() size: Size = 'l';\n\n    /** The glyph name. */\n    @Input() glyph: string = null;\n\n    /** The glyph name for zoom icon. */\n    @Input() zoomGlyph: string = null;\n\n    /** Whether or not to apply a circle style to the Avatar. */\n    @Input() circle = false;\n\n    /** Whether or not to apply a transparent style to the Avatar. */\n    @Input() transparent = false;\n\n    /** Whether or not to apply background size contain style to the Avatar */\n    @Input() contain = false;\n\n    /** Whether or not to apply a placeholder background style to the Avatar. */\n    @Input() placeholder = false;\n\n    /** Whether or not to apply a tile background style to the Avatar. */\n    @Input() tile = false;\n\n    /** Whether or not to apply a border to the Avatar. */\n    @Input() border = false;\n\n    /** A number from 1 to 10 representing the background color of the Avatar. */\n    @Input() colorAccent: ColorAccent = null;\n\n    /** Whether or not to apply random background color to the Avatar. */\n    @Input() random = false;\n\n    /**\n     * @deprecated\n     * Deprecated according to Rename `backgroundImage` to `image`\n     * */\n    /** Background image url. */\n    @Input()\n    set backgroundImage(value: string) {\n        this._setImage(value);\n    }\n\n    /** Background image resource: url or base64. */\n    @Input()\n    set image(value: string) {\n        this._setImage(value);\n    }\n    get image(): string {\n        return this._image;\n    }\n\n    @Input()\n    set alterIcon(value: string) {\n        this._alterIcon = value;\n    }\n    get alterIcon(): string {\n        return this._alterIcon;\n    }\n\n    @Input()\n    set backupImage(value: string) {\n        this._backupImage = value;\n    }\n    get backupImage(): string {\n        return this._backupImage;\n    }\n\n    /** @hidden */\n    @HostBinding('style.background-image')\n    get bgImage(): string {\n        return this._bgImage;\n    }\n\n    /** @hidden */\n    @HostBinding('attr.role')\n    get role(): string {\n        return this.zoomGlyph ? 'button' : 'img';\n    }\n\n    /** @hidden */\n    @ViewChild('content')\n    set content(value: ElementRef) {\n        this._content = value;\n    }\n\n    /** @hidden */\n    abbreviate: string = null;\n\n    /** @hidden */\n    private _image: string = null;\n\n    /** @hidden */\n    private _alterIcon: string = null;\n\n    /** @hidden */\n    private _content: ElementRef = null;\n\n    /** @hidden */\n    private _backupImage: string = null;\n\n    /** @hidden */\n    private _bgImage: string = null;\n\n    /** If a default placeholder should be displayed */\n    get showDefault(): boolean {\n        return !this.abbreviate && !this._image && !this.glyph;\n    }\n\n    /** @hidden */\n    constructor(private _elementRef: ElementRef, private _cdr: ChangeDetectorRef) {}\n\n    /** @hidden */\n    ngOnInit(): void {\n        this.buildComponentCssClass();\n    }\n\n    /** @hidden */\n    ngOnChanges(): void {\n        this.buildComponentCssClass();\n    }\n\n    @applyCssClass\n    /** CssClassBuilder interface implementation\n     * function must return single string\n     * function is responsible for order which css classes are applied\n     */\n    buildComponentCssClass(): string[] {\n        return [\n            'fd-avatar',\n            this.size ? `fd-avatar--${this.size}` : '',\n            this.colorAccent && !this.random ? `fd-avatar--accent-color-${this.colorAccent}` : '',\n            this.random ? `fd-avatar--accent-color-${getRandomColorAccent()}` : '',\n            this.circle ? 'fd-avatar--circle' : '',\n            this.border ? 'fd-avatar--border' : '',\n            this.transparent ? 'fd-avatar--transparent' : '',\n            this.contain ? 'fd-avatar--background-contain' : '',\n            this.placeholder ? 'fd-avatar--placeholder' : '',\n            this.tile ? 'fd-avatar--tile' : '',\n            this.class\n        ];\n    }\n\n    /** @hidden */\n    elementRef(): ElementRef<any> {\n        return this._elementRef;\n    }\n\n    /** @hidden Get an abbreviate from the label or return null if not fit requirements */\n    private _getAbbreviate(label: string): string | null {\n        if (!label || this._image) {\n            return null;\n        }\n\n        return this._generateAbbreviation(label);\n    }\n\n    /** @hidden Get the abbrevation string */\n    private _generateAbbreviation(label: string): string | null {\n        const maxLettersCount = 3;\n        const firstLetters = label.split(' ').map((word) => word.charAt(0));\n        const abbreviate = firstLetters.join('');\n\n        if (firstLetters.length > maxLettersCount || !abbreviate.match(ANY_LANGUAGE_LETTERS_REGEX)) {\n            return null;\n        }\n\n        return abbreviate;\n    }\n\n    /** @hidden */\n    private _setImage(value: string): void {\n        this._image = value;\n\n        if (value) {\n            this._verifyImageUrl(value, (): void => {}, this._onErrorCallback);\n        } else {\n            this._bgImage = null;\n        }\n    }\n\n    /** @hidden */\n    private _verifyImageUrl(srcValue: string, onLoadCallback: () => void, onErrorCallback: () => void): void {\n        const img = new Image();\n        img.onload = onLoadCallback.bind(this);\n        img.onerror = onErrorCallback.bind(this);\n        img.src = srcValue;\n        this._assignBgImage(srcValue);\n    }\n\n    /** @hidden */\n    private _assignBgImage(srcValue: string): void {\n        this._bgImage = `url(${srcValue})`;\n    }\n\n    /** @hidden */\n    private _onErrorCallback(): void {\n        if (!this._alterIcon) {\n            this._showDefaultIcon();\n        } else {\n            const options = this._alterIcon.split('|');\n            for (let i = 0; i < options.length; i++) {\n                const option = options[i];\n\n                if (option === ALTER_ICON_OPTIONS.CONTENT) {\n                    const contentValue = this._content.nativeElement.innerText;\n                    if (contentValue && contentValue !== '') {\n                        this.abbreviate = this._generateAbbreviation(contentValue);\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.ALT) {\n                    const altValue = this.elementRef().nativeElement.getAttribute('alt');\n                    if (altValue && altValue !== '') {\n                        this.abbreviate = this._generateAbbreviation(altValue);\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.BACKUP) {\n                    if (this._backupImage && this._backupImage !== '') {\n                        // Check if backupImage can be loaded successfully\n                        // If not, set default user icon\n                        this._verifyImageUrl(\n                            this._backupImage,\n                            () => {\n                                this._assignBgImage(this._backupImage);\n                                this._cdr.detectChanges();\n                            },\n                            () => {\n                                this._showDefaultIcon();\n                                this._cdr.detectChanges();\n                            }\n                        );\n                        break;\n                    }\n\n                    continue;\n                }\n\n                if (option === ALTER_ICON_OPTIONS.DEFAULT_ICON) {\n                    this._showDefaultIcon();\n                    break;\n                }\n\n                this._showDefaultIcon();\n            }\n        }\n\n        this._cdr.detectChanges();\n    }\n\n    /** @hidden */\n    private _showDefaultIcon(): void {\n        this.abbreviate = null;\n        this._image = null;\n        this.glyph = null;\n    }\n}\n","{{ abbreviate }}\n\n<i\n    *ngIf=\"zoomGlyph\"\n    role=\"presentation\"\n    class=\"fd-avatar__zoom-icon\"\n    [class]=\"zoomGlyph ? 'sap-icon--' + zoomGlyph : ''\"\n>\n</i>\n<i *ngIf=\"glyph\" class=\"fd-avatar__icon\" [class]=\"glyph ? ' sap-icon--' + glyph : ''\" role=\"presentation\"> </i>\n<i *ngIf=\"showDefault\" class=\"fd-avatar__icon sap-icon--person-placeholder\" role=\"presentation\"> </i>\n<div #content style=\"display: none\">\n    <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { AvatarComponent } from './avatar.component';\n\n@NgModule({\n    imports: [CommonModule],\n    exports: [AvatarComponent],\n    declarations: [AvatarComponent]\n})\nexport class AvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}