import * as i0 from '@angular/core';
import { inject, ElementRef, Input, Directive, Component, signal, computed, ViewEncapsulation, ChangeDetectionStrategy, EventEmitter, HostListener, ContentChild, HostBinding, Output, DestroyRef, Inject, Injectable, ViewChild, Injector, effect, ContentChildren, forwardRef, Optional, NgModule } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { Subject, merge, startWith } from 'rxjs';
import { RtlService, destroyObservable, KeyUtil } from '@fundamental-ngx/cdk/utils';
import { IconComponent } from '@fundamental-ngx/core/icon';
import { takeUntil, filter } from 'rxjs/operators';
import { RIGHT_ARROW, LEFT_ARROW, ENTER, SPACE } from '@angular/cdk/keycodes';
import * as i1 from '@fundamental-ngx/core/menu';
import { MenuKeyboardService } from '@fundamental-ngx/core/menu';
import { PopoverComponent, PopoverControlComponent, PopoverBodyComponent } from '@fundamental-ngx/core/popover';
import * as i4 from '@fundamental-ngx/core/content-density';
import { contentDensityObserverProviders } from '@fundamental-ngx/core/content-density';
import { TranslationResolver, FD_LANGUAGE_SIGNAL } from '@fundamental-ngx/i18n';
import { NgTemplateOutlet } from '@angular/common';
import { RouterLink } from '@angular/router';

/** Contains references to popover or list nested components, that are placed as direct children of item component */
class NestedItemService {
    constructor() {
        /** Subject fired when expand icon is clicked */
        this.toggle = new Subject();
        /** Subject fired, when child elements are focused */
        this.focus = new Subject();
        /** Subject fired, when content or link is clicked */
        this.click = new Subject();
        /** KeyDown handler, it is triggered from link, content and item elements */
        this.keyDown = new Subject();
    }
}

let uniqueId = 0;
class NestedListHeaderDirective {
    constructor() {
        /** Id of the element. */
        this.id = `fd-nested-list-group-header-${++uniqueId}`;
        /** @hidden */
        this._elementRef = inject(ElementRef);
    }
    /** Get the header title */
    get title() {
        return this._elementRef.nativeElement.textContent;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: NestedListHeaderDirective, isStandalone: true, selector: "[fdNestedDirectivesHeader], [fd-nested-list-header]", inputs: { id: "id" }, host: { properties: { "attr.id": "id" }, classAttribute: "fd-nested-list__group-header" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListHeaderDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[fdNestedDirectivesHeader], [fd-nested-list-header]',
                    host: {
                        class: 'fd-nested-list__group-header',
                        '[attr.id]': 'id'
                    }
                }]
        }], propDecorators: { id: [{
                type: Input
            }] } });
class NestedListIconComponent extends IconComponent {
    constructor() {
        super(...arguments);
        /** Role attribute */
        this.role = 'presentation';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListIconComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: NestedListIconComponent, isStandalone: true, selector: "[fdNestedDirectivesIcon], [fd-nested-list-icon]", inputs: { role: "role" }, host: { properties: { "attr.role": "role" }, classAttribute: "fd-nested-list__icon" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListIconComponent, decorators: [{
            type: Component,
            args: [{
                    // eslint-disable-next-line @angular-eslint/component-selector
                    selector: '[fdNestedDirectivesIcon], [fd-nested-list-icon]',
                    template: `<ng-content></ng-content>`,
                    host: {
                        class: 'fd-nested-list__icon',
                        '[attr.role]': 'role'
                    }
                }]
        }], propDecorators: { role: [{
                type: Input
            }] } });
class NestedListTitleDirective {
    constructor() {
        /** @hidden */
        this._elementRef = inject(ElementRef);
    }
    /** Returns element's InnerText */
    getInnerText() {
        return this._elementRef?.nativeElement.textContent;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: NestedListTitleDirective, isStandalone: true, selector: "[fdNestedDirectivesTitle], [fd-nested-list-title]", host: { classAttribute: "fd-nested-list__title" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListTitleDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[fdNestedDirectivesTitle], [fd-nested-list-title]',
                    host: {
                        class: 'fd-nested-list__title'
                    }
                }]
        }] });
