@vc-shell/framework 2.0.0-alpha.33 → 2.0.0-alpha.34

package/dist/chunks/{vendor-gridstack-Dkfw452e.js → vendor-gridstack-Beau2jQ7.js}

@@ -359,20 +359,12 @@ class h {
     const e = t.style;
     e.position && e.removeProperty("position"), e.left && e.removeProperty("left"), e.top && e.removeProperty("top"), e.width && e.removeProperty("width"), e.height && e.removeProperty("height");
   }
-  /** @internal returns the passed element if scrollable, else the closest parent that will, up to the entire document scrolling element */
+  /** @internal returns the passed element if vertically scrollable, else the closest parent that will, up to the entire document scrolling element */
   static getScrollElement(t) {
     if (!t)
       return document.scrollingElement || document.documentElement;
-    const e = getComputedStyle(t);
-    return /(auto|scroll)/.test(e.overflow + e.overflowY) ? t : h.getScrollElement(t.parentElement);
-  }
-  /** @internal */
-  static updateScrollPosition(t, e, i) {
-    const s = h.getScrollElement(t);
-    if (!s)
-      return;
-    const r = t.getBoundingClientRect(), n = s.getBoundingClientRect(), o = window.innerHeight || document.documentElement.clientHeight, d = r.bottom - Math.min(n.bottom, o), l = r.top - Math.max(n.top, 0), a = s.scrollTop;
-    l < 0 && i < 0 ? t.offsetHeight > n.height ? s.scrollTop += i : s.scrollTop += Math.abs(l) > Math.abs(i) ? i : l : d > 0 && i > 0 && (t.offsetHeight > n.height ? s.scrollTop += i : s.scrollTop += d > i ? i : d), e.top += s.scrollTop - a;
+    const e = getComputedStyle(t).overflowY;
+    return (e === "auto" || e === "scroll") && t.scrollHeight > t.clientHeight ? t : h.getScrollElement(t.parentElement);
   }
   /**
    * @internal Function used to scroll the page.
@@ -603,8 +595,8 @@ class x {
       const l = d._rect;
       let a = Number.MAX_VALUE, u = Number.MAX_VALUE;
       s.y < l.y ? a = (r.y + r.h - l.y) / l.h : s.y + s.h > l.y + l.h && (a = (l.y + l.h - r.y) / l.h), s.x < l.x ? u = (r.x + r.w - l.x) / l.w : s.x + s.w > l.x + l.w && (u = (l.x + l.w - r.x) / l.w);
-      const g = Math.min(u, a);
-      g > o && (o = g, n = d);
+      const c = Math.min(u, a);
+      c > o && (o = c, n = d);
     }
     return e.collide = n, n;
   }
@@ -1060,8 +1052,8 @@ class x {
       const l = t._moving && !e.nested;
       let a = l ? this.directionCollideCoverage(t, e, o) : o[0];
       if (l && a && t.grid?.opts?.subGridDynamic && !t.grid._isTemp) {
-        const u = h.areaIntercept(e.rect, a._rect), g = h.area(e.rect), p = h.area(a._rect);
-        u / (g < p ? g : p) > 0.8 && (a.grid.makeSubGrid(a.el, void 0, t), a = void 0);
+        const u = h.areaIntercept(e.rect, a._rect), c = h.area(e.rect), p = h.area(a._rect);
+        u / (c < p ? c : p) > 0.8 && (a.grid.makeSubGrid(a.el, void 0, t), a = void 0);
       }
       a ? d = !this._fixCollisions(t, r, a, e) : (d = !1, i && delete e.pack);
     }
@@ -1246,13 +1238,13 @@ class w {
 function D(m, t) {
   m.touches.length > 1 || (m.cancelable && m.preventDefault(), h.simulateMouseEvent(m.changedTouches[0], t));
 }
-function G(m, t) {
+function W(m, t) {
   m.cancelable && m.preventDefault(), h.simulateMouseEvent(m, t);
 }
-function N(m) {
+function H(m) {
   w.touchHandled || (w.touchHandled = !0, D(m, "mousedown"));
 }
-function H(m) {
+function N(m) {
   w.touchHandled && D(m, "mousemove");
 }
 function T(m) {
@@ -1265,15 +1257,15 @@ function T(m) {
 function k(m) {
   m.pointerType !== "mouse" && m.target.releasePointerCapture(m.pointerId);
 }
-function B(m) {
-  f.dragElement && m.pointerType !== "mouse" && G(m, "mouseenter");
+function P(m) {
+  f.dragElement && m.pointerType !== "mouse" && W(m, "mouseenter");
 }
-function W(m) {
+function B(m) {
   f.dragElement && m.pointerType !== "mouse" && (w.pointerLeaveTimeout = window.setTimeout(() => {
-    delete w.pointerLeaveTimeout, G(m, "mouseleave");
+    delete w.pointerLeaveTimeout, W(m, "mouseleave");
   }, 10));
 }
-class L {
+class M {
   constructor(t, e, i) {
     this.host = t, this.dir = e, this.option = i, this.moving = !1, this._mouseDown = this._mouseDown.bind(this), this._mouseMove = this._mouseMove.bind(this), this._mouseUp = this._mouseUp.bind(this), this._keyEvent = this._keyEvent.bind(this), this._init();
   }
@@ -1285,15 +1277,15 @@ class L {
       } catch (t) {
         this.option.element = void 0, console.error("Query for resizeable handle failed, falling back", t);
       }
-    return this.el || (this.el = document.createElement("div"), this.host.appendChild(this.el)), this.el.classList.add("ui-resizable-handle"), this.el.classList.add(`${L.prefix}${this.dir}`), this.el.style.zIndex = "100", this.el.style.userSelect = "none", this.el.addEventListener("mousedown", this._mouseDown), b && (this.el.addEventListener("touchstart", N), this.el.addEventListener("pointerdown", k)), this;
+    return this.el || (this.el = document.createElement("div"), this.host.appendChild(this.el)), this.el.classList.add("ui-resizable-handle"), this.el.classList.add(`${M.prefix}${this.dir}`), this.el.style.zIndex = "100", this.el.style.userSelect = "none", this.el.addEventListener("mousedown", this._mouseDown), b && (this.el.addEventListener("touchstart", H), this.el.addEventListener("pointerdown", k)), this;
   }
   /** call this when resize handle needs to be removed and cleaned up */
   destroy() {
-    return this.moving && this._mouseUp(this.mouseDownEvent), this.el.removeEventListener("mousedown", this._mouseDown), b && (this.el.removeEventListener("touchstart", N), this.el.removeEventListener("pointerdown", k)), this.option.element || this.host.removeChild(this.el), delete this.el, delete this.host, this;
+    return this.moving && this._mouseUp(this.mouseDownEvent), this.el.removeEventListener("mousedown", this._mouseDown), b && (this.el.removeEventListener("touchstart", H), this.el.removeEventListener("pointerdown", k)), this.option.element || this.host.removeChild(this.el), delete this.el, delete this.host, this;
   }
   /** @internal called on mouse down on us: capture move on the entire document (mouse might not stay on us) until we release the mouse */
   _mouseDown(t) {
-    this.mouseDownEvent = t, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), b && (this.el.addEventListener("touchmove", H), this.el.addEventListener("touchend", T)), t.stopPropagation(), t.preventDefault();
+    this.mouseDownEvent = t, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), b && (this.el.addEventListener("touchmove", N), this.el.addEventListener("touchend", T)), t.stopPropagation(), t.preventDefault();
   }
   /** @internal */
   _mouseMove(t) {
@@ -1302,7 +1294,7 @@ class L {
   }
   /** @internal */
   _mouseUp(t) {
-    this.moving && (this._triggerEvent("stop", t), document.removeEventListener("keydown", this._keyEvent)), document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), b && (this.el.removeEventListener("touchmove", H), this.el.removeEventListener("touchend", T)), delete this.moving, delete this.mouseDownEvent, t.stopPropagation(), t.preventDefault();
+    this.moving && (this._triggerEvent("stop", t), document.removeEventListener("keydown", this._keyEvent)), document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), b && (this.el.removeEventListener("touchmove", N), this.el.removeEventListener("touchend", T)), delete this.moving, delete this.mouseDownEvent, t.stopPropagation(), t.preventDefault();
   }
   /** @internal call when keys are being pressed - use Esc to cancel */
   _keyEvent(t) {
@@ -1313,7 +1305,7 @@ class L {
     return this.option[t] && this.option[t](e), this;
   }
 }
