import { DataModelTreeDisplayType } from './data-model-tree-enums';
import { Component, Input, ViewChild, ViewEncapsulation, Output, EventEmitter } from '@angular/core';
import { MatAccordion } from '@angular/material/expansion';
import { DataModel } from '../data-model/data-model';
import { Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
import * as i3 from "@angular/material/expansion";
import * as i4 from "@angular/material/icon";
import * as i5 from "./categories-tree/categories-tree.component";
import * as i6 from "@angular/cdk/drag-drop";
import * as i7 from "./attributes-dragdrop-layout/attributes-dragdrop-layout.component";
import * as i8 from "./attributes-selection-layout/attributes-selection-layout.component";
import * as i9 from "../../axo-utils/field-list-search-pipe";
function DataModelTreeComponent_div_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 12);
    i0.ɵɵtext(1, "Fields");
    i0.ɵɵelementEnd();
} }
const _c0 = function (a0) { return { "search-icon": a0 }; };
function DataModelTreeComponent_button_5_Template(rf, ctx) { if (rf & 1) {
    const _r7 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "button", 13);
    i0.ɵɵlistener("click", function DataModelTreeComponent_button_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r6 = i0.ɵɵnextContext(); return ctx_r6.enableSearch(); });
    i0.ɵɵelement(1, "mat-icon", 14);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(2, _c0, ctx_r1.showSearchBox))("svgIcon", "heroicons_solid:search");
} }
function DataModelTreeComponent_mat_icon_7_Template(rf, ctx) { if (rf & 1) {
    const _r9 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "mat-icon", 15);
    i0.ɵɵlistener("click", function DataModelTreeComponent_mat_icon_7_Template_mat_icon_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r8 = i0.ɵɵnextContext(); return ctx_r8.clear(); });
    i0.ɵɵtext(1, "clear");
    i0.ɵɵelementEnd();
} }
function DataModelTreeComponent_button_8_Template(rf, ctx) { if (rf & 1) {
    const _r11 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "button", 16);
    i0.ɵɵlistener("click", function DataModelTreeComponent_button_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(); return ctx_r10.enableSearch(); });
    i0.ɵɵelement(1, "mat-icon", 17);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("svgIcon", "heroicons_solid:search");
} }
function DataModelTreeComponent_ng_container_11_Template(rf, ctx) { if (rf & 1) {
    const _r13 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "lib-categories-tree", 18);
    i0.ɵɵlistener("categorySelected", function DataModelTreeComponent_ng_container_11_Template_lib_categories_tree_categorySelected_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r12 = i0.ɵɵnextContext(); return ctx_r12.categorySelected.emit($event); })("categoryDeselected", function DataModelTreeComponent_ng_container_11_Template_lib_categories_tree_categoryDeselected_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r14 = i0.ɵɵnextContext(); return ctx_r14.categoryDeselected.emit($event); });
    i0.ɵɵelementEnd();
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const ctx_r4 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("categories", ctx_r4.categories)("searchedTerm", ctx_r4.searchedTerm);
} }
function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_ng_container_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelement(1, "lib-attributes-dragdrop-layout", 24);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const entity_r15 = i0.ɵɵnextContext(4).$implicit;
    const ctx_r19 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("attributes", entity_r15.columns)("searchedTerm", ctx_r19.searchedTerm);
} }
function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_ng_container_3_Template(rf, ctx) { if (rf & 1) {
    const _r23 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "lib-attributes-selection-layout", 25);
    i0.ɵɵlistener("attributeSelected", function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_ng_container_3_Template_lib_attributes_selection_layout_attributeSelected_1_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r22 = i0.ɵɵnextContext(5); return ctx_r22.attributeSelected.emit($event); })("attributeDeselected", function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_ng_container_3_Template_lib_attributes_selection_layout_attributeDeselected_1_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r24 = i0.ɵɵnextContext(5); return ctx_r24.attributeDeselected.emit($event); });
    i0.ɵɵelementEnd();
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const entity_r15 = i0.ɵɵnextContext(4).$implicit;
    const ctx_r20 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("attributes", entity_r15.columns)("searchedTerm", ctx_r20.searchedTerm);
} }
function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementContainerStart(1, 22);
    i0.ɵɵtemplate(2, DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_ng_container_2_Template, 2, 2, "ng-container", 23);
    i0.ɵɵtemplate(3, DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_ng_container_3_Template, 2, 2, "ng-container", 23);
    i0.ɵɵelementContainerEnd();
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const ctx_r18 = i0.ɵɵnextContext(4);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngSwitch", ctx_r18.displayMode);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngSwitchCase", ctx_r18.dataModelTreeDisplayType.dragDropList);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngSwitchCase", ctx_r18.dataModelTreeDisplayType.selectionList);
} }
function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_Template(rf, ctx) { if (rf & 1) {
    const _r28 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "mat-expansion-panel", 20);
    i0.ɵɵlistener("closed", function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_Template_mat_expansion_panel_closed_0_listener() { i0.ɵɵrestoreView(_r28); const entity_r15 = i0.ɵɵnextContext(2).$implicit; return entity_r15.expanded = false; })("opened", function DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_Template_mat_expansion_panel_opened_0_listener() { i0.ɵɵrestoreView(_r28); const entity_r15 = i0.ɵɵnextContext(2).$implicit; return entity_r15.expanded = true; });
    i0.ɵɵelementStart(1, "mat-expansion-panel-header");
    i0.ɵɵelementStart(2, "label", 21);
    i0.ɵɵtext(3);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵtemplate(4, DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_ng_container_4_Template, 4, 3, "ng-container", 10);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const entity_r15 = i0.ɵɵnextContext(2).$implicit;
    const ctx_r17 = i0.ɵɵnextContext();
    i0.ɵɵproperty("cdkDropListDisabled", ctx_r17.displayMode === ctx_r17.dataModelTreeDisplayType.dragDropList)("cdkDropListData", entity_r15.attributes)("cdkDropListConnectedTo", ctx_r17.arrtributeDropZoneList);
    i0.ɵɵadvance(3);
    i0.ɵɵtextInterpolate1(" ", entity_r15.formName, " ");
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", entity_r15.expanded);
} }
function DataModelTreeComponent_ng_container_12_ng_container_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, DataModelTreeComponent_ng_container_12_ng_container_1_mat_expansion_panel_1_Template, 5, 5, "mat-expansion-panel", 19);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const entity_r15 = i0.ɵɵnextContext().$implicit;
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", (entity_r15.columns == null ? null : entity_r15.columns.length) && !entity_r15.isManyToManyTable);
} }
function DataModelTreeComponent_ng_container_12_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, DataModelTreeComponent_ng_container_12_ng_container_1_Template, 2, 1, "ng-container", 10);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const entity_r15 = ctx.$implicit;
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", !entity_r15.isManyToManyTable && !entity_r15.hidden);
} }
const _c1 = function (a0) { return { "pb-2": a0 }; };
const _c2 = function (a0) { return { "search-field-border": a0 }; };
export class DataModelTreeComponent {
    /**
     * Constructor
     */
    constructor() {
        this.displayMode = DataModelTreeDisplayType.dragDropList;
        //---------------<Outputs>------------------------
        this.attributeSelected = new EventEmitter();
        this.attributeDeselected = new EventEmitter();
        this.categorySelected = new EventEmitter();
        this.categoryDeselected = new EventEmitter();
        // ----------------<Component Variables>----------
        this.showSearchBox = false;
        this.searchInputText = '';
        this.searchedTerm = '';
        this.dataModelTreeDisplayType = DataModelTreeDisplayType;
        this.searchSubscriber = new Subject();
    }
    /**
     * OnChange
     *
     * @param changes
     */
    ngOnChanges(changes) {
        this.dataModelProcess = new DataModel(this.dataModel);
    }
    /**
     * On Init Life cycle hook.
     */
    ngOnInit() {
        this.subscribers();
    }
    /**
     * Subscribers Should be implemented here
     */
    subscribers() {
        this.searchSubscriber
            .pipe(debounceTime(700))
            .pipe(distinctUntilChanged())
            .subscribe((text) => {
            this.dataModel.entities = (new DataModel(this.dataModelProcess)).entities;
            this.searchedTerm = text;
            this.applyFilter();
        });
    }
    /**
     * OnDestroy life cycle hook.
     */
    ngOnDestroy() {
    }
    /**
     * enableSearch() - enables the search input for the user
     */
    enableSearch() {
        this.showSearchBox = !this.showSearchBox;
        document.getElementById('data-model-tree-field-search').focus();
    }
    /**
     * Show search bar
     */
    search() {
        this.searchSubscriber.next(this.searchInputText);
    }
    /**
     * Apply Search On Fields
     *
     * @param filterText
     */
    applyFilter() {
        setTimeout(() => {
            if (this.searchedTerm === '') {
                this.accordion.closeAll();
            }
            else {
                this.accordion.openAll();
            }
        });
    }
    /**
     * Clear and Hide search Bar
     */
    clear() {
        this.searchSubscriber.next("");
        this.showSearchBox = !this.showSearchBox;
        this.searchInputText = "";
    }
}
DataModelTreeComponent.ɵfac = function DataModelTreeComponent_Factory(t) { return new (t || DataModelTreeComponent)(); };
DataModelTreeComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DataModelTreeComponent, selectors: [["lib-data-model-tree"]], viewQuery: function DataModelTreeComponent_Query(rf, ctx) { if (rf & 1) {
        i0.ɵɵviewQuery(MatAccordion, 5);
    } if (rf & 2) {
        let _t;
        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.accordion = _t.first);
    } }, inputs: { dataModel: "dataModel", categories: "categories", displayMode: "displayMode", attributeDropZoneList: "attributeDropZoneList" }, outputs: { attributeSelected: "attributeSelected", attributeDeselected: "attributeDeselected", categorySelected: "categorySelected", categoryDeselected: "categoryDeselected" }, features: [i0.ɵɵNgOnChangesFeature], decls: 14, vars: 18, consts: [[1, "add-filter-title", "axo-font"], [1, "flex", "items-center", "sticky", "justify-end", "top-0", "pt-4", "gap-3", "bg-white", "px-6", "z-10", 3, "ngClass"], ["class", "axo-font text-f fields-title", 4, "ngIf"], [1, "search-field", 3, "ngClass"], [3, "click", 4, "ngIf"], ["id", "data-model-tree-field-search", "autocomplete", "off", "placeholder", "Search...", "matInput", "", 1, "search-bar", "chart-title", "h-8", 3, "ngModel", "input", "ngModelChange"], ["class", "clear_icon", 3, "click", 4, "ngIf"], ["class", "flex items-center pr-1 icon-btn", 3, "click", 4, "ngIf"], [1, "px-6", "pt-2", "pb-8", "fields-max-vh", "customscroll"], ["multi", "", 1, "left-menu-mat-tree"], [4, "ngIf"], [4, "ngFor", "ngForOf"], [1, "axo-font", "text-f", "fields-title"], [3, "click"], [1, "search-icon", "text-base", "flex", "justify-center", "aligned", "items-center", 3, "ngClass", "svgIcon"], [1, "clear_icon", 3, "click"], [1, "flex", "items-center", "pr-1", "icon-btn", 3, "click"], [1, "search-icon", 3, "svgIcon"], [3, "categories", "searchedTerm", "categorySelected", "categoryDeselected"], ["cdkDropList", "", "cdkDropListSortingDisabled", "", 3, "cdkDropListDisabled", "cdkDropListData", "cdkDropListConnectedTo", "closed", "opened", 4, "ngIf"], ["cdkDropList", "", "cdkDropListSortingDisabled", "", 3, "cdkDropListDisabled", "cdkDropListData", "cdkDropListConnectedTo", "closed", "opened"], [1, "axo-font", "font-normal"], [3, "ngSwitch"], [4, "ngSwitchCase"], [3, "attributes", "searchedTerm"], [3, "attributes", "searchedTerm", "attributeSelected", "attributeDeselected"]], template: function DataModelTreeComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵelementStart(0, "div", 0);
        i0.ɵɵtext(1, "Add Filters");
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(2, "div", 1);
        i0.ɵɵtemplate(3, DataModelTreeComponent_div_3_Template, 2, 0, "div", 2);
        i0.ɵɵelementStart(4, "div", 3);
        i0.ɵɵtemplate(5, DataModelTreeComponent_button_5_Template, 2, 4, "button", 4);
        i0.ɵɵelementStart(6, "input", 5);
        i0.ɵɵlistener("input", function DataModelTreeComponent_Template_input_input_6_listener() { return ctx.search(); })("ngModelChange", function DataModelTreeComponent_Template_input_ngModelChange_6_listener($event) { return ctx.searchInputText = $event; });
        i0.ɵɵelementEnd();
        i0.ɵɵtemplate(7, DataModelTreeComponent_mat_icon_7_Template, 2, 0, "mat-icon", 6);
        i0.ɵɵtemplate(8, DataModelTreeComponent_button_8_Template, 2, 1, "button", 7);
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
        i0.ɵɵelementStart(9, "div", 8);
        i0.ɵɵelementStart(10, "mat-accordion", 9);
        i0.ɵɵtemplate(11, DataModelTreeComponent_ng_container_11_Template, 2, 2, "ng-container", 10);
        i0.ɵɵtemplate(12, DataModelTreeComponent_ng_container_12_Template, 2, 1, "ng-container", 11);
        i0.ɵɵpipe(13, "fieldListSearch");
        i0.ɵɵelementEnd();
        i0.ɵɵelementEnd();
    } if (rf & 2) {
        i0.ɵɵadvance(2);
        i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(14, _c1, ctx.showSearchBox));
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", !ctx.showSearchBox);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(16, _c2, ctx.showSearchBox));
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", ctx.showSearchBox);
        i0.ɵɵadvance(1);
        i0.ɵɵstyleProp("width", !ctx.showSearchBox ? "0" : "100%");
        i0.ɵɵproperty("ngModel", ctx.searchInputText);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", ctx.showSearchBox);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", !ctx.showSearchBox);
        i0.ɵɵadvance(3);
        i0.ɵɵproperty("ngIf", ctx.categories.length);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind2(13, 11, ctx.dataModel.entities, ctx.searchedTerm));
    } }, directives: [i1.NgClass, i1.NgIf, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MatAccordion, i1.NgForOf, i4.MatIcon, i5.CategoriesTreeComponent, i3.MatExpansionPanel, i6.CdkDropList, i3.MatExpansionPanelHeader, i1.NgSwitch, i1.NgSwitchCase, i7.AttributesDragdropLayoutComponent, i8.AttributesSelectionLayoutComponent], pipes: [i9.FieldListSearchPipe], styles: ["lib-data-model-tree{height:100%;display:flex;flex-direction:column}lib-data-model-tree .ax-mat-tree-draggable-invisible{display:none}lib-data-model-tree .ax-mat-tree-draggable ul,lib-data-model-tree .ax-mat-tree-draggable li{margin-top:0;margin-bottom:0;list-style-type:none}lib-data-model-tree .ax-mat-tree-draggable .mat-nested-tree-node div[role=group]{padding-left:20px}lib-data-model-tree .ax-mat-tree-draggable div[role=group]>.mat-tree-node{padding-left:20px}lib-data-model-tree .ax-mat-tree-draggable div[role=group]>.mat-tree-node .dragBackG{left:40px!important}lib-data-model-tree .cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}lib-data-model-tree .cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}lib-data-model-tree .field-placeholder{display:inline;position:absolute}lib-data-model-tree .dragBackG{position:absolute;left:80px}lib-data-model-tree .ax-cdk-draggable{z-index:100;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}lib-data-model-tree .sg-icon{height:12px;width:12px}lib-data-model-tree .fields-max-vh{overflow:auto}lib-data-model-tree .text-f{font-size:17px;line-height:24px;letter-spacing:.6px}lib-data-model-tree .text-e{font-size:14px;line-height:20px;letter-spacing:.51px}lib-data-model-tree .text-att{font-size:12px;line-height:18px;letter-spacing:.25px}lib-data-model-tree ::placeholder{font-size:12px}lib-data-model-tree .clear_icon{cursor:pointer;color:#000!important;background:transparent!important;font-size:18px;width:18px;min-width:18px;opacity:.6}lib-data-model-tree .clear_icon:hover{opacity:.9}lib-data-model-tree .search-bar{height:2.6rem;margin-top:0}lib-data-model-tree .fields-title{font-weight:500;position:sticky;top:48px;background-color:#fff;z-index:9}lib-data-model-tree .add-filter-title{font-size:17px;font-weight:500;padding:1.5rem 1.3rem 0 1.5rem}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel{box-shadow:none!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel:hover{box-shadow:none!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel .mat-expansion-panel-header{padding:0!important;height:auto!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel .mat-expansion-panel-header:hover{background-color:#fcfdff!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel .mat-expansion-panel-body{padding:0 8px}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel.mat-expanded,lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel:hover{box-shadow:none!important}lib-data-model-tree .search-field{display:flex;align-items:center;width:100%;justify-content:end}lib-data-model-tree .search-field .search-icon{min-height:18px;min-width:18px;height:18px;width:18px}.entity-tree-container{cursor:grab}@media only screen and (max-width: 1024px){.fields-list-container{min-width:250px}}\n"], encapsulation: 2 });
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DataModelTreeComponent, [{
        type: Component,
        args: [{ selector: 'lib-data-model-tree', encapsulation: ViewEncapsulation.None, template: "<div class=\"add-filter-title axo-font\">Add Filters</div>\n<div class=\"flex items-center sticky justify-end top-0 pt-4 gap-3 bg-white px-6 z-10\" [ngClass]=\"{'pb-2' : showSearchBox}\">\n    <div class=\"axo-font text-f fields-title\" *ngIf=\"!showSearchBox\">Fields</div>\n\t <div class=\"search-field\" [ngClass]=\"{'search-field-border' : showSearchBox}\">\n        <button  (click)=\"enableSearch()\" *ngIf=\"showSearchBox\"> <mat-icon [ngClass]=\"{'search-icon' : showSearchBox}\" class=\"search-icon text-base flex justify-center aligned items-center\" [svgIcon]=\"'heroicons_solid:search'\"></mat-icon></button>\n        <input id=\"data-model-tree-field-search\" (input)=\"search()\" autocomplete=\"off\"  placeholder=\"Search...\" [(ngModel)]=\"searchInputText\" matInput class=\"search-bar chart-title h-8\"  [style.width]=\"!showSearchBox ? '0' : '100%'\" />\n        <mat-icon (click)=\"clear()\" *ngIf=\"showSearchBox\" class=\"clear_icon\">clear</mat-icon>\n        <button (click)=\"enableSearch()\"  *ngIf=\"!showSearchBox\" class=\"flex items-center pr-1 icon-btn\"> <mat-icon class=\"search-icon\" [svgIcon]=\"'heroicons_solid:search'\"></mat-icon></button>\n\t</div>\n</div>\n\n<div class=\"px-6 pt-2 pb-8 fields-max-vh customscroll\">\n    <!-- Iterate each entity and render tree for each of them -->\n    <mat-accordion class=\"left-menu-mat-tree\" multi>\n        <!-- Filter Catagories -->\n        <ng-container *ngIf=\"categories.length\">\n            <lib-categories-tree [categories]=\"categories\" [searchedTerm]=\"searchedTerm\" (categorySelected)=\"categorySelected.emit($event)\" (categoryDeselected)=\"categoryDeselected.emit($event)\"></lib-categories-tree>\n        </ng-container>\n        <!-- Basic Filters -->\n        <ng-container  *ngFor=\"let entity of dataModel.entities | fieldListSearch: searchedTerm\">\n            <ng-container *ngIf=\"!entity.isManyToManyTable && !entity.hidden\">\n                <!-- Mat expansion panel -->\n                <mat-expansion-panel (closed)=\"entity.expanded = false\" (opened)=\"entity.expanded = true\" [cdkDropListDisabled] = \"displayMode === dataModelTreeDisplayType.dragDropList\" cdkDropList [cdkDropListData]=\"entity.attributes\" cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"arrtributeDropZoneList\" *ngIf=\"entity.columns?.length && !entity.isManyToManyTable\">\n                    <!-- Mat expansion panel header -->\n                    <mat-expansion-panel-header>\n                        <label class=\"axo-font font-normal\">\n                            {{ entity.formName }}\n                        </label>\n                    </mat-expansion-panel-header>\n                    <!-- Mat Selection List -->\n                    <ng-container *ngIf=\"entity.expanded\">\n                        <ng-container [ngSwitch]=\"displayMode\">\n                            <ng-container *ngSwitchCase=\"dataModelTreeDisplayType.dragDropList\">\n                                <!-- Attributes rendering  -->\n                                <!-- DragDrop and Without selection box lay out -->\n                                <lib-attributes-dragdrop-layout [attributes]=\"entity.columns\" [searchedTerm]=\"searchedTerm\"></lib-attributes-dragdrop-layout>\n                            </ng-container>\n                            <ng-container *ngSwitchCase=\"dataModelTreeDisplayType.selectionList\">\n                                <lib-attributes-selection-layout [attributes]=\"entity.columns\"  [searchedTerm]=\"searchedTerm\" (attributeSelected)=\"attributeSelected.emit($event)\" (attributeDeselected)=\"attributeDeselected.emit($event)\"> </lib-attributes-selection-layout>\n                            </ng-container>\n\n                        </ng-container>\n                    </ng-container>\n                </mat-expansion-panel>\n            </ng-container>\n            <!-- Mat expansion panel -->\n        </ng-container>\n    </mat-accordion>\n    <!-- Expandable entities tree ends here -->\n</div>\n", styles: ["lib-data-model-tree{height:100%;display:flex;flex-direction:column}lib-data-model-tree .ax-mat-tree-draggable-invisible{display:none}lib-data-model-tree .ax-mat-tree-draggable ul,lib-data-model-tree .ax-mat-tree-draggable li{margin-top:0;margin-bottom:0;list-style-type:none}lib-data-model-tree .ax-mat-tree-draggable .mat-nested-tree-node div[role=group]{padding-left:20px}lib-data-model-tree .ax-mat-tree-draggable div[role=group]>.mat-tree-node{padding-left:20px}lib-data-model-tree .ax-mat-tree-draggable div[role=group]>.mat-tree-node .dragBackG{left:40px!important}lib-data-model-tree .cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}lib-data-model-tree .cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}lib-data-model-tree .field-placeholder{display:inline;position:absolute}lib-data-model-tree .dragBackG{position:absolute;left:80px}lib-data-model-tree .ax-cdk-draggable{z-index:100;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}lib-data-model-tree .sg-icon{height:12px;width:12px}lib-data-model-tree .fields-max-vh{overflow:auto}lib-data-model-tree .text-f{font-size:17px;line-height:24px;letter-spacing:.6px}lib-data-model-tree .text-e{font-size:14px;line-height:20px;letter-spacing:.51px}lib-data-model-tree .text-att{font-size:12px;line-height:18px;letter-spacing:.25px}lib-data-model-tree ::placeholder{font-size:12px}lib-data-model-tree .clear_icon{cursor:pointer;color:#000!important;background:transparent!important;font-size:18px;width:18px;min-width:18px;opacity:.6}lib-data-model-tree .clear_icon:hover{opacity:.9}lib-data-model-tree .search-bar{height:2.6rem;margin-top:0}lib-data-model-tree .fields-title{font-weight:500;position:sticky;top:48px;background-color:#fff;z-index:9}lib-data-model-tree .add-filter-title{font-size:17px;font-weight:500;padding:1.5rem 1.3rem 0 1.5rem}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel{box-shadow:none!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel:hover{box-shadow:none!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel .mat-expansion-panel-header{padding:0!important;height:auto!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel .mat-expansion-panel-header:hover{background-color:#fcfdff!important}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel .mat-expansion-panel-body{padding:0 8px}lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel.mat-expanded,lib-data-model-tree .left-menu-mat-tree .mat-expansion-panel:hover{box-shadow:none!important}lib-data-model-tree .search-field{display:flex;align-items:center;width:100%;justify-content:end}lib-data-model-tree .search-field .search-icon{min-height:18px;min-width:18px;height:18px;width:18px}.entity-tree-container{cursor:grab}@media only screen and (max-width: 1024px){.fields-list-container{min-width:250px}}\n"] }]
    }], function () { return []; }, { accordion: [{
            type: ViewChild,
            args: [MatAccordion]
        }], dataModel: [{
            type: Input
        }], categories: [{
            type: Input
        }], displayMode: [{
            type: Input
        }], attributeDropZoneList: [{
            type: Input
        }], attributeSelected: [{
            type: Output
        }], attributeDeselected: [{
            type: Output
        }], categorySelected: [{
            type: Output
        }], categoryDeselected: [{
            type: Output
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 