class NestedListExpandIconComponent {
    constructor() {
        /**
         * @hidden
         * Attribute controlled by the parent `NestedItemDirective`
         */
        this.expanded = signal(false, ...(ngDevMode ? [{ debugName: "expanded" }] : []));
        /** @hidden */
        this.expandIcon = computed(() => {
            if (this.expanded()) {
                return 'navigation-down-arrow';
            }
            return this._rtlService?.rtl() ? 'navigation-left-arrow' : 'navigation-right-arrow';
        }, ...(ngDevMode ? [{ debugName: "expandIcon" }] : []));
        /** @hidden */
        this._itemService = inject(NestedItemService);
        /** @hidden */
        this._rtlService = inject(RtlService, { optional: true });
    }
    /** Mouse event handler */
    onClick(event) {
        this.expanded.update((v) => !v);
        this._itemService.toggle.next(this.expanded());
        event.stopPropagation();
    }
    /** Handler for focus events */
    onFocus() {
        this._itemService.focus.next();
    }
    /** @hidden */
    changeExpandedState(expanded) {
        this.expanded.set(expanded);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListExpandIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: NestedListExpandIconComponent, isStandalone: true, selector: "[fdNestedListExpandIcon], [fd-nested-list-expand-icon]", host: { attributes: { "aria-haspopup": "true", "tabindex": "-1" }, listeners: { "click": "onClick($event)", "focus": "onFocus()" }, properties: { "class.is-expanded": "expanded()", "attr.aria-expanded": "expanded()", "attr.aria-hidden": "true" }, classAttribute: "fd-nested-list__button fd-button" }, ngImport: i0, template: `
        <ng-content></ng-content>
        <fd-icon [glyph]="expandIcon()"></fd-icon>
    `, isInline: true, dependencies: [{ kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListExpandIconComponent, decorators: [{
            type: Component,
            args: [{
                    // eslint-disable-next-line @angular-eslint/component-selector
                    selector: '[fdNestedListExpandIcon], [fd-nested-list-expand-icon]',
                    template: `
        <ng-content></ng-content>
        <fd-icon [glyph]="expandIcon()"></fd-icon>
    `,
                    host: {
                        'aria-haspopup': 'true',
                        tabindex: '-1',
                        class: 'fd-nested-list__button fd-button',
                        '[class.is-expanded]': 'expanded()',
                        '[attr.aria-expanded]': 'expanded()',
                        '[attr.aria-hidden]': 'true',
                        '(click)': 'onClick($event)',
                        '(focus)': 'onFocus()'
                    },
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    imports: [IconComponent]
                }]
        }] });

class NestedLinkDirective {
    /** @hidden */
    constructor(changeDetRef, _elementRef, _itemService) {
        this.changeDetRef = changeDetRef;
        this._elementRef = _elementRef;
        this._itemService = _itemService;
        /** Whether this element is selected*/
        this.selected = false;
        /** Event thrown, when selected state is changed */
        this.selectedChange = new EventEmitter();
        /** @hidden */
        this.fdNestedListItemClass = true;
        /** @hidden */
        this.tabIndex = 0;
        /** @hidden */
        this.role = 'treeitem';
    }
    /** Handler for keyboard events */
    onKeyDown(event) {
        this._itemService.keyDown.next(event);
    }
    /** Handler for mouse events */
    onClick() {
        this._itemService.click.next();
        if (this.onClickCallback) {
            this.onClickCallback();
        }
    }
    /** Handler for focus events */
    onFocus() {
        this._itemService.focus.next();
    }
    /** Method to trigger selected state change */
    changeSelected(selected) {
        this.selected = selected;
        this.selectedChange.emit(selected);
    }
    /** Set focus on the element. */
    focus() {
        this._elementRef.nativeElement.focus();
    }
    /** Dispatches the click event on the element */
    click() {
        this._elementRef.nativeElement.click();
    }
    /** Returns the title value of the title directive */
    getTitle() {
        return this.title && this.title.getInnerText();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedLinkDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: NestedItemService }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: NestedLinkDirective, isStandalone: true, selector: "[fdNestedLink], [fd-nested-list-link]", inputs: { onClickCallback: "onClickCallback", selected: "selected", ariaDescribedby: "ariaDescribedby" }, outputs: { selectedChange: "selectedChange" }, host: { listeners: { "keydown": "onKeyDown($event)", "click": "onClick()", "focus": "onFocus()" }, properties: { "class.is-selected": "this.selected", "attr.aria-label": "this._ariaLabel", "attr.aria-describedby": "this.ariaDescribedby", "class.fd-nested-list__link": "this.fdNestedListItemClass", "attr.tabindex": "this.tabIndex", "attr.role": "this.role" } }, queries: [{ propertyName: "title", first: true, predicate: NestedListTitleDirective, descendants: true }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedLinkDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[fdNestedLink], [fd-nested-list-link]',
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: NestedItemService }], propDecorators: { onClickCallback: [{
                type: Input
            }], selected: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['class.is-selected']
            }], _ariaLabel: [{
                type: HostBinding,
                args: ['attr.aria-label']
            }], ariaDescribedby: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['attr.aria-describedby']
            }], selectedChange: [{
                type: Output
            }], fdNestedListItemClass: [{
                type: HostBinding,
                args: ['class.fd-nested-list__link']
            }], tabIndex: [{
                type: HostBinding,
                args: ['attr.tabindex']
            }], role: [{
                type: HostBinding,
                args: ['attr.role']
            }], title: [{
                type: ContentChild,
                args: [NestedListTitleDirective]
            }], onKeyDown: [{
                type: HostListener,
                args: ['keydown', ['$event']]
            }], onClick: [{
                type: HostListener,
                args: ['click']
            }], onFocus: [{
                type: HostListener,
                args: ['focus']
            }] } });

class NestedListContentDirective {
    /** @hidden */
    constructor(changeDetRef, _elementRef, _itemService) {
        this.changeDetRef = changeDetRef;
        this._elementRef = _elementRef;
        this._itemService = _itemService;
        /** Whether this element is selected*/
        this.selected = false;
        /** @hidden */
        this.role = 'treeitem';
        /** @hidden */
        this.ariaExpanded = false;
        /** Event thrown, when selected state is changed */
        this.selectedChange = new EventEmitter();
        /** Event that is thrown, when any keyboard event is dispatched on this element */
        this.keyboardTriggered = new EventEmitter();
        /** Event that is thrown, when this element is clicked */
        this.clicked = new EventEmitter();
        /** @hidden */
        this.fdNestedListContentClass = true;
        /**
         * @hidden
         * Attribute controlled by the parent `NestedItemDirective`
         */
        this.hasChildren = false;
        /** An RxJS Subject that will kill the data stream upon component’s destruction (for unsubscribing)  */
        this._destroyRef = inject(DestroyRef);
    }
    /** Keyboard Event Handler */
    onKeyDown(event) {
        this.keyboardTriggered.emit(event);
        this._itemService.keyDown.next(event);
    }
    /** Handler for mouse events */
    onClick() {
        this._itemService.click.next();
    }
    /** @hidden */
    ngAfterContentInit() {
        this._makeLinkUnFocusable();
        this._setFocusSubscription();
    }
    /** Method to trigger selected state change */
    changeSelected(selected) {
        this.selected = selected;
        this.selectedChange.emit(selected);
    }
    /** Expanded state change propagation method */
    changeExpandedState(expanded) {
        if (this.nestedExpandIcon) {
            this.nestedExpandIcon.changeExpandedState(expanded);
        }
    }
    /** Set focus on the element. */
    focus() {
        this._elementRef.nativeElement.focus();
    }
    /** Dispatches the click event on the element */
    click() {
        this.focus();
        if (this.nestedLink) {
            this.nestedLink.click();
        }
    }
    /** Add subscription for child focusing */
    _setFocusSubscription() {
        this._itemService.focus.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(() => this.focus());
    }
    /** Hide link child element from tab key */
    _makeLinkUnFocusable() {
        if (this.nestedLink) {
            this.nestedLink.tabIndex = -1;
            this.changeDetRef.detectChanges();
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListContentDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: NestedItemService }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: NestedListContentDirective, isStandalone: true, selector: "[fdNestedListContent], [fd-nested-list-content]", inputs: { selected: "selected" }, outputs: { selectedChange: "selectedChange", keyboardTriggered: "keyboardTriggered", clicked: "clicked" }, host: { attributes: { "tabindex": "0" }, listeners: { "keydown": "onKeyDown($event)", "click": "onClick()" }, properties: { "class.is-selected": "this.selected", "attr.role": "this.role", "attr.aria-expanded": "this.ariaExpanded", "class.fd-nested-list__content": "this.fdNestedListContentClass", "class.has-child": "this.hasChildren" } }, queries: [{ propertyName: "nestedLink", first: true, predicate: NestedLinkDirective, descendants: true }, { propertyName: "nestedExpandIcon", first: true, predicate: NestedListExpandIconComponent, descendants: true }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListContentDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[fdNestedListContent], [fd-nested-list-content]',
                    host: {
                        tabindex: '0'
                    },
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: NestedItemService }], propDecorators: { selected: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['class.is-selected']
            }], role: [{
                type: HostBinding,
                args: ['attr.role']
            }], ariaExpanded: [{
                type: HostBinding,
                args: ['attr.aria-expanded']
            }], selectedChange: [{
                type: Output
            }], keyboardTriggered: [{
                type: Output
            }], clicked: [{
                type: Output
            }], fdNestedListContentClass: [{
                type: HostBinding,
                args: ['class.fd-nested-list__content']
            }], hasChildren: [{
                type: HostBinding,
                args: ['class.has-child']
            }], nestedLink: [{
                type: ContentChild,
                args: [NestedLinkDirective]
            }], nestedExpandIcon: [{
                type: ContentChild,
                args: [NestedListExpandIconComponent]
            }], onKeyDown: [{
                type: HostListener,
                args: ['keydown', ['$event']]
            }], onClick: [{
                type: HostListener,
                args: ['click']
            }] } });

