Merge pull request #3262 from adumesny/master

DDDraggable fix to querySelectorAll(handle) for nested grid

Author: adumesny

angular/doc/api/index.md

@@ -1,4 +1,4 @@
-# GridStack Angular Library v12.5.0
+# GridStack Angular Library v12.5.0-dev
 
 ## Modules
 

doc/API.md

@@ -1,4 +1,4 @@
-# gridstack v12.5.0
+# gridstack v12.5.0-dev
 
 ## Classes
 
@@ -1775,7 +1775,7 @@ is dynamically create and needs to be set later.
 protected triggerEvent(event, target): void;
 ```
 
-Defined in: [gridstack.ts:2974](https://github.com/adumesny/gridstack.js/blob/master/src/gridstack.ts#L2974)
+Defined in: [gridstack.ts:2976](https://github.com/adumesny/gridstack.js/blob/master/src/gridstack.ts#L2976)
 
 call given event callback on our main top-most grid (if we're nested)
 
@@ -4003,7 +4003,7 @@ Defined in: [dd-draggable.ts:69](https://github.com/adumesny/gridstack.js/blob/m
 destroy(): void;
 ```
 
-Defined in: [dd-draggable.ts:122](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L122)
+Defined in: [dd-draggable.ts:131](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L131)
 
 Destroy this drag & drop implementation and clean up resources.
 Removes all event handlers and clears internal state.
@@ -4022,7 +4022,7 @@ Removes all event handlers and clears internal state.
 disable(forDestroy): void;
 ```
 
-Defined in: [dd-draggable.ts:109](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L109)
+Defined in: [dd-draggable.ts:118](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L118)
 
 Disable this drag & drop implementation.
 Subclasses should override to perform additional cleanup.
@@ -4047,7 +4047,7 @@ Subclasses should override to perform additional cleanup.
 enable(): void;
 ```
 
-Defined in: [dd-draggable.ts:95](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L95)
+Defined in: [dd-draggable.ts:104](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L104)
 
 Enable this drag & drop implementation.
 Subclasses should override to perform additional setup.
@@ -4060,13 +4060,27 @@ Subclasses should override to perform additional setup.
 
 [`DDBaseImplement`](#ddbaseimplement).[`enable`](#enable)
 
+##### getAllHandles()
+
+```ts
+protected getAllHandles(): HTMLElement[];
+```
+
+Defined in: [dd-draggable.ts:88](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L88)
+
+return all handles omitting other nested `.grid-stack-item` children (in case where n.subGrid isn't set for some reason)
+
+###### Returns
+
+`HTMLElement`[]
+
 ##### off()
 
 ```ts
 off(event): void;
 ```
 
-Defined in: [dd-draggable.ts:91](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L91)
+Defined in: [dd-draggable.ts:100](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L100)
 
 Unregister an event callback for the specified event.
 
@@ -4090,7 +4104,7 @@ Unregister an event callback for the specified event.
 on(event, callback): void;
 ```
 
-Defined in: [dd-draggable.ts:87](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L87)
+Defined in: [dd-draggable.ts:96](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L96)
 
 Register an event callback for the specified event.
 
@@ -4142,7 +4156,7 @@ Result from the callback function, if any
 updateOption(opts): DDDraggable;
 ```
 
-Defined in: [dd-draggable.ts:133](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L133)
+Defined in: [dd-draggable.ts:142](https://github.com/adumesny/gridstack.js/blob/master/src/dd-draggable.ts#L142)
 
 Method to update the options and return the DD implementation
 

doc/CHANGES.md

@@ -140,6 +140,7 @@ Change log
 ## 12.5.0-dev (TBD)
 * feat: [#3250](https://github.com/gridstack/gridstack.js/pull/3250) full RTL support - thank you [Daniel Cohen Gindi](https://github.com/danielgindi)
 * fix: [#3261](https://github.com/gridstack/gridstack.js/pull/3261) prepareDragDrop() returns for disable after deletion
+* fix: [#3262](https://github.com/gridstack/gridstack.js/pull/3262) DDDraggable fix to querySelectorAll(handle) for nested grid
 
 ## 12.5.0 (2026-04-05)
 * fix: [#3237](https://github.com/gridstack/gridstack.js/pull/3237) updateOptions() fixes for columnOpts, maxRow. load() not cloning

src/dd-draggable.ts

@@ -72,7 +72,7 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
     // get the element that is actually supposed to be dragged by
     const handleName = option?.handle?.substring(1);
     const n = el.gridstackNode;
-    this.dragEls = !handleName || el.classList.contains(handleName) ? [el] : (n?.subGrid ? [el.querySelector(option.handle) || el] : Array.from(el.querySelectorAll(option.handle)));
+    this.dragEls = !handleName || el.classList.contains(handleName) ? [el] : (n?.subGrid ? [el.querySelector(option.handle) || el] : this.getAllHandles());
     if (this.dragEls.length === 0) {
       this.dragEls = [el];
     }
@@ -84,6 +84,15 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
     this.enable();
   }
 
+  /** return all handles omitting other nested `.grid-stack-item` children (in case node.subGrid isn't set for some reason) */
+  protected getAllHandles(): HTMLElement[] {
+    return Array.from(this.el.querySelectorAll(this.option.handle)).filter((node): node is HTMLElement => {
+      if (!(node instanceof HTMLElement)) return false;
+      const owner = node.closest('.grid-stack-item');
+      return owner === this.el || !owner;
+    });
+  }
+
   public on(event: DDDragEvent, callback: (event: DragEvent) => void): void {
     super.on(event, callback);
   }