gridstack 7.2.2 → 7.3.0

package/dist/es5/gridstack.js

@@ -30,7 +30,7 @@ var __spreadArrays = (this && this.__spreadArrays) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.GridStack = void 0;
 /*!
- * GridStack 7.2.2
+ * GridStack 7.3.0
  * https://gridstackjs.com/
  *
  * Copyright (c) 2021-2022 Alain Dumesny
@@ -182,20 +182,7 @@ var GridStack = /** @class */ (function () {
         });
         if (this.opts.auto) {
             this.batchUpdate(); // prevent in between re-layout #1535 TODO: this only set float=true, need to prevent collision check...
-            var elements_1 = [];
-            var column_1 = this.getColumn();
-            if (column_1 === 1 && this._prevColumn)
-                column_1 = this._prevColumn; // do 12 column when reading into 1 column mode
-            this.getGridItems().forEach(function (el) {
-                var x = parseInt(el.getAttribute('gs-x'));
-                var y = parseInt(el.getAttribute('gs-y'));
-                elements_1.push({
-                    el: el,
-                    // if x,y are missing (autoPosition) add them to end of list - but keep their respective DOM order
-                    i: (Number.isNaN(x) ? 1000 : x) + (Number.isNaN(y) ? 1000 : y) * column_1
-                });
-            });
-            elements_1.sort(function (a, b) { return b.i - a.i; }).forEach(function (e) { return _this._prepareElement(e.el); }); // revert sort so lowest item wins
+            this.getGridItems().forEach(function (el) { return _this._prepareElement(el); });
             this.batchUpdate(false);
         }
         // load any passed in children as well, which overrides any DOM layout done above
