From 2c918e48b85e33941488d2003871e034322faf87 Mon Sep 17 00:00:00 2001
From: Alain Dumesny <alain.dumesny@broadcom.com>
Date: Sun, 21 Sep 2025 18:05:39 -0700
Subject: [PATCH] Esc doesn't restore subgrid (partial)

* partial fix #3154
* started looking at fixing nested changes to unroll but it turn out to be a lot more complex - saving those WIP for another time...
---
 src/dd-draggable.ts |  2 +-
 src/gridstack.ts    | 19 +++++++++++++++++--
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/dd-draggable.ts b/src/dd-draggable.ts
index f1abe630..7a964117 100644
--- a/src/dd-draggable.ts
+++ b/src/dd-draggable.ts
@@ -331,7 +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');
+    (this.el._gridstackNodeOrig || 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) {
diff --git a/src/gridstack.ts b/src/gridstack.ts
index 30c8595d..0a62ae21 100644
--- a/src/gridstack.ts
+++ b/src/gridstack.ts
@@ -2374,12 +2374,22 @@ export class GridStack {
 
   /** @internal call when drag (and drop) needs to be cancelled (Esc key) */
   public cancelDrag() {
-    const n = this._placeholder?.gridstackNode;
+    const el = DDManager.dragElement?.el;
+    let n = el?.gridstackNode;
     if (!n) return;
     if (n._isExternal) {
       // remove any newly inserted nodes (from outside)
       n._isAboutToRemove = true;
       this.engine.removeNode(n);
+      // check if this came from another grid, where it needs to be restored (swap it back)
+      if (el._gridstackNodeOrig) {
+        el.gridstackNode = n = el._gridstackNodeOrig;
+        delete el._gridstackNodeOrig;
+        delete DDManager.dropElement; // not dropping onto our original grid, will manually add it back
+        const grid = n.grid;
+        grid.engine.addNode(n, false);
+        grid.engine.restoreInitial();
+      }
     } else if (n._isAboutToRemove) {
       // restore any temp removed (dragged over trash)
       GridStack._itemRemoving(n.el, false);
@@ -2746,11 +2756,15 @@ export class GridStack {
       const onEndMoving = (event: Event) => {
         this.placeholder.remove();
         delete this.placeholder.gridstackNode;
+        const widthChanged = node.w !== node._orig.w;
         delete node._moving;
         delete node._resizing;
         delete node._event;
         delete node._lastTried;
-        const widthChanged = node.w !== node._orig.w;
+        delete node._lastUiPosition;
+        delete node._prevYPix;
+        delete node._rect;
+        delete node._sidebarOrig;
 
         // if the item has moved to another grid, we're done here
         const target: GridItemHTMLElement = event.target as GridItemHTMLElement;
@@ -2913,6 +2927,7 @@ export class GridStack {
       if (node.x === p.x && node.y === p.y) return; // skip same
       // DON'T skip one we tried as we might have failed because of coverage <50% before
       // if (node._lastTried && node._lastTried.x === x && node._lastTried.y === y) return;
+      console.log('not skip same');
     } else if (event.type === 'resize') {
       if (p.x < 0) return;
       // Scrolling page if needed