@limble/limble-tree 0.12.2 → 0.13.0

package/{fesm2015/limble-limble-tree.js → fesm2020/limble-limble-tree.mjs}

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { Injectable, Component, ChangeDetectionStrategy, Input, ViewContainerRef, ViewChild, ElementRef, EventEmitter, Directive, Output, NgZone, NgModule } from '@angular/core';
-import { Subject, BehaviorSubject, EMPTY, fromEvent, merge } from 'rxjs';
+import { Subject, BehaviorSubject, fromEvent, merge, EMPTY } from 'rxjs';
 import { tap, filter, debounce, throttleTime, skip, first, skipUntil, debounceTime } from 'rxjs/operators';
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
@@ -195,13 +195,12 @@ class DragStateService {
     }
     /** Called to indicate that a drop into a valid drop zone has occurred. Returns the item that was dropped.  */
     capture() {
-        var _a;
         if (this.state !== "droppable") {
             throw new Error("Can only move to `captured` state from `droppable` state");
         }
         this.state = "captured";
         this.state$.next(this.state);
-        return (_a = this._tempData) === null || _a === void 0 ? void 0 : _a.branch;
+        return this._tempData?.branch;
     }
     /** Called to reset the service for future drags */
     release() {
@@ -284,7 +283,7 @@ class DropZoneService {
             .pipe(debounce(() => {
             if (treeIsStable === true) {
                 //If tree is stable, continue right away
-                return EMPTY;
+                return Promise.resolve();
             }
             //If tree is not stable, wait for it to become so.
             return treeIsStable$;
@@ -478,15 +477,14 @@ class DropZoneService {
                 location.parentCoordinates.length > 0);
         })
             .sort((valueA, valueB) => {
-            var _a, _b, _c, _d;
             const aCoordinates = valueA.getFullInsertCoordinates();
             const bCoordinates = valueB.getFullInsertCoordinates();
             const length = Math.max(aCoordinates.length, bCoordinates.length);
             for (let index = 0; index < length; index++) {
-                if (((_a = aCoordinates[index]) !== null && _a !== void 0 ? _a : -1) > ((_b = bCoordinates[index]) !== null && _b !== void 0 ? _b : -1)) {
+                if ((aCoordinates[index] ?? -1) > (bCoordinates[index] ?? -1)) {
                     return -1;
                 }
-                else if (((_c = aCoordinates[index]) !== null && _c !== void 0 ? _c : -1) < ((_d = bCoordinates[index]) !== null && _d !== void 0 ? _d : -1)) {
+                else if ((aCoordinates[index] ?? -1) < (bCoordinates[index] ?? -1)) {
                     return 1;
                 }
             }
@@ -596,19 +594,24 @@ class DropZoneService {
         if (data === undefined) {
             throw new Error("Can't get dragged node");
         }
-        const dropZoneParent = this.tree.findByCoordinates(dropZone.getLocation().parentCoordinates);
+        const parentCoordinates = dropZone.getLocation().parentCoordinates;
+        const dropZoneParent = this.tree.findByCoordinates(parentCoordinates);
         if (dropZoneParent === undefined) {
             throw new Error("Could not get drop zone parent");
         }
+        if (parentCoordinates.length > 0 &&
+            !isNestingAllowed(this.treeOptions, dropZoneParent.data)) {
+            return false;
+        }
         const dropZoneIndex = dropZone.getLocation().insertIndex;
         if (dropZoneIndex === undefined) {
             throw new Error("Could not get drop zone index");
         }
         const draggedNode = data.branch;
-        if (this.treeOptions.allowDrop(draggedNode.data, dropZoneParent.data, dropZoneIndex)) {
-            return true;
+        if (!this.treeOptions.allowDrop(draggedNode.data, dropZoneParent.data, dropZoneIndex)) {
+            return false;
         }
-        return false;
+        return true;
     }
 }
 DropZoneService.ɵfac = function DropZoneService_Factory(t) { return new (t || DropZoneService)(i0.ɵɵinject(DragStateService), i0.ɵɵinject(TreeConstructionStatus)); };
@@ -774,7 +777,7 @@ const _c0$3 = function (a0, a1) { return { active: a0, related: a1 }; };
 function DropZoneComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 1);
-    i0.ɵɵlistener("dragenter", function DropZoneComponent_div_0_Template_div_dragenter_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r1 = i0.ɵɵnextContext(); return ctx_r1.dragenterHandler(); });
+    i0.ɵɵlistener("dragenter", function DropZoneComponent_div_0_Template_div_dragenter_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.dragenterHandler()); });
     i0.ɵɵelement(1, "div", 2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -802,14 +805,13 @@ class DropZoneComponent {
         this.commSubscription = this.dropZone
             .getCommChannel()
             .subscribe((message) => {
-            var _a, _b, _c, _d;
             switch (message) {
                 case "checkVisible": {
-                    this.visible = (_b = (_a = this.dropZone) === null || _a === void 0 ? void 0 : _a.isVisible()) !== null && _b !== void 0 ? _b : false;
+                    this.visible = this.dropZone?.isVisible() ?? false;
                     break;
                 }
                 case "checkActive": {
-                    this.active = (_d = (_c = this.dropZone) === null || _c === void 0 ? void 0 : _c.isActive()) !== null && _d !== void 0 ? _d : false;
+                    this.active = this.dropZone?.isActive() ?? false;
                     break;
                 }
                 case "checkRendered": {
@@ -834,15 +836,10 @@ DropZoneComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DropZoneC
         i0.ɵɵtemplate(0, DropZoneComponent_div_0_Template, 2, 4, "div", 0);
     } if (rf & 2) {
         i0.ɵɵproperty("ngIf", ctx.visible);
-    } }, directives: [i2.NgIf, i2.NgClass], styles: [".active[_ngcontent-%COMP%]{height:105px;border-radius:5px;background:#f0f9ff;border:2px dashed #bed2db}.active[_ngcontent-%COMP%], .related[_ngcontent-%COMP%]{margin:10px 0;width:calc(100% - 20px);box-sizing:border-box}.related[_ngcontent-%COMP%]{height:30px;border-radius:5px;background:#fff6f0;border:1px dashed #dbccbe;opacity:.8}.dropZoneContainer[_ngcontent-%COMP%]{position:relative}"], changeDetection: 0 });
+    } }, dependencies: [i2.NgClass, i2.NgIf], styles: [".active[_ngcontent-%COMP%]{margin:10px 0;width:calc(100% - 20px);height:105px;border-radius:5px;background:#f0f9ff;border:2px dashed #bed2db;box-sizing:border-box}.related[_ngcontent-%COMP%]{margin:10px 0;width:calc(100% - 20px);height:30px;border-radius:5px;background:#fff6f0;border:1px dashed #dbccbe;box-sizing:border-box;opacity:.8}.dropZoneContainer[_ngcontent-%COMP%]{position:relative}"], changeDetection: 0 });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DropZoneComponent, [{
         type: Component,
-        args: [{
-                selector: "drop-zone",
-                templateUrl: "./drop-zone.component.html",
-                styleUrls: ["./drop-zone.component.scss"],
-                changeDetection: ChangeDetectionStrategy.OnPush
-            }]
+        args: [{ selector: "drop-zone", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dropZoneContainer\" (dragenter)=\"dragenterHandler()\" *ngIf=\"visible\">\n   <div [ngClass]=\"{ active: active, related: !active }\"></div>\n</div>\n", styles: [".active{margin:10px 0;width:calc(100% - 20px);height:105px;border-radius:5px;background:#f0f9ff;border:2px dashed #bed2db;box-sizing:border-box}.related{margin:10px 0;width:calc(100% - 20px);height:30px;border-radius:5px;background:#fff6f0;border:1px dashed #dbccbe;box-sizing:border-box;opacity:.8}.dropZoneContainer{position:relative}\n"] }]
     }], function () { return [{ type: DropZoneService }, { type: i0.ChangeDetectorRef }]; }, { dropZone: [{
             type: Input
         }] }); })();
