import { FocusKeyManager } from '@angular/cdk/a11y';
import { TAB, DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW } from '@angular/cdk/keycodes';
import { ViewportRuler } from '@angular/cdk/overlay';
import * as i0 from '@angular/core';
import { InjectionToken, HostListener, Optional, Inject, Directive, inject, computed, effect, forwardRef, ViewChild, ContentChildren, Input, ChangeDetectionStrategy, ViewEncapsulation, Component, HostBinding, NgModule } from '@angular/core';
import { Subscription, of } from 'rxjs';
import { delay } from 'rxjs/operators';
import { RtlService, KeyUtil, getRandomColorAccent, applyCssClass } from '@fundamental-ngx/cdk/utils';
import { __decorate, __metadata } from 'tslib';

const AVATAR_GROUP_LEGACY_FOCUSABLE_AVATAR_DIRECTIVE = new InjectionToken('AvatarGroupLegacyFocusableAvatarDirective');
const AVATAR_GROUP_LEGACY_COMPONENT = new InjectionToken('AvatarGroupLegacyComponent');

class AvatarGroupLegacyItemDirective {
    /** @hidden */
    constructor(_elementRef, _component) {
        this._elementRef = _elementRef;
        this._component = _component;
        /** Item disable state */
        this.disabled = false;
    }
    /** @hidden */
    get _element() {
        return this._elementRef.nativeElement;
    }
    /** Handler for mouse events */
    onClick() {
        if (this._component) {
            this._component._setActiveItem(this);
        }
    }
    /** @hidden */
    focus() {
        this._element.focus();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyItemDirective, deps: [{ token: i0.ElementRef }, { token: AVATAR_GROUP_LEGACY_COMPONENT, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyItemDirective, isStandalone: true, selector: "[fd-avatar-group-legacy-item]", host: { listeners: { "click": "onClick()" }, classAttribute: "fd-avatar-group-legacy__item" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyItemDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-avatar-group-legacy-item]',
                    host: { class: 'fd-avatar-group-legacy__item' },
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: undefined, decorators: [{
                    type: Optional
                }, {
                    type: Inject,
                    args: [AVATAR_GROUP_LEGACY_COMPONENT]
                }] }], propDecorators: { onClick: [{
                type: HostListener,
                args: ['click']
            }] } });