/**
 * Nested list keyboard service, which uses MenuKeyboardService, to deal with ArrowUp, ArrowDown, Space, Enter.
 * Also has own handling of ArrowLeft and ArrowRight, to open/close the menu if it has any children.
 */
class NestedListKeyboardService {
    /** @hidden */
    constructor(keyboardService) {
        this.keyboardService = keyboardService;
        /**
         * Event, that is thrown always, when the open/close i being called on item components.
         * Also triggers changing of elements, to remove closed/hidden elements
         */
        this.refresh$ = new Subject();
        /** @hidden */
        this._destroyRef = inject(DestroyRef);
    }
    /**
     * Function called after refresh$ event is triggered.
     * Refresh the list of NestedItems, that the keyboard support should be provided for
     */
    refreshItems(lists) {
        const items = [];
        /** Gathering all of the items */
        lists.forEach((list) => items.push(...this._getAllListItems(list)));
        /** Putting the keyboard support function to each of the items */
        items.forEach((item, index) => {
            item.keyboardTriggered
                .pipe(takeUntil(merge(this.refresh$, destroyObservable(this._destroyRef))))
                .subscribe((keyboardEvent) => this._handleKeyDown(keyboardEvent, index, items));
        });
    }
    /** Recursive function to get all of the NestedItem elements in correct order. */
    _getItems(item) {
        const childrenItems = item.expanded ? item.allChildrenItems : [];
        return childrenItems.reduce((actualArray, nextItem) => [
            ...actualArray,
            ...this._getItems(nextItem)
        ], [item]);
    }
    /** Method that calls the recursive function, getItems() and gathers all of the items in the NestedList */
    _getAllListItems(list) {
        const _items = [];
        if (list && list.nestedItems && list.nestedItems.length > 0) {
            list.nestedItems.forEach((item) => {
                _items.push(...this._getItems(item));
            });
        }
        return _items;
    }
    /**
     * Keyboard handle function. Uses keyboard support service from MenuComponent, to deal with ArrowUp, ArrowDown, Space, Enter.
     * For ArrowRight, if item is not expanded and has children (list or popup), the open function is triggered.
     * Otherwise it follows ArrowDown functionality.
     * For ArrowLeft, if item is expanded and has children (list or popup), the close function is triggered.
     * Otherwise it follows ArrowUp functionality
     */
    _handleKeyDown(keyboardEvent, index, items) {
        const item = items[index];
        if (KeyUtil.isKeyCode(keyboardEvent, RIGHT_ARROW)) {
            if (!item.expanded && item.hasChildren) {
                item.triggerOpen();
            }
            keyboardEvent.preventDefault();
        }
        if (KeyUtil.isKeyCode(keyboardEvent, LEFT_ARROW)) {
            if (item.expanded && item.hasChildren) {
                item.triggerClose();
            }
            keyboardEvent.preventDefault();
        }
        if (KeyUtil.isKeyCode(keyboardEvent, [ENTER, SPACE])) {
            if (item.hasChildren) {
                items[index].click();
            }
            keyboardEvent.preventDefault();
        }
        this.keyboardService.keyDownHandler(keyboardEvent, index, items);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListKeyboardService, deps: [{ token: MenuKeyboardService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListKeyboardService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListKeyboardService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: i1.MenuKeyboardService, decorators: [{
                    type: Inject,
                    args: [MenuKeyboardService]
                }] }] });

class NestedListStateService {
    constructor() {
        /**
         * @hidden
         * The condensed state is modified by the parent and read by nested lists.
         */
        this.condensed = false;
        /**
         * @hidden
         */
        this.selectable = true;
        /** @hidden */
        this.onSelected = new Subject();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListStateService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListStateService, decorators: [{
            type: Injectable
        }] });

