added .grid-stack-dragging to grid when child is being dragged

* fix #3047
* added `.grid-stack-dragging` to grid when child is being dragged so we can set cursor:grabbing, updated demo.

Author: adumesny

demo/demo.css

@@ -56,13 +56,16 @@ h1 {
 
 .card-header {
   margin: 0;
-  cursor: move;
+  cursor: grab;
   min-height: 25px;
   background-color: #16af91;
 }
 .card-header:hover {
   background-color: #149b80;
 }
+.grid-stack-dragging {
+  cursor: grabbing;
+}
 
 .ui-draggable-disabled.ui-resizable-disabled > .grid-stack-item-content {
   background-color: #777;

doc/CHANGES.md

@@ -134,6 +134,7 @@ Change log
 ## 12.2.2-dev (TBD)
 * fix: [#3099](https://github.com/gridstack/gridstack.js/issues/3099) scroll take into account ScrollContainer position
 * fix: [#3102](https://github.com/gridstack/gridstack.js/pull/3102) React demo now support multiple grids
+* fix: [#3047](https://github.com/gridstack/gridstack.js/issues/3047) added `.grid-stack-dragging` to grid when child is being dragged so we can set cursor:grabbing, updated demo.
 
 ## 12.2.2 (2025-07-06)
 * fix: [#3070](https://github.com/gridstack/gridstack.js/pull/3070) incorrect property name 'sizeToContent' when cleaning up invalid attributes

src/dd-draggable.ts

@@ -309,6 +309,7 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
   /** @internal set the fix position of the dragged item */
   protected _setupHelperStyle(e: DragEvent): DDDraggable {
     this.helper.classList.add('ui-draggable-dragging');
+    this.el.gridstackNode?.grid?.el.classList.add('grid-stack-dragging');
     // TODO: set all at once with style.cssText += ... ? https://stackoverflow.com/questions/3968593
     const style = this.helper.style;
     style.pointerEvents = 'none'; // needed for over items to get enter/leave
@@ -330,6 +331,7 @@ export class DDDraggable extends DDBaseImplement implements HTMLElementExtendOpt
   /** @internal restore back the original style before dragging */
   protected _removeHelperStyle(): DDDraggable {
     this.helper.classList.remove('ui-draggable-dragging');
+    this.el.gridstackNode?.grid?.el.classList.remove('grid-stack-dragging');
     const node = (this.helper as GridItemHTMLElement)?.gridstackNode;
     // don't bother restoring styles if we're gonna remove anyway...
     if (!node?._isAboutToRemove && this.dragElementOriginStyle) {