import { FocusMonitor } from '@angular/cdk/a11y';
import { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, contentChildren, ContentChildren, DestroyRef, Directive, effect, ElementRef, forwardRef, inject, InjectionToken, Input, numberAttribute, QueryList, ViewEncapsulation } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { FocusKeyManager } from '@koobiq/cdk/a11y';
import { DOWN_ARROW, isVerticalMovement, TAB, UP_ARROW } from '@koobiq/cdk/keycodes';
import { KBQ_LOCALE_SERVICE, KbqRectangleItem, ruRULocaleData } from '@koobiq/components/core';
import { KbqDropdownTrigger } from '@koobiq/components/dropdown';
import { KbqNotificationCenterTrigger } from '@koobiq/components/notification-center';
import { KbqPopoverTrigger } from '@koobiq/components/popover';
import { BehaviorSubject, EMPTY, filter, merge, Subject, timer } from 'rxjs';
import { delay, startWith, switchMap, takeUntil, tap } from 'rxjs/operators';
import { KbqNavbarIcFocusableItem, KbqNavbarIcItem, KbqNavbarIcToggle } from './navbar-ic-item';
import { toggleNavbarIcAnimation } from './navbar-ic.animation';
import * as i0 from "@angular/core";
export var KbqExpandEvents;
(function (KbqExpandEvents) {
    KbqExpandEvents[KbqExpandEvents["toggle"] = 0] = "toggle";
    KbqExpandEvents[KbqExpandEvents["hoverOrFocus"] = 1] = "hoverOrFocus";
})(KbqExpandEvents || (KbqExpandEvents = {}));
/** minimum timeout to use KBQ_ENTER_DELAY */
export const KBQ_MIN_TIMEOUT_FOR_ENTER_DELAY = 2000;
/** delay before open navbar-ic */
export const KBQ_ENTER_DELAY = 400;
/** default configuration of navbar-ic */
/** @docs-private */
export const KBQ_NAVBAR_IC_DEFAULT_CONFIGURATION = ruRULocaleData.navbarIc;
/** Injection Token for providing configuration of navbar-ic */
/** @docs-private */
export const KBQ_NAVBAR_IC_CONFIGURATION = new InjectionToken('KbqNavbarIcConfiguration');
export class KbqFocusable {
    constructor() {
        this.changeDetectorRef = inject(ChangeDetectorRef);
        this.elementRef = inject(ElementRef);
        this.destroyRef = inject(DestroyRef);
        this.focusMonitor = inject(FocusMonitor);
        this._tabindex = 0;
    }
    get tabindex() {
        return this._tabindex;
    }
    set tabindex(value) {
        this._tabindex = value;
    }
    get itemFocusChanges() {
        return merge(...this.focusableItems.map((item) => item.onFocus));
    }
    get itemBlurChanges() {
        return merge(...this.focusableItems.map((option) => option.onBlur));
    }
    ngAfterContentInit() {
        this.keyManager = new FocusKeyManager(this.focusableItems).withTypeAhead();
        this.keyManager.tabOut.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {
            this.tabindex = -1;
            setTimeout(() => {
                this.tabindex = 0;
                this.changeDetectorRef.markForCheck();
            });
        });
        this.focusableItems.changes.pipe(startWith(null), takeUntilDestroyed(this.destroyRef)).subscribe(() => {
            this.resetOptions();
            // Check to see if we need to update our tab index
            this.updateTabIndex();
        });
    }
    ngAfterViewInit() {
        this.focusMonitor.monitor(this.elementRef).subscribe((focusOrigin) => {
            this.keyManager.setFocusOrigin(focusOrigin);
        });
    }
    ngOnDestroy() {
        this.focusMonitor.stopMonitoring(this.elementRef);
    }
    /** @docs-private */
    focusHandler() {
        if (this.focusableItems.length === 0)
            return;
        this.keyManager.setFirstItemActive();
    }
    /** @docs-private */
    blurHandler() {
        if (!this.hasFocusedItem()) {
            this.keyManager.setActiveItem(-1);
        }
        this.changeDetectorRef.markForCheck();
    }
    resetOptions() {
        this.dropSubscriptions();
        this.listenToItemsFocus();
    }
    dropSubscriptions() {
        this.itemFocusSubscription?.unsubscribe();
        this.itemBlurSubscription?.unsubscribe();
        this.itemFocusSubscription = null;
        this.itemBlurSubscription = null;
    }
    listenToItemsFocus() {
        this.itemFocusSubscription = this.itemFocusChanges.subscribe((event) => {
            const index = this.focusableItems.toArray().indexOf(event.item);
            if (this.isValidIndex(index)) {
                this.keyManager.updateActiveItem(index);
            }
        });
        this.itemBlurSubscription = this.itemBlurChanges.subscribe(() => this.blurHandler());
    }
    updateTabIndex() {
        this.tabindex = this.focusableItems.length === 0 ? -1 : 0;
    }
    isValidIndex(index) {
        return index >= 0 && index < this.focusableItems.length;
    }
    hasFocusedItem() {
        return this.focusableItems.some((item) => item.hasFocus);
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqFocusable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.2.14", type: KbqFocusable, inputs: { tabindex: ["tabindex", "tabindex", numberAttribute] }, queries: [{ propertyName: "focusableItems", predicate: i0.forwardRef(() => KbqNavbarIcFocusableItem), descendants: true }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqFocusable, decorators: [{
            type: Directive
        }], propDecorators: { focusableItems: [{
                type: ContentChildren,
                args: [forwardRef(() => KbqNavbarIcFocusableItem), { descendants: true }]
            }], tabindex: [{
                type: Input,
                args: [{ transform: numberAttribute }]
            }] } });
