diff --git a/static/designer.css b/static/designer.css
index 9dc2d1b..3deb616 100644
--- a/static/designer.css
+++ b/static/designer.css
@@ -1,5 +1,7 @@
 /* A4 Template Designer with Gridstack.js */
-@import url('https://cdn.jsdelivr.net/npm/gridstack@11.1.3/gridstack.min.css');
+
+/* Gridstack base styles (loaded locally) */
+/* gridstack.min.css is loaded via <link> in the page */
 
 /* Designer layout */
 .designer-layout {
diff --git a/static/designer.js b/static/designer.js
index 236656c..bdf9d26 100644
--- a/static/designer.js
+++ b/static/designer.js
@@ -80,25 +80,8 @@ function showDesigner(templateId = null) {
     `;
     showModal(body, 'A4 Template Designer', 'large');
     
-    // Load Gridstack CSS dynamically
-    if (!document.getElementById('gridstack-css')) {
-      const link = document.createElement('link');
-      link.id = 'gridstack-css';
-      link.rel = 'stylesheet';
-      link.href = 'https://cdn.jsdelivr.net/npm/gridstack@11.1.3/gridstack.min.css';
-      document.head.appendChild(link);
-    }
-
-    // Load Gridstack JS dynamically
-    if (typeof GridStack === 'undefined') {
-      const script = document.createElement('script');
-      script.src = 'https://cdn.jsdelivr.net/npm/gridstack@11.1.3/gridstack-all-jq.js';
-      script.onload = () => initGridstack();
-      document.head.appendChild(script);
-    } else {
-      initGridstack();
-    }
-
+    // Gridstack is loaded via <script> in index.html, just init
+    initGridstack();
     renderDesignerPalette();
   });
 }
@@ -156,7 +139,7 @@ function renderDesignerPalette() {
   const el = document.getElementById('designer-palette-list');
   if (!el) return;
   el.innerHTML = Object.entries(BLOCK_TYPES).map(([type, info]) => `
-    <div class="palette-block" data-type="${type}" onclick="addBlockFromPalette('${type}')">
+    <div class="palette-block" draggable="true" data-type="${type}" onclick="addBlockFromPalette('${type}')">
       <div class="icon" style="background:${info.color}">${info.icon}</div>
       <div>
         <div class="label">${info.label}</div>
@@ -167,16 +150,27 @@ function renderDesignerPalette() {
 }
 
 function setupPaletteDrag() {
-  // Gridstack native widget drop from sidebar
-  if (designerGrid) {
-    designerGrid.removeDraggable('.palette-block');
-    document.querySelectorAll('.palette-block').forEach(el => {
-      designerGrid.draggable(el, {
-        appendTo: '#a4-page',
-        helper: 'clone',
-        revert: 'invalid',
-        handle: 'div',
-      });
+  // Palette items use click-to-add (onclick in renderDesignerPalette)
+  // Native HTML5 drag-and-drop is also supported via the palette items' draggable attribute
+  document.querySelectorAll('.palette-block').forEach(el => {
+    el.addEventListener('dragstart', (e) => {
+      const type = el.dataset.type;
+      e.dataTransfer.setData('text/plain', type);
+    });
+  });
+  
+  // Make the canvas accept drops
+  const canvas = document.getElementById('a4-page');
+  if (canvas) {
+    canvas.addEventListener('dragover', (e) => {
+      e.preventDefault();
+    });
+    canvas.addEventListener('drop', (e) => {
+      e.preventDefault();
+      const type = e.dataTransfer.getData('text/plain');
+      if (type && BLOCK_TYPES[type]) {
+        addBlockFromPalette(type);
+      }
     });
   }
 }
diff --git a/static/gridstack-all.js b/static/gridstack-all.js
new file mode 100644
index 0000000..d883066
--- /dev/null
+++ b/static/gridstack-all.js
@@ -0,0 +1,3 @@
+/*! For license information please see gridstack-all.js.LICENSE.txt */
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.GridStack=t():e.GridStack=t()}(self,()=>(()=>{"use strict";var e={d:(t,i)=>{for(var s in i)e.o(i,s)&&!e.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:i[s]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};e.d(t,{GridStack:()=>x});class i{static getElements(e,t=document){if("string"==typeof e){const i="getElementById"in t?t:void 0;if(i&&!isNaN(+e[0])){const t=i.getElementById(e);return t?[t]:[]}let s=t.querySelectorAll(e);if(!s.length&&"."!==e[0]&&"#"!==e[0]&&(s=t.querySelectorAll("."+e),s.length||(s=t.querySelectorAll("#"+e)),!s.length)){const i=t.querySelector(`[gs-id="${e}"]`);return i?[i]:[]}return Array.from(s)}return[e]}static getElement(e,t=document){if("string"==typeof e){const i="getElementById"in t?t:void 0;if(!e.length)return null;if(i&&"#"===e[0])return i.getElementById(e.substring(1));if("#"===e[0]||"."===e[0]||"["===e[0])return t.querySelector(e);if(i&&!isNaN(+e[0]))return i.getElementById(e);let s=t.querySelector(e);return i&&!s&&(s=i.getElementById(e)),s||(s=t.querySelector("."+e)),s}return e}static lazyLoad(e){return e.lazyLoad||e.grid?.opts?.lazyLoad&&!1!==e.lazyLoad}static createDiv(e,t){const i=document.createElement("div");return e.forEach(e=>{e&&i.classList.add(e)}),t?.appendChild(i),i}static shouldSizeToContent(e,t=!1){return e?.grid&&(t?!0===e.sizeToContent||!0===e.grid.opts.sizeToContent&&void 0===e.sizeToContent:!!e.sizeToContent||e.grid.opts.sizeToContent&&!1!==e.sizeToContent)}static isIntercepted(e,t){return!(e.y>=t.y+t.h||e.y+e.h<=t.y||e.x+e.w<=t.x||e.x>=t.x+t.w)}static isTouching(e,t){return i.isIntercepted(e,{x:t.x-.5,y:t.y-.5,w:t.w+1,h:t.h+1})}static areaIntercept(e,t){const i=e.x>t.x?e.x:t.x,s=e.x+e.w<t.x+t.w?e.x+e.w:t.x+t.w;if(s<=i)return 0;const o=e.y>t.y?e.y:t.y,n=e.y+e.h<t.y+t.h?e.y+e.h:t.y+t.h;return n<=o?0:(s-i)*(n-o)}static area(e){return e.w*e.h}static sort(e,t=1){const i=1e4;return e.sort((e,s)=>{const o=t*((e.y??i)-(s.y??i));return 0===o?t*((e.x??i)-(s.x??i)):o})}static find(e,t){return t?e.find(e=>e.id===t):void 0}static toBool(e){return"boolean"==typeof e?e:"string"==typeof e?!(""===(e=e.toLowerCase())||"no"===e||"false"===e||"0"===e):Boolean(e)}static toNumber(e){return null===e||0===e.length?void 0:Number(e)}static parseHeight(e){let t,i="px";if("string"==typeof e)if("auto"===e||""===e)t=0;else{const s=e.match(/^(-[0-9]+\.[0-9]+|[0-9]*\.[0-9]+|-[0-9]+|[0-9]+)(px|em|rem|vh|vw|%|cm|mm)?$/);if(!s)throw new Error(`Invalid height val = ${e}`);i=s[2]||"px",t=parseFloat(s[1])}else t=e;return{h:t,unit:i}}static defaults(e,...t){return t.forEach(t=>{for(const s in t){if(!t.hasOwnProperty(s))return;null===e[s]||void 0===e[s]?e[s]=t[s]:"object"==typeof t[s]&&"object"==typeof e[s]&&i.defaults(e[s],t[s])}}),e}static same(e,t){if("object"!=typeof e)return e==t;if(typeof e!=typeof t)return!1;if(Object.keys(e).length!==Object.keys(t).length)return!1;for(const i in e)if(e[i]!==t[i])return!1;return!0}static copyPos(e,t,i=!1){return void 0!==t.x&&(e.x=t.x),void 0!==t.y&&(e.y=t.y),void 0!==t.w&&(e.w=t.w),void 0!==t.h&&(e.h=t.h),i&&(t.minW&&(e.minW=t.minW),t.minH&&(e.minH=t.minH),t.maxW&&(e.maxW=t.maxW),t.maxH&&(e.maxH=t.maxH)),e}static samePos(e,t){return e&&t&&e.x===t.x&&e.y===t.y&&(e.w||1)===(t.w||1)&&(e.h||1)===(t.h||1)}static sanitizeMinMax(e){e.minW||delete e.minW,e.minH||delete e.minH,e.maxW||delete e.maxW,e.maxH||delete e.maxH}static removeInternalAndSame(e,t){if("object"==typeof e&&"object"==typeof t&&!Array.isArray(e)&&!Array.isArray(t))for(let s in e){const o=e[s],n=t[s];"_"===s[0]||o===n?delete e[s]:o&&"object"==typeof o&&void 0!==n&&(i.removeInternalAndSame(o,n),Object.keys(o).length||delete e[s])}}static removeInternalForSave(e,t=!0){for(let t in e)"_"!==t[0]&&null!==e[t]&&void 0!==e[t]||delete e[t];delete e.grid,t&&delete e.el,e.autoPosition||delete e.autoPosition,e.noResize||delete e.noResize,e.noMove||delete e.noMove,e.locked||delete e.locked,1!==e.w&&e.w!==e.minW||delete e.w,1!==e.h&&e.h!==e.minH||delete e.h}static throttle(e,t){let i=!1;return(...s)=>{i||(i=!0,setTimeout(()=>{e(...s),i=!1},t))}}static removePositioningStyles(e){const t=e.style;t.position&&t.removeProperty("position"),t.left&&t.removeProperty("left"),t.top&&t.removeProperty("top"),t.width&&t.removeProperty("width"),t.height&&t.removeProperty("height")}static getScrollElement(e){if(!e)return document.scrollingElement||document.documentElement;const t=getComputedStyle(e).overflowY;return("auto"===t||"scroll"===t)&&e.scrollHeight>e.clientHeight?e:i.getScrollElement(e.parentElement)}static updateScrollResize(e,t,s){const o=i.getScrollElement(t),n=o.clientHeight,r=o===i.getScrollElement()?0:o.getBoundingClientRect().top,a=e.clientY-r,h=a>n-s;a<s?o.scrollBy({behavior:"smooth",top:a-s}):h&&o.scrollBy({behavior:"smooth",top:s-(n-a)})}static clone(e){return null==e||"object"!=typeof e?e:e instanceof Array?[...e]:{...e}}static cloneDeep(e){const t=["parentGrid","el","grid","subGrid","engine"],s=i.clone(e);for(const o in s)s.hasOwnProperty(o)&&"object"==typeof s[o]&&"__"!==o.substring(0,2)&&!t.find(e=>e===o)&&(s[o]=i.cloneDeep(e[o]));return s}static cloneNode(e){const t=e.cloneNode(!0);return t.removeAttribute("id"),t}static appendTo(e,t){let s;s="string"==typeof t?i.getElement(t):t,s&&s.appendChild(e)}static addElStyles(e,t){if(t instanceof Object)for(const i in t)t.hasOwnProperty(i)&&(Array.isArray(t[i])?t[i].forEach(t=>{e.style[i]=t}):e.style[i]=t[i])}static initEvent(e,t){const i={type:t.type},s={button:0,which:0,buttons:1,bubbles:!0,cancelable:!0,target:t.target?t.target:e.target};return["altKey","ctrlKey","metaKey","shiftKey"].forEach(t=>i[t]=e[t]),["pageX","pageY","clientX","clientY","screenX","screenY"].forEach(t=>i[t]=e[t]),{...i,...s}}static simulateMouseEvent(e,t,i){const s=e,o=new MouseEvent(t,{bubbles:!0,composed:!0,cancelable:!0,view:window,detail:1,screenX:e.screenX,screenY:e.screenY,clientX:e.clientX,clientY:e.clientY,ctrlKey:s.ctrlKey??!1,altKey:s.altKey??!1,shiftKey:s.shiftKey??!1,metaKey:s.metaKey??!1,button:0,relatedTarget:e.target});(i||e.target).dispatchEvent(o)}static getValuesFromTransformedElement(e){const t=document.createElement("div");i.addElStyles(t,{opacity:"0",position:"fixed",top:"0px",left:"0px",width:"1px",height:"1px",zIndex:"-999999"}),e.appendChild(t);const s=t.getBoundingClientRect();return e.removeChild(t),t.remove(),{xScale:1/s.width,yScale:1/s.height,xOffset:s.left,yOffset:s.top}}static swap(e,t,i){if(!e)return;const s=e[t];e[t]=e[i],e[i]=s}static canBeRotated(e){return!(!e||e.w===e.h||e.locked||e.noResize||e.grid?.opts.disableResize||e.minW&&e.minW===e.maxW||e.minH&&e.minH===e.maxH)}}class s{constructor(e={}){this.addedNodes=[],this.removedNodes=[],this.defaultColumn=12,this.column=e.column||this.defaultColumn,this.column>this.defaultColumn&&(this.defaultColumn=this.column),this.maxRow=e.maxRow,this._float=e.float,this.nodes=e.nodes||[],this.onChange=e.onChange}batchUpdate(e=!0,t=!0){return!!this.batchMode===e||(this.batchMode=e,e?(this._prevFloat=this._float,this._float=!0,this.cleanNodes(),this.saveInitial()):(this._float=this._prevFloat,delete this._prevFloat,t&&this._packNodes(),this._notify())),this}_useEntireRowArea(e,t){return(!this.float||this.batchMode&&!this._prevFloat)&&!this._hasLocked&&(!e._moving||e._skipDown||t.y<=e.y)}_fixCollisions(e,t=e,s,o={}){if(this.sortNodes(-1),!(s=s||this.collide(e,t)))return!1;if(e._moving&&!o.nested&&!this.float&&this.swap(e,s))return!0;let n=t;!this._loading&&this._useEntireRowArea(e,t)&&(n={x:0,w:this.column,y:t.y,h:t.h},s=this.collide(e,n,o.skip));let r=!1;const a={nested:!0,pack:!1};let h=0;for(;s=s||this.collide(e,n,o.skip);){if(h++>2*this.nodes.length)throw new Error("Infinite collide check");let n;if(s.locked||this._loading||e._moving&&!e._skipDown&&t.y>e.y&&!this.float&&(!this.collide(s,{...s,y:e.y},e)||!this.collide(s,{...s,y:t.y-s.h},e))){e._skipDown=e._skipDown||t.y>e.y;const h={...t,y:s.y+s.h,...a};n=!(!this._loading||!i.samePos(e,h))||this.moveNode(e,h),(s.locked||this._loading)&&n?i.copyPos(t,e):!s.locked&&n&&o.pack&&(this._packNodes(),t.y=s.y+s.h,i.copyPos(e,t)),r=r||n}else n=this.moveNode(s,{...s,y:t.y+t.h,skip:e,...a});if(!n)return r;s=void 0}return r}collide(e,t=e,s){const o=e._id,n=s?._id;return this.nodes.find(e=>e._id!==o&&e._id!==n&&i.isIntercepted(e,t))}collideAll(e,t=e,s){const o=e._id,n=s?._id;return this.nodes.filter(e=>e._id!==o&&e._id!==n&&i.isIntercepted(e,t))}directionCollideCoverage(e,t,i){if(!t.rect||!e._rect)return;const s=e._rect,o={...t.rect};let n;o.y>s.y?(o.h+=o.y-s.y,o.y=s.y):o.h+=s.y-o.y,o.x>s.x?(o.w+=o.x-s.x,o.x=s.x):o.w+=s.x-o.x;let r=.5;for(let e of i){if(e.locked||!e._rect)break;const t=e._rect;let i=Number.MAX_VALUE,a=Number.MAX_VALUE;s.y<t.y?i=(o.y+o.h-t.y)/t.h:s.y+s.h>t.y+t.h&&(i=(t.y+t.h-o.y)/t.h),s.x<t.x?a=(o.x+o.w-t.x)/t.w:s.x+s.w>t.x+t.w&&(a=(t.x+t.w-o.x)/t.w);const h=Math.min(a,i);h>r&&(r=h,n=e)}return t.collide=n,n}cacheRects(e,t,i,s,o,n){return this.nodes.forEach(r=>r._rect={y:r.y*t+i,x:r.x*e+n,w:r.w*e-n-s,h:r.h*t-i-o}),this}swap(e,t){if(!t||t.locked||!e||e.locked)return!1;function s(){const i=t.x,s=t.y;return t.x=e.x,t.y=e.y,e.h!=t.h?(e.x=i,e.y=t.y+t.h):e.w!=t.w?(e.x=t.x+t.w,e.y=s):(e.x=i,e.y=s),e._dirty=t._dirty=!0,!0}let o;if(e.w===t.w&&e.h===t.h&&(e.x===t.x||e.y===t.y)&&(o=i.isTouching(e,t)))return s();if(!1!==o){if(e.w===t.w&&e.x===t.x&&(o||(o=i.isTouching(e,t)))){if(t.y<e.y){const i=e;e=t,t=i}return s()}if(!1!==o){if(e.h===t.h&&e.y===t.y&&(o||(o=i.isTouching(e,t)))){if(t.x<e.x){const i=e;e=t,t=i}return s()}return!1}}}isAreaEmpty(e,t,i,s){const o={x:e||0,y:t||0,w:i||1,h:s||1};return!this.collide(o)}compact(e="compact",t=!0){if(0===this.nodes.length)return this;t&&this.sortNodes();const i=this.batchMode;i||this.batchUpdate();const s=this._inColumnResize;s||(this._inColumnResize=!0);const o=this.nodes;return this.nodes=[],o.forEach((t,i,s)=>{let o;t.locked||(t.autoPosition=!0,"list"===e&&i&&(o=s[i-1])),this.addNode(t,!1,o)}),s||delete this._inColumnResize,i||this.batchUpdate(!1),this}set float(e){this._float!==e&&(this._float=e||!1,e||this._packNodes()._notify())}get float(){return this._float||!1}sortNodes(e=1){return this.nodes=i.sort(this.nodes,e),this}_packNodes(){return this.batchMode||(this.sortNodes(),this.float?this.nodes.forEach(e=>{if(e._updating||void 0===e._orig||e.y===e._orig.y)return;let t=e.y;for(;t>e._orig.y;)--t,this.collide(e,{x:e.x,y:t,w:e.w,h:e.h})||(e._dirty=!0,e.y=t)}):this.nodes.forEach((e,t)=>{if(!e.locked)for(;e.y>0;){const i=0===t?0:e.y-1;if(0!==t&&this.collide(e,{x:e.x,y:i,w:e.w,h:e.h}))break;e._dirty=e.y!==i,e.y=i}})),this}prepareNode(e,t){e._id=e._id??s._idSeq++;const o=e.id;if(o){let t=1;for(;this.nodes.find(t=>t.id===e.id&&t!==e);)e.id=o+"_"+t++}void 0!==e.x&&void 0!==e.y&&null!==e.x&&null!==e.y||(e.autoPosition=!0);const n={x:0,y:0,w:1,h:1};return i.defaults(e,n),e.autoPosition||delete e.autoPosition,e.noResize||delete e.noResize,e.noMove||delete e.noMove,i.sanitizeMinMax(e),"string"==typeof e.x&&(e.x=Number(e.x)),"string"==typeof e.y&&(e.y=Number(e.y)),"string"==typeof e.w&&(e.w=Number(e.w)),"string"==typeof e.h&&(e.h=Number(e.h)),isNaN(e.x)&&(e.x=n.x,e.autoPosition=!0),isNaN(e.y)&&(e.y=n.y,e.autoPosition=!0),isNaN(e.w)&&(e.w=n.w),isNaN(e.h)&&(e.h=n.h),this.nodeBoundFix(e,t),e}nodeBoundFix(e,t){const s=e._orig||i.copyPos({},e);if(e.maxW&&(e.w=Math.min(e.w||1,e.maxW)),e.maxH&&(e.h=Math.min(e.h||1,e.maxH)),e.minW&&(e.w=Math.max(e.w||1,e.minW)),e.minH&&(e.h=Math.max(e.h||1,e.minH)),(e.x||0)+(e.w||1)>this.column&&this.column<this.defaultColumn&&!this._inColumnResize&&!this.skipCacheUpdate&&null!=e._id&&-1===this.findCacheLayout(e,this.defaultColumn)){const t={...e};t.autoPosition||void 0===t.x?(delete t.x,delete t.y):t.x=Math.min(this.defaultColumn-1,t.x),t.w=Math.min(this.defaultColumn,t.w||1),this.cacheOneLayout(t,this.defaultColumn)}return e.w>this.column?e.w=this.column:e.w<1&&(e.w=1),this.maxRow&&e.h>this.maxRow?e.h=this.maxRow:e.h<1&&(e.h=1),e.x<0&&(e.x=0),e.y<0&&(e.y=0),e.x+e.w>this.column&&(t?e.w=this.column-e.x:e.x=this.column-e.w),this.maxRow&&e.y+e.h>this.maxRow&&(t?e.h=this.maxRow-e.y:e.y=this.maxRow-e.h),i.samePos(e,s)||(e._dirty=!0),this}getDirtyNodes(e){return e?this.nodes.filter(e=>e._dirty&&!i.samePos(e,e._orig)):this.nodes.filter(e=>e._dirty)}_notify(e){if(this.batchMode||!this.onChange)return this;const t=(e||[]).concat(this.getDirtyNodes());return this.onChange(t),this}cleanNodes(){return this.batchMode||this.nodes.forEach(e=>{delete e._dirty,delete e._lastTried}),this}saveInitial(){return this.nodes.forEach(e=>{e._orig=i.copyPos({},e),delete e._dirty}),this._hasLocked=this.nodes.some(e=>e.locked),this}restoreInitial(){return this.nodes.forEach(e=>{e._orig&&!i.samePos(e,e._orig)&&(i.copyPos(e,e._orig),e._dirty=!0)}),this._notify(),this}findEmptyPosition(e,t=this.nodes,s=this.column,o){let n=!1;for(let r=o?o.y*s+(o.x+o.w):0;!n;++r){const o=r%s,a=Math.floor(r/s);if(o+e.w>s)continue;const h={x:o,y:a,w:e.w,h:e.h};t.find(e=>i.isIntercepted(h,e))||(e.x===o&&e.y===a||(e._dirty=!0),e.x=o,e.y=a,delete e.autoPosition,n=!0)}return n}addNode(e,t=!1,i){const s=this.nodes.find(t=>t._id===e._id);if(s)return s;let o;return this._inColumnResize?this.nodeBoundFix(e):this.prepareNode(e),delete e._temporaryRemoved,delete e._removeDOM,e.autoPosition&&this.findEmptyPosition(e,this.nodes,this.column,i)&&(delete e.autoPosition,o=!0),this.nodes.push(e),t&&this.addedNodes.push(e),o||this._fixCollisions(e),this.batchMode||this._packNodes()._notify(),e}removeNode(e,t=!0,i=!1){return this.nodes.find(t=>t._id===e._id)?(i&&this.removedNodes.push(e),t&&(e._removeDOM=!0),this.nodes=this.nodes.filter(t=>t._id!==e._id),e._isAboutToRemove||this._packNodes(),this._notify([e]),this):this}removeAll(e=!0,t=!0){if(delete this._layouts,!this.nodes.length)return this;e&&this.nodes.forEach(e=>e._removeDOM=!0);const i=this.nodes;return this.removedNodes=t?i:[],this.nodes=[],this._notify(i)}moveNodeCheck(e,t){if(!this.changedPosConstrain(e,t))return!1;if(t.pack=!0,!this.maxRow)return this.moveNode(e,t);let o;const n=new s({column:this.column,float:this.float,nodes:this.nodes.map(t=>t._id===e._id?(o={...t},o):{...t})});if(!o)return!1;const r=n.moveNode(o,t)&&n.getRow()<=Math.max(this.getRow(),this.maxRow);if(!r&&!t.resizing&&t.collide){const i=t.collide.el.gridstackNode;if(this.swap(e,i))return this._notify(),!0}return!!r&&(n.nodes.filter(e=>e._dirty).forEach(e=>{const t=this.nodes.find(t=>t._id===e._id);t&&(i.copyPos(t,e),t._dirty=!0)}),this._notify(),!0)}willItFit(e){if(delete e._willFitPos,!this.maxRow)return!0;const t=new s({column:this.column,float:this.float,nodes:this.nodes.map(e=>({...e}))}),o={...e};return this.cleanupNode(o),delete o.el,delete o._id,delete o.content,delete o.grid,t.addNode(o),t.getRow()<=this.maxRow&&(e._willFitPos=i.copyPos({},o),!0)}changedPosConstrain(e,t){return t.w=t.w||e.w,t.h=t.h||e.h,e.x!==t.x||e.y!==t.y||(e.maxW&&(t.w=Math.min(t.w,e.maxW)),e.maxH&&(t.h=Math.min(t.h,e.maxH)),e.minW&&(t.w=Math.max(t.w,e.minW)),e.minH&&(t.h=Math.max(t.h,e.minH)),e.w!==t.w||e.h!==t.h)}moveNode(e,t){if(!e||!t)return!1;let s;void 0!==t.pack||this.batchMode||(s=t.pack=!0),"number"!=typeof t.x&&(t.x=e.x),"number"!=typeof t.y&&(t.y=e.y),"number"!=typeof t.w&&(t.w=e.w),"number"!=typeof t.h&&(t.h=e.h);const o=e.w!==t.w||e.h!==t.h,n=i.copyPos({},e,!0);if(i.copyPos(n,t),this.nodeBoundFix(n,o),i.copyPos(t,n),!t.forceCollide&&i.samePos(e,t))return!1;const r=i.copyPos({},e),a=this.collideAll(e,n,t.skip);let h=!0;if(a.length){const o=e._moving&&!t.nested;let r=o?this.directionCollideCoverage(e,t,a):a[0];if(o&&r&&e.grid?.opts?.subGridDynamic&&!e.grid._isTemp){const s=i.areaIntercept(t.rect,r._rect),o=i.area(t.rect),n=i.area(r._rect);s/(o<n?o:n)>.8&&(r.grid.makeSubGrid(r.el,void 0,e),r=void 0)}r?h=!this._fixCollisions(e,n,r,t):(h=!1,s&&delete t.pack)}return h&&!i.samePos(e,n)&&(e._dirty=!0,i.copyPos(e,n)),t.pack&&this._packNodes()._notify(),!i.samePos(e,r)}getRow(){return this.nodes.reduce((e,t)=>Math.max(e,t.y+t.h),0)}beginUpdate(e){return e._updating||(e._updating=!0,delete e._skipDown,this.batchMode||this.saveInitial()),this}endUpdate(){const e=this.nodes.find(e=>e._updating);return e&&(delete e._updating,delete e._skipDown),this}save(e=!0,t,s){const o=this._layouts?.length||0;let n;o&&(s?s!==this.column&&(n=this._layouts[s]):this.column!==o-1&&(n=this._layouts[o-1]));const r=[];return this.sortNodes(),this.nodes.forEach(s=>{const o=n?.find(e=>e._id===s._id),a={...s,...o||{}};i.removeInternalForSave(a,!e),t&&t(s,a),r.push(a)}),r}layoutsNodesChange(e){return!this._layouts||this._inColumnResize||this._layouts.forEach((t,i)=>{if(!t||i===this.column)return this;if(i<this.column)this._layouts[i]=void 0;else{const s=i/this.column;e.forEach(e=>{if(!e._orig)return;const i=t.find(t=>t._id===e._id);i&&(i.y>=0&&e.y!==e._orig.y&&(i.y+=e.y-e._orig.y,i.y<0&&(i.y=0)),e.x!==e._orig.x&&(i.x=Math.round(e.x*s),i.x<0&&(i.x=0)),e.w!==e._orig.w&&(i.w=Math.round(e.w*s),i.w<1&&(i.w=1)))})}}),this}columnChanged(e,t,s="moveScale"){if(!this.nodes.length||!t||e===t)return this;const o="compact"===s||"list"===s;o&&this.sortNodes(1),t<e&&this.cacheLayout(this.nodes,e),this.batchUpdate();let n=[],r=o?this.nodes:i.sort(this.nodes,-1);if(t>e&&this._layouts){const i=this._layouts[t]||[],s=this._layouts.length-1;!i.length&&e!==s&&this._layouts[s]?.length&&(e=s,this._layouts[s].forEach(e=>{const t=r.find(t=>t._id===e._id);t&&(o||e.autoPosition||(t.x=e.x??t.x,t.y=e.y??t.y),t.w=e.w??t.w,null!=e.x&&void 0!==e.y||(t.autoPosition=!0))})),i.forEach(e=>{const t=r.findIndex(t=>t._id===e._id);if(-1!==t){const i=r[t];if(o)return void(i.w=e.w);(e.autoPosition||isNaN(e.x)||isNaN(e.y))&&this.findEmptyPosition(e,n),e.autoPosition||(i.x=e.x??i.x,i.y=e.y??i.y,i.w=e.w??i.w,n.push(i)),r.splice(t,1)}})}if(o)this.compact(s,!1);else{if(r.length)if("function"==typeof s)s(t,e,n,r);else{const i=o||"none"===s?1:t/e,a="move"===s||"moveScale"===s,h="scale"===s||"moveScale"===s;r.forEach(s=>{s.x=1===t?0:a?Math.round(s.x*i):Math.min(s.x,t-1),s.w=1===t||1===e?1:h?Math.round(s.w*i)||1:Math.min(s.w,t),n.push(s)}),r=[]}n=i.sort(n,-1),this._inColumnResize=!0,this.nodes=[],n.forEach(e=>{this.addNode(e,!1),delete e._orig})}return this.nodes.forEach(e=>delete e._orig),this.batchUpdate(!1,!o),delete this._inColumnResize,this}cacheLayout(e,t,i=!1){const o=[];return e.forEach((e,t)=>{if(void 0===e._id){const t=e.id?this.nodes.find(t=>t.id===e.id):void 0;e._id=t?._id??s._idSeq++}o[t]={x:e.x,y:e.y,w:e.w,_id:e._id}}),this._layouts=i?[]:this._layouts||[],this._layouts[t]=o,this}cacheOneLayout(e,t){e._id=e._id??s._idSeq++;const i={x:e.x,y:e.y,w:e.w,_id:e._id};(e.autoPosition||void 0===e.x)&&(delete i.x,delete i.y,e.autoPosition&&(i.autoPosition=!0)),this._layouts=this._layouts||[],this._layouts[t]=this._layouts[t]||[];const o=this.findCacheLayout(e,t);return-1===o?this._layouts[t].push(i):this._layouts[t][o]=i,this}findCacheLayout(e,t){return this._layouts?.[t]?.findIndex(t=>t._id===e._id)??-1}removeNodeFromLayoutCache(e){if(this._layouts)for(let t=0;t<this._layouts.length;t++){const i=this.findCacheLayout(e,t);-1!==i&&this._layouts[t].splice(i,1)}}cleanupNode(e){for(const t in e)"_"===t[0]&&"_id"!==t&&delete e[t];return this}}s._idSeq=0;const o={alwaysShowResizeHandle:"mobile",animate:!0,auto:!0,cellHeight:"auto",cellHeightThrottle:100,cellHeightUnit:"px",column:12,draggable:{handle:".grid-stack-item-content",appendTo:"body",scroll:!0},handle:".grid-stack-item-content",itemClass:"grid-stack-item",margin:10,marginUnit:"px",maxRow:0,minRow:0,placeholderClass:"grid-stack-placeholder",placeholderText:"",removableOptions:{accept:"grid-stack-item",decline:"grid-stack-non-removable"},resizable:{handles:"se"},rtl:"auto"};class n{}const r="undefined"!=typeof window&&"undefined"!=typeof document&&("ontouchstart"in document||"ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch||navigator.maxTouchPoints>0||navigator.msMaxTouchPoints>0);class a{}function h(e,t){e.touches.length>1||(e.cancelable&&e.preventDefault(),i.simulateMouseEvent(e.changedTouches[0],t))}function l(e,t){e.cancelable&&e.preventDefault(),i.simulateMouseEvent(e,t)}function d(e){a.touchHandled||(a.touchHandled=!0,h(e,"mousedown"))}function c(e){a.touchHandled&&h(e,"mousemove")}function g(e){if(!a.touchHandled)return;a.pointerLeaveTimeout&&(window.clearTimeout(a.pointerLeaveTimeout),delete a.pointerLeaveTimeout);const t=!!n.dragElement;h(e,"mouseup"),t||h(e,"click"),a.touchHandled=!1}function u(e){"mouse"!==e.pointerType&&e.target.releasePointerCapture(e.pointerId)}function p(e){n.dragElement&&"mouse"!==e.pointerType&&l(e,"mouseenter")}function m(e){n.dragElement&&"mouse"!==e.pointerType&&(a.pointerLeaveTimeout=window.setTimeout(()=>{delete a.pointerLeaveTimeout,l(e,"mouseleave")},10))}class f{constructor(e,t,i){this.host=e,this.dir=t,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()}_init(){if(this.option.element)try{this.el=this.option.element instanceof HTMLElement?this.option.element:this.host.querySelector(this.option.element)}catch(e){this.option.element=void 0,console.error("Query for resizeable handle failed, falling back",e)}return this.el||(this.el=document.createElement("div"),this.host.appendChild(this.el)),this.el.classList.add("ui-resizable-handle"),this.el.classList.add(`${f.prefix}${this.dir}`),this.el.style.zIndex="100",this.el.style.userSelect="none",this.el.addEventListener("mousedown",this._mouseDown),r&&(this.el.addEventListener("touchstart",d),this.el.addEventListener("pointerdown",u)),this}destroy(){return this.moving&&this._mouseUp(this.mouseDownEvent),this.el.removeEventListener("mousedown",this._mouseDown),r&&(this.el.removeEventListener("touchstart",d),this.el.removeEventListener("pointerdown",u)),this.option.element||this.host.removeChild(this.el),delete this.el,delete this.host,this}_mouseDown(e){this.mouseDownEvent=e,document.addEventListener("mousemove",this._mouseMove,{capture:!0,passive:!0}),document.addEventListener("mouseup",this._mouseUp,!0),r&&(this.el.addEventListener("touchmove",c),this.el.addEventListener("touchend",g)),e.stopPropagation(),e.preventDefault()}_mouseMove(e){const t=this.mouseDownEvent;this.moving?this._triggerEvent("move",e):Math.abs(e.x-t.x)+Math.abs(e.y-t.y)>2&&(this.moving=!0,this._triggerEvent("start",this.mouseDownEvent),this._triggerEvent("move",e),document.addEventListener("keydown",this._keyEvent)),e.stopPropagation()}_mouseUp(e){this.moving&&(this._triggerEvent("stop",e),document.removeEventListener("keydown",this._keyEvent)),document.removeEventListener("mousemove",this._mouseMove,!0),document.removeEventListener("mouseup",this._mouseUp,!0),r&&(this.el.removeEventListener("touchmove",c),this.el.removeEventListener("touchend",g)),delete this.moving,delete this.mouseDownEvent,e.stopPropagation(),e.preventDefault()}_keyEvent(e){"Escape"===e.key&&(this.host.gridstackNode?.grid?.engine.restoreInitial(),this._mouseUp(this.mouseDownEvent))}_triggerEvent(e,t){return this.option[e]&&this.option[e](t),this}}f.prefix="ui-resizable-";class _{constructor(){this._eventRegister={}}get disabled(){return this._disabled}on(e,t){this._eventRegister[e]=t}off(e){delete this._eventRegister[e]}enable(){this._disabled=!1}disable(){this._disabled=!0}destroy(){delete this._eventRegister}triggerEvent(e,t){if(!this.disabled&&this._eventRegister&&this._eventRegister[e])return this._eventRegister[e](t)}}class v extends _{constructor(e,t={}){super(),this.el=e,this.option=t,this.rectScale={x:1,y:1},this._ui=()=>{const e=this.el.parentElement.getBoundingClientRect(),t={width:this.originalRect.width,height:this.originalRect.height+this.scrolled,left:this.originalRect.left,right:this.originalRect.right,top:this.originalRect.top-this.scrolled},i=this.temporalRect||t;return{position:{left:this.option.rtl?(e.right-i.right)*this.rectScale.x:(i.left-e.left)*this.rectScale.x,top:(i.top-e.top)*this.rectScale.y},size:{width:i.width*this.rectScale.x,height:i.height*this.rectScale.y}}},this._mouseOver=this._mouseOver.bind(this),this._mouseOut=this._mouseOut.bind(this),this.enable(),this._setupAutoHide(this.option.autoHide),this._setupHandlers()}on(e,t){super.on(e,t)}off(e){super.off(e)}enable(){super.enable(),this.el.classList.remove("ui-resizable-disabled"),this._setupAutoHide(this.option.autoHide)}disable(){super.disable(),this.el.classList.add("ui-resizable-disabled"),this._setupAutoHide(!1)}destroy(){this._removeHandlers(),this._setupAutoHide(!1),delete this.el,super.destroy()}updateOption(e){const t=e.handles&&e.handles!==this.option.handles,i=e.autoHide&&e.autoHide!==this.option.autoHide;return Object.keys(e).forEach(t=>this.option[t]=e[t]),t&&(this._removeHandlers(),this._setupHandlers()),i&&this._setupAutoHide(this.option.autoHide),this}_setupAutoHide(e){return e?(this.el.classList.add("ui-resizable-autohide"),this.el.addEventListener("mouseover",this._mouseOver),this.el.addEventListener("mouseout",this._mouseOut)):(this.el.classList.remove("ui-resizable-autohide"),this.el.removeEventListener("mouseover",this._mouseOver),this.el.removeEventListener("mouseout",this._mouseOut),n.overResizeElement===this&&delete n.overResizeElement),this}_mouseOver(e){n.overResizeElement||n.dragElement||(n.overResizeElement=this,this.el.classList.remove("ui-resizable-autohide"))}_mouseOut(e){n.overResizeElement===this&&(delete n.overResizeElement,this.el.classList.add("ui-resizable-autohide"))}_setupHandlers(){return this.handlers=this.option.handles.split(",").map(e=>e.trim()).map(e=>new f(this.el,e,{element:this.option.element,start:e=>this._resizeStart(e),stop:e=>this._resizeStop(e),move:t=>this._resizing(t,e)})),this}_resizeStart(e){this.sizeToContent=i.shouldSizeToContent(this.el.gridstackNode,!0),this.originalRect=this.el.getBoundingClientRect(),this.scrollEl=i.getScrollElement(this.el),this.scrollY=this.scrollEl.scrollTop,this.scrolled=0,this.startEvent=e,this._setupHelper(),this._applyChange();const t=i.initEvent(e,{type:"resizestart",target:this.el});return this.option.start&&this.option.start(t,this._ui()),this.el.classList.add("ui-resizable-resizing"),this.triggerEvent("resizestart",t),this}_resizing(e,t){this.scrolled=this.scrollEl.scrollTop-this.scrollY,this.temporalRect=this._getChange(e,t),this._applyChange();const s=i.initEvent(e,{type:"resize",target:this.el});return s.resizeDir=t,s.hasMovedX=this.option.rtl?t.includes("e"):t.includes("w"),s.hasMovedY=t.includes("n"),this.option.resize&&this.option.resize(s,this._ui()),this.triggerEvent("resize",s),this}_resizeStop(e){const t=i.initEvent(e,{type:"resizestop",target:this.el});return this._cleanHelper(),this.option.stop&&this.option.stop(t),this.el.classList.remove("ui-resizable-resizing"),this.triggerEvent("resizestop",t),delete this.startEvent,delete this.originalRect,delete this.temporalRect,delete this.scrollY,delete this.scrolled,this}_setupHelper(){this.elOriginStyleVal=v._originStyleProp.map(e=>this.el.style[e]),this.parentOriginStylePosition=this.el.parentElement.style.position;const e=this.el.parentElement,t=i.getValuesFromTransformedElement(e);return this.rectScale={x:t.xScale,y:t.yScale},getComputedStyle(this.el.parentElement).position.match(/static/)&&(this.el.parentElement.style.position="relative"),this.el.style.position="absolute",this.el.style.opacity="0.8",this}_cleanHelper(){return v._originStyleProp.forEach((e,t)=>{this.el.style[e]=this.elOriginStyleVal[t]||null}),this.el.parentElement.style.position=this.parentOriginStylePosition||null,this}_getChange(e,t){const i=this.startEvent,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},o=e.clientX-i.clientX,n=this.sizeToContent?0:e.clientY-i.clientY;let r,a;const h=this.option.rtl;!h&&t.indexOf("e")>-1?s.width+=o:h&&t.indexOf("w")>-1?s.width-=o:!h&&t.indexOf("w")>-1?(s.width-=o,s.left+=o,r=!0):h&&t.indexOf("e")>-1&&(s.width+=o,s.right+=o,r=!0),t.indexOf("s")>-1?s.height+=n:t.indexOf("n")>-1&&(s.height-=n,s.top+=n,a=!0);const l=this._constrainSize(s.width,s.height,r,a);return Math.round(s.width)!==Math.round(l.width)&&(!h&&t.indexOf("w")>-1?s.left+=s.width-l.width:h&&t.indexOf("e")>-1&&(s.right-=s.width-l.width),s.width=l.width),Math.round(s.height)!==Math.round(l.height)&&(t.indexOf("n")>-1&&(s.top+=s.height-l.height),s.height=l.height),s}_constrainSize(e,t,i,s){const o=this.option,n=(i?o.maxWidthMoveLeft:o.maxWidth)||Number.MAX_SAFE_INTEGER,r=o.minWidth/this.rectScale.x||e,a=(s?o.maxHeightMoveUp:o.maxHeight)||Number.MAX_SAFE_INTEGER,h=o.minHeight/this.rectScale.y||t;return{width:Math.min(n,Math.max(r,e)),height:Math.min(a,Math.max(h,t))}}_applyChange(){let e={left:0,right:0,top:0,width:0,height:0};if("absolute"===this.el.style.position){const t=this.el.parentElement,{left:i,right:s,top:o}=t.getBoundingClientRect();e={left:i,right:s,top:o,width:0,height:0}}return this.temporalRect?(Object.entries(this.temporalRect).forEach(([t,i])=>{if(this.option.rtl?"left"===t:"right"===t)return;const s="width"===t||"left"===t||"right"===t?this.rectScale.x:"height"===t||"top"===t?this.rectScale.y:1;let o;o="right"===t?(e.right-i)*this.rectScale.x+"px":(i-e[t])*s+"px",this.el.style[t]=o}),this):this}_removeHandlers(){return this.handlers.forEach(e=>e.destroy()),delete this.handlers,this}}v._originStyleProp=["width","height","position","left","right","top","opacity","zIndex"];class y extends _{constructor(e,t={}){super(),this.el=e,this.option=t,this.dragTransform={xScale:1,yScale:1,xOffset:0,yOffset:0},this._autoScrollTick=()=>{const e=this.helper,t=this._autoScrollContainer;if(!e||!t)return void this._stopScrolling();const i=this._getClipping(e,t);if(0===i)return void this._stopScrolling();if(!this._autoScrollMaxSpeed){const e=window.innerHeight||document.documentElement.clientHeight;this._autoScrollMaxSpeed=Math.max(e/150,4)}const s=Math.abs(i),o=Math.min(.5*s,this._autoScrollMaxSpeed),n=i>0?o:-o,r=t.scrollTop;t.scrollTop+=n,t.scrollTop!==r?(this.dragging&&this.lastDrag&&(this._dragFollow(this.lastDrag),this._callDrag(this.lastDrag)),this._autoScrollAnimId=requestAnimationFrame(this._autoScrollTick)):this._stopScrolling()};const i=t?.handle?.substring(1),s=e.gridstackNode;this.dragEls=!i||e.classList.contains(i)?[e]:s?.subGrid?[e.querySelector(t.handle)||e]:this.getAllHandles(),0===this.dragEls.length&&(this.dragEls=[e]),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()}getAllHandles(){return Array.from(this.el.querySelectorAll(this.option.handle)).filter(e=>{if(!(e instanceof HTMLElement))return!1;const t=e.closest(".grid-stack-item");return t===this.el||!t})}on(e,t){super.on(e,t)}off(e){super.off(e)}enable(){!1!==this.disabled&&(super.enable(),this.dragEls.forEach(e=>{e.addEventListener("mousedown",this._mouseDown),r&&(e.addEventListener("touchstart",d),e.addEventListener("pointerdown",u))}),this.el.classList.remove("ui-draggable-disabled"))}disable(e=!1){!0!==this.disabled&&(super.disable(),this.dragEls.forEach(e=>{e.removeEventListener("mousedown",this._mouseDown),r&&(e.removeEventListener("touchstart",d),e.removeEventListener("pointerdown",u))}),e||this.el.classList.add("ui-draggable-disabled"))}destroy(){this.dragTimeout&&window.clearTimeout(this.dragTimeout),delete this.dragTimeout,this.mouseDownEvent&&this._mouseUp(this.mouseDownEvent),this.disable(!0),delete this.el,delete this.helper,delete this.option,super.destroy()}updateOption(e){return Object.keys(e).forEach(t=>this.option[t]=e[t]),this}_mouseDown(e){if(a.touchHandled&&e.isTrusted&&(a.touchHandled=!1),!n.mouseHandled)return 0!==e.button||!this.dragEls.find(t=>t===e.target)&&e.target.closest('input,textarea,button,select,option,[contenteditable="true"],.ui-resizable-handle')||this.option.cancel&&e.target.closest(this.option.cancel)||(this.mouseDownEvent=e,delete this.dragging,delete n.dragElement,delete n.dropElement,delete this._autoScrollMaxSpeed,delete this._autoScrollContainer,document.addEventListener("mousemove",this._mouseMove,{capture:!0,passive:!0}),document.addEventListener("mouseup",this._mouseUp,!0),r&&(e.currentTarget.addEventListener("touchmove",c),e.currentTarget.addEventListener("touchend",g)),e.preventDefault(),document.activeElement&&document.activeElement.blur(),n.mouseHandled=!0),!0}_callDrag(e){if(!this.dragging)return;const t=i.initEvent(e,{target:this.el,type:"drag"});this.option.drag&&this.option.drag(t,this.ui()),this.triggerEvent("drag",t)}_mouseMove(e){const t=this.mouseDownEvent;if(this.lastDrag=e,this.dragging)if(this._dragFollow(e),n.pauseDrag){const t=Number.isInteger(n.pauseDrag)?n.pauseDrag:100;this.dragTimeout&&window.clearTimeout(this.dragTimeout),this.dragTimeout=window.setTimeout(()=>this._callDrag(e),t)}else this._callDrag(e);else if(Math.abs(e.x-t.x)+Math.abs(e.y-t.y)>3){this.dragging=!0,n.dragElement=this;const t=this.el.gridstackNode?.grid;t?n.dropElement=t.el.ddElement.ddDroppable:delete n.dropElement,this.helper=this._createHelper(),this._setupHelperContainmentStyle(),this.dragTransform=i.getValuesFromTransformedElement(this.helperContainment),this.dragOffset=this._getDragOffset(e,this.el,this.helperContainment),this._setupHelperStyle(e);const s=i.initEvent(e,{target:this.el,type:"dragstart"});this.option.start&&this.option.start(s,this.ui()),this.triggerEvent("dragstart",s),document.addEventListener("keydown",this._keyEvent)}return!0}_mouseUp(e){if(this._stopScrolling(),document.removeEventListener("mousemove",this._mouseMove,!0),document.removeEventListener("mouseup",this._mouseUp,!0),r&&e.currentTarget&&(e.currentTarget.removeEventListener("touchmove",c,!0),e.currentTarget.removeEventListener("touchend",g,!0)),this.dragging){delete this.dragging,delete this.el.gridstackNode?._origRotate,document.removeEventListener("keydown",this._keyEvent),n.dropElement?.el===this.el.parentElement&&delete n.dropElement,this.helperContainment.style.position=this.parentOriginStylePosition||null,this.helper!==this.el&&this.helper.remove(),this._removeHelperStyle();const t=i.initEvent(e,{target:this.el,type:"dragstop"});this.option.stop&&this.option.stop(t),this.triggerEvent("dragstop",t),n.dropElement&&n.dropElement.drop(e)}delete this.helper,delete this.mouseDownEvent,delete n.dragElement,delete n.dropElement,delete n.mouseHandled,e.preventDefault()}_keyEvent(e){const t=this.el.gridstackNode,s=t?.grid||n.dropElement?.el?.gridstack;if("Escape"===e.key)t&&t._origRotate&&(t._orig=t._origRotate,delete t._origRotate),s?.cancelDrag(),this._mouseUp(this.mouseDownEvent);else if(t&&s&&("r"===e.key||"R"===e.key)){if(!i.canBeRotated(t))return;t._origRotate=t._origRotate||{...t._orig},delete t._moving,s.setAnimation(!1).rotate(t.el,{top:-this.dragOffset.offsetTop,left:-this.dragOffset.offsetX}).setAnimation(),t._moving=!0,this.dragOffset=this._getDragOffset(this.lastDrag,t.el,this.helperContainment),this.helper.style.width=this.dragOffset.width+"px",this.helper.style.height=this.dragOffset.height+"px",i.swap(t._orig,"w","h"),delete t._rect,this._mouseMove(this.lastDrag)}}_createHelper(){let e=this.el;return"function"==typeof this.option.helper?e=this.option.helper(this.el):"clone"===this.option.helper&&(e=i.cloneNode(this.el)),e.parentElement||i.appendTo(e,"parent"===this.option.appendTo?this.el.parentElement:this.option.appendTo),this.dragElementOriginStyle=y.originStyleProp.map(e=>this.el.style[e]),e}_setupHelperStyle(e){this.helper.classList.add("ui-draggable-dragging"),this.el.gridstackNode?.grid?.el.classList.add("grid-stack-dragging");const t=this.helper.style;return t.pointerEvents="none",t.width=this.dragOffset.width+"px",t.height=this.dragOffset.height+"px",t.willChange="left, right, top",t.position="fixed",this._dragFollow(e),t.transition="none",setTimeout(()=>{this.helper&&(t.transition=null)},0),this}_removeHelperStyle(){this.helper.classList.remove("ui-draggable-dragging"),this.el.gridstackNode?.grid?.el.classList.remove("grid-stack-dragging");const e=this.helper?.gridstackNode;if(!e?._isAboutToRemove&&this.dragElementOriginStyle){const e=this.helper,t=this.dragElementOriginStyle.transition||null;e.style.transition=this.dragElementOriginStyle.transition="none",y.originStyleProp.forEach(t=>e.style[t]=this.dragElementOriginStyle[t]||null),setTimeout(()=>e.style.transition=t,50)}return delete this.dragElementOriginStyle,this}_dragFollow(e){const t=this.helper.style,i=this.dragOffset;this.option.rtl?(t.right=(window.innerWidth-e.clientX+i.offsetX)*this.dragTransform.xScale+"px",t.left&&(t.left="")):(t.left=(e.clientX+i.offsetX)*this.dragTransform.xScale+"px",t.right&&(t.right="")),t.top=(e.clientY+i.offsetTop)*this.dragTransform.yScale+"px"}_setupHelperContainmentStyle(){return this.helperContainment=this.helper.parentElement,"fixed"!==this.helper.style.position&&(this.parentOriginStylePosition=this.helperContainment.style.position,getComputedStyle(this.helperContainment).position.match(/static/)&&(this.helperContainment.style.position="relative")),this}_getDragOffset(e,t,i){let s=0,o=0;i&&(s=this.dragTransform.xOffset,o=this.dragTransform.yOffset);const n=t.getBoundingClientRect();let r=this.option.rtl?n.right:n.left,a=this.option.rtl?e.clientX-n.right+s:-e.clientX+n.left-s;return{x:r,top:n.top,offsetX:a,offsetTop:-e.clientY+n.top-o,width:n.width*this.dragTransform.xScale,height:n.height*this.dragTransform.yScale}}updateScrollPosition(e){this._autoScrollContainer=i.getScrollElement(e),0===this._getClipping(this.helper,this._autoScrollContainer)?this._stopScrolling():this._autoScrollAnimId||(this._autoScrollAnimId=requestAnimationFrame(this._autoScrollTick))}_getClipping(e,t){const i=e.getBoundingClientRect(),s=t.getBoundingClientRect(),o=window.innerHeight||document.documentElement.clientHeight;if(i.bottom<s.top||i.top>s.bottom)return 0;const n=i.bottom-Math.min(s.bottom,o),r=i.top-Math.max(s.top,0);return r<0?r:n>0?n:0}_stopScrolling(){this._autoScrollAnimId&&(cancelAnimationFrame(this._autoScrollAnimId),delete this._autoScrollAnimId)}ui(){const e=this.el.parentElement.getBoundingClientRect(),t=this.helper.getBoundingClientRect(),i=this.option.rtl?(e.right-t.right)*this.dragTransform.xScale:(t.left-e.left)*this.dragTransform.xScale;return{position:{top:(t.top-e.top)*this.dragTransform.yScale,left:i}}}}y.originStyleProp=["width","height","transform","transform-origin","transition","pointerEvents","position","left","right","top","minWidth","willChange"];class b extends _{constructor(e,t={}){super(),this.el=e,this.option=t,this._mouseEnter=this._mouseEnter.bind(this),this._mouseLeave=this._mouseLeave.bind(this),this.enable(),this._setupAccept()}on(e,t){super.on(e,t)}off(e){super.off(e)}enable(){!1!==this.disabled&&(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),r&&(this.el.addEventListener("pointerenter",p),this.el.addEventListener("pointerleave",m)))}disable(e=!1){!0!==this.disabled&&(super.disable(),this.el.classList.remove("ui-droppable"),e||this.el.classList.add("ui-droppable-disabled"),this.el.removeEventListener("mouseenter",this._mouseEnter),this.el.removeEventListener("mouseleave",this._mouseLeave),r&&(this.el.removeEventListener("pointerenter",p),this.el.removeEventListener("pointerleave",m)))}destroy(){this.disable(!0),this.el.classList.remove("ui-droppable"),this.el.classList.remove("ui-droppable-disabled"),super.destroy()}updateOption(e){return Object.keys(e).forEach(t=>this.option[t]=e[t]),this._setupAccept(),this}_mouseEnter(e){if(!n.dragElement)return;if(a.touchHandled&&e.isTrusted)return;if(!this._canDrop(n.dragElement.el))return;e.preventDefault(),e.stopPropagation(),n.dragElement._stopScrolling(),n.dropElement&&n.dropElement!==this&&n.dropElement._mouseLeave(e,!0),n.dropElement=this;const t=i.initEvent(e,{target:this.el,type:"dropover"});this.option.over&&this.option.over(t,this._ui(n.dragElement)),this.triggerEvent("dropover",t),this.el.classList.add("ui-droppable-over")}_mouseLeave(e,t=!1){if(!n.dragElement||n.dropElement!==this)return;e.preventDefault(),e.stopPropagation(),t&&n.dragElement._stopScrolling();const s=i.initEvent(e,{target:this.el,type:"dropout"});if(this.option.out&&this.option.out(s,this._ui(n.dragElement)),this.triggerEvent("dropout",s),n.dropElement===this&&(delete n.dropElement,!t)){let t,i=this.el.parentElement;for(;!t&&i;)t=i.ddElement?.ddDroppable,i=i.parentElement;t&&t._mouseEnter(e)}}drop(e){e.preventDefault();const t=i.initEvent(e,{target:this.el,type:"drop"});this.option.drop&&this.option.drop(t,this._ui(n.dragElement)),this.triggerEvent("drop",t)}_canDrop(e){return e&&(!this.accept||this.accept(e))}_setupAccept(){return this.option.accept?("string"==typeof this.option.accept?this.accept=e=>e.classList.contains(this.option.accept)||e.matches(this.option.accept):this.accept=this.option.accept,this):this}_ui(e){return{draggable:e.el,...e.ui()}}}class w{static init(e){return e.ddElement||(e.ddElement=new w(e)),e.ddElement}constructor(e){this.el=e}on(e,t){return this.ddDraggable&&["drag","dragstart","dragstop"].indexOf(e)>-1?this.ddDraggable.on(e,t):this.ddDroppable&&["drop","dropover","dropout"].indexOf(e)>-1?this.ddDroppable.on(e,t):this.ddResizable&&["resizestart","resize","resizestop"].indexOf(e)>-1&&this.ddResizable.on(e,t),this}off(e){return this.ddDraggable&&["drag","dragstart","dragstop"].indexOf(e)>-1?this.ddDraggable.off(e):this.ddDroppable&&["drop","dropover","dropout"].indexOf(e)>-1?this.ddDroppable.off(e):this.ddResizable&&["resizestart","resize","resizestop"].indexOf(e)>-1&&this.ddResizable.off(e),this}setupDraggable(e){return this.ddDraggable?this.ddDraggable.updateOption(e):this.ddDraggable=new y(this.el,e),this}cleanDraggable(){return this.ddDraggable&&(this.ddDraggable.destroy(),delete this.ddDraggable),this}setupResizable(e){return this.ddResizable?this.ddResizable.updateOption(e):this.ddResizable=new v(this.el,e),this}cleanResizable(){return this.ddResizable&&(this.ddResizable.destroy(),delete this.ddResizable),this}setupDroppable(e){return this.ddDroppable?this.ddDroppable.updateOption(e):this.ddDroppable=new b(this.el,e),this}cleanDroppable(){return this.ddDroppable&&(this.ddDroppable.destroy(),delete this.ddDroppable),this}}const E=new class{resizable(e,t,i,s){return this._getDDElements(e,t).forEach(e=>{if("disable"===t||"enable"===t)e.ddResizable&&e.ddResizable[t]();else if("destroy"===t)e.ddResizable&&e.cleanResizable();else if("option"===t)e.setupResizable({[i]:s});else{const i=e.el.gridstackNode.grid;let s=e.el.getAttribute("gs-resize-handles")||i.opts.resizable.handles||"e,s,se";"all"===s&&(s="n,e,s,w,se,sw,ne,nw");const o=!i.opts.alwaysShowResizeHandle;e.setupResizable({...i.opts.resizable,handles:s,autoHide:o,start:t.start,stop:t.stop,resize:t.resize,rtl:t.rtl})}}),this}draggable(e,t,i,s){return this._getDDElements(e,t).forEach(e=>{if("disable"===t||"enable"===t)e.ddDraggable&&e.ddDraggable[t]();else if("destroy"===t)e.ddDraggable&&e.cleanDraggable();else if("option"===t)e.setupDraggable({[i]:s});else{const i=e.el.gridstackNode.grid;e.setupDraggable({...i.opts.draggable,start:t.start,stop:t.stop,drag:t.drag,rtl:t.rtl})}}),this}dragIn(e,t){return this._getDDElements(e).forEach(e=>e.setupDraggable(t)),this}droppable(e,t,i,s){return"function"!=typeof t.accept||t._accept||(t._accept=t.accept,t.accept=e=>t._accept(e)),this._getDDElements(e,t).forEach(e=>{"disable"===t||"enable"===t?e.ddDroppable&&e.ddDroppable[t]():"destroy"===t?e.ddDroppable&&e.cleanDroppable():"option"===t?e.setupDroppable({[i]:s}):e.setupDroppable(t)}),this}isDroppable(e){return!(!e?.ddElement?.ddDroppable||e.ddElement.ddDroppable.disabled)}isDraggable(e){return!(!e?.ddElement?.ddDraggable||e.ddElement.ddDraggable.disabled)}isResizable(e){return!(!e?.ddElement?.ddResizable||e.ddElement.ddResizable.disabled)}on(e,t,i){return this._getDDElements(e).forEach(e=>e.on(t,e=>{i(e,n.dragElement?n.dragElement.el:e.target,n.dragElement?n.dragElement.helper:null)})),this}off(e,t){return this._getDDElements(e).forEach(e=>e.off(t)),this}_getDDElements(e,t){const s=e.gridstack||"destroy"!==t&&"disable"!==t,o=i.getElements(e);return o.length?o.map(e=>e.ddElement||(s?w.init(e):null)).filter(e=>e):[]}};class x{static init(e={},t=".grid-stack"){if("undefined"==typeof document)return null;const s=x.getGridElement(t);return s?(s.gridstack||(s.gridstack=new x(s,i.cloneDeep(e))),s.gridstack):("string"==typeof t?console.error('GridStack.initAll() no grid was found with selector "'+t+'" - element missing or wrong selector ?\nNote: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.'):console.error("GridStack.init() no grid element was passed."),null)}static initAll(e={},t=".grid-stack"){const s=[];return"undefined"==typeof document||(x.getGridElements(t).forEach(t=>{t.gridstack||(t.gridstack=new x(t,i.cloneDeep(e))),s.push(t.gridstack)}),0===s.length&&console.error('GridStack.initAll() no grid was found with selector "'+t+'" - element missing or wrong selector ?\nNote: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.')),s}static addGrid(e,t={}){if(!e)return null;let s=e;if(s.gridstack){const e=s.gridstack;return t&&(e.opts={...e.opts,...t}),void 0!==t.children&&e.load(t.children),e}return e.classList.contains("grid-stack")&&!x.addRemoveCB||(s=x.addRemoveCB?x.addRemoveCB(e,t,!0,!0):i.createDiv(["grid-stack",t.class],e)),x.init(t,s)}static registerEngine(e){x.engineClass=e}get placeholder(){if(!this._placeholder){this._placeholder=i.createDiv([this.opts.placeholderClass,o.itemClass,this.opts.itemClass]);const e=i.createDiv(["placeholder-content"],this._placeholder);this.opts.placeholderText&&(e.textContent=this.opts.placeholderText)}return this._placeholder}constructor(e,t={}){this.el=e,this.opts=t,this.animationDelay=310,this._gsEventHandler={},this._extraDragRow=0,this.dragTransform={xScale:1,yScale:1,xOffset:0,yOffset:0},e.gridstack=this,this.opts=t=t||{},e.classList.contains("grid-stack")||this.el.classList.add("grid-stack"),t.row&&(t.minRow=t.maxRow=t.row,delete t.row);const a=i.toNumber(e.getAttribute("gs-row"));"auto"===t.column&&delete t.column,void 0!==t.alwaysShowResizeHandle&&(t._alwaysShowResizeHandle=t.alwaysShowResizeHandle);const h=t.columnOpts;if(h){const e=h.breakpoints;h.columnWidth||e?.length?(h.columnMax=h.columnMax||12,e?.length>1&&e.sort((e,t)=>(t.w||0)-(e.w||0))):delete t.columnOpts}const l={...i.cloneDeep(o),column:i.toNumber(e.getAttribute("gs-column"))||o.column,minRow:a||i.toNumber(e.getAttribute("gs-min-row"))||o.minRow,maxRow:a||i.toNumber(e.getAttribute("gs-max-row"))||o.maxRow,staticGrid:i.toBool(e.getAttribute("gs-static"))||o.staticGrid,sizeToContent:i.toBool(e.getAttribute("gs-size-to-content"))||void 0,draggable:{handle:(t.handleClass?"."+t.handleClass:t.handle?t.handle:"")||o.draggable.handle},removableOptions:{accept:t.itemClass||o.removableOptions.accept,decline:o.removableOptions.decline}};e.getAttribute("gs-animate")&&(l.animate=i.toBool(e.getAttribute("gs-animate"))),t=i.defaults(t,l),this._initMargin(),this.checkDynamicColumn(),this._updateColumnVar(t),"auto"===t.rtl&&(t.rtl="rtl"===e.style.direction),t.rtl&&this.el.classList.add("grid-stack-rtl");const d=this.el.closest("."+o.itemClass),c=d?.gridstackNode;if(c&&(c.subGrid=this,this.parentGridNode=c,this.el.classList.add("grid-stack-nested"),c.el.classList.add("grid-stack-sub-grid")),this._isAutoCellHeight="auto"===t.cellHeight,this._isAutoCellHeight||"initial"===t.cellHeight)this.cellHeight(void 0);else{"number"==typeof t.cellHeight&&t.cellHeightUnit&&t.cellHeightUnit!==o.cellHeightUnit&&(t.cellHeight=t.cellHeight+t.cellHeightUnit,delete t.cellHeightUnit);const e=t.cellHeight;delete t.cellHeight,this.cellHeight(e)}"mobile"===t.alwaysShowResizeHandle&&(t.alwaysShowResizeHandle=r),this._setStaticClass();const g=t.engineClass||x.engineClass||s;if(this.engine=new g({column:this.getColumn(),float:t.float,maxRow:t.maxRow,onChange:e=>{e.forEach(e=>{const t=e.el;t&&(e._removeDOM?(t&&t.remove(),delete e._removeDOM):this._writePosAttr(t,e))}),this._updateContainerHeight()}}),t.auto&&(this.batchUpdate(),this.engine._loading=!0,this.getGridItems().forEach(e=>this._prepareElement(e)),delete this.engine._loading,this.batchUpdate(!1)),t.children){const e=t.children;delete t.children,e.length&&this.load(e)}this.setAnimation(),t.subGridDynamic&&!n.pauseDrag&&(n.pauseDrag=!0),void 0!==t.draggable?.pause&&(n.pauseDrag=t.draggable.pause),this._setupRemoveDrop(),this._setupAcceptWidget(),this._updateResizeEvent()}_updateColumnVar(e=this.opts){this.el.classList.add("gs-"+e.column),"number"==typeof e.column&&this.el.style.setProperty("--gs-column-width",100/e.column+"%")}addWidget(e){if(!e)return;if("string"==typeof e)return void console.error("V11: GridStack.addWidget() does not support string anymore. see #2736");if(e.ELEMENT_NODE)return console.error("V11: GridStack.addWidget() does not support HTMLElement anymore. use makeWidget()"),this.makeWidget(e);let t,s=e;if(s.grid=this,t=s.el?s.el:x.addRemoveCB?x.addRemoveCB(this.el,e,!0,!1):this.createWidgetDivs(s),!t)return;if(s=t.gridstackNode,s&&t.parentElement===this.el&&this.engine.nodes.find(e=>e._id===s._id))return t;const o=this._readAttr(t);return i.defaults(e,o),this.engine.prepareNode(e),this.el.appendChild(t),this.makeWidget(t,e),t}createWidgetDivs(e){const t=i.createDiv(["grid-stack-item",this.opts.itemClass]),s=i.createDiv(["grid-stack-item-content"],t);return i.lazyLoad(e)?e.visibleObservable||(e.visibleObservable=new IntersectionObserver(([t])=>{t.isIntersecting&&(e.visibleObservable?.disconnect(),delete e.visibleObservable,x.renderCB(s,e),e.grid?.prepareDragDrop(e.el))}),window.setTimeout(()=>e.visibleObservable?.observe(t))):x.renderCB(s,e),t}makeSubGrid(e,t,s,o=!0){let n,r=e.gridstackNode;if(r||(r=this.makeWidget(e).gridstackNode),r.subGrid?.el)return r.subGrid;let a,h=this;for(;h&&!n;)n=h.opts?.subGridOpts,h=h.parentGridNode?.grid;t=i.cloneDeep({...this.opts,id:void 0,children:void 0,column:"auto",columnOpts:void 0,layout:"list",subGridOpts:void 0,...n||{},...t||r.subGridOpts||{}}),r.subGridOpts=t,"auto"===t.column&&(a=!0,t.column=Math.max(r.w||1,s?.w||1),delete t.columnOpts);let l,d,c=r.el.querySelector(".grid-stack-item-content");if(o&&(this._removeDD(r.el),d={...r,x:0,y:0},i.removeInternalForSave(d),delete d.subGridOpts,r.content&&(d.content=r.content,delete r.content),x.addRemoveCB?l=x.addRemoveCB(this.el,d,!0,!1):(l=i.createDiv(["grid-stack-item"]),l.appendChild(c),c=i.createDiv(["grid-stack-item-content"],r.el)),this.prepareDragDrop(r.el)),s){const e=a?t.column:r.w,i=r.h+s.h,o=r.el.style;o.transition="none",this.update(r.el,{w:e,h:i}),setTimeout(()=>o.transition=null)}const g=r.subGrid=x.addGrid(c,t);return s?._moving&&(g._isTemp=!0),a&&(g._autoColumn=!0),o&&g.makeWidget(l,d),s&&(s._moving?window.setTimeout(()=>i.simulateMouseEvent(s._event,"mouseenter",g.el),0):g.makeWidget(r.el,r)),this.resizeToContentCheck(!1,r),g}removeAsSubGrid(e){const t=this.parentGridNode?.grid;t&&(t.batchUpdate(),t.removeWidget(this.parentGridNode.el,!0,!0),this.engine.nodes.forEach(e=>{e.x+=this.parentGridNode.x,e.y+=this.parentGridNode.y,t.makeWidget(e.el,e)}),t.batchUpdate(!1),this.parentGridNode&&delete this.parentGridNode.subGrid,delete this.parentGridNode,e&&window.setTimeout(()=>i.simulateMouseEvent(e._event,"mouseenter",t.el),0))}save(e=!0,t=!1,s=x.saveCB,n){const r=this.engine.save(e,s,n);if(r.forEach(i=>{if(e&&i.el&&!i.subGrid&&!s){const e=i.el.querySelector(".grid-stack-item-content");i.content=e?.innerHTML,i.content||delete i.content}else if(e||s||delete i.content,i.subGrid?.el){const o=i.w||i.subGrid.getColumn(),n=i.subGrid.save(e,t,s,o);i.subGridOpts=t?n:{children:n},delete i.subGrid}delete i.el}),t){const e=i.cloneDeep(this.opts);e.marginBottom===e.marginTop&&e.marginRight===e.marginLeft&&e.marginTop===e.marginRight&&(e.margin=e.marginTop,delete e.marginTop,delete e.marginRight,delete e.marginBottom,delete e.marginLeft),e.rtl===("rtl"===this.el.style.direction)&&(e.rtl="auto"),this._isAutoCellHeight&&(e.cellHeight="auto"),this._autoColumn&&(e.column="auto");const t=e._alwaysShowResizeHandle;return delete e._alwaysShowResizeHandle,void 0!==t?e.alwaysShowResizeHandle=t:delete e.alwaysShowResizeHandle,i.removeInternalAndSame(e,o),e.children=r,e}return r}load(e,t=x.addRemoveCB||!0){e.forEach(e=>{e.w=e.w||e.minW||1,e.h=e.h||e.minH||1}),e=i.sort(e),this.engine.skipCacheUpdate=this._ignoreLayoutsNodeChange=!0;let s=0;e.forEach(e=>{s=Math.max(s,(e.x||0)+e.w)}),s>this.engine.defaultColumn&&(this.engine.defaultColumn=s);const o=this.getColumn();s>o&&(0===this.engine.nodes.length&&this.responseLayout?(this.engine.nodes=e,this.engine.columnChanged(s,o,this.responseLayout),e=this.engine.nodes,this.engine.nodes=[],delete this.responseLayout):this.engine.cacheLayout(e,s,!0));const n=x.addRemoveCB;"function"==typeof t&&(x.addRemoveCB=t);const r=[];this.batchUpdate();const a=!this.engine.nodes.length,h=a&&this.opts.animate;h&&this.setAnimation(!1),!a&&t&&[...this.engine.nodes].forEach(t=>{t.id&&(i.find(e,t.id)||(x.addRemoveCB&&x.addRemoveCB(this.el,t,!1,!1),r.push(t),this.removeWidget(t.el,!0,!1)))}),this.engine._loading=!0;const l=[];return this.engine.nodes=this.engine.nodes.filter(t=>!i.find(e,t.id)||(l.push(t),!1)),e.forEach(e=>{const s=i.find(l,e.id);if(s){if(i.shouldSizeToContent(s)&&(e.h=s.h),this.engine.nodeBoundFix(e),(e.autoPosition||void 0===e.x||void 0===e.y)&&(e.w=e.w||s.w,e.h=e.h||s.h,this.engine.findEmptyPosition(e)),this.engine.nodes.push(s),i.samePos(s,e)&&this.engine.nodes.length>1&&(this.moveNode(s,{...e,forceCollide:!0}),i.copyPos(e,s)),this.update(s.el,e),e.subGridOpts?.children){const t=s.el.querySelector(".grid-stack");t&&t.gridstack&&t.gridstack.load(e.subGridOpts.children)}}else t&&this.addWidget(e)}),delete this.engine._loading,this.engine.removedNodes=r,this.batchUpdate(!1),delete this._ignoreLayoutsNodeChange,delete this.engine.skipCacheUpdate,n?x.addRemoveCB=n:delete x.addRemoveCB,h&&this.setAnimation(!0,!0),this}batchUpdate(e=!0){return this.engine.batchUpdate(e),e||(this._updateContainerHeight(),this._triggerRemoveEvent(),this._triggerAddEvent(),this._triggerChangeEvent()),this}getCellHeight(e=!1){if(this.opts.cellHeight&&"auto"!==this.opts.cellHeight&&(!e||!this.opts.cellHeightUnit||"px"===this.opts.cellHeightUnit))return this.opts.cellHeight;if("rem"===this.opts.cellHeightUnit)return this.opts.cellHeight*parseFloat(getComputedStyle(document.documentElement).fontSize);if("em"===this.opts.cellHeightUnit)return this.opts.cellHeight*parseFloat(getComputedStyle(this.el).fontSize);if("cm"===this.opts.cellHeightUnit)return this.opts.cellHeight*(96/2.54);if("mm"===this.opts.cellHeightUnit)return this.opts.cellHeight*(96/2.54)/10;const t=this.el.querySelector("."+this.opts.itemClass);if(t){const e=i.toNumber(t.getAttribute("gs-h"))||1;return Math.round(t.offsetHeight/e)}const s=parseInt(this.el.getAttribute("gs-current-row"));return s?Math.round(this.el.getBoundingClientRect().height/s):this.opts.cellHeight}cellHeight(e){if(void 0!==e&&this._isAutoCellHeight!==("auto"===e)&&(this._isAutoCellHeight="auto"===e,this._updateResizeEvent()),"initial"!==e&&"auto"!==e||(e=void 0),void 0===e){const t=-this.opts.marginRight-this.opts.marginLeft+this.opts.marginTop+this.opts.marginBottom;e=this.cellWidth()+t}const t=i.parseHeight(e);return this.opts.cellHeightUnit===t.unit&&this.opts.cellHeight===t.h||(this.opts.cellHeightUnit=t.unit,this.opts.cellHeight=t.h,this.el.style.setProperty("--gs-cell-height",`${this.opts.cellHeight}${this.opts.cellHeightUnit}`),this._updateContainerHeight(),this.resizeToContentCheck()),this}cellWidth(){return this._widthOrContainer()/this.getColumn()}_widthOrContainer(e=!1){return e&&this.opts.columnOpts?.breakpointForWindow?window.innerWidth:this.el.clientWidth||this.el.parentElement.clientWidth||window.innerWidth}checkDynamicColumn(){const e=this.opts.columnOpts;if(!e||!e.columnWidth&&!e.breakpoints?.length)return!1;const t=this.getColumn();let i=t;const s=this._widthOrContainer(!0);if(e.columnWidth)i=Math.min(Math.round(s/e.columnWidth)||1,e.columnMax);else{i=e.columnMax;let o=0;for(;o<e.breakpoints.length&&s<=e.breakpoints[o].w;)i=e.breakpoints[o++].c||t}if(i!==t){const t=e.breakpoints?.find(e=>e.c===i);return this.column(i,t?.layout||e.layout),!0}return!1}compact(e="compact",t=!0){return this.engine.compact(e,t),this._triggerChangeEvent(),this}column(e,t="moveScale"){if(!e||e<1||this.opts.column===e)return this;const i=this.getColumn();return this.opts.column=e,this.engine?(this.engine.column=e,this.el.classList.remove("gs-"+i),this._updateColumnVar(),this.engine.columnChanged(i,e,t),this._isAutoCellHeight&&this.cellHeight(),this.resizeToContentCheck(!0),this._ignoreLayoutsNodeChange=!0,this._triggerChangeEvent(),delete this._ignoreLayoutsNodeChange,this):(this.responseLayout=t,this)}getColumn(){return this.opts.column}getGridItems(){return Array.from(this.el.children).filter(e=>e.matches("."+this.opts.itemClass)&&!e.matches("."+this.opts.placeholderClass))}isIgnoreChangeCB(){return this._ignoreLayoutsNodeChange}destroy(e=!0){if(this.el)return this.offAll(),this._updateResizeEvent(!0),this.setStatic(!0,!1),this.setAnimation(!1),e?this.el.parentNode.removeChild(this.el):(this.removeAll(e),this.el.removeAttribute("gs-current-row")),this.parentGridNode&&delete this.parentGridNode.subGrid,delete this.parentGridNode,delete this.opts,delete this._placeholder?.gridstackNode,delete this._placeholder,delete this.engine,delete this.el.gridstack,delete this.el,this}float(e){return this.opts.float!==e&&(this.opts.float=this.engine.float=e,this._triggerChangeEvent()),this}getFloat(){return this.engine.float}getCellFromPixel(e,t=!1){const i=this.el.getBoundingClientRect();let s;s=t?{top:i.top+document.documentElement.scrollTop,left:i.left}:{top:this.el.offsetTop,left:this.el.offsetLeft};const o=e.left-s.left,n=e.top-s.top,r=i.width/this.getColumn(),a=i.height/parseInt(this.el.getAttribute("gs-current-row"));return{x:Math.floor(o/r),y:Math.floor(n/a)}}getRow(){return Math.max(this.engine.getRow(),this.opts.minRow||0)}isAreaEmpty(e,t,i,s){return this.engine.isAreaEmpty(e,t,i,s)}makeWidget(e,t){const i=x.getElement(e);if(!i||i.gridstackNode)return i;i.parentElement||this.el.appendChild(i),this._prepareElement(i,!0,t);const s=i.gridstackNode;let o;return this._updateContainerHeight(),s.subGridOpts&&this.makeSubGrid(i,s.subGridOpts,void 0,!1),1!==this.opts.column||this._ignoreLayoutsNodeChange||(o=this._ignoreLayoutsNodeChange=!0),this._triggerAddEvent(),this._triggerChangeEvent(),o&&delete this._ignoreLayoutsNodeChange,i}on(e,t){if(-1!==e.indexOf(" "))return e.split(" ").forEach(e=>this.on(e,t)),this;if("change"===e||"added"===e||"removed"===e||"enable"===e||"disable"===e){const i="enable"===e||"disable"===e;this._gsEventHandler[e]=i?e=>t(e):e=>{e.detail&&t(e,e.detail)},this.el.addEventListener(e,this._gsEventHandler[e])}else"drag"===e||"dragstart"===e||"dragstop"===e||"resizestart"===e||"resize"===e||"resizestop"===e||"dropped"===e||"resizecontent"===e?this._gsEventHandler[e]=t:console.error("GridStack.on("+e+") event not supported");return this}off(e){return-1!==e.indexOf(" ")?(e.split(" ").forEach(e=>this.off(e)),this):("change"!==e&&"added"!==e&&"removed"!==e&&"enable"!==e&&"disable"!==e||this._gsEventHandler[e]&&this.el.removeEventListener(e,this._gsEventHandler[e]),delete this._gsEventHandler[e],this)}offAll(){return Object.keys(this._gsEventHandler).forEach(e=>this.off(e)),this}removeWidget(e,t=!0,i=!0){return e?(x.getElements(e).forEach(e=>{if(e.parentElement&&e.parentElement!==this.el)return;let s=e.gridstackNode;s||(s=this.engine.nodes.find(t=>e===t.el)),s&&(t&&x.addRemoveCB&&x.addRemoveCB(this.el,s,!1,!1),delete e.gridstackNode,this._removeDD(e),this.engine.removeNode(s,t,i),t&&e.parentElement&&e.remove())}),i&&(this._triggerRemoveEvent(),this._triggerChangeEvent()),this):(console.error("Error: GridStack.removeWidget(undefined) called"),this)}removeAll(e=!0,t=!0){return this.engine.nodes.forEach(t=>{e&&x.addRemoveCB&&x.addRemoveCB(this.el,t,!1,!1),delete t.el.gridstackNode,this.opts.staticGrid||this._removeDD(t.el)}),this.engine.removeAll(e,t),t&&this._triggerRemoveEvent(),this}setAnimation(e=this.opts.animate,t){return t?setTimeout(()=>{this.opts&&this.setAnimation(e)}):e?this.el.classList.add("grid-stack-animate"):this.el.classList.remove("grid-stack-animate"),this.opts.animate=e,this}hasAnimationCSS(){return this.el.classList.contains("grid-stack-animate")}setStatic(e,t=!0,i=!0){return!!this.opts.staticGrid===e||(e?this.opts.staticGrid=!0:delete this.opts.staticGrid,this._setupRemoveDrop(),this._setupAcceptWidget(),this.engine.nodes.forEach(s=>{this.prepareDragDrop(s.el),s.subGrid&&i&&s.subGrid.setStatic(e,t,i)}),t&&this._setStaticClass()),this}updateOptions(e){const t=this.opts;if(e===t)return this;if(void 0!==e.acceptWidgets&&(t.acceptWidgets=e.acceptWidgets,this._setupAcceptWidget()),void 0!==e.animate&&this.setAnimation(e.animate),e.cellHeight&&this.cellHeight(e.cellHeight),void 0!==e.class&&e.class!==t.class&&(t.class&&this.el.classList.remove(t.class),e.class&&this.el.classList.add(e.class)),e.columnOpts){const t=!!this.opts.columnOpts;this.opts.columnOpts=e.columnOpts,t!==!!this.opts.columnOpts&&this._updateResizeEvent(),this.checkDynamicColumn()}else null===e.columnOpts&&this.opts.columnOpts?(delete this.opts.columnOpts,this._updateResizeEvent()):"number"==typeof e.column&&this.column(e.column);return void 0!==e.margin&&this.margin(e.margin),void 0!==e.staticGrid&&this.setStatic(e.staticGrid),void 0===e.disableDrag||e.staticGrid||this.enableMove(!e.disableDrag),void 0===e.disableResize||e.staticGrid||this.enableResize(!e.disableResize),void 0!==e.float&&this.float(e.float),void 0!==e.row?(t.minRow=t.maxRow=t.row=e.row,this._updateContainerHeight()):(void 0!==e.minRow&&(t.minRow=e.minRow,this._updateContainerHeight()),void 0!==e.maxRow&&(t.maxRow=this.engine.maxRow=e.maxRow)),void 0!==e.lazyLoad&&(t.lazyLoad=e.lazyLoad),e.children?.length&&this.load(e.children),this}update(e,t){return x.getElements(e).forEach(e=>{const s=e?.gridstackNode;if(!s)return;const o={...i.copyPos({},s),...i.cloneDeep(t)};this.engine.nodeBoundFix(o),delete o.autoPosition;const n=["x","y","w","h"];let r;if(n.some(e=>void 0!==o[e]&&o[e]!==s[e])&&(r={},n.forEach(e=>{r[e]=void 0!==o[e]?o[e]:s[e],delete o[e]})),!r&&(o.minW||o.minH||o.maxW||o.maxH)&&(r={}),void 0!==o.content){const t=e.querySelector(".grid-stack-item-content");t&&t.textContent!==o.content&&(s.content=o.content,x.renderCB(t,o),s.subGrid?.el&&(t.appendChild(s.subGrid.el),s.subGrid._updateContainerHeight())),delete o.content}let a=!1,h=!1;for(const e in o)"_"!==e[0]&&s[e]!==o[e]&&(s[e]=o[e],a=!0,h=h||!this.opts.staticGrid&&("noResize"===e||"noMove"===e||"locked"===e));if(i.sanitizeMinMax(s),r){const e=void 0!==r.w&&r.w!==s.w;this.moveNode(s,r),e&&s.subGrid?s.subGrid.onResize(this.hasAnimationCSS()?s.w:void 0):this.resizeToContentCheck(e,s),delete s._orig}(r||a)&&this._writeAttr(e,s),h&&this.prepareDragDrop(s.el),x.updateCB&&x.updateCB(s)}),this}moveNode(e,t){const i=e._updating;i||this.engine.cleanNodes().beginUpdate(e),this.engine.moveNode(e,t),this._updateContainerHeight(),i||(this._triggerChangeEvent(),this.engine.endUpdate())}resizeToContent(e){if(!e)return;if(e.classList.remove("size-to-content-max"),!e.clientHeight)return;const t=e.gridstackNode;if(!t)return;const i=t.grid;if(!i||e.parentElement!==i.el)return;const s=i.getCellHeight(!0);if(!s)return;let o,n=t.h?t.h*s:e.clientHeight;if(t.resizeToContentParent&&(o=e.querySelector(t.resizeToContentParent)),o||(o=e.querySelector(x.resizeToContentParent)),!o)return;const r=e.clientHeight-o.clientHeight,a=t.h?t.h*s-r:o.clientHeight;let h;if(t.subGrid){h=t.subGrid.getRow()*t.subGrid.getCellHeight(!0);const i=t.subGrid.el.getBoundingClientRect(),s=e.getBoundingClientRect();h+=i.top-s.top}else{if(t.subGridOpts?.children?.length)return;{const e=o.firstElementChild;if(!e)return void console.error(`Error: GridStack.resizeToContent() widget id:${t.id} '${x.resizeToContentParent}'.firstElementChild is null, make sure to have a div like container. Skipping sizing.`);h=e.getBoundingClientRect().height||a}}if(a===h)return;n+=h-a;let l=Math.ceil(n/s);const d=Number.isInteger(t.sizeToContent)?t.sizeToContent:0;d&&l>d&&(l=d,e.classList.add("size-to-content-max")),t.minH&&l<t.minH?l=t.minH:t.maxH&&l>t.maxH&&(l=t.maxH),l!==t.h&&(i._ignoreLayoutsNodeChange=!0,i.moveNode(t,{h:l}),delete i._ignoreLayoutsNodeChange)}resizeToContentCBCheck(e){x.resizeToContentCB?x.resizeToContentCB(e):this.resizeToContent(e)}rotate(e,t){return x.getElements(e).forEach(e=>{const s=e.gridstackNode;if(!i.canBeRotated(s))return;const o={w:s.h,h:s.w,minH:s.minW,minW:s.minH,maxH:s.maxW,maxW:s.maxH};if(t){const e=t.left>0?Math.floor(t.left/this.cellWidth()):0,i=t.top>0?Math.floor(t.top/this.opts.cellHeight):0;o.x=s.x+e-(s.h-(i+1)),o.y=s.y+i-e}Object.keys(o).forEach(e=>{void 0===o[e]&&delete o[e]});const n=s._orig;this.update(e,o),s._orig=n}),this}margin(e){if(!("string"==typeof e&&e.split(" ").length>1)){const t=i.parseHeight(e);if(this.opts.marginUnit===t.unit&&this.opts.margin===t.h)return}return this.opts.margin=e,this.opts.marginTop=this.opts.marginBottom=this.opts.marginLeft=this.opts.marginRight=void 0,this._initMargin(),this}getMargin(){return this.opts.margin}willItFit(e){return this.engine.willItFit(e)}_triggerChangeEvent(){if(this.engine.batchMode)return this;const e=this.engine.getDirtyNodes(!0);return e&&e.length&&(this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(e),this._triggerEvent("change",e)),this.engine.saveInitial(),this}_triggerAddEvent(){if(this.engine.batchMode)return this;if(this.engine.addedNodes?.length){this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(this.engine.addedNodes),this.engine.addedNodes.forEach(e=>{delete e._dirty});const e=[...this.engine.addedNodes];this.engine.addedNodes=[],this._triggerEvent("added",e)}return this}_triggerRemoveEvent(){if(this.engine.batchMode)return this;if(this.engine.removedNodes?.length){const e=[...this.engine.removedNodes];this.engine.removedNodes=[],this._triggerEvent("removed",e)}return this}_triggerEvent(e,t){const i=t?new CustomEvent(e,{bubbles:!1,detail:t}):new Event(e);let s=this;for(;s.parentGridNode;)s=s.parentGridNode.grid;return s.el.dispatchEvent(i),this}_updateContainerHeight(){if(!this.engine||this.engine.batchMode)return this;const e=this.parentGridNode;let t=this.getRow()+this._extraDragRow;const s=this.opts.cellHeight,o=this.opts.cellHeightUnit;if(!s)return this;if(!e&&!this.opts.minRow){const e=i.parseHeight(getComputedStyle(this.el).minHeight);if(e.h>0&&e.unit===o){const i=Math.floor(e.h/s);t<i&&(t=i)}}return this.el.setAttribute("gs-current-row",String(t)),this.el.style.removeProperty("min-height"),this.el.style.removeProperty("height"),t&&(this.el.style[e?"minHeight":"height"]=t*s+o),e&&i.shouldSizeToContent(e)&&e.grid.resizeToContentCBCheck(e.el),this}_prepareElement(e,t=!1,s){s=s||this._readAttr(e),e.gridstackNode=s,s.el=e,s.grid=this,s=this.engine.addNode(s,t),this._writeAttr(e,s),e.classList.add(o.itemClass,this.opts.itemClass);const n=i.shouldSizeToContent(s);return n?e.classList.add("size-to-content"):e.classList.remove("size-to-content"),n&&this.resizeToContentCheck(!1,s),i.lazyLoad(s)||this.prepareDragDrop(s.el),this}_writePosAttr(e,t){if(!t._moving&&!t._resizing||this._placeholder===e){const i=this.opts.rtl?"right":"left";e.style.top=t.y?1===t.y?"var(--gs-cell-height)":`calc(${t.y} * var(--gs-cell-height))`:null,e.style[i]=t.x?1===t.x?"var(--gs-column-width)":`calc(${t.x} * var(--gs-column-width))`:null,e.style.width=t.w>1?`calc(${t.w} * var(--gs-column-width))`:null,e.style.height=t.h>1?`calc(${t.h} * var(--gs-cell-height))`:null}return e.setAttribute("gs-x",String(t.x)),e.setAttribute("gs-y",String(t.y)),t.w>1?e.setAttribute("gs-w",String(t.w)):e.removeAttribute("gs-w"),t.h>1?e.setAttribute("gs-h",String(t.h)):e.removeAttribute("gs-h"),this}_writeAttr(e,t){if(!t)return this;this._writePosAttr(e,t);const i={noResize:"gs-no-resize",noMove:"gs-no-move",locked:"gs-locked",id:"gs-id",sizeToContent:"gs-size-to-content"};for(const s in i)t[s]?e.setAttribute(i[s],String(t[s])):e.removeAttribute(i[s]);return this}_readAttr(e,t=!0){const s={};s.x=i.toNumber(e.getAttribute("gs-x")),s.y=i.toNumber(e.getAttribute("gs-y")),s.w=i.toNumber(e.getAttribute("gs-w")),s.h=i.toNumber(e.getAttribute("gs-h")),s.autoPosition=i.toBool(e.getAttribute("gs-auto-position")),s.noResize=i.toBool(e.getAttribute("gs-no-resize")),s.noMove=i.toBool(e.getAttribute("gs-no-move")),s.locked=i.toBool(e.getAttribute("gs-locked"));const o=e.getAttribute("gs-size-to-content");o&&(s.sizeToContent="true"===o||"false"===o?i.toBool(o):parseInt(o,10)),s.id=e.getAttribute("gs-id"),s.maxW=i.toNumber(e.getAttribute("gs-max-w")),s.minW=i.toNumber(e.getAttribute("gs-min-w")),s.maxH=i.toNumber(e.getAttribute("gs-max-h")),s.minH=i.toNumber(e.getAttribute("gs-min-h")),t&&(1===s.w&&e.removeAttribute("gs-w"),1===s.h&&e.removeAttribute("gs-h"),s.maxW&&e.removeAttribute("gs-max-w"),s.minW&&e.removeAttribute("gs-min-w"),s.maxH&&e.removeAttribute("gs-max-h"),s.minH&&e.removeAttribute("gs-min-h"));for(const e in s){if(!s.hasOwnProperty(e))return;s[e]||0===s[e]||"sizeToContent"===e||delete s[e]}return s}_setStaticClass(){const e=["grid-stack-static"];return this.opts.staticGrid?(this.el.classList.add(...e),this.el.setAttribute("gs-static","true")):(this.el.classList.remove(...e),this.el.removeAttribute("gs-static")),this}onResize(e=this.el?.clientWidth){if(!e)return;if(this.prevWidth===e)return;this.prevWidth=e,this.batchUpdate();let t=!1;return this._autoColumn&&this.parentGridNode?this.opts.column!==this.parentGridNode.w&&(this.column(this.parentGridNode.w,this.opts.layout||"list"),t=!0):t=this.checkDynamicColumn(),this._isAutoCellHeight&&this.cellHeight(),this.engine.nodes.forEach(e=>{e.subGrid&&e.subGrid.onResize()}),this._skipInitialResize||this.resizeToContentCheck(t),delete this._skipInitialResize,this.batchUpdate(!1),this}resizeToContentCheck(e=!1,t=void 0){if(this.engine){if(e&&this.hasAnimationCSS())return setTimeout(()=>this.resizeToContentCheck(!1,t),this.animationDelay);if(t)i.shouldSizeToContent(t)&&this.resizeToContentCBCheck(t.el);else if(this.engine.nodes.some(e=>i.shouldSizeToContent(e))){const e=[...this.engine.nodes];this.batchUpdate(),e.forEach(e=>{i.shouldSizeToContent(e)&&this.resizeToContentCBCheck(e.el)}),this._ignoreLayoutsNodeChange=!0,this.batchUpdate(!1),this._ignoreLayoutsNodeChange=!1}this._gsEventHandler.resizecontent&&this._gsEventHandler.resizecontent(null,t?[t]:this.engine.nodes)}}_updateResizeEvent(e=!1){const t=!this.parentGridNode&&(this._isAutoCellHeight||this.opts.sizeToContent||this.opts.columnOpts||this.engine.nodes.find(e=>e.sizeToContent));return e||!t||this.resizeObserver?!e&&t||!this.resizeObserver||(this.resizeObserver.disconnect(),delete this.resizeObserver,delete this._sizeThrottle):(this._sizeThrottle=i.throttle(()=>this.onResize(),this.opts.cellHeightThrottle),this.resizeObserver=new ResizeObserver(()=>this._sizeThrottle()),this.resizeObserver.observe(this.el),this._skipInitialResize=!0),this}static getElement(e=".grid-stack-item"){return i.getElement(e)}static getElements(e=".grid-stack-item"){return i.getElements(e)}static getGridElement(e){return x.getElement(e)}static getGridElements(e){return i.getElements(e)}_initMargin(){let e,t=0,s=[];"string"==typeof this.opts.margin&&(s=this.opts.margin.split(" ")),2===s.length?(this.opts.marginTop=this.opts.marginBottom=s[0],this.opts.marginLeft=this.opts.marginRight=s[1]):4===s.length?(this.opts.marginTop=s[0],this.opts.marginRight=s[1],this.opts.marginBottom=s[2],this.opts.marginLeft=s[3]):(e=i.parseHeight(this.opts.margin),this.opts.marginUnit=e.unit,t=this.opts.margin=e.h),["marginTop","marginRight","marginBottom","marginLeft"].forEach(s=>{void 0===this.opts[s]?this.opts[s]=t:(e=i.parseHeight(this.opts[s]),this.opts[s]=e.h,delete this.opts.margin)}),this.opts.marginUnit=e.unit,this.opts.marginTop===this.opts.marginBottom&&this.opts.marginLeft===this.opts.marginRight&&this.opts.marginTop===this.opts.marginRight&&(this.opts.margin=this.opts.marginTop);const o=this.el.style;return o.setProperty("--gs-item-margin-top",`${this.opts.marginTop}${this.opts.marginUnit}`),o.setProperty("--gs-item-margin-bottom",`${this.opts.marginBottom}${this.opts.marginUnit}`),o.setProperty("--gs-item-margin-right",`${this.opts.marginRight}${this.opts.marginUnit}`),o.setProperty("--gs-item-margin-left",`${this.opts.marginLeft}${this.opts.marginUnit}`),this}static getDD(){return E}static setupDragIn(e,t,s,o=document){void 0!==t?.pause&&(n.pauseDrag=t.pause),t={appendTo:"body",helper:"clone",...t||{}},("string"==typeof e?i.getElements(e,o):e).forEach((e,i)=>{E.isDraggable(e)||E.dragIn(e,t),s?.[i]&&(e.gridstackNode=s[i])})}movable(e,t){return this.opts.staticGrid||x.getElements(e).forEach(e=>{const i=e.gridstackNode;i&&(t?delete i.noMove:i.noMove=!0,this.prepareDragDrop(i.el))}),this}resizable(e,t){return this.opts.staticGrid||x.getElements(e).forEach(e=>{const i=e.gridstackNode;i&&(t?delete i.noResize:i.noResize=!0,this.prepareDragDrop(i.el))}),this}disable(e=!0){if(!this.opts.staticGrid)return this.enableMove(!1,e),this.enableResize(!1,e),this._triggerEvent("disable"),this}enable(e=!0){if(!this.opts.staticGrid)return this.enableMove(!0,e),this.enableResize(!0,e),this._triggerEvent("enable"),this}enableMove(e,t=!0){return this.opts.staticGrid||(e?delete this.opts.disableDrag:this.opts.disableDrag=!0,this.engine.nodes.forEach(i=>{this.prepareDragDrop(i.el),i.subGrid&&t&&i.subGrid.enableMove(e,t)})),this}enableResize(e,t=!0){return this.opts.staticGrid||(e?delete this.opts.disableResize:this.opts.disableResize=!0,this.engine.nodes.forEach(i=>{this.prepareDragDrop(i.el),i.subGrid&&t&&i.subGrid.enableResize(e,t)})),this}cancelDrag(){const e=this._placeholder?.gridstackNode;e&&(e._isExternal?(e._isAboutToRemove=!0,this.engine.removeNode(e)):e._isAboutToRemove&&x._itemRemoving(e.el,!1),this.engine.restoreInitial())}_removeDD(e){return E.draggable(e,"destroy").resizable(e,"destroy"),e.gridstackNode&&delete e.gridstackNode._initDD,delete e.ddElement,this}_setupAcceptWidget(){if(this.opts.staticGrid||!this.opts.acceptWidgets&&!this.opts.removable)return E.droppable(this.el,"destroy"),this;let e,t;const s=(s,o,n)=>{const r=(n=n||o).gridstackNode;if(!r)return;if(!r.grid?.el){n.style.transform=`scale(${1/this.dragTransform.xScale},${1/this.dragTransform.yScale})`;const e=n.getBoundingClientRect();n.style.left=e.x+(this.dragTransform.xScale-1)*(s.clientX-e.x)/this.dragTransform.xScale+"px",n.style.top=e.y+(this.dragTransform.yScale-1)*(s.clientY-e.y)/this.dragTransform.yScale+"px",n.style.transformOrigin="0px 0px"}let{top:a,left:h}=n.getBoundingClientRect();const l=this.el.getBoundingClientRect();h-=l.left,a-=l.top;const d={position:{top:a*this.dragTransform.xScale,left:h*this.dragTransform.yScale}};if(r._temporaryRemoved){if(r.x=Math.max(0,Math.round(h/t)),r.y=Math.max(0,Math.round(a/e)),delete r.autoPosition,this.engine.nodeBoundFix(r),!this.engine.willItFit(r)){if(r.autoPosition=!0,!this.engine.willItFit(r))return void E.off(o,"drag");r._willFitPos&&(i.copyPos(r,r._willFitPos),delete r._willFitPos)}this._onStartMoving(n,s,d,r,t,e)}else this._dragOrResize(n,s,d,r,t,e)};return E.droppable(this.el,{accept:e=>{const t=e.gridstackNode||this._readAttr(e,!1);if(t?.grid===this)return!0;if(!this.opts.acceptWidgets)return!1;let i=!0;if("function"==typeof this.opts.acceptWidgets)i=this.opts.acceptWidgets(e);else{const t=!0===this.opts.acceptWidgets?".grid-stack-item":this.opts.acceptWidgets;i=e.matches(t)}if(i&&t&&this.opts.maxRow){const e={w:t.w,h:t.h,minW:t.minW,minH:t.minH};i=this.engine.willItFit(e)}return i}}).on(this.el,"dropover",(i,o,n)=>{let r=n?.gridstackNode||o.gridstackNode;if(r?.grid===this&&!r._temporaryRemoved)return!1;if(r?._sidebarOrig&&(r.w=r._sidebarOrig.w,r.h=r._sidebarOrig.h),r?.grid&&r.grid!==this&&!r._temporaryRemoved&&r.grid._leave(o,n),n=n||o,t=this.cellWidth(),e=this.getCellHeight(!0),!r){const e=n.getAttribute("data-gs-widget")||n.getAttribute("gridstacknode");if(e){try{r=JSON.parse(e)}catch(t){console.error("Gridstack dropover: Bad JSON format: ",e)}n.removeAttribute("data-gs-widget"),n.removeAttribute("gridstacknode")}r||(r=this._readAttr(n)),r._sidebarOrig={w:r.w,h:r.h}}r.grid||(r.el||(r={...r}),r._isExternal=!0,n.gridstackNode=r);const a=r.w||Math.round(n.offsetWidth/t)||1,h=r.h||Math.round(n.offsetHeight/e)||1;return r.grid&&r.grid!==this?(o._gridstackNodeOrig||(o._gridstackNodeOrig=r),o.gridstackNode=r={...r,w:a,h,grid:this},delete r.x,delete r.y,this.engine.cleanupNode(r).nodeBoundFix(r),r._initDD=r._isExternal=r._temporaryRemoved=!0):(r.w=a,r.h=h,r._temporaryRemoved=!0),x._itemRemoving(r.el,!1),E.on(o,"drag",s),s(i,o,n),!1}).on(this.el,"dropout",(e,t,i)=>{const s=i?.gridstackNode||t.gridstackNode;return!!s&&(s.grid&&s.grid!==this||(this._leave(t,i),this._isTemp&&this.removeAsSubGrid(s)),!1)}).on(this.el,"drop",(e,t,s)=>{const o=s?.gridstackNode||t.gridstackNode;if(o?.grid===this&&!o._isExternal)return!1;const n=!!this.placeholder.parentElement,r=t!==s;this.placeholder.remove(),delete this.placeholder.gridstackNode,n&&this.opts.animate&&(this.setAnimation(!1),this.setAnimation(!0,!0));const a=t._gridstackNodeOrig;if(delete t._gridstackNodeOrig,n&&a?.grid&&a.grid!==this){const e=a.grid;e.engine.removeNodeFromLayoutCache(a),e.engine.removedNodes.push(a),e._triggerRemoveEvent()._triggerChangeEvent(),e.parentGridNode&&!e.engine.nodes.length&&e.opts.subGridDynamic&&e.removeAsSubGrid()}if(!o)return!1;if(n&&(this.engine.cleanupNode(o),o.grid=this),delete o.grid?._isTemp,E.off(t,"drag"),s!==t?(s.remove(),t=s):t.remove(),this._removeDD(t),!n)return!1;const h=o.subGrid?.el?.gridstack;return i.copyPos(o,this._readAttr(this.placeholder)),i.removePositioningStyles(t),r&&(o.content||o.subGridOpts||x.addRemoveCB)?(delete o.el,t=this.addWidget(o)):(this._prepareElement(t,!0,o),this.el.appendChild(t),this.resizeToContentCheck(!1,o),h&&(h.parentGridNode=o),this._updateContainerHeight()),this.engine.addedNodes.push(o),this._triggerAddEvent(),this._triggerChangeEvent(),this.engine.endUpdate(),this._gsEventHandler.dropped&&this._gsEventHandler.dropped({...e,type:"dropped"},a&&a.grid?a:void 0,o),!1}),this}static _itemRemoving(e,t){if(!e)return;const i=e?e.gridstackNode:void 0;i?.grid&&!e.classList.contains(i.grid.opts.removableOptions.decline)&&(t?i._isAboutToRemove=!0:delete i._isAboutToRemove,t?e.classList.add("grid-stack-item-removing"):e.classList.remove("grid-stack-item-removing"))}_setupRemoveDrop(){if("string"!=typeof this.opts.removable)return this;const e=document.querySelector(this.opts.removable);return e?(this.opts.staticGrid||E.isDroppable(e)||E.droppable(e,this.opts.removableOptions).on(e,"dropover",(e,t)=>x._itemRemoving(t,!0)).on(e,"dropout",(e,t)=>x._itemRemoving(t,!1)),this):this}prepareDragDrop(e,t=!1){const s=e?.gridstackNode;if(!s)return;const o=s.noMove||this.opts.disableDrag,n=s.noResize||this.opts.disableResize,r=this.opts.staticGrid||o&&n;if((t||r)&&(s._initDD&&(this._removeDD(e),delete s._initDD),r))return e.classList.add("ui-draggable-disabled","ui-resizable-disabled"),this;if(!s._initDD){let t,o;const n=(i,n)=>{this.triggerEvent(i,i.target),t=this.cellWidth(),o=this.getCellHeight(!0),this._onStartMoving(e,i,n,s,t,o)},r=(i,n)=>{this._dragOrResize(e,i,n,s,t,o)},a=t=>{this.placeholder.remove(),delete this.placeholder.gridstackNode,delete s._moving,delete s._resizing,delete s._event,delete s._lastTried;const o=s.w!==s._orig.w,n=t.target;if(n.gridstackNode&&n.gridstackNode.grid===this){if(s.el=n,s._isAboutToRemove){const i=e.gridstackNode.grid;i._gsEventHandler[t.type]&&i._gsEventHandler[t.type](t,n),i.engine.nodes.push(s),i.removeWidget(e,!0,!0)}else i.removePositioningStyles(n),s._temporaryRemoved?(this._writePosAttr(n,s),this.engine.addNode(s)):this._writePosAttr(n,s),this.triggerEvent(t,n);this._extraDragRow=0,this._updateContainerHeight(),this._triggerChangeEvent(),this.engine.endUpdate(),"resizestop"===t.type&&(Number.isInteger(s.sizeToContent)&&(s.sizeToContent=s.h),this.resizeToContentCheck(o,s))}};E.draggable(e,{start:n,stop:a,drag:r,rtl:this.opts.rtl}).resizable(e,{start:n,stop:a,resize:r,rtl:this.opts.rtl}),s._initDD=!0}return E.draggable(e,o?"disable":"enable").resizable(e,n?"disable":"enable"),this}_onStartMoving(e,t,s,o,n,r){if(this.engine.cleanNodes().beginUpdate(o),this._writePosAttr(this.placeholder,o),this.el.appendChild(this.placeholder),this.placeholder.gridstackNode=o,o.grid?.el)this.dragTransform=i.getValuesFromTransformedElement(e);else if(this.placeholder&&this.placeholder.closest(".grid-stack")){const e=this.placeholder.closest(".grid-stack");this.dragTransform=i.getValuesFromTransformedElement(e)}else this.dragTransform={xScale:1,xOffset:0,yScale:1,yOffset:0};if(o.el=this.placeholder,o._lastUiPosition=s.position,o._prevYPix=s.position.top,o._moving="dragstart"===t.type,o._resizing="resizestart"===t.type,delete o._lastTried,"dropover"===t.type&&o._temporaryRemoved&&(this.engine.addNode(o),o._moving=!0),this.engine.cacheRects(n,r,this.opts.marginTop,this.opts.marginRight,this.opts.marginBottom,this.opts.marginLeft),"resizestart"===t.type){const t=this.getColumn()-o.x,i=(this.opts.maxRow||Number.MAX_SAFE_INTEGER)-o.y;E.resizable(e,"option","minWidth",n*Math.min(o.minW||1,t)).resizable(e,"option","minHeight",r*Math.min(o.minH||1,i)).resizable(e,"option","maxWidth",n*Math.min(o.maxW||Number.MAX_SAFE_INTEGER,t)).resizable(e,"option","maxWidthMoveLeft",n*Math.min(o.maxW||Number.MAX_SAFE_INTEGER,o.x+o.w)).resizable(e,"option","maxHeight",r*Math.min(o.maxH||Number.MAX_SAFE_INTEGER,i)).resizable(e,"option","maxHeightMoveUp",r*Math.min(o.maxH||Number.MAX_SAFE_INTEGER,o.y+o.h))}}_dragOrResize(e,t,s,o,r,a){const h={...o._orig};let l,d=this.opts.marginLeft,c=this.opts.marginRight,g=this.opts.marginTop,u=this.opts.marginBottom;const p=Math.round(.1*a),m=Math.round(.1*r);if(d=Math.min(d,m),c=Math.min(c,m),g=Math.min(g,p),u=Math.min(u,p),"drag"===t.type){if(o._temporaryRemoved)return;o._prevYPix=s.position.top,!1!==this.opts.draggable.scroll&&n.dragElement?.updateScrollPosition(this.el);const e=s.position.left+(s.position.left>o._lastUiPosition.left?-c:d),t=s.position.top+(s.position.top>o._lastUiPosition.top?-u:g);h.x=Math.round(e/r),h.y=Math.round(t/a);const i=this._extraDragRow;if(this.engine.collide(o,h)){const e=this.getRow();let t=Math.max(0,h.y+o.h-e);this.opts.maxRow&&e+t>this.opts.maxRow&&(t=Math.max(0,this.opts.maxRow-e)),this._extraDragRow=t}else this._extraDragRow=0;if(this._extraDragRow!==i&&this._updateContainerHeight(),o.x===h.x&&o.y===h.y)return}else if("resize"===t.type){if(h.x<0)return;if(i.updateScrollResize(t,e,a),h.w=Math.round((s.size.width-d)/r),h.h=Math.round((s.size.height-g)/a),o.w===h.w&&o.h===h.h)return;if(o._lastTried&&o._lastTried.w===h.w&&o._lastTried.h===h.h)return;if(t.hasMovedX){const e=s.position.left+d;h.x=Math.round(e/r)}if(t.hasMovedY){const e=s.position.top+g;h.y=Math.round(e/a)}l=!0}o._event=t,o._lastTried=h;const f={x:s.position.left+d,y:s.position.top+g,w:(s.size?s.size.width:o.w*r)-d-c,h:(s.size?s.size.height:o.h*a)-g-u};if(this.engine.moveNodeCheck(o,{...h,cellWidth:r,cellHeight:a,rect:f,resizing:l})){o._lastUiPosition=s.position,this.engine.cacheRects(r,a,g,c,u,d),delete o._skipDown,l&&o.subGrid&&o.subGrid.onResize(),this._extraDragRow=0,this._updateContainerHeight();const e=t.target;o._sidebarOrig||this._writePosAttr(e,o),this.triggerEvent(t,e)}}triggerEvent(e,t){let i=this;for(;i.parentGridNode;)i=i.parentGridNode.grid;i._gsEventHandler[e.type]&&i._gsEventHandler[e.type](e,t)}_leave(e,t){const i=(t=t||e).gridstackNode;if(!i)return;if(t.style.transform=t.style.transformOrigin=null,E.off(e,"drag"),i._temporaryRemoved)return;i._temporaryRemoved=!0,this.engine.removeNode(i),i.el=i._isExternal&&t?t:e;const s=i._sidebarOrig;i._isExternal&&this.engine.cleanupNode(i),i._sidebarOrig=s,!0===this.opts.removable&&x._itemRemoving(e,!0),e._gridstackNodeOrig?(e.gridstackNode=e._gridstackNodeOrig,delete e._gridstackNodeOrig):i._isExternal&&this.engine.restoreInitial()}}return x.renderCB=(e,t)=>{e&&t?.content&&(e.textContent=t.content)},x.resizeToContentParent=".grid-stack-item-content",x.Utils=i,x.Engine=s,x.GDRev="12.6.0",t.GridStack})());
+//# sourceMappingURL=gridstack-all.js.map
\ No newline at end of file
diff --git a/static/gridstack.min.css b/static/gridstack.min.css
new file mode 100644
index 0000000..230c221
--- /dev/null
+++ b/static/gridstack.min.css
@@ -0,0 +1 @@
+.grid-stack{position:relative}.grid-stack-rtl{direction:ltr}.grid-stack-rtl>.grid-stack-item{direction:rtl}.grid-stack-placeholder>.placeholder-content{background-color:rgba(0,0,0,.1);margin:0;position:absolute;width:auto;z-index:0!important}.grid-stack>.grid-stack-item{position:absolute;padding:0;top:0;width:var(--gs-column-width);height:var(--gs-cell-height)}.grid-stack>.grid-stack-item>.grid-stack-item-content{margin:0;position:absolute;width:auto;overflow-x:hidden;overflow-y:auto}.grid-stack>.grid-stack-item.size-to-content:not(.size-to-content-max)>.grid-stack-item-content{overflow-y:hidden}.grid-stack:not(.grid-stack-rtl)>.grid-stack-item{left:0}.grid-stack.grid-stack-rtl>.grid-stack-item{right:0}.grid-stack>.grid-stack-item>.grid-stack-item-content,.grid-stack>.grid-stack-placeholder>.placeholder-content{top:var(--gs-item-margin-top);right:var(--gs-item-margin-right);bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-handle{position:absolute;font-size:.1px;display:block;-ms-touch-action:none;touch-action:none}.grid-stack-item.ui-resizable-autohide>.ui-resizable-handle,.grid-stack-item.ui-resizable-disabled>.ui-resizable-handle{display:none}.grid-stack-item>.ui-resizable-ne,.grid-stack-item>.ui-resizable-nw,.grid-stack-item>.ui-resizable-se,.grid-stack-item>.ui-resizable-sw{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23666" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 20 20"><path d="m10 3 2 2H8l2-2v14l-2-2h4l-2 2"/></svg>');background-repeat:no-repeat;background-position:center}.grid-stack-item>.ui-resizable-ne{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-sw{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-nw{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-se{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-nw{cursor:nw-resize;width:20px;height:20px;top:var(--gs-item-margin-top);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-n{cursor:n-resize;height:10px;top:var(--gs-item-margin-top);left:25px;right:25px}.grid-stack-item>.ui-resizable-ne{cursor:ne-resize;width:20px;height:20px;top:var(--gs-item-margin-top);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-e{cursor:e-resize;width:10px;top:15px;bottom:15px;right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-se{cursor:se-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-s{cursor:s-resize;height:10px;left:25px;bottom:var(--gs-item-margin-bottom);right:25px}.grid-stack-item>.ui-resizable-sw{cursor:sw-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-w{cursor:w-resize;width:10px;top:15px;bottom:15px;left:var(--gs-item-margin-left)}.grid-stack-item.ui-draggable-dragging>.ui-resizable-handle{display:none!important}.grid-stack-item.ui-draggable-dragging{will-change:left,right,top}.grid-stack-item.ui-resizable-resizing{will-change:width,height}.ui-draggable-dragging,.ui-resizable-resizing{z-index:10000}.ui-draggable-dragging>.grid-stack-item-content,.ui-resizable-resizing>.grid-stack-item-content{box-shadow:1px 4px 6px rgba(0,0,0,.2);opacity:.8}.grid-stack-animate,.grid-stack-animate .grid-stack-item{transition:left .3s,right .3s,top .3s,height .3s,width .3s}.grid-stack-animate .grid-stack-item.grid-stack-placeholder,.grid-stack-animate .grid-stack-item.ui-draggable-dragging,.grid-stack-animate .grid-stack-item.ui-resizable-resizing{transition:left 0s,right 0s,top 0s,height 0s,width 0s}.grid-stack>.grid-stack-item[gs-y="0"]{top:0}.grid-stack:not(.grid-stack-rtl)>.grid-stack-item[gs-x="0"]{left:0}.grid-stack.grid-stack-rtl>.grid-stack-item[gs-x="0"]{right:0}
\ No newline at end of file
diff --git a/static/gridstack.min.js b/static/gridstack.min.js
new file mode 100644
index 0000000..ca994e6
--- /dev/null
+++ b/static/gridstack.min.js
@@ -0,0 +1,15 @@
+/**
+ * Minified by jsDelivr using Terser v5.39.0.
+ * Original file: /npm/gridstack@12.6.0/dist/gridstack.js
+ *
+ * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files
+ */
+/*!
+ * 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
+ */
+import{GridStackEngine}from"./gridstack-engine";import{Utils}from"./utils";import{gridDefaults}from"./types";import{DDGridStack}from"./dd-gridstack";import{isTouch}from"./dd-touch";import{DDManager}from"./dd-manager";const dd=new DDGridStack;export*from"./types";export*from"./utils";export*from"./gridstack-engine";export*from"./dd-gridstack";export*from"./dd-manager";export*from"./dd-element";export*from"./dd-draggable";export*from"./dd-droppable";export*from"./dd-resizable";export*from"./dd-resizable-handle";export*from"./dd-base-impl";class GridStack{static init(t={},e=".grid-stack"){if("undefined"==typeof document)return null;const i=GridStack.getGridElement(e);return i?(i.gridstack||(i.gridstack=new GridStack(i,Utils.cloneDeep(t))),i.gridstack):("string"==typeof e?console.error('GridStack.initAll() no grid was found with selector "'+e+'" - element missing or wrong selector ?\nNote: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.'):console.error("GridStack.init() no grid element was passed."),null)}static initAll(t={},e=".grid-stack"){const i=[];return"undefined"==typeof document||(GridStack.getGridElements(e).forEach((e=>{e.gridstack||(e.gridstack=new GridStack(e,Utils.cloneDeep(t))),i.push(e.gridstack)})),0===i.length&&console.error('GridStack.initAll() no grid was found with selector "'+e+'" - element missing or wrong selector ?\nNote: ".grid-stack" is required for proper CSS styling and drag/drop, and is the default selector.')),i}static addGrid(t,e={}){if(!t)return null;let i=t;if(i.gridstack){const t=i.gridstack;return e&&(t.opts={...t.opts,...e}),void 0!==e.children&&t.load(e.children),t}t.classList.contains("grid-stack")&&!GridStack.addRemoveCB||(i=GridStack.addRemoveCB?GridStack.addRemoveCB(t,e,!0,!0):Utils.createDiv(["grid-stack",e.class],t));return GridStack.init(e,i)}static registerEngine(t){GridStack.engineClass=t}get placeholder(){if(!this._placeholder){this._placeholder=Utils.createDiv([this.opts.placeholderClass,gridDefaults.itemClass,this.opts.itemClass]);const t=Utils.createDiv(["placeholder-content"],this._placeholder);this.opts.placeholderText&&(t.textContent=this.opts.placeholderText)}return this._placeholder}constructor(t,e={}){this.el=t,this.opts=e,this.animationDelay=310,this._gsEventHandler={},this._extraDragRow=0,this.dragTransform={xScale:1,yScale:1,xOffset:0,yOffset:0},t.gridstack=this,this.opts=e=e||{},t.classList.contains("grid-stack")||this.el.classList.add("grid-stack"),e.row&&(e.minRow=e.maxRow=e.row,delete e.row);const i=Utils.toNumber(t.getAttribute("gs-row"));"auto"===e.column&&delete e.column,void 0!==e.alwaysShowResizeHandle&&(e._alwaysShowResizeHandle=e.alwaysShowResizeHandle);const s=e.columnOpts;if(s){const t=s.breakpoints;s.columnWidth||t?.length?(s.columnMax=s.columnMax||12,t?.length>1&&t.sort(((t,e)=>(e.w||0)-(t.w||0)))):delete e.columnOpts}const r={...Utils.cloneDeep(gridDefaults),column:Utils.toNumber(t.getAttribute("gs-column"))||gridDefaults.column,minRow:i||(Utils.toNumber(t.getAttribute("gs-min-row"))||gridDefaults.minRow),maxRow:i||(Utils.toNumber(t.getAttribute("gs-max-row"))||gridDefaults.maxRow),staticGrid:Utils.toBool(t.getAttribute("gs-static"))||gridDefaults.staticGrid,sizeToContent:Utils.toBool(t.getAttribute("gs-size-to-content"))||void 0,draggable:{handle:(e.handleClass?"."+e.handleClass:e.handle?e.handle:"")||gridDefaults.draggable.handle},removableOptions:{accept:e.itemClass||gridDefaults.removableOptions.accept,decline:gridDefaults.removableOptions.decline}};t.getAttribute("gs-animate")&&(r.animate=Utils.toBool(t.getAttribute("gs-animate"))),e=Utils.defaults(e,r),this._initMargin(),this.checkDynamicColumn(),this._updateColumnVar(e),"auto"===e.rtl&&(e.rtl="rtl"===t.style.direction),e.rtl&&this.el.classList.add("grid-stack-rtl");const o=this.el.closest("."+gridDefaults.itemClass),n=o?.gridstackNode;if(n&&(n.subGrid=this,this.parentGridNode=n,this.el.classList.add("grid-stack-nested"),n.el.classList.add("grid-stack-sub-grid")),this._isAutoCellHeight="auto"===e.cellHeight,this._isAutoCellHeight||"initial"===e.cellHeight)this.cellHeight(void 0);else{"number"==typeof e.cellHeight&&e.cellHeightUnit&&e.cellHeightUnit!==gridDefaults.cellHeightUnit&&(e.cellHeight=e.cellHeight+e.cellHeightUnit,delete e.cellHeightUnit);const t=e.cellHeight;delete e.cellHeight,this.cellHeight(t)}"mobile"===e.alwaysShowResizeHandle&&(e.alwaysShowResizeHandle=isTouch),this._setStaticClass();const a=e.engineClass||GridStack.engineClass||GridStackEngine;if(this.engine=new a({column:this.getColumn(),float:e.float,maxRow:e.maxRow,onChange:t=>{t.forEach((t=>{const e=t.el;e&&(t._removeDOM?(e&&e.remove(),delete t._removeDOM):this._writePosAttr(e,t))})),this._updateContainerHeight()}}),e.auto&&(this.batchUpdate(),this.engine._loading=!0,this.getGridItems().forEach((t=>this._prepareElement(t))),delete this.engine._loading,this.batchUpdate(!1)),e.children){const t=e.children;delete e.children,t.length&&this.load(t)}this.setAnimation(),e.subGridDynamic&&!DDManager.pauseDrag&&(DDManager.pauseDrag=!0),void 0!==e.draggable?.pause&&(DDManager.pauseDrag=e.draggable.pause),this._setupRemoveDrop(),this._setupAcceptWidget(),this._updateResizeEvent()}_updateColumnVar(t=this.opts){this.el.classList.add("gs-"+t.column),"number"==typeof t.column&&this.el.style.setProperty("--gs-column-width",100/t.column+"%")}addWidget(t){if(!t)return;if("string"==typeof t)return void console.error("V11: GridStack.addWidget() does not support string anymore. see #2736");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,e=i.el?i.el:GridStack.addRemoveCB?GridStack.addRemoveCB(this.el,t,!0,!1):this.createWidgetDivs(i),!e)return;if(i=e.gridstackNode,i&&e.parentElement===this.el&&this.engine.nodes.find((t=>t._id===i._id)))return e;const s=this._readAttr(e);return Utils.defaults(t,s),this.engine.prepareNode(t),this.el.appendChild(e),this.makeWidget(e,t),e}createWidgetDivs(t){const e=Utils.createDiv(["grid-stack-item",this.opts.itemClass]),i=Utils.createDiv(["grid-stack-item-content"],e);return Utils.lazyLoad(t)?t.visibleObservable||(t.visibleObservable=new IntersectionObserver((([e])=>{e.isIntersecting&&(t.visibleObservable?.disconnect(),delete t.visibleObservable,GridStack.renderCB(i,t),t.grid?.prepareDragDrop(t.el))})),window.setTimeout((()=>t.visibleObservable?.observe(e)))):GridStack.renderCB(i,t),e}makeSubGrid(t,e,i,s=!0){let r,o=t.gridstackNode;if(o||(o=this.makeWidget(t).gridstackNode),o.subGrid?.el)return o.subGrid;let n,a=this;for(;a&&!r;)r=a.opts?.subGridOpts,a=a.parentGridNode?.grid;e=Utils.cloneDeep({...this.opts,id:void 0,children:void 0,column:"auto",columnOpts:void 0,layout:"list",subGridOpts:void 0,...r||{},...e||o.subGridOpts||{}}),o.subGridOpts=e,"auto"===e.column&&(n=!0,e.column=Math.max(o.w||1,i?.w||1),delete e.columnOpts);let d,l,h=o.el.querySelector(".grid-stack-item-content");if(s&&(this._removeDD(o.el),l={...o,x:0,y:0},Utils.removeInternalForSave(l),delete l.subGridOpts,o.content&&(l.content=o.content,delete o.content),GridStack.addRemoveCB?d=GridStack.addRemoveCB(this.el,l,!0,!1):(d=Utils.createDiv(["grid-stack-item"]),d.appendChild(h),h=Utils.createDiv(["grid-stack-item-content"],o.el)),this.prepareDragDrop(o.el)),i){const t=n?e.column:o.w,s=o.h+i.h,r=o.el.style;r.transition="none",this.update(o.el,{w:t,h:s}),setTimeout((()=>r.transition=null))}const g=o.subGrid=GridStack.addGrid(h,e);return i?._moving&&(g._isTemp=!0),n&&(g._autoColumn=!0),s&&g.makeWidget(d,l),i&&(i._moving?window.setTimeout((()=>Utils.simulateMouseEvent(i._event,"mouseenter",g.el)),0):g.makeWidget(o.el,o)),this.resizeToContentCheck(!1,o),g}removeAsSubGrid(t){const e=this.parentGridNode?.grid;e&&(e.batchUpdate(),e.removeWidget(this.parentGridNode.el,!0,!0),this.engine.nodes.forEach((t=>{t.x+=this.parentGridNode.x,t.y+=this.parentGridNode.y,e.makeWidget(t.el,t)})),e.batchUpdate(!1),this.parentGridNode&&delete this.parentGridNode.subGrid,delete this.parentGridNode,t&&window.setTimeout((()=>Utils.simulateMouseEvent(t._event,"mouseenter",e.el)),0))}save(t=!0,e=!1,i=GridStack.saveCB,s){const r=this.engine.save(t,i,s);if(r.forEach((s=>{if(t&&s.el&&!s.subGrid&&!i){const t=s.el.querySelector(".grid-stack-item-content");s.content=t?.innerHTML,s.content||delete s.content}else if(t||i||delete s.content,s.subGrid?.el){const r=s.w||s.subGrid.getColumn(),o=s.subGrid.save(t,e,i,r);s.subGridOpts=e?o:{children:o},delete s.subGrid}delete s.el})),e){const t=Utils.cloneDeep(this.opts);t.marginBottom===t.marginTop&&t.marginRight===t.marginLeft&&t.marginTop===t.marginRight&&(t.margin=t.marginTop,delete t.marginTop,delete t.marginRight,delete t.marginBottom,delete t.marginLeft),t.rtl===("rtl"===this.el.style.direction)&&(t.rtl="auto"),this._isAutoCellHeight&&(t.cellHeight="auto"),this._autoColumn&&(t.column="auto");const e=t._alwaysShowResizeHandle;return delete t._alwaysShowResizeHandle,void 0!==e?t.alwaysShowResizeHandle=e:delete t.alwaysShowResizeHandle,Utils.removeInternalAndSame(t,gridDefaults),t.children=r,t}return r}load(t,e=GridStack.addRemoveCB||!0){t.forEach((t=>{t.w=t.w||t.minW||1,t.h=t.h||t.minH||1})),t=Utils.sort(t),this.engine.skipCacheUpdate=this._ignoreLayoutsNodeChange=!0;let i=0;t.forEach((t=>{i=Math.max(i,(t.x||0)+t.w)})),i>this.engine.defaultColumn&&(this.engine.defaultColumn=i);const s=this.getColumn();i>s&&(0===this.engine.nodes.length&&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=GridStack.addRemoveCB;"function"==typeof e&&(GridStack.addRemoveCB=e);const o=[];this.batchUpdate();const n=!this.engine.nodes.length,a=n&&this.opts.animate;if(a&&this.setAnimation(!1),!n&&e){[...this.engine.nodes].forEach((e=>{if(!e.id)return;Utils.find(t,e.id)||(GridStack.addRemoveCB&&GridStack.addRemoveCB(this.el,e,!1,!1),o.push(e),this.removeWidget(e.el,!0,!1))}))}this.engine._loading=!0;const d=[];return this.engine.nodes=this.engine.nodes.filter((e=>!Utils.find(t,e.id)||(d.push(e),!1))),t.forEach((t=>{const i=Utils.find(d,t.id);if(i){if(Utils.shouldSizeToContent(i)&&(t.h=i.h),this.engine.nodeBoundFix(t),(t.autoPosition||void 0===t.x||void 0===t.y)&&(t.w=t.w||i.w,t.h=t.h||i.h,this.engine.findEmptyPosition(t)),this.engine.nodes.push(i),Utils.samePos(i,t)&&this.engine.nodes.length>1&&(this.moveNode(i,{...t,forceCollide:!0}),Utils.copyPos(t,i)),this.update(i.el,t),t.subGridOpts?.children){const e=i.el.querySelector(".grid-stack");e&&e.gridstack&&e.gridstack.load(t.subGridOpts.children)}}else e&&this.addWidget(t)})),delete this.engine._loading,this.engine.removedNodes=o,this.batchUpdate(!1),delete this._ignoreLayoutsNodeChange,delete this.engine.skipCacheUpdate,r?GridStack.addRemoveCB=r:delete GridStack.addRemoveCB,a&&this.setAnimation(!0,!0),this}batchUpdate(t=!0){return this.engine.batchUpdate(t),t||(this._updateContainerHeight(),this._triggerRemoveEvent(),this._triggerAddEvent(),this._triggerChangeEvent()),this}getCellHeight(t=!1){if(this.opts.cellHeight&&"auto"!==this.opts.cellHeight&&(!t||!this.opts.cellHeightUnit||"px"===this.opts.cellHeightUnit))return this.opts.cellHeight;if("rem"===this.opts.cellHeightUnit)return this.opts.cellHeight*parseFloat(getComputedStyle(document.documentElement).fontSize);if("em"===this.opts.cellHeightUnit)return this.opts.cellHeight*parseFloat(getComputedStyle(this.el).fontSize);if("cm"===this.opts.cellHeightUnit)return this.opts.cellHeight*(96/2.54);if("mm"===this.opts.cellHeightUnit)return this.opts.cellHeight*(96/2.54)/10;const e=this.el.querySelector("."+this.opts.itemClass);if(e){const t=Utils.toNumber(e.getAttribute("gs-h"))||1;return Math.round(e.offsetHeight/t)}const i=parseInt(this.el.getAttribute("gs-current-row"));return i?Math.round(this.el.getBoundingClientRect().height/i):this.opts.cellHeight}cellHeight(t){if(void 0!==t&&this._isAutoCellHeight!==("auto"===t)&&(this._isAutoCellHeight="auto"===t,this._updateResizeEvent()),"initial"!==t&&"auto"!==t||(t=void 0),void 0===t){const e=-this.opts.marginRight-this.opts.marginLeft+this.opts.marginTop+this.opts.marginBottom;t=this.cellWidth()+e}const e=Utils.parseHeight(t);return this.opts.cellHeightUnit===e.unit&&this.opts.cellHeight===e.h||(this.opts.cellHeightUnit=e.unit,this.opts.cellHeight=e.h,this.el.style.setProperty("--gs-cell-height",`${this.opts.cellHeight}${this.opts.cellHeightUnit}`),this._updateContainerHeight(),this.resizeToContentCheck()),this}cellWidth(){return this._widthOrContainer()/this.getColumn()}_widthOrContainer(t=!1){return t&&this.opts.columnOpts?.breakpointForWindow?window.innerWidth:this.el.clientWidth||this.el.parentElement.clientWidth||window.innerWidth}checkDynamicColumn(){const t=this.opts.columnOpts;if(!t||!t.columnWidth&&!t.breakpoints?.length)return!1;const e=this.getColumn();let i=e;const s=this._widthOrContainer(!0);if(t.columnWidth)i=Math.min(Math.round(s/t.columnWidth)||1,t.columnMax);else{i=t.columnMax;let r=0;for(;r<t.breakpoints.length&&s<=t.breakpoints[r].w;)i=t.breakpoints[r++].c||e}if(i!==e){const e=t.breakpoints?.find((t=>t.c===i));return this.column(i,e?.layout||t.layout),!0}return!1}compact(t="compact",e=!0){return this.engine.compact(t,e),this._triggerChangeEvent(),this}column(t,e="moveScale"){if(!t||t<1||this.opts.column===t)return this;const i=this.getColumn();return this.opts.column=t,this.engine?(this.engine.column=t,this.el.classList.remove("gs-"+i),this._updateColumnVar(),this.engine.columnChanged(i,t,e),this._isAutoCellHeight&&this.cellHeight(),this.resizeToContentCheck(!0),this._ignoreLayoutsNodeChange=!0,this._triggerChangeEvent(),delete this._ignoreLayoutsNodeChange,this):(this.responseLayout=e,this)}getColumn(){return this.opts.column}getGridItems(){return Array.from(this.el.children).filter((t=>t.matches("."+this.opts.itemClass)&&!t.matches("."+this.opts.placeholderClass)))}isIgnoreChangeCB(){return this._ignoreLayoutsNodeChange}destroy(t=!0){if(this.el)return this.offAll(),this._updateResizeEvent(!0),this.setStatic(!0,!1),this.setAnimation(!1),t?this.el.parentNode.removeChild(this.el):(this.removeAll(t),this.el.removeAttribute("gs-current-row")),this.parentGridNode&&delete this.parentGridNode.subGrid,delete this.parentGridNode,delete this.opts,delete this._placeholder?.gridstackNode,delete this._placeholder,delete this.engine,delete this.el.gridstack,delete this.el,this}float(t){return this.opts.float!==t&&(this.opts.float=this.engine.float=t,this._triggerChangeEvent()),this}getFloat(){return this.engine.float}getCellFromPixel(t,e=!1){const i=this.el.getBoundingClientRect();let s;s=e?{top:i.top+document.documentElement.scrollTop,left:i.left}:{top:this.el.offsetTop,left:this.el.offsetLeft};const r=t.left-s.left,o=t.top-s.top,n=i.width/this.getColumn(),a=i.height/parseInt(this.el.getAttribute("gs-current-row"));return{x:Math.floor(r/n),y:Math.floor(o/a)}}getRow(){return Math.max(this.engine.getRow(),this.opts.minRow||0)}isAreaEmpty(t,e,i,s){return this.engine.isAreaEmpty(t,e,i,s)}makeWidget(t,e){const i=GridStack.getElement(t);if(!i||i.gridstackNode)return i;i.parentElement||this.el.appendChild(i),this._prepareElement(i,!0,e);const s=i.gridstackNode;let r;return this._updateContainerHeight(),s.subGridOpts&&this.makeSubGrid(i,s.subGridOpts,void 0,!1),1!==this.opts.column||this._ignoreLayoutsNodeChange||(r=this._ignoreLayoutsNodeChange=!0),this._triggerAddEvent(),this._triggerChangeEvent(),r&&delete this._ignoreLayoutsNodeChange,i}on(t,e){if(-1!==t.indexOf(" ")){return t.split(" ").forEach((t=>this.on(t,e))),this}if("change"===t||"added"===t||"removed"===t||"enable"===t||"disable"===t){const i="enable"===t||"disable"===t;this._gsEventHandler[t]=i?t=>e(t):t=>{t.detail&&e(t,t.detail)},this.el.addEventListener(t,this._gsEventHandler[t])}else"drag"===t||"dragstart"===t||"dragstop"===t||"resizestart"===t||"resize"===t||"resizestop"===t||"dropped"===t||"resizecontent"===t?this._gsEventHandler[t]=e:console.error("GridStack.on("+t+") event not supported");return this}off(t){if(-1!==t.indexOf(" ")){return t.split(" ").forEach((t=>this.off(t))),this}return"change"!==t&&"added"!==t&&"removed"!==t&&"enable"!==t&&"disable"!==t||this._gsEventHandler[t]&&this.el.removeEventListener(t,this._gsEventHandler[t]),delete this._gsEventHandler[t],this}offAll(){return Object.keys(this._gsEventHandler).forEach((t=>this.off(t))),this}removeWidget(t,e=!0,i=!0){return t?(GridStack.getElements(t).forEach((t=>{if(t.parentElement&&t.parentElement!==this.el)return;let s=t.gridstackNode;s||(s=this.engine.nodes.find((e=>t===e.el))),s&&(e&&GridStack.addRemoveCB&&GridStack.addRemoveCB(this.el,s,!1,!1),delete t.gridstackNode,this._removeDD(t),this.engine.removeNode(s,e,i),e&&t.parentElement&&t.remove())})),i&&(this._triggerRemoveEvent(),this._triggerChangeEvent()),this):(console.error("Error: GridStack.removeWidget(undefined) called"),this)}removeAll(t=!0,e=!0){return this.engine.nodes.forEach((e=>{t&&GridStack.addRemoveCB&&GridStack.addRemoveCB(this.el,e,!1,!1),delete e.el.gridstackNode,this.opts.staticGrid||this._removeDD(e.el)})),this.engine.removeAll(t,e),e&&this._triggerRemoveEvent(),this}setAnimation(t=this.opts.animate,e){return e?setTimeout((()=>{this.opts&&this.setAnimation(t)})):t?this.el.classList.add("grid-stack-animate"):this.el.classList.remove("grid-stack-animate"),this.opts.animate=t,this}hasAnimationCSS(){return this.el.classList.contains("grid-stack-animate")}setStatic(t,e=!0,i=!0){return!!this.opts.staticGrid===t||(t?this.opts.staticGrid=!0:delete this.opts.staticGrid,this._setupRemoveDrop(),this._setupAcceptWidget(),this.engine.nodes.forEach((s=>{this.prepareDragDrop(s.el),s.subGrid&&i&&s.subGrid.setStatic(t,e,i)})),e&&this._setStaticClass()),this}updateOptions(t){const e=this.opts;if(t===e)return this;if(void 0!==t.acceptWidgets&&(e.acceptWidgets=t.acceptWidgets,this._setupAcceptWidget()),void 0!==t.animate&&this.setAnimation(t.animate),t.cellHeight&&this.cellHeight(t.cellHeight),void 0!==t.class&&t.class!==e.class&&(e.class&&this.el.classList.remove(e.class),t.class&&this.el.classList.add(t.class)),t.columnOpts){const e=!!this.opts.columnOpts;this.opts.columnOpts=t.columnOpts,e!==!!this.opts.columnOpts&&this._updateResizeEvent(),this.checkDynamicColumn()}else null===t.columnOpts&&this.opts.columnOpts?(delete this.opts.columnOpts,this._updateResizeEvent()):"number"==typeof t.column&&this.column(t.column);return void 0!==t.margin&&this.margin(t.margin),void 0!==t.staticGrid&&this.setStatic(t.staticGrid),void 0===t.disableDrag||t.staticGrid||this.enableMove(!t.disableDrag),void 0===t.disableResize||t.staticGrid||this.enableResize(!t.disableResize),void 0!==t.float&&this.float(t.float),void 0!==t.row?(e.minRow=e.maxRow=e.row=t.row,this._updateContainerHeight()):(void 0!==t.minRow&&(e.minRow=t.minRow,this._updateContainerHeight()),void 0!==t.maxRow&&(e.maxRow=this.engine.maxRow=t.maxRow)),void 0!==t.lazyLoad&&(e.lazyLoad=t.lazyLoad),t.children?.length&&this.load(t.children),this}update(t,e){return GridStack.getElements(t).forEach((t=>{const i=t?.gridstackNode;if(!i)return;const s={...Utils.copyPos({},i),...Utils.cloneDeep(e)};this.engine.nodeBoundFix(s),delete s.autoPosition;const r=["x","y","w","h"];let o;if(r.some((t=>void 0!==s[t]&&s[t]!==i[t]))&&(o={},r.forEach((t=>{o[t]=void 0!==s[t]?s[t]:i[t],delete s[t]}))),!o&&(s.minW||s.minH||s.maxW||s.maxH)&&(o={}),void 0!==s.content){const e=t.querySelector(".grid-stack-item-content");e&&e.textContent!==s.content&&(i.content=s.content,GridStack.renderCB(e,s),i.subGrid?.el&&(e.appendChild(i.subGrid.el),i.subGrid._updateContainerHeight())),delete s.content}let n=!1,a=!1;for(const t in s)"_"!==t[0]&&i[t]!==s[t]&&(i[t]=s[t],n=!0,a=a||!this.opts.staticGrid&&("noResize"===t||"noMove"===t||"locked"===t));if(Utils.sanitizeMinMax(i),o){const t=void 0!==o.w&&o.w!==i.w;this.moveNode(i,o),t&&i.subGrid?i.subGrid.onResize(this.hasAnimationCSS()?i.w:void 0):this.resizeToContentCheck(t,i),delete i._orig}(o||n)&&this._writeAttr(t,i),a&&this.prepareDragDrop(i.el),GridStack.updateCB&&GridStack.updateCB(i)})),this}moveNode(t,e){const i=t._updating;i||this.engine.cleanNodes().beginUpdate(t),this.engine.moveNode(t,e),this._updateContainerHeight(),i||(this._triggerChangeEvent(),this.engine.endUpdate())}resizeToContent(t){if(!t)return;if(t.classList.remove("size-to-content-max"),!t.clientHeight)return;const e=t.gridstackNode;if(!e)return;const i=e.grid;if(!i||t.parentElement!==i.el)return;const s=i.getCellHeight(!0);if(!s)return;let r,o=e.h?e.h*s:t.clientHeight;if(e.resizeToContentParent&&(r=t.querySelector(e.resizeToContentParent)),r||(r=t.querySelector(GridStack.resizeToContentParent)),!r)return;const n=t.clientHeight-r.clientHeight,a=e.h?e.h*s-n:r.clientHeight;let d;if(e.subGrid){d=e.subGrid.getRow()*e.subGrid.getCellHeight(!0);const i=e.subGrid.el.getBoundingClientRect(),s=t.getBoundingClientRect();d+=i.top-s.top}else{if(e.subGridOpts?.children?.length)return;{const t=r.firstElementChild;if(!t)return void console.error(`Error: GridStack.resizeToContent() widget id:${e.id} '${GridStack.resizeToContentParent}'.firstElementChild is null, make sure to have a div like container. Skipping sizing.`);d=t.getBoundingClientRect().height||a}}if(a===d)return;o+=d-a;let l=Math.ceil(o/s);const h=Number.isInteger(e.sizeToContent)?e.sizeToContent:0;h&&l>h&&(l=h,t.classList.add("size-to-content-max")),e.minH&&l<e.minH?l=e.minH:e.maxH&&l>e.maxH&&(l=e.maxH),l!==e.h&&(i._ignoreLayoutsNodeChange=!0,i.moveNode(e,{h:l}),delete i._ignoreLayoutsNodeChange)}resizeToContentCBCheck(t){GridStack.resizeToContentCB?GridStack.resizeToContentCB(t):this.resizeToContent(t)}rotate(t,e){return GridStack.getElements(t).forEach((t=>{const i=t.gridstackNode;if(!Utils.canBeRotated(i))return;const s={w:i.h,h:i.w,minH:i.minW,minW:i.minH,maxH:i.maxW,maxW:i.maxH};if(e){const t=e.left>0?Math.floor(e.left/this.cellWidth()):0,r=e.top>0?Math.floor(e.top/this.opts.cellHeight):0;s.x=i.x+t-(i.h-(r+1)),s.y=i.y+r-t}Object.keys(s).forEach((t=>{void 0===s[t]&&delete s[t]}));const r=i._orig;this.update(t,s),i._orig=r})),this}margin(t){if(!("string"==typeof t&&t.split(" ").length>1)){const e=Utils.parseHeight(t);if(this.opts.marginUnit===e.unit&&this.opts.margin===e.h)return}return this.opts.margin=t,this.opts.marginTop=this.opts.marginBottom=this.opts.marginLeft=this.opts.marginRight=void 0,this._initMargin(),this}getMargin(){return this.opts.margin}willItFit(t){return this.engine.willItFit(t)}_triggerChangeEvent(){if(this.engine.batchMode)return this;const t=this.engine.getDirtyNodes(!0);return t&&t.length&&(this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(t),this._triggerEvent("change",t)),this.engine.saveInitial(),this}_triggerAddEvent(){if(this.engine.batchMode)return this;if(this.engine.addedNodes?.length){this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(this.engine.addedNodes),this.engine.addedNodes.forEach((t=>{delete t._dirty}));const t=[...this.engine.addedNodes];this.engine.addedNodes=[],this._triggerEvent("added",t)}return this}_triggerRemoveEvent(){if(this.engine.batchMode)return this;if(this.engine.removedNodes?.length){const t=[...this.engine.removedNodes];this.engine.removedNodes=[],this._triggerEvent("removed",t)}return this}_triggerEvent(t,e){const i=e?new CustomEvent(t,{bubbles:!1,detail:e}):new Event(t);let s=this;for(;s.parentGridNode;)s=s.parentGridNode.grid;return s.el.dispatchEvent(i),this}_updateContainerHeight(){if(!this.engine||this.engine.batchMode)return this;const t=this.parentGridNode;let e=this.getRow()+this._extraDragRow;const i=this.opts.cellHeight,s=this.opts.cellHeightUnit;if(!i)return this;if(!t&&!this.opts.minRow){const t=Utils.parseHeight(getComputedStyle(this.el).minHeight);if(t.h>0&&t.unit===s){const s=Math.floor(t.h/i);e<s&&(e=s)}}return this.el.setAttribute("gs-current-row",String(e)),this.el.style.removeProperty("min-height"),this.el.style.removeProperty("height"),e&&(this.el.style[t?"minHeight":"height"]=e*i+s),t&&Utils.shouldSizeToContent(t)&&t.grid.resizeToContentCBCheck(t.el),this}_prepareElement(t,e=!1,i){i=i||this._readAttr(t),t.gridstackNode=i,i.el=t,i.grid=this,i=this.engine.addNode(i,e),this._writeAttr(t,i),t.classList.add(gridDefaults.itemClass,this.opts.itemClass);const s=Utils.shouldSizeToContent(i);return s?t.classList.add("size-to-content"):t.classList.remove("size-to-content"),s&&this.resizeToContentCheck(!1,i),Utils.lazyLoad(i)||this.prepareDragDrop(i.el),this}_writePosAttr(t,e){if(!e._moving&&!e._resizing||this._placeholder===t){const i=this.opts.rtl?"right":"left";t.style.top=e.y?1===e.y?"var(--gs-cell-height)":`calc(${e.y} * var(--gs-cell-height))`:null,t.style[i]=e.x?1===e.x?"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}_writeAttr(t,e){if(!e)return this;this._writePosAttr(t,e);const i={noResize:"gs-no-resize",noMove:"gs-no-move",locked:"gs-locked",id:"gs-id",sizeToContent:"gs-size-to-content"};for(const s in i)e[s]?t.setAttribute(i[s],String(e[s])):t.removeAttribute(i[s]);return this}_readAttr(t,e=!0){const i={};i.x=Utils.toNumber(t.getAttribute("gs-x")),i.y=Utils.toNumber(t.getAttribute("gs-y")),i.w=Utils.toNumber(t.getAttribute("gs-w")),i.h=Utils.toNumber(t.getAttribute("gs-h")),i.autoPosition=Utils.toBool(t.getAttribute("gs-auto-position")),i.noResize=Utils.toBool(t.getAttribute("gs-no-resize")),i.noMove=Utils.toBool(t.getAttribute("gs-no-move")),i.locked=Utils.toBool(t.getAttribute("gs-locked"));const s=t.getAttribute("gs-size-to-content");s&&(i.sizeToContent="true"===s||"false"===s?Utils.toBool(s):parseInt(s,10)),i.id=t.getAttribute("gs-id"),i.maxW=Utils.toNumber(t.getAttribute("gs-max-w")),i.minW=Utils.toNumber(t.getAttribute("gs-min-w")),i.maxH=Utils.toNumber(t.getAttribute("gs-max-h")),i.minH=Utils.toNumber(t.getAttribute("gs-min-h")),e&&(1===i.w&&t.removeAttribute("gs-w"),1===i.h&&t.removeAttribute("gs-h"),i.maxW&&t.removeAttribute("gs-max-w"),i.minW&&t.removeAttribute("gs-min-w"),i.maxH&&t.removeAttribute("gs-max-h"),i.minH&&t.removeAttribute("gs-min-h"));for(const t in i){if(!i.hasOwnProperty(t))return;i[t]||0===i[t]||"sizeToContent"===t||delete i[t]}return i}_setStaticClass(){const t=["grid-stack-static"];return this.opts.staticGrid?(this.el.classList.add(...t),this.el.setAttribute("gs-static","true")):(this.el.classList.remove(...t),this.el.removeAttribute("gs-static")),this}onResize(t=this.el?.clientWidth){if(!t)return;if(this.prevWidth===t)return;this.prevWidth=t,this.batchUpdate();let e=!1;return this._autoColumn&&this.parentGridNode?this.opts.column!==this.parentGridNode.w&&(this.column(this.parentGridNode.w,this.opts.layout||"list"),e=!0):e=this.checkDynamicColumn(),this._isAutoCellHeight&&this.cellHeight(),this.engine.nodes.forEach((t=>{t.subGrid&&t.subGrid.onResize()})),this._skipInitialResize||this.resizeToContentCheck(e),delete this._skipInitialResize,this.batchUpdate(!1),this}resizeToContentCheck(t=!1,e=void 0){if(this.engine){if(t&&this.hasAnimationCSS())return setTimeout((()=>this.resizeToContentCheck(!1,e)),this.animationDelay);if(e)Utils.shouldSizeToContent(e)&&this.resizeToContentCBCheck(e.el);else if(this.engine.nodes.some((t=>Utils.shouldSizeToContent(t)))){const t=[...this.engine.nodes];this.batchUpdate(),t.forEach((t=>{Utils.shouldSizeToContent(t)&&this.resizeToContentCBCheck(t.el)})),this._ignoreLayoutsNodeChange=!0,this.batchUpdate(!1),this._ignoreLayoutsNodeChange=!1}this._gsEventHandler.resizecontent&&this._gsEventHandler.resizecontent(null,e?[e]:this.engine.nodes)}}_updateResizeEvent(t=!1){const e=!this.parentGridNode&&(this._isAutoCellHeight||this.opts.sizeToContent||this.opts.columnOpts||this.engine.nodes.find((t=>t.sizeToContent)));return t||!e||this.resizeObserver?!t&&e||!this.resizeObserver||(this.resizeObserver.disconnect(),delete this.resizeObserver,delete this._sizeThrottle):(this._sizeThrottle=Utils.throttle((()=>this.onResize()),this.opts.cellHeightThrottle),this.resizeObserver=new ResizeObserver((()=>this._sizeThrottle())),this.resizeObserver.observe(this.el),this._skipInitialResize=!0),this}static getElement(t=".grid-stack-item"){return Utils.getElement(t)}static getElements(t=".grid-stack-item"){return Utils.getElements(t)}static getGridElement(t){return GridStack.getElement(t)}static getGridElements(t){return Utils.getElements(t)}_initMargin(){let t,e=0,i=[];"string"==typeof this.opts.margin&&(i=this.opts.margin.split(" ")),2===i.length?(this.opts.marginTop=this.opts.marginBottom=i[0],this.opts.marginLeft=this.opts.marginRight=i[1]):4===i.length?(this.opts.marginTop=i[0],this.opts.marginRight=i[1],this.opts.marginBottom=i[2],this.opts.marginLeft=i[3]):(t=Utils.parseHeight(this.opts.margin),this.opts.marginUnit=t.unit,e=this.opts.margin=t.h);["marginTop","marginRight","marginBottom","marginLeft"].forEach((i=>{void 0===this.opts[i]?this.opts[i]=e:(t=Utils.parseHeight(this.opts[i]),this.opts[i]=t.h,delete this.opts.margin)})),this.opts.marginUnit=t.unit,this.opts.marginTop===this.opts.marginBottom&&this.opts.marginLeft===this.opts.marginRight&&this.opts.marginTop===this.opts.marginRight&&(this.opts.margin=this.opts.marginTop);const s=this.el.style;return s.setProperty("--gs-item-margin-top",`${this.opts.marginTop}${this.opts.marginUnit}`),s.setProperty("--gs-item-margin-bottom",`${this.opts.marginBottom}${this.opts.marginUnit}`),s.setProperty("--gs-item-margin-right",`${this.opts.marginRight}${this.opts.marginUnit}`),s.setProperty("--gs-item-margin-left",`${this.opts.marginLeft}${this.opts.marginUnit}`),this}static getDD(){return dd}static setupDragIn(t,e,i,s=document){void 0!==e?.pause&&(DDManager.pauseDrag=e.pause),e={appendTo:"body",helper:"clone",...e||{}};("string"==typeof t?Utils.getElements(t,s):t).forEach(((t,s)=>{dd.isDraggable(t)||dd.dragIn(t,e),i?.[s]&&(t.gridstackNode=i[s])}))}movable(t,e){return this.opts.staticGrid||GridStack.getElements(t).forEach((t=>{const i=t.gridstackNode;i&&(e?delete i.noMove:i.noMove=!0,this.prepareDragDrop(i.el))})),this}resizable(t,e){return this.opts.staticGrid||GridStack.getElements(t).forEach((t=>{const i=t.gridstackNode;i&&(e?delete i.noResize:i.noResize=!0,this.prepareDragDrop(i.el))})),this}disable(t=!0){if(!this.opts.staticGrid)return this.enableMove(!1,t),this.enableResize(!1,t),this._triggerEvent("disable"),this}enable(t=!0){if(!this.opts.staticGrid)return this.enableMove(!0,t),this.enableResize(!0,t),this._triggerEvent("enable"),this}enableMove(t,e=!0){return this.opts.staticGrid||(t?delete this.opts.disableDrag:this.opts.disableDrag=!0,this.engine.nodes.forEach((i=>{this.prepareDragDrop(i.el),i.subGrid&&e&&i.subGrid.enableMove(t,e)}))),this}enableResize(t,e=!0){return this.opts.staticGrid||(t?delete this.opts.disableResize:this.opts.disableResize=!0,this.engine.nodes.forEach((i=>{this.prepareDragDrop(i.el),i.subGrid&&e&&i.subGrid.enableResize(t,e)}))),this}cancelDrag(){const t=this._placeholder?.gridstackNode;t&&(t._isExternal?(t._isAboutToRemove=!0,this.engine.removeNode(t)):t._isAboutToRemove&&GridStack._itemRemoving(t.el,!1),this.engine.restoreInitial())}_removeDD(t){return dd.draggable(t,"destroy").resizable(t,"destroy"),t.gridstackNode&&delete t.gridstackNode._initDD,delete t.ddElement,this}_setupAcceptWidget(){if(this.opts.staticGrid||!this.opts.acceptWidgets&&!this.opts.removable)return dd.droppable(this.el,"destroy"),this;let t,e;const i=(i,s,r)=>{const o=(r=r||s).gridstackNode;if(!o)return;if(!o.grid?.el){r.style.transform=`scale(${1/this.dragTransform.xScale},${1/this.dragTransform.yScale})`;const t=r.getBoundingClientRect();r.style.left=t.x+(this.dragTransform.xScale-1)*(i.clientX-t.x)/this.dragTransform.xScale+"px",r.style.top=t.y+(this.dragTransform.yScale-1)*(i.clientY-t.y)/this.dragTransform.yScale+"px",r.style.transformOrigin="0px 0px"}let{top:n,left:a}=r.getBoundingClientRect();const d=this.el.getBoundingClientRect();a-=d.left,n-=d.top;const l={position:{top:n*this.dragTransform.xScale,left:a*this.dragTransform.yScale}};if(o._temporaryRemoved){if(o.x=Math.max(0,Math.round(a/e)),o.y=Math.max(0,Math.round(n/t)),delete o.autoPosition,this.engine.nodeBoundFix(o),!this.engine.willItFit(o)){if(o.autoPosition=!0,!this.engine.willItFit(o))return void dd.off(s,"drag");o._willFitPos&&(Utils.copyPos(o,o._willFitPos),delete o._willFitPos)}this._onStartMoving(r,i,l,o,e,t)}else this._dragOrResize(r,i,l,o,e,t)};return dd.droppable(this.el,{accept:t=>{const e=t.gridstackNode||this._readAttr(t,!1);if(e?.grid===this)return!0;if(!this.opts.acceptWidgets)return!1;let i=!0;if("function"==typeof this.opts.acceptWidgets)i=this.opts.acceptWidgets(t);else{const e=!0===this.opts.acceptWidgets?".grid-stack-item":this.opts.acceptWidgets;i=t.matches(e)}if(i&&e&&this.opts.maxRow){const t={w:e.w,h:e.h,minW:e.minW,minH:e.minH};i=this.engine.willItFit(t)}return i}}).on(this.el,"dropover",((s,r,o)=>{let n=o?.gridstackNode||r.gridstackNode;if(n?.grid===this&&!n._temporaryRemoved)return!1;if(n?._sidebarOrig&&(n.w=n._sidebarOrig.w,n.h=n._sidebarOrig.h),n?.grid&&n.grid!==this&&!n._temporaryRemoved){n.grid._leave(r,o)}if(o=o||r,e=this.cellWidth(),t=this.getCellHeight(!0),!n){const t=o.getAttribute("data-gs-widget")||o.getAttribute("gridstacknode");if(t){try{n=JSON.parse(t)}catch(e){console.error("Gridstack dropover: Bad JSON format: ",t)}o.removeAttribute("data-gs-widget"),o.removeAttribute("gridstacknode")}n||(n=this._readAttr(o)),n._sidebarOrig={w:n.w,h:n.h}}n.grid||(n.el||(n={...n}),n._isExternal=!0,o.gridstackNode=n);const a=n.w||Math.round(o.offsetWidth/e)||1,d=n.h||Math.round(o.offsetHeight/t)||1;return n.grid&&n.grid!==this?(r._gridstackNodeOrig||(r._gridstackNodeOrig=n),r.gridstackNode=n={...n,w:a,h:d,grid:this},delete n.x,delete n.y,this.engine.cleanupNode(n).nodeBoundFix(n),n._initDD=n._isExternal=n._temporaryRemoved=!0):(n.w=a,n.h=d,n._temporaryRemoved=!0),GridStack._itemRemoving(n.el,!1),dd.on(r,"drag",i),i(s,r,o),!1})).on(this.el,"dropout",((t,e,i)=>{const s=i?.gridstackNode||e.gridstackNode;return!!s&&(s.grid&&s.grid!==this||(this._leave(e,i),this._isTemp&&this.removeAsSubGrid(s)),!1)})).on(this.el,"drop",((t,e,i)=>{const s=i?.gridstackNode||e.gridstackNode;if(s?.grid===this&&!s._isExternal)return!1;const r=!!this.placeholder.parentElement,o=e!==i;this.placeholder.remove(),delete this.placeholder.gridstackNode,r&&this.opts.animate&&(this.setAnimation(!1),this.setAnimation(!0,!0));const n=e._gridstackNodeOrig;if(delete e._gridstackNodeOrig,r&&n?.grid&&n.grid!==this){const t=n.grid;t.engine.removeNodeFromLayoutCache(n),t.engine.removedNodes.push(n),t._triggerRemoveEvent()._triggerChangeEvent(),t.parentGridNode&&!t.engine.nodes.length&&t.opts.subGridDynamic&&t.removeAsSubGrid()}if(!s)return!1;if(r&&(this.engine.cleanupNode(s),s.grid=this),delete s.grid?._isTemp,dd.off(e,"drag"),i!==e?(i.remove(),e=i):e.remove(),this._removeDD(e),!r)return!1;const a=s.subGrid?.el?.gridstack;return Utils.copyPos(s,this._readAttr(this.placeholder)),Utils.removePositioningStyles(e),o&&(s.content||s.subGridOpts||GridStack.addRemoveCB)?(delete s.el,e=this.addWidget(s)):(this._prepareElement(e,!0,s),this.el.appendChild(e),this.resizeToContentCheck(!1,s),a&&(a.parentGridNode=s),this._updateContainerHeight()),this.engine.addedNodes.push(s),this._triggerAddEvent(),this._triggerChangeEvent(),this.engine.endUpdate(),this._gsEventHandler.dropped&&this._gsEventHandler.dropped({...t,type:"dropped"},n&&n.grid?n:void 0,s),!1})),this}static _itemRemoving(t,e){if(!t)return;const i=t?t.gridstackNode:void 0;i?.grid&&!t.classList.contains(i.grid.opts.removableOptions.decline)&&(e?i._isAboutToRemove=!0:delete i._isAboutToRemove,e?t.classList.add("grid-stack-item-removing"):t.classList.remove("grid-stack-item-removing"))}_setupRemoveDrop(){if("string"!=typeof this.opts.removable)return this;const t=document.querySelector(this.opts.removable);return t?(this.opts.staticGrid||dd.isDroppable(t)||dd.droppable(t,this.opts.removableOptions).on(t,"dropover",((t,e)=>GridStack._itemRemoving(e,!0))).on(t,"dropout",((t,e)=>GridStack._itemRemoving(e,!1))),this):this}prepareDragDrop(t,e=!1){const i=t?.gridstackNode;if(!i)return;const s=i.noMove||this.opts.disableDrag,r=i.noResize||this.opts.disableResize,o=this.opts.staticGrid||s&&r;if((e||o)&&(i._initDD&&(this._removeDD(t),delete i._initDD),o))return t.classList.add("ui-draggable-disabled","ui-resizable-disabled"),this;if(!i._initDD){let e,s;const r=(r,o)=>{this.triggerEvent(r,r.target),e=this.cellWidth(),s=this.getCellHeight(!0),this._onStartMoving(t,r,o,i,e,s)},o=(r,o)=>{this._dragOrResize(t,r,o,i,e,s)},n=e=>{this.placeholder.remove(),delete this.placeholder.gridstackNode,delete i._moving,delete i._resizing,delete i._event,delete i._lastTried;const s=i.w!==i._orig.w,r=e.target;if(r.gridstackNode&&r.gridstackNode.grid===this){if(i.el=r,i._isAboutToRemove){const s=t.gridstackNode.grid;s._gsEventHandler[e.type]&&s._gsEventHandler[e.type](e,r),s.engine.nodes.push(i),s.removeWidget(t,!0,!0)}else Utils.removePositioningStyles(r),i._temporaryRemoved?(this._writePosAttr(r,i),this.engine.addNode(i)):this._writePosAttr(r,i),this.triggerEvent(e,r);this._extraDragRow=0,this._updateContainerHeight(),this._triggerChangeEvent(),this.engine.endUpdate(),"resizestop"===e.type&&(Number.isInteger(i.sizeToContent)&&(i.sizeToContent=i.h),this.resizeToContentCheck(s,i))}};dd.draggable(t,{start:r,stop:n,drag:o,rtl:this.opts.rtl}).resizable(t,{start:r,stop:n,resize:o,rtl:this.opts.rtl}),i._initDD=!0}return dd.draggable(t,s?"disable":"enable").resizable(t,r?"disable":"enable"),this}_onStartMoving(t,e,i,s,r,o){if(this.engine.cleanNodes().beginUpdate(s),this._writePosAttr(this.placeholder,s),this.el.appendChild(this.placeholder),this.placeholder.gridstackNode=s,s.grid?.el)this.dragTransform=Utils.getValuesFromTransformedElement(t);else if(this.placeholder&&this.placeholder.closest(".grid-stack")){const t=this.placeholder.closest(".grid-stack");this.dragTransform=Utils.getValuesFromTransformedElement(t)}else this.dragTransform={xScale:1,xOffset:0,yScale:1,yOffset:0};if(s.el=this.placeholder,s._lastUiPosition=i.position,s._prevYPix=i.position.top,s._moving="dragstart"===e.type,s._resizing="resizestart"===e.type,delete s._lastTried,"dropover"===e.type&&s._temporaryRemoved&&(this.engine.addNode(s),s._moving=!0),this.engine.cacheRects(r,o,this.opts.marginTop,this.opts.marginRight,this.opts.marginBottom,this.opts.marginLeft),"resizestart"===e.type){const e=this.getColumn()-s.x,i=(this.opts.maxRow||Number.MAX_SAFE_INTEGER)-s.y;dd.resizable(t,"option","minWidth",r*Math.min(s.minW||1,e)).resizable(t,"option","minHeight",o*Math.min(s.minH||1,i)).resizable(t,"option","maxWidth",r*Math.min(s.maxW||Number.MAX_SAFE_INTEGER,e)).resizable(t,"option","maxWidthMoveLeft",r*Math.min(s.maxW||Number.MAX_SAFE_INTEGER,s.x+s.w)).resizable(t,"option","maxHeight",o*Math.min(s.maxH||Number.MAX_SAFE_INTEGER,i)).resizable(t,"option","maxHeightMoveUp",o*Math.min(s.maxH||Number.MAX_SAFE_INTEGER,s.y+s.h))}}_dragOrResize(t,e,i,s,r,o){const n={...s._orig};let a,d=this.opts.marginLeft,l=this.opts.marginRight,h=this.opts.marginTop,g=this.opts.marginBottom;const c=Math.round(.1*o),m=Math.round(.1*r);if(d=Math.min(d,m),l=Math.min(l,m),h=Math.min(h,c),g=Math.min(g,c),"drag"===e.type){if(s._temporaryRemoved)return;s._prevYPix=i.position.top,!1!==this.opts.draggable.scroll&&DDManager.dragElement?.updateScrollPosition(this.el);const t=i.position.left+(i.position.left>s._lastUiPosition.left?-l:d),e=i.position.top+(i.position.top>s._lastUiPosition.top?-g:h);n.x=Math.round(t/r),n.y=Math.round(e/o);const a=this._extraDragRow;if(this.engine.collide(s,n)){const t=this.getRow();let e=Math.max(0,n.y+s.h-t);this.opts.maxRow&&t+e>this.opts.maxRow&&(e=Math.max(0,this.opts.maxRow-t)),this._extraDragRow=e}else this._extraDragRow=0;if(this._extraDragRow!==a&&this._updateContainerHeight(),s.x===n.x&&s.y===n.y)return}else if("resize"===e.type){if(n.x<0)return;if(Utils.updateScrollResize(e,t,o),n.w=Math.round((i.size.width-d)/r),n.h=Math.round((i.size.height-h)/o),s.w===n.w&&s.h===n.h)return;if(s._lastTried&&s._lastTried.w===n.w&&s._lastTried.h===n.h)return;if(e.hasMovedX){const t=i.position.left+d;n.x=Math.round(t/r)}if(e.hasMovedY){const t=i.position.top+h;n.y=Math.round(t/o)}a=!0}s._event=e,s._lastTried=n;const p={x:i.position.left+d,y:i.position.top+h,w:(i.size?i.size.width:s.w*r)-d-l,h:(i.size?i.size.height:s.h*o)-h-g};if(this.engine.moveNodeCheck(s,{...n,cellWidth:r,cellHeight:o,rect:p,resizing:a})){s._lastUiPosition=i.position,this.engine.cacheRects(r,o,h,l,g,d),delete s._skipDown,a&&s.subGrid&&s.subGrid.onResize(),this._extraDragRow=0,this._updateContainerHeight();const t=e.target;s._sidebarOrig||this._writePosAttr(t,s),this.triggerEvent(e,t)}}triggerEvent(t,e){let i=this;for(;i.parentGridNode;)i=i.parentGridNode.grid;i._gsEventHandler[t.type]&&i._gsEventHandler[t.type](t,e)}_leave(t,e){const i=(e=e||t).gridstackNode;if(!i)return;if(e.style.transform=e.style.transformOrigin=null,dd.off(t,"drag"),i._temporaryRemoved)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,!0===this.opts.removable&&GridStack._itemRemoving(t,!0),t._gridstackNodeOrig?(t.gridstackNode=t._gridstackNodeOrig,delete t._gridstackNodeOrig):i._isExternal&&this.engine.restoreInitial()}}GridStack.renderCB=(t,e)=>{t&&e?.content&&(t.textContent=e.content)},GridStack.resizeToContentParent=".grid-stack-item-content",GridStack.Utils=Utils,GridStack.Engine=GridStackEngine,GridStack.GDRev="12.6.0";export{GridStack};
+//# sourceMappingURL=/sm/b9bd58c6f12f3d1453c21d8a6fabb3be0107099185d5c8ca615a1ae24f77b20f.map
\ No newline at end of file
diff --git a/static/index.html b/static/index.html
index b7c6119..f2c7a17 100644
--- a/static/index.html
+++ b/static/index.html
@@ -7,6 +7,8 @@
   <link rel="stylesheet" href="/static/style.css">
   <link rel="stylesheet" href="/static/builder.css">
   <link rel="stylesheet" href="/static/designer.css">
+  <link rel="stylesheet" href="/static/gridstack.min.css">
+  <script src="/static/gridstack-all.js"></script>
 </head>
 <body>
 <div class="app">