import { Component, Input, HostBinding, Output, EventEmitter, ViewChild } from '@angular/core';
import { MenuComponent } from '../../controls/menu/menu.component';
import { HierarchyTreeComponent } from '../hierarchy/hierarchy-tree/hierarchy-tree.component';
import { Overlay } from '../view-overlay/view-overlay.component';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "../view-overlay/view-overlay.component";
import * as i3 from "../../controls/menu/menu.component";
import * as i4 from "../../controls/dropdown/dropdown.component";
import * as i5 from "../hierarchy/hierarchy-tree/hierarchy-tree.component";
import * as i6 from "@ngx-translate/core";
export class TreeComponent {
    /**
     * The ID of the component, bound to the host element's id attribute and passed
     * to child components
     */
    set id(value) {
        this._id = value;
        this.attrId = value;
    }
    ;
    get id() {
        return this._id;
    }
    constructor() {
        /** The value of the host elements id attribute */
        this.attrId = '';
        this._id = '';
        /** The tree's title displayed in the header */
        this.treeTitle = '';
        /** Hides the tree header when set to true */
        this.hideTreeHeader = false;
        /** Used when the tree is in menu mode to tell the menu if it should maintain the selected item
         *  Useful in side nav components where this tree component may exist alongside other trees or menus
         *  used for navigation. If this tree is in menu mode you would want this set to false so when you select an item
         *  from a sibling navigation element the selection will not be maintained.
         */
        this.treeMenuMaintainSelectedItem = true;
        /** Tree overlay */
        this.status = new Overlay('hasData');
        /** Display the tree items with a MenuComponent or a HierarchyTreeComponent */
        this.type = 'hierarchy';
        /** Tree dropdown menu overlay */
        this.menuStatus = new Overlay('hasData');
        /** The menu item template */
        this.menuTemplateType = "checkAndLabel";
        /**
         * When true, the space for the icon is preserved for menu items that do not have icons.
         * Only applicable for iconAndLabel menus. Not applicable to hierarchy trees.
         */
        this.preserveIconSpace = false;
        /** Emits the item currently selected item in the tree */
        this.treeSelection = new EventEmitter();
        /** Emits when a hierarchy tree item is expanded as a hook to load the item's children */
        this.getTreeItemChildren = new EventEmitter();
        /** Emits when a hierarchy tree item is expanded or collapsed */
        this.treeItemToggled = new EventEmitter();
        this.templateType = 'label';
    }
    /** Emits when a tree item is selected */
    onItemSelected(item) {
        this.treeSelection.emit(item);
    }
    /** Emits when a hierarchy tree item is expanded to load the item's children */
    onHierarchyGetItemChildren(item) {
        this.getTreeItemChildren.emit(item);
    }
    /** Emits when a hierarchy tree item is expanded or collapsed */
    onHierarchyItemToggled(item) {
        this.treeItemToggled.emit(item);
    }
    /** Scroll to the tree item that is currently selected. */
    scrollToSelectedItem() {
        if (this.menuComponent) {
            this.menuComponent.scrollToSelectedItem();
        }
        if (this.hierarchyTreeComponent) {
            this.hierarchyTreeComponent.scrollToSelectedItem();
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TreeComponent, selector: "ec-tree", inputs: { id: "id", treeTitle: "treeTitle", hideTreeHeader: "hideTreeHeader", treeItems: "treeItems", treeHierarchyHideRootNode: "treeHierarchyHideRootNode", treeHierarchy: "treeHierarchy", treeMenuMaintainSelectedItem: "treeMenuMaintainSelectedItem", customTreeMenuTemplate: "customTreeMenuTemplate", customHierarchyItemTemplate: "customHierarchyItemTemplate", status: "status", type: "type", menuItems: "menuItems", menuStatus: "menuStatus", menuTemplateType: "menuTemplateType", preserveIconSpace: "preserveIconSpace", templateType: "templateType" }, outputs: { treeSelection: "treeSelection", getTreeItemChildren: "getTreeItemChildren", treeItemToggled: "treeItemToggled" }, host: { properties: { "attr.id": "this.attrId" } }, viewQueries: [{ propertyName: "menuComponent", first: true, predicate: MenuComponent, descendants: true }, { propertyName: "hierarchyTreeComponent", first: true, predicate: HierarchyTreeComponent, descendants: true }], ngImport: i0, template: "<header *ngIf=\"!hideTreeHeader\"\r\n        class=\"flex-shrink d-flex align-items-center\">\r\n  <h2 id=\"{{id}}_title\"\r\n      class=\"flex-grow mr-2 text-heading-1\">{{treeTitle | translate}}</h2>\r\n  <ec-dropdown *ngIf=\"menuItems?.length\"\r\n               id=\"{{id}}_dropdown\"\r\n               class=\"flex-shrink\"\r\n               icon=\"icon-menu\"\r\n               [menuTemplateType]=\"menuTemplateType\"\r\n               menuPosition=\"left\"\r\n               [status]=\"menuStatus\"\r\n               [popupFixed]=\"true\"\r\n               [showArrow]=\"false\"\r\n               [menuMinWidth]=\"240\"\r\n               [items]=\"menuItems\">\r\n  </ec-dropdown>\r\n</header>\r\n\r\n<div class=\"flex-grow d-flex\"\r\n     ecOverlay\r\n     [status]=\"status?.status\"\r\n     [message]=\"status?.message\"\r\n     [displayAsMask]=\"true\">\r\n  <ng-container *ngIf=\"type === 'menu'\">\r\n    <ec-menu [id]=\"id\"\r\n             [items]=\"treeItems\"\r\n             [templateType]=\"templateType\"\r\n             [maintainSelectedItem]=\"treeMenuMaintainSelectedItem\"\r\n             [truncateItems]=\"true\"\r\n             (selectedChanged)=\"onItemSelected($event)\"\r\n             [customMenuTemplate]=\"customTreeMenuTemplate ? customTreeMenuTemplate : undefined\"\r\n             [preserveIconSpace]=\"preserveIconSpace\"\r\n             class=\"flex-grow\">\r\n    </ec-menu>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"type === 'hierarchy'\">\r\n    <ec-hierarchy-tree [id]=\"id\"\r\n                       [rootNode]=\"treeHierarchy\"\r\n                       [hideRootNode]=\"treeHierarchyHideRootNode\"\r\n                       (getItemChildren)=\"onHierarchyGetItemChildren($event)\"\r\n                       (itemToggled)=\"onHierarchyItemToggled($event)\"\r\n                       (itemSelected)=\"onItemSelected($event)\"\r\n                       [customItemTemplate]=\"customHierarchyItemTemplate\"\r\n                       class=\"flex-grow d-flex\">\r\n    </ec-hierarchy-tree>\r\n  </ng-container>\r\n</div>", styles: [":host{display:flex;flex-direction:column}header{height:var(--ec-tree-height-header, 3rem);background-color:var(--ec-tree-background-color, var(--ec-background-color));padding:var(--ec-tree-padding-header, 0 .25rem 0 .5rem);border-bottom:var(--ec-tree-border-bottom-header, var(--ec-border-width) solid var(--ec-border-color))}ec-dropdown.fill{height:var(--ec-tree-height-header, 3rem);width:var(--ec-tree-height-header, 3rem)}ec-menu,ec-hierarchy-tree{--ec-menu-background-color: var(--ec-tree-background-color)}[ecOverlay]{--ec-overlay-background-color: var(--ec-tree-background-color)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: i3.MenuComponent, selector: "ec-menu", inputs: ["id", "items", "selected", "parent", "templateType", "customMenuTemplate", "title", "showNoItems", "noDataText", "enableKeyNav", "highlightedItem", "maintainSelectedItem", "truncateItems", "preserveIconSpace", "dropdownToggleButton"], outputs: ["selectedChanged", "menuClosed"] }, { kind: "component", type: i4.DropdownComponent, selector: "ec-dropdown", inputs: ["id", "autofocus", "status", "disabled", "label", "icon", "buttonType", "buttonAlignment", "buttonTitle", "tabindex", "showArrow", "items", "menuTemplateType", "menuTitle", "menuHeight", "menuWidth", "menuMinWidth", "menuPosition", "menuFooter", "popupFixed", "buttonCustomTemplate", "pending"], outputs: ["itemSelected", "popupOpened"] }, { kind: "component", type: i5.HierarchyTreeComponent, selector: "ec-hierarchy-tree", inputs: ["id", "hideRootNode", "customItemTemplate"], outputs: ["itemSelected"] }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TreeComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ec-tree', template: "<header *ngIf=\"!hideTreeHeader\"\r\n        class=\"flex-shrink d-flex align-items-center\">\r\n  <h2 id=\"{{id}}_title\"\r\n      class=\"flex-grow mr-2 text-heading-1\">{{treeTitle | translate}}</h2>\r\n  <ec-dropdown *ngIf=\"menuItems?.length\"\r\n               id=\"{{id}}_dropdown\"\r\n               class=\"flex-shrink\"\r\n               icon=\"icon-menu\"\r\n               [menuTemplateType]=\"menuTemplateType\"\r\n               menuPosition=\"left\"\r\n               [status]=\"menuStatus\"\r\n               [popupFixed]=\"true\"\r\n               [showArrow]=\"false\"\r\n               [menuMinWidth]=\"240\"\r\n               [items]=\"menuItems\">\r\n  </ec-dropdown>\r\n</header>\r\n\r\n<div class=\"flex-grow d-flex\"\r\n     ecOverlay\r\n     [status]=\"status?.status\"\r\n     [message]=\"status?.message\"\r\n     [displayAsMask]=\"true\">\r\n  <ng-container *ngIf=\"type === 'menu'\">\r\n    <ec-menu [id]=\"id\"\r\n             [items]=\"treeItems\"\r\n             [templateType]=\"templateType\"\r\n             [maintainSelectedItem]=\"treeMenuMaintainSelectedItem\"\r\n             [truncateItems]=\"true\"\r\n             (selectedChanged)=\"onItemSelected($event)\"\r\n             [customMenuTemplate]=\"customTreeMenuTemplate ? customTreeMenuTemplate : undefined\"\r\n             [preserveIconSpace]=\"preserveIconSpace\"\r\n             class=\"flex-grow\">\r\n    </ec-menu>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"type === 'hierarchy'\">\r\n    <ec-hierarchy-tree [id]=\"id\"\r\n                       [rootNode]=\"treeHierarchy\"\r\n                       [hideRootNode]=\"treeHierarchyHideRootNode\"\r\n                       (getItemChildren)=\"onHierarchyGetItemChildren($event)\"\r\n                       (itemToggled)=\"onHierarchyItemToggled($event)\"\r\n                       (itemSelected)=\"onItemSelected($event)\"\r\n                       [customItemTemplate]=\"customHierarchyItemTemplate\"\r\n                       class=\"flex-grow d-flex\">\r\n    </ec-hierarchy-tree>\r\n  </ng-container>\r\n</div>", styles: [":host{display:flex;flex-direction:column}header{height:var(--ec-tree-height-header, 3rem);background-color:var(--ec-tree-background-color, var(--ec-background-color));padding:var(--ec-tree-padding-header, 0 .25rem 0 .5rem);border-bottom:var(--ec-tree-border-bottom-header, var(--ec-border-width) solid var(--ec-border-color))}ec-dropdown.fill{height:var(--ec-tree-height-header, 3rem);width:var(--ec-tree-height-header, 3rem)}ec-menu,ec-hierarchy-tree{--ec-menu-background-color: var(--ec-tree-background-color)}[ecOverlay]{--ec-overlay-background-color: var(--ec-tree-background-color)}\n"] }]
        }], ctorParameters: () => [], propDecorators: { attrId: [{
                type: HostBinding,
                args: ['attr.id']
            }], id: [{
                type: Input
            }], treeTitle: [{
                type: Input
            }], hideTreeHeader: [{
                type: Input
            }], treeItems: [{
                type: Input
            }], treeHierarchyHideRootNode: [{
                type: Input
            }], treeHierarchy: [{
                type: Input
            }], treeMenuMaintainSelectedItem: [{
                type: Input
            }], customTreeMenuTemplate: [{
                type: Input
            }], customHierarchyItemTemplate: [{
                type: Input
            }], status: [{
                type: Input
            }], type: [{
                type: Input
            }], menuItems: [{
                type: Input
            }], menuStatus: [{
                type: Input
            }], menuTemplateType: [{
                type: Input
            }], preserveIconSpace: [{
                type: Input
            }], treeSelection: [{
                type: Output
            }], getTreeItemChildren: [{
                type: Output
            }], treeItemToggled: [{
                type: Output
            }], menuComponent: [{
                type: ViewChild,
                args: [MenuComponent]
            }], hierarchyTreeComponent: [{
                type: ViewChild,
                args: [HierarchyTreeComponent]
            }], templateType: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 