let avatarGroupCount = 0;
class AvatarGroupLegacyComponent {
    /** @hidden */
    get isGroupType() {
        return this.type === 'group';
    }
    /** @hidden */
    get _avatarGroupWidth() {
        return this.avatarGroupContainer?.nativeElement?.offsetWidth;
    }
    /** @hidden */
    get _avatarGroupItemWidth() {
        return this.mainItems.first?._element.offsetWidth ?? 0;
    }
    /** @hidden */
    get _avatarGroupItemWithMarginsWidth() {
        if (!this.mainItems.first) {
            return this._avatarGroupItemWidth;
        }
        const elementStyles = getComputedStyle(this.mainItems.first._element);
        const marginLeft = elementStyles.marginLeft || '0';
        const marginRight = elementStyles.marginRight || '0';
        return this._avatarGroupItemWidth + parseInt(marginLeft, 10) + parseInt(marginRight, 10);
    }
    /** @hidden */
    constructor() {
        /** Id of the Avatar Group. */
        this.id = `fd-avatar-group-legacy-${avatarGroupCount++}`;
        /** The size of the Avatar Group. Options include: *xs*, *s*, *m*, *l* and *xl* (default: *s*). */
        this.size = 's';
        /** The type of the Avatar Group. Options include: *group* and *individual* (default: *group*). */
        this.type = 'group';
        /** Counter for all avatars. */
        this.allItemsCount = 0;
        /** Counter for visible in overflow popover avatars. */
        this.overflowItemsCount = 0;
        /** @hidden */
        this._subscription = new Subscription();
        /** @hidden */
        this._viewportRuler = inject(ViewportRuler);
        /** @hidden */
        this._rtlService = inject(RtlService, { optional: true });
        /** @hidden */
        this._dir = computed(() => (this._rtlService?.rtl() ? 'rtl' : 'ltr'), ...(ngDevMode ? [{ debugName: "_dir" }] : []));
        // React to RTL changes and update keyboard manager orientation
        effect(() => {
            const dir = this._dir();
            this._keyboardEventsManager?.withHorizontalOrientation(dir);
        });
    }
    /** @hidden */
    keyUpHandler(event) {
        if (KeyUtil.isKeyCode(event, TAB)) {
            const index = this.mainItems.toArray().findIndex((item) => item._element === event.target);
            if (index !== -1) {
                this._keyboardEventsManager.setActiveItem(index);
            }
        }
        if (KeyUtil.isKeyCode(event, [DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW])) {
            event.preventDefault();
            // passing the event to key manager so we get a change fired
            this._keyboardEventsManager.onKeydown(event);
        }
    }
    /** @hidden */
    ngOnInit() {
        this._subscription.add(this._viewportRuler.change().subscribe(() => this._onResize()));
    }
    /** @hidden */
    ngOnChanges() {
        this._assignCssClasses();
    }
    /** @hidden */
    ngAfterViewInit() {
        this._reset();
        this._subscription.add(of(true)
            .pipe(delay(5))
            .subscribe(() => this._collapseItems()));
        this._listenForItemChanges();
        this._setKeyboardEventsManager();
    }
    /** @hidden */
    ngOnDestroy() {
        this._subscription.unsubscribe();
        this._keyboardEventsManager.destroy();
    }
    /** @hidden */
    _setActiveItem(item) {
        this._keyboardEventsManager.setActiveItem(item);
    }
    /** @hidden */
    _onResize() {
        this._reset();
        this._collapseItems();
    }
    /** @hidden */
    _reset() {
        this.allItemsCount = this.mainItems.length;
        this.overflowItemsCount = 0;
        this.mainItems.forEach((it) => {
            it._element.style.display = 'inline-block';
            it.disabled = false;
        });
    }
    /** @hidden */
    _collapseItems() {
        const allItemsCounter = this.mainItems?.length || 0;
        let contentWidth = 0;
        let idx = 0;
        const avatarGroupItemWidth = this._avatarGroupItemWidth;
        const avatarGroupItemWithMarginsWidth = this._avatarGroupItemWithMarginsWidth;
        while (idx < allItemsCounter) {
            const newContentWidth = idx === 0 && this.isGroupType
                ? contentWidth + avatarGroupItemWidth
                : contentWidth + avatarGroupItemWithMarginsWidth;
            if (newContentWidth >= this._avatarGroupWidth) {
                // -1 because the last element in the loop will be replaced by the overflow button
                const newIdx = idx - 1;
                this.overflowItemsCount = allItemsCounter - newIdx;
                const mainItemsToHide = this.mainItems.toArray().slice(newIdx);
                mainItemsToHide.forEach((it) => {
                    it._element.style.display = 'none';
                    it.disabled = true;
                });
                break;
            }
            contentWidth = newContentWidth;
            idx++;
        }
    }
    /** @hidden */
    _listenForItemChanges() {
        this._subscription.add(this.mainItems.changes.subscribe(() => this._onResize()));
    }
    /** @hidden */
    _assignCssClasses() {
        this.rootClassNames = {
            'fd-avatar-group-legacy': true,
            [`fd-avatar-group-legacy--${this.type}-type`]: !!this.type,
            [`fd-avatar-group-legacy--${this.size}`]: !!this.size,
            [this.class]: !!this.class
        };
    }
    /** @hidden */
    _setKeyboardEventsManager() {
        this._keyboardEventsManager?.destroy();
        this._keyboardEventsManager = new FocusKeyManager(this.mainItems)
            .withWrap()
            .withHorizontalOrientation(this._dir());
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyComponent, isStandalone: true, selector: "fd-avatar-group-legacy", inputs: { id: "id", class: "class", size: "size", type: "type", ariaLabel: "ariaLabel" }, host: { listeners: { "keyup": "keyUpHandler($event)" } }, providers: [
            {
                provide: AVATAR_GROUP_LEGACY_COMPONENT,
                useExisting: forwardRef(() => AvatarGroupLegacyComponent)
            }
        ], queries: [{ propertyName: "mainItems", predicate: AvatarGroupLegacyItemDirective, descendants: true }], viewQueries: [{ propertyName: "avatarGroupContainer", first: true, predicate: ["avatarGroupContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #avatarGroupContainer [class]=\"rootClassNames\" [id]=\"id\" [attr.aria-label]=\"ariaLabel\">\n    <ng-content></ng-content>\n</div>\n", styles: [".fd-avatar-group-legacy{-webkit-box-sizing:border-box;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;border:0;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;flex-direction:row;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-avatar-group-legacy:after,.fd-avatar-group-legacy:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group-legacy--group-type[tabindex=\"0\"],.fd-avatar-group-legacy__popover-control[tabindex=\"0\"]{cursor:pointer}.fd-avatar-group-legacy--group-type[tabindex=\"0\"].is-focus,.fd-avatar-group-legacy--group-type[tabindex=\"0\"]:focus,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"].is-focus,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"]:focus{outline:none}.fd-avatar-group-legacy--group-type[tabindex=\"0\"].is-focus:after,.fd-avatar-group-legacy--group-type[tabindex=\"0\"]:focus:after,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"].is-focus:after,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"]:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:var(--fdAvatarGroup_Focus_Outline_Offset);content:\"\";left:var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute;right:var(--fdAvatarGroup_Focus_Outline_Offset);top:var(--fdAvatarGroup_Focus_Outline_Offset)}.fd-avatar-group-legacy__popover-control{display:-webkit-box;display:-ms-flexbox;display:flex;height:auto}.fd-avatar-group-legacy__focusable-avatar.is-focus,.fd-avatar-group-legacy__focusable-avatar:focus,.fd-avatar-group-legacy__item[tabindex=\"0\"].is-focus,.fd-avatar-group-legacy__item[tabindex=\"0\"]:focus{outline:none;z-index:5}.fd-avatar-group-legacy__focusable-avatar.is-focus .fd-avatar:after,.fd-avatar-group-legacy__focusable-avatar:focus .fd-avatar:after,.fd-avatar-group-legacy__item[tabindex=\"0\"].is-focus .fd-avatar:after,.fd-avatar-group-legacy__item[tabindex=\"0\"]:focus .fd-avatar:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:var(--fdAvatar_Focus_Outline_Offset);content:\"\";left:var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute;right:var(--fdAvatar_Focus_Outline_Offset);top:var(--fdAvatar_Focus_Outline_Offset)}.fd-avatar-group-legacy--group-type .fd-avatar-group-legacy__more-button{pointer-events:none}.fd-avatar-group-legacy__item{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-avatar-group-legacy__item:after,.fd-avatar-group-legacy__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group-legacy__more-button{outline:none!important}.fd-avatar-group-legacy__more-button.is-focus,.fd-avatar-group-legacy__more-button:focus{outline:none}.fd-avatar-group-legacy__more-button.is-focus:after,.fd-avatar-group-legacy__more-button:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:var(--fdAvatar_Focus_Outline_Offset);content:\"\";left:var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute;right:var(--fdAvatar_Focus_Outline_Offset);top:var(--fdAvatar_Focus_Outline_Offset)}.fd-avatar-group-legacy__more-button .fd-avatar-group-legacy__button-text{font-size:inherit}.fd-avatar-group-legacy__overflow-body{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem;white-space:normal}.fd-avatar-group-legacy__overflow-body:after,.fd-avatar-group-legacy__overflow-body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group-legacy__overflow-body--no-padding{padding:0}.fd-avatar-group-legacy__overflow-body--no-horizontal-scroll{overflow-x:hidden}.fd-avatar-group-legacy__overflow-body--no-vertical-scroll{overflow-y:hidden}.fd-avatar-group-legacy__overflow-body .fd-avatar-group-legacy__item{margin:.25rem}.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__more-button{height:2rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;width:2rem}.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:1rem}.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--s .fd-avatar-group-legacy__more-button{height:3rem;max-height:3rem;max-width:3rem;min-height:3rem;min-width:3rem;width:3rem}.fd-avatar-group-legacy--s .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:1.125rem}.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--m .fd-avatar-group-legacy__more-button{height:4rem;max-height:4rem;max-width:4rem;min-height:4rem;min-width:4rem;width:4rem}.fd-avatar-group-legacy--m .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:1.5rem}.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--l .fd-avatar-group-legacy__more-button{height:5rem;max-height:5rem;max-width:5rem;min-height:5rem;min-width:5rem;width:5rem}.fd-avatar-group-legacy--l .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:2.25rem}.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__more-button{height:7rem;max-height:7rem;max-width:7rem;min-height:7rem;min-width:7rem;width:7rem}.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:3rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:0;margin-right:.0625rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:.0625rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:0;margin-right:.125rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:.125rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:0;margin-right:.125rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:.125rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:0;margin-right:.125rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:.125rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:0;margin-right:.25rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:.25rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:0;margin-right:-.75rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:-.75rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:0;margin-right:-1.25rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:-1.25rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:0;margin-right:-1.625rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:-1.625rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:0;margin-right:-2rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:-2rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:0;margin-right:-2.75rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:-2.75rem;margin-right:0}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-1{background-color:var(--fdAvatar_Accent_Color_1);border:var(--fdAvatar_Accent_Color_1_Border);color:var(--fdAvatar_Accent_Color_1_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-2{background-color:var(--fdAvatar_Accent_Color_2);border:var(--fdAvatar_Accent_Color_2_Border);color:var(--fdAvatar_Accent_Color_2_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-3{background-color:var(--fdAvatar_Accent_Color_3);border:var(--fdAvatar_Accent_Color_3_Border);color:var(--fdAvatar_Accent_Color_3_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-4{background-color:var(--fdAvatar_Accent_Color_4);border:var(--fdAvatar_Accent_Color_4_Border);color:var(--fdAvatar_Accent_Color_4_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-5{background-color:var(--fdAvatar_Accent_Color_5);border:var(--fdAvatar_Accent_Color_5_Border);color:var(--fdAvatar_Accent_Color_5_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-6{background-color:var(--fdAvatar_Accent_Color_6);border:var(--fdAvatar_Accent_Color_6_Border);color:var(--fdAvatar_Accent_Color_6_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-7{background-color:var(--fdAvatar_Accent_Color_7);border:var(--fdAvatar_Accent_Color_7_Border);color:var(--fdAvatar_Accent_Color_7_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-8{background-color:var(--fdAvatar_Accent_Color_8);border:var(--fdAvatar_Accent_Color_8_Border);color:var(--fdAvatar_Accent_Color_8_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-9{background-color:var(--fdAvatar_Accent_Color_9);border:var(--fdAvatar_Accent_Color_9_Border);color:var(--fdAvatar_Accent_Color_9_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-10{background-color:var(--fdAvatar_Accent_Color_10);border:var(--fdAvatar_Accent_Color_10_Border);color:var(--fdAvatar_Accent_Color_10_Text)}\n/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */\n/*!\n.fd-avatar-group-legacy+((--individual|--group), (--xs|--s|--m|--l|--xl)\n*/\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyComponent, decorators: [{
            type: Component,
            args: [{ selector: 'fd-avatar-group-legacy', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                        {
                            provide: AVATAR_GROUP_LEGACY_COMPONENT,
                            useExisting: forwardRef(() => AvatarGroupLegacyComponent)
                        }
                    ], template: "<div #avatarGroupContainer [class]=\"rootClassNames\" [id]=\"id\" [attr.aria-label]=\"ariaLabel\">\n    <ng-content></ng-content>\n</div>\n", styles: [".fd-avatar-group-legacy{-webkit-box-sizing:border-box;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;border:0;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;flex-direction:row;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-avatar-group-legacy:after,.fd-avatar-group-legacy:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group-legacy--group-type[tabindex=\"0\"],.fd-avatar-group-legacy__popover-control[tabindex=\"0\"]{cursor:pointer}.fd-avatar-group-legacy--group-type[tabindex=\"0\"].is-focus,.fd-avatar-group-legacy--group-type[tabindex=\"0\"]:focus,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"].is-focus,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"]:focus{outline:none}.fd-avatar-group-legacy--group-type[tabindex=\"0\"].is-focus:after,.fd-avatar-group-legacy--group-type[tabindex=\"0\"]:focus:after,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"].is-focus:after,.fd-avatar-group-legacy__popover-control[tabindex=\"0\"]:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:var(--fdAvatarGroup_Focus_Outline_Offset);content:\"\";left:var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute;right:var(--fdAvatarGroup_Focus_Outline_Offset);top:var(--fdAvatarGroup_Focus_Outline_Offset)}.fd-avatar-group-legacy__popover-control{display:-webkit-box;display:-ms-flexbox;display:flex;height:auto}.fd-avatar-group-legacy__focusable-avatar.is-focus,.fd-avatar-group-legacy__focusable-avatar:focus,.fd-avatar-group-legacy__item[tabindex=\"0\"].is-focus,.fd-avatar-group-legacy__item[tabindex=\"0\"]:focus{outline:none;z-index:5}.fd-avatar-group-legacy__focusable-avatar.is-focus .fd-avatar:after,.fd-avatar-group-legacy__focusable-avatar:focus .fd-avatar:after,.fd-avatar-group-legacy__item[tabindex=\"0\"].is-focus .fd-avatar:after,.fd-avatar-group-legacy__item[tabindex=\"0\"]:focus .fd-avatar:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:var(--fdAvatar_Focus_Outline_Offset);content:\"\";left:var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute;right:var(--fdAvatar_Focus_Outline_Offset);top:var(--fdAvatar_Focus_Outline_Offset)}.fd-avatar-group-legacy--group-type .fd-avatar-group-legacy__more-button{pointer-events:none}.fd-avatar-group-legacy__item{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-avatar-group-legacy__item:after,.fd-avatar-group-legacy__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group-legacy__more-button{outline:none!important}.fd-avatar-group-legacy__more-button.is-focus,.fd-avatar-group-legacy__more-button:focus{outline:none}.fd-avatar-group-legacy__more-button.is-focus:after,.fd-avatar-group-legacy__more-button:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:var(--fdAvatar_Focus_Outline_Offset);content:\"\";left:var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute;right:var(--fdAvatar_Focus_Outline_Offset);top:var(--fdAvatar_Focus_Outline_Offset)}.fd-avatar-group-legacy__more-button .fd-avatar-group-legacy__button-text{font-size:inherit}.fd-avatar-group-legacy__overflow-body{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem;white-space:normal}.fd-avatar-group-legacy__overflow-body:after,.fd-avatar-group-legacy__overflow-body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group-legacy__overflow-body--no-padding{padding:0}.fd-avatar-group-legacy__overflow-body--no-horizontal-scroll{overflow-x:hidden}.fd-avatar-group-legacy__overflow-body--no-vertical-scroll{overflow-y:hidden}.fd-avatar-group-legacy__overflow-body .fd-avatar-group-legacy__item{margin:.25rem}.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__more-button{height:2rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;width:2rem}.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:1rem}.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--s .fd-avatar-group-legacy__more-button{height:3rem;max-height:3rem;max-width:3rem;min-height:3rem;min-width:3rem;width:3rem}.fd-avatar-group-legacy--s .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:1.125rem}.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--m .fd-avatar-group-legacy__more-button{height:4rem;max-height:4rem;max-width:4rem;min-height:4rem;min-width:4rem;width:4rem}.fd-avatar-group-legacy--m .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:1.5rem}.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--l .fd-avatar-group-legacy__more-button{height:5rem;max-height:5rem;max-width:5rem;min-height:5rem;min-width:5rem;width:5rem}.fd-avatar-group-legacy--l .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:2.25rem}.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item,.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__more-button{height:7rem;max-height:7rem;max-width:7rem;min-height:7rem;min-width:7rem;width:7rem}.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__more-button{border-radius:25rem;border-width:var(--fdAvatarGroup_MoreButton_Border);font-size:3rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:0;margin-right:.0625rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:.0625rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:0;margin-right:.125rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:.125rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:0;margin-right:.125rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:.125rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:0;margin-right:.125rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:.125rem;margin-right:0}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:0;margin-right:.25rem}.fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--individual-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:.25rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:0;margin-right:-.75rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xs .fd-avatar-group-legacy__item{margin-left:-.75rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:0;margin-right:-1.25rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--s .fd-avatar-group-legacy__item{margin-left:-1.25rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:0;margin-right:-1.625rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--m .fd-avatar-group-legacy__item{margin-left:-1.625rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:0;margin-right:-2rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--l .fd-avatar-group-legacy__item{margin-left:-2rem;margin-right:0}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:0;margin-right:-2.75rem}.fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item[dir=rtl],[dir=rtl] .fd-avatar-group-legacy--group-type.fd-avatar-group-legacy--xl .fd-avatar-group-legacy__item{margin-left:-2.75rem;margin-right:0}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-1{background-color:var(--fdAvatar_Accent_Color_1);border:var(--fdAvatar_Accent_Color_1_Border);color:var(--fdAvatar_Accent_Color_1_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-2{background-color:var(--fdAvatar_Accent_Color_2);border:var(--fdAvatar_Accent_Color_2_Border);color:var(--fdAvatar_Accent_Color_2_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-3{background-color:var(--fdAvatar_Accent_Color_3);border:var(--fdAvatar_Accent_Color_3_Border);color:var(--fdAvatar_Accent_Color_3_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-4{background-color:var(--fdAvatar_Accent_Color_4);border:var(--fdAvatar_Accent_Color_4_Border);color:var(--fdAvatar_Accent_Color_4_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-5{background-color:var(--fdAvatar_Accent_Color_5);border:var(--fdAvatar_Accent_Color_5_Border);color:var(--fdAvatar_Accent_Color_5_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-6{background-color:var(--fdAvatar_Accent_Color_6);border:var(--fdAvatar_Accent_Color_6_Border);color:var(--fdAvatar_Accent_Color_6_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-7{background-color:var(--fdAvatar_Accent_Color_7);border:var(--fdAvatar_Accent_Color_7_Border);color:var(--fdAvatar_Accent_Color_7_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-8{background-color:var(--fdAvatar_Accent_Color_8);border:var(--fdAvatar_Accent_Color_8_Border);color:var(--fdAvatar_Accent_Color_8_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-9{background-color:var(--fdAvatar_Accent_Color_9);border:var(--fdAvatar_Accent_Color_9_Border);color:var(--fdAvatar_Accent_Color_9_Text)}.fd-avatar-group-legacy .fd-avatar-group-legacy__more-button--accent-color-10{background-color:var(--fdAvatar_Accent_Color_10);border:var(--fdAvatar_Accent_Color_10_Border);color:var(--fdAvatar_Accent_Color_10_Text)}\n/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */\n/*!\n.fd-avatar-group-legacy+((--individual|--group), (--xs|--s|--m|--l|--xl)\n*/\n"] }]
        }], ctorParameters: () => [], propDecorators: { id: [{
                type: Input
            }], class: [{
                type: Input
            }], size: [{
                type: Input
            }], type: [{
                type: Input
            }], ariaLabel: [{
                type: Input
            }], mainItems: [{
                type: ContentChildren,
                args: [AvatarGroupLegacyItemDirective, { descendants: true }]
            }], avatarGroupContainer: [{
                type: ViewChild,
                args: ['avatarGroupContainer']
            }], keyUpHandler: [{
                type: HostListener,
                args: ['keyup', ['$event']]
            }] } });

