@limble/limble-tree 1.0.0-alpha.1 → 1.0.0-alpha.2

package/fesm2020/limble-limble-tree.mjs

@@ -27,7 +27,7 @@ class TreeCollapser {
             branch.graftTo(treeBranch);
         });
         this.tempStorage.delete(treeBranch);
-        treeBranch.getContents().changeDetectorRef.detectChanges();
+        treeBranch.detectChanges();
     }
     isCollapsed(treeBranch) {
         return this.tempStorage.has(treeBranch);
@@ -235,19 +235,15 @@ class DragAndDrop {
     }
     setDragEffects(treeBranch, event) {
         const dataTransfer = event.dataTransfer;
-        if (!(dataTransfer instanceof DataTransfer)) {
-            throw new Error("bad drag event");
-        }
-        const nativeElement = treeBranch.getContents().location.nativeElement;
+        assert(dataTransfer instanceof DataTransfer);
+        const nativeElement = treeBranch.getNativeElement();
         const [xOffset, yOffset] = this.getDragImageOffsets(event, nativeElement);
         dataTransfer.setDragImage(nativeElement, xOffset, yOffset);
     }
     watchForDragend(treeBranch, event) {
         const oldParent = treeBranch.parent();
         const oldIndex = treeBranch.index();
-        if (oldParent === undefined || oldIndex === undefined) {
-            throw new Error("branch must have a parent");
-        }
+        assert(oldParent !== undefined && oldIndex !== undefined);
         event.target?.addEventListener("dragend", (dragend) => {
             if (dragState.state() !== DragStates.Dropped) {
                 //The drag ended but a drop never occurred, so put the dragged branch back where it started.
@@ -268,13 +264,13 @@ class DragAndDrop {
         }, { once: true });
     }
     draggingAllowed(treeBranch) {
-        const allowDragging = config.getConfig(treeBranch.root())?.allowDragging ??
+        const allowDragging = config.getConfig(treeBranch.root())?.dragAndDrop?.allowDragging ??
             (() => true);
         return allowDragging(treeBranch);
     }
     graftDraggedBranch(treeBranch, parent, index) {
         treeBranch.graftTo(parent, index);
-        treeBranch.getContents().location.nativeElement.style.display = "block";
+        treeBranch.getNativeElement().style.display = "block";
         dragState.dropped();
     }
 }
@@ -359,22 +355,14 @@ class BranchComponent {
         this.showLateralDropzone = false;
     }
     ngAfterViewInit() {
-        if (this.contentContainer === undefined) {
-            throw new TreeError("Cannot get contentContainer");
-        }
-        if (this.contentToHost === undefined) {
-            throw new TreeError("'content' is a required input");
-        }
+        assert(this.contentContainer !== undefined);
+        assert(this.contentToHost !== undefined);
         this.hostedContent = this.contentContainer.createComponent(this.contentToHost);
         this.contentCreated.emit(this.hostedContent.instance);
-        if (this.dropzones === undefined) {
-            throw new Error("querylist not defined");
-        }
+        assert(this.dropzones !== undefined);
         const inner = this.dropzones.get(0);
         const lateral = this.dropzones.get(1);
-        if (inner === undefined || lateral == undefined) {
-            throw new Error("dropzones not defined");
-        }
+        assert(inner !== undefined && lateral !== undefined);
         merge(inner.dropped.pipe(map(() => "inner")), lateral.dropped.pipe(map(() => "lateral"))).subscribe(this.dropped);
         this.hostedContent.changeDetectorRef.detectChanges();
     }
@@ -476,6 +464,7 @@ class PruneEvent {
 
 class TreeNodeBase {
     constructor() {
+        this.destroyed = false;
         this._branches = [];
         this.events$ = new Subject();
         this.subscriptions = [
@@ -490,17 +479,14 @@ class TreeNodeBase {
     branches() {
         return [...this._branches];
     }
-    deleteBranch(index) {
-        if (index === undefined) {
-            this._branches.pop();
-            return;
-        }
-        this._branches.splice(index, 1);
-    }
     destroy() {
+        this.branches().forEach((branch) => {
+            branch.destroy();
+        });
         this.subscriptions.forEach((sub) => {
             sub.unsubscribe();
         });
+        this.destroyed = true;
     }
     dispatch(event) {
         this.events$.next(event);
@@ -511,6 +497,9 @@ class TreeNodeBase {
     getBranch(index) {
         return this._branches[index];
     }
+    isDestroyed() {
+        return this.destroyed;
+    }
     plot() {
         return new Map(this.branches().map((branch, index) => [index, branch.plot()]));
     }
@@ -521,7 +510,7 @@ class TreeNodeBase {
     }
     deregisterChildRelationship(child) {
         const index = this.branches().findIndex((branch) => branch === child);
-        this.deleteBranch(index);
+        this._branches.splice(index, 1);
     }
     graftsToSelf() {
         return this.events().pipe(filter((event) => event instanceof GraftEvent), filter((event) => event.parent().events() === this.events$));
@@ -538,6 +527,18 @@ class TreeNodeBase {
     }
 }
 
+class DestructionEvent {
+    constructor(source) {
+        this._source = source;
+    }
+    type() {
+        return "destruction";
+    }
+    source() {
+        return this._source;
+    }
+}
+
 class RootComponent {
     constructor() {
         this.branchesContainer = undefined;
@@ -548,9 +549,7 @@ class RootComponent {
     }
     ngAfterViewInit() {
         this.afterViewInit.emit();
-        if (this.dropzone === undefined) {
-            throw new Error("dropzone is not defined");
-        }
+        assert(this.dropzone !== undefined);
         this.dropzone.dropped.subscribe(this.dropped);
     }
 }
@@ -571,42 +570,68 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Output
             }] } });
 
-class TreeRoot {
-    constructor(viewContainerRef) {
-        this.viewContainerRef = viewContainerRef;
-        this.treeNodeBase = new TreeNodeBase();
-        this.rootComponentRef =
-            this.viewContainerRef.createComponent(RootComponent);
+/**
+ * A wrapper around the BranchComponent that helps instantiate it and handles its events.
+ */
+class RootController {
+    constructor(treeRoot, viewContainerRef) {
+        this.treeRoot = treeRoot;
+        this.rootComponentRef = viewContainerRef.createComponent(RootComponent);
         const viewInitSub = this.rootComponentRef.instance.afterViewInit.subscribe(() => {
             const dropzone = this.rootComponentRef.instance.dropzone;
-            if (!dropzone) {
-                throw new Error("dropzone not defined");
-            }
-            dropzoneRenderer.registerDropzone(dropzone, this);
+            assert(dropzone !== undefined);
+            dropzoneRenderer.registerDropzone(dropzone, this.treeRoot);
         });
         const droppedSub = this.rootComponentRef.instance.dropped.subscribe(() => {
-            dropzoneRenderer.handleDrop(this, "inner");
+            dropzoneRenderer.handleDrop(this.treeRoot, "inner");
         });
         this.instanceSubscriptions = [viewInitSub, droppedSub];
+    }
+    destroy() {
+        this.instanceSubscriptions.forEach((sub) => {
+            sub.unsubscribe();
+        });
+    }
+    detectChanges() {
         this.rootComponentRef.changeDetectorRef.detectChanges();
     }
+    getBranchesContainer() {
+        return this.rootComponentRef.instance.branchesContainer;
+    }
+    getComponentInstance() {
+        return this.rootComponentRef.instance;
+    }
+    getHostView() {
+        return this.rootComponentRef.hostView;
+    }
+    getNativeElement() {
+        return this.rootComponentRef.location.nativeElement;
+    }
+}
+
+class TreeRoot {
+    constructor(viewContainerRef) {
+        this.viewContainerRef = viewContainerRef;
+        this.treeNodeBase = new TreeNodeBase();
+        this.rootController = new RootController(this, viewContainerRef);
+        this.detectChanges();
+    }
     branches() {
         return this.treeNodeBase.branches();
     }
-    deleteBranch(index) {
-        this.treeNodeBase.deleteBranch(index);
-    }
     destroy() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot destroy a destroyed tree root");
+        }
         dropzoneRenderer.clearTreeFromRegistry(this);
-        this.branches().forEach((branch) => {
-            branch.destroy();
-        });
         this.treeNodeBase.destroy();
-        this.instanceSubscriptions.forEach((sub) => {
-            sub.unsubscribe();
-        });
+        this.rootController.destroy();
         this.viewContainerRef.clear();
         config.delete(this);
+        this.dispatch(new DestructionEvent(this));
+    }
+    detectChanges() {
+        this.rootController.detectChanges();
     }
     dispatch(event) {
         this.treeNodeBase.dispatch(event);
@@ -617,12 +642,39 @@ class TreeRoot {
     getBranch(index) {
         return this.treeNodeBase.getBranch(index);
     }
-    getContents() {
-        return this.rootComponentRef;
+    getBranchesContainer() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get branches container from a destroyed tree root");
+        }
+        return this.rootController.getBranchesContainer();
+    }
+    getComponentInstance() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get component instance from a destroyed tree root");
+        }
+        return this.rootController.getComponentInstance();
+    }
+    getHostView() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get component host view from a destroyed tree root");
+        }
+        return this.rootController.getHostView();
+    }
+    getNativeElement() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get native element from a destroyed tree root");
+        }
+        return this.rootController.getNativeElement();
     }
     grow(component, options) {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot grow a branch on a destroyed tree root");
+        }
         return new TreeBranch(this, { component, ...options });
     }