-L.prefix = "ui-resizable-";
+M.prefix = "ui-resizable-";
 class S {
   constructor() {
     this._eventRegister = {};
@@ -1383,11 +1375,12 @@ class R extends S {
         width: this.originalRect.width,
         height: this.originalRect.height + this.scrolled,
         left: this.originalRect.left,
+        right: this.originalRect.right,
         top: this.originalRect.top - this.scrolled
       }, n = this.temporalRect || r;
       return {
         position: {
-          left: (n.left - s.left) * this.rectScale.x,
+          left: this.option.rtl ? (s.right - n.right) * this.rectScale.x : (n.left - s.left) * this.rectScale.x,
           top: (n.top - s.top) * this.rectScale.y
         },
         size: {
@@ -1445,7 +1438,7 @@ class R extends S {
   }
   /** @internal */
   _setupHandlers() {
-    return this.handlers = this.option.handles.split(",").map((t) => t.trim()).map((t) => new L(this.el, t, {
+    return this.handlers = this.option.handles.split(",").map((t) => t.trim()).map((t) => new M(this.el, t, {
       element: this.option.element,
       start: (e) => this._resizeStart(e),
       stop: (e) => this._resizeStop(e),
@@ -1462,7 +1455,7 @@ class R extends S {
   _resizing(t, e) {
     this.scrolled = this.scrollEl.scrollTop - this.scrollY, this.temporalRect = this._getChange(t, e), this._applyChange();
     const i = h.initEvent(t, { type: "resize", target: this.el });
-    return this.option.resize && this.option.resize(i, this._ui()), this.triggerEvent("resize", i), this;
+    return i.resizeDir = e, i.hasMovedX = this.option.rtl ? e.includes("e") : e.includes("w"), i.hasMovedY = e.includes("n"), this.option.resize && this.option.resize(i, this._ui()), this.triggerEvent("resize", i), this;
   }
   /** @internal */
   _resizeStop(t) {
@@ -1490,12 +1483,14 @@ class R extends S {
       width: this.originalRect.width,
       height: this.originalRect.height + this.scrolled,
       left: this.originalRect.left,
+      right: this.originalRect.right,
       top: this.originalRect.top - this.scrolled
     }, r = t.clientX - i.clientX, n = this.sizeToContent ? 0 : t.clientY - i.clientY;
     let o, d;
-    e.indexOf("e") > -1 ? s.width += r : e.indexOf("w") > -1 && (s.width -= r, s.left += r, o = !0), e.indexOf("s") > -1 ? s.height += n : e.indexOf("n") > -1 && (s.height -= n, s.top += n, d = !0);
-    const l = this._constrainSize(s.width, s.height, o, d);
-    return Math.round(s.width) !== Math.round(l.width) && (e.indexOf("w") > -1 && (s.left += s.width - l.width), s.width = l.width), Math.round(s.height) !== Math.round(l.height) && (e.indexOf("n") > -1 && (s.top += s.height - l.height), s.height = l.height), s;
+    const l = this.option.rtl;
+    !l && e.indexOf("e") > -1 ? s.width += r : l && e.indexOf("w") > -1 ? s.width -= r : !l && e.indexOf("w") > -1 ? (s.width -= r, s.left += r, o = !0) : l && e.indexOf("e") > -1 && (s.width += r, s.right += r, o = !0), e.indexOf("s") > -1 ? s.height += n : e.indexOf("n") > -1 && (s.height -= n, s.top += n, d = !0);
+    const a = this._constrainSize(s.width, s.height, o, d);
+    return Math.round(s.width) !== Math.round(a.width) && (!l && e.indexOf("w") > -1 ? s.left += s.width - a.width : l && e.indexOf("e") > -1 && (s.right -= s.width - a.width), s.width = a.width), Math.round(s.height) !== Math.round(a.height) && (e.indexOf("n") > -1 && (s.top += s.height - a.height), s.height = a.height), s;
   }
   /** @internal constrain the size to the set min/max values */
   _constrainSize(t, e, i, s) {
@@ -1504,14 +1499,17 @@ class R extends S {
   }
   /** @internal */
   _applyChange() {
-    let t = { left: 0, top: 0, width: 0, height: 0 };
+    let t = { left: 0, right: 0, top: 0, width: 0, height: 0 };
     if (this.el.style.position === "absolute") {
-      const e = this.el.parentElement, { left: i, top: s } = e.getBoundingClientRect();
-      t = { left: i, top: s, width: 0, height: 0 };
+      const e = this.el.parentElement, { left: i, right: s, top: r } = e.getBoundingClientRect();
+      t = { left: i, right: s, top: r, width: 0, height: 0 };
     }
-    return this.temporalRect ? (Object.keys(this.temporalRect).forEach((e) => {
-      const i = this.temporalRect[e], s = e === "width" || e === "left" ? this.rectScale.x : e === "height" || e === "top" ? this.rectScale.y : 1;
-      this.el.style[e] = (i - t[e]) * s + "px";
+    return this.temporalRect ? (Object.entries(this.temporalRect).forEach(([e, i]) => {
+      if (this.option.rtl ? e === "left" : e === "right")
+        return;
+      const s = e === "width" || e === "left" || e === "right" ? this.rectScale.x : e === "height" || e === "top" ? this.rectScale.y : 1;
+      let r;
+      e === "right" ? r = (t.right - i) * this.rectScale.x + "px" : r = (i - t[e]) * s + "px", this.el.style[e] = r;
     }), this) : this;
   }
   /** @internal */
@@ -1519,8 +1517,8 @@ class R extends S {
     return this.handlers.forEach((t) => t.destroy()), delete this.handlers, this;
   }
 }
-R._originStyleProp = ["width", "height", "position", "left", "top", "opacity", "zIndex"];
-const F = 'input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle';
+R._originStyleProp = ["width", "height", "position", "left", "right", "top", "opacity", "zIndex"];
+const U = 'input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle';
 class z extends S {
   constructor(t, e = {}) {
     super(), this.el = t, this.option = e, this.dragTransform = {
@@ -1528,9 +1526,39 @@ class z extends S {
       yScale: 1,
       xOffset: 0,
       yOffset: 0
+    }, this._autoScrollTick = () => {
+      const r = this.helper, n = this._autoScrollContainer;
+      if (!r || !n) {
+        this._stopScrolling();
+        return;
+      }
+      const o = this._getClipping(r, n);
+      if (o === 0) {
+        this._stopScrolling();
+        return;
+      }
+      if (!this._autoScrollMaxSpeed) {
+        const c = window.innerHeight || document.documentElement.clientHeight;
+        this._autoScrollMaxSpeed = Math.max(c / 150, 4);
+      }
+      const d = Math.abs(o), l = Math.min(d * 0.5, this._autoScrollMaxSpeed), a = o > 0 ? l : -l, u = n.scrollTop;
+      if (n.scrollTop += a, n.scrollTop === u) {
+        this._stopScrolling();
+        return;
+      }
+      this.dragging && this.lastDrag && (this._dragFollow(this.lastDrag), this._callDrag(this.lastDrag)), this._autoScrollAnimId = requestAnimationFrame(this._autoScrollTick);
     };
     const i = e?.handle?.substring(1), s = t.gridstackNode;
-    this.dragEls = !i || t.classList.contains(i) ? [t] : s?.subGrid ? [t.querySelector(e.handle) || t] : Array.from(t.querySelectorAll(e.handle)), this.dragEls.length === 0 && (this.dragEls = [t]), this._mouseDown = this._mouseDown.bind(this), this._mouseMove = this._mouseMove.bind(this), this._mouseUp = this._mouseUp.bind(this), this._keyEvent = this._keyEvent.bind(this), this.enable();
+    this.dragEls = !i || t.classList.contains(i) ? [t] : s?.subGrid ? [t.querySelector(e.handle) || t] : this.getAllHandles(), this.dragEls.length === 0 && (this.dragEls = [t]), this._mouseDown = this._mouseDown.bind(this), this._mouseMove = this._mouseMove.bind(this), this._mouseUp = this._mouseUp.bind(this), this._keyEvent = this._keyEvent.bind(this), this.enable();
+  }
+  /** return all handles omitting other nested `.grid-stack-item` children (in case node.subGrid isn't set for some reason) */
+  getAllHandles() {
+    return Array.from(this.el.querySelectorAll(this.option.handle)).filter((t) => {
+      if (!(t instanceof HTMLElement))
+        return !1;
+      const e = t.closest(".grid-stack-item");
+      return e === this.el || !e;
+    });
   }
   on(t, e) {
     super.on(t, e);
@@ -1540,12 +1568,12 @@ class z extends S {
   }
   enable() {
     this.disabled !== !1 && (super.enable(), this.dragEls.forEach((t) => {
-      t.addEventListener("mousedown", this._mouseDown), b && (t.addEventListener("touchstart", N), t.addEventListener("pointerdown", k));
+      t.addEventListener("mousedown", this._mouseDown), b && (t.addEventListener("touchstart", H), t.addEventListener("pointerdown", k));
     }), this.el.classList.remove("ui-draggable-disabled"));
   }
   disable(t = !1) {
     this.disabled !== !0 && (super.disable(), this.dragEls.forEach((e) => {
-      e.removeEventListener("mousedown", this._mouseDown), b && (e.removeEventListener("touchstart", N), e.removeEventListener("pointerdown", k));
+      e.removeEventListener("mousedown", this._mouseDown), b && (e.removeEventListener("touchstart", H), e.removeEventListener("pointerdown", k));
     }), t || this.el.classList.add("ui-draggable-disabled"));
   }
   destroy() {
@@ -1557,7 +1585,7 @@ class z extends S {
   /** @internal call when mouse goes down before a dragstart happens */
   _mouseDown(t) {
     if (w.touchHandled && t.isTrusted && (w.touchHandled = !1), !f.mouseHandled)
-      return t.button !== 0 || !this.dragEls.find((e) => e === t.target) && t.target.closest(F) || this.option.cancel && t.target.closest(this.option.cancel) || (this.mouseDownEvent = t, delete this.dragging, delete f.dragElement, delete f.dropElement, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), b && (t.currentTarget.addEventListener("touchmove", H), t.currentTarget.addEventListener("touchend", T)), t.preventDefault(), document.activeElement && document.activeElement.blur(), f.mouseHandled = !0), !0;
+      return t.button !== 0 || !this.dragEls.find((e) => e === t.target) && t.target.closest(U) || this.option.cancel && t.target.closest(this.option.cancel) || (this.mouseDownEvent = t, delete this.dragging, delete f.dragElement, delete f.dropElement, delete this._autoScrollMaxSpeed, delete this._autoScrollContainer, document.addEventListener("mousemove", this._mouseMove, { capture: !0, passive: !0 }), document.addEventListener("mouseup", this._mouseUp, !0), b && (t.currentTarget.addEventListener("touchmove", N), t.currentTarget.addEventListener("touchend", T)), t.preventDefault(), document.activeElement && document.activeElement.blur(), f.mouseHandled = !0), !0;
   }
   /** @internal method to call actual drag event */
   _callDrag(t) {
@@ -1586,7 +1614,7 @@ class z extends S {
   }
   /** @internal call when the mouse gets released to drop the item at current location */
   _mouseUp(t) {
-    if (document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), b && t.currentTarget && (t.currentTarget.removeEventListener("touchmove", H, !0), t.currentTarget.removeEventListener("touchend", T, !0)), this.dragging) {
+    if (this._stopScrolling(), document.removeEventListener("mousemove", this._mouseMove, !0), document.removeEventListener("mouseup", this._mouseUp, !0), b && t.currentTarget && (t.currentTarget.removeEventListener("touchmove", N, !0), t.currentTarget.removeEventListener("touchend", T, !0)), this.dragging) {
       delete this.dragging, delete this.el.gridstackNode?._origRotate, document.removeEventListener("keydown", this._keyEvent), f.dropElement?.el === this.el.parentElement && delete f.dropElement, this.helperContainment.style.position = this.parentOriginStylePosition || null, this.helper !== this.el && this.helper.remove(), this._removeHelperStyle();
       const e = h.initEvent(t, { target: this.el, type: "dragstop" });
       this.option.stop && this.option.stop(e), this.triggerEvent("dragstop", e), f.dropElement && f.dropElement.drop(t);
@@ -1601,7 +1629,10 @@ class z extends S {
     else if (e && i && (t.key === "r" || t.key === "R")) {
       if (!h.canBeRotated(e))
         return;
-      e._origRotate = e._origRotate || { ...e._orig }, delete e._moving, i.setAnimation(!1).rotate(e.el, { top: -this.dragOffset.offsetTop, left: -this.dragOffset.offsetLeft }).setAnimation(), e._moving = !0, this.dragOffset = this._getDragOffset(this.lastDrag, e.el, this.helperContainment), this.helper.style.width = this.dragOffset.width + "px", this.helper.style.height = this.dragOffset.height + "px", h.swap(e._orig, "w", "h"), delete e._rect, this._mouseMove(this.lastDrag);
+      e._origRotate = e._origRotate || { ...e._orig }, delete e._moving, i.setAnimation(!1).rotate(e.el, {
+        top: -this.dragOffset.offsetTop,
+        left: -this.dragOffset.offsetX
+      }).setAnimation(), e._moving = !0, this.dragOffset = this._getDragOffset(this.lastDrag, e.el, this.helperContainment), this.helper.style.width = this.dragOffset.width + "px", this.helper.style.height = this.dragOffset.height + "px", h.swap(e._orig, "w", "h"), delete e._rect, this._mouseMove(this.lastDrag);
     }
   }
   /** @internal create a clone copy (or user defined method) of the original drag item if set */
@@ -1613,7 +1644,7 @@ class z extends S {
   _setupHelperStyle(t) {
     this.helper.classList.add("ui-draggable-dragging"), this.el.gridstackNode?.grid?.el.classList.add("grid-stack-dragging");
     const e = this.helper.style;
-    return e.pointerEvents = "none", e.width = this.dragOffset.width + "px", e.height = this.dragOffset.height + "px", e.willChange = "left, top", e.position = "fixed", this._dragFollow(t), e.transition = "none", setTimeout(() => {
+    return e.pointerEvents = "none", e.width = this.dragOffset.width + "px", e.height = this.dragOffset.height + "px", e.willChange = "left, right, top", e.position = "fixed", this._dragFollow(t), e.transition = "none", setTimeout(() => {
       this.helper && (e.transition = null);
     }, 0), this;
   }
@@ -1627,8 +1658,8 @@ class z extends S {
   }
   /** @internal updates the top/left position to follow the mouse */
   _dragFollow(t) {
-    const e = { left: 0, top: 0 }, i = this.helper.style, s = this.dragOffset;
-    i.left = (t.clientX + s.offsetLeft - e.left) * this.dragTransform.xScale + "px", i.top = (t.clientY + s.offsetTop - e.top) * this.dragTransform.yScale + "px";
+    const e = this.helper.style, i = this.dragOffset;
+    this.option.rtl ? (e.right = (window.innerWidth - t.clientX + i.offsetX) * this.dragTransform.xScale + "px", e.left && (e.left = "")) : (e.left = (t.clientX + i.offsetX) * this.dragTransform.xScale + "px", e.right && (e.right = "")), e.top = (t.clientY + i.offsetTop) * this.dragTransform.yScale + "px";
   }
   /** @internal */
   _setupHelperContainmentStyle() {
@@ -1639,22 +1670,40 @@ class z extends S {
     let s = 0, r = 0;
     i && (s = this.dragTransform.xOffset, r = this.dragTransform.yOffset);
     const n = e.getBoundingClientRect();
+    let o = this.option.rtl ? n.right : n.left, d = this.option.rtl ? t.clientX - n.right + s : -t.clientX + n.left - s;
     return {
-      left: n.left,
+      x: o,
       top: n.top,
-      offsetLeft: -t.clientX + n.left - s,
+      offsetX: d,
       offsetTop: -t.clientY + n.top - r,
       width: n.width * this.dragTransform.xScale,
       height: n.height * this.dragTransform.yScale
     };
   }
+  /** @internal starts or continues auto-scroll when the dragged helper is clipped by the scroll container.
+   * Takes the grid's own element to find the scroll container so external/sidebar drags work too (#2074). */
+  updateScrollPosition(t) {
+    this._autoScrollContainer = h.getScrollElement(t), this._getClipping(this.helper, this._autoScrollContainer) === 0 ? this._stopScrolling() : this._autoScrollAnimId || (this._autoScrollAnimId = requestAnimationFrame(this._autoScrollTick));
+  }
+  /** @internal compute how many pixels the element is clipped: negative = above, positive = below, 0 = fully inside OR outside (stop scrolling) */
+  _getClipping(t, e) {
+    const i = t.getBoundingClientRect(), s = e.getBoundingClientRect(), r = window.innerHeight || document.documentElement.clientHeight;
+    if (i.bottom < s.top || i.top > s.bottom)
+      return 0;
+    const n = i.bottom - Math.min(s.bottom, r), o = i.top - Math.max(s.top, 0);
+    return o < 0 ? o : n > 0 ? n : 0;
+  }
+  /** @internal stop any active auto-scroll animation */
+  _stopScrolling() {
+    this._autoScrollAnimId && (cancelAnimationFrame(this._autoScrollAnimId), delete this._autoScrollAnimId);
+  }
   /** @internal TODO: set to public as called by DDDroppable! */
   ui() {
-    const e = this.el.parentElement.getBoundingClientRect(), i = this.helper.getBoundingClientRect();
+    const e = this.el.parentElement.getBoundingClientRect(), i = this.helper.getBoundingClientRect(), s = this.option.rtl ? (e.right - i.right) * this.dragTransform.xScale : (i.left - e.left) * this.dragTransform.xScale;
     return {
       position: {
         top: (i.top - e.top) * this.dragTransform.yScale,
-        left: (i.left - e.left) * this.dragTransform.xScale
+        left: s
       }
       /* not used by GridStack for now...
       helper: [this.helper], //The object arr representing the helper that's being dragged.
@@ -1663,8 +1712,8 @@ class z extends S {
     };
   }
 }
-z.originStyleProp = ["width", "height", "transform", "transform-origin", "transition", "pointerEvents", "position", "left", "top", "minWidth", "willChange"];
-class Y extends S {
+z.originStyleProp = ["width", "height", "transform", "transform-origin", "transition", "pointerEvents", "position", "left", "right", "top", "minWidth", "willChange"];
+class F extends S {
   constructor(t, e = {}) {
     super(), this.el = t, this.option = e, this._mouseEnter = this._mouseEnter.bind(this), this._mouseLeave = this._mouseLeave.bind(this), this.enable(), this._setupAccept();
   }
@@ -1675,10 +1724,10 @@ class Y extends S {
     super.off(t);
   }
   enable() {
-    this.disabled !== !1 && (super.enable(), this.el.classList.add("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), this.el.addEventListener("mouseenter", this._mouseEnter), this.el.addEventListener("mouseleave", this._mouseLeave), b && (this.el.addEventListener("pointerenter", B), this.el.addEventListener("pointerleave", W)));
+    this.disabled !== !1 && (super.enable(), this.el.classList.add("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), this.el.addEventListener("mouseenter", this._mouseEnter), this.el.addEventListener("mouseleave", this._mouseLeave), b && (this.el.addEventListener("pointerenter", P), this.el.addEventListener("pointerleave", B)));
   }
   disable(t = !1) {
-    this.disabled !== !0 && (super.disable(), this.el.classList.remove("ui-droppable"), t || this.el.classList.add("ui-droppable-disabled"), this.el.removeEventListener("mouseenter", this._mouseEnter), this.el.removeEventListener("mouseleave", this._mouseLeave), b && (this.el.removeEventListener("pointerenter", B), this.el.removeEventListener("pointerleave", W)));
+    this.disabled !== !0 && (super.disable(), this.el.classList.remove("ui-droppable"), t || this.el.classList.add("ui-droppable-disabled"), this.el.removeEventListener("mouseenter", this._mouseEnter), this.el.removeEventListener("mouseleave", this._mouseLeave), b && (this.el.removeEventListener("pointerenter", P), this.el.removeEventListener("pointerleave", B)));
   }
   destroy() {
     this.disable(!0), this.el.classList.remove("ui-droppable"), this.el.classList.remove("ui-droppable-disabled"), super.destroy();
@@ -1690,7 +1739,7 @@ class Y extends S {
   _mouseEnter(t) {
     if (!f.dragElement || w.touchHandled && t.isTrusted || !this._canDrop(f.dragElement.el))
       return;
-    t.preventDefault(), t.stopPropagation(), f.dropElement && f.dropElement !== this && f.dropElement._mouseLeave(t, !0), f.dropElement = this;
+    t.preventDefault(), t.stopPropagation(), f.dragElement._stopScrolling(), f.dropElement && f.dropElement !== this && f.dropElement._mouseLeave(t, !0), f.dropElement = this;
     const e = h.initEvent(t, { target: this.el, type: "dropover" });
     this.option.over && this.option.over(e, this._ui(f.dragElement)), this.triggerEvent("dropover", e), this.el.classList.add("ui-droppable-over");
   }
@@ -1698,7 +1747,7 @@ class Y extends S {
   _mouseLeave(t, e = !1) {
     if (!f.dragElement || f.dropElement !== this)
       return;
-    t.preventDefault(), t.stopPropagation();
+    t.preventDefault(), t.stopPropagation(), e && f.dragElement._stopScrolling();
     const i = h.initEvent(t, { target: this.el, type: "dropout" });
     if (this.option.out && this.option.out(i, this._ui(f.dragElement)), this.triggerEvent("dropout", i), f.dropElement === this && (delete f.dropElement, !e)) {
       let s, r = this.el.parentElement;
@@ -1729,9 +1778,9 @@ class Y extends S {
     };
   }
 }
-class P {
+class O {
   static init(t) {
-    return t.ddElement || (t.ddElement = new P(t)), t.ddElement;
+    return t.ddElement || (t.ddElement = new O(t)), t.ddElement;
   }
   constructor(t) {
     this.el = t;
@@ -1755,13 +1804,13 @@ class P {
     return this.ddResizable && (this.ddResizable.destroy(), delete this.ddResizable), this;
   }
   setupDroppable(t) {
-    return this.ddDroppable ? this.ddDroppable.updateOption(t) : this.ddDroppable = new Y(this.el, t), this;
+    return this.ddDroppable ? this.ddDroppable.updateOption(t) : this.ddDroppable = new F(this.el, t), this;
   }
   cleanDroppable() {
     return this.ddDroppable && (this.ddDroppable.destroy(), delete this.ddDroppable), this;
   }
 }
-class q {
+class X {
   /**
    * Enable/disable/configure resizing for grid elements.
    *
@@ -1794,7 +1843,8 @@ class q {
           autoHide: l,
           start: e.start,
           stop: e.stop,
-          resize: e.resize
+          resize: e.resize,
+          rtl: e.rtl
         });
       }
     }), this;
@@ -1806,6 +1856,7 @@ class q {
    * @param opts - Drag options or command ('enable', 'disable', 'destroy', 'option', or config object)
    * @param key - Option key when using 'option' command
    * @param value - Option value when using 'option' command
+   * @param rtl - Are we in rtl mode?
    * @returns this instance for chaining
    *
    * @example
@@ -1827,7 +1878,8 @@ class q {
           // containment: (grid.parentGridNode && grid.opts.dragOut === false) ? grid.el.parentElement : (grid.opts.draggable.containment || null),
           start: e.start,
           stop: e.stop,
-          drag: e.drag
+          drag: e.drag,
+          rtl: e.rtl
         });
       }
     }), this;
@@ -1863,18 +1915,18 @@ class q {
   /** @internal returns a list of DD elements, creating them on the fly by default unless option is to destroy or disable */
   _getDDElements(t, e) {
     const i = t.gridstack || e !== "destroy" && e !== "disable", s = h.getElements(t);
-    return s.length ? s.map((n) => n.ddElement || (i ? P.init(n) : null)).filter((n) => n) : [];
+    return s.length ? s.map((n) => n.ddElement || (i ? O.init(n) : null)).filter((n) => n) : [];
   }
 }
 /*!
- * GridStack 12.4.2
+ * GridStack 12.6.0
  * https://gridstackjs.com/
  *
  * Copyright (c) 2021-2025  Alain Dumesny
  * see root license https://github.com/gridstack/gridstack.js/tree/master/LICENSE
  */
-const y = new q();
-class c {
+const y = new X();
+class g {
   /**
    * initializing the HTML element, or selector string, into a grid will return the grid. Calling it again will
    * simply return the existing instance (ignore any passed options). There is also an initAll() version that support
@@ -1891,8 +1943,8 @@ class c {
   static init(t = {}, e = ".grid-stack") {
     if (typeof document > "u")
       return null;
-    const i = c.getGridElement(e);
-    return i ? (i.gridstack || (i.gridstack = new c(i, h.cloneDeep(t))), i.gridstack) : (console.error(typeof e == "string" ? 'GridStack.initAll() no grid was found with selector "' + e + `" - element missing or wrong selector ?
+    const i = g.getGridElement(e);
+    return i ? (i.gridstack || (i.gridstack = new g(i, h.cloneDeep(t))), i.gridstack) : (console.error(typeof e == "string" ? 'GridStack.initAll() no grid was found with selector "' + e + `" - element missing or wrong selector ?
 Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.` : "GridStack.init() no grid element was passed."), null);
   }
   /**
@@ -1906,8 +1958,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    */
   static initAll(t = {}, e = ".grid-stack") {
     const i = [];
-    return typeof document > "u" || (c.getGridElements(e).forEach((s) => {
-      s.gridstack || (s.gridstack = new c(s, h.cloneDeep(t))), i.push(s.gridstack);
+    return typeof document > "u" || (g.getGridElements(e).forEach((s) => {
+      s.gridstack || (s.gridstack = new g(s, h.cloneDeep(t))), i.push(s.gridstack);
     }), i.length === 0 && console.error('GridStack.initAll() no grid was found with selector "' + e + `" - element missing or wrong selector ?
 Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.`)), i;
   }
@@ -1926,14 +1978,14 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       const n = i.gridstack;
       return e && (n.opts = { ...n.opts, ...e }), e.children !== void 0 && n.load(e.children), n;
     }
-    return (!t.classList.contains("grid-stack") || c.addRemoveCB) && (c.addRemoveCB ? i = c.addRemoveCB(t, e, !0, !0) : i = h.createDiv(["grid-stack", e.class], t)), c.init(e, i);
+    return (!t.classList.contains("grid-stack") || g.addRemoveCB) && (g.addRemoveCB ? i = g.addRemoveCB(t, e, !0, !0) : i = h.createDiv(["grid-stack", e.class], t)), g.init(e, i);
   }
   /** call this method to register your engine instead of the default one.
    * See instead `GridStackOptions.engineClass` if you only need to
    * replace just one instance.
    */
   static registerEngine(t) {
-    c.engineClass = t;
+    g.engineClass = t;
   }
   /**
    * @internal create placeholder DIV as needed
@@ -1986,7 +2038,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       delete e.cellHeight, this.cellHeight(l);
     }
     e.alwaysShowResizeHandle === "mobile" && (e.alwaysShowResizeHandle = b), this._setStaticClass();
-    const d = e.engineClass || c.engineClass || x;
+    const d = e.engineClass || g.engineClass || x;
     if (this.engine = new d({
       column: this.getColumn(),
       float: e.float,
@@ -2029,7 +2081,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (t.ELEMENT_NODE)
       return console.error("V11: GridStack.addWidget() does not support HTMLElement anymore. use makeWidget()"), this.makeWidget(t);
     let e, i = t;
-    if (i.grid = this, i.el ? e = i.el : c.addRemoveCB ? e = c.addRemoveCB(this.el, t, !0, !1) : e = this.createWidgetDivs(i), !e)
+    if (i.grid = this, i.el ? e = i.el : g.addRemoveCB ? e = g.addRemoveCB(this.el, t, !0, !1) : e = this.createWidgetDivs(i), !e)
       return;
     if (i = e.gridstackNode, i && e.parentElement === this.el && this.engine.nodes.find((r) => r._id === i._id))
       return e;
@@ -2048,8 +2100,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   createWidgetDivs(t) {
     const e = h.createDiv(["grid-stack-item", this.opts.itemClass]), i = h.createDiv(["grid-stack-item-content"], e);
     return h.lazyLoad(t) ? t.visibleObservable || (t.visibleObservable = new IntersectionObserver(([s]) => {
-      s.isIntersecting && (t.visibleObservable?.disconnect(), delete t.visibleObservable, c.renderCB(i, t), t.grid?.prepareDragDrop(t.el));
-    }), window.setTimeout(() => t.visibleObservable?.observe(e))) : c.renderCB(i, t), e;
+      s.isIntersecting && (t.visibleObservable?.disconnect(), delete t.visibleObservable, g.renderCB(i, t), t.grid?.prepareDragDrop(t.el));
+    }), window.setTimeout(() => t.visibleObservable?.observe(e))) : g.renderCB(i, t), e;
   }
   /**
    * Convert an existing gridItem element into a sub-grid with the given (optional) options, else inherit them
@@ -2082,12 +2134,12 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     let d;
     e.column === "auto" && (d = !0, e.column = Math.max(r.w || 1, i?.w || 1), delete e.columnOpts);
     let l = r.el.querySelector(".grid-stack-item-content"), a, u;
-    if (s && (this._removeDD(r.el), u = { ...r, x: 0, y: 0 }, h.removeInternalForSave(u), delete u.subGridOpts, r.content && (u.content = r.content, delete r.content), c.addRemoveCB ? a = c.addRemoveCB(this.el, u, !0, !1) : (a = h.createDiv(["grid-stack-item"]), a.appendChild(l), l = h.createDiv(["grid-stack-item-content"], r.el)), this.prepareDragDrop(r.el)), i) {
+    if (s && (this._removeDD(r.el), u = { ...r, x: 0, y: 0 }, h.removeInternalForSave(u), delete u.subGridOpts, r.content && (u.content = r.content, delete r.content), g.addRemoveCB ? a = g.addRemoveCB(this.el, u, !0, !1) : (a = h.createDiv(["grid-stack-item"]), a.appendChild(l), l = h.createDiv(["grid-stack-item-content"], r.el)), this.prepareDragDrop(r.el)), i) {
       const p = d ? e.column : r.w, _ = r.h + i.h, E = r.el.style;
       E.transition = "none", this.update(r.el, { w: p, h: _ }), setTimeout(() => E.transition = null);
     }
-    const g = r.subGrid = c.addGrid(l, e);
-    return i?._moving && (g._isTemp = !0), d && (g._autoColumn = !0), s && g.makeWidget(a, u), i && (i._moving ? window.setTimeout(() => h.simulateMouseEvent(i._event, "mouseenter", g.el), 0) : g.makeWidget(r.el, r)), this.resizeToContentCheck(!1, r), g;
+    const c = r.subGrid = g.addGrid(l, e);
+    return i?._moving && (c._isTemp = !0), d && (c._autoColumn = !0), s && c.makeWidget(a, u), i && (i._moving ? window.setTimeout(() => h.simulateMouseEvent(i._event, "mouseenter", c.el), 0) : c.makeWidget(r.el, r)), this.resizeToContentCheck(!1, r), c;
   }
   /**
    * called when an item was converted into a nested grid to accommodate a dragged over item, but then item leaves - return back
@@ -2112,7 +2164,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * NOTE2: nested grids will ALWAYS save to the container size to be in sync with parent.
    * @returns list of widgets or full grid option, including .children list of widgets
    */
-  save(t = !0, e = !1, i = c.saveCB, s) {
+  save(t = !0, e = !1, i = g.saveCB, s) {
     const r = this.engine.save(t, i, s);
     if (r.forEach((n) => {
       if (t && n.el && !n.subGrid && !i) {
@@ -2166,36 +2218,36 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    *
    * @see {@link http://gridstackjs.com/demo/serialization.html} for complete example
    */
-  load(t, e = c.addRemoveCB || !0) {
-    t = h.cloneDeep(t);
-    const i = this.getColumn();
+  load(t, e = g.addRemoveCB || !0) {
     t.forEach((a) => {
       a.w = a.w || a.minW || 1, a.h = a.h || a.minH || 1;
     }), t = h.sort(t), this.engine.skipCacheUpdate = this._ignoreLayoutsNodeChange = !0;
-    let s = 0;
+    let i = 0;
     t.forEach((a) => {
-      s = Math.max(s, (a.x || 0) + a.w);
-    }), s > this.engine.defaultColumn && (this.engine.defaultColumn = s), s > i && (this.engine.nodes.length === 0 && this.responseLayout ? (this.engine.nodes = t, this.engine.columnChanged(s, i, this.responseLayout), t = this.engine.nodes, this.engine.nodes = [], delete this.responseLayout) : this.engine.cacheLayout(t, s, !0));
-    const r = c.addRemoveCB;
-    typeof e == "function" && (c.addRemoveCB = e);
+      i = Math.max(i, (a.x || 0) + a.w);
+    }), i > this.engine.defaultColumn && (this.engine.defaultColumn = i);
+    const s = this.getColumn();
+    i > s && (this.engine.nodes.length === 0 && this.responseLayout ? (this.engine.nodes = t, this.engine.columnChanged(i, s, this.responseLayout), t = this.engine.nodes, this.engine.nodes = [], delete this.responseLayout) : this.engine.cacheLayout(t, i, !0));
+    const r = g.addRemoveCB;
+    typeof e == "function" && (g.addRemoveCB = e);
     const n = [];
     this.batchUpdate();
     const o = !this.engine.nodes.length, d = o && this.opts.animate;
     d && this.setAnimation(!1), !o && e && [...this.engine.nodes].forEach((u) => {
       if (!u.id)
         return;
-      h.find(t, u.id) || (c.addRemoveCB && c.addRemoveCB(this.el, u, !1, !1), n.push(u), this.removeWidget(u.el, !0, !1));
+      h.find(t, u.id) || (g.addRemoveCB && g.addRemoveCB(this.el, u, !1, !1), n.push(u), this.removeWidget(u.el, !0, !1));
     }), this.engine._loading = !0;
     const l = [];
     return this.engine.nodes = this.engine.nodes.filter((a) => h.find(t, a.id) ? (l.push(a), !1) : !0), t.forEach((a) => {
       const u = h.find(l, a.id);
       if (u) {
         if (h.shouldSizeToContent(u) && (a.h = u.h), this.engine.nodeBoundFix(a), (a.autoPosition || a.x === void 0 || a.y === void 0) && (a.w = a.w || u.w, a.h = a.h || u.h, this.engine.findEmptyPosition(a)), this.engine.nodes.push(u), h.samePos(u, a) && this.engine.nodes.length > 1 && (this.moveNode(u, { ...a, forceCollide: !0 }), h.copyPos(a, u)), this.update(u.el, a), a.subGridOpts?.children) {
-          const g = u.el.querySelector(".grid-stack");
-          g && g.gridstack && g.gridstack.load(a.subGridOpts.children);
+          const c = u.el.querySelector(".grid-stack");
+          c && c.gridstack && c.gridstack.load(a.subGridOpts.children);
         }
       } else e && this.addWidget(a);
-    }), delete this.engine._loading, this.engine.removedNodes = n, this.batchUpdate(!1), delete this._ignoreLayoutsNodeChange, delete this.engine.skipCacheUpdate, r ? c.addRemoveCB = r : delete c.addRemoveCB, d && this.setAnimation(!0, !0), this;
+    }), delete this.engine._loading, this.engine.removedNodes = n, this.batchUpdate(!1), delete this._ignoreLayoutsNodeChange, delete this.engine.skipCacheUpdate, r ? g.addRemoveCB = r : delete g.addRemoveCB, d && this.setAnimation(!0, !0), this;
   }
   /**
    * use before calling a bunch of `addWidget()` to prevent un-necessary relayouts in between (more efficient)
@@ -2508,7 +2560,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.makeWidget(element, {x: 0, y: 1, w: 4, h: 2});
    */
   makeWidget(t, e) {
-    const i = c.getElement(t);
+    const i = g.getElement(t);
     if (!i || i.gridstackNode)
       return i;
     i.parentElement || this.el.appendChild(i), this._prepareElement(i, !0, e);
@@ -2547,11 +2599,11 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * @param triggerEvent if `false` (quiet mode) element will not be added to removed list and no 'removed' callbacks will be called (Default? true).
    */
   removeWidget(t, e = !0, i = !0) {
-    return t ? (c.getElements(t).forEach((s) => {
+    return t ? (g.getElements(t).forEach((s) => {
       if (s.parentElement && s.parentElement !== this.el)
         return;
       let r = s.gridstackNode;
-      r || (r = this.engine.nodes.find((n) => s === n.el)), r && (e && c.addRemoveCB && c.addRemoveCB(this.el, r, !1, !1), delete s.gridstackNode, this._removeDD(s), this.engine.removeNode(r, e, i), e && s.parentElement && s.remove());
+      r || (r = this.engine.nodes.find((n) => s === n.el)), r && (e && g.addRemoveCB && g.addRemoveCB(this.el, r, !1, !1), delete s.gridstackNode, this._removeDD(s), this.engine.removeNode(r, e, i), e && s.parentElement && s.remove());
     }), i && (this._triggerRemoveEvent(), this._triggerChangeEvent()), this) : (console.error("Error: GridStack.removeWidget(undefined) called"), this);
   }
   /**
@@ -2561,7 +2613,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    */
   removeAll(t = !0, e = !0) {
     return this.engine.nodes.forEach((i) => {
-      t && c.addRemoveCB && c.addRemoveCB(this.el, i, !1, !1), delete i.el.gridstackNode, this.opts.staticGrid || this._removeDD(i.el);
+      t && g.addRemoveCB && g.addRemoveCB(this.el, i, !1, !1), delete i.el.gridstackNode, this.opts.staticGrid || this._removeDD(i.el);
     }), this.engine.removeAll(t, e), e && this._triggerRemoveEvent(), this;
   }
   /**
@@ -2597,7 +2649,13 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    */
   updateOptions(t) {
     const e = this.opts;
-    return t === e ? this : (t.acceptWidgets !== void 0 && (e.acceptWidgets = t.acceptWidgets, this._setupAcceptWidget()), t.animate !== void 0 && this.setAnimation(t.animate), t.cellHeight && this.cellHeight(t.cellHeight), t.class !== void 0 && t.class !== e.class && (e.class && this.el.classList.remove(e.class), t.class && this.el.classList.add(t.class)), t.columnOpts ? (this.opts.columnOpts = t.columnOpts, this.checkDynamicColumn()) : t.columnOpts === null && this.opts.columnOpts ? (delete this.opts.columnOpts, this._updateResizeEvent()) : typeof t.column == "number" && this.column(t.column), t.margin !== void 0 && this.margin(t.margin), t.staticGrid !== void 0 && this.setStatic(t.staticGrid), t.disableDrag !== void 0 && !t.staticGrid && this.enableMove(!t.disableDrag), t.disableResize !== void 0 && !t.staticGrid && this.enableResize(!t.disableResize), t.float !== void 0 && this.float(t.float), t.row !== void 0 ? (e.minRow = e.maxRow = e.row = t.row, this._updateContainerHeight()) : (t.minRow !== void 0 && (e.minRow = t.minRow, this._updateContainerHeight()), t.maxRow !== void 0 && (e.maxRow = t.maxRow)), t.lazyLoad !== void 0 && (e.lazyLoad = t.lazyLoad), t.children?.length && this.load(t.children), this);
+    if (t === e)
+      return this;
+    if (t.acceptWidgets !== void 0 && (e.acceptWidgets = t.acceptWidgets, this._setupAcceptWidget()), t.animate !== void 0 && this.setAnimation(t.animate), t.cellHeight && this.cellHeight(t.cellHeight), t.class !== void 0 && t.class !== e.class && (e.class && this.el.classList.remove(e.class), t.class && this.el.classList.add(t.class)), t.columnOpts) {
+      const i = !!this.opts.columnOpts;
+      this.opts.columnOpts = t.columnOpts, i !== !!this.opts.columnOpts && this._updateResizeEvent(), this.checkDynamicColumn();
+    } else t.columnOpts === null && this.opts.columnOpts ? (delete this.opts.columnOpts, this._updateResizeEvent()) : typeof t.column == "number" && this.column(t.column);
+    return t.margin !== void 0 && this.margin(t.margin), t.staticGrid !== void 0 && this.setStatic(t.staticGrid), t.disableDrag !== void 0 && !t.staticGrid && this.enableMove(!t.disableDrag), t.disableResize !== void 0 && !t.staticGrid && this.enableResize(!t.disableResize), t.float !== void 0 && this.float(t.float), t.row !== void 0 ? (e.minRow = e.maxRow = e.row = t.row, this._updateContainerHeight()) : (t.minRow !== void 0 && (e.minRow = t.minRow, this._updateContainerHeight()), t.maxRow !== void 0 && (e.maxRow = this.engine.maxRow = t.maxRow)), t.lazyLoad !== void 0 && (e.lazyLoad = t.lazyLoad), t.children?.length && this.load(t.children), this;
   }
   /**
    * Updates widget position/size and other info. This is used to change widget properties after creation.
@@ -2626,7 +2684,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * });
    */
   update(t, e) {
-    return c.getElements(t).forEach((i) => {
+    return g.getElements(t).forEach((i) => {
       const s = i?.gridstackNode;
       if (!s)
         return;
@@ -2638,7 +2696,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         o[a] = r[a] !== void 0 ? r[a] : s[a], delete r[a];
       })), !o && (r.minW || r.minH || r.maxW || r.maxH) && (o = {}), r.content !== void 0) {
         const a = i.querySelector(".grid-stack-item-content");
-        a && a.textContent !== r.content && (s.content = r.content, c.renderCB(a, r), s.subGrid?.el && (a.appendChild(s.subGrid.el), s.subGrid._updateContainerHeight())), delete r.content;
+        a && a.textContent !== r.content && (s.content = r.content, g.renderCB(a, r), s.subGrid?.el && (a.appendChild(s.subGrid.el), s.subGrid._updateContainerHeight())), delete r.content;
       }
       let d = !1, l = !1;
       for (const a in r)
@@ -2647,7 +2705,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         const a = o.w !== void 0 && o.w !== s.w;
         this.moveNode(s, o), a && s.subGrid ? s.subGrid.onResize(this.hasAnimationCSS() ? s.w : void 0) : this.resizeToContentCheck(a, s), delete s._orig;
       }
-      (o || d) && this._writeAttr(i, s), l && this.prepareDragDrop(s.el), c.updateCB && c.updateCB(s);
+      (o || d) && this._writeAttr(i, s), l && this.prepareDragDrop(s.el), g.updateCB && g.updateCB(s);
     }), this;
   }
   moveNode(t, e) {
@@ -2685,24 +2743,24 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (!s)
       return;
     let r = e.h ? e.h * s : t.clientHeight, n;
-    if (e.resizeToContentParent && (n = t.querySelector(e.resizeToContentParent)), n || (n = t.querySelector(c.resizeToContentParent)), !n)
+    if (e.resizeToContentParent && (n = t.querySelector(e.resizeToContentParent)), n || (n = t.querySelector(g.resizeToContentParent)), !n)
       return;
     const o = t.clientHeight - n.clientHeight, d = e.h ? e.h * s - o : n.clientHeight;
     let l;
     if (e.subGrid) {
       l = e.subGrid.getRow() * e.subGrid.getCellHeight(!0);
-      const g = e.subGrid.el.getBoundingClientRect(), p = t.getBoundingClientRect();
-      l += g.top - p.top;
+      const c = e.subGrid.el.getBoundingClientRect(), p = t.getBoundingClientRect();
+      l += c.top - p.top;
     } else {
       if (e.subGridOpts?.children?.length)
         return;
       {
-        const g = n.firstElementChild;
-        if (!g) {
-          console.error(`Error: GridStack.resizeToContent() widget id:${e.id} '${c.resizeToContentParent}'.firstElementChild is null, make sure to have a div like container. Skipping sizing.`);
+        const c = n.firstElementChild;
+        if (!c) {
+          console.error(`Error: GridStack.resizeToContent() widget id:${e.id} '${g.resizeToContentParent}'.firstElementChild is null, make sure to have a div like container. Skipping sizing.`);
           return;
         }
-        l = g.getBoundingClientRect().height || d;
+        l = c.getBoundingClientRect().height || d;
       }
     }
     if (d === l)
@@ -2714,7 +2772,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** call the user resize (so they can do extra work) else our build in version */
   resizeToContentCBCheck(t) {
-    c.resizeToContentCB ? c.resizeToContentCB(t) : this.resizeToContent(t);
+    g.resizeToContentCB ? g.resizeToContentCB(t) : this.resizeToContent(t);
   }
   /**
    * Rotate widgets by swapping their width and height. This is typically called when the user presses 'r' during dragging.
@@ -2732,7 +2790,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.rotate(widget, { left: 50, top: 30 });
    */
   rotate(t, e) {
-    return c.getElements(t).forEach((i) => {
+    return g.getElements(t).forEach((i) => {
       const s = i.gridstackNode;
       if (!h.canBeRotated(s))
         return;
@@ -2867,7 +2925,11 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** @internal write position CSS vars and x,y,w,h attributes (not used for CSS but by users) back to element */
   _writePosAttr(t, e) {
-    return (!e._moving && !e._resizing || this._placeholder === t) && (t.style.top = e.y ? e.y === 1 ? "var(--gs-cell-height)" : `calc(${e.y} * var(--gs-cell-height))` : null, t.style.left = e.x ? e.x === 1 ? "var(--gs-column-width)" : `calc(${e.x} * var(--gs-column-width))` : null, t.style.width = e.w > 1 ? `calc(${e.w} * var(--gs-column-width))` : null, t.style.height = e.h > 1 ? `calc(${e.h} * var(--gs-cell-height))` : null), t.setAttribute("gs-x", String(e.x)), t.setAttribute("gs-y", String(e.y)), e.w > 1 ? t.setAttribute("gs-w", String(e.w)) : t.removeAttribute("gs-w"), e.h > 1 ? t.setAttribute("gs-h", String(e.h)) : t.removeAttribute("gs-h"), this;
+    if (!e._moving && !e._resizing || this._placeholder === t) {
+      const i = this.opts.rtl ? "right" : "left";
+      t.style.top = e.y ? e.y === 1 ? "var(--gs-cell-height)" : `calc(${e.y} * var(--gs-cell-height))` : null, t.style[i] = e.x ? e.x === 1 ? "var(--gs-column-width)" : `calc(${e.x} * var(--gs-column-width))` : null, t.style.width = e.w > 1 ? `calc(${e.w} * var(--gs-column-width))` : null, t.style.height = e.h > 1 ? `calc(${e.h} * var(--gs-cell-height))` : null;
+    }
+    return t.setAttribute("gs-x", String(e.x)), t.setAttribute("gs-y", String(e.y)), e.w > 1 ? t.setAttribute("gs-w", String(e.w)) : t.removeAttribute("gs-w"), e.h > 1 ? t.setAttribute("gs-h", String(e.h)) : t.removeAttribute("gs-h"), this;
   }
   /** @internal call to write any default attributes back to element */
   _writeAttr(t, e) {
@@ -2949,7 +3011,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   }
   /** @internal */
   static getGridElement(t) {
-    return c.getElement(t);
+    return g.getElement(t);
   }
   /** @internal */
   static getGridElements(t) {
@@ -3015,7 +3077,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.movable('#fixed-widget', false);
    */
   movable(t, e) {
-    return this.opts.staticGrid ? this : (c.getElements(t).forEach((i) => {
+    return this.opts.staticGrid ? this : (g.getElements(t).forEach((i) => {
       const s = i.gridstackNode;
       s && (e ? delete s.noMove : s.noMove = !0, this.prepareDragDrop(s.el));
     }), this);
@@ -3036,7 +3098,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
    * grid.resizable('#fixed-size-widget', false);
    */
   resizable(t, e) {
-    return this.opts.staticGrid ? this : (c.getElements(t).forEach((i) => {
+    return this.opts.staticGrid ? this : (g.getElements(t).forEach((i) => {
       const s = i.gridstackNode;
       s && (e ? delete s.noResize : s.noResize = !0, this.prepareDragDrop(s.el));
     }), this);
@@ -3140,7 +3202,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   /** @internal call when drag (and drop) needs to be cancelled (Esc key) */
   cancelDrag() {
     const t = this._placeholder?.gridstackNode;
-    t && (t._isExternal ? (t._isAboutToRemove = !0, this.engine.removeNode(t)) : t._isAboutToRemove && c._itemRemoving(t.el, !1), this.engine.restoreInitial());
+    t && (t._isExternal ? (t._isAboutToRemove = !0, this.engine.removeNode(t)) : t._isAboutToRemove && g._itemRemoving(t.el, !1), this.engine.restoreInitial());
   }
   /** @internal removes any drag&drop present (called during destroy) */
   _removeDD(t) {
@@ -3158,8 +3220,8 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         return;
       if (!o.grid?.el) {
         n.style.transform = `scale(${1 / this.dragTransform.xScale},${1 / this.dragTransform.yScale})`;
-        const g = n.getBoundingClientRect();
-        n.style.left = g.x + (this.dragTransform.xScale - 1) * (s.clientX - g.x) / this.dragTransform.xScale + "px", n.style.top = g.y + (this.dragTransform.yScale - 1) * (s.clientY - g.y) / this.dragTransform.yScale + "px", n.style.transformOrigin = "0px 0px";
+        const c = n.getBoundingClientRect();
+        n.style.left = c.x + (this.dragTransform.xScale - 1) * (s.clientX - c.x) / this.dragTransform.xScale + "px", n.style.top = c.y + (this.dragTransform.yScale - 1) * (s.clientY - c.y) / this.dragTransform.yScale + "px", n.style.transformOrigin = "0px 0px";
       }
       let { top: d, left: l } = n.getBoundingClientRect();
       const a = this.el.getBoundingClientRect();
@@ -3221,7 +3283,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       o.grid || (o.el || (o = { ...o }), o._isExternal = !0, n.gridstackNode = o);
       const d = o.w || Math.round(n.offsetWidth / e) || 1, l = o.h || Math.round(n.offsetHeight / t) || 1;
       return o.grid && o.grid !== this ? (r._gridstackNodeOrig || (r._gridstackNodeOrig = o), r.gridstackNode = o = { ...o, w: d, h: l, grid: this }, delete o.x, delete o.y, this.engine.cleanupNode(o).nodeBoundFix(o), o._initDD = o._isExternal = // DOM needs to be re-parented on a drop
-      o._temporaryRemoved = !0) : (o.w = d, o.h = l, o._temporaryRemoved = !0), c._itemRemoving(o.el, !1), y.on(r, "drag", i), i(s, r, n), !1;
+      o._temporaryRemoved = !0) : (o.w = d, o.h = l, o._temporaryRemoved = !0), g._itemRemoving(o.el, !1), y.on(r, "drag", i), i(s, r, n), !1;
     }).on(this.el, "dropout", (s, r, n) => {
       const o = n?.gridstackNode || r.gridstackNode;
       return o && (!o.grid || o.grid === this) && (this._leave(r, n), this._isTemp && this.removeAsSubGrid(o)), !1;
@@ -3233,13 +3295,13 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       this.placeholder.remove(), delete this.placeholder.gridstackNode, d && this.opts.animate && (this.setAnimation(!1), this.setAnimation(!0, !0));
       const a = r._gridstackNodeOrig;
       if (delete r._gridstackNodeOrig, d && a?.grid && a.grid !== this) {
-        const g = a.grid;
-        g.engine.removeNodeFromLayoutCache(a), g.engine.removedNodes.push(a), g._triggerRemoveEvent()._triggerChangeEvent(), g.parentGridNode && !g.engine.nodes.length && g.opts.subGridDynamic && g.removeAsSubGrid();
+        const c = a.grid;
+        c.engine.removeNodeFromLayoutCache(a), c.engine.removedNodes.push(a), c._triggerRemoveEvent()._triggerChangeEvent(), c.parentGridNode && !c.engine.nodes.length && c.opts.subGridDynamic && c.removeAsSubGrid();
       }
       if (!o || (d && (this.engine.cleanupNode(o), o.grid = this), delete o.grid?._isTemp, y.off(r, "drag"), n !== r ? (n.remove(), r = n) : r.remove(), this._removeDD(r), !d))
         return !1;
       const u = o.subGrid?.el?.gridstack;
-      return h.copyPos(o, this._readAttr(this.placeholder)), h.removePositioningStyles(r), l && (o.content || o.subGridOpts || c.addRemoveCB) ? (delete o.el, r = this.addWidget(o)) : (this._prepareElement(r, !0, o), this.el.appendChild(r), this.resizeToContentCheck(!1, o), u && (u.parentGridNode = o), this._updateContainerHeight()), this.engine.addedNodes.push(o), this._triggerAddEvent(), this._triggerChangeEvent(), this.engine.endUpdate(), this._gsEventHandler.dropped && this._gsEventHandler.dropped({ ...s, type: "dropped" }, a && a.grid ? a : void 0, o), !1;
+      return h.copyPos(o, this._readAttr(this.placeholder)), h.removePositioningStyles(r), l && (o.content || o.subGridOpts || g.addRemoveCB) ? (delete o.el, r = this.addWidget(o)) : (this._prepareElement(r, !0, o), this.el.appendChild(r), this.resizeToContentCheck(!1, o), u && (u.parentGridNode = o), this._updateContainerHeight()), this.engine.addedNodes.push(o), this._triggerAddEvent(), this._triggerChangeEvent(), this.engine.endUpdate(), this._gsEventHandler.dropped && this._gsEventHandler.dropped({ ...s, type: "dropped" }, a && a.grid ? a : void 0, o), !1;
     }), this;
   }
   /** @internal mark item for removal */
@@ -3254,7 +3316,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (typeof this.opts.removable != "string")
       return this;
     const t = document.querySelector(this.opts.removable);
-    return t ? (!this.opts.staticGrid && !y.isDroppable(t) && y.droppable(t, this.opts.removableOptions).on(t, "dropover", (e, i) => c._itemRemoving(i, !0)).on(t, "dropout", (e, i) => c._itemRemoving(i, !1)), this) : this;
+    return t ? (!this.opts.staticGrid && !y.isDroppable(t) && y.droppable(t, this.opts.removableOptions).on(t, "dropover", (e, i) => g._itemRemoving(i, !0)).on(t, "dropout", (e, i) => g._itemRemoving(i, !1)), this) : this;
   }
   /**
    * prepares the element for drag&drop - this is normally called by makeWidget() unless are are delay loading
@@ -3266,34 +3328,36 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
     if (!i)
       return;
     const s = i.noMove || this.opts.disableDrag, r = i.noResize || this.opts.disableResize, n = this.opts.staticGrid || s && r;
-    if ((e || n) && (i._initDD && (this._removeDD(t), delete i._initDD), n && t.classList.add("ui-draggable-disabled", "ui-resizable-disabled"), !e))
-      return this;
+    if ((e || n) && (i._initDD && (this._removeDD(t), delete i._initDD), n))
+      return t.classList.add("ui-draggable-disabled", "ui-resizable-disabled"), this;
     if (!i._initDD) {
       let o, d;
-      const l = (g, p) => {
-        this.triggerEvent(g, g.target), o = this.cellWidth(), d = this.getCellHeight(!0), this._onStartMoving(t, g, p, i, o, d);
-      }, a = (g, p) => {
-        this._dragOrResize(t, g, p, i, o, d);
-      }, u = (g) => {
+      const l = (c, p) => {
+        this.triggerEvent(c, c.target), o = this.cellWidth(), d = this.getCellHeight(!0), this._onStartMoving(t, c, p, i, o, d);
+      }, a = (c, p) => {
+        this._dragOrResize(t, c, p, i, o, d);
+      }, u = (c) => {
         this.placeholder.remove(), delete this.placeholder.gridstackNode, delete i._moving, delete i._resizing, delete i._event, delete i._lastTried;
-        const p = i.w !== i._orig.w, _ = g.target;
+        const p = i.w !== i._orig.w, _ = c.target;
         if (!(!_.gridstackNode || _.gridstackNode.grid !== this)) {
           if (i.el = _, i._isAboutToRemove) {
             const E = t.gridstackNode.grid;
-            E._gsEventHandler[g.type] && E._gsEventHandler[g.type](g, _), E.engine.nodes.push(i), E.removeWidget(t, !0, !0);
+            E._gsEventHandler[c.type] && E._gsEventHandler[c.type](c, _), E.engine.nodes.push(i), E.removeWidget(t, !0, !0);
           } else
-            h.removePositioningStyles(_), i._temporaryRemoved ? (this._writePosAttr(_, i), this.engine.addNode(i)) : this._writePosAttr(_, i), this.triggerEvent(g, _);
-          this._extraDragRow = 0, this._updateContainerHeight(), this._triggerChangeEvent(), this.engine.endUpdate(), g.type === "resizestop" && (Number.isInteger(i.sizeToContent) && (i.sizeToContent = i.h), this.resizeToContentCheck(p, i));
+            h.removePositioningStyles(_), i._temporaryRemoved ? (this._writePosAttr(_, i), this.engine.addNode(i)) : this._writePosAttr(_, i), this.triggerEvent(c, _);
+          this._extraDragRow = 0, this._updateContainerHeight(), this._triggerChangeEvent(), this.engine.endUpdate(), c.type === "resizestop" && (Number.isInteger(i.sizeToContent) && (i.sizeToContent = i.h), this.resizeToContentCheck(p, i));
         }
       };
       y.draggable(t, {
         start: l,
         stop: u,
-        drag: a
+        drag: a,
+        rtl: this.opts.rtl
       }).resizable(t, {
         start: l,
         stop: u,
-        resize: a
+        resize: a,
+        rtl: this.opts.rtl
       }), i._initDD = !0;
     }
     return y.draggable(t, s ? "disable" : "enable").resizable(t, r ? "disable" : "enable"), this;
@@ -3320,39 +3384,45 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
   /** @internal handles actual drag/resize */
   _dragOrResize(t, e, i, s, r, n) {
     const o = { ...s._orig };
-    let d, l = this.opts.marginLeft, a = this.opts.marginRight, u = this.opts.marginTop, g = this.opts.marginBottom;
+    let d, l = this.opts.marginLeft, a = this.opts.marginRight, u = this.opts.marginTop, c = this.opts.marginBottom;
     const p = Math.round(n * 0.1), _ = Math.round(r * 0.1);
-    if (l = Math.min(l, _), a = Math.min(a, _), u = Math.min(u, p), g = Math.min(g, p), e.type === "drag") {
+    if (l = Math.min(l, _), a = Math.min(a, _), u = Math.min(u, p), c = Math.min(c, p), e.type === "drag") {
       if (s._temporaryRemoved)
         return;
-      const C = i.position.top - s._prevYPix;
-      s._prevYPix = i.position.top, this.opts.draggable.scroll !== !1 && h.updateScrollPosition(t, i.position, C);
-      const M = i.position.left + (i.position.left > s._lastUiPosition.left ? -a : l), I = i.position.top + (i.position.top > s._lastUiPosition.top ? -g : u);
-      o.x = Math.round(M / r), o.y = Math.round(I / n);
-      const U = this._extraDragRow;
+      s._prevYPix = i.position.top, this.opts.draggable.scroll !== !1 && f.dragElement?.updateScrollPosition(this.el);
+      const C = i.position.left + (i.position.left > s._lastUiPosition.left ? -a : l), G = i.position.top + (i.position.top > s._lastUiPosition.top ? -c : u);
+      o.x = Math.round(C / r), o.y = Math.round(G / n);
+      const I = this._extraDragRow;
       if (this.engine.collide(s, o)) {
         const A = this.getRow();
-        let O = Math.max(0, o.y + s.h - A);
-        this.opts.maxRow && A + O > this.opts.maxRow && (O = Math.max(0, this.opts.maxRow - A)), this._extraDragRow = O;
+        let L = Math.max(0, o.y + s.h - A);
+        this.opts.maxRow && A + L > this.opts.maxRow && (L = Math.max(0, this.opts.maxRow - A)), this._extraDragRow = L;
       } else
         this._extraDragRow = 0;
-      if (this._extraDragRow !== U && this._updateContainerHeight(), s.x === o.x && s.y === o.y)
+      if (this._extraDragRow !== I && this._updateContainerHeight(), s.x === o.x && s.y === o.y)
         return;
     } else if (e.type === "resize") {
       if (o.x < 0 || (h.updateScrollResize(e, t, n), o.w = Math.round((i.size.width - l) / r), o.h = Math.round((i.size.height - u) / n), s.w === o.w && s.h === o.h) || s._lastTried && s._lastTried.w === o.w && s._lastTried.h === o.h)
         return;
-      const C = i.position.left + l, M = i.position.top + u;
-      o.x = Math.round(C / r), o.y = Math.round(M / n), d = !0;
+      if (e.hasMovedX) {
+        const C = i.position.left + l;
+        o.x = Math.round(C / r);
+      }
+      if (e.hasMovedY) {
+        const C = i.position.top + u;
+        o.y = Math.round(C / n);
+      }
+      d = !0;
     }
     s._event = e, s._lastTried = o;
     const E = {
       x: i.position.left + l,
       y: i.position.top + u,
       w: (i.size ? i.size.width : s.w * r) - l - a,
-      h: (i.size ? i.size.height : s.h * n) - u - g
+      h: (i.size ? i.size.height : s.h * n) - u - c
     };
     if (this.engine.moveNodeCheck(s, { ...o, cellWidth: r, cellHeight: n, rect: E, resizing: d })) {
-      s._lastUiPosition = i.position, this.engine.cacheRects(r, n, u, a, g, l), delete s._skipDown, d && s.subGrid && s.subGrid.onResize(), this._extraDragRow = 0, this._updateContainerHeight();
+      s._lastUiPosition = i.position, this.engine.cacheRects(r, n, u, a, c, l), delete s._skipDown, d && s.subGrid && s.subGrid.onResize(), this._extraDragRow = 0, this._updateContainerHeight();
       const C = e.target;
       s._sidebarOrig || this._writePosAttr(C, s), this.triggerEvent(e, C);
     }
@@ -3375,16 +3445,16 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
       return;
     i._temporaryRemoved = !0, this.engine.removeNode(i), i.el = i._isExternal && e ? e : t;
     const s = i._sidebarOrig;
-    i._isExternal && this.engine.cleanupNode(i), i._sidebarOrig = s, this.opts.removable === !0 && c._itemRemoving(t, !0), t._gridstackNodeOrig ? (t.gridstackNode = t._gridstackNodeOrig, delete t._gridstackNodeOrig) : i._isExternal && this.engine.restoreInitial();
+    i._isExternal && this.engine.cleanupNode(i), i._sidebarOrig = s, this.opts.removable === !0 && g._itemRemoving(t, !0), t._gridstackNodeOrig ? (t.gridstackNode = t._gridstackNodeOrig, delete t._gridstackNodeOrig) : i._isExternal && this.engine.restoreInitial();
   }
 }
-c.renderCB = (m, t) => {
+g.renderCB = (m, t) => {
   m && t?.content && (m.textContent = t.content);
 };
-c.resizeToContentParent = ".grid-stack-item-content";
-c.Utils = h;
-c.Engine = x;
-c.GDRev = "12.4.2";
+g.resizeToContentParent = ".grid-stack-item-content";
+g.Utils = h;
+g.Engine = x;
+g.GDRev = "12.6.0";
 export {
-  c as G
+  g as G
 };