// import { AvatarGroupLegacyFocusableAvatarDirective } from './avatar-group-legacy-focusable-avatar.directive';
class AvatarGroupLegacyOverflowBodyDirective {
    /** @hidden */
    constructor() {
        /** Remove the padding from the overflow body. */
        this.noPadding = false;
        /** Hide horizontal scrollbar from the overflow body. */
        this.noHorizontalScroll = true;
        /** Hide vertical scrollbar from the overflow body. */
        this.noVerticalScroll = true;
        /** @hidden */
        this._subscription = new Subscription();
        /** @hidden */
        this._rtlService = inject(RtlService, { optional: true });
        /** @hidden */
        this._dir = computed(() => (this._rtlService?.rtl() ? 'rtl' : 'ltr'), ...(ngDevMode ? [{ debugName: "_dir" }] : []));
        // React to RTL changes and update keyboard manager orientation
        effect(() => {
            const dir = this._dir();
            this._keyboardEventsManager?.withHorizontalOrientation(dir);
        });
    }
    /** @hidden */
    keyUpHandler(event) {
        if (KeyUtil.isKeyCode(event, TAB)) {
            const index = this.overflowItems
                .toArray()
                .findIndex((item) => item.elementRef.nativeElement === event.target);
            if (index !== -1) {
                this._keyboardEventsManager.setActiveItem(index);
            }
        }
        if (KeyUtil.isKeyCode(event, [DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW])) {
            // passing the event to key manager so we get a change fired
            this._keyboardEventsManager.onKeydown(event);
        }
    }
    /** @hidden */
    ngAfterViewInit() {
        this._listenForItemChanges();
        this._setKeyboardEventsManager();
    }
    /** @hidden */
    ngOnDestroy() {
        this._subscription.unsubscribe();
        this._keyboardEventsManager?.destroy();
    }
    /** @hidden */
    _setActiveItem(item) {
        this._keyboardEventsManager.setActiveItem(item);
    }
    /** @hidden */
    _listenForItemChanges() {
        this.overflowItems.changes.subscribe(() => this._setKeyboardEventsManager());
    }
    /** @hidden */
    _setKeyboardEventsManager() {
        this._keyboardEventsManager?.destroy();
        this._keyboardEventsManager = new FocusKeyManager(this.overflowItems)
            .withWrap()
            .withHorizontalOrientation(this._dir());
        this._keyboardEventsManager.setFirstItemActive();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowBodyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyOverflowBodyDirective, isStandalone: true, selector: "[fd-avatar-group-legacy-overflow-body]", inputs: { noPadding: "noPadding", noHorizontalScroll: "noHorizontalScroll", noVerticalScroll: "noVerticalScroll" }, host: { listeners: { "keyup": "keyUpHandler($event)" }, properties: { "class.fd-avatar-group-legacy__overflow-body--no-padding": "noPadding", "class.fd-avatar-group-legacy__overflow-body--no-horizontal-scroll": "noHorizontalScroll", "class.fd-avatar-group-legacy__overflow-body--no-vertical-scroll": "noVerticalScroll" }, classAttribute: "fd-avatar-group-legacy__overflow-body" }, queries: [{ propertyName: "overflowItems", predicate: AVATAR_GROUP_LEGACY_FOCUSABLE_AVATAR_DIRECTIVE, descendants: true }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowBodyDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-avatar-group-legacy-overflow-body]',
                    host: {
                        class: 'fd-avatar-group-legacy__overflow-body',
                        '[class.fd-avatar-group-legacy__overflow-body--no-padding]': 'noPadding',
                        '[class.fd-avatar-group-legacy__overflow-body--no-horizontal-scroll]': 'noHorizontalScroll',
                        '[class.fd-avatar-group-legacy__overflow-body--no-vertical-scroll]': 'noVerticalScroll'
                    }
                }]
        }], ctorParameters: () => [], propDecorators: { noPadding: [{
                type: Input
            }], noHorizontalScroll: [{
                type: Input
            }], noVerticalScroll: [{
                type: Input
            }], overflowItems: [{
                type: ContentChildren,
                args: [AVATAR_GROUP_LEGACY_FOCUSABLE_AVATAR_DIRECTIVE, { descendants: true }]
            }], keyUpHandler: [{
                type: HostListener,
                args: ['keyup', ['$event']]
            }] } });

