matcha-components 20.269.0 → 20.270.0

package/fesm2022/matcha-components.mjs

@@ -9945,6 +9945,12 @@ class MatchaDropListComponent {
                 return;
             }
         }
+        // Depth check
+        if (isCrossContainer && !this.isDepthAllowed(dragDirective)) {
+            this.isReceivingDrag = true;
+            this.canAcceptDrop = false;
+            return;
+        }
         const allItems = this.directDragItems;
         const allEls = allItems.map(d => d.elementRef.nativeElement);
         const draggedEl = dragDirective.elementRef.nativeElement;
@@ -10040,6 +10046,11 @@ class MatchaDropListComponent {
                 return;
             }
         }
+        // Depth check
+        if (sourceContainer !== this && !this.isDepthAllowed(dragDirective)) {
+            this.clearPlaceholder();
+            return;
+        }
         const dropIndex = this.calculatedDropIndex;
         this.clearPlaceholder();
         if (sourceContainer === this) {
@@ -10127,6 +10138,35 @@ class MatchaDropListComponent {
     getDragItemIndex(dragItem) {
         return this.directDragItems.indexOf(dragItem);
     }
+    isDepthAllowed(dragDirective) {
+        if (this.matchaDropListMaxDepth === undefined)
+            return true;
+        let targetDepth = 1;
+        let el = this.elementRef.nativeElement.parentElement;
+        while (el) {
+            if (el.classList.contains('matcha-drop-list'))
+                targetDepth++;
+            el = el.parentElement;
+        }
+        const subtreeHeight = dragDirective?.matchaDragGroupEl
+            ? this.getGroupSubtreeHeight(dragDirective.matchaDragGroupEl)
+            : 0;
+        return targetDepth + subtreeHeight <= this.matchaDropListMaxDepth;
+    }
+    getGroupSubtreeHeight(groupEl) {
+        let maxDepth = 0;
+        const traverse = (node, depth) => {
+            for (let i = 0; i < node.children.length; i++) {
+                const child = node.children[i];
+                const childDepth = child.classList.contains('matcha-drop-list') ? depth + 1 : depth;
+                if (childDepth > maxDepth)
+                    maxDepth = childDepth;
+                traverse(child, childDepth);
+            }
+        };
+        traverse(groupEl, 0);
+        return maxDepth;
+    }
     // --- Kept for backward compat (no-ops with new engine) ---
     onDragStart(dragItem, _event) {
         this.onPointerDragStart(dragItem);
@@ -10137,7 +10177,7 @@ class MatchaDropListComponent {
     handleTouchDragOver(_event) { }
     handleTouchDrop(_event, _dragItem) { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MatchaDropListComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: MatchaDropListService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MatchaDropListComponent, isStandalone: false, selector: "matcha-drop-list", inputs: { matchaDropListData: "matchaDropListData", matchaDropListDisabled: "matchaDropListDisabled", matchaDropListConnectedTo: "matchaDropListConnectedTo", matchaDropListSortingDisabled: "matchaDropListSortingDisabled", matchaDropListAcceptPredicate: "matchaDropListAcceptPredicate", matchaDropListAcceptTypes: "matchaDropListAcceptTypes", matchaDropListTreeMode: "matchaDropListTreeMode", matchaDropListHoverExpandDelay: "matchaDropListHoverExpandDelay" }, outputs: { matchaDropListDropped: "matchaDropListDropped", matchaDropListHoverExpand: "matchaDropListHoverExpand" }, host: { properties: { "class.matcha-drop-list": "this.dropListClass" } }, ngImport: i0, template: "<div class=\"matcha-drop-list-container\"\n     [class.matcha-drop-list-receiving]=\"isReceivingDrag\"\n     [class.matcha-drop-list-disabled]=\"matchaDropListDisabled\"\n     [class.matcha-drop-list-can-accept]=\"isReceivingDrag && canAcceptDrop\"\n     [class.matcha-drop-list-cannot-accept]=\"isReceivingDrag && !canAcceptDrop\">\n  <ng-content></ng-content>\n\n  <!-- Linha indicadora de drop -->\n  <div class=\"matcha-drop-indicator\"\n       [class.active]=\"showDropIndicator && canAcceptDrop\"\n       [style.top.px]=\"dropIndicatorPosition\">\n  </div>\n\n  <!-- Placeholder para lista vazia -->\n  <div *ngIf=\"isReceivingDrag && directDragItems.length === 0\"\n       class=\"matcha-drop-list-placeholder\">\n    <div class=\"matcha-drop-list-empty-placeholder\"\n         [class.can-accept]=\"canAcceptDrop\"\n         [class.cannot-accept]=\"!canAcceptDrop\">\n      <span [class.i-matcha-action_sign_success]=\"canAcceptDrop\"\n            [class.i-matcha-action_sign_error]=\"!canAcceptDrop\"\n            [class.color-green]=\"canAcceptDrop\"\n            [class.color-red]=\"!canAcceptDrop\"\n            class=\"i-size-lg\"></span>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MatchaDropListComponent, isStandalone: false, selector: "matcha-drop-list", inputs: { matchaDropListData: "matchaDropListData", matchaDropListDisabled: "matchaDropListDisabled", matchaDropListConnectedTo: "matchaDropListConnectedTo", matchaDropListSortingDisabled: "matchaDropListSortingDisabled", matchaDropListAcceptPredicate: "matchaDropListAcceptPredicate", matchaDropListAcceptTypes: "matchaDropListAcceptTypes", matchaDropListTreeMode: "matchaDropListTreeMode", matchaDropListHoverExpandDelay: "matchaDropListHoverExpandDelay", matchaDropListMaxDepth: "matchaDropListMaxDepth" }, outputs: { matchaDropListDropped: "matchaDropListDropped", matchaDropListHoverExpand: "matchaDropListHoverExpand" }, host: { properties: { "class.matcha-drop-list": "this.dropListClass" } }, ngImport: i0, template: "<div class=\"matcha-drop-list-container\"\n     [class.matcha-drop-list-receiving]=\"isReceivingDrag\"\n     [class.matcha-drop-list-disabled]=\"matchaDropListDisabled\"\n     [class.matcha-drop-list-can-accept]=\"isReceivingDrag && canAcceptDrop\"\n     [class.matcha-drop-list-cannot-accept]=\"isReceivingDrag && !canAcceptDrop\">\n  <ng-content></ng-content>\n\n  <!-- Linha indicadora de drop -->\n  <div class=\"matcha-drop-indicator\"\n       [class.active]=\"showDropIndicator && canAcceptDrop\"\n       [style.top.px]=\"dropIndicatorPosition\">\n  </div>\n\n  <!-- Placeholder para lista vazia -->\n  <div *ngIf=\"isReceivingDrag && directDragItems.length === 0\"\n       class=\"matcha-drop-list-placeholder\">\n    <div class=\"matcha-drop-list-empty-placeholder\"\n         [class.can-accept]=\"canAcceptDrop\"\n         [class.cannot-accept]=\"!canAcceptDrop\">\n      <span [class.i-matcha-action_sign_success]=\"canAcceptDrop\"\n            [class.i-matcha-action_sign_error]=\"!canAcceptDrop\"\n            [class.color-green]=\"canAcceptDrop\"\n            [class.color-red]=\"!canAcceptDrop\"\n            class=\"i-size-lg\"></span>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MatchaDropListComponent, decorators: [{
             type: Component,
@@ -10158,6 +10198,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                 type: Input
             }], matchaDropListHoverExpandDelay: [{
                 type: Input
+            }], matchaDropListMaxDepth: [{
+                type: Input
             }], matchaDropListDropped: [{
                 type: Output
             }], matchaDropListHoverExpand: [{