import { Subject, BehaviorSubject, Observable } from 'rxjs';
import { __values } from 'tslib';
import { Injectable, NgModule, Directive, ElementRef, Input, HostListener, HostBinding, Output, EventEmitter, Component, defineInjectable } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormBuilder, Validators, ReactiveFormsModule } from '@angular/forms';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
import { faCoffee, faPlus, faEdit, faMinus, faTimes, faCheck, faArrowDown } from '@fortawesome/free-solid-svg-icons';
import { TranslateService, TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { HttpClient, HttpClientModule } from '@angular/common/http';

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var NgxTreeService = /** @class */ (function () {
    function NgxTreeService() {
        this.treeStorage = [];
        this.onDragStart = new Subject();
        this.onDragEnter = new Subject();
        this.onDragLeave = new Subject();
        this.onDrop = new Subject();
        this.onDrag = new Subject();
        this.onAllowDrop = new Subject();
        this.onDragEnd = new Subject();
        this.onAddItem = new Subject();
        this.onRenameItem = new Subject();
        this.onStartRenameItem = new Subject();
        this.onFinishRenameItem = new Subject();
        this.onStartDeleteItem = new Subject();
        this.onFinishDeleteItem = new Subject();
        this.onCancelDeleteItem = new Subject();
        this.config = new BehaviorSubject(null);
        this.language = new BehaviorSubject('');
        this.defaultLanguage = 'ru';
        // set default config
        this.defaultConfig = {
            language: 'ru',
            showActionButtons: true,
            showAddButtons: true,
            showRenameButtons: true,
            showDeleteButtons: true,
            showRootActionButtons: true,
            enableExpandButtons: true,
            enableDragging: true,
            rootTitle: 'Root',
            validationText: 'Enter valid name',
            minCharacterLength: 1,
            setItemsAsLinks: false,
            setFontSize: 16,
            setIconSize: 14
        };
    }
    /*
      get data and set it on observable.
      if data = null set empty data array
    */
    /*
        get data and set it on observable.
        if data = null set empty data array
      */
    /**
     * @param {?} item
     * @return {?}
     */
    NgxTreeService.prototype.getLocalData = /*
        get data and set it on observable.
        if data = null set empty data array
      */
    /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        var _this = this;
        /** @type {?} */
        var data = new Observable((/**
         * @param {?} observer
         * @return {?}
         */
        function (observer) {
            _this.treeStorage = item;
            if (_this.treeStorage && _this.treeStorage !== null) {
                _this.checkTreeLength();
                observer.next(_this.treeStorage);
            }
            else {
                _this.treeStorage = JSON.parse('[]');
                observer.next(_this.treeStorage);
            }
        }));
        return data;
    };
    /*
     Element finder, it`s find element by id in tree.
     Returns: finded element, parent array.
     Watch out, this is recursive method.
    */
    /*
       Element finder, it`s find element by id in tree.
       Returns: finded element, parent array.
       Watch out, this is recursive method.
      */
    /**
     * @private
     * @param {?} list
     * @param {?} id
     * @param {?=} parent
     * @return {?}
     */
    NgxTreeService.prototype.elementFinder = /*
       Element finder, it`s find element by id in tree.
       Returns: finded element, parent array.
       Watch out, this is recursive method.
      */
    /**
     * @private
     * @param {?} list
     * @param {?} id
     * @param {?=} parent
     * @return {?}
     */
    function (list, id, parent) {
        var e_1, _a;
        try {
            for (var list_1 = __values(list), list_1_1 = list_1.next(); !list_1_1.done; list_1_1 = list_1.next()) {
                var item = list_1_1.value;
                if (item.id === id) {
                    this.findingResults = {
                        foundItem: item,
                        itemsList: list
                    };
                    if (parent) {
                        this.findingResults.parentItem = parent;
                    }
                    break;
                }
                else {
                    if (item.children.length > 0) {
                        this.elementFinder(item.children, id, item);
                    }
                }
            }
        }
        catch (e_1_1) { e_1 = { error: e_1_1 }; }
        finally {
            try {
                if (list_1_1 && !list_1_1.done && (_a = list_1.return)) _a.call(list_1);
            }
            finally { if (e_1) throw e_1.error; }
        }
    };
    /*
    Add new item to tree.
    Its accepts 'type' for detect add root element or children.
    Emit onAddItem Subject.
   */
    /*
       Add new item to tree.
       Its accepts 'type' for detect add root element or children.
       Emit onAddItem Subject.
      */
    /**
     * @param {?} id
     * @param {?} name
     * @param {?=} parent
     * @return {?}
     */
    NgxTreeService.prototype.addNewItem = /*
       Add new item to tree.
       Its accepts 'type' for detect add root element or children.
       Emit onAddItem Subject.
      */
    /**
     * @param {?} id
     * @param {?} name
     * @param {?=} parent
     * @return {?}
     */
    function (id, name, parent) {
        /** @type {?} */
        var pos = 1;
        if (parent && parent.children.length !== 0) {
            /** @type {?} */
            var parentPrevChildren = parent.children.length - 1;
            /** @type {?} */
            var newItemPosition = parent.children[parentPrevChildren].options.position + 1;
            pos = newItemPosition;
        }
        /** @type {?} */
        var createObj = {
            id: id,
            name: name,
            options: {
                position: pos,
                edit: true
            },
            children: []
        };
        if (parent != null) {
            this.elementFinder(this.treeStorage, parent ? parent.id : null);
            this.findingResults && this.findingResults.foundItem.children.push(createObj);
        }
        else {
            this.treeStorage.push(createObj);
        }
        /** @type {?} */
        var eventEmit = {
            element: createObj,
            parent: parent ? this.findingResults.foundItem : 'root'
        };
        this.onAddItem.next(eventEmit);
        this.clearAction();
    };
    /*
     Delete element.
     It`s accepts 'id' for find item on tree.
     Emit onStartDeleteItem Subject before delete.
     Emit onFinishDeleteItem Subject after submit delete.
     Emit onCancelDeleteItem Subject after on cancel delete.
    */
    /*
       Delete element.
       It`s accepts 'id' for find item on tree.
       Emit onStartDeleteItem Subject before delete.
       Emit onFinishDeleteItem Subject after submit delete.
       Emit onCancelDeleteItem Subject after on cancel delete.
      */
    /**
     * @param {?} id
     * @return {?}
     */
    NgxTreeService.prototype.deleteItem = /*
       Delete element.
       It`s accepts 'id' for find item on tree.
       Emit onStartDeleteItem Subject before delete.
       Emit onFinishDeleteItem Subject after submit delete.
       Emit onCancelDeleteItem Subject after on cancel delete.
      */
    /**
     * @param {?} id
     * @return {?}
     */
    function (id) {
        this.elementFinder(this.treeStorage, id);
        /** @type {?} */
        var eventEmit = {
            element: this.findingResults.foundItem,
            parent: this.findingResults.parentItem || 'root'
        };
        this.onStartDeleteItem.next(eventEmit);
        /** @type {?} */
        var text;
        if (this.findingResults.foundItem.name) {
            text = "Do you really want to delete '" + this.findingResults.foundItem.name + "'?";
        }
        else {
            text = "Cancel creating a new item?";
        }
        if (confirm(text)) {
            this.onFinishDeleteItem.next(eventEmit);
            /** @type {?} */
            var i = this.findingResults.itemsList.indexOf(this.findingResults.foundItem);
            this.findingResults.itemsList.splice(i, 1);
        }
        else {
            this.onCancelDeleteItem.next(eventEmit);
        }
        this.clearAction();
        this.checkTreeLength();
    };
    /*
     Trigger start rename element.
     It`s accepts 'name' and 'id' for find item on tree and set the name.
     Emit onRenameItem Subject.
    */
    /*
       Trigger start rename element.
       It`s accepts 'name' and 'id' for find item on tree and set the name.
       Emit onRenameItem Subject.
      */
    /**
     * @param {?} element
     * @return {?}
     */
    NgxTreeService.prototype.startRenameItem = /*
       Trigger start rename element.
       It`s accepts 'name' and 'id' for find item on tree and set the name.
       Emit onRenameItem Subject.
      */
    /**
     * @param {?} element
     * @return {?}
     */
    function (element) {
        this.elementFinder(this.treeStorage, element.id);
        // event emit
        /** @type {?} */
        var eventEmit = {
            element: this.findingResults.foundItem,
            parent: this.findingResults.parentItem || 'root'
        };
        this.onStartRenameItem.next(eventEmit);
    };
    /*
     Rename element.
     It`s accepts 'name' and 'id' for find item on tree and set the name.
     Emit onRenameItem Subject.
    */
    /*
       Rename element.
       It`s accepts 'name' and 'id' for find item on tree and set the name.
       Emit onRenameItem Subject.
      */
    /**
     * @param {?} name
     * @param {?} id
     * @return {?}
     */
    NgxTreeService.prototype.finishRenameItem = /*
       Rename element.
       It`s accepts 'name' and 'id' for find item on tree and set the name.
       Emit onRenameItem Subject.
      */
    /**
     * @param {?} name
     * @param {?} id
     * @return {?}
     */
    function (name, id) {
        this.elementFinder(this.treeStorage, id);
        // code
        this.findingResults.foundItem.name = name;
        this.findingResults.foundItem.options.edit = false;
        // event emit
        /** @type {?} */
        var eventEmit = {
            element: this.findingResults.foundItem,
            parent: this.findingResults.parentItem || 'root'
        };
        this.onFinishRenameItem.next(eventEmit);
        this.clearAction();
    };
    /*
     Event: ondragstart;
     On start dragging find element my id and set option currentlyDragging true.
    */
    /*
       Event: ondragstart;
       On start dragging find element my id and set option currentlyDragging true.
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    NgxTreeService.prototype.startDragging = /*
       Event: ondragstart;
       On start dragging find element my id and set option currentlyDragging true.
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    function (eventObj) {
        this.switchDropButton(true, this.treeStorage);
        this.onDragStart.next(eventObj);
    };
    /*
     Event: ondrag;
     Trigger dragging element
    */
    /*
       Event: ondrag;
       Trigger dragging element
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    NgxTreeService.prototype.onDragProcess = /*
       Event: ondrag;
       Trigger dragging element
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    function (eventObj) {
        this.onDrag.next(eventObj);
    };
    /*
     Event: ondragend;
     detect end of drag action
    */
    /*
       Event: ondragend;
       detect end of drag action
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    NgxTreeService.prototype.dragEndAction = /*
       Event: ondragend;
       detect end of drag action
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    function (eventObj) {
        this.removeDestenationBorders(this.treeStorage);
        this.switchDropButton(false, this.treeStorage);
        this.onDragEnd.next(eventObj);
    };
    /*
      Event: enterdropzone;
      Entering drop zone for styling items.
    */
    /*
        Event: enterdropzone;
        Entering drop zone for styling items.
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    NgxTreeService.prototype.enterDropZone = /*
        Event: enterdropzone;
        Entering drop zone for styling items.
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    function (eventObj) {
        this.onDragEnter.next(eventObj);
    };
    /*
      Event: dragover;
      Detect hover on dropable elements
    */
    /*
        Event: dragover;
        Detect hover on dropable elements
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    NgxTreeService.prototype.onDragOver = /*
        Event: dragover;
        Detect hover on dropable elements
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    function (eventObj) {
        /** @type {?} */
        var el = ((/** @type {?} */ (eventObj.target)));
        if (el && el.id !== this.isDragging.id) {
            /** @type {?} */
            var elementHalfHeight = eventObj.event.toElement.offsetHeight / 2;
            if (eventObj.event.offsetY < elementHalfHeight) {
                el.options.destenationBottom = false;
                el.options.destenationTop = true;
            }
            else {
                el.options.destenationBottom = true;
                el.options.destenationTop = false;
            }
            this.onAllowDrop.next(eventObj);
        }
    };
    /*
      Event: leavedropzone;
      Leave drop zone for restyling items.
    */
    /*
        Event: leavedropzone;
        Leave drop zone for restyling items.
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    NgxTreeService.prototype.leaveDropZone = /*
        Event: leavedropzone;
        Leave drop zone for restyling items.
      */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    function (eventObj) {
        this.removeDestenationBorders(this.treeStorage);
        this.onDragLeave.next(eventObj);
    };
    /*
      Event: ondrop;
      Its use where draggable item drop not on allowed for drop zone:
      set item option currentlyDragging false.
      return false.
   */
    /*
        Event: ondrop;
        Its use where draggable item drop not on allowed for drop zone:
        set item option currentlyDragging false.
        return false.
     */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    NgxTreeService.prototype.onDropItem = /*
        Event: ondrop;
        Its use where draggable item drop not on allowed for drop zone:
        set item option currentlyDragging false.
        return false.
     */
    /**
     * @param {?} eventObj
     * @return {?}
     */
    function (eventObj) {
        var _this = this;
        if (eventObj.target) {
            /** @type {?} */
            var elementHalfHeight = eventObj.event.toElement.offsetHeight / 2;
            if (eventObj.event.offsetY < elementHalfHeight) {
                this.changeItemPosition(eventObj.target, 'up');
            }
            else {
                this.changeItemPosition(eventObj.target, 'down');
            }
            this.onDrop.next(eventObj);
        }
        else {
            /** @type {?} */
            var dropZoneId = parseInt(eventObj.event.target.getAttribute('data-id'), null);
            this.elementFinder(this.treeStorage, this.isDragging.id);
            /** @type {?} */
            var i = this.findingResults.itemsList.indexOf(this.findingResults.foundItem);
            /** @type {?} */
            var copyItem = this.findingResults.itemsList.splice(i, 1)[0];
            this.elementFinder(this.treeStorage, dropZoneId);
            this.findingResults.foundItem.children.push(copyItem);
            // this.sortTree();
            eventObj.target = this.findingResults.foundItem;
            this.onDrop.next(eventObj);
        }
        this.removeDestenationBorders(this.treeStorage);
        this.switchDropButton(false, this.treeStorage);
        this.clearAction();
        setTimeout((/**
         * @return {?}
         */
        function () {
            _this.checkTreeLength();
        }));
    };
    /*
      change position of items
      need set direction before use
    */
    /*
        change position of items
        need set direction before use
      */
    /**
     * @private
     * @param {?} el
     * @param {?} direction
     * @return {?}
     */
    NgxTreeService.prototype.changeItemPosition = /*
        change position of items
        need set direction before use
      */
    /**
     * @private
     * @param {?} el
     * @param {?} direction
     * @return {?}
     */
    function (el, direction) {
        var _this = this;
        setTimeout((/**
         * @return {?}
         */
        function () {
            var e_2, _a, e_3, _b;
            _this.elementFinder(_this.treeStorage, _this.isDragging.id);
            /** @type {?} */
            var i = _this.findingResults.itemsList.indexOf(_this.findingResults.foundItem);
            /** @type {?} */
            var copyItem = _this.findingResults.itemsList.splice(i, 1)[0];
            // end test
            /** @type {?} */
            var positionTarget = el.options.position;
            _this.elementFinder(_this.treeStorage, el.id);
            if (direction === 'up') {
                try {
                    for (var _c = __values(_this.findingResults.itemsList), _d = _c.next(); !_d.done; _d = _c.next()) {
                        var items = _d.value;
                        if (items.options.position >= positionTarget) {
                            items.options.position = items.options.position + 1;
                            copyItem.options.position = positionTarget;
                        }
                    }
                }
                catch (e_2_1) { e_2 = { error: e_2_1 }; }
                finally {
                    try {
                        if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
                    }
                    finally { if (e_2) throw e_2.error; }
                }
            }
            else {
                try {
                    for (var _e = __values(_this.findingResults.itemsList), _f = _e.next(); !_f.done; _f = _e.next()) {
                        var items = _f.value;
                        if (items.options.position <= positionTarget) {
                            items.options.position = items.options.position - 1;
                        }
                    }
                }
                catch (e_3_1) { e_3 = { error: e_3_1 }; }
                finally {
                    try {
                        if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
                    }
                    finally { if (e_3) throw e_3.error; }
                }
            }
            copyItem.options.position = positionTarget;
            _this.findingResults.itemsList.push(copyItem);
            _this.sortTree();
        }));
    };
    // get position of item
    // get position of item
    /**
     * @param {?} item
     * @return {?}
     */
    NgxTreeService.prototype.getItemPosition = 
    // get position of item
    /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        this.elementFinder(this.treeStorage, item.id);
        /** @type {?} */
        var position = this.findingResults.itemsList.indexOf(this.findingResults.foundItem);
        return ++position;
    };
    // sort tree byposition
    // sort tree byposition
    /**
     * @return {?}
     */
    NgxTreeService.prototype.sortTree = 
    // sort tree byposition
    /**
     * @return {?}
     */
    function () {
        this.sortElements(this.treeStorage);
    };
    // part of sortTree()
    // part of sortTree()
    /**
     * @private
     * @param {?} tree
     * @return {?}
     */
    NgxTreeService.prototype.sortElements = 
    // part of sortTree()
    /**
     * @private
     * @param {?} tree
     * @return {?}
     */
    function (tree) {
        var e_4, _a;
        tree.sort(this.compate);
        try {
            for (var tree_1 = __values(tree), tree_1_1 = tree_1.next(); !tree_1_1.done; tree_1_1 = tree_1.next()) {
                var item = tree_1_1.value;
                if (item.children.length > 0) {
                    this.sortElements(item.children);
                }
            }
        }
        catch (e_4_1) { e_4 = { error: e_4_1 }; }
        finally {
            try {
                if (tree_1_1 && !tree_1_1.done && (_a = tree_1.return)) _a.call(tree_1);
            }
            finally { if (e_4) throw e_4.error; }
        }
    };
    // part of sortTree()
    // part of sortTree()
    /**
     * @private
     * @param {?} a
     * @param {?} b
     * @return {?}
     */
    NgxTreeService.prototype.compate = 
    // part of sortTree()
    /**
     * @private
     * @param {?} a
     * @param {?} b
     * @return {?}
     */
    function (a, b) {
        if (a.options.position < b.options.position) {
            return -1;
        }
        if (a.options.position > b.options.position) {
            return 1;
        }
        return 0;
    };
    // clear selectedElement && isDragging from element finder.
    // clear selectedElement && isDragging from element finder.
    /**
     * @return {?}
     */
    NgxTreeService.prototype.clearAction = 
    // clear selectedElement && isDragging from element finder.
    /**
     * @return {?}
     */
    function () {
        this.findingResults = null;
    };
    /**
     * @private
     * @param {?} data
     * @return {?}
     */
    NgxTreeService.prototype.removeDestenationBorders = /**
     * @private
     * @param {?} data
     * @return {?}
     */
    function (data) {
        var e_5, _a;
        try {
            for (var data_1 = __values(data), data_1_1 = data_1.next(); !data_1_1.done; data_1_1 = data_1.next()) {
                var item = data_1_1.value;
                item.options.destenationBottom = false;
                item.options.destenationTop = false;
                if (item.children.length > 0) {
                    this.removeDestenationBorders(item.children);
                }
            }
        }
        catch (e_5_1) { e_5 = { error: e_5_1 }; }
        finally {
            try {
                if (data_1_1 && !data_1_1.done && (_a = data_1.return)) _a.call(data_1);
            }
            finally { if (e_5) throw e_5.error; }
        }
    };
    /**
     * @private
     * @param {?} bool
     * @param {?} data
     * @return {?}
     */
    NgxTreeService.prototype.switchDropButton = /**
     * @private
     * @param {?} bool
     * @param {?} data
     * @return {?}
     */
    function (bool, data) {
        var e_6, _a;
        try {
            for (var data_2 = __values(data), data_2_1 = data_2.next(); !data_2_1.done; data_2_1 = data_2.next()) {
                var el = data_2_1.value;
                el.options.showActionButtons = !bool;
                if (el.id !== this.isDragging.id) {
                    el.options.showDropChildZone = bool;
                }
                if (el.children.length > 0) {
                    this.switchDropButton(bool, el.children);
                }
            }
        }
        catch (e_6_1) { e_6 = { error: e_6_1 }; }
        finally {
            try {
                if (data_2_1 && !data_2_1.done && (_a = data_2.return)) _a.call(data_2);
            }
            finally { if (e_6) throw e_6.error; }
        }
    };
    /**
     * @return {?}
     */
    NgxTreeService.prototype.checkTreeLength = /**
     * @return {?}
     */
    function () {
        var e_7, _a;
        if (!this.treeStorage || !this.treeStorage[0] || !this.treeStorage[0].options) {
            // this.treeStorage[0].options = {} as TreeItemOptions;
            return;
        }
        if (this.treeStorage.length < 2) {
            this.treeStorage[0].options.showDeleteButton = false;
        }
        else {
            try {
                for (var _b = __values(this.treeStorage), _c = _b.next(); !_c.done; _c = _b.next()) {
                    var el = _c.value;
                    if (el && el.options) {
                        el.options.showDeleteButton = true;
                    }
                }
            }
            catch (e_7_1) { e_7 = { error: e_7_1 }; }
            finally {
                try {
                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                }
                finally { if (e_7) throw e_7.error; }
            }
        }
    };
    NgxTreeService.decorators = [
        { type: Injectable, args: [{
                    providedIn: 'root'
                },] }
    ];
    /** @nocollapse */
    NgxTreeService.ctorParameters = function () { return []; };
    /** @nocollapse */ NgxTreeService.ngInjectableDef = defineInjectable({ factory: function NgxTreeService_Factory() { return new NgxTreeService(); }, token: NgxTreeService, providedIn: "root" });
    return NgxTreeService;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var NgxTreeParentComponent = /** @class */ (function () {
    function NgxTreeParentComponent(treeService, fb) {
        this.treeService = treeService;
        this.fb = fb;
        this.userConfig = {
            language: 'ru',
            showActionButtons: true,
            showAddButtons: true,
            showRenameButtons: true,
            showDeleteButtons: true,
            showRootActionButtons: true,
            enableExpandButtons: true,
            enableDragging: true,
            rootTitle: 'Root',
            options: {
                edit: false
            },
            validationText: 'Enter valid name',
            minCharacterLength: 1,
            setItemsAsLinks: false,
            setFontSize: 16,
            setIconSize: 14
        };
        this.ondragstart = new EventEmitter();
        this.ondragenter = new EventEmitter();
        this.ondragleave = new EventEmitter();
        this.ondrop = new EventEmitter();
        this.onallowdrop = new EventEmitter();
        this.ondragend = new EventEmitter();
        this.onadditem = new EventEmitter();
        this.onStartRenameItem = new EventEmitter();
        this.onFinishRenameItem = new EventEmitter();
        this.onStartDeleteItem = new EventEmitter();
        this.onFinishDeleteItem = new EventEmitter();
        this.onCancelDeleteItem = new EventEmitter();
        this.enableSubscribers();
        this.createForm();
    }
    Object.defineProperty(NgxTreeParentComponent.prototype, "config", {
        set: /**
         * @param {?} config
         * @return {?}
         */
        function (config) {
            // seal config
            Object.seal(this.userConfig);
            try {
                // if config it`s pass
                this.setConfig(config);
                this.treeService.config.next(this.userConfig);
            }
            catch (error) {
                // if config invalid
                this.treeService.config.next(this.treeService.defaultConfig);
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(NgxTreeParentComponent.prototype, "language", {
        set: /**
         * @param {?} language
         * @return {?}
         */
        function (language) {
            /** @type {?} */
            var _language = (language && typeof language === 'string') ? language : this.treeService.defaultLanguage;
            this.current_language = language;
            this.treeService.language.next(_language);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(NgxTreeParentComponent.prototype, "treeData", {
        set: /**
         * @param {?} item
         * @return {?}
         */
        function (item) {
            // get user tree data
            this.getTreeData(item);
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} changes
     * @return {?}
     */
    NgxTreeParentComponent.prototype.ngOnChanges = /**
     * @param {?} changes
     * @return {?}
     */
    function (changes) {
        console.log("changes");
        console.log(changes);
    };
    // set user config
    // set user config
    /**
     * @param {?} config
     * @return {?}
     */
    NgxTreeParentComponent.prototype.setConfig = 
    // set user config
    /**
     * @param {?} config
     * @return {?}
     */
    function (config) {
        var e_1, _a;
        try {
            for (var _b = __values(Object.keys(config)), _c = _b.next(); !_c.done; _c = _b.next()) {
                var key = _c.value;
                this.setValue(key, config);
            }
        }
        catch (e_1_1) { e_1 = { error: e_1_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_1) throw e_1.error; }
        }
        this.renameForm.patchValue({
            name: this.userConfig.rootTitle
        });
    };
    // set value to keys of config
    // set value to keys of config
    /**
     * @param {?} item
     * @param {?} config
     * @return {?}
     */
    NgxTreeParentComponent.prototype.setValue = 
    // set value to keys of config
    /**
     * @param {?} item
     * @param {?} config
     * @return {?}
     */
    function (item, config) {
        this.userConfig[item] = config[item];
    };
    // subscribe to all events and emit them to user.
    // subscribe to all events and emit them to user.
    /**
     * @return {?}
     */
    NgxTreeParentComponent.prototype.enableSubscribers = 
    // subscribe to all events and emit them to user.
    /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.treeService.onDrop.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.ondrop.emit(event);
        }));
        this.treeService.onDragStart.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.ondragstart.emit(event);
        }));
        this.treeService.onAllowDrop.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.onallowdrop.emit(event);
        }));
        this.treeService.onDragEnd.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.ondragend.emit(event);
        }));
        this.treeService.onAddItem.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.onadditem.emit(event);
        }));
        this.treeService.onStartRenameItem.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.onStartRenameItem.emit(event);
        }));
        this.treeService.onFinishRenameItem.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.onFinishRenameItem.emit(event);
        }));
        this.treeService.onStartDeleteItem.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.onStartDeleteItem.emit(event);
        }));
        this.treeService.onFinishDeleteItem.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.onFinishDeleteItem.emit(event);
        }));
        this.treeService.onCancelDeleteItem.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.onCancelDeleteItem.emit(event);
        }));
        this.treeService.onDragEnter.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.ondragenter.emit(event);
        }));
        this.treeService.onDragLeave.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            _this.ondragleave.emit(event);
        }));
    };
    // get tree data from treeService.
    // get tree data from treeService.
    /**
     * @param {?} userTree
     * @return {?}
     */
    NgxTreeParentComponent.prototype.getTreeData = 
    // get tree data from treeService.
    /**
     * @param {?} userTree
     * @return {?}
     */
    function (userTree) {
        var _this = this;
        this.treeService.getLocalData(userTree).subscribe((/**
         * @param {?} tree
         * @return {?}
         */
        function (tree) {
            _this.treeView = tree;
            setTimeout((/**
             * @return {?}
             */
            function () {
                _this.treeService.sortTree();
            }));
        }), (/**
         * @param {?} error
         * @return {?}
         */
        function (error) {
            console.log("getTreeData error: ");
            console.log(error);
        }));
    };
    // create edit form
    // create edit form
    /**
     * @return {?}
     */
    NgxTreeParentComponent.prototype.createForm = 
    // create edit form
    /**
     * @return {?}
     */
    function () {
        this.renameForm = this.fb.group({
            name: [this.userConfig.rootTitle || '', [
                    Validators.required,
                    Validators.minLength(this.userConfig.minCharacterLength)
                ]],
        });
    };
    /**
     * @return {?}
     */
    NgxTreeParentComponent.prototype.enableRootRenameMode = /**
     * @return {?}
     */
    function () {
        this.userConfig.options.edit = true;
    };
    /**
     * @param {?} name
     * @return {?}
     */
    NgxTreeParentComponent.prototype.submitAdd = /**
     * @param {?} name
     * @return {?}
     */
    function (name) {
        /** @type {?} */
        var d = "" + new Date().getFullYear() + new Date().getDay() + new Date().getTime();
        /** @type {?} */
        var elemId = parseInt(d, null);
        this.treeService.addNewItem(elemId, name, null);
    };
    /**
     * @return {?}
     */
    NgxTreeParentComponent.prototype.submitRootRename = /**
     * @return {?}
     */
    function () {
        if (this.renameForm.valid) {
            this.showError = false;
            this.userConfig.rootTitle = this.renameForm.value.name;
            this.userConfig.options.edit = false;
        }
        else {
            this.showError = true;
        }
    };
    /**
     * @return {?}
     */
    NgxTreeParentComponent.prototype.ngAfterViewInit = /**
     * @return {?}
     */
    function () { };
    NgxTreeParentComponent.decorators = [
        { type: Component, args: [{
                    selector: 'asd-ngx-tree-lib',
                    template: "<div id='threeWrapper' *ngIf=\"treeView\" [style.font-size.px]='userConfig.setFontSize'>\n    <div class='root-title d-inline-flex pos-relative' *ngIf=\"!userConfig.options.edit;else onEdit\">\n      <div class='root-text'>\n        {{userConfig.rootTitle | translate}}\n      </div>\n      \n      <div class='d-flex buttons-bar' *ngIf=\"userConfig.showActionButtons && userConfig.showRootActionButtons\">\n        <div class='d-flex'>\n          <button class=\"tree-btn add-btn\" *ngIf=\"userConfig.showAddButtons\" (click)=\"submitAdd(null)\">\n            <fa-icon icon=\"plus\" [style.font-size.px]='userConfig.setIconSize'></fa-icon>\n          </button>\n        </div>\n        <div class='d-flex'>\n          <button class=\"tree-btn edit-btn\" *ngIf=\"userConfig.showRenameButtons\" (click)=\"enableRootRenameMode()\">\n            <fa-icon icon=\"edit\" [style.font-size.px]='userConfig.setIconSize'></fa-icon>\n          </button>\n        </div>\n      </div>\n    </div>\n    <ng-template #onEdit>\n      <div class='d-inline-flex'>\n        <form [formGroup]=\"renameForm\" class='d-flex' (submit)='submitRootRename()'>\n          <input type=\"text\" class='input-rename' formControlName=\"name\" libAutoFocus=\"true\" [style.font-size.px]='userConfig.setFontSize'>\n        </form>\n        <div class='d-flex'>\n          <button class='tree-btn submit-btn' (click)='submitRootRename()'>\n            <fa-icon icon=\"check\" [style.font-size.px]='userConfig.setIconSize'></fa-icon>\n          </button>\n          <div class='error-edit-wrap' *ngIf=\"showError\">\n            {{userConfig.validationText}}\n          </div>\n        </div>\n      </div>\n    </ng-template>\n    <div class='tree-child'>\n      <div class=\"tree-content-main\">\n          <lib-ngx-tree-children [setItem]=\"clild\" *ngFor='let clild of treeView'></lib-ngx-tree-children>\n      </div>\n    </div>\n  </div>\n"
                }] }
    ];
    /** @nocollapse */
    NgxTreeParentComponent.ctorParameters = function () { return [
        { type: NgxTreeService },
        { type: FormBuilder }
    ]; };
    NgxTreeParentComponent.propDecorators = {
        ondragstart: [{ type: Output }],
        ondragenter: [{ type: Output }],
        ondragleave: [{ type: Output }],
        ondrop: [{ type: Output }],
        onallowdrop: [{ type: Output }],
        ondragend: [{ type: Output }],
        onadditem: [{ type: Output }],
        onStartRenameItem: [{ type: Output }],
        onFinishRenameItem: [{ type: Output }],
        onStartDeleteItem: [{ type: Output }],
        onFinishDeleteItem: [{ type: Output }],
        onCancelDeleteItem: [{ type: Output }],
        config: [{ type: Input }],
        language: [{ type: Input }],
        treeData: [{ type: Input }]
    };
    return NgxTreeParentComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var NgxTreeChildrenComponent = /** @class */ (function () {
    function NgxTreeChildrenComponent(treeService, fb, tr) {
        this.treeService = treeService;
        this.fb = fb;
        this.tr = tr;
    }
    Object.defineProperty(NgxTreeChildrenComponent.prototype, "setItem", {
        // get item from parent component
        set: 
        // get item from parent component
        /**
         * @param {?} data
         * @return {?}
         */
        function (data) {
            this.element = data;
            this.itemOptions = {
                href: '#',
                hidden: false,
                hideChildren: false,
                position: this.treeService.getItemPosition(this.element),
                draggable: true,
                edit: false,
                showActionButtons: true,
                currentlyDragging: false,
                destenationTop: false,
                destenationBottom: false,
                disabled: false,
                showExpandButton: true,
                showDeleteButton: true
            };
            if (this.element.options) {
                this.setOptions(this.element.options);
                this.element.options = this.itemOptions;
            }
            else {
                this.element.options = this.itemOptions;
            }
            // enable subscribers
            this.enableSubscribers();
            // create form
            this.createForm();
        },
        enumerable: true,
        configurable: true
    });
    // enable subscribe to config
    // enable subscribe to config
    /**
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.enableSubscribers = 
    // enable subscribe to config
    /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.treeService.config.subscribe((/**
         * @param {?} config
         * @return {?}
         */
        function (config) {
            if (config !== null) {
                _this.config = config;
            }
            else {
                _this.config = _this.treeService.defaultConfig;
            }
            if (_this.element.options.draggable) {
                _this.element.options.draggable = _this.config.enableDragging;
            }
        }));
        this.treeService.language.subscribe((/**
         * @param {?} language
         * @return {?}
         */
        function (language) {
            if (language !== '') {
                _this.language = language;
            }
            else {
                _this.language = _this.treeService.defaultLanguage;
            }
        }));
    };
    /**
     * @param {?} strings
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.getTitleFromLocalized = /**
     * @param {?} strings
     * @return {?}
     */
    function (strings) {
        var _this = this;
        /** @type {?} */
        var empty = this.tr.instant('dashboard.empty');
        /** @type {?} */
        var res = empty;
        if (typeof strings === 'string' || typeof strings === 'number') {
            return strings.toString();
        }
        if (!Array.isArray(strings)) {
            return res;
        }
        strings.forEach((/**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            if (value.language === _this.language) {
                res = value.value;
            }
        }));
        return res;
    };
    // set options to item
    // set options to item
    /**
     * @param {?} options
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.setOptions = 
    // set options to item
    /**
     * @param {?} options
     * @return {?}
     */
    function (options) {
        var e_1, _a;
        try {
            for (var _b = __values(Object.keys(options)), _c = _b.next(); !_c.done; _c = _b.next()) {
                var key = _c.value;
                this.setValue(key, options);
            }
        }
        catch (e_1_1) { e_1 = { error: e_1_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_1) throw e_1.error; }
        }
    };
    // set value to options keys
    // set value to options keys
    /**
     * @param {?} item
     * @param {?} options
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.setValue = 
    // set value to options keys
    /**
     * @param {?} item
     * @param {?} options
     * @return {?}
     */
    function (item, options) {
        this.itemOptions[item] = options[item];
    };
    // create edit form
    // create edit form
    /**
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.createForm = 
    // create edit form
    /**
     * @return {?}
     */
    function () {
        this.renameForm = this.fb.group({
            name: [this.element.name || '', [
                    Validators.required,
                    Validators.minLength(this.config.minCharacterLength)
                ]],
        });
    };
    /*
      Event: onStartRenameItem;
      Enable rename mode in element
      Call onStartRenameItem() from tree service.
    */
    /*
        Event: onStartRenameItem;
        Enable rename mode in element
        Call onStartRenameItem() from tree service.
      */
    /**
     * @param {?} element
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.enableRenameMode = /*
        Event: onStartRenameItem;
        Enable rename mode in element
        Call onStartRenameItem() from tree service.
      */
    /**
     * @param {?} element
     * @return {?}
     */
    function (element) {
        element.options.edit = true;
        this.treeService.startRenameItem(element);
    };
    /*
      Event: onadditem;
      Generate id by new Date() by 'full year + day + time'.
      Call addNewItem() from tree service.
    */
    /*
        Event: onadditem;
        Generate id by new Date() by 'full year + day + time'.
        Call addNewItem() from tree service.
      */
    /**
     * @param {?} name
     * @param {?} item
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.submitAdd = /*
        Event: onadditem;
        Generate id by new Date() by 'full year + day + time'.
        Call addNewItem() from tree service.
      */
    /**
     * @param {?} name
     * @param {?} item
     * @return {?}
     */
    function (name, item) {
        /** @type {?} */
        var d = "" + new Date().getFullYear() + new Date().getDay() + new Date().getTime();
        /** @type {?} */
        var elemId = parseInt(d, null);
        this.treeService.addNewItem(elemId, name, item);
        this.element.options.hideChildren = false;
    };
    /*
      Event: onFinishRenameItem;
      Check is form valid.
      Call addNewItem() from tree service.
    */
    /*
        Event: onFinishRenameItem;
        Check is form valid.
        Call addNewItem() from tree service.
      */
    /**
     * @param {?} item
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.submitRename = /*
        Event: onFinishRenameItem;
        Check is form valid.
        Call addNewItem() from tree service.
      */
    /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        if (this.renameForm.valid) {
            this.showError = false;
            this.treeService.finishRenameItem(this.renameForm.value.name, item.id);
            this.element.options.edit = false;
        }
        else {
            this.showError = true;
        }
    };
    /*
      Events:
      onStartDeleteItem,
      onFinishDeleteItem,
      onCancelDeleteItem.
      Check is item edit, then if name empty delete item.
      Call deleteItem() from tree service.
    */
    /*
        Events:
        onStartDeleteItem,
        onFinishDeleteItem,
        onCancelDeleteItem.
        Check is item edit, then if name empty delete item.
        Call deleteItem() from tree service.
      */
    /**
     * @param {?} item
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.onSubmitDelete = /*
        Events:
        onStartDeleteItem,
        onFinishDeleteItem,
        onCancelDeleteItem.
        Check is item edit, then if name empty delete item.
        Call deleteItem() from tree service.
      */
    /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        if (!this.element.options.edit) {
            this.treeService.deleteItem(item.id);
        }
        else {
            if (item.name === null) {
                this.treeService.deleteItem(item.id);
            }
            else {
                this.element.options.edit = false;
            }
        }
    };
    // after view init
    // after view init
    /**
     * @return {?}
     */
    NgxTreeChildrenComponent.prototype.ngAfterViewInit = 
    // after view init
    /**
     * @return {?}
     */
    function () { };
    NgxTreeChildrenComponent.decorators = [
        { type: Component, args: [{
                    selector: 'lib-ngx-tree-children',
                    template: "<div class='tree-child' id={{element.id}} libDragElement [draggableValue]='element.options.draggable' [item]='element' [ngClass]=\"{disabled : element.options.disabled}\">\n  <div *ngIf=\"element && element.options\" class='d-flex'>\n    <div *ngIf='config' [ngClass]=\"{hidden : element.options.hidden}\">\n      <div class='tree-title d-inline-flex pos-relative' [ngClass]=\"{destenationTop : element.options.destenationTop, destenationBottom: element.options.destenationBottom}\" *ngIf=\"!element.options.edit;else onEdit\">\n        <div *ngIf=\"!config.setItemsAsLinks; else link\" [ngClass]=\"{addOpacity : element.options.currentlyDragging}\" libDropElement\n          [item]='element' class='draggable-item'>\n          {{getTitleFromLocalized(element.name) | translate}}\n        </div>\n        <ng-template #link>\n          <div [ngClass]=\"{addOpacity : element.options.currentlyDragging}\" libDropElement\n          [item]='element' class='draggable-item'>\n            <a [href]=\"element.options.href\" class='tree-link'>{{getTitleFromLocalized(element.name) | translate}}</a>\n          </div>\n        </ng-template>\n        <div class='d-flex buttons-bar' *ngIf=\"config.showActionButtons && element.options.showActionButtons && !element.options.disabled\">\n          <div class='d-flex'>\n            <button class=\"tree-btn add-btn\" *ngIf=\"config.showAddButtons\" (click)=\"submitAdd(null, element)\">\n              <fa-icon icon=\"plus\" [style.font-size.px]='config.setIconSize'></fa-icon>\n            </button>\n          </div>\n          <div class='d-flex'>\n            <button class=\"tree-btn edit-btn\" *ngIf=\"config.showRenameButtons\" (click)=\"enableRenameMode(element)\">\n              <fa-icon icon=\"edit\" [style.font-size.px]='config.setIconSize'></fa-icon>\n            </button>\n          </div>\n          <div class='d-flex'>\n            <button class=\"tree-btn delete-btn\" *ngIf=\"config.showDeleteButtons && element.options.showDeleteButton\" (click)=\"onSubmitDelete( element )\">\n              <fa-icon icon=\"times\" [style.font-size.px]='config.setIconSize'></fa-icon>\n            </button>\n          </div>\n        </div>\n        <div class='child-drop-place' [attr.data-id]='element.id'  libDropElement *ngIf='element.options.showDropChildZone && !element.options.disabled'>\n          <fa-icon icon=\"arrow-down\" [style.font-size.px]='config.setIconSize'></fa-icon>\n        </div>\n        <div class='show-hide-switch' *ngIf=\"config.enableExpandButtons && element.options.showExpandButton && element.children.length > 0 && !element.options.disabled\">\n          <div *ngIf=\"element.options.hideChildren; else visible\">\n            <button class='tree-btn show-btn' (click)='element.options.hideChildren = false'>\n              <fa-icon icon=\"plus\" [style.font-size.px]='config.setIconSize'></fa-icon>\n            </button>\n          </div>\n          <ng-template #visible>\n            <button class='tree-btn hide-btn' (click)='element.options.hideChildren = true'>\n              <fa-icon icon=\"minus\" [style.font-size.px]='config.setIconSize'></fa-icon>\n            </button>\n          </ng-template>\n        </div>\n      </div>\n      <ng-template #onEdit>\n        <div class='tree-title d-inline-flex'>\n          <form [formGroup]=\"renameForm\" class='d-flex' (submit)='submitRename(element)'>\n            <input type=\"text\" class='input-rename' formControlName=\"name\" libAutoFocus=\"true\" [style.font-size.px]='config.setFontSize'>\n          </form>\n          <div class='d-flex'>\n            <button class='tree-btn submit-btn' (click)='submitRename(element)'>\n              <fa-icon icon=\"check\" [style.font-size.px]='config.setIconSize'></fa-icon>\n            </button>\n            <button class='tree-btn delete-btn' (click)='onSubmitDelete(element)'>\n              <fa-icon icon=\"times\" [style.font-size.px]='config.setIconSize'></fa-icon>\n            </button>\n            <div class='error-edit-wrap' *ngIf=\"showError\">\n              {{config.validationText}}\n            </div>\n          </div>\n        </div>\n      </ng-template>\n      <div class=\"tree-content\" *ngIf=\"element.children && !element.options.hideChildren\">\n        <lib-ngx-tree-children [setItem]=\"child\" *ngFor='let child of element.children'></lib-ngx-tree-children>\n      </div>\n    </div>\n  </div>\n</div>\n"
                }] }
    ];
    /** @nocollapse */
    NgxTreeChildrenComponent.ctorParameters = function () { return [
        { type: NgxTreeService },
        { type: FormBuilder },
        { type: TranslateService }
    ]; };
    NgxTreeChildrenComponent.propDecorators = {
        setItem: [{ type: Input }]
    };
    return NgxTreeChildrenComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var AutoFocusDirective = /** @class */ (function () {
    function AutoFocusDirective(el) {
        this.el = el;
        this.focus = true;
    }
    /**
     * @return {?}
     */
    AutoFocusDirective.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        if (this.focus) {
            window.setTimeout((/**
             * @return {?}
             */
            function () {
                _this.el.nativeElement.focus();
            }));
        }
    };
    Object.defineProperty(AutoFocusDirective.prototype, "autofocus", {
        set: /**
         * @param {?} condition
         * @return {?}
         */
        function (condition) {
            console.log("autofocus condition");
            console.log(condition);
            this.focus = condition !== false;
        },
        enumerable: true,
        configurable: true
    });
    AutoFocusDirective.decorators = [
        { type: Directive, args: [{
                    selector: '[libAutoFocus]'
                },] }
    ];
    /** @nocollapse */
    AutoFocusDirective.ctorParameters = function () { return [
        { type: ElementRef }
    ]; };
    AutoFocusDirective.propDecorators = {
        autofocus: [{ type: Input }]
    };
    return AutoFocusDirective;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var DragElementsDirective = /** @class */ (function () {
    function DragElementsDirective(el, treeService) {
        this.el = el;
        this.treeService = treeService;
    }
    Object.defineProperty(DragElementsDirective.prototype, "draggable", {
        get: /**
         * @return {?}
         */
        function () {
            return this.draggableValue;
        },
        enumerable: true,
        configurable: true
    });
    /*
        Event: ondragstart;
        Set item as dragging and call startDragging() from tree service.
        Emit OnDragStart on tree service.
    */
    /*
            Event: ondragstart;
            Set item as dragging and call startDragging() from tree service.
            Emit OnDragStart on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    DragElementsDirective.prototype.onDragStart = /*
            Event: ondragstart;
            Set item as dragging and call startDragging() from tree service.
            Emit OnDragStart on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        console.log("onDragStart (dragstart)");
        console.log(event);
        console.log("this.item");
        console.log(this.item);
        if (!event['dataTransfer']) {
            event['dataTransfer'] = {};
        }
        event['dataTransfer']['dropEffect'] = 'mobe';
        /** @type {?} */
        var eventObj = {
            event: event,
            target: this.item
        };
        this.treeService.isDragging = this.item;
        this.treeService.lastExpandState = this.item.options.hideChildren;
        this.item.options.hideChildren = true;
        this.item.options.currentlyDragging = true;
        // call service func
        this.treeService.startDragging(eventObj);
        event.stopPropagation();
    };
    /*
        Event: onDrag;
        trigger drag items and call onDragProcess() from tree service.
        Emit OnDrag on tree service.
    */
    /*
            Event: onDrag;
            trigger drag items and call onDragProcess() from tree service.
            Emit OnDrag on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    DragElementsDirective.prototype.onDrag = /*
            Event: onDrag;
            trigger drag items and call onDragProcess() from tree service.
            Emit OnDrag on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        console.log("onDrag (drag)");
        console.log(event);
        console.log("this.item");
        console.log(this.item);
        /** @type {?} */
        var eventObj = {
            event: event,
            target: this.item
        };
        this.treeService.onDragProcess(eventObj);
    };
    /*
        Event: ondragend;
        Call dragEndAction() from tree service.
        Emit OnDragEnd on tree service.
    */
    /*
            Event: ondragend;
            Call dragEndAction() from tree service.
            Emit OnDragEnd on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    DragElementsDirective.prototype.onDragEnd = /*
            Event: ondragend;
            Call dragEndAction() from tree service.
            Emit OnDragEnd on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        console.log("onDragEnd (dragend)");
        console.log(event);
        console.log("this.item");
        console.log(this.item);
        /** @type {?} */
        var eventObj = {
            event: event,
            target: this.item
        };
        this.item.options.hideChildren = this.treeService.lastExpandState;
        this.item.options.currentlyDragging = false;
        this.treeService.dragEndAction(eventObj);
        event.stopPropagation();
    };
    DragElementsDirective.decorators = [
        { type: Directive, args: [{
                    selector: '[libDragElement]'
                },] }
    ];
    /** @nocollapse */
    DragElementsDirective.ctorParameters = function () { return [
        { type: ElementRef },
        { type: NgxTreeService }
    ]; };
    DragElementsDirective.propDecorators = {
        item: [{ type: Input }],
        draggableValue: [{ type: Input }],
        draggable: [{ type: HostBinding, args: ['draggable',] }],
        onDragStart: [{ type: HostListener, args: ['dragstart', ['$event'],] }],
        onDrag: [{ type: HostListener, args: ['drag', ['$event'],] }],
        onDragEnd: [{ type: HostListener, args: ['dragend', ['$event'],] }]
    };
    return DragElementsDirective;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var DropElementsDirective = /** @class */ (function () {
    function DropElementsDirective(el, treeService) {
        this.el = el;
        this.treeService = treeService;
        this.drop = new EventEmitter();
    }
    /*
        Event: onallowdrop;
        Call onDragOver() from tree service.
        Emit onAllowDrop on tree service.
    */
    /*
            Event: onallowdrop;
            Call onDragOver() from tree service.
            Emit onAllowDrop on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    DropElementsDirective.prototype.onDragOver = /*
            Event: onallowdrop;
            Call onDragOver() from tree service.
            Emit onAllowDrop on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        /** @type {?} */
        var eventObj = {
            event: event,
            target: this.item
        };
        this.treeService.onDragOver(eventObj);
        event.preventDefault();
    };
    /*
        Event: ondrop;
        Call onDropItem() from tree service.
        Emit OnDrop on tree service.
    */
    /*
            Event: ondrop;
            Call onDropItem() from tree service.
            Emit OnDrop on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    DropElementsDirective.prototype.onDrop = /*
            Event: ondrop;
            Call onDropItem() from tree service.
            Emit OnDrop on tree service.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        /** @type {?} */
        var dragItem = this.treeService.isDragging;
        /** @type {?} */
        var eventObj = {
            event: event,
            target: this.item
        };
        dragItem.options.hideChildren = this.treeService.lastExpandState;
        dragItem.options.currentlyDragging = false;
        if (dragItem !== eventObj.target) {
            this.treeService.onDropItem(eventObj);
        }
        event.preventDefault();
    };
    /*s
    Event: ondragenter;
    Detect event where draggable element enter in drop zone.
    Call enterDropZone() from tree service.
    Emit onDragEnter.
    */
    /*s
        Event: ondragenter;
        Detect event where draggable element enter in drop zone.
        Call enterDropZone() from tree service.
        Emit onDragEnter.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    DropElementsDirective.prototype.onDragEnter = /*s
        Event: ondragenter;
        Detect event where draggable element enter in drop zone.
        Call enterDropZone() from tree service.
        Emit onDragEnter.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        /** @type {?} */
        var eventObj = {
            event: event,
            target: this.item
        };
        this.treeService.enterDropZone(eventObj);
    };
    /*
        Event: ondragleave;
        Detect event where draggable element leave drop zone.
        Call leaveDropZone() from tree service.
        Emit onDragLeave.
    */
    /*
            Event: ondragleave;
            Detect event where draggable element leave drop zone.
            Call leaveDropZone() from tree service.
            Emit onDragLeave.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    DropElementsDirective.prototype.onDragLeave = /*
            Event: ondragleave;
            Detect event where draggable element leave drop zone.
            Call leaveDropZone() from tree service.
            Emit onDragLeave.
        */
    /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        // emit events
        /** @type {?} */
        var eventObj = {
            event: event,
            target: this.item
        };
        // code
        this.treeService.leaveDropZone(eventObj);
    };
    DropElementsDirective.decorators = [
        { type: Directive, args: [{
                    selector: '[libDropElement]'
                },] }
    ];
    /** @nocollapse */
    DropElementsDirective.ctorParameters = function () { return [
        { type: ElementRef },
        { type: NgxTreeService }
    ]; };
    DropElementsDirective.propDecorators = {
        item: [{ type: Input }],
        drop: [{ type: Output }],
        onDragOver: [{ type: HostListener, args: ['dragover', ['$event'],] }],
        onDrop: [{ type: HostListener, args: ['drop', ['$event'],] }],
        onDragEnter: [{ type: HostListener, args: ['dragenter', ['$event'],] }],
        onDragLeave: [{ type: HostListener, args: ['dragleave', ['$event'],] }]
    };
    return DropElementsDirective;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @param {?} http
 * @return {?}
 */