class AvatarGroupLegacyFocusableAvatarDirective {
    /** @hidden */
    constructor(elementRef, _component) {
        this.elementRef = elementRef;
        this._component = _component;
        /** Tabindex of the Avatar. */
        this.tabindex = 0;
    }
    /** Handler for mouse events */
    onClick() {
        if (this._component) {
            this._component._setActiveItem(this);
        }
    }
    /** @hidden */
    focus() {
        this.elementRef.nativeElement.focus();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyFocusableAvatarDirective, deps: [{ token: i0.ElementRef }, { token: forwardRef(() => AvatarGroupLegacyOverflowBodyDirective), optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyFocusableAvatarDirective, isStandalone: true, selector: "[fd-avatar-group-legacy-focusable-avatar]", inputs: { tabindex: "tabindex" }, host: { listeners: { "click": "onClick()" }, properties: { "attr.tabindex": "this.tabindex" }, classAttribute: "fd-avatar-group-legacy__focusable-avatar" }, providers: [
            {
                provide: AVATAR_GROUP_LEGACY_FOCUSABLE_AVATAR_DIRECTIVE,
                useExisting: forwardRef(() => AvatarGroupLegacyFocusableAvatarDirective)
            }
        ], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyFocusableAvatarDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-avatar-group-legacy-focusable-avatar]',
                    host: { class: 'fd-avatar-group-legacy__focusable-avatar' },
                    providers: [
                        {
                            provide: AVATAR_GROUP_LEGACY_FOCUSABLE_AVATAR_DIRECTIVE,
                            useExisting: forwardRef(() => AvatarGroupLegacyFocusableAvatarDirective)
                        }
                    ],
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: undefined, decorators: [{
                    type: Optional
                }, {
                    type: Inject,
                    args: [forwardRef(() => AvatarGroupLegacyOverflowBodyDirective)]
                }] }], propDecorators: { tabindex: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['attr.tabindex']
            }], onClick: [{
                type: HostListener,
                args: ['click']
            }] } });