@@ -857,14 +854,13 @@ function LimbleTreeBranchComponent_drop_zone_1_Template(rf, ctx) { if (rf & 1) {
 function LimbleTreeBranchComponent_ng_template_3_Template(rf, ctx) { }
 class LimbleTreeBranchComponent {
     constructor(treeService, changeDetectorRef, dropZoneService, treeConstructionStatus, ngZone) {
-        var _a;
         this.treeService = treeService;
         this.changeDetectorRef = changeDetectorRef;
         this.dropZoneService = dropZoneService;
         this.treeConstructionStatus = treeConstructionStatus;
         this.ngZone = ngZone;
         this.treeConstructionStatus.constructing();
-        this.indent = (_a = this.treeService.treeOptions) === null || _a === void 0 ? void 0 : _a.indent;
+        this.indent = this.treeService.treeOptions?.indent;
         this.renderDropZoneInside = false;
     }
     ngOnInit() {
@@ -930,22 +926,17 @@ LimbleTreeBranchComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: L
         i0.ɵɵtemplate(1, LimbleTreeBranchComponent_drop_zone_1_Template, 1, 1, "drop-zone", 0);
         i0.ɵɵelementStart(2, "span", 1);
         i0.ɵɵtemplate(3, LimbleTreeBranchComponent_ng_template_3_Template, 0, 0, "ng-template", null, 2, i0.ɵɵtemplateRefExtractor);
-        i0.ɵɵelementEnd();
-        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd()();
     } if (rf & 2) {
         i0.ɵɵstyleProp("margin-left", ctx.indent, "px");
         i0.ɵɵadvance(1);
         i0.ɵɵproperty("ngIf", ctx.renderDropZoneInside);
         i0.ɵɵadvance(1);
         i0.ɵɵproperty("hidden", ctx.branch && ctx.branch.data.collapsed);
-    } }, directives: [i2.NgIf, DropZoneComponent], styles: [""] });
+    } }, dependencies: [i2.NgIf, DropZoneComponent] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LimbleTreeBranchComponent, [{
         type: Component,
-        args: [{
-                selector: "limble-tree-branch",
-                templateUrl: "./limble-tree-branch.component.html",
-                styleUrls: ["./limble-tree-branch.component.scss"]
-            }]
+        args: [{ selector: "limble-tree-branch", template: "<div [style.marginLeft.px]=\"indent\">\n   <drop-zone\n      *ngIf=\"renderDropZoneInside\"\n      [dropZone]=\"dropZoneInside\"\n   ></drop-zone>\n   <span [hidden]=\"branch && branch.data.collapsed\" class=\"limble-child-nodes\">\n      <ng-template #children></ng-template>\n   </span>\n</div>\n" }]
     }], function () { return [{ type: TreeService }, { type: i0.ChangeDetectorRef }, { type: DropZoneService }, { type: TreeConstructionStatus }, { type: i0.NgZone }]; }, { branch: [{
             type: Input
         }], children: [{
@@ -971,7 +962,6 @@ ComponentCreatorService.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token:
     }], function () { return [{ type: i0.ComponentFactoryResolver }]; }, null); })();
 
 function getScrollParent(element) {
-    var _a;
     const regex = /(auto|scroll)/;
     const parents = (_node, parentList) => {
         if (_node === null || _node.parentNode === null) {
@@ -990,7 +980,7 @@ function getScrollParent(element) {
             return parent;
         }
     }
-    return ((_a = document.scrollingElement) !== null && _a !== void 0 ? _a : document.documentElement);
+    return (document.scrollingElement ?? document.documentElement);
 }
 class GlobalEventsService {
     constructor(ngZone) {
@@ -1162,20 +1152,19 @@ class LimbleTreeNodeComponent {
         }
     }
     ngOnInit() {
-        var _a, _b, _c;
-        if (((_a = this.treeService.treeOptions) === null || _a === void 0 ? void 0 : _a.allowDragging) === false) {
+        if (this.treeService.treeOptions?.allowDragging === false) {
             return;
         }
-        const parent = (_b = this.branch) === null || _b === void 0 ? void 0 : _b.getParent();
-        if ((parent === null || parent === void 0 ? void 0 : parent.data) !== null) {
-            const parentData = parent === null || parent === void 0 ? void 0 : parent.data;
+        const parent = this.branch?.getParent();
+        if (parent?.data !== null) {
+            const parentData = parent?.data;
             if (!isNestingAllowed(this.treeService.treeOptions, parentData)) {
                 this.renderInnerBranch = false;
                 return;
             }
         }
         this.registerDropZones();
-        this.currentBranchCoordinates = (_c = this.branch) === null || _c === void 0 ? void 0 : _c.getCoordinates();
+        this.currentBranchCoordinates = this.branch?.getCoordinates();
         this.ngZone.runOutsideAngular(() => {
             if (this.dropZoneAbove === undefined ||
                 this.dropZoneBelow === undefined) {
@@ -1212,7 +1201,6 @@ class LimbleTreeNodeComponent {
         this.treeService.cleanupSignal$.next(true);
     }
     dragstartHandler(event) {
-        var _a;
         event.stopPropagation();
         if (event.dataTransfer === null ||
             this.branch === undefined ||
@@ -1220,7 +1208,7 @@ class LimbleTreeNodeComponent {
             throw new Error("failed to run dragstartHandler");
         }
         const draggedElement = event.target;
-        if (((_a = draggedElement.parentElement) === null || _a === void 0 ? void 0 : _a.tagName) !== "LIMBLE-TREE-NODE") {
+        if (draggedElement.parentElement?.tagName !== "LIMBLE-TREE-NODE") {
             //Don't drag stuff that isn't part of the tree
             event.preventDefault();
             return;
@@ -1234,10 +1222,9 @@ class LimbleTreeNodeComponent {
         this.ngZone.runOutsideAngular(() => {
             //We have to use a setTimeout due to a bug in chrome: https://stackoverflow.com/a/20733870/8796651
             setTimeout(() => {
-                var _a, _b;
                 draggedElement.classList.add("dragging");
-                if (((_a = this.treeService.treeData) === null || _a === void 0 ? void 0 : _a.length) === 1 &&
-                    ((_b = this.branch) === null || _b === void 0 ? void 0 : _b.getCoordinates().length) === 1) {
+                if (this.treeService.treeData?.length === 1 &&
+                    this.branch?.getCoordinates().length === 1) {
                     //We are dragging the only element in the tree, so we have to use the placeholder system
                     this.treeService.placeholder$.next(true);
                 }
@@ -1258,8 +1245,8 @@ class LimbleTreeNodeComponent {
                 const parent = this.branch.getParent();
                 let parentData;
                 let parentNestingAllowed = true;
-                if ((parent === null || parent === void 0 ? void 0 : parent.data) !== null) {
-                    parentData = parent === null || parent === void 0 ? void 0 : parent.data;
+                if (parent?.data !== null) {
+                    parentData = parent?.data;
                     parentNestingAllowed = isNestingAllowed(this.treeService.treeOptions, parentData);
                 }
                 if (this.dropZoneAbove !== undefined && parentNestingAllowed) {
@@ -1276,8 +1263,7 @@ class LimbleTreeNodeComponent {
         });
     }
     dragendHandler(event) {
-        var _a, _b;
-        event === null || event === void 0 ? void 0 : event.stopPropagation();
+        event?.stopPropagation();
         if (this.draggableDiv === undefined) {
             throw new Error("could not get draggable div");
         }
@@ -1299,8 +1285,8 @@ class LimbleTreeNodeComponent {
             this.dragStateService.release();
             this.dropZoneService.clearVisibleZones();
             this.dropZoneService.restoreFamilies();
-            if (((_a = this.treeService.treeData) === null || _a === void 0 ? void 0 : _a.length) === 1 &&
-                ((_b = this.branch) === null || _b === void 0 ? void 0 : _b.getCoordinates().length) === 1) {
+            if (this.treeService.treeData?.length === 1 &&
+                this.branch?.getCoordinates().length === 1) {
                 //We were dragging the only element in the tree, so we have to
                 //remove the placeholder that we added in the dragstart
                 this.treeService.placeholder$.next(false);
@@ -1308,7 +1294,6 @@ class LimbleTreeNodeComponent {
         }
     }
     dragoverHandler(event) {
-        var _a, _b, _c;
         if (this.globalEventsService.scrolling === true) {
             return;
         }
@@ -1332,7 +1317,7 @@ class LimbleTreeNodeComponent {
         }
         let topLine;
         let bottomLine;
-        if (((_a = this.innerBranch) === null || _a === void 0 ? void 0 : _a.renderDropZoneInside) === false) {
+        if (this.innerBranch?.renderDropZoneInside === false) {
             topLine = target.offsetHeight / 2 - 6;
             bottomLine = topLine;
         }
@@ -1343,8 +1328,8 @@ class LimbleTreeNodeComponent {
         const parent = this.branch.getParent();
         let parentData;
         let parentNestingAllowed = true;
-        if ((parent === null || parent === void 0 ? void 0 : parent.data) !== null) {
-            parentData = parent === null || parent === void 0 ? void 0 : parent.data;
+        if (parent?.data !== null) {
+            parentData = parent?.data;
             parentNestingAllowed = isNestingAllowed(this.treeService.treeOptions, parentData);
         }
         /** The y-coordinates of the mouse in relation to the node it is hovering over */
@@ -1352,9 +1337,9 @@ class LimbleTreeNodeComponent {
         const activeDropZone = this.dropZoneService.getActiveDropZone();
         if (offsetY < topLine &&
             this.dropZoneAbove !== undefined &&
+            parentNestingAllowed &&
             (activeDropZone === null ||
-                !DropZone.dropZoneLocationsAreEqual(activeDropZone, this.dropZoneAbove)) &&
-            parentNestingAllowed) {
+                !DropZone.dropZoneLocationsAreEqual(activeDropZone, this.dropZoneAbove))) {
             const index = this.branch.getIndex();
             if (index === undefined || index === null) {
                 throw new Error("can't get branch index");
@@ -1368,8 +1353,8 @@ class LimbleTreeNodeComponent {
         }
         else if (offsetY < bottomLine &&
             offsetY > topLine &&
-            ((_b = this.innerBranch) === null || _b === void 0 ? void 0 : _b.renderDropZoneInside) === true &&
-            ((_c = this.innerBranch) === null || _c === void 0 ? void 0 : _c.dropZoneInside) !== undefined &&
+            this.innerBranch?.renderDropZoneInside === true &&
+            this.innerBranch?.dropZoneInside !== undefined &&
             (activeDropZone === null ||
                 !DropZone.dropZoneLocationsAreEqual(activeDropZone, this.innerBranch.dropZoneInside))) {
             this.dropZoneService.showDropZoneFamily(this.innerBranch.dropZoneInside);
@@ -1379,10 +1364,10 @@ class LimbleTreeNodeComponent {
         }
         else if (offsetY >= bottomLine &&
             this.dropZoneBelow !== undefined &&
+            parentNestingAllowed &&
             (activeDropZone === null ||
                 !DropZone.dropZoneLocationsAreEqual(activeDropZone, this.dropZoneBelow)) &&
-            this.branch.getChildren().length === 0 &&
-            parentNestingAllowed) {
+            this.branch.getChildren().length === 0) {
             const index = this.branch.getIndex();
             if (index === undefined || index === null) {
                 throw new Error("can't get branch index");
@@ -1394,13 +1379,12 @@ class LimbleTreeNodeComponent {
         }
     }
     renderNode() {
-        var _a;
         if (this.nodeHost === undefined || this.branch === undefined) {
             throw new Error("Failed to render tree node");
         }
         let component = this.branch.data.component;
         if (component === undefined) {
-            component = (_a = this.treeService.treeOptions) === null || _a === void 0 ? void 0 : _a.defaultComponent;
+            component = this.treeService.treeOptions?.defaultComponent;
         }
         if (component === undefined) {
             throw new Error("limbleTree requires a component to render");
@@ -1416,37 +1400,33 @@ class LimbleTreeNodeComponent {
         this.addDropZoneBelow();
     }
     addDropZoneAbove() {
-        var _a;
         if (this.branch === undefined) {
             throw new Error("failed to register drop zone above");
         }
         const parent = this.branch.getParent();
         const currentCoordinates = this.branch.getCoordinates();
         const index = currentCoordinates[currentCoordinates.length - 1];
-        this.dropZoneAbove = new DropZone([...((_a = parent === null || parent === void 0 ? void 0 : parent.getCoordinates()) !== null && _a !== void 0 ? _a : [])], index);
+        this.dropZoneAbove = new DropZone([...(parent?.getCoordinates() ?? [])], index);
         this.dropZoneService.addDropZone(this.dropZoneAbove);
     }
     addDropZoneBelow() {
-        var _a;
         if (this.branch === undefined) {
             throw new Error("failed to register drop zone below");
         }
         const parent = this.branch.getParent();
         const currentCoordinates = this.branch.getCoordinates();
         const index = currentCoordinates[currentCoordinates.length - 1];
-        this.dropZoneBelow = new DropZone([...((_a = parent === null || parent === void 0 ? void 0 : parent.getCoordinates()) !== null && _a !== void 0 ? _a : [])], index + 1);
+        this.dropZoneBelow = new DropZone([...(parent?.getCoordinates() ?? [])], index + 1);
         this.dropZoneService.addDropZone(this.dropZoneBelow);
     }
     updateDropZones() {
-        var _a;
-        this.currentBranchCoordinates = (_a = this.branch) === null || _a === void 0 ? void 0 : _a.getCoordinates();
+        this.currentBranchCoordinates = this.branch?.getCoordinates();
         this.updateDropZoneAbove();
         this.updateDropZoneBelow();
         this.updateDropZoneInside();
         this.setDropZoneHosts();
     }
     updateDropZoneAbove() {
-        var _a;
         if (this.branch === undefined || this.dropZoneAbove === undefined) {
             throw new Error("failed to update drop zone above");
         }
@@ -1454,11 +1434,10 @@ class LimbleTreeNodeComponent {
         const currentCoordinates = this.branch.getCoordinates();
         const index = currentCoordinates[currentCoordinates.length - 1];
         const location = this.dropZoneAbove.getLocation();
-        location.setParentCoordinates([...((_a = parent === null || parent === void 0 ? void 0 : parent.getCoordinates()) !== null && _a !== void 0 ? _a : [])]);
+        location.setParentCoordinates([...(parent?.getCoordinates() ?? [])]);
         location.setInsertIndex(index);
     }
     updateDropZoneBelow() {
-        var _a;
         if (this.branch === undefined || this.dropZoneBelow === undefined) {
             throw new Error("failed to update drop zone below");
         }
@@ -1466,12 +1445,11 @@ class LimbleTreeNodeComponent {
         const currentCoordinates = this.branch.getCoordinates();
         const index = currentCoordinates[currentCoordinates.length - 1];
         const location = this.dropZoneBelow.getLocation();
-        location.setParentCoordinates([...((_a = parent === null || parent === void 0 ? void 0 : parent.getCoordinates()) !== null && _a !== void 0 ? _a : [])]);
+        location.setParentCoordinates([...(parent?.getCoordinates() ?? [])]);
         location.setInsertIndex(index + 1);
     }
     updateDropZoneInside() {
-        var _a;
-        if (((_a = this.innerBranch) === null || _a === void 0 ? void 0 : _a.dropZoneInside) === undefined) {
+        if (this.innerBranch?.dropZoneInside === undefined) {
             return;
         }
         if (this.branch === undefined) {
@@ -1489,7 +1467,6 @@ class LimbleTreeNodeComponent {
         this.dropZoneBelow.setHost(this.parentHost);
     }
     checkForHandle() {
-        var _a;
         if (this.nodeHostContainer === undefined ||
             this.draggableDiv === undefined) {
             return;
@@ -1497,7 +1474,7 @@ class LimbleTreeNodeComponent {
         const nodeHostContainerElement = this.nodeHostContainer.nativeElement;
         const handle = nodeHostContainerElement.querySelector(".limble-tree-handle");
         const draggableDivElement = this.draggableDiv.nativeElement;
-        if (!isDraggingAllowed(this.treeService.treeOptions, (_a = this.branch) === null || _a === void 0 ? void 0 : _a.data)) {
+        if (!isDraggingAllowed(this.treeService.treeOptions, this.branch?.data)) {
             draggableDivElement.setAttribute("draggable", "false");
         }
         else if (handle === null) {
@@ -1548,14 +1525,10 @@ LimbleTreeNodeComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Lim
         i0.ɵɵproperty("ngIf", ctx.branch !== undefined && ctx.renderInnerBranch === true);
         i0.ɵɵadvance(1);
         i0.ɵɵproperty("ngIf", ctx.renderDropZoneBelow === true);
-    } }, styles: [".dragging[_ngcontent-%COMP%]{position:absolute;transition:transform .01s;transform:translateX(-9999px)}"] });
+    } }, styles: [".dragging[_ngcontent-%COMP%]{position:absolute;transition:transform .01s;transform:translate(-9999px)}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LimbleTreeNodeComponent, [{
         type: Component,
-        args: [{
-                selector: "limble-tree-node",
-                templateUrl: "./limble-tree-node.component.html",
-                styleUrls: ["./limble-tree-node.component.scss"]
-            }]
+        args: [{ selector: "limble-tree-node", template: "<drop-zone\n   *ngIf=\"renderDropZoneAbove === true\"\n   [dropZone]=\"dropZoneAbove\"\n></drop-zone>\n<div\n   (dragstart)=\"dragstartHandler($event)\"\n   (dragend)=\"dragendHandler($event)\"\n   class=\"limble-parent-container\"\n   #draggableDiv\n>\n   <div\n      class=\"node-host-container\"\n      (dragoverNoChangeDetect)=\"dragoverHandler($event)\"\n      [dragoverEventThrottle]=\"10\"\n      #nodeHostContainer\n   >\n      <ng-template #nodeHost></ng-template>\n   </div>\n   <limble-tree-branch\n      *ngIf=\"branch !== undefined && renderInnerBranch === true\"\n      [branch]=\"branch\"\n      #innerBranch\n   ></limble-tree-branch>\n</div>\n<drop-zone\n   *ngIf=\"renderDropZoneBelow === true\"\n   [dropZone]=\"dropZoneBelow\"\n></drop-zone>\n", styles: [".dragging{position:absolute;transition:transform .01s;transform:translate(-9999px)}\n"] }]
     }], function () { return [{ type: ComponentCreatorService }, { type: i0.ChangeDetectorRef }, { type: DragStateService }, { type: DropZoneService }, { type: TreeService }, { type: GlobalEventsService }, { type: i0.NgZone }, { type: TreeConstructionStatus }]; }, { branch: [{
             type: Input
         }], nodeHost: [{
@@ -1616,7 +1589,6 @@ class TreeService {
         });
     }
     drop(source, targetCoordinates) {
-        var _a;
         //prep
         const sourceParent = source.getParent();
         if (sourceParent === null) {
@@ -1644,9 +1616,9 @@ class TreeService {
             throw new Error("could not get to target");
         }
         const target = this.dropZoneService.getDropZone(targetCoordinates);
-        const targetIndex = target === null || target === void 0 ? void 0 : target.getLocation().insertIndex;
-        const targetHost = target === null || target === void 0 ? void 0 : target.getHost();
-        const sourceHost = (_a = this.dragStateService.getData()) === null || _a === void 0 ? void 0 : _a.parentContainer;
+        const targetIndex = target?.getLocation().insertIndex;
+        const targetHost = target?.getHost();
+        const sourceHost = this.dragStateService.getData()?.parentContainer;
         if (this.placeholder === true) {
             this.placeholder$.next(false);
         }
@@ -1714,11 +1686,10 @@ class TreeService {
         this.render();
     }
     cleanup(rebuild = false) {
-        var _a;
         if (rebuild) {
             this.rebuildTreeData();
         }
-        if (((_a = this.treeData) === null || _a === void 0 ? void 0 : _a.length) === 0) {
+        if (this.treeData?.length === 0) {
             //We do a full render here because it isn't actually any slower
             //when there are no nodes, and it is a little more straightforward
             this.render();
@@ -1763,13 +1734,12 @@ class TreeService {
     }
     /** Renders a branch of the tree and all of its descendants */
     renderBranch(host, branch) {
-        var _a, _b;
         if (this.treeModel === undefined) {
             throw new Error("TreeModel not initialized");
         }
         host.clear();
         branch.clearChildren();
-        for (const node of (_b = (_a = branch.data) === null || _a === void 0 ? void 0 : _a.nodes) !== null && _b !== void 0 ? _b : []) {
+        for (const node of branch.data?.nodes ?? []) {
             const newBranch = new Branch(node);
             branch.appendChild(newBranch);
             const componentRef = this.componentCreatorService.appendComponent(LimbleTreeNodeComponent, host);
@@ -1780,7 +1750,6 @@ class TreeService {
         }
     }
     processOptions(options = {}, itemsPerPage = Infinity, page = 1) {
-        var _a, _b, _c, _d, _e;
         if (options.listMode === true &&
             options.allowNesting !== undefined &&
             options.allowNesting !== false) {
@@ -1788,11 +1757,11 @@ class TreeService {
         }
         const result = {
             defaultComponent: options.defaultComponent,
-            indent: (_a = options.indent) !== null && _a !== void 0 ? _a : INDENT,
-            allowNesting: options.listMode !== true && ((_b = options.allowNesting) !== null && _b !== void 0 ? _b : true),
-            allowDragging: (_c = options.allowDragging) !== null && _c !== void 0 ? _c : true,
-            allowDrop: (_d = options.allowDrop) !== null && _d !== void 0 ? _d : (() => true),
-            listMode: (_e = options.listMode) !== null && _e !== void 0 ? _e : false,
+            indent: options.indent ?? INDENT,
+            allowNesting: options.listMode !== true && (options.allowNesting ?? true),
+            allowDragging: options.allowDragging ?? true,
+            allowDrop: options.allowDrop ?? (() => true),
+            listMode: options.listMode ?? false,
             itemsPerPage: options.listMode ? itemsPerPage : undefined,
             page: options.listMode ? page : undefined
         };
@@ -1899,36 +1868,6 @@ DragoverNoChangeDetectDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ t
             type: Output
         }] }); })();
 
-class DragleaveNoChangeDetectDirective {
-    constructor(ngZone, el) {
-        this.ngZone = ngZone;
-        this.el = el;
-        this.dragleaveNoChangeDetect = new EventEmitter();
-    }
-    ngOnInit() {
-        this.ngZone.runOutsideAngular(() => {
-            this.eventSubscription = fromEvent(this.el.nativeElement, "dragleave").subscribe(($event) => {
-                this.dragleaveNoChangeDetect.emit($event);
-            });
-        });
-    }
-    ngOnDestroy() {
-        if (this.eventSubscription !== undefined) {
-            this.eventSubscription.unsubscribe();
-        }
-    }
-}
-DragleaveNoChangeDetectDirective.ɵfac = function DragleaveNoChangeDetectDirective_Factory(t) { return new (t || DragleaveNoChangeDetectDirective)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i0.ElementRef)); };
-DragleaveNoChangeDetectDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: DragleaveNoChangeDetectDirective, selectors: [["", "dragleaveNoChangeDetect", ""]], outputs: { dragleaveNoChangeDetect: "dragleaveNoChangeDetect" } });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DragleaveNoChangeDetectDirective, [{
-        type: Directive,
-        args: [{
-                selector: "[dragleaveNoChangeDetect]"
-            }]
-    }], function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }]; }, { dragleaveNoChangeDetect: [{
-            type: Output
-        }] }); })();
-
 class LimbleTreePlaceholderComponent {
     constructor(dropZoneService, changeDetectorRef, treeService, treeConstructionStatus) {
         this.dropZoneService = dropZoneService;
@@ -1985,16 +1924,41 @@ LimbleTreePlaceholderComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ ty
         i0.ɵɵelementEnd();
     } if (rf & 2) {
         i0.ɵɵproperty("dropZone", ctx.dropZone);
-    } }, directives: [DropZoneComponent, DragoverNoChangeDetectDirective], styles: [".placeholder[_ngcontent-%COMP%]{width:100%;height:20px}"], changeDetection: 0 });
+    } }, dependencies: [DropZoneComponent, DragoverNoChangeDetectDirective], styles: [".placeholder[_ngcontent-%COMP%]{width:100%;height:20px}"], changeDetection: 0 });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LimbleTreePlaceholderComponent, [{
         type: Component,
+        args: [{ selector: "limble-tree-placeholder", changeDetection: ChangeDetectionStrategy.OnPush, template: "<drop-zone [dropZone]=\"dropZone\"></drop-zone>\n<div class=\"placeholder\" (dragoverNoChangeDetect)=\"dragoverHandler()\"></div>\n", styles: [".placeholder{width:100%;height:20px}\n"] }]
+    }], function () { return [{ type: DropZoneService }, { type: i0.ChangeDetectorRef }, { type: TreeService }, { type: TreeConstructionStatus }]; }, null); })();
+
+class DragleaveNoChangeDetectDirective {
+    constructor(ngZone, el) {
+        this.ngZone = ngZone;
+        this.el = el;
+        this.dragleaveNoChangeDetect = new EventEmitter();
+    }
+    ngOnInit() {
+        this.ngZone.runOutsideAngular(() => {
+            this.eventSubscription = fromEvent(this.el.nativeElement, "dragleave").subscribe(($event) => {
+                this.dragleaveNoChangeDetect.emit($event);
+            });
+        });
+    }
+    ngOnDestroy() {
+        if (this.eventSubscription !== undefined) {
+            this.eventSubscription.unsubscribe();
+        }
+    }
+}
+DragleaveNoChangeDetectDirective.ɵfac = function DragleaveNoChangeDetectDirective_Factory(t) { return new (t || DragleaveNoChangeDetectDirective)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i0.ElementRef)); };
+DragleaveNoChangeDetectDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: DragleaveNoChangeDetectDirective, selectors: [["", "dragleaveNoChangeDetect", ""]], outputs: { dragleaveNoChangeDetect: "dragleaveNoChangeDetect" } });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DragleaveNoChangeDetectDirective, [{
+        type: Directive,
         args: [{
-                selector: "limble-tree-placeholder",
-                templateUrl: "./limble-tree-placeholder.component.html",
-                styleUrls: ["./limble-tree-placeholder.component.scss"],
-                changeDetection: ChangeDetectionStrategy.OnPush
+                selector: "[dragleaveNoChangeDetect]"
             }]
-    }], function () { return [{ type: DropZoneService }, { type: i0.ChangeDetectorRef }, { type: TreeService }, { type: TreeConstructionStatus }]; }, null); })();
+    }], function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }]; }, { dragleaveNoChangeDetect: [{
+            type: Output
+        }] }); })();
 
 const _c0 = ["host"];
 function LimbleTreeRootComponent_limble_tree_placeholder_1_Template(rf, ctx) { if (rf & 1) {
@@ -2036,8 +2000,7 @@ class LimbleTreeRootComponent {
         });
     }
     ngAfterViewInit() {
-        var _a;
-        if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.listMode) !== true &&
+        if (this.options?.listMode !== true &&
             (this.itemsPerPage !== undefined || this.page !== undefined)) {
             console.warn("pagination is only allowed in listMode; `itemsPerPage` and `page` inputs will be ignored");
         }
@@ -2133,15 +2096,10 @@ LimbleTreeRootComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Lim
     } if (rf & 2) {
         i0.ɵɵadvance(1);
         i0.ɵɵproperty("ngIf", ctx.placeholder === true);
-    } }, directives: [DragoverNoChangeDetectDirective, DragleaveNoChangeDetectDirective, i2.NgIf, LimbleTreePlaceholderComponent], styles: [""] });
+    } }, dependencies: [i2.NgIf, LimbleTreePlaceholderComponent, DragoverNoChangeDetectDirective, DragleaveNoChangeDetectDirective] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LimbleTreeRootComponent, [{
         type: Component,
-        args: [{
-                selector: "limble-tree-root",
-                templateUrl: "./limble-tree-root.component.html",
-                styleUrls: ["./limble-tree-root.component.scss"],
-                providers: [TreeService, DropZoneService, TreeConstructionStatus]
-            }]
+        args: [{ selector: "limble-tree-root", providers: [TreeService, DropZoneService, TreeConstructionStatus], template: "<div\n   (dragoverNoChangeDetect)=\"dragoverHandler($event)\"\n   (dragleaveNoChangeDetect)=\"dragleaveHandler($event)\"\n   (drop)=\"dropHandler($event)\"\n   class=\"tree-event-host\"\n>\n   <limble-tree-placeholder\n      *ngIf=\"placeholder === true\"\n   ></limble-tree-placeholder>\n   <ng-template #host></ng-template>\n</div>\n" }]
     }], function () { return [{ type: TreeService }, { type: DropZoneService }, { type: DragStateService }, { type: GlobalEventsService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, { data: [{
             type: Input
         }], options: [{
@@ -2163,7 +2121,7 @@ class LimbleTreeModule {
 }
 LimbleTreeModule.ɵfac = function LimbleTreeModule_Factory(t) { return new (t || LimbleTreeModule)(); };
 LimbleTreeModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: LimbleTreeModule });
-LimbleTreeModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [ComponentCreatorService, DragStateService, GlobalEventsService], imports: [[CommonModule]] });
+LimbleTreeModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [ComponentCreatorService, DragStateService, GlobalEventsService], imports: [CommonModule] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LimbleTreeModule, [{
         type: NgModule,
         args: [{
@@ -2188,9 +2146,9 @@ LimbleTreeModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [Compo
         LimbleTreePlaceholderComponent,
         DragoverNoChangeDetectDirective,
         DragleaveNoChangeDetectDirective], imports: [CommonModule], exports: [LimbleTreeRootComponent] }); })();
-i0.ɵɵsetComponentScope(LimbleTreeNodeComponent, [i2.NgIf, DropZoneComponent,
-    DragoverNoChangeDetectDirective,
-    LimbleTreeBranchComponent], []);
+i0.ɵɵsetComponentScope(LimbleTreeNodeComponent, [i2.NgIf, LimbleTreeBranchComponent,
+    DropZoneComponent,
+    DragoverNoChangeDetectDirective], []);
 
 /*
  * Public API Surface of limble-tree
@@ -2201,4 +2159,4 @@ i0.ɵɵsetComponentScope(LimbleTreeNodeComponent, [i2.NgIf, DropZoneComponent,
  */
 
 export { LimbleTreeModule, LimbleTreeRootComponent };
-//# sourceMappingURL=limble-limble-tree.js.map
+//# sourceMappingURL=limble-limble-tree.mjs.map