let sideNavigationItemUniqueId = 0;
class NestedItemDirective {
    /** Whether item should be expanded */
    set expanded(expanded) {
        if (expanded !== this._expanded) {
            this.propagateOpenChange(expanded);
        }
    }
    /** @hidden */
    get expanded() {
        return this._expanded;
    }
    /** @hidden */
    constructor(_itemService, _keyboardService, _stateService) {
        this._itemService = _itemService;
        this._keyboardService = _keyboardService;
        this._stateService = _stateService;
        /** Event thrown, when expanded state is changed */
        this.expandedChange = new EventEmitter();
        /** Event thrown, when any keyboard event is dispatched on this, or link element */
        this.keyboardTriggered = new EventEmitter();
        /** @hidden */
        this.fdNestedListItemClass = true;
        /** @hidden */
        this._ariaLevel = null;
        /** @hidden */
        this._ariaExpanded = null;
        /** @hidden */
        this._ariaSelected = null;
        /** @hidden */
        this._ariaDisabled = false;
        /** @hidden */
        this._ariaHidden = true;
        /** @hidden */
        this._expanded = false;
        /** An RxJS Subject that will kill the data stream upon component’s destruction (for unsubscribing)  */
        this._destroyRef = inject(DestroyRef);
        /** Unique element ID */
        this._elementId = 'fdNestedItem' + sideNavigationItemUniqueId++;
    }
    /** @hidden */
    ngAfterContentInit() {
        this._setUpSubscriptions();
        this._propagateHasChildrenProperty();
        this._passItemReferences();
        /** Propagate initial open state to children */
        this.propagateOpenChange(this._expanded);
        if (this.linkItem) {
            this._ariaSelected = this.linkItem.selected;
            this._ariaDisabled = !this._stateService.selectable && !this.linkItem.selected;
            this._title = this.linkItem.getTitle();
        }
    }
    /** Check if the item element has any child */
    get hasChildren() {
        return !!this._itemService?.list;
    }
    /** Get all of the children item elements */
    get allChildrenItems() {
        if (this._itemService?.list) {
            return this._itemService.list.nestedItems.toArray();
        }
        return [];
    }
    /** Method that expand the item and propagate it to children */
    triggerOpen() {
        if (!this.expanded) {
            /** Propagate initial open state to children */
            this.propagateOpenChange(true);
        }
    }
    /** Method that close the item and propagate it to children */
    triggerClose() {
        if (this.expanded) {
            /** Propagate initial open state to children */
            this.propagateOpenChange(false);
        }
    }
    /** Method that toggle the item and propagate it to children */
    toggle() {
        /** Propagate initial open state to children */
        this.propagateOpenChange(!this._expanded);
    }
    /** Method that dispatches `click` event on link item*/
    click() {
        if (this.contentItem) {
            this.contentItem.click();
        }
        else if (this.linkItem) {
            this.linkItem.click();
        }
    }
    /** Method that focuses link item*/
    focus() {
        if (this.contentItem) {
            this.contentItem.focus();
        }
        else if (this.linkItem) {
            this.linkItem.focus();
        }
    }
    /** Method that provides information if element, or children of this element has passed id */
    containsId(id) {
        if (this._elementId === id) {
            return true;
        }
        if (this._itemService.list) {
            return !!this._itemService.list.nestedItems.find((item) => item.containsId(id));
        }
        return false;
    }
    /**
     * @hidden
     * Propagate open state to all of the children
     */
    propagateOpenChange(open) {
        this._expanded = open;
        if (this.hasChildren) {
            this._ariaExpanded = this._expanded;
        }
        /**
         * Propagate to child content directive, which contains icon and link
         */
        if (this.contentItem) {
            this.contentItem.changeExpandedState(open);
            this.contentItem.ariaExpanded = this._expanded;
        }
        /** Propagate hidden flag to list component, that is passed from child */
        if (this._itemService.list) {
            this._itemService.list.hidden = !open;
            this._itemService.list.detectChanges();
        }
        /** Propagate open flag to popover list component, that is passed from child */
        if (this._itemService.popover) {
            this._itemService.popover.open = open;
        }
        /**
         * If there are any list below
         * Trigger event to provide keyboard support to new list of opened item element.
         * */
        if (this._shouldRefreshKeyboardService()) {
            this._keyboardService.refresh$.next();
        }
        this.expandedChange.emit(open);
    }
    /** @hidden */
    _shouldRefreshKeyboardService() {
        return !!(this._itemService.popover || this._itemService.list || this.contentItem);
    }
    /** @hidden */
    _setUpSubscriptions() {
        if (this._stateService.condensed) {
            this._role = 'menuitemradio';
        }
        /** Subscribe to mouse click event, thrown by link item */
        this._itemService.toggle.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(() => this.toggle());
        /** Subscribe to mouse click event, thrown by link item */
        this._itemService.click
            .pipe(takeUntilDestroyed(this._destroyRef))
            .subscribe(() => this._stateService.onSelected.next(this._elementId));
        /** Subscribe to keyboard event and throw it farther */
        this._itemService.keyDown
            .pipe(takeUntilDestroyed(this._destroyRef))
            .subscribe((keyboardEvent) => this.keyboardTriggered.emit(keyboardEvent));
        /** Subscribe to selected state change, it's not triggered, when selectable flag is disabled*/
        this._stateService.onSelected
            .pipe(takeUntilDestroyed(this._destroyRef), filter(() => this._stateService.selectable))
            .subscribe((id) => this._selectedChange(id));
    }
    /** @hidden */
    _propagateHasChildrenProperty() {
        if (this.contentItem && this.hasChildren) {
            this._ariaExpanded = false;
            this.contentItem.hasChildren = true;
            this.contentItem.changeDetRef.detectChanges();
        }
    }
    /** Pass this element to popover child item, to allow control `expanded` value */
    _passItemReferences() {
        if (this._itemService.popover) {
            this._itemService.popover.parentItemElement = this;
        }
    }
    /** Change of selected state of content or link, if there is any children with I */
    _selectedChange(id) {
        const selected = this.containsId(id);
        this._ariaSelected = selected;
        if (this.contentItem) {
            this.contentItem.changeSelected(selected);
        }
        else if (this.linkItem) {
            this.linkItem.changeSelected(selected);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedItemDirective, deps: [{ token: NestedItemService }, { token: NestedListKeyboardService }, { token: NestedListStateService }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: NestedItemDirective, isStandalone: true, selector: "[fdNestedItem], [fd-nested-list-item]", inputs: { expanded: "expanded" }, outputs: { expandedChange: "expandedChange", keyboardTriggered: "keyboardTriggered" }, host: { attributes: { "role": "treeitem" }, properties: { "class.fd-nested-list__item": "this.fdNestedListItemClass", "attr.aria-level": "this._ariaLevel", "attr.title": "this._title", "attr.role": "this._role", "attr.aria-expanded": "this._ariaExpanded", "attr.aria-selected": "this._ariaSelected", "attr.aria-disabled": "this._ariaDisabled", "attr.aria-label": "this._ariaLabel", "attr.aria-hidden": "this._ariaHidden" } }, providers: [NestedItemService], queries: [{ propertyName: "linkItem", first: true, predicate: NestedLinkDirective, descendants: true }, { propertyName: "contentItem", first: true, predicate: NestedListContentDirective, descendants: true }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedItemDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[fdNestedItem], [fd-nested-list-item]',
                    providers: [NestedItemService],
                    host: {
                        role: 'treeitem'
                    },
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: NestedItemService }, { type: NestedListKeyboardService }, { type: NestedListStateService }], propDecorators: { expanded: [{
                type: Input
            }], expandedChange: [{
                type: Output
            }], keyboardTriggered: [{
                type: Output
            }], fdNestedListItemClass: [{
                type: HostBinding,
                args: ['class.fd-nested-list__item']
            }], linkItem: [{
                type: ContentChild,
                args: [NestedLinkDirective]
            }], contentItem: [{
                type: ContentChild,
                args: [NestedListContentDirective]
            }], _ariaLevel: [{
                type: HostBinding,
                args: ['attr.aria-level']
            }], _title: [{
                type: HostBinding,
                args: ['attr.title']
            }], _role: [{
                type: HostBinding,
                args: ['attr.role']
            }], _ariaExpanded: [{
                type: HostBinding,
                args: ['attr.aria-expanded']
            }], _ariaSelected: [{
                type: HostBinding,
                args: ['attr.aria-selected']
            }], _ariaDisabled: [{
                type: HostBinding,
                args: ['attr.aria-disabled']
            }], _ariaLabel: [{
                type: HostBinding,
                args: ['attr.aria-label']
            }], _ariaHidden: [{
                type: HostBinding,
                args: ['attr.aria-hidden']
            }] } });

class NestedListPopoverComponent {
    /** @hidden */
    constructor() {
        /** @hidden
         * For Internal Usage - Gets information about title, which should be displayed inside popover
         */
        this.title = '';
        /** @hidden */
        this.open = false;
        /** @hidden */
        this.placement = computed(() => (this._rtlService?.rtl() ? 'left-start' : 'right-start'), ...(ngDevMode ? [{ debugName: "placement" }] : []));
        /** @hidden */
        this._keyboardNestService = inject(NestedListKeyboardService);
        /** @hidden */
        this._itemService = inject(NestedItemService, { optional: true });
        /** @hidden */
        this._rtlService = inject(RtlService, { optional: true });
        this._listenOnKeyboardRefresh();
        if (this._itemService) {
            this._itemService.popover = this;
        }
    }
    /** @hidden */
    ngAfterContentInit() {
        if (!this.title) {
            this.title = this._getTitle();
        }
    }
    /**
     * Method called, when open state is changed, from popover component (escape key, outside click).
     */
    handleOpenChange(open) {
        this.open = open;
        if (this.parentItemElement) {
            if (open) {
                this.parentItemElement.triggerOpen();
            }
            else {
                this.parentItemElement.triggerClose();
            }
        }
    }
    /** Returns title of nested link element inside content directive */
    _getTitle() {
        if (this.contentDirective && this.contentDirective.nestedLink) {
            return this.contentDirective.nestedLink.getTitle();
        }
        else {
            return '';
        }
    }
    /** @hidden */
    _listenOnKeyboardRefresh() {
        this._keyboardNestService.refresh$.subscribe(() => {
            /** Update popover position, on list of hidden items change */
            if (this.popoverComponent) {
                this.popoverComponent.refreshPosition();
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: NestedListPopoverComponent, isStandalone: true, selector: "fd-nested-list-popover", inputs: { title: "title" }, host: { classAttribute: "fd-nested-list__popover" }, queries: [{ propertyName: "linkDirective", first: true, predicate: NestedLinkDirective, descendants: true }, { propertyName: "contentDirective", first: true, predicate: NestedListContentDirective, descendants: true }], viewQueries: [{ propertyName: "popoverComponent", first: true, predicate: PopoverComponent, descendants: true }], ngImport: i0, template: "<fd-popover\n    [placement]=\"placement()\"\n    [triggers]=\"['click']\"\n    [noArrow]=\"false\"\n    [isOpen]=\"open\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n>\n    <fd-popover-control>\n        <ng-content select=\"[fd-nested-list-link]\"></ng-content>\n        <ng-content select=\"[fd-nested-list-content]\"></ng-content>\n    </fd-popover-control>\n    <fd-popover-body class=\"fd-nested-list--text-only\">\n        <a fd-nested-list-link class=\"fd-nested-list__popover-header\">\n            <span fd-nested-list-title>{{ title }}</span>\n        </a>\n        <ng-content select=\"[fd-nested-list]\"></ng-content>\n        <ng-content select=\"fd-prepared-nested-list\"></ng-content>\n    </fd-popover-body>\n</fd-popover>\n", styles: [".fd-side-nav--condensed .fd-popover-container-custom .fd-nested-list__title{display:inline-flex}.fd-side-nav--condensed .fd-nested-list__popover-header{box-shadow:0 0 .25rem #00000026,inset 0 -.0625rem #d9d9d9}.fd-side-nav--condensed .fd-popover-custom{display:block}[dir=rtl] .fd-side-nav--condensed .fd-popover-container-custom .fd-nested-list__link,.fd-side-nav--condensed[dir=rtl] .fd-popover-container-custom .fd-nested-list__link{padding-left:1rem}\n"], dependencies: [{ kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "bodyRole", "bodyAriaLabelledBy", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["onClose"] }, { kind: "directive", type: NestedLinkDirective, selector: "[fdNestedLink], [fd-nested-list-link]", inputs: ["onClickCallback", "selected", "ariaDescribedby"], outputs: ["selectedChange"] }, { kind: "directive", type: NestedListTitleDirective, selector: "[fdNestedDirectivesTitle], [fd-nested-list-title]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListPopoverComponent, decorators: [{
            type: Component,
            args: [{ selector: 'fd-nested-list-popover', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        class: 'fd-nested-list__popover'
                    }, imports: [
                        PopoverComponent,
                        PopoverControlComponent,
                        PopoverBodyComponent,
                        NestedLinkDirective,
                        NestedListTitleDirective
                    ], template: "<fd-popover\n    [placement]=\"placement()\"\n    [triggers]=\"['click']\"\n    [noArrow]=\"false\"\n    [isOpen]=\"open\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n>\n    <fd-popover-control>\n        <ng-content select=\"[fd-nested-list-link]\"></ng-content>\n        <ng-content select=\"[fd-nested-list-content]\"></ng-content>\n    </fd-popover-control>\n    <fd-popover-body class=\"fd-nested-list--text-only\">\n        <a fd-nested-list-link class=\"fd-nested-list__popover-header\">\n            <span fd-nested-list-title>{{ title }}</span>\n        </a>\n        <ng-content select=\"[fd-nested-list]\"></ng-content>\n        <ng-content select=\"fd-prepared-nested-list\"></ng-content>\n    </fd-popover-body>\n</fd-popover>\n", styles: [".fd-side-nav--condensed .fd-popover-container-custom .fd-nested-list__title{display:inline-flex}.fd-side-nav--condensed .fd-nested-list__popover-header{box-shadow:0 0 .25rem #00000026,inset 0 -.0625rem #d9d9d9}.fd-side-nav--condensed .fd-popover-custom{display:block}[dir=rtl] .fd-side-nav--condensed .fd-popover-container-custom .fd-nested-list__link,.fd-side-nav--condensed[dir=rtl] .fd-popover-container-custom .fd-nested-list__link{padding-left:1rem}\n"] }]
        }], ctorParameters: () => [], propDecorators: { title: [{
                type: Input
            }], popoverComponent: [{
                type: ViewChild,
                args: [PopoverComponent]
            }], linkDirective: [{
                type: ContentChild,
                args: [NestedLinkDirective]
            }], contentDirective: [{
                type: ContentChild,
                args: [NestedListContentDirective]
            }] } });

function provideNestedListStateService() {
    // Nested list can be nested, and that will cause on each individual instance of NestedListStateService.
    return {
        provide: NestedListStateService,
        useFactory: () => inject(NestedListStateService, { skipSelf: true, optional: true }) ?? new NestedListStateService()
    };
}
/**
 * <div fd-nested-list>
 *  <div fd-nested-list>
 *  </div>
 * </div>
 */
class NestedListDirective {
    /** @hidden */
    constructor(_nestedItemService, _nestedListKeyboardService, _elementRef, _changeDetectionRef, _nestedListStateService, _contentDensityObserver) {
        this._nestedItemService = _nestedItemService;
        this._nestedListKeyboardService = _nestedListKeyboardService;
        this._elementRef = _elementRef;
        this._changeDetectionRef = _changeDetectionRef;
        this._nestedListStateService = _nestedListStateService;
        /** In case the user wants to no use icons for items in this list */
        this.textOnly = false;
        /** Aria defines role description for the Nested List Tree. */
        this.ariaRoledescriptionTree = 'Navigation List Tree';
        /** Aria defines role description for the Nested List MenuBar. */
        this.ariaRoledescriptionMenuBar = 'Navigation List Menu Bar';
        /** Aria defines aria label for the selected item when the list with disabled selection. */
        this.ariaLabelSelected = 'Selected';
        /** @hidden */
        this.fdNestedListItemClass = true;
        /** @hidden */
        this.hidden = false;
        /** @hidden */
        this._role = 'tree';
        /** @hidden */
        this._ariaRoledescription = this.ariaRoledescriptionTree;
        /** @hidden */
        this._ariaHaspopup = null;
        /** @hidden */
        this._tabindex = '-1';
        /** @hidden */
        this._translationResolver = new TranslationResolver();
        /** @hidden */
        this._langSignal = inject(FD_LANGUAGE_SIGNAL);
        /** @hidden */
        this._destroyRef = inject(DestroyRef);
        /** @hidden */
        this._injector = inject(Injector);
        if (this._nestedItemService) {
            this._nestedItemService.list = this;
        }
        _contentDensityObserver.subscribe();
    }
    /** @hidden */
    ngAfterContentInit() {
        let nestedLevel = this._getNestedLevel();
        /** If there is condensed mode, maximum 2nd level class of nest can be added */
        if (this._nestedListStateService.condensed) {
            nestedLevel = Math.min(...[nestedLevel, 2]);
        }
        this._setAccessibilityProperties(nestedLevel);
        // Register effect with explicit injector context
        effect(() => {
            const lang = this._langSignal();
            this._nestedListKeyboardService.refresh$.next();
            this._setAriaAttributes(nestedLevel, lang);
        }, { injector: this._injector });
        // React to nested items changes
        this.nestedItems.changes.pipe(startWith(undefined), takeUntilDestroyed(this._destroyRef)).subscribe(() => {
            const lang = this._langSignal();
            this._nestedListKeyboardService.refresh$.next();
            this._setAriaAttributes(nestedLevel, lang);
        });
        this._handleNestedLevel(nestedLevel);
    }
    /** @hidden */
    detectChanges() {
        this._changeDetectionRef.markForCheck();
    }
    /** @hidden */
    _handleNestedLevel(level) {
        /** Adding class with the nested level */
        this._elementRef.nativeElement.classList.add('level-' + level);
    }
    /**
     * @hidden
     * Method, that checks how deep is the list element
     */
    _getNestedLevel() {
        let element = this._elementRef.nativeElement;
        const parentElements = [];
        /** Method that gathers all of the parentNode elements of current NestedListDirective element */
        while (element.parentNode) {
            parentElements.unshift(element);
            element = element.parentNode;
        }
        /** Filter only elements, that has `fd-nested-list` directive attribute */
        const filteredParentElements = parentElements.filter((_element) => _element.hasAttribute('fd-nested-list'));
        return filteredParentElements.length;
    }
    /** @hidden */
    _setAriaAttributes(level, lang) {
        this.nestedItems.forEach((item, i) => {
            item._ariaLevel = level;
            if (!item.linkItem) {
                return;
            }
            else {
                item.linkItem.ariaDescribedby = this._nestedListHeader?.id || null;
                item.linkItem._ariaLabel = this._translationResolver.resolve(lang, 'coreNestedList.linkItemAriaLabel', {
                    itemDetails: item.linkItem.getTitle(),
                    index: i + 1, // TODO: this property has been deprecated and will be removed from translations
                    total: this.nestedItems.length, // TODO: this property has been deprecated and will be removed from translations
                    selectedDescription: !this._nestedListStateService.selectable && item.linkItem.selected
                        ? ', ' + this.ariaLabelSelected
                        : ''
                });
            }
        });
        this._changeDetectionRef.detectChanges();
    }
    /** @hidden */
    _setAccessibilityProperties(level) {
        if (this._nestedListStateService.condensed && level === 1) {
            this._ariaRoledescription = this.ariaRoledescriptionMenuBar;
        }
        if (level > 1 || (this._nestedItemService?.popover && !this._nestedListStateService.condensed)) {
            this._role = 'group';
            this._ariaRoledescription = null;
        }
        if (this._nestedItemService?.popover) {
            this._ariaHaspopup = 'tree';
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListDirective, deps: [{ token: NestedItemService, optional: true }, { token: NestedListKeyboardService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: NestedListStateService }, { token: i4.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: NestedListDirective, isStandalone: true, selector: "[fdNestedList], [fd-nested-list]", inputs: { textOnly: "textOnly", ariaRoledescriptionTree: "ariaRoledescriptionTree", ariaRoledescriptionMenuBar: "ariaRoledescriptionMenuBar", ariaLabelSelected: "ariaLabelSelected" }, host: { properties: { "class.fd-nested-list--text-only": "this.textOnly", "class.fd-nested-list": "this.fdNestedListItemClass", "attr.aria-hidden": "this.hidden", "attr.role": "this._role", "attr.aria-roledescription": "this._ariaRoledescription", "attr.aria-haspopup": "this._ariaHaspopup", "attr.tabindex": "this._tabindex" } }, providers: [
            contentDensityObserverProviders(),
            MenuKeyboardService,
            NestedListKeyboardService,
            provideNestedListStateService()
        ], queries: [{ propertyName: "_nestedListHeader", first: true, predicate: NestedListHeaderDirective, descendants: true }, { propertyName: "nestedItems", predicate: i0.forwardRef(() => NestedItemDirective) }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[fdNestedList], [fd-nested-list]',
                    providers: [
                        contentDensityObserverProviders(),
                        MenuKeyboardService,
                        NestedListKeyboardService,
                        provideNestedListStateService()
                    ],
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: NestedItemService, decorators: [{
                    type: Optional
                }] }, { type: NestedListKeyboardService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: NestedListStateService }, { type: i4.ContentDensityObserver }], propDecorators: { textOnly: [{
                type: Input
            }, {
                type: HostBinding,
                args: ['class.fd-nested-list--text-only']
            }], ariaRoledescriptionTree: [{
                type: Input
            }], ariaRoledescriptionMenuBar: [{
                type: Input
            }], ariaLabelSelected: [{
                type: Input
            }], fdNestedListItemClass: [{
                type: HostBinding,
                args: ['class.fd-nested-list']
            }], hidden: [{
                type: HostBinding,
                args: ['attr.aria-hidden']
            }], nestedItems: [{
                type: ContentChildren,
                args: [forwardRef(() => NestedItemDirective)]
            }], _nestedListHeader: [{
                type: ContentChild,
                args: [NestedListHeaderDirective]
            }], _role: [{
                type: HostBinding,
                args: ['attr.role']
            }], _ariaRoledescription: [{
                type: HostBinding,
                args: ['attr.aria-roledescription']
            }], _ariaHaspopup: [{
                type: HostBinding,
                args: ['attr.aria-haspopup']
            }], _tabindex: [{
                type: HostBinding,
                args: ['attr.tabindex']
            }] } });

/**
 * Component for internal usage, allows to generate the nested list from defined object.
 */
class PreparedNestedListComponent {
    constructor() {
        /**
         * @hidden
         * For internal usage.
         * Defines if the component is first
         */
        this.first = true;
        /** Defines if list should be displayed in condensed mode */
        this.condensed = false;
    }
    /**
     * In prepared nested list, nested items should be taken as reference of View, not Content.
     * There is direct reference to these directives here.
     */
    get nestedListDirective() {
        return this._nestedListDirective;
    }
    /** @hidden */
    _expandedChange(expanded, item) {
        item.expanded = expanded;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PreparedNestedListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: PreparedNestedListComponent, isStandalone: true, selector: "fd-prepared-nested-list", inputs: { first: "first", condensed: "condensed", list: "list" }, viewQueries: [{ propertyName: "_nestedListDirective", first: true, predicate: i0.forwardRef(() => NestedListDirective), descendants: true }], ngImport: i0, template: "<ul fd-nested-list [textOnly]=\"!!list?.textOnly\">\n    @for (item of list?.items; track item) {\n        @if (item.headerTitle) {\n            <li fd-nested-list-header>\n                {{ item.headerTitle }}\n            </li>\n        } @else {\n            <li fd-nested-list-item [expanded]=\"!!item.expanded\" (expandedChange)=\"_expandedChange($event, item)\">\n                @if (condensed && first && item.list) {\n                    <fd-nested-list-popover [title]=\"item.link?.title || ''\">\n                        <div fd-nested-list-content [selected]=\"!!item.link?.selected\">\n                            <ng-template\n                                [ngTemplateOutlet]=\"link\"\n                                [ngTemplateOutletContext]=\"{ item: item }\"\n                            ></ng-template>\n                            <button fd-nested-list-expand-icon></button>\n                        </div>\n                        @if (item.list) {\n                            <fd-prepared-nested-list [first]=\"false\" [list]=\"item.list\"></fd-prepared-nested-list>\n                        }\n                    </fd-nested-list-popover>\n                }\n                @if (!item.list) {\n                    <ng-template [ngTemplateOutlet]=\"link\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-template>\n                }\n                @if ((!condensed || !first) && item.list) {\n                    <div fd-nested-list-content>\n                        <ng-template [ngTemplateOutlet]=\"link\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-template>\n                        <button fd-nested-list-expand-icon></button>\n                    </div>\n                    @if (item.list) {\n                        <fd-prepared-nested-list [first]=\"false\" [list]=\"item.list\"></fd-prepared-nested-list>\n                    }\n                }\n                <ng-template let-item=\"item\" #link>\n                    @if (item.link) {\n                        <a\n                            fd-nested-list-link\n                            [onClickCallback]=\"item.link.callback\"\n                            [selected]=\"!item.list && item.link.selected\"\n                            [attr.href]=\"item.link.href ? item.link.href : null\"\n                            [routerLink]=\"item.link.routerLink ? item.link.routerLink : []\"\n                        >\n                            @if (item.link.icon) {\n                                <span fd-nested-list-icon [glyph]=\"item.link.icon\"></span>\n                            }\n                            <span fd-nested-list-title>{{ item.link.title }}</span>\n                        </a>\n                    }\n                </ng-template>\n            </li>\n        }\n    }\n</ul>\n", styles: [""], dependencies: [{ kind: "component", type: i0.forwardRef(() => PreparedNestedListComponent), selector: "fd-prepared-nested-list", inputs: ["first", "condensed", "list"] }, { kind: "directive", type: i0.forwardRef(() => NestedListDirective), selector: "[fdNestedList], [fd-nested-list]", inputs: ["textOnly", "ariaRoledescriptionTree", "ariaRoledescriptionMenuBar", "ariaLabelSelected"] }, { kind: "directive", type: i0.forwardRef(() => NestedListHeaderDirective), selector: "[fdNestedDirectivesHeader], [fd-nested-list-header]", inputs: ["id"] }, { kind: "directive", type: i0.forwardRef(() => NestedItemDirective), selector: "[fdNestedItem], [fd-nested-list-item]", inputs: ["expanded"], outputs: ["expandedChange", "keyboardTriggered"] }, { kind: "component", type: i0.forwardRef(() => NestedListPopoverComponent), selector: "fd-nested-list-popover", inputs: ["title"] }, { kind: "directive", type: i0.forwardRef(() => NestedListContentDirective), selector: "[fdNestedListContent], [fd-nested-list-content]", inputs: ["selected"], outputs: ["selectedChange", "keyboardTriggered", "clicked"] }, { kind: "directive", type: i0.forwardRef(() => NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => NestedListExpandIconComponent), selector: "[fdNestedListExpandIcon], [fd-nested-list-expand-icon]" }, { kind: "directive", type: i0.forwardRef(() => NestedLinkDirective), selector: "[fdNestedLink], [fd-nested-list-link]", inputs: ["onClickCallback", "selected", "ariaDescribedby"], outputs: ["selectedChange"] }, { kind: "directive", type: i0.forwardRef(() => RouterLink), selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i0.forwardRef(() => NestedListIconComponent), selector: "[fdNestedDirectivesIcon], [fd-nested-list-icon]", inputs: ["role"] }, { kind: "directive", type: i0.forwardRef(() => NestedListTitleDirective), selector: "[fdNestedDirectivesTitle], [fd-nested-list-title]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PreparedNestedListComponent, decorators: [{
            type: Component,
            args: [{ selector: 'fd-prepared-nested-list', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                        NestedListDirective,
                        NestedListHeaderDirective,
                        NestedItemDirective,
                        NestedListPopoverComponent,
                        NestedListContentDirective,
                        NgTemplateOutlet,
                        NestedListExpandIconComponent,
                        forwardRef(() => PreparedNestedListComponent),
                        NestedLinkDirective,
                        RouterLink,
                        NestedListIconComponent,
                        NestedListTitleDirective
                    ], template: "<ul fd-nested-list [textOnly]=\"!!list?.textOnly\">\n    @for (item of list?.items; track item) {\n        @if (item.headerTitle) {\n            <li fd-nested-list-header>\n                {{ item.headerTitle }}\n            </li>\n        } @else {\n            <li fd-nested-list-item [expanded]=\"!!item.expanded\" (expandedChange)=\"_expandedChange($event, item)\">\n                @if (condensed && first && item.list) {\n                    <fd-nested-list-popover [title]=\"item.link?.title || ''\">\n                        <div fd-nested-list-content [selected]=\"!!item.link?.selected\">\n                            <ng-template\n                                [ngTemplateOutlet]=\"link\"\n                                [ngTemplateOutletContext]=\"{ item: item }\"\n                            ></ng-template>\n                            <button fd-nested-list-expand-icon></button>\n                        </div>\n                        @if (item.list) {\n                            <fd-prepared-nested-list [first]=\"false\" [list]=\"item.list\"></fd-prepared-nested-list>\n                        }\n                    </fd-nested-list-popover>\n                }\n                @if (!item.list) {\n                    <ng-template [ngTemplateOutlet]=\"link\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-template>\n                }\n                @if ((!condensed || !first) && item.list) {\n                    <div fd-nested-list-content>\n                        <ng-template [ngTemplateOutlet]=\"link\" [ngTemplateOutletContext]=\"{ item: item }\"></ng-template>\n                        <button fd-nested-list-expand-icon></button>\n                    </div>\n                    @if (item.list) {\n                        <fd-prepared-nested-list [first]=\"false\" [list]=\"item.list\"></fd-prepared-nested-list>\n                    }\n                }\n                <ng-template let-item=\"item\" #link>\n                    @if (item.link) {\n                        <a\n                            fd-nested-list-link\n                            [onClickCallback]=\"item.link.callback\"\n                            [selected]=\"!item.list && item.link.selected\"\n                            [attr.href]=\"item.link.href ? item.link.href : null\"\n                            [routerLink]=\"item.link.routerLink ? item.link.routerLink : []\"\n                        >\n                            @if (item.link.icon) {\n                                <span fd-nested-list-icon [glyph]=\"item.link.icon\"></span>\n                            }\n                            <span fd-nested-list-title>{{ item.link.title }}</span>\n                        </a>\n                    }\n                </ng-template>\n            </li>\n        }\n    }\n</ul>\n" }]
        }], propDecorators: { first: [{
                type: Input
            }], condensed: [{
                type: Input
            }], list: [{
                type: Input
            }], _nestedListDirective: [{
                type: ViewChild,
                args: [forwardRef(() => NestedListDirective)]
            }] } });

const components = [
    NestedListDirective,
    NestedLinkDirective,
    NestedItemDirective,
    NestedListIconComponent,
    NestedListTitleDirective,
    NestedListHeaderDirective,
    NestedListPopoverComponent,
    PreparedNestedListComponent,
    NestedListExpandIconComponent,
    NestedListContentDirective
];
/**
 * @deprecated
 * Use direct imports of components and directives.
 */
class NestedListModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.0", ngImport: i0, type: NestedListModule, imports: [NestedListDirective,
            NestedLinkDirective,
            NestedItemDirective,
            NestedListIconComponent,
            NestedListTitleDirective,
            NestedListHeaderDirective,
            NestedListPopoverComponent,
            PreparedNestedListComponent,
            NestedListExpandIconComponent,
            NestedListContentDirective], exports: [NestedListDirective,
            NestedLinkDirective,
            NestedItemDirective,
            NestedListIconComponent,
            NestedListTitleDirective,
            NestedListHeaderDirective,
            NestedListPopoverComponent,
            PreparedNestedListComponent,
            NestedListExpandIconComponent,
            NestedListContentDirective] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListModule, providers: [MenuKeyboardService, NestedListKeyboardService, NestedListStateService], imports: [NestedListPopoverComponent,
            PreparedNestedListComponent,
            NestedListExpandIconComponent] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NestedListModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [...components],
                    exports: [...components],
                    providers: [MenuKeyboardService, NestedListKeyboardService, NestedListStateService]
                }]
        }] });

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

export { NestedItemDirective, NestedItemService, NestedLinkDirective, NestedListContentDirective, NestedListDirective, NestedListExpandIconComponent, NestedListHeaderDirective, NestedListIconComponent, NestedListKeyboardService, NestedListModule, NestedListPopoverComponent, NestedListStateService, NestedListTitleDirective, PreparedNestedListComponent };
//# sourceMappingURL=fundamental-ngx-core-nested-list.mjs.map
