import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/cdk/drag-drop";
import * as i3 from "@angular/material/icon";
import * as i4 from "@angular/material/tooltip";
import * as i5 from "../../../axo-utils/search-pipe";
function AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_span_5_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "span", 6);
} }
function AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_ng_container_6_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "div", 7);
    i0.ɵɵelement(2, "mat-icon", 3);
    i0.ɵɵelementStart(3, "span", 4);
    i0.ɵɵtext(4);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const ctx_r4 = i0.ɵɵnextContext(3);
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("svgIcon", ctx_r4.currentDragByElement.enlightenType.matIcon);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("matTooltip", ctx_r4.currentDragByElement.label);
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate1(" ", ctx_r4.currentDragByElement.label ? ctx_r4.currentDragByElement.label : ctx_r4.currentDragByElement.name, " ");
} }
function AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_Template(rf, ctx) { if (rf & 1) {
    const _r7 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "div", 2);
    i0.ɵɵlistener("cdkDragStarted", function AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_Template_div_cdkDragStarted_1_listener($event) { i0.ɵɵrestoreView(_r7); const attribute_r1 = i0.ɵɵnextContext().$implicit; const ctx_r5 = i0.ɵɵnextContext(); return ctx_r5.dragStart($event, attribute_r1); })("cdkDragEnded", function AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_Template_div_cdkDragEnded_1_listener($event) { i0.ɵɵrestoreView(_r7); const attribute_r1 = i0.ɵɵnextContext().$implicit; const ctx_r8 = i0.ɵɵnextContext(); return ctx_r8.dragEnd($event, attribute_r1); });
    i0.ɵɵelement(2, "mat-icon", 3);
    i0.ɵɵelementStart(3, "span", 4);
    i0.ɵɵtext(4);
    i0.ɵɵtemplate(5, AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_span_5_Template, 1, 0, "span", 5);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵtemplate(6, AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_ng_container_6_Template, 5, 3, "ng-container", 1);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const attribute_r1 = i0.ɵɵnextContext().$implicit;
    const ctx_r2 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("cdkDragData", attribute_r1);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("svgIcon", attribute_r1.enlightenType.matIcon);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("matTooltip", attribute_r1.label);
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate1(" ", attribute_r1.label ? attribute_r1.label : attribute_r1.name, " ");
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("ngIf", ctx_r2.currentDragByElement && ctx_r2.currentDragByElement === attribute_r1);
} }
function AttributesDragdropLayoutComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵtemplate(1, AttributesDragdropLayoutComponent_ng_container_0_ng_container_1_Template, 7, 5, "ng-container", 1);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const attribute_r1 = ctx.$implicit;
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", !attribute_r1.isHidden);
} }
export class AttributesDragdropLayoutComponent {
    /**
     * Constructor
     */
    constructor() { }
    // On Init Life cycle hook
    ngOnInit() {
    }
    /** * Triggered when dragging started on mat-tree element
     * * Used for showing static mat-tree element to give drag-clone feel*/
    dragStart($event, attribute) {
        this.currentDragByElement = attribute;
    }
    /***
     * Triggered when dragging ended on mat-tree element
    */
    dragEnd($event, attribute) {
        this.currentDragByElement = null;
    }
}
AttributesDragdropLayoutComponent.ɵfac = function AttributesDragdropLayoutComponent_Factory(t) { return new (t || AttributesDragdropLayoutComponent)(); };
AttributesDragdropLayoutComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AttributesDragdropLayoutComponent, selectors: [["lib-attributes-dragdrop-layout"]], inputs: { attributes: "attributes", searchedTerm: "searchedTerm" }, decls: 2, vars: 4, consts: [[4, "ngFor", "ngForOf"], [4, "ngIf"], ["cdkDrag", "", 1, "flex", "align-center", "px-3", "py-3", "cursor-pointer", "whitespace-nowrap", 3, "cdkDragData", "cdkDragStarted", "cdkDragEnded"], [1, "svg-icon", "mr-3", 3, "svgIcon"], [1, "ax-cdk-draggable", "text-att", 3, "matTooltip"], ["class", "field-placeholder", 4, "cdkDragPlaceholder"], [1, "field-placeholder"], [1, "flex", "align-center", "px-3", "py-3", "whitespace-nowrap"]], template: function AttributesDragdropLayoutComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵtemplate(0, AttributesDragdropLayoutComponent_ng_container_0_Template, 2, 1, "ng-container", 0);
        i0.ɵɵpipe(1, "search");
    } if (rf & 2) {
        i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind2(1, 1, ctx.attributes, ctx.searchedTerm));
    } }, directives: [i1.NgForOf, i1.NgIf, i2.CdkDrag, i3.MatIcon, i4.MatTooltip, i2.CdkDragPlaceholder], pipes: [i5.SearchPipe], styles: [""] });
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AttributesDragdropLayoutComponent, [{
        type: Component,
        args: [{ selector: 'lib-attributes-dragdrop-layout', template: "<ng-container *ngFor=\"let attribute of attributes | search: searchedTerm\">\n    <ng-container *ngIf=\"!attribute.isHidden\">\n        <div class=\"flex align-center px-3 py-3 cursor-pointer whitespace-nowrap\" cdkDrag\n            [cdkDragData]=\"attribute\"\n            (cdkDragStarted)=\"dragStart($event, attribute)\"\n            (cdkDragEnded)=\"dragEnd($event, attribute)\">\n            <!-- mat-icon displayed based on attribute type -->\n            <mat-icon class=\"svg-icon mr-3\" [svgIcon]=\"attribute.enlightenType.matIcon\"></mat-icon>\n\n            <!-- The tree element that can be dragged ad dropped -->\n            <span [matTooltip]=\"attribute.label\"\n                class=\"ax-cdk-draggable text-att\">\n                    {{attribute.label?attribute.label:attribute.name}}\n                    <span *cdkDragPlaceholder class=\"field-placeholder\"></span>\n            </span>\n        </div>\n        <ng-container *ngIf=\"currentDragByElement && currentDragByElement ===attribute\">\n            <div class=\"flex align-center px-3 py-3 whitespace-nowrap\">\n                <mat-icon class=\"svg-icon mr-3\" [svgIcon]=\"currentDragByElement.enlightenType.matIcon\"></mat-icon>\n                <span [matTooltip]=\"currentDragByElement.label\"\n                    class=\"ax-cdk-draggable text-att\">\n                        {{currentDragByElement.label?currentDragByElement.label:currentDragByElement.name}}\n                </span>\n            </div>\n        </ng-container>\n    </ng-container>\n</ng-container>\n", styles: [""] }]
    }], function () { return []; }, { attributes: [{
            type: Input
        }], searchedTerm: [{
            type: Input
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 