@abp/ng.components 7.2.2 → 7.3.0-rc.1

package/{fesm2020 → fesm2022}/abp-ng.components-tree.mjs

@@ -11,287 +11,287 @@ import { NzTreeModule } from 'ng-zorro-antd/tree';
 import { of } from 'rxjs';
 import * as i2 from '@angular/common';
 
-class TreeNodeTemplateDirective {
-    constructor(template) {
-        this.template = template;
-    }
-}
-TreeNodeTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TreeNodeTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-TreeNodeTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: TreeNodeTemplateDirective, selector: "[abpTreeNodeTemplate],[abp-tree-node-template]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TreeNodeTemplateDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[abpTreeNodeTemplate],[abp-tree-node-template]',
-                }]
+class TreeNodeTemplateDirective {
+    constructor(template) {
+        this.template = template;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: TreeNodeTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: TreeNodeTemplateDirective, selector: "[abpTreeNodeTemplate],[abp-tree-node-template]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: TreeNodeTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[abpTreeNodeTemplate],[abp-tree-node-template]',
+                }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
 
-class ExpandedIconTemplateDirective {
-    constructor(template) {
-        this.template = template;
-    }
-}
-ExpandedIconTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ExpandedIconTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-ExpandedIconTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: ExpandedIconTemplateDirective, selector: "[abpTreeExpandedIconTemplate],[abp-tree-expanded-icon-template]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ExpandedIconTemplateDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[abpTreeExpandedIconTemplate],[abp-tree-expanded-icon-template]',
-                }]
+class ExpandedIconTemplateDirective {
+    constructor(template) {
+        this.template = template;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ExpandedIconTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.1", type: ExpandedIconTemplateDirective, selector: "[abpTreeExpandedIconTemplate],[abp-tree-expanded-icon-template]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ExpandedIconTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[abpTreeExpandedIconTemplate],[abp-tree-expanded-icon-template]',
+                }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
 
 const DISABLE_TREE_STYLE_LOADING_TOKEN = new InjectionToken('DISABLE_TREE_STYLE_LOADING_TOKEN');
 
-class TreeComponent {
-    constructor(lazyLoadService, subscriptionService, disableTreeStyleLoading, cdr) {
-        this.lazyLoadService = lazyLoadService;
-        this.subscriptionService = subscriptionService;
-        this.disableTreeStyleLoading = disableTreeStyleLoading;
-        this.cdr = cdr;
-        this.dropdowns = {};
-        this.checkedKeysChange = new EventEmitter();
-        this.expandedKeysChange = new EventEmitter();
-        this.selectedNodeChange = new EventEmitter();
-        this.dropOver = new EventEmitter();
-        this.nzExpandChange = new EventEmitter();
-        this.noAnimation = true;
-        this.checkedKeys = [];
-        this.nodes = [];
-        this.expandedKeys = [];
-        this.isNodeSelected = node => this.selectedNode?.id === node.key;
-        this.beforeDrop = (event) => {
-            this.dropPosition = event.pos;
-            return of(false);
-        };
-    }
-    ngOnInit() {
-        this.loadStyle();
-    }
-    loadStyle() {
-        if (this.disableTreeStyleLoading) {
-            return;
-        }
-        const loaded$ = this.lazyLoadService.load(LOADING_STRATEGY.AppendAnonymousStyleToHead('ng-zorro-antd-tree.css'));
-        this.subscriptionService.addOne(loaded$);
-    }
-    findNode(target, nodes) {
-        for (const node of nodes) {
-            if (node.key === target.id) {
-                return node;
-            }
-            if (node.children) {
-                let res = this.findNode(target, node.children);
-                if (res) {
-                    return res;
-                }
-            }
-        }
-        return null;
-    }
-    onSelectedNodeChange(node) {
-        this.selectedNode = node.origin.entity;
-        if (this.changeCheckboxWithNode) {
-            let newVal;
-            if (node.isChecked) {
-                newVal = this.checkedKeys.filter(x => x !== node.key);
-            }
-            else {
-                newVal = [...this.checkedKeys, node.key];
-            }
-            this.selectedNodeChange.emit(node);
-            this.checkedKeys = newVal;
-            this.checkedKeysChange.emit(newVal);
-        }
-        else {
-            this.selectedNodeChange.emit(node.origin.entity);
-        }
-    }
-    onCheckboxChange(event) {
-        this.checkedKeys = [...event.keys];
-        this.checkedKeysChange.emit(event.keys);
-    }
-    onExpandedKeysChange(event) {
-        this.expandedKeys = [...event.keys];
-        this.expandedKeysChange.emit(event.keys);
-        this.nzExpandChange.emit(event);
-    }
-    onDrop(event) {
-        event.event.stopPropagation();
-        event.event.preventDefault();
-        event.pos = this.dropPosition;
-        this.dropOver.emit(event);
-    }
-    initDropdown(key, dropdown) {
-        this.dropdowns[key] = dropdown;
-    }
-    setSelectedNode(node) {
-        let newSelectedNode = this.findNode(node, this.nodes);
-        this.selectedNode = { ...newSelectedNode };
-        this.cdr.markForCheck();
-    }
-}
-TreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TreeComponent, deps: [{ token: i1.LazyLoadService }, { token: i1.SubscriptionService }, { token: DISABLE_TREE_STYLE_LOADING_TOKEN, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TreeComponent, selector: "abp-tree", inputs: { noAnimation: "noAnimation", draggable: "draggable", checkable: "checkable", checkStrictly: "checkStrictly", checkedKeys: "checkedKeys", nodes: "nodes", expandedKeys: "expandedKeys", selectedNode: "selectedNode", changeCheckboxWithNode: "changeCheckboxWithNode", isNodeSelected: "isNodeSelected", beforeDrop: "beforeDrop" }, outputs: { checkedKeysChange: "checkedKeysChange", expandedKeysChange: "expandedKeysChange", selectedNodeChange: "selectedNodeChange", dropOver: "dropOver", nzExpandChange: "nzExpandChange" }, providers: [SubscriptionService], queries: [{ propertyName: "menu", first: true, predicate: ["menu"], descendants: true }, { propertyName: "customNodeTemplate", first: true, predicate: TreeNodeTemplateDirective, descendants: true }, { propertyName: "expandedIconTemplate", first: true, predicate: ExpandedIconTemplateDirective, descendants: true }], ngImport: i0, template: "<nz-tree\r\n  [nzBeforeDrop]=\"beforeDrop\"\r\n  [nzDraggable]=\"draggable\"\r\n  [nzCheckStrictly]=\"checkStrictly\"\r\n  [nzCheckable]=\"checkable\"\r\n  [nzCheckedKeys]=\"checkedKeys\"\r\n  [nzData]=\"nodes\"\r\n  [nzTreeTemplate]=\"treeTemplate\"\r\n  [nzExpandedKeys]=\"expandedKeys\"\r\n  [nzExpandedIcon]=\"expandedIconTemplate?.template || defaultIconTemplate\"\r\n  (nzExpandChange)=\"onExpandedKeysChange($event)\"\r\n  (nzCheckBoxChange)=\"onCheckboxChange($event)\"\r\n  (nzOnDrop)=\"onDrop($event)\"\r\n  [nzNoAnimation]=\"noAnimation\"\r\n  (nzContextMenu)=\"dropdowns[$event.node?.key]?.toggle()\"\r\n></nz-tree>\r\n<ng-template #treeTemplate let-node>\r\n  <div\r\n    [class.selected]=\"isNodeSelected(node)\"\r\n    [title]=\"node.title\"\r\n    (click)=\"onSelectedNodeChange(node)\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { $implicit: node }\"></ng-container>\r\n\r\n    <ng-template #nodeTemplate let-node>\r\n      <div class=\"d-inline-block\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            customNodeTemplate ? customNodeTemplate?.template : defaultNodeTemplate;\r\n            context: { $implicit: node }\r\n          \"\r\n        ></ng-container>\r\n      </div>\r\n\r\n      <div\r\n        #dropdown=\"ngbDropdown\"\r\n        *ngIf=\"menu\"\r\n        class=\"d-inline-block ms-1\"\r\n        ngbDropdown\r\n        placement=\"bottom\"\r\n        container=\"body\"\r\n        (abpInit)=\"initDropdown(node.key, dropdown)\"\r\n      >\r\n        <i\r\n          class=\"fas fa-caret-down text-muted\"\r\n          ngbDropdownToggle\r\n          [class.dropdown-toggle]=\"false\"\r\n        ></i>\r\n        <div ngbDropdownMenu>\r\n          <ng-template *ngTemplateOutlet=\"menu; context: { $implicit: node }\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template #defaultNodeTemplate let-node>\r\n      <span>{{ node.title }}</span>\r\n    </ng-template>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #defaultIconTemplate let-node let-origin=\"origin\">\r\n  <i aria-hidden=\"true\">\r\n    <ng-container *ngTemplateOutlet=\"node.isExpanded ? minusIcon : plusIcon\"></ng-container\r\n  ></i>\r\n</ng-template>\r\n\r\n<ng-template #minusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm-6.5 10h13v1h-13v-1z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n\r\n<ng-template #plusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm.5 10h6v1h-6v6h-1v-6h-6v-1h6v-6h1v6z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n", styles: ["abp-tree .ant-tree{color:inherit}abp-tree .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}abp-tree .ant-tree .ant-tree-switcher{line-height:17px;align-items:center;justify-content:center;display:inline-flex}abp-tree .ant-tree .ant-tree-node-content-wrapper{width:100%;padding:0}abp-tree .ant-tree .node-wrapper{width:100%;position:relative;display:inline-block;margin:0;line-height:30px;text-decoration:none;vertical-align:top;border-radius:2px;cursor:pointer;padding:0 5px 0 8px;border:1px solid transparent}abp-tree .ant-tree .ellipsis{position:absolute;right:8px;top:1px;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.InitDirective, selector: "[abpInit]", outputs: ["abpInit"] }, { kind: "component", type: i3.NzTreeComponent, selector: "nz-tree", inputs: ["nzShowIcon", "nzHideUnMatched", "nzBlockNode", "nzExpandAll", "nzSelectMode", "nzCheckStrictly", "nzShowExpand", "nzShowLine", "nzCheckable", "nzAsyncData", "nzDraggable", "nzMultiple", "nzExpandedIcon", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualHeight", "nzTreeTemplate", "nzBeforeDrop", "nzData", "nzExpandedKeys", "nzSelectedKeys", "nzCheckedKeys", "nzSearchValue", "nzSearchFunc"], outputs: ["nzExpandedKeysChange", "nzSelectedKeysChange", "nzCheckedKeysChange", "nzSearchValueChange", "nzClick", "nzDblClick", "nzContextMenu", "nzCheckBoxChange", "nzExpandChange", "nzOnDragStart", "nzOnDragEnter", "nzOnDragOver", "nzOnDragLeave", "nzOnDrop", "nzOnDragEnd"], exportAs: ["nzTree"] }, { kind: "directive", type: i4.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i4.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i4.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "directive", type: i5.NzNoAnimationDirective, selector: "[nzNoAnimation]", inputs: ["nzNoAnimation"], exportAs: ["nzNoAnimation"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TreeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'abp-tree', encapsulation: ViewEncapsulation.None, providers: [SubscriptionService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nz-tree\r\n  [nzBeforeDrop]=\"beforeDrop\"\r\n  [nzDraggable]=\"draggable\"\r\n  [nzCheckStrictly]=\"checkStrictly\"\r\n  [nzCheckable]=\"checkable\"\r\n  [nzCheckedKeys]=\"checkedKeys\"\r\n  [nzData]=\"nodes\"\r\n  [nzTreeTemplate]=\"treeTemplate\"\r\n  [nzExpandedKeys]=\"expandedKeys\"\r\n  [nzExpandedIcon]=\"expandedIconTemplate?.template || defaultIconTemplate\"\r\n  (nzExpandChange)=\"onExpandedKeysChange($event)\"\r\n  (nzCheckBoxChange)=\"onCheckboxChange($event)\"\r\n  (nzOnDrop)=\"onDrop($event)\"\r\n  [nzNoAnimation]=\"noAnimation\"\r\n  (nzContextMenu)=\"dropdowns[$event.node?.key]?.toggle()\"\r\n></nz-tree>\r\n<ng-template #treeTemplate let-node>\r\n  <div\r\n    [class.selected]=\"isNodeSelected(node)\"\r\n    [title]=\"node.title\"\r\n    (click)=\"onSelectedNodeChange(node)\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { $implicit: node }\"></ng-container>\r\n\r\n    <ng-template #nodeTemplate let-node>\r\n      <div class=\"d-inline-block\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            customNodeTemplate ? customNodeTemplate?.template : defaultNodeTemplate;\r\n            context: { $implicit: node }\r\n          \"\r\n        ></ng-container>\r\n      </div>\r\n\r\n      <div\r\n        #dropdown=\"ngbDropdown\"\r\n        *ngIf=\"menu\"\r\n        class=\"d-inline-block ms-1\"\r\n        ngbDropdown\r\n        placement=\"bottom\"\r\n        container=\"body\"\r\n        (abpInit)=\"initDropdown(node.key, dropdown)\"\r\n      >\r\n        <i\r\n          class=\"fas fa-caret-down text-muted\"\r\n          ngbDropdownToggle\r\n          [class.dropdown-toggle]=\"false\"\r\n        ></i>\r\n        <div ngbDropdownMenu>\r\n          <ng-template *ngTemplateOutlet=\"menu; context: { $implicit: node }\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template #defaultNodeTemplate let-node>\r\n      <span>{{ node.title }}</span>\r\n    </ng-template>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #defaultIconTemplate let-node let-origin=\"origin\">\r\n  <i aria-hidden=\"true\">\r\n    <ng-container *ngTemplateOutlet=\"node.isExpanded ? minusIcon : plusIcon\"></ng-container\r\n  ></i>\r\n</ng-template>\r\n\r\n<ng-template #minusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm-6.5 10h13v1h-13v-1z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n\r\n<ng-template #plusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm.5 10h6v1h-6v6h-1v-6h-6v-1h6v-6h1v6z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n", styles: ["abp-tree .ant-tree{color:inherit}abp-tree .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}abp-tree .ant-tree .ant-tree-switcher{line-height:17px;align-items:center;justify-content:center;display:inline-flex}abp-tree .ant-tree .ant-tree-node-content-wrapper{width:100%;padding:0}abp-tree .ant-tree .node-wrapper{width:100%;position:relative;display:inline-block;margin:0;line-height:30px;text-decoration:none;vertical-align:top;border-radius:2px;cursor:pointer;padding:0 5px 0 8px;border:1px solid transparent}abp-tree .ant-tree .ellipsis{position:absolute;right:8px;top:1px;cursor:pointer}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.LazyLoadService }, { type: i1.SubscriptionService }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [DISABLE_TREE_STYLE_LOADING_TOKEN]
-                }] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { menu: [{
-                type: ContentChild,
-                args: ['menu']
-            }], customNodeTemplate: [{
-                type: ContentChild,
-                args: [TreeNodeTemplateDirective]
-            }], expandedIconTemplate: [{
-                type: ContentChild,
-                args: [ExpandedIconTemplateDirective]
-            }], checkedKeysChange: [{
-                type: Output
-            }], expandedKeysChange: [{
-                type: Output
-            }], selectedNodeChange: [{
-                type: Output
-            }], dropOver: [{
-                type: Output
-            }], nzExpandChange: [{
-                type: Output
-            }], noAnimation: [{
-                type: Input
-            }], draggable: [{
-                type: Input
-            }], checkable: [{
-                type: Input
-            }], checkStrictly: [{
-                type: Input
-            }], checkedKeys: [{
-                type: Input
-            }], nodes: [{
-                type: Input
-            }], expandedKeys: [{
-                type: Input
-            }], selectedNode: [{
-                type: Input
-            }], changeCheckboxWithNode: [{
-                type: Input
-            }], isNodeSelected: [{
-                type: Input
-            }], beforeDrop: [{
-                type: Input
+class TreeComponent {
+    constructor(lazyLoadService, subscriptionService, disableTreeStyleLoading, cdr) {
+        this.lazyLoadService = lazyLoadService;
+        this.subscriptionService = subscriptionService;
+        this.disableTreeStyleLoading = disableTreeStyleLoading;
+        this.cdr = cdr;
+        this.dropdowns = {};
+        this.checkedKeysChange = new EventEmitter();
+        this.expandedKeysChange = new EventEmitter();
+        this.selectedNodeChange = new EventEmitter();
+        this.dropOver = new EventEmitter();
+        this.nzExpandChange = new EventEmitter();
+        this.noAnimation = true;
+        this.checkedKeys = [];
+        this.nodes = [];
+        this.expandedKeys = [];
+        this.isNodeSelected = node => this.selectedNode?.id === node.key;
+        this.beforeDrop = (event) => {
+            this.dropPosition = event.pos;
+            return of(false);
+        };
+    }
+    ngOnInit() {
+        this.loadStyle();
+    }
+    loadStyle() {
+        if (this.disableTreeStyleLoading) {
+            return;
+        }
+        const loaded$ = this.lazyLoadService.load(LOADING_STRATEGY.AppendAnonymousStyleToHead('ng-zorro-antd-tree.css'));
+        this.subscriptionService.addOne(loaded$);
+    }
+    findNode(target, nodes) {
+        for (const node of nodes) {
+            if (node.key === target.id) {
+                return node;
+            }
+            if (node.children) {
+                let res = this.findNode(target, node.children);
+                if (res) {
+                    return res;
+                }
+            }
+        }
+        return null;
+    }
+    onSelectedNodeChange(node) {
+        this.selectedNode = node.origin.entity;
+        if (this.changeCheckboxWithNode) {
+            let newVal;
+            if (node.isChecked) {
+                newVal = this.checkedKeys.filter(x => x !== node.key);
+            }
+            else {
+                newVal = [...this.checkedKeys, node.key];
+            }
+            this.selectedNodeChange.emit(node);
+            this.checkedKeys = newVal;
+            this.checkedKeysChange.emit(newVal);
+        }
+        else {
+            this.selectedNodeChange.emit(node.origin.entity);
+        }
+    }
+    onCheckboxChange(event) {
+        this.checkedKeys = [...event.keys];
+        this.checkedKeysChange.emit(event.keys);
+    }
+    onExpandedKeysChange(event) {
+        this.expandedKeys = [...event.keys];
+        this.expandedKeysChange.emit(event.keys);
+        this.nzExpandChange.emit(event);
+    }
+    onDrop(event) {
+        event.event.stopPropagation();
+        event.event.preventDefault();
+        event.pos = this.dropPosition;
+        this.dropOver.emit(event);
+    }
+    initDropdown(key, dropdown) {
+        this.dropdowns[key] = dropdown;
+    }
+    setSelectedNode(node) {
+        let newSelectedNode = this.findNode(node, this.nodes);
+        this.selectedNode = { ...newSelectedNode };
+        this.cdr.markForCheck();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: TreeComponent, deps: [{ token: i1.LazyLoadService }, { token: i1.SubscriptionService }, { token: DISABLE_TREE_STYLE_LOADING_TOKEN, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: TreeComponent, selector: "abp-tree", inputs: { noAnimation: "noAnimation", draggable: "draggable", checkable: "checkable", checkStrictly: "checkStrictly", checkedKeys: "checkedKeys", nodes: "nodes", expandedKeys: "expandedKeys", selectedNode: "selectedNode", changeCheckboxWithNode: "changeCheckboxWithNode", isNodeSelected: "isNodeSelected", beforeDrop: "beforeDrop" }, outputs: { checkedKeysChange: "checkedKeysChange", expandedKeysChange: "expandedKeysChange", selectedNodeChange: "selectedNodeChange", dropOver: "dropOver", nzExpandChange: "nzExpandChange" }, providers: [SubscriptionService], queries: [{ propertyName: "menu", first: true, predicate: ["menu"], descendants: true }, { propertyName: "customNodeTemplate", first: true, predicate: TreeNodeTemplateDirective, descendants: true }, { propertyName: "expandedIconTemplate", first: true, predicate: ExpandedIconTemplateDirective, descendants: true }], ngImport: i0, template: "<nz-tree\r\n  [nzBeforeDrop]=\"beforeDrop\"\r\n  [nzDraggable]=\"draggable\"\r\n  [nzCheckStrictly]=\"checkStrictly\"\r\n  [nzCheckable]=\"checkable\"\r\n  [nzCheckedKeys]=\"checkedKeys\"\r\n  [nzData]=\"nodes\"\r\n  [nzTreeTemplate]=\"treeTemplate\"\r\n  [nzExpandedKeys]=\"expandedKeys\"\r\n  [nzExpandedIcon]=\"expandedIconTemplate?.template || defaultIconTemplate\"\r\n  (nzExpandChange)=\"onExpandedKeysChange($event)\"\r\n  (nzCheckBoxChange)=\"onCheckboxChange($event)\"\r\n  (nzOnDrop)=\"onDrop($event)\"\r\n  [nzNoAnimation]=\"noAnimation\"\r\n  (nzContextMenu)=\"dropdowns[$event.node?.key]?.toggle()\"\r\n></nz-tree>\r\n<ng-template #treeTemplate let-node>\r\n  <div\r\n    [class.selected]=\"isNodeSelected(node)\"\r\n    [title]=\"node.title\"\r\n    (click)=\"onSelectedNodeChange(node)\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { $implicit: node }\"></ng-container>\r\n\r\n    <ng-template #nodeTemplate let-node>\r\n      <div class=\"d-inline-block\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            customNodeTemplate ? customNodeTemplate?.template : defaultNodeTemplate;\r\n            context: { $implicit: node }\r\n          \"\r\n        ></ng-container>\r\n      </div>\r\n\r\n      <div\r\n        #dropdown=\"ngbDropdown\"\r\n        *ngIf=\"menu\"\r\n        class=\"d-inline-block ms-1\"\r\n        ngbDropdown\r\n        placement=\"bottom\"\r\n        container=\"body\"\r\n        (abpInit)=\"initDropdown(node.key, dropdown)\"\r\n      >\r\n        <i\r\n          class=\"fas fa-caret-down text-muted\"\r\n          ngbDropdownToggle\r\n          [class.dropdown-toggle]=\"false\"\r\n          aria-hidden=\"true\"\r\n        ></i>\r\n        <div ngbDropdownMenu>\r\n          <ng-template *ngTemplateOutlet=\"menu; context: { $implicit: node }\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template #defaultNodeTemplate let-node>\r\n      <span>{{ node.title }}</span>\r\n    </ng-template>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #defaultIconTemplate let-node let-origin=\"origin\">\r\n  <i aria-hidden=\"true\">\r\n    <ng-container *ngTemplateOutlet=\"node.isExpanded ? minusIcon : plusIcon\"></ng-container\r\n  ></i>\r\n</ng-template>\r\n\r\n<ng-template #minusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm-6.5 10h13v1h-13v-1z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n\r\n<ng-template #plusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm.5 10h6v1h-6v6h-1v-6h-6v-1h6v-6h1v6z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n", styles: ["abp-tree .ant-tree{color:inherit}abp-tree .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}abp-tree .ant-tree .ant-tree-switcher{line-height:17px;align-items:center;justify-content:center;display:inline-flex}abp-tree .ant-tree .ant-tree-node-content-wrapper{width:100%;padding:0}abp-tree .ant-tree .node-wrapper{width:100%;position:relative;display:inline-block;margin:0;line-height:30px;text-decoration:none;vertical-align:top;border-radius:2px;cursor:pointer;padding:0 5px 0 8px;border:1px solid transparent}abp-tree .ant-tree .ellipsis{position:absolute;right:8px;top:1px;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.InitDirective, selector: "[abpInit]", outputs: ["abpInit"] }, { kind: "component", type: i3.NzTreeComponent, selector: "nz-tree", inputs: ["nzShowIcon", "nzHideUnMatched", "nzBlockNode", "nzExpandAll", "nzSelectMode", "nzCheckStrictly", "nzShowExpand", "nzShowLine", "nzCheckable", "nzAsyncData", "nzDraggable", "nzMultiple", "nzExpandedIcon", "nzVirtualItemSize", "nzVirtualMaxBufferPx", "nzVirtualMinBufferPx", "nzVirtualHeight", "nzTreeTemplate", "nzBeforeDrop", "nzData", "nzExpandedKeys", "nzSelectedKeys", "nzCheckedKeys", "nzSearchValue", "nzSearchFunc"], outputs: ["nzExpandedKeysChange", "nzSelectedKeysChange", "nzCheckedKeysChange", "nzSearchValueChange", "nzClick", "nzDblClick", "nzContextMenu", "nzCheckBoxChange", "nzExpandChange", "nzOnDragStart", "nzOnDragEnter", "nzOnDragOver", "nzOnDragLeave", "nzOnDrop", "nzOnDragEnd"], exportAs: ["nzTree"] }, { kind: "directive", type: i4.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i4.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i4.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "directive", type: i5.NzNoAnimationDirective, selector: "[nzNoAnimation]", inputs: ["nzNoAnimation"], exportAs: ["nzNoAnimation"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: TreeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'abp-tree', encapsulation: ViewEncapsulation.None, providers: [SubscriptionService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<nz-tree\r\n  [nzBeforeDrop]=\"beforeDrop\"\r\n  [nzDraggable]=\"draggable\"\r\n  [nzCheckStrictly]=\"checkStrictly\"\r\n  [nzCheckable]=\"checkable\"\r\n  [nzCheckedKeys]=\"checkedKeys\"\r\n  [nzData]=\"nodes\"\r\n  [nzTreeTemplate]=\"treeTemplate\"\r\n  [nzExpandedKeys]=\"expandedKeys\"\r\n  [nzExpandedIcon]=\"expandedIconTemplate?.template || defaultIconTemplate\"\r\n  (nzExpandChange)=\"onExpandedKeysChange($event)\"\r\n  (nzCheckBoxChange)=\"onCheckboxChange($event)\"\r\n  (nzOnDrop)=\"onDrop($event)\"\r\n  [nzNoAnimation]=\"noAnimation\"\r\n  (nzContextMenu)=\"dropdowns[$event.node?.key]?.toggle()\"\r\n></nz-tree>\r\n<ng-template #treeTemplate let-node>\r\n  <div\r\n    [class.selected]=\"isNodeSelected(node)\"\r\n    [title]=\"node.title\"\r\n    (click)=\"onSelectedNodeChange(node)\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { $implicit: node }\"></ng-container>\r\n\r\n    <ng-template #nodeTemplate let-node>\r\n      <div class=\"d-inline-block\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            customNodeTemplate ? customNodeTemplate?.template : defaultNodeTemplate;\r\n            context: { $implicit: node }\r\n          \"\r\n        ></ng-container>\r\n      </div>\r\n\r\n      <div\r\n        #dropdown=\"ngbDropdown\"\r\n        *ngIf=\"menu\"\r\n        class=\"d-inline-block ms-1\"\r\n        ngbDropdown\r\n        placement=\"bottom\"\r\n        container=\"body\"\r\n        (abpInit)=\"initDropdown(node.key, dropdown)\"\r\n      >\r\n        <i\r\n          class=\"fas fa-caret-down text-muted\"\r\n          ngbDropdownToggle\r\n          [class.dropdown-toggle]=\"false\"\r\n          aria-hidden=\"true\"\r\n        ></i>\r\n        <div ngbDropdownMenu>\r\n          <ng-template *ngTemplateOutlet=\"menu; context: { $implicit: node }\"></ng-template>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    <ng-template #defaultNodeTemplate let-node>\r\n      <span>{{ node.title }}</span>\r\n    </ng-template>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #defaultIconTemplate let-node let-origin=\"origin\">\r\n  <i aria-hidden=\"true\">\r\n    <ng-container *ngTemplateOutlet=\"node.isExpanded ? minusIcon : plusIcon\"></ng-container\r\n  ></i>\r\n</ng-template>\r\n\r\n<ng-template #minusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm-6.5 10h13v1h-13v-1z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n\r\n<ng-template #plusIcon>\r\n  <svg\r\n    width=\"15\"\r\n    height=\"15\"\r\n    viewBox=\"0 0 24 24\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    fill-rule=\"evenodd\"\r\n    clip-rule=\"evenodd\"\r\n  >\r\n    <path\r\n      d=\"M11.5 0c6.347 0 11.5 5.153 11.5 11.5s-5.153 11.5-11.5 11.5-11.5-5.153-11.5-11.5 5.153-11.5 11.5-11.5zm0 1c5.795 0 10.5 4.705 10.5 10.5s-4.705 10.5-10.5 10.5-10.5-4.705-10.5-10.5 4.705-10.5 10.5-10.5zm.5 10h6v1h-6v6h-1v-6h-6v-1h6v-6h1v6z\"\r\n    />\r\n  </svg>\r\n</ng-template>\r\n", styles: ["abp-tree .ant-tree{color:inherit}abp-tree .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{background-color:transparent}abp-tree .ant-tree .ant-tree-switcher{line-height:17px;align-items:center;justify-content:center;display:inline-flex}abp-tree .ant-tree .ant-tree-node-content-wrapper{width:100%;padding:0}abp-tree .ant-tree .node-wrapper{width:100%;position:relative;display:inline-block;margin:0;line-height:30px;text-decoration:none;vertical-align:top;border-radius:2px;cursor:pointer;padding:0 5px 0 8px;border:1px solid transparent}abp-tree .ant-tree .ellipsis{position:absolute;right:8px;top:1px;cursor:pointer}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.LazyLoadService }, { type: i1.SubscriptionService }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [DISABLE_TREE_STYLE_LOADING_TOKEN]
+                }] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { menu: [{
+                type: ContentChild,
+                args: ['menu']
+            }], customNodeTemplate: [{
+                type: ContentChild,
+                args: [TreeNodeTemplateDirective]
+            }], expandedIconTemplate: [{
+                type: ContentChild,
+                args: [ExpandedIconTemplateDirective]
+            }], checkedKeysChange: [{
+                type: Output
+            }], expandedKeysChange: [{
+                type: Output
+            }], selectedNodeChange: [{
+                type: Output
+            }], dropOver: [{
+                type: Output
+            }], nzExpandChange: [{
+                type: Output
+            }], noAnimation: [{
+                type: Input
+            }], draggable: [{
+                type: Input
+            }], checkable: [{
+                type: Input
+            }], checkStrictly: [{
+                type: Input
+            }], checkedKeys: [{
+                type: Input
+            }], nodes: [{
+                type: Input
+            }], expandedKeys: [{
+                type: Input
+            }], selectedNode: [{
+                type: Input
+            }], changeCheckboxWithNode: [{
+                type: Input
+            }], isNodeSelected: [{
+                type: Input
+            }], beforeDrop: [{
+                type: Input
             }] } });
 
-const templates = [TreeNodeTemplateDirective, ExpandedIconTemplateDirective];
-const exported = [...templates, TreeComponent];
-class TreeModule {
-}
-TreeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-TreeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: TreeModule, declarations: [TreeNodeTemplateDirective, ExpandedIconTemplateDirective, TreeComponent], imports: [CoreModule, NzTreeModule, NgbDropdownModule, NzNoAnimationModule], exports: [TreeNodeTemplateDirective, ExpandedIconTemplateDirective, TreeComponent] });
-TreeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TreeModule, imports: [CoreModule, NzTreeModule, NgbDropdownModule, NzNoAnimationModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TreeModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [CoreModule, NzTreeModule, NgbDropdownModule, NzNoAnimationModule],
-                    exports: [...exported],
-                    declarations: [...exported],
-                }]
+const templates = [TreeNodeTemplateDirective, ExpandedIconTemplateDirective];
+const exported = [...templates, TreeComponent];
+class TreeModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: TreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: TreeModule, declarations: [TreeNodeTemplateDirective, ExpandedIconTemplateDirective, TreeComponent], imports: [CoreModule, NzTreeModule, NgbDropdownModule, NzNoAnimationModule], exports: [TreeNodeTemplateDirective, ExpandedIconTemplateDirective, TreeComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: TreeModule, imports: [CoreModule, NzTreeModule, NgbDropdownModule, NzNoAnimationModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: TreeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CoreModule, NzTreeModule, NgbDropdownModule, NzNoAnimationModule],
+                    exports: [...exported],
+                    declarations: [...exported],
+                }]
         }] });
 
-class BaseNode {
-    constructor(id, parentId) {
-        this.id = id;
-        this.parentId = parentId;
-    }
-}
-class TreeNode extends BaseNode {
-    constructor(entity, nameResolver = ent => ent.displayName || ent.name) {
-        super(entity.id, entity.parentId);
-        this.entity = entity;
-        this.nameResolver = nameResolver;
-        this.icon = null;
-        this.children = [];
-        this.isLeaf = true;
-        this.checked = false;
-        this.selected = false;
-        this.expanded = false;
-        this.selectable = true;
-        this.disabled = false;
-        this.disableCheckbox = false;
-        this.key = entity.id;
-        this.title = nameResolver(entity);
-    }
-}
-class TreeAdapter {
-    constructor(list = []) {
-        this.list = list;
-        this.tree = createTreeFromList(this.list);
-    }
-    getList() {
-        return this.list;
-    }
-    getTree() {
-        return this.tree;
-    }
-    handleDrop({ key, parentNode }) {
-        const index = this.list.findIndex(({ id }) => id === key);
-        this.list[index].parentId = parentNode ? parentNode.key : null;
-        this.tree = createTreeFromList(this.list);
-    }
-    handleRemove({ key }) {
-        this.updateTreeFromList(this.list.filter(item => item.id !== key));
-    }
-    handleUpdate({ key, children }) {
-        /**
-         * When we need to update a node with new children, first we need to remove any descendant nodes.
-         * If we remove immediate children and create a new tree, any other descendant nodes will be removed
-         * and we won't need to recursively remove sub children.
-         * Then, you simply add back the new children and create a new tree.
-         */
-        const listWithDescendantNodesRemoved = this.updateTreeFromList(this.list.filter(item => item.parentId !== key));
-        this.updateTreeFromList(listWithDescendantNodesRemoved.concat(children));
-    }
-    updateTreeFromList(list) {
-        this.tree = createTreeFromList(list);
-        this.list = createListFromTree(this.tree);
-        return this.list;
-    }
-}
-// UTILITY FUNCTIONS
-function createTreeFromList(list) {
-    const map = createMapFromList(list);
-    const tree = [];
-    list.forEach(row => {
-        const parentId = row.parentId;
-        const node = map.get(row.id);
-        if (parentId) {
-            const parent = map.get(parentId);
-            if (!parent)
-                return;
-            parent.children.push(node);
-            parent.isLeaf = false;
-        }
-        else {
-            tree.push(node);
-        }
-    });
-    return tree;
-}
-function createListFromTree(tree, list = []) {
-    tree.forEach(node => {
-        list.push({ ...node.entity, parentId: node.parentId });
-        if (node.children)
-            createListFromTree(node.children, list);
-    });
-    return list;
-}
-function createMapFromList(list, map = new Map()) {
-    list.forEach(row => map.set(row.id, new TreeNode(row)));
-    return map;
+class BaseNode {
+    constructor(id, parentId) {
+        this.id = id;
+        this.parentId = parentId;
+    }
+}
+class TreeNode extends BaseNode {
+    constructor(entity, nameResolver = ent => ent.displayName || ent.name) {
+        super(entity.id, entity.parentId);
+        this.entity = entity;
+        this.nameResolver = nameResolver;
+        this.icon = null;
+        this.children = [];
+        this.isLeaf = true;
+        this.checked = false;
+        this.selected = false;
+        this.expanded = false;
+        this.selectable = true;
+        this.disabled = false;
+        this.disableCheckbox = false;
+        this.key = entity.id;
+        this.title = nameResolver(entity);
+    }
+}
+class TreeAdapter {
+    constructor(list = []) {
+        this.list = list;
+        this.tree = createTreeFromList(this.list);
+    }
+    getList() {
+        return this.list;
+    }
+    getTree() {
+        return this.tree;
+    }
+    handleDrop({ key, parentNode }) {
+        const index = this.list.findIndex(({ id }) => id === key);
+        this.list[index].parentId = parentNode ? parentNode.key : null;
+        this.tree = createTreeFromList(this.list);
+    }
+    handleRemove({ key }) {
+        this.updateTreeFromList(this.list.filter(item => item.id !== key));
+    }
+    handleUpdate({ key, children }) {
+        /**
+         * When we need to update a node with new children, first we need to remove any descendant nodes.
+         * If we remove immediate children and create a new tree, any other descendant nodes will be removed
+         * and we won't need to recursively remove sub children.
+         * Then, you simply add back the new children and create a new tree.
+         */
+        const listWithDescendantNodesRemoved = this.updateTreeFromList(this.list.filter(item => item.parentId !== key));
+        this.updateTreeFromList(listWithDescendantNodesRemoved.concat(children));
+    }
+    updateTreeFromList(list) {
+        this.tree = createTreeFromList(list);
+        this.list = createListFromTree(this.tree);
+        return this.list;
+    }
+}
+// UTILITY FUNCTIONS
+function createTreeFromList(list) {
+    const map = createMapFromList(list);
+    const tree = [];
+    list.forEach(row => {
+        const parentId = row.parentId;
+        const node = map.get(row.id);
+        if (parentId) {
+            const parent = map.get(parentId);
+            if (!parent)
+                return;
+            parent.children.push(node);
+            parent.isLeaf = false;
+        }
+        else {
+            tree.push(node);
+        }
+    });
+    return tree;
+}
+function createListFromTree(tree, list = []) {
+    tree.forEach(node => {
+        list.push({ ...node.entity, parentId: node.parentId });
+        if (node.children)
+            createListFromTree(node.children, list);
+    });
+    return list;
+}
+function createMapFromList(list, map = new Map()) {
+    list.forEach(row => map.set(row.id, new TreeNode(row)));
+    return map;
 }
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { BaseNode, DISABLE_TREE_STYLE_LOADING_TOKEN, ExpandedIconTemplateDirective, TreeAdapter, TreeComponent, TreeModule, TreeNode, TreeNodeTemplateDirective };