class AvatarGroupLegacyOverflowButtonTextDirective {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowButtonTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyOverflowButtonTextDirective, isStandalone: true, selector: "[fd-avatar-group-legacy-overflow-button-text]", host: { classAttribute: "fd-button__text fd-avatar-group-legacy__button-text" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowButtonTextDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-avatar-group-legacy-overflow-button-text]',
                    host: { class: 'fd-button__text fd-avatar-group-legacy__button-text' },
                    standalone: true
                }]
        }] });

class AvatarGroupLegacyOverflowButtonDirective {
    /** @hidden */
    constructor(elementRef) {
        this.elementRef = elementRef;
        /** The size of the overflow button.
         * Should be the same as the Avatar Group and Avatar size.
         * Options include: *xs*, *s*, *m*, *l* and *xl* (default: *s*). */
        this.size = 's';
        /** A number from 1 to 10 representing the background color of the Avatar Group's overflow button.
         * Options include: *neutral*, *random*, *1*, *2*, *3*, *4*, *5*, *6*, *7*, *8*, *9*, *10* (default: *neutral*). */
        this.color = 'neutral';
    }
    /** @hidden */
    buildComponentCssClass() {
        return [
            'fd-button',
            'fd-avatar-group-legacy__more-button',
            (this.color && this._getMoreButtonColorCssClass()) || '',
            this.size ? `fd-avatar-group-legacy__more-button--${this.size}` : '',
            this.class
        ];
    }
    /** @hidden */
    ngOnInit() {
        this.buildComponentCssClass();
    }
    /** @hidden */
    ngOnChanges() {
        this.buildComponentCssClass();
    }
    /** @hidden */
    _getMoreButtonColorCssClass() {
        if (this.color === 'random') {
            return `fd-avatar-group-legacy__more-button--accent-color-${getRandomColorAccent()}`;
        }
        if (!Number.isNaN(parseInt(this.color, 10))) {
            return `fd-avatar-group-legacy__more-button--accent-color-${this.color}`;
        }
        return null;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowButtonDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyOverflowButtonDirective, isStandalone: true, selector: "[fd-avatar-group-legacy-overflow-button]", inputs: { class: "class", size: "size", color: "color" }, usesOnChanges: true, ngImport: i0 }); }
}
__decorate([
    applyCssClass,
    __metadata("design:type", Function),
    __metadata("design:paramtypes", []),
    __metadata("design:returntype", Array)
], AvatarGroupLegacyOverflowButtonDirective.prototype, "buildComponentCssClass", null);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowButtonDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-avatar-group-legacy-overflow-button]',
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { class: [{
                type: Input
            }], size: [{
                type: Input
            }], color: [{
                type: Input
            }], buildComponentCssClass: [] } });