+    isDestroyed() {
+        return this.treeNodeBase.isDestroyed();
+    }
     plot() {
         return this.treeNodeBase.plot();
     }
@@ -650,29 +702,117 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
             args: [{ providedIn: "root" }]
         }] });
 
+/**
+ * A wrapper around the BranchComponent that helps instantiate it and handles its events.
+ */
+class BranchController {
+    constructor(treeBranch, parentBranchesContainer) {
+        this.treeBranch = treeBranch;
+        this.outputBindingSubscriptions = [];
+        this.branchComponentRef = createComponent(BranchComponent, {
+            environmentInjector: parentBranchesContainer.injector.get(EnvironmentInjector)
+        });
+        this.branchComponentRef.instance.contentToHost =
+            this.treeBranch.branchOptions.component;
+        this.instanceSubscriptions = this.getInstanceSubscriptions(this.branchComponentRef.instance);
+    }
+    destroy() {
+        this.instanceSubscriptions.forEach((sub) => {
+            sub.unsubscribe();
+        });
+        this.outputBindingSubscriptions.forEach((sub) => {
+            sub.unsubscribe();
+        });
+    }
+    detectChanges() {
+        this.branchComponentRef.changeDetectorRef.detectChanges();
+    }
+    getBranchesContainer() {
+        return this.branchComponentRef.instance.branchesContainer;
+    }
+    getComponentInstance() {
+        return this.branchComponentRef.instance;
+    }
+    getHostView() {
+        return this.branchComponentRef.hostView;
+    }
+    getNativeElement() {
+        return this.branchComponentRef.location.nativeElement;
+    }
+    getUserlandComponentRef() {
+        return this.branchComponentRef.instance.getHostedContent();
+    }
+    getContentCreatedSub(instance) {
+        return instance.contentCreated.subscribe((userlandComponentInstance) => {
+            const component = userlandComponentInstance;
+            Object.entries(this.treeBranch.branchOptions.inputBindings ?? {}).forEach(([key, value]) => {
+                component[key] = value;
+            });
+            Object.entries(this.treeBranch.branchOptions.outputBindings ?? {}).forEach(([key, value]) => {
+                this.outputBindingSubscriptions.push(component[key].subscribe(value));
+            });
+            component.treeBranch = this.treeBranch;
+            const dropzones = instance.dropzones;
+            assert(dropzones !== undefined);
+            dropzoneRenderer.registerDropzones(dropzones, this.treeBranch);
+        });
+    }
+    getInstanceSubscriptions(instance) {
+        const droppedSub = instance.dropped.subscribe((placement) => {
+            dropzoneRenderer.handleDrop(this.treeBranch, placement);
+        });
+        return [
+            this.getContentCreatedSub(instance),
+            this.getShowLowerZonesSub(instance),
+            this.getShowUpperZonesSub(instance),
+            droppedSub
+        ];
+    }
+    getShowLowerZonesSub(instance) {
+        return instance.showDropzones
+            .pipe(filter((direction) => direction === "lower"))
+            .subscribe(() => {
+            const currentDropzoneDisplayed = dropzoneRenderer.getCurrentDisplay();
+            if (currentDropzoneDisplayed?.treeBranch === this.treeBranch &&
+                currentDropzoneDisplayed.direction === "lower") {
+                return;
+            }
+            dropzoneRenderer.showLowerZones(this.treeBranch);
+            instance.triggerChangeDetection();
+        });
+    }
+    getShowUpperZonesSub(instance) {
+        return instance.showDropzones
+            .pipe(filter((direction) => direction === "upper"))
+            .subscribe(() => {
+            const currentDropzoneDisplayed = dropzoneRenderer.getCurrentDisplay();
+            if (currentDropzoneDisplayed?.treeBranch === this.treeBranch &&
+                currentDropzoneDisplayed.direction === "upper") {
+                return;
+            }
+            dropzoneRenderer.showUpperZones(this.treeBranch);
+            instance.triggerChangeDetection();
+        });
+    }
+}
+
 class TreeBranch {
     constructor(parent, branchOptions) {
         this.branchOptions = branchOptions;
         this.detachedView = null;
         this.treeNodeBase = new TreeNodeBase();
-        this.userlandComponent = this.branchOptions.component;
-        const parentBranchesContainer = parent.getContents().instance.branchesContainer;
+        const parentBranchesContainer = parent.getBranchesContainer();
         assert(parentBranchesContainer !== undefined);
-        this.contents = createComponent(BranchComponent, {
-            environmentInjector: parentBranchesContainer.injector.get(EnvironmentInjector)
-        });
-        this.contents.instance.contentToHost = this.userlandComponent;
+        this.branchController = new BranchController(this, parentBranchesContainer);
         this.setIndentation(parent);
-        this.outputBindingSubscriptions = [];
-        this.instanceSubscriptions = this.getInstanceSubscriptions();
         if (parent instanceof TreeBranch &&
-            parent.branchOptions.startCollapsed === true) {
+            parent.branchOptions.defaultCollapsed === true) {
             treeCollapser.storePrecollapsedNode(parent, this);
-            this.detachedView = this.contents.hostView;
+            this.detachedView = this.branchController.getHostView();
         }
         else {
-            parentBranchesContainer.insert(this.contents.hostView);
-            this.contents.changeDetectorRef.detectChanges();
+            parentBranchesContainer.insert(this.branchController.getHostView());
+            this.detectChanges();
             this._parent = parent;
             this.dispatch(new GraftEvent(this, {
                 parent: this._parent,
@@ -684,32 +824,20 @@ class TreeBranch {
     branches() {
         return this.treeNodeBase.branches();
     }
-    deleteBranch(index) {
-        this.treeNodeBase.deleteBranch(index);
-    }
     destroy() {
-        if (treeCollapser.isCollapsed(this)) {
-            treeCollapser.expand(this);
-            dropzoneRenderer.clearTreeFromRegistry(this);
-        }
-        this.branches().forEach((branch) => {
-            branch.destroy();
-        });
-        const parent = this._parent;
-        const index = this.index();
-        if (index !== undefined && parent !== undefined) {
-            const container = parent.getContents().instance.branchesContainer;
-            assert(container !== undefined);
-            container.remove(index);
-            parent.deleteBranch(index);
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot destroy a destroyed tree branch");
         }
+        this.prune();
+        treeCollapser.expand(this);
+        dropzoneRenderer.clearTreeFromRegistry(this);
+        this.branchController.getHostView().destroy();
         this.treeNodeBase.destroy();
-        this.instanceSubscriptions.forEach((sub) => {
-            sub.unsubscribe();
-        });
-        this.outputBindingSubscriptions.forEach((sub) => {
-            sub.unsubscribe();
-        });
+        this.branchController.destroy();
+        this.dispatch(new DestructionEvent(this));
+    }
+    detectChanges() {
+        this.branchController.detectChanges();
     }
     dispatch(event) {
         this.treeNodeBase.dispatch(event);
@@ -721,10 +849,38 @@ class TreeBranch {
     getBranch(index) {
         return this.treeNodeBase.getBranch(index);
     }
-    getContents() {
-        return this.contents;
+    getBranchesContainer() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get branches container from a destroyed tree branch");
+        }
+        return this.branchController.getBranchesContainer();
+    }
+    getComponentInstance() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get component instance from a destroyed tree branch");
+        }
+        return this.branchController.getComponentInstance();
+    }
+    getHostView() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get component host view from a destroyed tree branch");
+        }
+        return this.branchController.getHostView();
+    }
+    getNativeElement() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get native element from a destroyed tree branch");
+        }
+        return this.branchController.getNativeElement();
+    }
+    getUserlandComponentRef() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot get userland component from a destroyed tree branch");
+        }
+        return this.branchController.getUserlandComponentRef();
     }
     graftTo(newParent, index) {
+        this.checkGraftLocationValidity(newParent, index);
         const ownIndex = this.index();
         if (ownIndex !== undefined) {
             this.prune();
@@ -740,6 +896,9 @@ class TreeBranch {
         return newIndex;
     }
     grow(component, options) {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot grow a branch on a destroyed tree branch");
+        }
         return new TreeBranch(this, { component, ...options });
     }
     index() {
@@ -752,6 +911,9 @@ class TreeBranch {
         assert(index >= 0);
         return index;
     }
+    isDestroyed() {
+        return this.treeNodeBase.isDestroyed();
+    }
     meta() {
         return this.branchOptions.meta ?? {};
     }
@@ -773,11 +935,14 @@ class TreeBranch {
         return [index];
     }
     prune() {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot prune a destroyed tree branch");
+        }
         const parent = this._parent;
         const index = this.index();
         if (index === undefined || parent === undefined)
             return;
-        const container = parent.getContents().instance.branchesContainer;
+        const container = parent.getBranchesContainer();
         assert(container !== undefined);
         this.detachedView = container.detach(index);
         assert(this.detachedView !== null);
@@ -792,81 +957,40 @@ class TreeBranch {
     }
     root() {
         const parent = this.parent();
-        if (parent === undefined) {
-            return undefined;
-        }
         if (parent instanceof TreeBranch) {
             return parent.root();
         }
-        if (parent instanceof TreeRoot) {
-            return parent;
-        }
-        throw new Error("unexpected parent type");
+        assert(parent instanceof TreeRoot || parent === undefined);
+        return parent;
     }
     traverse(callback) {
         callback(this);
         this.treeNodeBase.traverse(callback);
     }
-    getContentCreatedSub() {
-        const instance = this.contents.instance;
-        return instance.contentCreated.subscribe((userlandComponentInstance) => {
-            for (const [key, value] of Object.entries(this.branchOptions.inputBindings ?? {})) {
-                userlandComponentInstance[key] = value;
-            }
-            for (const [key, value] of Object.entries(this.branchOptions.outputBindings ?? {})) {
-                this.outputBindingSubscriptions.push(userlandComponentInstance[key].subscribe(value));
-            }
-            userlandComponentInstance.treeBranch = this;
-            const dropzones = instance.dropzones;
-            if (!dropzones) {
-                throw new Error("dropzones not defined");
-            }
-            dropzoneRenderer.registerDropzones(dropzones, this);
-        });
-    }
-    getInstanceSubscriptions() {
-        const droppedSub = this.contents.instance.dropped.subscribe((placement) => {
-            dropzoneRenderer.handleDrop(this, placement);
-        });
-        return [
-            this.getContentCreatedSub(),
-            this.getShowLowerZonesSub(),
-            this.getShowUpperZonesSub(),
-            droppedSub
-        ];
-    }
-    getShowLowerZonesSub() {
-        const instance = this.contents.instance;
-        return instance.showDropzones
-            .pipe(filter((direction) => direction === "lower"))
-            .subscribe(() => {
-            const currentDropzoneDisplayed = dropzoneRenderer.getCurrentDisplay();
-            if (currentDropzoneDisplayed?.treeBranch === this &&
-                currentDropzoneDisplayed.direction === "lower") {
-                return;
+    checkGraftLocationValidity(newParent, index) {
+        if (this.isDestroyed()) {
+            throw new TreeError("Cannot graft a destroyed tree branch");
+        }
+        if (newParent.isDestroyed()) {
+            throw new TreeError("Cannot graft to a destroyed tree branch");
+        }
+        if (typeof index === "number" &&
+            this.indexIsOutOfRange(newParent, index)) {
+            throw new TreeError(`Cannot graft branch at index ${index} of the parent. Out of range.`);
+        }
+        this.traverse((node) => {
+            if (node === newParent) {
+                throw new TreeError("Cannot graft a branch to itself or any of its own descendants");
             }
-            dropzoneRenderer.showLowerZones(this);
-            instance.triggerChangeDetection();
         });
     }
-    getShowUpperZonesSub() {
-        const instance = this.contents.instance;
-        return instance.showDropzones
-            .pipe(filter((direction) => direction === "upper"))
-            .subscribe(() => {
-            const currentDropzoneDisplayed = dropzoneRenderer.getCurrentDisplay();
-            if (currentDropzoneDisplayed?.treeBranch === this &&
-                currentDropzoneDisplayed.direction === "upper") {
-                return;
-            }
-            dropzoneRenderer.showUpperZones(this);
-            instance.triggerChangeDetection();
-        });
+    indexIsOutOfRange(parent, index) {
+        return index < 0 || index > parent.branches().length;
     }
     reattachView(index) {
         assert(this._parent !== undefined);
         assert(this.detachedView !== null);
-        const container = this._parent.getContents().instance.branchesContainer;
+        const container = this._parent.getBranchesContainer();
         assert(container !== undefined);
         this.detachedView.reattach();
         container.insert(this.detachedView, index);
@@ -876,7 +1000,8 @@ class TreeBranch {
         const root = parent.root();
         assert(root !== undefined);
         const options = config.getConfig(root);
-        const branchesContainerEl = this.contents.location.nativeElement
+        const branchesContainerEl = this.branchController
+            .getNativeElement()
             .getElementsByClassName("branches-container")
             .item(0);
         assert(branchesContainerEl instanceof HTMLElement);
@@ -916,7 +1041,7 @@ class DropzoneRenderer {
         if (this.currentDisplay === null)
             return;
         for (const branch of this.registry.values()) {
-            const instance = branch.getContents().instance;
+            const instance = branch.getComponentInstance();
             instance.showInnerDropzone = false;
             if (instance instanceof BranchComponent) {
                 instance.showLateralDropzone = false;
@@ -1017,7 +1142,7 @@ class DropzoneRenderer {
             return true;
         }
         if (treeNode instanceof TreeBranch) {
-            const allowNesting = config.getConfig(treeNode.root())?.allowNesting ??
+            const allowNesting = config.getConfig(treeNode.root())?.dragAndDrop?.allowNesting ??
                 (() => true);
             return allowNesting(treeNode);
         }
@@ -1027,11 +1152,13 @@ class DropzoneRenderer {
         const sourceNode = dragState.getDragData();
         assert(sourceNode instanceof TreeBranch);
         if (parent instanceof TreeRoot) {
-            const allowDrop = config.getConfig(parent)?.allowDrop ?? (() => true);
+            const allowDrop = config.getConfig(parent)?.dragAndDrop?.allowDrop ??
+                (() => true);
             return allowDrop(sourceNode, parent, index);
         }
         if (parent instanceof TreeBranch) {
-            const allowDrop = config.getConfig(parent.root())?.allowDrop ?? (() => true);
+            const allowDrop = config.getConfig(parent.root())?.dragAndDrop?.allowDrop ??
+                (() => true);
             return allowDrop(sourceNode, parent, index);
         }
         throw new Error("unsupported treeNode type");
@@ -1039,14 +1166,14 @@ class DropzoneRenderer {
     showInnerZone(treeNode) {
         if (!this.nestingAllowed(treeNode) || !this.dropAllowed(treeNode, 0))
             return;
-        treeNode.getContents().instance.showInnerDropzone = true;
+        treeNode.getComponentInstance().showInnerDropzone = true;
     }
     showLateralZone(treeBranch) {
         const index = treeBranch.index();
         assert(index !== undefined);
         if (!this.dropAllowed(treeBranch.parent(), index + 1))
             return;
-        treeBranch.getContents().instance.showLateralDropzone = true;
+        treeBranch.getComponentInstance().showLateralDropzone = true;
     }
 }
 const dropzoneRenderer = new DropzoneRenderer();
@@ -1132,32 +1259,34 @@ class LegacyTree {
     upgradeOptions(legacyOptions) {
         return {
             indentation: legacyOptions.indent,
-            allowNesting: (branch) => {
-                if (legacyOptions.listMode === true) {
-                    return false;
-                }
-                if (legacyOptions.allowNesting === undefined) {
-                    return true;
-                }
-                if (typeof legacyOptions.allowNesting === "boolean") {
-                    return legacyOptions.allowNesting;
-                }
-                return legacyOptions.allowNesting(branch);
-            },
-            allowDragging: (branch) => {
-                if (legacyOptions.allowDragging === undefined) {
-                    return true;
-                }
-                if (typeof legacyOptions.allowDragging === "boolean") {
-                    return legacyOptions.allowDragging;
-                }
-                return legacyOptions.allowDragging(branch);
-            },
-            allowDrop: (source, parent, index) => {
-                if (legacyOptions.allowDrop === undefined) {
-                    return true;
+            dragAndDrop: {
+                allowNesting: (branch) => {
+                    if (legacyOptions.listMode === true) {
+                        return false;
+                    }
+                    if (legacyOptions.allowNesting === undefined) {
+                        return true;
+                    }
+                    if (typeof legacyOptions.allowNesting === "boolean") {
+                        return legacyOptions.allowNesting;
+                    }
+                    return legacyOptions.allowNesting(branch);
+                },
+                allowDragging: (branch) => {
+                    if (legacyOptions.allowDragging === undefined) {
+                        return true;
+                    }
+                    if (typeof legacyOptions.allowDragging === "boolean") {
+                        return legacyOptions.allowDragging;
+                    }
+                    return legacyOptions.allowDragging(branch);
+                },
+                allowDrop: (source, parent, index) => {
+                    if (legacyOptions.allowDrop === undefined) {
+                        return true;
+                    }
+                    return legacyOptions.allowDrop(source, parent, index);
                 }
-                return legacyOptions.allowDrop(source, parent, index);
             }
         };
     }
@@ -1170,9 +1299,6 @@ class LegacyTree {
             options.defaultComponent?.bindings ??
             {});
         const nodeData = node;
-        delete nodeData.nodes;
-        delete nodeData.collapsed;
-        delete nodeData.component;
         const branch = parent.grow(component, {
             inputBindings: bindings,
             meta: { nodeData }
@@ -1296,5 +1422,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { DragEndEvent, DragStartEvent, DraggableDirective, DragoverNoChangeDetectDirective, DropEvent, GraftEvent, LegacyTree, LimbleTreeLegacyModule, LimbleTreeModule, LimbleTreeRootComponent, PruneEvent, TreeBranch, TreeCollapseModule, TreeCollapseService, TreeDragAndDropModule, TreeDragAndDropService, TreeError, TreeRoot, TreeService, config };
+export { DestructionEvent, DragEndEvent, DragStartEvent, DraggableDirective, DragoverNoChangeDetectDirective, DropEvent, GraftEvent, LegacyTree, LimbleTreeLegacyModule, LimbleTreeModule, LimbleTreeRootComponent, PruneEvent, TreeBranch, TreeCollapseModule, TreeCollapseService, TreeDragAndDropModule, TreeDragAndDropService, TreeError, TreeRoot, TreeService, config };
 //# sourceMappingURL=limble-limble-tree.mjs.map