function HttpLoaderFactory(http) {
    return new TranslateHttpLoader(http, '/assets/i18n/', ".json");
}
library.add(faCoffee, faPlus, faEdit, faMinus, faTimes, faCheck, faArrowDown);
var NgxTreeLibModule = /** @class */ (function () {
    function NgxTreeLibModule() {
    }
    NgxTreeLibModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CommonModule,
                        ReactiveFormsModule,
                        FontAwesomeModule,
                        HttpClientModule,
                        TranslateModule.forRoot({
                            loader: {
                                provide: TranslateLoader,
                                useFactory: HttpLoaderFactory,
                                deps: [HttpClient]
                            }
                        }),
                    ],
                    declarations: [
                        AutoFocusDirective,
                        DragElementsDirective,
                        DropElementsDirective,
                        NgxTreeParentComponent,
                        NgxTreeChildrenComponent
                    ],
                    exports: [
                        AutoFocusDirective,
                        DragElementsDirective,
                        DropElementsDirective,
                        NgxTreeParentComponent,
                        NgxTreeChildrenComponent
                    ]
                },] }
    ];
    return NgxTreeLibModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

export { NgxTreeService, NgxTreeParentComponent, NgxTreeChildrenComponent, AutoFocusDirective, DragElementsDirective, DropElementsDirective, HttpLoaderFactory, NgxTreeLibModule };

//# sourceMappingURL=ngx-tree-lib.js.map