class AvatarGroupLegacyOverflowItemDirective extends AvatarGroupLegacyItemDirective {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowItemDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyOverflowItemDirective, isStandalone: true, selector: "[fd-avatar-group-legacy-overflow-item]", usesInheritance: true, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyOverflowItemDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-avatar-group-legacy-overflow-item]',
                    standalone: true
                }]
        }] });

/** Needed to bind specific class to group type popover control. */
class AvatarGroupLegacyPopoverControlDirective {
    constructor() {
        /** Tabindex of the popover control. */
        this.tabindex = 0;
        /** Role of the popover control. */
        this.role = 'button';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyPopoverControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: AvatarGroupLegacyPopoverControlDirective, isStandalone: true, selector: "[fd-avatar-group-legacy-popover-control]", inputs: { tabindex: "tabindex", role: "role" }, host: { properties: { "attr.tabindex": "this.tabindex", "attr.role": "this.role" }, classAttribute: "fd-avatar-group-legacy__popover-control" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyPopoverControlDirective, decorators: [{
            type: Directive,
            args: [{
                    // eslint-disable-next-line @angular-eslint/directive-selector
                    selector: '[fd-avatar-group-legacy-popover-control]',
                    host: { class: 'fd-avatar-group-legacy__popover-control' },
                    standalone: true
                }]
        }], propDecorators: { tabindex: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['attr.tabindex']
            }], role: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['attr.role']
            }] } });