export class KbqNavbarIcContainer {
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqNavbarIcContainer, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: KbqNavbarIcContainer, isStandalone: true, selector: "kbq-navbar-ic-container", host: { classAttribute: "kbq-navbar-ic-container" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqNavbarIcContainer, decorators: [{
            type: Directive,
            args: [{
                    standalone: true,
                    selector: 'kbq-navbar-ic-container',
                    host: {
                        class: 'kbq-navbar-ic-container'
                    }
                }]
        }] });
export class KbqNavbarIc extends KbqFocusable {
    get expanded() {
        return this._expanded || this.pinned || this.hasOpenedPopUp;
    }
    set expanded(value) {
        this._expanded = value;
        this.state.next(value || this.pinned || this.hasOpenedPopUp ? 'expanded' : 'collapsed');
        this.updateExpandedStateForItems();
    }
    get hasOpenedPopUp() {
        return [...this.dropdownTrigger(), ...this.popoverTrigger(), ...this.notificationCenterTrigger()].some((instance) => instance?.isOpen || instance?.opened);
    }
    get expandedByToggle() {
        return this.expanded && this.expandEvent === KbqExpandEvents.toggle;
    }
    get expandedByHoverOrFocus() {
        return this.expanded && this.expandEvent === KbqExpandEvents.hoverOrFocus;
    }
    get currentWidth() {
        return this.expanded ? this.expandedWidth : this.collapsedWidth;
    }
    constructor() {
        super();
        /** @docs-private */
        this.localeService = inject(KBQ_LOCALE_SERVICE, { optional: true });
        this.externalConfiguration = inject(KBQ_NAVBAR_IC_CONFIGURATION, { optional: true });
        this.state = new BehaviorSubject(null);
        /** @docs-private */
        this.rectangleElements = contentChildren(forwardRef(() => KbqRectangleItem), { descendants: true });
        /** @docs-private */
        this.items = contentChildren(forwardRef(() => KbqNavbarIcItem), { descendants: true });
        /** @docs-private */
        this.toggleElement = contentChildren(forwardRef(() => KbqNavbarIcToggle), { descendants: true });
        /** @docs-private */
        this.dropdownTrigger = contentChildren(forwardRef(() => KbqDropdownTrigger), { descendants: true });
        /** @docs-private */
        this.popoverTrigger = contentChildren(forwardRef(() => KbqPopoverTrigger), { descendants: true });
        /** @docs-private */
        this.notificationCenterTrigger = contentChildren(forwardRef(() => KbqNotificationCenterTrigger), { descendants: true });
        this.hovered = new BehaviorSubject(false);
        this.focused = new BehaviorSubject(false);
        this.animationDone = new Subject();
        this.expandEvent = null;
        this.pinned = true;
        this.collapsedWidth = 64;
        this.expandedWidth = 240;
        this._expanded = true;
        this.updateTooltipForItems = () => this.items().forEach((item) => item.updateTooltip());
        this.updateExpandedStateForItems = () => this.rectangleElements().forEach(this.updateItemExpandedState);
        this.updateItemExpandedState = (item) => {
            setTimeout(() => {
                item.collapsed = !this.expanded;
                item.button?.updateClassModifierForIcons();
            });
        };
        this.updateLocaleParams = () => {
            this.configuration = this.externalConfiguration || this.localeService?.getParams('navbarIc');
            this.changeDetectorRef.markForCheck();
        };
        effect(this.updateExpandedStateForItems);
        this.focused
            .pipe(delay(0), filter(() => !this.pinned || !this.hasOpenedPopUp), takeUntilDestroyed())
            .subscribe((focused) => {
            if (this.hovered.value)
                return;
            this.expandEvent = KbqExpandEvents.hoverOrFocus;
            this.expanded = focused;
            this.changeDetectorRef.markForCheck();
        });
        this.hovered
            .pipe(filter(() => !this.pinned), switchMap((hovered) => {
            if (!hovered) {
                if (this.expanded) {
                    this.lastOpeningTime = Date.now();
                }
                this.expanded = false;
                return EMPTY;
            }
            return timer(this.getExpandDelay()).pipe(tap(() => {
                this.expandEvent = KbqExpandEvents.hoverOrFocus;
                this.expanded = true;
                this.changeDetectorRef.markForCheck();
            }), takeUntil(this.hovered.pipe(filter((h) => !h))));
        }), takeUntilDestroyed())
            .subscribe();
        this.focusMonitor.monitor(this.elementRef, true).subscribe((focusOrigin) => {
            this.focused.next(focusOrigin === 'keyboard');
        });
        this.localeService?.changes.pipe(takeUntilDestroyed()).subscribe(this.updateLocaleParams);
        if (!this.localeService) {
            this.initDefaultParams();
        }
    }
    /** @docs-private */
    ngAfterContentInit() {
        this.updateTooltipForItems();
        super.ngAfterContentInit();
        this.keyManager.withVerticalOrientation(true);
    }
    toggle() {
        this.expanded = !this.expanded;
        this.expandEvent = KbqExpandEvents.toggle;
        this.changeDetectorRef.markForCheck();
    }
    /** @docs-private */
    onKeyDown(event) {
        const keyCode = event.keyCode;
        if (!event.target.attributes.getNamedItem('kbqinput') && isVerticalMovement(event)) {
            event.preventDefault();
        }
        if (keyCode === TAB) {
            this.keyManager.tabOut.next();
            return;
        }
        else if (keyCode === DOWN_ARROW) {
            this.keyManager.setNextItemActive();
        }
        else if (keyCode === UP_ARROW) {
            this.keyManager.setPreviousItemActive();
        }
        else {
            this.keyManager.onKeydown(event);
        }
    }
    getExpandDelay() {
        return Date.now() - this.lastOpeningTime < KBQ_MIN_TIMEOUT_FOR_ENTER_DELAY ? 0 : KBQ_ENTER_DELAY;
    }
    initDefaultParams() {
        this.configuration = KBQ_NAVBAR_IC_DEFAULT_CONFIGURATION;
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqNavbarIc, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.14", type: KbqNavbarIc, isStandalone: true, selector: "kbq-navbar-ic", inputs: { pinned: ["pinned", "pinned", booleanAttribute], collapsedWidth: ["collapsedWidth", "collapsedWidth", numberAttribute], expandedWidth: ["expandedWidth", "expandedWidth", numberAttribute], expanded: ["expanded", "expanded", booleanAttribute] }, host: { listeners: { "focus": "focusHandler()", "blur": "blurHandler()", "keydown": "onKeyDown($event)", "mouseenter": "hovered.next(true)", "mouseleave": "hovered.next(false)" }, properties: { "class.kbq-collapsed": "!expanded", "class.kbq-expanded": "expanded", "style.min-width.px": "pinned ? expandedWidth : collapsedWidth", "attr.tabindex": "tabindex" }, classAttribute: "kbq-navbar-ic" }, queries: [{ propertyName: "rectangleElements", predicate: i0.forwardRef(() => KbqRectangleItem), descendants: true, isSignal: true }, { propertyName: "items", predicate: i0.forwardRef(() => KbqNavbarIcItem), descendants: true, isSignal: true }, { propertyName: "toggleElement", predicate: i0.forwardRef(() => KbqNavbarIcToggle), descendants: true, isSignal: true }, { propertyName: "dropdownTrigger", predicate: i0.forwardRef(() => KbqDropdownTrigger), descendants: true, isSignal: true }, { propertyName: "popoverTrigger", predicate: i0.forwardRef(() => KbqPopoverTrigger), descendants: true, isSignal: true }, { propertyName: "notificationCenterTrigger", predicate: i0.forwardRef(() => KbqNotificationCenterTrigger), descendants: true, isSignal: true }], exportAs: ["KbqNavbarIc"], usesInheritance: true, ngImport: i0, template: `
        <div class="kbq-navbar-ic__top-layer" [@toggle]="expanded" (@toggle.done)="animationDone.next()">
            <ng-content select="[kbq-navbar-ic-container], kbq-navbar-ic-container" />
            <ng-content select="[kbq-navbar-ic-toggle], kbq-navbar-ic-toggle" />
        </div>
    `, isInline: true, styles: [".kbq-navbar-ic-container{display:flex;flex-shrink:0;flex-direction:column;justify-content:space-between}.kbq-navbar-ic{display:flex;position:relative}.kbq-navbar-ic .kbq-navbar-ic-container+.kbq-navbar-ic-container{padding-top:var(--kbq-size-xxl);padding-bottom:var(--kbq-size-m)}.kbq-navbar-ic .kbq-navbar-ic__top-layer{position:absolute;z-index:998;display:flex;flex-direction:column;justify-content:space-between;min-height:100%}.kbq-navbar-ic .kbq-navbar-ic__top-layer{background-color:var(--kbq-navbar-ic-background);box-shadow:var(--kbq-navbar-ic-border)}.kbq-navbar-ic-item,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive,.kbq-navbar-ic-toggle{cursor:pointer}.kbq-navbar-ic-item .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-default-content-background)}.kbq-navbar-ic-item .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-title,.kbq-navbar-ic-toggle .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-default-content-text)}.kbq-navbar-ic-item>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-default-content-icon-left)}.kbq-navbar-ic-item .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-default-content-icon-right)}.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-states-hover-content-background)}.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-title,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-states-hover-content-text)}.kbq-navbar-ic-item:not(.kbq-disabled):hover>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-states-hover-content-icon-left)}.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-states-hover-content-icon-right)}.kbq-navbar-ic-item:not(.kbq-disabled).cdk-keyboard-focused,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).cdk-keyboard-focused,.kbq-navbar-ic-toggle:not(.kbq-disabled).cdk-keyboard-focused{outline:none}.kbq-navbar-ic-item:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-header__inner{box-shadow:inset 0 0 0 2px var(--kbq-states-line-focus-theme)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-states-selected-content-background)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-title,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-title,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-title,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-states-selected-content-text)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active>.kbq-icon.kbq-empty,.kbq-navbar-ic-item:not(.kbq-disabled):active>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle:not(.kbq-disabled):active>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-states-selected-content-icon-left)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-states-selected-content-icon-right)}.kbq-navbar-ic-item.kbq-disabled,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled,.kbq-navbar-ic-toggle.kbq-disabled{pointer-events:none;cursor:default}.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-states-disabled-content-background)}.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-title,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-states-disabled-content-text)}.kbq-navbar-ic-item.kbq-disabled>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle.kbq-disabled>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-states-disabled-content-icon-left)}.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-states-disabled-content-icon-right)}.kbq-navbar-ic-divider{background:var(--kbq-line-contrast-less)}.kbq-navbar-ic-title{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}.kbq-navbar-ic-header .kbq-navbar-ic-title{font-size:var(--kbq-typography-text-big-strong-font-size);font-style:var(--kbq-typography-text-big-strong-font-style);font-weight:var(--kbq-typography-text-big-strong-font-weight);line-height:var(--kbq-typography-text-big-strong-line-height);font-family:var(--kbq-typography-text-big-strong-font-family);text-transform:var(--kbq-typography-text-big-strong-text-transform);font-feature-settings:var(--kbq-typography-text-big-strong-font-feature-settings);letter-spacing:var(--kbq-typography-text-big-strong-letter-spacing)}.kbq-navbar-ic-header .kbq-navbar-ic-title.kbq-navbar-ic-title_text-overflown{font-size:var(--kbq-typography-text-compact-strong-font-size);font-style:var(--kbq-typography-text-compact-strong-font-style);font-weight:var(--kbq-typography-text-compact-strong-font-weight);line-height:var(--kbq-typography-text-compact-strong-line-height);font-family:var(--kbq-typography-text-compact-strong-font-family);text-transform:var(--kbq-typography-text-compact-strong-text-transform);font-feature-settings:var(--kbq-typography-text-compact-strong-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-strong-letter-spacing);line-height:12px}\n", ".kbq-navbar-ic-divider{display:block;height:1px;margin:var(--kbq-size-s) var(--kbq-size-l)}\n", ".kbq-navbar-ic{--kbq-navbar-ic-item-size-content-border-radius: var(--kbq-size-border-radius);--kbq-navbar-ic-background: var(--kbq-background-bg);--kbq-navbar-ic-border: var(--kbq-shadow-overflow-compact-right);--kbq-navbar-ic-item-default-content-text: var(--kbq-foreground-contrast);--kbq-navbar-ic-item-default-content-background: transparent;--kbq-navbar-ic-item-default-content-icon-left: var(--kbq-icon-contrast);--kbq-navbar-ic-item-default-content-icon-right: var(--kbq-icon-contrast);--kbq-navbar-ic-item-states-hover-content-text: var(--kbq-foreground-contrast);--kbq-navbar-ic-item-states-hover-content-background: var(--kbq-states-background-transparent-hover);--kbq-navbar-ic-item-states-hover-content-icon-left: var(--kbq-states-icon-contrast-hover);--kbq-navbar-ic-item-states-hover-content-icon-right: var(--kbq-states-icon-contrast-hover);--kbq-navbar-ic-item-states-selected-content-text: var(--kbq-foreground-contrast);--kbq-navbar-ic-item-states-selected-content-background: var(--kbq-states-background-transparent-active);--kbq-navbar-ic-item-states-selected-content-icon-left: var(--kbq-states-icon-contrast-active);--kbq-navbar-ic-item-states-selected-content-icon-right: var(--kbq-states-icon-contrast-active);--kbq-navbar-ic-item-states-disabled-content-text: var(--kbq-states-foreground-disabled);--kbq-navbar-ic-item-states-disabled-content-background: transparent;--kbq-navbar-ic-item-states-disabled-content-icon-left: var(--kbq-states-icon-disabled);--kbq-navbar-ic-item-states-disabled-content-icon-right: var(--kbq-states-icon-disabled)}\n"], animations: [toggleNavbarIcAnimation()], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqNavbarIc, decorators: [{
            type: Component,
            args: [{ standalone: true, selector: 'kbq-navbar-ic', exportAs: 'KbqNavbarIc', template: `
        <div class="kbq-navbar-ic__top-layer" [@toggle]="expanded" (@toggle.done)="animationDone.next()">
            <ng-content select="[kbq-navbar-ic-container], kbq-navbar-ic-container" />
            <ng-content select="[kbq-navbar-ic-toggle], kbq-navbar-ic-toggle" />
        </div>
    `, host: {
                        class: 'kbq-navbar-ic',
                        '[class.kbq-collapsed]': '!expanded',
                        '[class.kbq-expanded]': 'expanded',
                        '[style.min-width.px]': 'pinned ? expandedWidth : collapsedWidth',
                        '[attr.tabindex]': 'tabindex',
                        '(focus)': 'focusHandler()',
                        '(blur)': 'blurHandler()',
                        '(keydown)': 'onKeyDown($event)',
                        '(mouseenter)': 'hovered.next(true)',
                        '(mouseleave)': 'hovered.next(false)'
                    }, animations: [toggleNavbarIcAnimation()], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-navbar-ic-container{display:flex;flex-shrink:0;flex-direction:column;justify-content:space-between}.kbq-navbar-ic{display:flex;position:relative}.kbq-navbar-ic .kbq-navbar-ic-container+.kbq-navbar-ic-container{padding-top:var(--kbq-size-xxl);padding-bottom:var(--kbq-size-m)}.kbq-navbar-ic .kbq-navbar-ic__top-layer{position:absolute;z-index:998;display:flex;flex-direction:column;justify-content:space-between;min-height:100%}.kbq-navbar-ic .kbq-navbar-ic__top-layer{background-color:var(--kbq-navbar-ic-background);box-shadow:var(--kbq-navbar-ic-border)}.kbq-navbar-ic-item,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive,.kbq-navbar-ic-toggle{cursor:pointer}.kbq-navbar-ic-item .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-default-content-background)}.kbq-navbar-ic-item .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-title,.kbq-navbar-ic-toggle .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-default-content-text)}.kbq-navbar-ic-item>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-default-content-icon-left)}.kbq-navbar-ic-item .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-default-content-icon-right)}.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-states-hover-content-background)}.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-title,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-states-hover-content-text)}.kbq-navbar-ic-item:not(.kbq-disabled):hover>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-states-hover-content-icon-left)}.kbq-navbar-ic-item:not(.kbq-disabled):hover .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):hover .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle:not(.kbq-disabled):hover .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-states-hover-content-icon-right)}.kbq-navbar-ic-item:not(.kbq-disabled).cdk-keyboard-focused,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).cdk-keyboard-focused,.kbq-navbar-ic-toggle:not(.kbq-disabled).cdk-keyboard-focused{outline:none}.kbq-navbar-ic-item:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).cdk-keyboard-focused .kbq-navbar-ic-header__inner{box-shadow:inset 0 0 0 2px var(--kbq-states-line-focus-theme)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-states-selected-content-background)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-title,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-title,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-title,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-states-selected-content-text)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active>.kbq-icon.kbq-empty,.kbq-navbar-ic-item:not(.kbq-disabled):active>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle:not(.kbq-disabled):active>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-states-selected-content-icon-left)}.kbq-navbar-ic-item:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-item:not(.kbq-disabled):active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive:not(.kbq-disabled):active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle:not(.kbq-disabled).kbq-active .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle:not(.kbq-disabled):active .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-states-selected-content-icon-right)}.kbq-navbar-ic-item.kbq-disabled,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled,.kbq-navbar-ic-toggle.kbq-disabled{pointer-events:none;cursor:default}.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-item__inner,.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-header__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-item__inner,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-header__inner,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-item__inner,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-header__inner{background:var(--kbq-navbar-ic-item-states-disabled-content-background)}.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-title,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-title,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-title{color:var(--kbq-navbar-ic-item-states-disabled-content-text)}.kbq-navbar-ic-item.kbq-disabled>.kbq-icon.kbq-empty,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled>.kbq-icon.kbq-empty,.kbq-navbar-ic-toggle.kbq-disabled>.kbq-icon.kbq-empty{color:var(--kbq-navbar-ic-item-states-disabled-content-icon-left)}.kbq-navbar-ic-item.kbq-disabled .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-header.kbq-navbar-ic-header_interactive.kbq-disabled .kbq-navbar-ic-item__arrow-icon,.kbq-navbar-ic-toggle.kbq-disabled .kbq-navbar-ic-item__arrow-icon{color:var(--kbq-navbar-ic-item-states-disabled-content-icon-right)}.kbq-navbar-ic-divider{background:var(--kbq-line-contrast-less)}.kbq-navbar-ic-title{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}.kbq-navbar-ic-header .kbq-navbar-ic-title{font-size:var(--kbq-typography-text-big-strong-font-size);font-style:var(--kbq-typography-text-big-strong-font-style);font-weight:var(--kbq-typography-text-big-strong-font-weight);line-height:var(--kbq-typography-text-big-strong-line-height);font-family:var(--kbq-typography-text-big-strong-font-family);text-transform:var(--kbq-typography-text-big-strong-text-transform);font-feature-settings:var(--kbq-typography-text-big-strong-font-feature-settings);letter-spacing:var(--kbq-typography-text-big-strong-letter-spacing)}.kbq-navbar-ic-header .kbq-navbar-ic-title.kbq-navbar-ic-title_text-overflown{font-size:var(--kbq-typography-text-compact-strong-font-size);font-style:var(--kbq-typography-text-compact-strong-font-style);font-weight:var(--kbq-typography-text-compact-strong-font-weight);line-height:var(--kbq-typography-text-compact-strong-line-height);font-family:var(--kbq-typography-text-compact-strong-font-family);text-transform:var(--kbq-typography-text-compact-strong-text-transform);font-feature-settings:var(--kbq-typography-text-compact-strong-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-strong-letter-spacing);line-height:12px}\n", ".kbq-navbar-ic-divider{display:block;height:1px;margin:var(--kbq-size-s) var(--kbq-size-l)}\n", ".kbq-navbar-ic{--kbq-navbar-ic-item-size-content-border-radius: var(--kbq-size-border-radius);--kbq-navbar-ic-background: var(--kbq-background-bg);--kbq-navbar-ic-border: var(--kbq-shadow-overflow-compact-right);--kbq-navbar-ic-item-default-content-text: var(--kbq-foreground-contrast);--kbq-navbar-ic-item-default-content-background: transparent;--kbq-navbar-ic-item-default-content-icon-left: var(--kbq-icon-contrast);--kbq-navbar-ic-item-default-content-icon-right: var(--kbq-icon-contrast);--kbq-navbar-ic-item-states-hover-content-text: var(--kbq-foreground-contrast);--kbq-navbar-ic-item-states-hover-content-background: var(--kbq-states-background-transparent-hover);--kbq-navbar-ic-item-states-hover-content-icon-left: var(--kbq-states-icon-contrast-hover);--kbq-navbar-ic-item-states-hover-content-icon-right: var(--kbq-states-icon-contrast-hover);--kbq-navbar-ic-item-states-selected-content-text: var(--kbq-foreground-contrast);--kbq-navbar-ic-item-states-selected-content-background: var(--kbq-states-background-transparent-active);--kbq-navbar-ic-item-states-selected-content-icon-left: var(--kbq-states-icon-contrast-active);--kbq-navbar-ic-item-states-selected-content-icon-right: var(--kbq-states-icon-contrast-active);--kbq-navbar-ic-item-states-disabled-content-text: var(--kbq-states-foreground-disabled);--kbq-navbar-ic-item-states-disabled-content-background: transparent;--kbq-navbar-ic-item-states-disabled-content-icon-left: var(--kbq-states-icon-disabled);--kbq-navbar-ic-item-states-disabled-content-icon-right: var(--kbq-states-icon-disabled)}\n"] }]
        }], ctorParameters: () => [], propDecorators: { pinned: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }], collapsedWidth: [{
                type: Input,
                args: [{ transform: numberAttribute }]
            }], expandedWidth: [{
                type: Input,
                args: [{ transform: numberAttribute }]
            }], expanded: [{
                type: Input,
                args: [{ transform: booleanAttribute }]
            }] } });
//# sourceMappingURL=data:application/json;base64, 