@@ -296,11 +283,17 @@ var GridStack = /** @class */ (function () {
             return null;
         // create the grid element, but check if the passed 'parent' already has grid styling and should be used instead
         var el = parent;
-        if (!parent.classList.contains('grid-stack')) {
-            var doc = document.implementation.createHTMLDocument(''); // IE needs a param
-            doc.body.innerHTML = "<div class=\"grid-stack " + (opt.class || '') + "\"></div>";
-            el = doc.body.children[0];
-            parent.appendChild(el);
+        var parentIsGrid = parent.classList.contains('grid-stack');
+        if (!parentIsGrid || opt.addRemoveCB) {
+            if (opt.addRemoveCB) {
+                el = opt.addRemoveCB(parent, opt, true, true);
+            }
+            else {
+                var doc = document.implementation.createHTMLDocument(''); // IE needs a param
+                doc.body.innerHTML = "<div class=\"grid-stack " + (opt.class || '') + "\"></div>";
+                el = doc.body.children[0];
+                parent.appendChild(el);
+            }
         }
         // create grid class and load any children
         var grid = GridStack.init(opt, el);
@@ -348,7 +341,7 @@ var GridStack = /** @class */ (function () {
      */
     GridStack.prototype.addWidget = function (els, options) {
         function isGridStackWidget(w) {
-            return w.x !== undefined || w.y !== undefined || w.w !== undefined || w.h !== undefined || w.content !== undefined ? true : false;
+            return w.el !== undefined || w.x !== undefined || w.y !== undefined || w.w !== undefined || w.h !== undefined || w.content !== undefined ? true : false;
         }
         var el;
         var node;
@@ -363,7 +356,7 @@ var GridStack = /** @class */ (function () {
                 el = node.el; // re-use element stored in the node
             }
             else if (this.opts.addRemoveCB) {
-                el = this.opts.addRemoveCB(this, options, true);
+                el = this.opts.addRemoveCB(this.el, options, true, false);
             }
             else {
                 var content = (options === null || options === void 0 ? void 0 : options.content) || '';
@@ -396,7 +389,7 @@ var GridStack = /** @class */ (function () {
         this._updateContainerHeight();
         // see if there is a sub-grid to create
         if (node.subGrid) {
-            this.makeSubGrid(node.el, undefined, undefined, false);
+            this.makeSubGrid(node.el, undefined, undefined, false); //node.subGrid will be used as option in method, no need to pass
         }
         // if we're adding an item into 1 column (_prevColumn is set only when going to 1) make sure
         // we don't override the larger 12 column layout that was already saved. #1985
@@ -443,16 +436,11 @@ var GridStack = /** @class */ (function () {
             ops.disableOneColumnMode = true; // driven by parent
         }
         // if we're converting an existing full item, move over the content to be the first sub item in the new grid
-        // TODO: support this.opts.addRemoveCB for frameworks
         var content = node.el.querySelector('.grid-stack-item-content');
         var newItem;
         var newItemOpt;
         if (saveContent) {
             this._removeDD(node.el); // remove D&D since it's set on content div
-            var doc = document.implementation.createHTMLDocument(''); // IE needs a param
-            doc.body.innerHTML = "<div class=\"grid-stack-item\"></div>";
-            newItem = doc.body.children[0];
-            newItem.appendChild(content);
             newItemOpt = __assign(__assign({}, node), { x: 0, y: 0 });
             utils_1.Utils.removeInternalForSave(newItemOpt);
             delete newItemOpt.subGrid;
@@ -460,9 +448,18 @@ var GridStack = /** @class */ (function () {
                 newItemOpt.content = node.content;
                 delete node.content;
             }
-            doc.body.innerHTML = "<div class=\"grid-stack-item-content\"></div>";
-            content = doc.body.children[0];
-            node.el.appendChild(content);
+            if (this.opts.addRemoveCB) {
+                newItem = this.opts.addRemoveCB(this.el, newItemOpt, true, false);
+            }
+            else {
+                var doc = document.implementation.createHTMLDocument(''); // IE needs a param
+                doc.body.innerHTML = "<div class=\"grid-stack-item\"></div>";
+                newItem = doc.body.children[0];
+                newItem.appendChild(content);
+                doc.body.innerHTML = "<div class=\"grid-stack-item-content\"></div>";
+                content = doc.body.children[0];
+                node.el.appendChild(content);
+            }
             this._prepareDragDropByNode(node); // ... and restore original D&D
         }
         // if we're adding an additional item, make the container large enough to have them both
@@ -474,6 +471,9 @@ var GridStack = /** @class */ (function () {
             this.update(node.el, { w: w, h: h });
             setTimeout(function () { return style_1.transition = null; }); // recover animation
         }
+        if (this.opts.addRemoveCB) {
+            ops.addRemoveCB = ops.addRemoveCB || this.opts.addRemoveCB;
+        }
         var subGrid = node.subGrid = GridStack.addGrid(content, ops);
         if (nodeToAdd === null || nodeToAdd === void 0 ? void 0 : nodeToAdd._moving)
             subGrid._isTemp = true; // prevent re-nesting as we add over
@@ -514,6 +514,8 @@ var GridStack = /** @class */ (function () {
             pGrid.addWidget(n.el, n);
         });
         pGrid.batchUpdate(false);
+        if (this.parentGridItem)
+            delete this.parentGridItem.subGrid;
         delete this.parentGridItem;
         // create an artificial event for the original grid now that this one is gone (got a leave, but won't get enter)
         if (nodeThatRemoved) {
@@ -624,7 +626,7 @@ var GridStack = /** @class */ (function () {
                 var item = items.find(function (w) { return n.id === w.id; });
                 if (!item) {
                     if (_this.opts.addRemoveCB)
-                        _this.opts.addRemoveCB(_this, n, false);
+                        _this.opts.addRemoveCB(_this.el, n, false, false);
                     removed.push(n); // batch keep track
                     _this.removeWidget(n.el, true, false);
                 }
@@ -826,6 +828,8 @@ var GridStack = /** @class */ (function () {
         }
         this._removeStylesheet();
         this.el.removeAttribute('gs-current-row');
+        if (this.parentGridItem)
+            delete this.parentGridItem.subGrid;
         delete this.parentGridItem;
         delete this.opts;
         delete this._placeholder;
@@ -1254,7 +1258,9 @@ var GridStack = /** @class */ (function () {
         if (!this._styles) {
             // insert style to parent (instead of 'head' by default) to support WebComponent
             var styleLocation = this.opts.styleInHead ? undefined : this.el.parentNode;
-            this._styles = utils_1.Utils.createStylesheet(this._styleSheetClass, styleLocation);
+            this._styles = utils_1.Utils.createStylesheet(this._styleSheetClass, styleLocation, {
+                nonce: this.opts.nonce,
+            });
             if (!this._styles)
                 return this;
             this._styles._max = 0;
@@ -2112,7 +2118,9 @@ var GridStack = /** @class */ (function () {
                 return; // handled by dropover
             var distance = ui.position.top - node._prevYPix;
             node._prevYPix = ui.position.top;
-            utils_1.Utils.updateScrollPosition(el, ui.position, distance);
+            if (this.opts.draggable.scroll !== false) {
+                utils_1.Utils.updateScrollPosition(el, ui.position, distance);
+            }
             // get new position taking into account the margin in the direction we are moving! (need to pass mid point by margin)
             var left = ui.position.left + (ui.position.left > node._lastUiPosition.left ? -mRight : mLeft);
             var top_2 = ui.position.top + (ui.position.top > node._lastUiPosition.top ? -mBottom : mTop);
@@ -2219,7 +2227,7 @@ var GridStack = /** @class */ (function () {
     GridStack.Utils = utils_1.Utils;
     /** scoping so users can call new GridStack.Engine(12) for example */
     GridStack.Engine = gridstack_engine_1.GridStackEngine;
-    GridStack.GDRev = '7.2.2';
+    GridStack.GDRev = '7.3.0';
     return GridStack;
 }());
 exports.GridStack = GridStack;