/**
 * @deprecated
 * Use direct imports of components and directives.
 */
class AvatarGroupLegacyModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyModule, imports: [AvatarGroupLegacyComponent,
            AvatarGroupLegacyItemDirective,
            AvatarGroupLegacyFocusableAvatarDirective,
            AvatarGroupLegacyPopoverControlDirective,
            AvatarGroupLegacyOverflowBodyDirective,
            AvatarGroupLegacyOverflowItemDirective,
            AvatarGroupLegacyOverflowButtonDirective,
            AvatarGroupLegacyOverflowButtonTextDirective], exports: [AvatarGroupLegacyComponent,
            AvatarGroupLegacyItemDirective,
            AvatarGroupLegacyFocusableAvatarDirective,
            AvatarGroupLegacyPopoverControlDirective,
            AvatarGroupLegacyOverflowBodyDirective,
            AvatarGroupLegacyOverflowItemDirective,
            AvatarGroupLegacyOverflowButtonDirective,
            AvatarGroupLegacyOverflowButtonTextDirective] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyModule }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: AvatarGroupLegacyModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        AvatarGroupLegacyComponent,
                        AvatarGroupLegacyItemDirective,
                        AvatarGroupLegacyFocusableAvatarDirective,
                        AvatarGroupLegacyPopoverControlDirective,
                        AvatarGroupLegacyOverflowBodyDirective,
                        AvatarGroupLegacyOverflowItemDirective,
                        AvatarGroupLegacyOverflowButtonDirective,
                        AvatarGroupLegacyOverflowButtonTextDirective
                    ],
                    exports: [
                        AvatarGroupLegacyComponent,
                        AvatarGroupLegacyItemDirective,
                        AvatarGroupLegacyFocusableAvatarDirective,
                        AvatarGroupLegacyPopoverControlDirective,
                        AvatarGroupLegacyOverflowBodyDirective,
                        AvatarGroupLegacyOverflowItemDirective,
                        AvatarGroupLegacyOverflowButtonDirective,
                        AvatarGroupLegacyOverflowButtonTextDirective
                    ]
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { AvatarGroupLegacyComponent, AvatarGroupLegacyFocusableAvatarDirective, AvatarGroupLegacyItemDirective, AvatarGroupLegacyModule, AvatarGroupLegacyOverflowBodyDirective, AvatarGroupLegacyOverflowButtonDirective, AvatarGroupLegacyOverflowButtonTextDirective, AvatarGroupLegacyOverflowItemDirective, AvatarGroupLegacyPopoverControlDirective };
//# sourceMappingURL=fundamental-ngx-core-avatar-group-legacy.mjs.map
