Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
gridstack
Advanced tools
gridstack - npm Package Compare versions
Comparing version 3.3.0 to 4.0.0
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| import { GridStackDDI } from './gridstack-ddi'; | ||
@@ -7,0 +2,0 @@ import { GridItemHTMLElement, GridStackElement, DDDragInOpt } from './types'; |
| "use strict"; | ||
| // gridstack-GridStackDD.get().ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // gridstack-GridStackDD.get().ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| /* eslint-disable @typescript-eslint/no-unused-vars */ | ||
@@ -38,3 +34,3 @@ const gridstack_ddi_1 = require("./gridstack-ddi"); | ||
| ********************************************************************************/ | ||
| /** @internal called to add drag over support to support widgets */ | ||
| /** @internal called to add drag over to support widgets being added externally */ | ||
| gridstack_1.GridStack.prototype._setupAcceptWidget = function () { | ||
@@ -51,32 +47,35 @@ if (this.opts.staticGrid) | ||
| } | ||
| let onDrag = (event, el) => { | ||
| // vars shared across all methods | ||
| let gridPos; | ||
| let cellHeight, cellWidth; | ||
| let onDrag = (event, el, helper) => { | ||
| let node = el.gridstackNode; | ||
| let pos = this.getCellFromPixel({ left: event.pageX, top: event.pageY }, true); | ||
| let x = Math.max(0, pos.x); | ||
| let y = Math.max(0, pos.y); | ||
| if (!node._added) { | ||
| node.x = x; | ||
| node.y = y; | ||
| if (!node) | ||
| return; | ||
| helper = helper || el; | ||
| // let left = event.pageX - gridPos.left; | ||
| // let top = event.pageY - gridPos.top; | ||
| let rec = helper.getBoundingClientRect(); | ||
| let left = rec.left - gridPos.left; | ||
| let top = rec.top - gridPos.top; | ||
| let ui = { position: { top, left } }; | ||
| if (node._temporaryRemoved) { | ||
| node.x = Math.max(0, Math.round(left / cellWidth)); | ||
| node.y = Math.max(0, Math.round(top / cellHeight)); | ||
| delete node.autoPosition; | ||
| this.engine.nodeBoundFix(node); | ||
| // don't accept *initial* location if doesn't fit #1419 (locked drop region, or can't grow), but maybe try if it will go somewhere | ||
| if (!this.engine.willItFit(node)) { | ||
| node.autoPosition = true; // ignore x,y and try for any slot... | ||
| if (!this.engine.willItFit(node)) | ||
| if (!this.engine.willItFit(node)) { | ||
| GridStackDD.get().off(el, 'drag'); // stop calling us | ||
| return; // full grid or can't grow | ||
| } | ||
| } | ||
| node._added = true; | ||
| node.el = el; | ||
| this.engine.cleanNodes(); | ||
| this.engine.beginUpdate(node); | ||
| this.engine.addNode(node); | ||
| this._writePosAttr(this.placeholder, node.x, node.y, node.w, node.h); | ||
| this.el.appendChild(this.placeholder); | ||
| node.el = this.placeholder; // dom we update while dragging... | ||
| node._beforeDragX = node.x; | ||
| node._beforeDragY = node.y; | ||
| this._updateContainerHeight(); | ||
| // re-use the existing node dragging method | ||
| this._onStartMoving(event, ui, node, cellWidth, cellHeight); | ||
| } | ||
| else if ((x !== node.x || y !== node.y) && this.engine.canMoveNode(node, x, y)) { | ||
| this.engine.moveNode(node, x, y); | ||
| this._updateContainerHeight(); | ||
| else { | ||
| // re-use the existing node dragging that does so much of the collision detection | ||
| this._dragOrResize(event, ui, node, cellWidth, cellHeight); | ||
| } | ||
@@ -108,9 +107,23 @@ }; | ||
| }) | ||
| .on(this.el, 'dropover', (event, el) => { | ||
| // ignore drop enter on ourself, and prevent parent from receiving event | ||
| /** | ||
| * entering our grid area | ||
| */ | ||
| .on(this.el, 'dropover', (event, el, helper) => { | ||
| let node = el.gridstackNode; | ||
| if (node && node.grid === this) { | ||
| delete node._added; // reset this to track placeholder again in case we were over other grid #1484 (dropout doesn't always clear) | ||
| return false; | ||
| // ignore drop enter on ourself (unless we temporarily removed) which happens on a simple drag of our item | ||
| if (node && node.grid === this && !node._temporaryRemoved) { | ||
| // delete node._added; // reset this to track placeholder again in case we were over other grid #1484 (dropout doesn't always clear) | ||
| return false; // prevent parent from receiving msg (which may be a grid as well) | ||
| } | ||
| // fix #1578 when dragging fast, we may not get a leave on the previous grid so force one now | ||
| if (node && node.grid && node.grid !== this && !node._temporaryRemoved) { | ||
| // TEST console.log('dropover without leave'); | ||
| let otherGrid = node.grid; | ||
| otherGrid._leave(el.gridstackNode, el, helper, true); // MATCH line 222 | ||
| } | ||
| // get grid screen coordinates and cell dimensions | ||
| let box = this.el.getBoundingClientRect(); | ||
| gridPos = { top: box.top + document.documentElement.scrollTop, left: box.left }; | ||
| cellWidth = this.cellWidth(); | ||
| cellHeight = this.getCellHeight(true); | ||
| // load any element attributes if we don't have a node | ||
@@ -120,46 +133,60 @@ if (!node) { | ||
| } | ||
| // if the item came from another grid, let it know it was added here to removed duplicate shadow #393 | ||
| if (!node.grid) { | ||
| node._isExternal = true; | ||
| el.gridstackNode = node; | ||
| } | ||
| // calculate the grid size based on element outer size | ||
| helper = helper || el; | ||
| let w = node.w || Math.round(helper.offsetWidth / cellWidth) || 1; | ||
| let h = node.h || Math.round(helper.offsetHeight / cellHeight) || 1; | ||
| // if the item came from another grid, make a copy and save the original info in case we go back there | ||
| if (node.grid && node.grid !== this) { | ||
| node._added = true; | ||
| // copy the node original values (min/max/id/etc...) but override width/height/other flags which are this grid specific | ||
| // TEST console.log('dropover cloning node'); | ||
| if (!el._gridstackNodeOrig) | ||
| el._gridstackNodeOrig = node; // shouldn't have multiple nested! | ||
| el.gridstackNode = node = Object.assign(Object.assign({}, node), { w, h, grid: this }); | ||
| this.engine.cleanupNode(node) | ||
| .nodeBoundFix(node); | ||
| // restore some internal fields we need after clearing them all | ||
| node._initDD = | ||
| node._isExternal = // DOM needs to be re-parented on a drop | ||
| node._temporaryRemoved = true; | ||
| } | ||
| // if not calculate the grid size based on element outer size | ||
| let w = node.w || Math.round(el.offsetWidth / this.cellWidth()) || 1; | ||
| let h = node.h || Math.round(el.offsetHeight / this.getCellHeight(true)) || 1; | ||
| // copy the node original values (min/max/id/etc...) but override width/height/other flags which are this grid specific | ||
| let newNode = this.engine.prepareNode(Object.assign(Object.assign({}, node), { w, h, _added: false, _temporary: true })); | ||
| newNode._isOutOfGrid = true; | ||
| el.gridstackNode = newNode; | ||
| el._gridstackNodeOrig = node; | ||
| else { | ||
| node.w = w; | ||
| node.h = h; | ||
| node._temporaryRemoved = true; // so we can insert it | ||
| } | ||
| // we're entering this grid (even if we left another) | ||
| delete node._isCursorOutside; | ||
| GridStackDD.get().on(el, 'drag', onDrag); | ||
| return false; // prevent parent from receiving msg (which may be grid as well) | ||
| // make sure this is called at least once when going fast #1578 | ||
| onDrag(event, el, helper); | ||
| return false; // prevent parent from receiving msg (which may be a grid as well) | ||
| }) | ||
| .on(this.el, 'dropout', (event, el) => { | ||
| /** | ||
| * Leaving our grid area... | ||
| */ | ||
| .on(this.el, 'dropout', (event, el, helper) => { | ||
| let node = el.gridstackNode; | ||
| if (!node) | ||
| return; | ||
| // clear any added flag now that we are leaving #1484 | ||
| delete node._added; | ||
| // jquery-ui bug. Must verify widget is being dropped out | ||
| // check node variable that gets set when widget is out of grid | ||
| if (!node._isOutOfGrid) { | ||
| return; | ||
| // fix #1578 when dragging fast, we might get leave after other grid gets enter (which calls us to clean) | ||
| // so skip this one if we're not the active grid really.. | ||
| if (!node.grid || node.grid === this) { | ||
| this._leave(node, el, helper, true); // MATCH line 166 | ||
| } | ||
| GridStackDD.get().off(el, 'drag'); | ||
| node.el = null; | ||
| this.engine.removeNode(node); | ||
| if (this.placeholder.parentNode === this.el) { | ||
| this.placeholder.remove(); | ||
| } | ||
| this._updateContainerHeight(); | ||
| el.gridstackNode = el._gridstackNodeOrig; | ||
| return false; // prevent parent from receiving msg (which may be grid as well) | ||
| }) | ||
| /** | ||
| * end - releasing the mouse | ||
| */ | ||
| .on(this.el, 'drop', (event, el, helper) => { | ||
| let node = el.gridstackNode; | ||
| // ignore drop on ourself from ourself that didn't come from the outside - dragend will handle the simple move instead | ||
| if (node && node.grid === this && !node._isExternal) | ||
| return false; | ||
| let wasAdded = !!this.placeholder.parentElement; // skip items not actually added to us because of constrains, but do cleanup #1419 | ||
| // ignore drop on ourself from ourself - dragend will handle the simple move instead | ||
| if (node && node.grid === this) | ||
| return false; | ||
| this.placeholder.remove(); | ||
| // notify previous grid of removal | ||
| // TEST console.log('drop delete _gridstackNodeOrig') | ||
| let origNode = el._gridstackNodeOrig; | ||
@@ -169,4 +196,2 @@ delete el._gridstackNodeOrig; | ||
| let oGrid = origNode.grid; | ||
| oGrid.placeholder.remove(); | ||
| origNode.el = el; // was using placeholder, have it point to node we've moved instead | ||
| oGrid.engine.removedNodes.push(origNode); | ||
@@ -179,5 +204,3 @@ oGrid._triggerRemoveEvent(); | ||
| if (wasAdded) { | ||
| const _id = node._id; | ||
| this.engine.cleanupNode(node); // removes all internal _xyz values (including the _id so add that back) | ||
| node._id = _id; | ||
| this.engine.cleanupNode(node); // removes all internal _xyz values | ||
| node.grid = this; | ||
@@ -187,3 +210,3 @@ } | ||
| // if we made a copy ('helper' which is temp) of the original node then insert a copy, else we move the original node (#1102) | ||
| // as the helper will be nuked by jqueryui otherwise | ||
| // as the helper will be nuked by jquery-ui otherwise | ||
| if (helper !== el) { | ||
@@ -204,2 +227,3 @@ helper.remove(); | ||
| node.el = el; | ||
| utils_1.Utils.copyPos(node, this._readAttr(this.placeholder)); // placeholder values as moving VERY fast can throw things off #1578 | ||
| utils_1.Utils.removePositioningStyles(el); | ||
@@ -217,6 +241,10 @@ this._writeAttr(el, node); | ||
| // wait till we return out of the drag callback to set the new drag&resize handler or they may get messed up | ||
| // IFF we are still there (some application will use as placeholder and insert their real widget instead) | ||
| window.setTimeout(() => { | ||
| if (node.el && node.el.parentElement) | ||
| // IFF we are still there (some application will use as placeholder and insert their real widget instead and better call makeWidget()) | ||
| if (node.el && node.el.parentElement) { | ||
| this._prepareDragDropByNode(node); | ||
| } | ||
| else { | ||
| this.engine.removeNode(node); | ||
| } | ||
| }); | ||
@@ -233,3 +261,3 @@ return false; // prevent parent from receiving msg (which may be grid as well) | ||
| return this; | ||
| // only register ONE dropover/dropout callback for the 'trash', and it will | ||
| // only register ONE drop-over/dropout callback for the 'trash', and it will | ||
| // update the passed in item and parent grid because the 'trash' is a shared resource anyway, | ||
@@ -243,4 +271,4 @@ // and Native DD only has 1 event CB (having a list and technically a per grid removableOptions complicates things greatly) | ||
| return; | ||
| el.dataset.inTrashZone = 'true'; | ||
| node.grid._setupRemovingTimeout(el); | ||
| node._isAboutToRemove = true; | ||
| el.classList.add('grid-stack-item-removing'); | ||
| }) | ||
@@ -251,4 +279,4 @@ .on(trashEl, 'dropout', function (event, el) { | ||
| return; | ||
| delete el.dataset.inTrashZone; | ||
| node.grid._clearRemovingTimeout(el); | ||
| delete node._isAboutToRemove; | ||
| el.classList.remove('grid-stack-item-removing'); | ||
| }); | ||
@@ -259,33 +287,29 @@ } | ||
| }; | ||
| /** @internal */ | ||
| gridstack_1.GridStack.prototype._setupRemovingTimeout = function (el) { | ||
| let node = el.gridstackNode; | ||
| if (!node || node._removeTimeout || !this.opts.removable) | ||
| return this; | ||
| node._removeTimeout = window.setTimeout(() => { | ||
| el.classList.add('grid-stack-item-removing'); | ||
| node._isAboutToRemove = true; | ||
| }, this.opts.removeTimeout); | ||
| return this; | ||
| /** | ||
| * call to setup dragging in from the outside (say toolbar), by specifying the class selection and options. | ||
| * Called during GridStack.init() as options, but can also be called directly (last param are cached) in case the toolbar | ||
| * is dynamically create and needs to change later. | ||
| **/ | ||
| gridstack_1.GridStack.setupDragIn = function (_dragIn, _dragInOptions) { | ||
| // cache in the passed in values (form grid init?) so they don't have to resend them each time | ||
| if (_dragIn) { | ||
| dragIn = _dragIn; | ||
| dragInOptions = Object.assign(Object.assign({}, dragInDefaultOptions), (_dragInOptions || {})); | ||
| } | ||
| if (typeof dragIn !== 'string') | ||
| return; | ||
| let dd = GridStackDD.get(); | ||
| utils_1.Utils.getElements(dragIn).forEach(el => { | ||
| if (!dd.isDraggable(el)) | ||
| dd.dragIn(el, dragInOptions); | ||
| }); | ||
| }; | ||
| /** @internal */ | ||
| gridstack_1.GridStack.prototype._clearRemovingTimeout = function (el) { | ||
| let node = el.gridstackNode; | ||
| if (!node || !node._removeTimeout) | ||
| return this; | ||
| clearTimeout(node._removeTimeout); | ||
| delete node._removeTimeout; | ||
| el.classList.remove('grid-stack-item-removing'); | ||
| delete node._isAboutToRemove; | ||
| return this; | ||
| let dragIn; | ||
| let dragInOptions; | ||
| const dragInDefaultOptions = { | ||
| revert: 'invalid', | ||
| handle: '.grid-stack-item-content', | ||
| scroll: false, | ||
| appendTo: 'body' | ||
| }; | ||
| /** @internal call to setup dragging in from the outside (say toolbar), with options */ | ||
| gridstack_1.GridStack.prototype._setupDragIn = function () { | ||
| if (!this.opts.staticGrid && typeof this.opts.dragIn === 'string') { | ||
| if (!GridStackDD.get().isDraggable(this.opts.dragIn)) { | ||
| GridStackDD.get().dragIn(this.opts.dragIn, this.opts.dragInOptions); | ||
| } | ||
| } | ||
| return this; | ||
| }; | ||
| /** @internal prepares the element for drag&drop **/ | ||
@@ -322,96 +346,19 @@ gridstack_1.GridStack.prototype._prepareDragDropByNode = function (node) { | ||
| let onStartMoving = (event, ui) => { | ||
| let target = event.target; | ||
| // trigger any 'dragstart' / 'resizestart' manually | ||
| if (this._gsEventHandler[event.type]) { | ||
| this._gsEventHandler[event.type](event, target); | ||
| this._gsEventHandler[event.type](event, event.target); | ||
| } | ||
| this.engine.cleanNodes(); | ||
| this.engine.beginUpdate(node); | ||
| this._writePosAttr(this.placeholder, node.x, node.y, node.w, node.h); | ||
| this.el.append(this.placeholder); | ||
| node.el = this.placeholder; | ||
| node._beforeDragX = node.x; | ||
| node._beforeDragY = node.y; | ||
| node._prevYPix = ui.position.top; | ||
| // set the min/max resize info | ||
| cellWidth = this.cellWidth(); | ||
| cellHeight = this.getCellHeight(true); // force pixels for calculations | ||
| GridStackDD.get().resizable(el, 'option', 'minWidth', cellWidth * (node.minW || 1)); | ||
| GridStackDD.get().resizable(el, 'option', 'minHeight', cellHeight * (node.minH || 1)); | ||
| if (node.maxW) { | ||
| GridStackDD.get().resizable(el, 'option', 'maxWidth', cellWidth * node.maxW); | ||
| } | ||
| if (node.maxH) { | ||
| GridStackDD.get().resizable(el, 'option', 'maxHeight', cellHeight * node.maxH); | ||
| } | ||
| this._onStartMoving(event, ui, node, cellWidth, cellHeight); | ||
| }; | ||
| /** called when item is being dragged/resized */ | ||
| let dragOrResize = (event, ui) => { | ||
| let x = Math.round(ui.position.left / cellWidth); | ||
| let y = Math.round(ui.position.top / cellHeight); | ||
| let w; | ||
| let h; | ||
| let resizing; | ||
| if (event.type === 'drag') { | ||
| let distance = ui.position.top - node._prevYPix; | ||
| node._prevYPix = ui.position.top; | ||
| utils_1.Utils.updateScrollPosition(el, ui.position, distance); | ||
| // if inTrash, outside of the bounds or added to another grid (#393) temporarily remove it from us | ||
| if (el.dataset.inTrashZone || node._added || this.engine.isOutside(x, y, node)) { | ||
| if (node._temporaryRemoved) | ||
| return; | ||
| if (this.opts.removable === true) { | ||
| this._setupRemovingTimeout(el); | ||
| } | ||
| x = node._beforeDragX; | ||
| y = node._beforeDragY; | ||
| if (this.placeholder.parentNode === this.el) { | ||
| this.placeholder.remove(); | ||
| } | ||
| this.engine.removeNode(node); | ||
| this._updateContainerHeight(); | ||
| node._temporaryRemoved = true; | ||
| delete node._added; // no need for this now | ||
| } | ||
| else { | ||
| this._clearRemovingTimeout(el); | ||
| if (node._temporaryRemoved) { | ||
| this.engine.addNode(node); | ||
| this._writePosAttr(this.placeholder, x, y, w, h); | ||
| this.el.appendChild(this.placeholder); | ||
| node.el = this.placeholder; | ||
| delete node._temporaryRemoved; | ||
| } | ||
| } | ||
| if (node._lastTriedX === x && node._lastTriedY === y) | ||
| return; | ||
| } | ||
| else if (event.type === 'resize') { | ||
| if (x < 0) | ||
| return; | ||
| // Scrolling page if needed | ||
| utils_1.Utils.updateScrollResize(event, el, cellHeight); | ||
| w = Math.round(ui.size.width / cellWidth); | ||
| h = Math.round(ui.size.height / cellHeight); | ||
| if (w === node.w && h === node.h) | ||
| return; | ||
| resizing = true; | ||
| } | ||
| if (!this.engine.canMoveNode(node, x, y, w, h)) | ||
| return; | ||
| node._lastTriedX = x; | ||
| node._lastTriedY = y; | ||
| node._lastTriedW = w; | ||
| node._lastTriedH = h; | ||
| this.engine.moveNode(node, x, y, w, h); | ||
| if (resizing && node.subGrid) { | ||
| node.subGrid.onParentResize(); | ||
| } | ||
| this._updateContainerHeight(); | ||
| this._dragOrResize(event, ui, node, cellWidth, cellHeight); | ||
| }; | ||
| /** called when the item stops moving/resizing */ | ||
| let onEndMoving = (event) => { | ||
| if (this.placeholder.parentNode === this.el) { | ||
| this.placeholder.remove(); | ||
| } | ||
| this.placeholder.remove(); | ||
| delete node._moving; | ||
| delete node._lastTried; | ||
| // if the item has moved to another grid, we're done here | ||
@@ -427,22 +374,21 @@ let target = event.target; | ||
| } | ||
| GridStackDD.get().remove(el); | ||
| gridToNotify.engine.removedNodes.push(node); | ||
| GridStackDD.get().remove(el); | ||
| delete el.gridstackNode; // hint we're removing it next and break circular link | ||
| gridToNotify._triggerRemoveEvent(); | ||
| if (el.parentElement) { | ||
| el.remove(); // finally remove it | ||
| } | ||
| // break circular links and remove DOM | ||
| delete el.gridstackNode; | ||
| delete node.el; | ||
| el.remove(); | ||
| } | ||
| else { | ||
| this._clearRemovingTimeout(el); | ||
| if (!node._temporaryRemoved) { | ||
| // move to new placeholder location | ||
| utils_1.Utils.removePositioningStyles(target); | ||
| this._writePosAttr(target, node.x, node.y, node.w, node.h); | ||
| this._writePosAttr(target, node); | ||
| } | ||
| else { | ||
| // got removed - restore item back to before dragging position | ||
| utils_1.Utils.removePositioningStyles(target); | ||
| this._writePosAttr(target, node._beforeDragX, node._beforeDragY, node.w, node.h); | ||
| node.x = node._beforeDragX; | ||
| node.y = node._beforeDragY; | ||
| delete node._temporaryRemoved; | ||
| utils_1.Utils.copyPos(node, node._orig); | ||
| this._writePosAttr(target, node); | ||
| this.engine.addNode(node); | ||
@@ -457,8 +403,2 @@ } | ||
| this.engine.endUpdate(); | ||
| /* doing it on live resize instead | ||
| // if we re-sized a nested grid item, let the children resize as well | ||
| if (event.type === 'resizestop') { | ||
| if (target.gridstackNode.subGrid) {(target.gridstackNode.subGrid as GridStack).onParentResize()} | ||
| } | ||
| */ | ||
| }; | ||
@@ -486,2 +426,136 @@ GridStackDD.get() | ||
| }; | ||
| /** @internal called when item is starting a drag/resize */ | ||
| gridstack_1.GridStack.prototype._onStartMoving = function (event, ui, node, cellWidth, cellHeight) { | ||
| this.engine.cleanNodes() | ||
| .beginUpdate(node); | ||
| this._writePosAttr(this.placeholder, node); | ||
| this.el.appendChild(this.placeholder); | ||
| // TEST console.log('_onStartMoving placeholder') | ||
| node.el = this.placeholder; | ||
| node._lastUiPosition = ui.position; | ||
| node._prevYPix = ui.position.top; | ||
| node._moving = (event.type === 'dragstart'); // 'dropover' are not initially moving so they can go exactly where they enter (will push stuff out of the way) | ||
| delete node._lastTried; | ||
| delete node._isCursorOutside; | ||
| if (event.type === 'dropover' && node._temporaryRemoved) { | ||
| // TEST console.log('engine.addNode x=' + node.x); | ||
| this.engine.addNode(node); // will add, fix collisions, update attr and clear _temporaryRemoved | ||
| node._moving = true; // AFTER, mark as moving object (wanted fix location before) | ||
| } | ||
| // set the min/max resize info | ||
| this.engine.cacheRects(cellWidth, cellHeight, this.opts.marginTop, this.opts.marginRight, this.opts.marginBottom, this.opts.marginLeft); | ||
| if (event.type === 'resizestart') { | ||
| let el = node.el; | ||
| let dd = GridStackDD.get() | ||
| .resizable(el, 'option', 'minWidth', cellWidth * (node.minW || 1)) | ||
| .resizable(el, 'option', 'minHeight', cellHeight * (node.minH || 1)); | ||
| if (node.maxW) { | ||
| dd.resizable(el, 'option', 'maxWidth', cellWidth * node.maxW); | ||
| } | ||
| if (node.maxH) { | ||
| dd.resizable(el, 'option', 'maxHeight', cellHeight * node.maxH); | ||
| } | ||
| } | ||
| }; | ||
| /** @internal called when item leaving our area by either cursor dropout event | ||
| * or shape is outside our boundaries. remove it from us, and mark temporary if this was | ||
| * our item to start with else restore prev node values from prev grid it came from. | ||
| **/ | ||
| gridstack_1.GridStack.prototype._leave = function (node, el, helper, dropoutEvent = false) { | ||
| if (!node) | ||
| return; | ||
| if (dropoutEvent) { | ||
| node._isCursorOutside = true; | ||
| GridStackDD.get().off(el, 'drag'); // no need to track while being outside | ||
| } | ||
| // this gets called when cursor leaves and shape is outside, so only do this once | ||
| if (node._temporaryRemoved) | ||
| return; | ||
| node._temporaryRemoved = true; | ||
| this.engine.removeNode(node); // remove placeholder as well | ||
| node.el = node._isExternal && helper ? helper : el; // point back to real item being dragged | ||
| // finally if item originally came from another grid, but left us, restore things back to prev info | ||
| if (el._gridstackNodeOrig) { | ||
| // TEST console.log('leave delete _gridstackNodeOrig') | ||
| el.gridstackNode = el._gridstackNodeOrig; | ||
| delete el._gridstackNodeOrig; | ||
| } | ||
| else if (node._isExternal) { | ||
| // item came from outside (like a toolbar) so nuke any node info | ||
| delete node.el; | ||
| delete el.gridstackNode; | ||
| // and restore all nodes back to original | ||
| this.engine.restoreInitial(); | ||
| } | ||
| }; | ||
| /** @internal called when item is being dragged/resized */ | ||
| gridstack_1.GridStack.prototype._dragOrResize = function (event, ui, node, cellWidth, cellHeight) { | ||
| let el = node.el || event.target; | ||
| // calculate the place where we're landing by offsetting margin so actual edge crosses mid point | ||
| let left = ui.position.left + (ui.position.left > node._lastUiPosition.left ? -this.opts.marginRight : this.opts.marginLeft); | ||
| let top = ui.position.top + (ui.position.top > node._lastUiPosition.top ? -this.opts.marginBottom : this.opts.marginTop); | ||
| let x = Math.round(left / cellWidth); | ||
| let y = Math.round(top / cellHeight); | ||
| let w = node.w; | ||
| let h = node.h; | ||
| let resizing; | ||
| if (event.type === 'drag') { | ||
| if (node._isCursorOutside) | ||
| return; // handled by dropover | ||
| let distance = ui.position.top - node._prevYPix; | ||
| node._prevYPix = ui.position.top; | ||
| utils_1.Utils.updateScrollPosition(el, ui.position, distance); | ||
| // if inTrash or outside of the bounds (but not external which is handled by 'dropout' event), temporarily remove it from us | ||
| if (node._isAboutToRemove || (!node._isExternal && this.engine.isOutside(x, y, node))) { | ||
| this._leave(node, event.target); | ||
| } | ||
| else { | ||
| if (node._temporaryRemoved) { | ||
| node.el = this.placeholder; | ||
| this.engine.addNode(node); | ||
| this.el.appendChild(this.placeholder); | ||
| // TEST console.log('drag placeholder'); | ||
| delete node._temporaryRemoved; | ||
| } | ||
| } | ||
| if (node.x === x && node.y === y) | ||
| return; // skip same | ||
| // DON'T skip one we tried as we might have failed because of coverage <50% before | ||
| // if (node._lastTried && node._lastTried.x === x && node._lastTried.y === y) return; | ||
| } | ||
| else if (event.type === 'resize') { | ||
| if (x < 0) | ||
| return; | ||
| // Scrolling page if needed | ||
| utils_1.Utils.updateScrollResize(event, el, cellHeight); | ||
| w = Math.round(ui.size.width / cellWidth); | ||
| h = Math.round(ui.size.height / cellHeight); | ||
| if (node.w === w && node.h === h) | ||
| return; | ||
| if (node._lastTried && node._lastTried.w === w && node._lastTried.h === h) | ||
| return; // skip one we tried (but failed) | ||
| resizing = true; | ||
| } | ||
| node._lastTried = { x, y, w, h }; // set as last tried (will nuke if we go there) | ||
| let rect = { | ||
| x: ui.position.left + this.opts.marginLeft, | ||
| y: ui.position.top + this.opts.marginTop, | ||
| w: (ui.size ? ui.size.width : node.w * cellWidth) - this.opts.marginLeft - this.opts.marginRight, | ||
| h: (ui.size ? ui.size.height : node.h * cellHeight) - this.opts.marginTop - this.opts.marginBottom | ||
| }; | ||
| if (this.engine.moveNodeCheck(node, { x, y, w, h, cellWidth, cellHeight, rect })) { | ||
| node._lastUiPosition = ui.position; | ||
| this.engine.cacheRects(cellWidth, cellHeight, this.opts.marginTop, this.opts.marginRight, this.opts.marginBottom, this.opts.marginLeft); | ||
| delete node._skipDown; | ||
| if (resizing && node.subGrid) { | ||
| node.subGrid.onParentResize(); | ||
| } | ||
| this._updateContainerHeight(); | ||
| let target = event.target; | ||
| this._writePosAttr(target, node); | ||
| if (this._gsEventHandler[event.type]) { | ||
| this._gsEventHandler[event.type](event, target); | ||
| } | ||
| } | ||
| }; | ||
| /** | ||
@@ -488,0 +562,0 @@ * Enables/Disables moving. |
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| import { GridItemHTMLElement } from './types'; | ||
@@ -7,0 +2,0 @@ /** |
| "use strict"; | ||
| // gridstack-ddi.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -4,0 +3,0 @@ /** |
@@ -1,2 +0,2 @@ | ||
| import { GridStackNode } from './types'; | ||
| import { GridStackNode, GridStackPosition, GridStackMoveOpts } from './types'; | ||
| export declare type onChangeCB = (nodes: GridStackNode[], removeDOM?: boolean) => void; | ||
@@ -28,4 +28,12 @@ /** options used for creations - similar to GridStackOptions */ | ||
| commit(): GridStackEngine; | ||
| /** return any intercepted node with the given area, skipping the passed in node (usually self) */ | ||
| collide(node: GridStackNode, area?: GridStackNode): GridStackNode; | ||
| private _useEntireRowArea; | ||
| /** return the nodes that intercept the given node. Optionally a different area can be used, as well as a second node to skip */ | ||
| collide(skip: GridStackNode, area?: GridStackNode, skip2?: GridStackNode): GridStackNode; | ||
| collideAll(skip: GridStackNode, area?: GridStackNode, skip2?: GridStackNode): GridStackNode[]; | ||
| /** does a pixel coverage collision, returning the node that has the most coverage that is >50% mid line */ | ||
| collideCoverage(node: GridStackNode, o: GridStackMoveOpts, collides: GridStackNode[]): GridStackNode; | ||
| /** called to cache the nodes pixel rectangles used for collision detection during drag */ | ||
| cacheRects(w: number, h: number, top: number, right: number, bottom: number, left: number): GridStackEngine; | ||
| /** called to possibly swap between 2 nodes (same size or column, not locked, touching), returning true if successful */ | ||
| swap(a: GridStackNode, b: GridStackNode): boolean; | ||
| isAreaEmpty(x: number, y: number, w: number, h: number): boolean; | ||
@@ -43,8 +51,13 @@ /** re-layout grid items to reclaim any empty space */ | ||
| prepareNode(node: GridStackNode, resizing?: boolean): GridStackNode; | ||
| /** part2 of preparing a node to fit inside our grid - checks for x,y from grid dimensions */ | ||
| nodeBoundFix(node: GridStackNode, resizing?: boolean): GridStackNode; | ||
| getDirtyNodes(verify?: boolean): GridStackNode[]; | ||
| cleanNodes(): GridStackEngine; | ||
| /** call to add the given node to our list, fixing collision and re-packing */ | ||
| addNode(node: GridStackNode, triggerAddEvent?: boolean): GridStackNode; | ||
| removeNode(node: GridStackNode, removeDOM?: boolean, triggerEvent?: boolean): GridStackEngine; | ||
| removeAll(removeDOM?: boolean): GridStackEngine; | ||
| canMoveNode(node: GridStackNode, x: number, y: number, w?: number, h?: number): boolean; | ||
| /** checks if item can be moved (layout constrain) vs moveNode(), returning true if was able to move. | ||
| * In more complicated cases (maxRow) it will attempt at moving the item and fixing | ||
| * others in a clone first, then apply those changes if still within specs. */ | ||
| moveNodeCheck(node: GridStackNode, o: GridStackMoveOpts): boolean; | ||
| /** return true if can fit in grid height constrain only (always true if no maxRow) */ | ||
@@ -54,4 +67,6 @@ willItFit(node: GridStackNode): boolean; | ||
| isOutside(x: number, y: number, node: GridStackNode): boolean; | ||
| isNodeChangedPosition(node: GridStackNode, x: number, y: number, w?: number, h?: number): boolean; | ||
| moveNode(node: GridStackNode, x: number, y: number, w?: number, h?: number, noPack?: boolean): GridStackNode; | ||
| /** true if x,y or w,h are different after clamping to min/max */ | ||
| changedPosConstrain(node: GridStackNode, p: GridStackPosition): boolean; | ||
| /** return true if the passed in node was actually moved (checks for no-op and locked) */ | ||
| moveNode(node: GridStackNode, o: GridStackMoveOpts): boolean; | ||
| getRow(): number; | ||
@@ -69,4 +84,4 @@ beginUpdate(node: GridStackNode): GridStackEngine; | ||
| cacheLayout(nodes: GridStackNode[], column: number, clear?: boolean): GridStackEngine; | ||
| /** called to remove all internal values */ | ||
| /** called to remove all internal values but the _id */ | ||
| cleanupNode(node: GridStackNode): GridStackEngine; | ||
| } |
| "use strict"; | ||
| // gridstack-engine.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // gridstack-engine.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| const utils_1 = require("./utils"); | ||
@@ -20,4 +16,2 @@ /** | ||
| this.removedNodes = []; | ||
| /** @internal legacy method renames */ | ||
| this.getGridHeight = utils_1.obsolete(this, GridStackEngine.prototype.getRow, 'getGridHeight', 'getRow', 'v1.0.0'); | ||
| this.column = opts.column || 12; | ||
@@ -43,34 +37,167 @@ this.onChange = opts.onChange; | ||
| delete this._prevFloat; | ||
| this._packNodes(); | ||
| this._notify(); | ||
| return this; | ||
| return this._packNodes() | ||
| ._notify(); | ||
| } | ||
| /** @internal */ | ||
| _fixCollisions(node) { | ||
| this._sortNodes(-1); | ||
| let nn = node; | ||
| let hasLocked = Boolean(this.nodes.find(n => n.locked)); | ||
| if (!this.float && !hasLocked) { | ||
| nn = { x: 0, y: node.y, w: this.column, h: node.h }; | ||
| // use entire row for hitting area (will use bottom reverse sorted first) if we not actively moving DOWN and didn't already skip | ||
| _useEntireRowArea(node, nn) { | ||
| return !this.float && !this._hasLocked && (!node._moving || node._skipDown || nn.y <= node.y); | ||
| } | ||
| /** @internal fix collision on given 'node', going to given new location 'nn', with optional 'collide' node already found. | ||
| * return true if we moved. */ | ||
| _fixCollisions(node, nn = node, collide, opt = {}) { | ||
| this._sortNodes(-1); // from last to first, so recursive collision move items in the right order | ||
| collide = collide || this.collide(node, nn); // REAL area collide for swap and skip if none... | ||
| if (!collide) | ||
| return false; | ||
| // swap check: if we're actively moving in gravity mode, see if we collide with an object the same size | ||
| if (node._moving && !opt.nested && !this.float) { | ||
| if (this.swap(node, collide)) | ||
| return true; | ||
| } | ||
| while (true) { | ||
| let collisionNode = this.collide(node, nn); | ||
| if (!collisionNode) | ||
| return this; | ||
| // during while() collisions MAKE SURE to check entire row so larger items don't leap frog small ones (push them all down starting last in grid) | ||
| let area = nn; | ||
| if (this._useEntireRowArea(node, nn)) { | ||
| area = { x: 0, w: this.column, y: nn.y, h: nn.h }; | ||
| collide = this.collide(node, area, opt.skip); // force new hit | ||
| } | ||
| let didMove = false; | ||
| let newOpt = { nested: true, pack: false }; | ||
| while (collide = collide || this.collide(node, area, opt.skip)) { // could collide with more than 1 item... so repeat for each | ||
| let moved; | ||
| if (collisionNode.locked) { | ||
| // if colliding with a locked item, move ourself instead | ||
| moved = this.moveNode(node, node.x, collisionNode.y + collisionNode.h, node.w, node.h, true); | ||
| // if colliding with a locked item OR moving down with top gravity (and collide could move up) -> skip past the collide, | ||
| // but remember that skip down so we only do this once (and push others otherwise). | ||
| if (collide.locked || node._moving && !node._skipDown && nn.y > node.y && !this.float && | ||
| // can take space we had, or before where we're going | ||
| (!this.collide(collide, Object.assign(Object.assign({}, collide), { y: node.y }), node) || !this.collide(collide, Object.assign(Object.assign({}, collide), { y: nn.y - collide.h }), node))) { | ||
| node._skipDown = (node._skipDown || nn.y > node.y); | ||
| moved = this.moveNode(node, Object.assign(Object.assign(Object.assign({}, nn), { y: collide.y + collide.h }), newOpt)); | ||
| if (collide.locked && moved) { | ||
| utils_1.Utils.copyPos(nn, node); // moving after lock become our new desired location | ||
| } | ||
| else if (!collide.locked && moved && opt.pack) { | ||
| // we moved after and will pack: do it now and keep the original drop location, but past the old collide to see what else we might push way | ||
| this._packNodes(); | ||
| nn.y = collide.y + collide.h; | ||
| utils_1.Utils.copyPos(node, nn); | ||
| } | ||
| didMove = didMove || moved; | ||
| } | ||
| else { | ||
| moved = this.moveNode(collisionNode, collisionNode.x, node.y + node.h, collisionNode.w, collisionNode.h, true); | ||
| // move collide down *after* where we will be, ignoring where we are now (don't collide with us) | ||
| moved = this.moveNode(collide, Object.assign(Object.assign(Object.assign({}, collide), { y: nn.y + nn.h, skip: node }), newOpt)); | ||
| } | ||
| if (!moved) | ||
| return this; // break inf loop if we couldn't move after all (ex: maxRow, fixed) | ||
| if (!moved) { | ||
| return didMove; | ||
| } // break inf loop if we couldn't move after all (ex: maxRow, fixed) | ||
| collide = undefined; | ||
| } | ||
| return didMove; | ||
| } | ||
| /** return any intercepted node with the given area, skipping the passed in node (usually self) */ | ||
| collide(node, area = node) { | ||
| return this.nodes.find(n => n !== node && utils_1.Utils.isIntercepted(n, area)); | ||
| /** return the nodes that intercept the given node. Optionally a different area can be used, as well as a second node to skip */ | ||
| collide(skip, area = skip, skip2) { | ||
| return this.nodes.find(n => n !== skip && n !== skip2 && utils_1.Utils.isIntercepted(n, area)); | ||
| } | ||
| collideAll(skip, area = skip, skip2) { | ||
| return this.nodes.filter(n => n !== skip && n !== skip2 && utils_1.Utils.isIntercepted(n, area)); | ||
| } | ||
| /** does a pixel coverage collision, returning the node that has the most coverage that is >50% mid line */ | ||
| collideCoverage(node, o, collides) { | ||
| if (!o.rect || !node._rect) | ||
| return; | ||
| let r0 = node._rect; // where started | ||
| let r = Object.assign({}, o.rect); // where we are | ||
| // update dragged rect to show where it's coming from (above or below, etc...) | ||
| if (r.y > r0.y) { | ||
| r.h += r.y - r0.y; | ||
| r.y = r0.y; | ||
| } | ||
| else { | ||
| r.h += r0.y - r.y; | ||
| } | ||
| if (r.x > r0.x) { | ||
| r.w += r.x - r0.x; | ||
| r.x = r0.x; | ||
| } | ||
| else { | ||
| r.w += r0.x - r.x; | ||
| } | ||
| let collide; | ||
| collides.forEach(n => { | ||
| if (n.locked || !n._rect) | ||
| return; | ||
| let r2 = n._rect; // overlapping target | ||
| let yOver = Number.MAX_VALUE, xOver = Number.MAX_VALUE, overMax = 0.5; // need >50% | ||
| // depending on which side we started from, compute the overlap % of coverage | ||
| // (ex: from above/below we only compute the max horizontal line coverage) | ||
| if (r0.y < r2.y) { // from above | ||
| yOver = ((r.y + r.h) - r2.y) / r2.h; | ||
| } | ||
| else if (r0.y + r0.h > r2.y + r2.h) { // from below | ||
| yOver = ((r2.y + r2.h) - r.y) / r2.h; | ||
| } | ||
| if (r0.x < r2.x) { // from the left | ||
| xOver = ((r.x + r.w) - r2.x) / r2.w; | ||
| } | ||
| else if (r0.x + r0.w > r2.x + r2.w) { // from the right | ||
| xOver = ((r2.x + r2.w) - r.x) / r2.w; | ||
| } | ||
| let over = Math.min(xOver, yOver); | ||
| if (over > overMax) { | ||
| overMax = over; | ||
| collide = n; | ||
| } | ||
| }); | ||
| return collide; | ||
| } | ||
| /** called to cache the nodes pixel rectangles used for collision detection during drag */ | ||
| cacheRects(w, h, top, right, bottom, left) { | ||
| this.nodes.forEach(n => n._rect = { | ||
| y: n.y * h + top, | ||
| x: n.x * w + left, | ||
| w: n.w * w - left - right, | ||
| h: n.h * h - top - bottom | ||
| }); | ||
| return this; | ||
| } | ||
| /** called to possibly swap between 2 nodes (same size or column, not locked, touching), returning true if successful */ | ||
| swap(a, b) { | ||
| if (!b || b.locked || !a || a.locked) | ||
| return false; | ||
| function _doSwap() { | ||
| let x = b.x, y = b.y; | ||
| b.x = a.x; | ||
| b.y = a.y; // b -> a position | ||
| if (a.h != b.h) { | ||
| a.x = x; | ||
| a.y = b.y + b.h; // a -> goes after b | ||
| } | ||
| else { | ||
| a.x = x; | ||
| a.y = y; // a -> old b position | ||
| } | ||
| a._dirty = b._dirty = true; | ||
| return true; | ||
| } | ||
| let touching; // remember if we called it (vs undefined) | ||
| // same size and same row or column, and touching | ||
| if (a.w === b.w && a.h === b.h && (a.x === b.x || a.y === b.y) && (touching = utils_1.Utils.isTouching(a, b))) | ||
| return _doSwap(); | ||
| if (touching === false) | ||
| return; // ran test and fail, bail out | ||
| // check for taking same columns (but different height) and touching | ||
| if (a.w === b.w && a.x === b.x && (touching || utils_1.Utils.isTouching(a, b))) { | ||
| if (b.y < a.y) { | ||
| let t = a; | ||
| a = b; | ||
| b = t; | ||
| } // swap a <-> b vars so a is first | ||
| return _doSwap(); | ||
| } | ||
| /* different X will be weird (expect vertical swap) and different height overlap, so too complex. user regular layout instead | ||
| // else check if swapping would not collide with anything else (requiring a re-layout) | ||
| if (!this.collide(a, {x: a.x, y: a.y, w: b.w, h: b.h}, b) && | ||
| !this.collide(a, {x: b.x, y: b.y, w: a.w, h: a.h}, b)) | ||
| return _doSwap(); */ | ||
| return false; | ||
| } | ||
| isAreaEmpty(x, y, w, h) { | ||
@@ -84,15 +211,14 @@ let nn = { x: x || 0, y: y || 0, w: w || 1, h: h || 1 }; | ||
| return this; | ||
| this.batchUpdate(); | ||
| this._sortNodes(); | ||
| this.batchUpdate() | ||
| ._sortNodes(); | ||
| let copyNodes = this.nodes; | ||
| this.nodes = []; // pretend we have no nodes to conflict layout to start with... | ||
| copyNodes.forEach(node => { | ||
| if (!node.noMove && !node.locked) { | ||
| if (!node.locked) { | ||
| node.autoPosition = true; | ||
| } | ||
| this.addNode(node, false); // 'false' for add event trigger | ||
| node._dirty = true; // force attr update | ||
| node._dirty = true; // will force attr update | ||
| }); | ||
| this.commit(); | ||
| return this; | ||
| return this.commit(); | ||
| } | ||
@@ -105,4 +231,3 @@ /** enable/disable floating widgets (default: `false`) See [example](http://gridstackjs.com/demo/float.html) */ | ||
| if (!val) { | ||
| this._packNodes(); | ||
| this._notify(); | ||
| this._packNodes()._notify(); | ||
| } | ||
@@ -117,19 +242,18 @@ } | ||
| } | ||
| /** @internal */ | ||
| /** @internal called to top gravity pack the items back OR revert back to original Y positions when floating */ | ||
| _packNodes() { | ||
| this._sortNodes(); | ||
| this._sortNodes(); // first to last | ||
| if (this.float) { | ||
| this.nodes.forEach((n, i) => { | ||
| if (n._updating || n._packY === undefined || n.y === n._packY) { | ||
| return this; | ||
| } | ||
| // restore original Y pos | ||
| this.nodes.forEach(n => { | ||
| if (n._updating || n._orig === undefined || n.y === n._orig.y) | ||
| return; | ||
| let newY = n.y; | ||
| while (newY >= n._packY) { | ||
| let box = { x: n.x, y: newY, w: n.w, h: n.h }; | ||
| let collisionNode = this.nodes.slice(0, i).find(bn => utils_1.Utils.isIntercepted(box, bn)); | ||
| if (!collisionNode) { | ||
| while (newY > n._orig.y) { | ||
| --newY; | ||
| let collide = this.collide(n, { x: n.x, y: newY, w: n.w, h: n.h }); | ||
| if (!collide) { | ||
| n._dirty = true; | ||
| n.y = newY; | ||
| } | ||
| --newY; | ||
| } | ||
@@ -139,16 +263,11 @@ }); | ||
| else { | ||
| // top gravity pack | ||
| this.nodes.forEach((n, i) => { | ||
| if (n.locked) | ||
| return this; | ||
| return; | ||
| while (n.y > 0) { | ||
| let newY = n.y - 1; | ||
| let canBeMoved = i === 0; | ||
| let box = { x: n.x, y: newY, w: n.w, h: n.h }; | ||
| if (i > 0) { | ||
| let collisionNode = this.nodes.slice(0, i).find(bn => utils_1.Utils.isIntercepted(box, bn)); | ||
| canBeMoved = !collisionNode; | ||
| } | ||
| if (!canBeMoved) { | ||
| let newY = i === 0 ? 0 : n.y - 1; | ||
| let canBeMoved = i === 0 || !this.collide(n, { x: n.x, y: newY, w: n.w, h: n.h }); | ||
| if (!canBeMoved) | ||
| break; | ||
| } | ||
| // Note: must be dirty (from last position) for GridStack::OnChange CB to update positions | ||
@@ -215,2 +334,6 @@ // and move items back. The user 'change' CB should detect changes from the original | ||
| } | ||
| return this.nodeBoundFix(node, resizing); | ||
| } | ||
| /** part2 of preparing a node to fit inside our grid - checks for x,y from grid dimensions */ | ||
| nodeBoundFix(node, resizing) { | ||
| if (node.maxW) { | ||
@@ -265,20 +388,9 @@ node.w = Math.min(node.w, node.maxW); | ||
| getDirtyNodes(verify) { | ||
| // compare original X,Y,W,H (or entire node?) instead as _dirty can be a temporary state | ||
| // compare original x,y,w,h instead as _dirty can be a temporary state | ||
| if (verify) { | ||
| let dirtNodes = []; | ||
| this.nodes.forEach(n => { | ||
| if (n._dirty) { | ||
| if (n.y === n._origY && n.x === n._origX && n.w === n._origW && n.h === n._origH) { | ||
| delete n._dirty; | ||
| } | ||
| else { | ||
| dirtNodes.push(n); | ||
| } | ||
| } | ||
| }); | ||
| return dirtNodes; | ||
| return this.nodes.filter(n => n._dirty && !utils_1.Utils.samePos(n, n._orig)); | ||
| } | ||
| return this.nodes.filter(n => n._dirty); | ||
| } | ||
| /** @internal */ | ||
| /** @internal call this to call onChange CB with dirty nodes */ | ||
| _notify(nodes, removeDOM = true) { | ||
@@ -289,15 +401,45 @@ if (this.batchMode) | ||
| let dirtyNodes = nodes.concat(this.getDirtyNodes()); | ||
| if (this.onChange) { | ||
| this.onChange(dirtyNodes, removeDOM); | ||
| } | ||
| this.onChange && this.onChange(dirtyNodes, removeDOM); | ||
| return this; | ||
| } | ||
| /** @internal remove dirty and last tried info */ | ||
| cleanNodes() { | ||
| if (this.batchMode) | ||
| return this; | ||
| this.nodes.forEach(n => { delete n._dirty; }); | ||
| this.nodes.forEach(n => { | ||
| delete n._dirty; | ||
| delete n._lastTried; | ||
| }); | ||
| return this; | ||
| } | ||
| /** @internal called to save initial position/size to track real dirty state. | ||
| * Note: should be called right after we call change event (so next API is can detect changes) | ||
| * as well as right before we start move/resize/enter (so we can restore items to prev values) */ | ||
| saveInitial() { | ||
| this.nodes.forEach(n => { | ||
| n._orig = utils_1.Utils.copyPos({}, n); | ||
| delete n._dirty; | ||
| }); | ||
| this._hasLocked = this.nodes.some(n => n.locked); | ||
| return this; | ||
| } | ||
| /** @internal restore all the nodes back to initial values (called when we leave) */ | ||
| restoreInitial() { | ||
| this.nodes.forEach(n => { | ||
| if (utils_1.Utils.samePos(n, n._orig)) | ||
| return; | ||
| utils_1.Utils.copyPos(n, n._orig); | ||
| n._dirty = true; | ||
| }); | ||
| this._notify(); | ||
| return this; | ||
| } | ||
| /** call to add the given node to our list, fixing collision and re-packing */ | ||
| addNode(node, triggerAddEvent = false) { | ||
| let dup; | ||
| if (dup = this.nodes.find(n => n._id === node._id)) | ||
| return dup; // prevent inserting twice! return it instead. | ||
| node = this.prepareNode(node); | ||
| delete node._temporaryRemoved; | ||
| delete node._removeDOM; | ||
| if (node.autoPosition) { | ||
@@ -321,22 +463,20 @@ this._sortNodes(); | ||
| this.nodes.push(node); | ||
| if (triggerAddEvent) { | ||
| this.addedNodes.push(node); | ||
| } | ||
| triggerAddEvent && this.addedNodes.push(node); | ||
| this._fixCollisions(node); | ||
| this._packNodes(); | ||
| this._notify(); | ||
| this._packNodes() | ||
| ._notify(); | ||
| return node; | ||
| } | ||
| removeNode(node, removeDOM = true, triggerEvent = false) { | ||
| if (!this.nodes.find(n => n === node)) | ||
| return; // not in our list | ||
| if (triggerEvent) { // we wait until final drop to manually track removed items (rather than during drag) | ||
| this.removedNodes.push(node); | ||
| } | ||
| node._id = null; // hint that node is being removed | ||
| if (removeDOM) | ||
| node._removeDOM = true; // let CB remove actual HTML (used to set _id to null, but then we loose layout info) | ||
| // don't use 'faster' .splice(findIndex(),1) in case node isn't in our list, or in multiple times. | ||
| this.nodes = this.nodes.filter(n => n !== node); | ||
| if (!this.float) { | ||
| this._packNodes(); | ||
| } | ||
| this._notify(node, removeDOM); | ||
| return this; | ||
| return this._packNodes() | ||
| ._notify(node, removeDOM); | ||
| } | ||
@@ -347,18 +487,21 @@ removeAll(removeDOM = true) { | ||
| return this; | ||
| if (removeDOM) { | ||
| this.nodes.forEach(n => { n._id = null; }); // hint that node is being removed | ||
| } | ||
| removeDOM && this.nodes.forEach(n => n._removeDOM = true); // let CB remove actual HTML (used to set _id to null, but then we loose layout info) | ||
| this.removedNodes = this.nodes; | ||
| this.nodes = []; | ||
| this._notify(this.removedNodes, removeDOM); | ||
| return this; | ||
| return this._notify(this.removedNodes, removeDOM); | ||
| } | ||
| canMoveNode(node, x, y, w, h) { | ||
| if (!this.isNodeChangedPosition(node, x, y, w, h)) { | ||
| /** checks if item can be moved (layout constrain) vs moveNode(), returning true if was able to move. | ||
| * In more complicated cases (maxRow) it will attempt at moving the item and fixing | ||
| * others in a clone first, then apply those changes if still within specs. */ | ||
| moveNodeCheck(node, o) { | ||
| if (node.locked) | ||
| return false; | ||
| if (!this.changedPosConstrain(node, o)) | ||
| return false; | ||
| o.pack = true; | ||
| // simpler case: move item directly... | ||
| if (!this.maxRow /* && !this._hasLocked*/) { | ||
| return this.moveNode(node, o); | ||
| } | ||
| let hasLocked = this.nodes.some(n => n.locked); | ||
| if (!this.maxRow && !hasLocked) { | ||
| return true; | ||
| } | ||
| // complex case: create a clone with NO maxRow (will check for out of bounds at the end) | ||
| let clonedNode; | ||
@@ -377,12 +520,29 @@ let clone = new GridStackEngine({ | ||
| if (!clonedNode) | ||
| return true; | ||
| clone.moveNode(clonedNode, x, y, w, h); | ||
| let canMove = true; | ||
| if (hasLocked) { | ||
| canMove = !clone.nodes.some(n => n.locked && n._dirty && n !== clonedNode); | ||
| } | ||
| return false; | ||
| let canMove = clone.moveNode(clonedNode, o); | ||
| // if maxRow make sure we are still valid size | ||
| if (this.maxRow && canMove) { | ||
| canMove = (clone.getRow() <= this.maxRow); | ||
| // turns out we can't grow, then see if we can swap instead (ex: full grid) | ||
| if (!canMove) { | ||
| let collide = this.collide(node, o); | ||
| if (collide && this.swap(node, collide)) { | ||
| this._notify(); | ||
| return true; | ||
| } | ||
| } | ||
| } | ||
| return canMove; | ||
| if (!canMove) | ||
| return false; | ||
| // if clone was able to move, copy those mods over to us now instead of caller trying to do this all over! | ||
| // Note: we can't use the list directly as elements and other parts point to actual node struct, so copy content | ||
| clone.nodes.filter(n => n._dirty).forEach(c => { | ||
| let n = this.nodes.find(a => a._id === c._id); | ||
| if (!n) | ||
| return; | ||
| utils_1.Utils.copyPos(n, c); | ||
| n._dirty = true; | ||
| }); | ||
| this._notify(); | ||
| return true; | ||
| } | ||
@@ -393,2 +553,3 @@ /** return true if can fit in grid height constrain only (always true if no maxRow) */ | ||
| return true; | ||
| // create a clone with NO maxRow and check if still within size | ||
| let clone = new GridStackEngine({ | ||
@@ -404,2 +565,4 @@ column: this.column, | ||
| isOutside(x, y, node) { | ||
| if (node._isCursorOutside) | ||
| return false; // dragging out is handled by 'dropout' event instead | ||
| // simple outside boundaries | ||
@@ -431,74 +594,89 @@ if (x < 0 || x >= this.column || y < 0) | ||
| } | ||
| isNodeChangedPosition(node, x, y, w, h) { | ||
| if (typeof x !== 'number') { | ||
| x = node.x; | ||
| } | ||
| if (typeof y !== 'number') { | ||
| y = node.y; | ||
| } | ||
| if (typeof w !== 'number') { | ||
| w = node.w; | ||
| } | ||
| if (typeof h !== 'number') { | ||
| h = node.h; | ||
| } | ||
| /** true if x,y or w,h are different after clamping to min/max */ | ||
| changedPosConstrain(node, p) { | ||
| // make sure w,h are set | ||
| p.w = p.w || node.w; | ||
| p.h = p.h || node.h; | ||
| if (node.x !== p.x || node.y !== p.y) | ||
| return true; | ||
| // check constrained w,h | ||
| if (node.maxW) { | ||
| w = Math.min(w, node.maxW); | ||
| p.w = Math.min(p.w, node.maxW); | ||
| } | ||
| if (node.maxH) { | ||
| h = Math.min(h, node.maxH); | ||
| p.h = Math.min(p.h, node.maxH); | ||
| } | ||
| if (node.minW) { | ||
| w = Math.max(w, node.minW); | ||
| p.w = Math.max(p.w, node.minW); | ||
| } | ||
| if (node.minH) { | ||
| h = Math.max(h, node.minH); | ||
| p.h = Math.max(p.h, node.minH); | ||
| } | ||
| if (node.x === x && node.y === y && node.w === w && node.h === h) { | ||
| return (node.w !== p.w || node.h !== p.h); | ||
| } | ||
| /** return true if the passed in node was actually moved (checks for no-op and locked) */ | ||
| moveNode(node, o) { | ||
| if (!node || node.locked || !o) | ||
| return false; | ||
| if (o.pack === undefined) | ||
| o.pack = true; | ||
| // constrain the passed in values and check if we're still changing our node | ||
| if (typeof o.x !== 'number') { | ||
| o.x = node.x; | ||
| } | ||
| return true; | ||
| } | ||
| moveNode(node, x, y, w, h, noPack) { | ||
| if (node.locked) | ||
| return null; | ||
| if (typeof x !== 'number') { | ||
| x = node.x; | ||
| if (typeof o.y !== 'number') { | ||
| o.y = node.y; | ||
| } | ||
| if (typeof y !== 'number') { | ||
| y = node.y; | ||
| if (typeof o.w !== 'number') { | ||
| o.w = node.w; | ||
| } | ||
| if (typeof w !== 'number') { | ||
| w = node.w; | ||
| if (typeof o.h !== 'number') { | ||
| o.h = node.h; | ||
| } | ||
| if (typeof h !== 'number') { | ||
| h = node.h; | ||
| let resizing = (node.w !== o.w || node.h !== o.h); | ||
| let nn = { maxW: node.maxW, maxH: node.maxH, minW: node.minW, minH: node.minH }; | ||
| utils_1.Utils.copyPos(nn, o); | ||
| nn = this.nodeBoundFix(nn, resizing); | ||
| utils_1.Utils.copyPos(o, nn); | ||
| if (utils_1.Utils.samePos(node, o)) | ||
| return false; | ||
| let prevPos = utils_1.Utils.copyPos({}, node); | ||
| // during while() collisions make sure to check entire row so larger items don't leap frog small ones (push them all down) | ||
| let area = nn; | ||
| // if (this._useEntireRowArea(node, nn)) { | ||
| // area = {x: 0, w: this.column, y: nn.y, h: nn.h}; | ||
| // } | ||
| // check if we will need to fix collision at our new location | ||
| let collides = this.collideAll(node, area, o.skip); | ||
| let needToMove = true; | ||
| if (collides.length) { | ||
| // now check to make sure we actually collided over 50% surface area while dragging | ||
| let collide = node._moving && !o.nested ? this.collideCoverage(node, o, collides) : collides[0]; | ||
| if (collide) { | ||
| needToMove = !this._fixCollisions(node, nn, collide, o); // check if already moved... | ||
| } | ||
| else { | ||
| needToMove = false; // we didn't cover >50% for a move, skip... | ||
| } | ||
| } | ||
| // constrain the passed in values and check if we're still changing our node | ||
| let resizing = (node.w !== w || node.h !== h); | ||
| let nn = { x, y, w, h, maxW: node.maxW, maxH: node.maxH, minW: node.minW, minH: node.minH }; | ||
| nn = this.prepareNode(nn, resizing); | ||
| if (node.x === nn.x && node.y === nn.y && node.w === nn.w && node.h === nn.h) { | ||
| return null; | ||
| // now move (to the original ask vs the collision version which might differ) and repack things | ||
| if (needToMove) { | ||
| node._dirty = true; | ||
| utils_1.Utils.copyPos(node, nn); | ||
| } | ||
| node._dirty = true; | ||
| node.x = node._lastTriedX = nn.x; | ||
| node.y = node._lastTriedY = nn.y; | ||
| node.w = node._lastTriedW = nn.w; | ||
| node.h = node._lastTriedH = nn.h; | ||
| this._fixCollisions(node); | ||
| if (!noPack) { | ||
| this._packNodes(); | ||
| this._notify(); | ||
| if (o.pack) { | ||
| this._packNodes() | ||
| ._notify(); | ||
| } | ||
| return node; | ||
| return !utils_1.Utils.samePos(node, prevPos); // pack might have moved things back | ||
| } | ||
| getRow() { | ||
| return this.nodes.reduce((memo, n) => Math.max(memo, n.y + n.h), 0); | ||
| return this.nodes.reduce((row, n) => Math.max(row, n.y + n.h), 0); | ||
| } | ||
| beginUpdate(node) { | ||
| if (node._updating) | ||
| return this; | ||
| node._updating = true; | ||
| this.nodes.forEach(n => { n._packY = n.y; }); | ||
| if (!node._updating) { | ||
| node._updating = true; | ||
| delete node._skipDown; | ||
| this.saveInitial(); | ||
| } | ||
| return this; | ||
@@ -510,3 +688,3 @@ } | ||
| delete n._updating; | ||
| this.nodes.forEach(n => { delete n._packY; }); | ||
| delete n._skipDown; | ||
| } | ||
@@ -518,3 +696,3 @@ return this; | ||
| let widgets = []; | ||
| utils_1.Utils.sort(this.nodes); | ||
| this._sortNodes(); | ||
| this.nodes.forEach(n => { | ||
@@ -564,11 +742,11 @@ let w = {}; | ||
| // TODO: detect doing item 'swaps' will help instead of move (especially in 1 column mode) | ||
| if (node.y !== node._origY) { | ||
| n.y += (node.y - node._origY); | ||
| if (node.y !== node._orig.y) { | ||
| n.y += (node.y - node._orig.y); | ||
| } | ||
| // X changed, scale from new position | ||
| if (node.x !== node._origX) { | ||
| if (node.x !== node._orig.x) { | ||
| n.x = Math.round(node.x * ratio); | ||
| } | ||
| // width changed, scale from new width | ||
| if (node.w !== node._origW) { | ||
| if (node.w !== node._orig.w) { | ||
| n.w = Math.round(node.w * ratio); | ||
@@ -676,13 +854,2 @@ } | ||
| } | ||
| /** @internal called to save initial position/size */ | ||
| saveInitial() { | ||
| this.nodes.forEach(n => { | ||
| n._origX = n.x; | ||
| n._origY = n.y; | ||
| n._origW = n.w; | ||
| n._origH = n.h; | ||
| delete n._dirty; | ||
| }); | ||
| return this; | ||
| } | ||
| /** | ||
@@ -704,6 +871,6 @@ * call to cache the given layout internally to the given location so we can restore back when column changes size | ||
| } | ||
| /** called to remove all internal values */ | ||
| /** called to remove all internal values but the _id */ | ||
| cleanupNode(node) { | ||
| for (let prop in node) { | ||
| if (prop[0] === '_') | ||
| if (prop[0] === '_' && prop !== '_id') | ||
| delete node[prop]; | ||
@@ -715,4 +882,4 @@ } | ||
| exports.GridStackEngine = GridStackEngine; | ||
| /** @internal */ | ||
| /** @internal unique global internal _id counter NOT starting at 0 */ | ||
| GridStackEngine._idSeq = 1; | ||
| //# sourceMappingURL=gridstack-engine.js.map |
@@ -1,29 +0,3 @@ | ||
| // dd-base-impl.ts 3.3.0 @preserve | ||
| // dd-draggable.ts 3.3.0 @preserve | ||
| // dd-droppable.ts 3.3.0 @preserve | ||
| // dd-elements.ts 3.3.0 @preserve | ||
| // dd-manager.ts 3.3.0 @preserve | ||
| // dd-resizable-handle.ts 3.3.0 @preserve | ||
| // dd-resizable.ts 3.3.0 @preserve | ||
| // dd-utils.ts 3.3.0 @preserve | ||
| // gridstack-GridStackDD.get().ts 3.3.0 @preserve | ||
| // gridstack-dd-native.ts 3.3.0 @preserve | ||
| // gridstack-ddi.ts 3.3.0 @preserve | ||
| // gridstack-engine.ts 3.3.0 @preserve | ||
| // gridstack.ts 3.3.0 @preserve | ||
| // index.html5.ts 3.3.0 - everything you need for a Grid that uses HTML5 native drag&drop (work in progress) @preserve | ||
| // utils.ts 3.3.0 @preserve | ||
| /*! | ||
| * (c) 2021 Alain Dumesny - see root license | ||
| */ |
| /*! | ||
| * (c) 2021 Alain Dumesny - see root license | ||
| */ | ||
| /*! | ||
| * Sizzle CSS Selector Engine v2.3.5 | ||
@@ -92,15 +96,1 @@ * https://sizzlejs.com/ | ||
| * Copyright jQuery Foundation and other contributors; Licensed MIT */ | ||
| // gridstack-GridStackDD.get().ts 3.3.0 @preserve | ||
| // gridstack-dd-jqueryui.ts 3.1.3-dev @preserve | ||
| // gridstack-ddi.ts 3.3.0 @preserve | ||
| // gridstack-engine.ts 3.3.0 @preserve | ||
| // gridstack.ts 3.3.0 @preserve | ||
| // index.jq.ts 3.3.0 - everything you need for a Grid that uses Jquery-ui drag&drop (original, full feature) @preserve | ||
| // utils.ts 3.3.0 @preserve |
@@ -1,9 +0,3 @@ | ||
| // gridstack-poly.js 2.0.0 @preserve | ||
| /** IE and older browsers Polyfills for this library | ||
| * https://gridstackjs.com/ | ||
| * (c) 2019-2020 Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // gridstack-poly.js 2.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| /* eslint-disable prefer-rest-params */ | ||
@@ -10,0 +4,0 @@ /* eslint-disable no-var */ |
| /*! For license information please see gridstack-static.js.LICENSE.txt */ | ||
| !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.GridStack=e():t.GridStack=e()}(self,(function(){return(()=>{"use strict";var t={334:(t,e)=>{Object.defineProperty(e,"__esModule",{value:!0});class i{static registerPlugin(t){return i.ddi=new t,i.ddi}static get(){return i.ddi||i.registerPlugin(i)}remove(t){return this}}e.GridStackDDI=i},62:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0});const s=i(593);class o{constructor(t={}){this.addedNodes=[],this.removedNodes=[],this.getGridHeight=s.obsolete(this,o.prototype.getRow,"getGridHeight","getRow","v1.0.0"),this.column=t.column||12,this.onChange=t.onChange,this._float=t.float,this.maxRow=t.maxRow,this.nodes=t.nodes||[]}batchUpdate(){return this.batchMode||(this.batchMode=!0,this._prevFloat=this._float,this._float=!0),this}commit(){return this.batchMode?(this.batchMode=!1,this._float=this._prevFloat,delete this._prevFloat,this._packNodes(),this._notify(),this):this}_fixCollisions(t){this._sortNodes(-1);let e=t,i=Boolean(this.nodes.find((t=>t.locked)));for(this.float||i||(e={x:0,y:t.y,w:this.column,h:t.h});;){let i,s=this.collide(t,e);if(!s)return this;if(i=s.locked?this.moveNode(t,t.x,s.y+s.h,t.w,t.h,!0):this.moveNode(s,s.x,t.y+t.h,s.w,s.h,!0),!i)return this}}collide(t,e=t){return this.nodes.find((i=>i!==t&&s.Utils.isIntercepted(i,e)))}isAreaEmpty(t,e,i,s){let o={x:t||0,y:e||0,w:i||1,h:s||1};return!this.collide(o)}compact(){if(0===this.nodes.length)return this;this.batchUpdate(),this._sortNodes();let t=this.nodes;return this.nodes=[],t.forEach((t=>{t.noMove||t.locked||(t.autoPosition=!0),this.addNode(t,!1),t._dirty=!0})),this.commit(),this}set float(t){this._float!==t&&(this._float=t||!1,t||(this._packNodes(),this._notify()))}get float(){return this._float||!1}_sortNodes(t){return this.nodes=s.Utils.sort(this.nodes,t,this.column),this}_packNodes(){return this._sortNodes(),this.float?this.nodes.forEach(((t,e)=>{if(t._updating||void 0===t._packY||t.y===t._packY)return this;let i=t.y;for(;i>=t._packY;){let o={x:t.x,y:i,w:t.w,h:t.h};this.nodes.slice(0,e).find((t=>s.Utils.isIntercepted(o,t)))||(t._dirty=!0,t.y=i),--i}})):this.nodes.forEach(((t,e)=>{if(t.locked)return this;for(;t.y>0;){let i=t.y-1,o=0===e,n={x:t.x,y:i,w:t.w,h:t.h};if(e>0&&(o=!this.nodes.slice(0,e).find((t=>s.Utils.isIntercepted(n,t)))),!o)break;t._dirty=t.y!==i,t.y=i}})),this}prepareNode(t,e){(t=t||{})._id=t._id||o._idSeq++,void 0!==t.x&&void 0!==t.y&&null!==t.x&&null!==t.y||(t.autoPosition=!0);let i={x:0,y:0,w:1,h:1};return s.Utils.defaults(t,i),t.autoPosition||delete t.autoPosition,t.noResize||delete t.noResize,t.noMove||delete t.noMove,"string"==typeof t.x&&(t.x=Number(t.x)),"string"==typeof t.y&&(t.y=Number(t.y)),"string"==typeof t.w&&(t.w=Number(t.w)),"string"==typeof t.h&&(t.h=Number(t.h)),isNaN(t.x)&&(t.x=i.x,t.autoPosition=!0),isNaN(t.y)&&(t.y=i.y,t.autoPosition=!0),isNaN(t.w)&&(t.w=i.w),isNaN(t.h)&&(t.h=i.h),t.maxW&&(t.w=Math.min(t.w,t.maxW)),t.maxH&&(t.h=Math.min(t.h,t.maxH)),t.minW&&(t.w=Math.max(t.w,t.minW)),t.minH&&(t.h=Math.max(t.h,t.minH)),t.w>this.column?t.w=this.column:t.w<1&&(t.w=1),this.maxRow&&t.h>this.maxRow?t.h=this.maxRow:t.h<1&&(t.h=1),t.x<0&&(t.x=0),t.y<0&&(t.y=0),t.x+t.w>this.column&&(e?t.w=this.column-t.x:t.x=this.column-t.w),this.maxRow&&t.y+t.h>this.maxRow&&(e?t.h=this.maxRow-t.y:t.y=this.maxRow-t.h),t}getDirtyNodes(t){if(t){let t=[];return this.nodes.forEach((e=>{e._dirty&&(e.y===e._origY&&e.x===e._origX&&e.w===e._origW&&e.h===e._origH?delete e._dirty:t.push(e))})),t}return this.nodes.filter((t=>t._dirty))}_notify(t,e=!0){if(this.batchMode)return this;let i=(t=void 0===t?[]:Array.isArray(t)?t:[t]).concat(this.getDirtyNodes());return this.onChange&&this.onChange(i,e),this}cleanNodes(){return this.batchMode||this.nodes.forEach((t=>{delete t._dirty})),this}addNode(t,e=!1){if((t=this.prepareNode(t)).autoPosition){this._sortNodes();for(let e=0;;++e){let i=e%this.column,o=Math.floor(e/this.column);if(i+t.w>this.column)continue;let n={x:i,y:o,w:t.w,h:t.h};if(!this.nodes.find((t=>s.Utils.isIntercepted(n,t)))){t.x=i,t.y=o,delete t.autoPosition;break}}}return this.nodes.push(t),e&&this.addedNodes.push(t),this._fixCollisions(t),this._packNodes(),this._notify(),t}removeNode(t,e=!0,i=!1){return i&&this.removedNodes.push(t),t._id=null,this.nodes=this.nodes.filter((e=>e!==t)),this.float||this._packNodes(),this._notify(t,e),this}removeAll(t=!0){return delete this._layouts,0===this.nodes.length||(t&&this.nodes.forEach((t=>{t._id=null})),this.removedNodes=this.nodes,this.nodes=[],this._notify(this.removedNodes,t)),this}canMoveNode(t,e,i,s,n){if(!this.isNodeChangedPosition(t,e,i,s,n))return!1;let r,l=this.nodes.some((t=>t.locked));if(!this.maxRow&&!l)return!0;let h=new o({column:this.column,float:this.float,nodes:this.nodes.map((e=>e===t?(r=Object.assign({},e),r):Object.assign({},e)))});if(!r)return!0;h.moveNode(r,e,i,s,n);let a=!0;return l&&(a=!h.nodes.some((t=>t.locked&&t._dirty&&t!==r))),this.maxRow&&a&&(a=h.getRow()<=this.maxRow),a}willItFit(t){if(!this.maxRow)return!0;let e=new o({column:this.column,float:this.float,nodes:this.nodes.map((t=>Object.assign({},t)))});return e.addNode(t),e.getRow()<=this.maxRow}isOutside(t,e,i){if(t<0||t>=this.column||e<0)return!0;if(this.maxRow)return e>=this.maxRow;if(this.float)return!1;let s=this.getRow();if(e<s||0===e)return!1;if(e>s)return!0;if(!i._temporaryRemoved){let s=new o({column:this.column,float:this.float,nodes:this.nodes.filter((t=>t!==i)).map((t=>Object.assign({},t)))}),n=Object.assign(Object.assign({},i),{x:t,y:e});return s.addNode(n),n.y===i.y&&n.x===i.x}return i._temporaryRemoved}isNodeChangedPosition(t,e,i,s,o){return"number"!=typeof e&&(e=t.x),"number"!=typeof i&&(i=t.y),"number"!=typeof s&&(s=t.w),"number"!=typeof o&&(o=t.h),t.maxW&&(s=Math.min(s,t.maxW)),t.maxH&&(o=Math.min(o,t.maxH)),t.minW&&(s=Math.max(s,t.minW)),t.minH&&(o=Math.max(o,t.minH)),t.x!==e||t.y!==i||t.w!==s||t.h!==o}moveNode(t,e,i,s,o,n){if(t.locked)return null;"number"!=typeof e&&(e=t.x),"number"!=typeof i&&(i=t.y),"number"!=typeof s&&(s=t.w),"number"!=typeof o&&(o=t.h);let r=t.w!==s||t.h!==o,l={x:e,y:i,w:s,h:o,maxW:t.maxW,maxH:t.maxH,minW:t.minW,minH:t.minH};return l=this.prepareNode(l,r),t.x===l.x&&t.y===l.y&&t.w===l.w&&t.h===l.h?null:(t._dirty=!0,t.x=t._lastTriedX=l.x,t.y=t._lastTriedY=l.y,t.w=t._lastTriedW=l.w,t.h=t._lastTriedH=l.h,this._fixCollisions(t),n||(this._packNodes(),this._notify()),t)}getRow(){return this.nodes.reduce(((t,e)=>Math.max(t,e.y+e.h)),0)}beginUpdate(t){return t._updating||(t._updating=!0,this.nodes.forEach((t=>{t._packY=t.y}))),this}endUpdate(){let t=this.nodes.find((t=>t._updating));return t&&(delete t._updating,this.nodes.forEach((t=>{delete t._packY}))),this}save(t=!0){let e=[];return s.Utils.sort(this.nodes),this.nodes.forEach((i=>{let s={};for(let t in i)"_"!==t[0]&&null!==i[t]&&void 0!==i[t]&&(s[t]=i[t]);t||delete s.el,delete s.grid,s.autoPosition||delete s.autoPosition,s.noResize||delete s.noResize,s.noMove||delete s.noMove,s.locked||delete s.locked,e.push(s)})),e}layoutsNodesChange(t){return!this._layouts||this._ignoreLayoutsNodeChange||this._layouts.forEach(((e,i)=>{if(!e||i===this.column)return this;i<this.column?this._layouts[i]=void 0:t.forEach((t=>{let s=e.find((e=>e._id===t._id));if(!s)return this;let o=i/this.column;t.y!==t._origY&&(s.y+=t.y-t._origY),t.x!==t._origX&&(s.x=Math.round(t.x*o)),t.w!==t._origW&&(s.w=Math.round(t.w*o))}))})),this}updateNodeWidths(t,e,i,o="moveScale"){if(!this.nodes.length||t===e)return this;if(this.cacheLayout(this.nodes,t),1===e&&i&&i.length){let t=0;i.forEach((e=>{e.x=0,e.w=1,e.y=Math.max(e.y,t),t=e.y+e.h}))}else i=s.Utils.sort(this.nodes,-1,t);let n=this._layouts[e]||[],r=this._layouts.length-1;0===n.length&&e>t&&e<r&&(n=this._layouts[r]||[],n.length&&(t=r,n.forEach((t=>{let e=i.findIndex((e=>e._id===t._id));-1!==e&&(i[e].x=t.x,i[e].y=t.y,i[e].w=t.w)})),n=[]));let l=[];if(n.forEach((t=>{let e=i.findIndex((e=>e._id===t._id));-1!==e&&(i[e].x=t.x,i[e].y=t.y,i[e].w=t.w,l.push(i[e]),i.splice(e,1))})),i.length)if("function"==typeof o)o(e,t,l,i);else{let s=e/t,n="move"===o||"moveScale"===o,r="scale"===o||"moveScale"===o;i.forEach((i=>{i.x=1===e?0:n?Math.round(i.x*s):Math.min(i.x,e-1),i.w=1===e||1===t?1:r?Math.round(i.w*s)||1:Math.min(i.w,e),l.push(i)})),i=[]}return l=s.Utils.sort(l,-1,e),this._ignoreLayoutsNodeChange=!0,this.batchUpdate(),this.nodes=[],l.forEach((t=>{this.addNode(t,!1),t._dirty=!0}),this),this.commit(),delete this._ignoreLayoutsNodeChange,this}saveInitial(){return this.nodes.forEach((t=>{t._origX=t.x,t._origY=t.y,t._origW=t.w,t._origH=t.h,delete t._dirty})),this}cacheLayout(t,e,i=!1){let s=[];return t.forEach(((t,e)=>{t._id=t._id||o._idSeq++,s[e]={x:t.x,y:t.y,w:t.w,_id:t._id}})),this._layouts=i?[]:this._layouts||[],this._layouts[e]=s,this}cleanupNode(t){for(let e in t)"_"===e[0]&&delete t[e];return this}}e.GridStackEngine=o,o._idSeq=1},270:(t,e,i)=>{function s(t){for(var i in t)e.hasOwnProperty(i)||(e[i]=t[i])}Object.defineProperty(e,"__esModule",{value:!0});const o=i(62),n=i(593),r=i(334);s(i(593)),s(i(62)),s(i(334));const l={column:12,minRow:0,maxRow:0,itemClass:"grid-stack-item",placeholderClass:"grid-stack-placeholder",placeholderText:"",handle:".grid-stack-item-content",handleClass:null,styleInHead:!1,cellHeight:"auto",cellHeightThrottle:100,margin:10,auto:!0,minWidth:768,float:!1,staticGrid:!1,animate:!0,alwaysShowResizeHandle:!1,resizable:{autoHide:!0,handles:"se"},draggable:{handle:".grid-stack-item-content",scroll:!1,appendTo:"body"},dragIn:void 0,dragInOptions:{revert:"invalid",handle:".grid-stack-item-content",scroll:!1,appendTo:"body"},disableDrag:!1,disableResize:!1,rtl:"auto",removable:!1,removableOptions:{accept:".grid-stack-item"},removeTimeout:2e3,marginUnit:"px",cellHeightUnit:"px",disableOneColumnMode:!1,oneColumnModeDomSort:!1};class h{constructor(t,e={}){this._gsEventHandler={},this.el=t,e=e||{},n.obsoleteOpts(e,"verticalMargin","margin","v2.0"),n.obsoleteAttr(this.el,"data-gs-current-height","gs-current-row","v1.0.0"),e.row&&(e.minRow=e.maxRow=e.row,delete e.row);let i=n.Utils.toNumber(t.getAttribute("gs-row")),s=Object.assign(Object.assign({},l),{column:n.Utils.toNumber(t.getAttribute("gs-column"))||12,minRow:i||n.Utils.toNumber(t.getAttribute("gs-min-row"))||0,maxRow:i||n.Utils.toNumber(t.getAttribute("gs-max-row"))||0,staticGrid:n.Utils.toBool(t.getAttribute("gs-static"))||!1,_styleSheetClass:"grid-stack-instance-"+(1e4*Math.random()).toFixed(0),alwaysShowResizeHandle:e.alwaysShowResizeHandle||!1,resizable:{autoHide:!e.alwaysShowResizeHandle,handles:"se"},draggable:{handle:(e.handleClass?"."+e.handleClass:e.handle?e.handle:"")||".grid-stack-item-content",scroll:!1,appendTo:"body"},removableOptions:{accept:"."+(e.itemClass||"grid-stack-item")}});t.getAttribute("gs-animate")&&(s.animate=n.Utils.toBool(t.getAttribute("gs-animate"))),this.opts=n.Utils.defaults(e,s),e=null,this.initMargin(),1!==this.opts.column&&!this.opts.disableOneColumnMode&&this._widthOrContainer()<=this.opts.minWidth&&(this._prevColumn=this.opts.column,this.opts.column=1),"auto"===this.opts.rtl&&(this.opts.rtl="rtl"===t.style.direction),this.opts.rtl&&this.el.classList.add("grid-stack-rtl");let r=n.Utils.closestByClass(this.el,l.itemClass);if(r&&r.gridstackNode&&(this.opts._isNested=r.gridstackNode,this.opts._isNested.subGrid=this,this.el.classList.add("grid-stack-nested")),this._isAutoCellHeight="auto"===this.opts.cellHeight,this._isAutoCellHeight||"initial"===this.opts.cellHeight?this.cellHeight(void 0,!1):this.cellHeight(this.opts.cellHeight,!1),this.el.classList.add(this.opts._styleSheetClass),this._setStaticClass(),this.engine=new o.GridStackEngine({column:this.opts.column,float:this.opts.float,maxRow:this.opts.maxRow,onChange:(t,e=!0)=>{let i=0;this.engine.nodes.forEach((t=>{i=Math.max(i,t.y+t.h)})),t.forEach((t=>{let i=t.el;e&&null===t._id?i&&i.parentNode&&i.parentNode.removeChild(i):this._writePosAttr(i,t.x,t.y,t.w,t.h)})),this._updateStyles(!1,i)}}),this.opts.auto){this.batchUpdate();let t=[];this.getGridItems().forEach((e=>{let i=parseInt(e.getAttribute("gs-x")),s=parseInt(e.getAttribute("gs-y"));t.push({el:e,i:(Number.isNaN(i)?1e3:i)+(Number.isNaN(s)?1e3:s)*this.opts.column})})),t.sort((t=>t.i)).forEach((t=>this._prepareElement(t.el))),this.commit()}this.engine.saveInitial(),this.setAnimation(this.opts.animate),this._updateStyles(),12!=this.opts.column&&this.el.classList.add("grid-stack-"+this.opts.column),this._setupDragIn(),this._setupRemoveDrop(),this._setupAcceptWidget(),this._updateWindowResizeEvent()}static init(t={},e=".grid-stack"){let i=h.getGridElement(e);return i?(i.gridstack||(i.gridstack=new h(i,Object.assign({},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"){let i=[];return h.getGridElements(e).forEach((e=>{e.gridstack||(e.gridstack=new h(e,Object.assign({},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=document.implementation.createHTMLDocument();i.body.innerHTML=`<div class="grid-stack ${e.class||""}"></div>`;let s=i.body.children[0];t.append(s);let o=h.init(e,s);return e.children&&o.load(e.children),o}get placeholder(){if(!this._placeholder){let t=document.createElement("div");t.className="placeholder-content",this.opts.placeholderText&&(t.innerHTML=this.opts.placeholderText),this._placeholder=document.createElement("div"),this._placeholder.classList.add(this.opts.placeholderClass,l.itemClass,this.opts.itemClass),this.placeholder.appendChild(t)}return this._placeholder}addWidget(t,e){if(arguments.length>2){console.warn("gridstack.ts: `addWidget(el, x, y, width...)` is deprecated. Use `addWidget({x, y, w, content, ...})`. It will be removed soon");let e=arguments,i=1,s={x:e[i++],y:e[i++],w:e[i++],h:e[i++],autoPosition:e[i++],minW:e[i++],maxW:e[i++],minH:e[i++],maxH:e[i++],id:e[i++]};return this.addWidget(t,s)}let i;if("string"==typeof t){let e=document.implementation.createHTMLDocument();e.body.innerHTML=t,i=e.body.children[0]}else if(0===arguments.length||1===arguments.length&&(void 0!==(s=t).x||void 0!==s.y||void 0!==s.w||void 0!==s.h||void 0!==s.content)){let s=t&&t.content||"";e=t;let o=document.implementation.createHTMLDocument();o.body.innerHTML=`<div class="grid-stack-item ${this.opts.itemClass||""}"><div class="grid-stack-item-content">${s}</div></div>`,i=o.body.children[0]}else i=t;var s;let o=this._readAttr(i);return e=Object.assign({},e||{}),n.Utils.defaults(e,o),this.engine.prepareNode(e),this._writeAttr(i,e),this._insertNotAppend?this.el.prepend(i):this.el.appendChild(i),this._prepareElement(i,!0,e),this._updateContainerHeight(),this._triggerAddEvent(),this._triggerChangeEvent(),i}save(t=!0,e=!1){let i=this.engine.save(t);if(t&&i.forEach((t=>{if(t.el&&!t.subGrid){let e=t.el.querySelector(".grid-stack-item-content");t.content=e?e.innerHTML:void 0,t.content||delete t.content,delete t.el}})),e){i.forEach((i=>{i.subGrid&&(i.subGrid=i.subGrid.save(t,e))}));let s=Object.assign({},this.opts);return s.marginBottom===s.marginTop&&s.marginRight===s.marginLeft&&s.marginTop===s.marginRight&&(s.margin=s.marginTop,delete s.marginTop,delete s.marginRight,delete s.marginBottom,delete s.marginLeft),s.rtl===("rtl"===this.el.style.direction)&&(s.rtl="auto"),this._isAutoCellHeight&&(s.cellHeight="auto"),n.Utils.removeInternalAndSame(s,l),s.children=i,s}return i}load(t,e=!0){let i=h.Utils.sort(t,-1,this._prevColumn||this.opts.column);this._insertNotAppend=!0,this._prevColumn&&this._prevColumn!==this.opts.column&&i.some((t=>t.x+t.w>this.opts.column))&&(this._ignoreLayoutsNodeChange=!0,this.engine.cacheLayout(i,this._prevColumn,!0));let s=[];return this.batchUpdate(),e&&[...this.engine.nodes].forEach((t=>{i.find((e=>t.id===e.id))||("function"==typeof e?e(this,t,!1):(s.push(t),this.removeWidget(t.el,!0,!1)))})),i.forEach((t=>{let i=t.id||0===t.id?this.engine.nodes.find((e=>e.id===t.id)):void 0;if(i){if(this.update(i.el,t),t.subGrid&&t.subGrid.children){let e=i.el.querySelector(".grid-stack");e&&e.gridstack&&(e.gridstack.load(t.subGrid.children),this._insertNotAppend=!0)}}else if(e&&(t="function"==typeof e?e(this,t,!0).gridstackNode:this.addWidget(t).gridstackNode).subGrid){let e=t.el.querySelector(".grid-stack-item-content");t.subGrid=h.addGrid(e,t.subGrid)}})),this.engine.removedNodes=s,this.commit(),delete this._ignoreLayoutsNodeChange,delete this._insertNotAppend,this}batchUpdate(){return this.engine.batchUpdate(),this}getCellHeight(t=!1){if(this.opts.cellHeight&&"auto"!==this.opts.cellHeight&&(!t||!this.opts.cellHeightUnit||"px"===this.opts.cellHeightUnit))return this.opts.cellHeight;let e=this.el.querySelector("."+this.opts.itemClass),i=n.Utils.toNumber(e.getAttribute("gs-h"));return Math.round(e.offsetHeight/i)}cellHeight(t,e=!0){if(e&&void 0!==t&&this._isAutoCellHeight!==("auto"===t)&&(this._isAutoCellHeight="auto"===t,this._updateWindowResizeEvent()),"initial"!==t&&"auto"!==t||(t=void 0),void 0===t){let e=-this.opts.marginRight-this.opts.marginLeft+this.opts.marginTop+this.opts.marginBottom;t=this.cellWidth()+e}let i=n.Utils.parseHeight(t);return this.opts.cellHeightUnit===i.unit&&this.opts.cellHeight===i.h||(this.opts.cellHeightUnit=i.unit,this.opts.cellHeight=i.h,e&&this._updateStyles(!0,this.getRow())),this}cellWidth(){return this._widthOrContainer()/this.opts.column}_widthOrContainer(){return this.el.clientWidth||this.el.parentElement.clientWidth||window.innerWidth}commit(){return this.engine.commit(),this._triggerRemoveEvent(),this._triggerAddEvent(),this._triggerChangeEvent(),this}compact(){return this.engine.compact(),this._triggerChangeEvent(),this}column(t,e="moveScale"){if(this.opts.column===t)return this;let i,s=this.opts.column;return 1===t?this._prevColumn=s:delete this._prevColumn,this.el.classList.remove("grid-stack-"+s),this.el.classList.add("grid-stack-"+t),this.opts.column=this.engine.column=t,1===t&&this.opts.oneColumnModeDomSort&&(i=[],this.getGridItems().forEach((t=>{t.gridstackNode&&i.push(t.gridstackNode)})),i.length||(i=void 0)),this.engine.updateNodeWidths(s,t,i,e),this._ignoreLayoutsNodeChange=!0,this._triggerChangeEvent(),delete this._ignoreLayoutsNodeChange,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)))}destroy(t=!0){if(this.el)return this._updateWindowResizeEvent(!0),this.setStatic(!0),t?this.el.parentNode.removeChild(this.el):(this.removeAll(t),this.el.classList.remove(this.opts._styleSheetClass)),this._removeStylesheet(),delete this.opts._isNested,delete this.opts,delete this._placeholder,delete this.engine,delete this.el.gridstack,delete this.el,this}float(t){return this.engine.float=t,this._triggerChangeEvent(),this}getFloat(){return this.engine.float}getCellFromPixel(t,e=!1){let i,s=this.el.getBoundingClientRect();i=e?{top:s.top+document.documentElement.scrollTop,left:s.left}:{top:this.el.offsetTop,left:this.el.offsetLeft};let o=t.left-i.left,n=t.top-i.top,r=s.width/this.opts.column,l=s.height/parseInt(this.el.getAttribute("gs-current-row"));return{x:Math.floor(o/r),y:Math.floor(n/l)}}getRow(){return Math.max(this.engine.getRow(),this.opts.minRow)}isAreaEmpty(t,e,i,s){return this.engine.isAreaEmpty(t,e,i,s)}makeWidget(t){let e=h.getElement(t);return this._prepareElement(e,!0),this._updateContainerHeight(),this._triggerAddEvent(),this._triggerChangeEvent(),e}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){let i="enable"===t||"disable"===t;this._gsEventHandler[t]=i?t=>e(t):t=>e(t,t.detail),this.el.addEventListener(t,this._gsEventHandler[t])}else"dragstart"===t||"dragstop"===t||"resizestart"===t||"resizestop"===t||"dropped"===t?this._gsEventHandler[t]=e:console.log("GridStack.on("+t+') event not supported, but you can still use $(".grid-stack").on(...) while jquery-ui is still used internally.');return this}off(t){return-1!==t.indexOf(" ")?(t.split(" ").forEach((t=>this.off(t))),this):("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)}removeWidget(t,e=!0,i=!0){return h.getElements(t).forEach((t=>{if(t.parentElement!==this.el)return;let s=t.gridstackNode;s||(s=this.engine.nodes.find((e=>t===e.el))),s&&(delete t.gridstackNode,r.GridStackDDI.get().remove(t),this.engine.removeNode(s,e,i),e&&t.parentElement&&t.remove())})),i&&(this._triggerRemoveEvent(),this._triggerChangeEvent()),this}removeAll(t=!0){return this.engine.nodes.forEach((t=>{delete t.el.gridstackNode,r.GridStackDDI.get().remove(t.el)})),this.engine.removeAll(t),this._triggerRemoveEvent(),this}setAnimation(t){return t?this.el.classList.add("grid-stack-animate"):this.el.classList.remove("grid-stack-animate"),this}setStatic(t){return this.opts.staticGrid===t||(this.opts.staticGrid=t,this.engine.nodes.forEach((t=>this._prepareDragDropByNode(t))),this._setStaticClass()),this}update(t,e){if(arguments.length>2){console.warn("gridstack.ts: `update(el, x, y, w, h)` is deprecated. Use `update({x, w, content, ...})`. It will be removed soon");let i=arguments,s=1;return e={x:i[s++],y:i[s++],w:i[s++],h:i[s++]},this.update(t,e)}return h.getElements(t).forEach((t=>{if(!t||!t.gridstackNode)return;let i=t.gridstackNode,s=Object.assign({},e);delete s.autoPosition;let o,n=["x","y","w","h"];if(n.some((t=>void 0!==s[t]&&s[t]!==i[t]))&&(o={},n.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={}),s.content){let e=t.querySelector(".grid-stack-item-content");e&&e.innerHTML!==s.content&&(e.innerHTML=s.content),delete s.content}let r=!1,l=!1;for(const t in s)"_"!==t[0]&&i[t]!==s[t]&&(i[t]=s[t],r=!0,l=l||!this.opts.staticGrid&&("noResize"===t||"noMove"===t||"locked"===t));o&&(this.engine.cleanNodes(),this.engine.beginUpdate(i),this.engine.moveNode(i,o.x,o.y,o.w,o.h),this._updateContainerHeight(),this._triggerChangeEvent(),this.engine.endUpdate()),r&&this._writeAttr(t,i),l&&this._prepareDragDropByNode(i)})),this}margin(t){if(!("string"==typeof t&&t.split(" ").length>1)){let e=n.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._updateStyles(!0),this}getMargin(){return this.opts.margin}willItFit(t){if(arguments.length>1){console.warn("gridstack.ts: `willItFit(x,y,w,h,autoPosition)` is deprecated. Use `willItFit({x, y,...})`. It will be removed soon");let t=arguments,e=0,i={x:t[e++],y:t[e++],w:t[e++],h:t[e++],autoPosition:t[e++]};return this.willItFit(i)}return this.engine.willItFit(t)}_triggerChangeEvent(){if(this.engine.batchMode)return this;let t=this.engine.getDirtyNodes(!0);return t&&t.length&&(this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(t),this._triggerEvent("change",t)),this.engine.saveInitial(),this}_triggerAddEvent(){return this.engine.batchMode||this.engine.addedNodes&&this.engine.addedNodes.length>0&&(this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(this.engine.addedNodes),this.engine.addedNodes.forEach((t=>{delete t._dirty})),this._triggerEvent("added",this.engine.addedNodes),this.engine.addedNodes=[]),this}_triggerRemoveEvent(){return this.engine.batchMode||this.engine.removedNodes&&this.engine.removedNodes.length>0&&(this._triggerEvent("removed",this.engine.removedNodes),this.engine.removedNodes=[]),this}_triggerEvent(t,e){let i=e?new CustomEvent(t,{bubbles:!1,detail:e}):new Event(t);return this.el.dispatchEvent(i),this}_removeStylesheet(){return this._styles&&(n.Utils.removeStylesheet(this._styles._id),delete this._styles),this}_updateStyles(t=!1,e){if(t&&this._removeStylesheet(),this._updateContainerHeight(),0===this.opts.cellHeight)return this;let i=this.opts.cellHeight,s=this.opts.cellHeightUnit,o=`.${this.opts._styleSheetClass} > .${this.opts.itemClass}`;if(!this._styles){let t="gridstack-style-"+(1e5*Math.random()).toFixed(),e=this.opts.styleInHead?void 0:this.el.parentNode;if(this._styles=n.Utils.createStylesheet(t,e),!this._styles)return this;this._styles._id=t,this._styles._max=0,n.Utils.addCSSRule(this._styles,o,`min-height: ${i}${s}`);let r=this.opts.marginTop+this.opts.marginUnit,l=this.opts.marginBottom+this.opts.marginUnit,h=this.opts.marginRight+this.opts.marginUnit,a=this.opts.marginLeft+this.opts.marginUnit,d=`${o} > .grid-stack-item-content`,g=`.${this.opts._styleSheetClass} > .grid-stack-placeholder > .placeholder-content`;n.Utils.addCSSRule(this._styles,d,`top: ${r}; right: ${h}; bottom: ${l}; left: ${a};`),n.Utils.addCSSRule(this._styles,g,`top: ${r}; right: ${h}; bottom: ${l}; left: ${a};`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-ne`,`right: ${h}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-e`,`right: ${h}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-se`,`right: ${h}; bottom: ${l}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-nw`,`left: ${a}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-w`,`left: ${a}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-sw`,`left: ${a}; bottom: ${l}`)}if((e=e||this._styles._max)>this._styles._max){let t=t=>i*t+s;for(let i=this._styles._max+1;i<=e;i++){let e=t(i);n.Utils.addCSSRule(this._styles,`${o}[gs-y="${i-1}"]`,`top: ${t(i-1)}`),n.Utils.addCSSRule(this._styles,`${o}[gs-h="${i}"]`,`height: ${e}`),n.Utils.addCSSRule(this._styles,`${o}[gs-min-h="${i}"]`,`min-height: ${e}`),n.Utils.addCSSRule(this._styles,`${o}[gs-max-h="${i}"]`,`max-height: ${e}`)}this._styles._max=e}return this}_updateContainerHeight(){if(!this.engine||this.engine.batchMode)return this;let t=this.getRow(),e=parseInt(getComputedStyle(this.el)["min-height"]);if(e>0){let i=Math.round(e/this.getCellHeight(!0));t<i&&(t=i)}if(this.el.setAttribute("gs-current-row",String(t)),0===t)return this.el.style.removeProperty("height"),this;let i=this.opts.cellHeight,s=this.opts.cellHeightUnit;return i?(this.el.style.height=t*i+s,this):this}_prepareElement(t,e=!1,i){i||(t.classList.add(this.opts.itemClass),i=this._readAttr(t)),t.gridstackNode=i,i.el=t,i.grid=this;let s=Object.assign({},i);return i=this.engine.addNode(i,e),n.Utils.same(i,s)||this._writeAttr(t,i),this._prepareDragDropByNode(i),this}_writePosAttr(t,e,i,s,o){return null!=e&&t.setAttribute("gs-x",String(e)),null!=i&&t.setAttribute("gs-y",String(i)),s&&t.setAttribute("gs-w",String(s)),o&&t.setAttribute("gs-h",String(o)),this}_writeAttr(t,e){if(!e)return this;this._writePosAttr(t,e.x,e.y,e.w,e.h);let i={autoPosition:"gs-auto-position",minW:"gs-min-w",minH:"gs-min-h",maxW:"gs-max-w",maxH:"gs-max-h",noResize:"gs-no-resize",noMove:"gs-no-move",locked:"gs-locked",id:"gs-id",resizeHandles:"gs-resize-handles"};for(const s in i)e[s]?t.setAttribute(i[s],String(e[s])):t.removeAttribute(i[s]);return this}_readAttr(t){let e={};e.x=n.Utils.toNumber(t.getAttribute("gs-x")),e.y=n.Utils.toNumber(t.getAttribute("gs-y")),e.w=n.Utils.toNumber(t.getAttribute("gs-w")),e.h=n.Utils.toNumber(t.getAttribute("gs-h")),e.maxW=n.Utils.toNumber(t.getAttribute("gs-max-w")),e.minW=n.Utils.toNumber(t.getAttribute("gs-min-w")),e.maxH=n.Utils.toNumber(t.getAttribute("gs-max-h")),e.minH=n.Utils.toNumber(t.getAttribute("gs-min-h")),e.autoPosition=n.Utils.toBool(t.getAttribute("gs-auto-position")),e.noResize=n.Utils.toBool(t.getAttribute("gs-no-resize")),e.noMove=n.Utils.toBool(t.getAttribute("gs-no-move")),e.locked=n.Utils.toBool(t.getAttribute("gs-locked")),e.resizeHandles=t.getAttribute("gs-resize-handles"),e.id=t.getAttribute("gs-id");for(const t in e){if(!e.hasOwnProperty(t))return;e[t]||0===e[t]||delete e[t]}return e}_setStaticClass(){let 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}onParentResize(){if(!this.el||!this.el.clientWidth)return;let t=!this.opts.disableOneColumnMode&&this.el.clientWidth<=this.opts.minWidth,e=!1;return!this._oneColumnMode!=!t&&(this._oneColumnMode=t,e=!0,this.opts.animate&&this.setAnimation(!1),this.column(t?1:this._prevColumn),this.opts.animate&&this.setAnimation(!0)),this._isAutoCellHeight&&(!e&&this.opts.cellHeightThrottle?(this._cellHeightThrottle||(this._cellHeightThrottle=n.Utils.throttle((()=>this.cellHeight()),this.opts.cellHeightThrottle)),this._cellHeightThrottle()):this.cellHeight()),this.engine.nodes.forEach((t=>{t.subGrid&&t.subGrid.onParentResize()})),this}_updateWindowResizeEvent(t=!1){const e=(this._isAutoCellHeight||!this.opts.disableOneColumnMode)&&!this.opts._isNested;return t||!e||this._windowResizeBind?!t&&e||!this._windowResizeBind||(window.removeEventListener("resize",this._windowResizeBind),delete this._windowResizeBind):(this._windowResizeBind=this.onParentResize.bind(this),window.addEventListener("resize",this._windowResizeBind)),this}static getElement(t=".grid-stack-item"){return n.Utils.getElement(t)}static getElements(t=".grid-stack-item"){return n.Utils.getElements(t)}static getGridElement(t){return h.getElement(t)}static getGridElements(t){return n.Utils.getElements(t)}initMargin(){let t,e=0,i=[];return"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=n.Utils.parseHeight(this.opts.margin),this.opts.marginUnit=t.unit,e=this.opts.margin=t.h),void 0===this.opts.marginTop?this.opts.marginTop=e:(t=n.Utils.parseHeight(this.opts.marginTop),this.opts.marginTop=t.h,delete this.opts.margin),void 0===this.opts.marginBottom?this.opts.marginBottom=e:(t=n.Utils.parseHeight(this.opts.marginBottom),this.opts.marginBottom=t.h,delete this.opts.margin),void 0===this.opts.marginRight?this.opts.marginRight=e:(t=n.Utils.parseHeight(this.opts.marginRight),this.opts.marginRight=t.h,delete this.opts.margin),void 0===this.opts.marginLeft?this.opts.marginLeft=e:(t=n.Utils.parseHeight(this.opts.marginLeft),this.opts.marginLeft=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),this}movable(t,e){return this}resizable(t,e){return this}disable(){return this}enable(){return this}enableMove(t,e=!0){return this}enableResize(t,e=!0){return this}_setupAcceptWidget(){return this}_setupRemoveDrop(){return this}_setupRemovingTimeout(t){return this}_clearRemovingTimeout(t){return this}_setupDragIn(){return this}_prepareDragDropByNode(t){return this}locked(t,e){return this.update(t,{locked:e})}maxWidth(t,e){return this.update(t,{maxW:e})}minWidth(t,e){return this.update(t,{minW:e})}maxHeight(t,e){return this.update(t,{maxH:e})}minHeight(t,e){return this.update(t,{minH:e})}move(t,e,i){return this.update(t,{x:e,y:i})}resize(t,e,i){return this.update(t,{w:e,h:i})}}e.GridStack=h,h.Utils=n.Utils,h.Engine=o.GridStackEngine},822:(t,e,i)=>{function s(t){for(var i in t)e.hasOwnProperty(i)||(e[i]=t[i])}Object.defineProperty(e,"__esModule",{value:!0}),s(i(593)),s(i(62)),s(i(334)),s(i(270))},593:(t,e)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.obsolete=function(t,e,i,s,o){let n=(...n)=>(console.warn("gridstack.js: Function `"+i+"` is deprecated in "+o+" and has been replaced with `"+s+"`. It will be **completely** removed in v1.0"),e.apply(t,n));return n.prototype=e.prototype,n},e.obsoleteOpts=function(t,e,i,s){void 0!==t[e]&&(t[i]=t[e],console.warn("gridstack.js: Option `"+e+"` is deprecated in "+s+" and has been replaced with `"+i+"`. It will be **completely** removed in v1.0"))},e.obsoleteOptsDel=function(t,e,i,s){void 0!==t[e]&&console.warn("gridstack.js: Option `"+e+"` is deprecated in "+i+s)},e.obsoleteAttr=function(t,e,i,s){let o=t.getAttribute(e);null!==o&&(t.setAttribute(i,o),console.warn("gridstack.js: attribute `"+e+"`="+o+" is deprecated on this object in "+s+" and has been replaced with `"+i+"`. It will be **completely** removed in v1.0"))},e.Utils=class{static getElements(t){if("string"==typeof t){let e=document.querySelectorAll(t);return e.length||"."===t[0]||"#"===t[0]||(e=document.querySelectorAll("."+t),e.length||(e=document.querySelectorAll("#"+t))),Array.from(e)}return[t]}static getElement(t){if("string"==typeof t){if(!t.length)return null;if("#"===t[0])return document.getElementById(t.substring(1));if("."===t[0]||"["===t[0])return document.querySelector(t);if(!isNaN(+t[0]))return document.getElementById(t);let e=document.querySelector(t);return e||(e=document.getElementById(t)),e||(e=document.querySelector("."+t)),e}return t}static isIntercepted(t,e){return!(t.x+t.w<=e.x||e.x+e.w<=t.x||t.y+t.h<=e.y||e.y+e.h<=t.y)}static sort(t,e,i){if(!i){let e=t.map((t=>t.x+t.w));i=Math.max(...e)}return-1===e?t.sort(((t,e)=>e.x+e.y*i-(t.x+t.y*i))):t.sort(((t,e)=>t.x+t.y*i-(e.x+e.y*i)))}static createStylesheet(t,e){let i=document.createElement("style");return i.setAttribute("type","text/css"),i.setAttribute("gs-style-id",t),i.styleSheet?i.styleSheet.cssText="":i.appendChild(document.createTextNode("")),e?e.insertBefore(i,e.firstChild):(e=document.getElementsByTagName("head")[0]).appendChild(i),i.sheet}static removeStylesheet(t){let e=document.querySelector("STYLE[gs-style-id="+t+"]");e&&e.parentNode&&e.remove()}static addCSSRule(t,e,i){"function"==typeof t.addRule?t.addRule(e,i):"function"==typeof t.insertRule&&t.insertRule(`${e}{${i}}`)}static toBool(t){return"boolean"==typeof t?t:"string"==typeof t?!(""===(t=t.toLowerCase())||"no"===t||"false"===t||"0"===t):Boolean(t)}static toNumber(t){return null===t||0===t.length?void 0:Number(t)}static parseHeight(t){let e,i="px";if("string"==typeof t){let s=t.match(/^(-[0-9]+\.[0-9]+|[0-9]*\.[0-9]+|-[0-9]+|[0-9]+)(px|em|rem|vh|vw|%)?$/);if(!s)throw new Error("Invalid height");i=s[2]||"px",e=parseFloat(s[1])}else e=t;return{h:e,unit:i}}static defaults(t,...e){return e.forEach((e=>{for(const i in e){if(!e.hasOwnProperty(i))return;null===t[i]||void 0===t[i]?t[i]=e[i]:"object"==typeof e[i]&&"object"==typeof t[i]&&this.defaults(t[i],e[i])}})),t}static same(t,e){if("object"!=typeof t)return t==e;if(typeof t!=typeof e)return!1;if(Object.keys(t).length!==Object.keys(e).length)return!1;for(const i in t)if(t[i]!==e[i])return!1;return!0}static removeInternalAndSame(t,e){if("object"==typeof t&&"object"==typeof e)for(let i in t){let s=t[i];if(s&&"object"==typeof s){for(let t in s)s[t]!==e[i][t]&&"_"!==t[0]||delete s[t];Object.keys(s).length||delete t[i]}else s!==e[i]&&"_"!==i[0]||delete t[i]}}static closestByClass(t,e){for(;t=t.parentElement;)if(t.classList.contains(e))return t;return null}static throttle(t,e){let i=!1;return(...s)=>{i||(i=!0,setTimeout((()=>{t(...s),i=!1}),e))}}static removePositioningStyles(t){let e=t.style;e.position&&e.removeProperty("position"),e.left&&e.removeProperty("left"),e.top&&e.removeProperty("top"),e.width&&e.removeProperty("width"),e.height&&e.removeProperty("height")}static getScrollParent(t){if(null===t)return document.documentElement;const e=getComputedStyle(t);return/(auto|scroll)/.test(e.overflow+e.overflowY)?t:this.getScrollParent(t.parentElement)}static updateScrollPosition(t,e,i){let s=t.getBoundingClientRect(),o=window.innerHeight||document.documentElement.clientHeight;if(s.top<0||s.bottom>o){let n=s.bottom-o,r=s.top,l=this.getScrollParent(t);if(null!==l){let h=l.scrollTop;s.top<0&&i<0?t.offsetHeight>o?l.scrollTop+=i:l.scrollTop+=Math.abs(r)>Math.abs(i)?i:r:i>0&&(t.offsetHeight>o?l.scrollTop+=i:l.scrollTop+=n>i?i:n),e.top+=l.scrollTop-h}}}static updateScrollResize(t,e,i){const s=this.getScrollParent(e),o=s.clientHeight,n=t.clientY<i,r=t.clientY>o-i;n?s.scrollBy({behavior:"smooth",top:t.clientY-i}):r&&s.scrollBy({behavior:"smooth",top:i-(o-t.clientY)})}}}},e={};return function i(s){if(e[s])return e[s].exports;var o=e[s]={exports:{}};return t[s](o,o.exports,i),o.exports}(822)})().GridStack})); | ||
| !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.GridStack=e():t.GridStack=e()}(self,(function(){return(()=>{"use strict";var t={334:(t,e)=>{Object.defineProperty(e,"__esModule",{value:!0});class i{static registerPlugin(t){return i.ddi=new t,i.ddi}static get(){return i.ddi||i.registerPlugin(i)}remove(t){return this}}e.GridStackDDI=i},62:(t,e,i)=>{Object.defineProperty(e,"__esModule",{value:!0});const s=i(593);class o{constructor(t={}){this.addedNodes=[],this.removedNodes=[],this.column=t.column||12,this.onChange=t.onChange,this._float=t.float,this.maxRow=t.maxRow,this.nodes=t.nodes||[]}batchUpdate(){return this.batchMode||(this.batchMode=!0,this._prevFloat=this._float,this._float=!0),this}commit(){return this.batchMode?(this.batchMode=!1,this._float=this._prevFloat,delete this._prevFloat,this._packNodes()._notify()):this}_useEntireRowArea(t,e){return!this.float&&!this._hasLocked&&(!t._moving||t._skipDown||e.y<=t.y)}_fixCollisions(t,e=t,i,o={}){if(this._sortNodes(-1),!(i=i||this.collide(t,e)))return!1;if(t._moving&&!o.nested&&!this.float&&this.swap(t,i))return!0;let n=e;this._useEntireRowArea(t,e)&&(n={x:0,w:this.column,y:e.y,h:e.h},i=this.collide(t,n,o.skip));let r=!1,l={nested:!0,pack:!1};for(;i=i||this.collide(t,n,o.skip);){let n;if(i.locked||t._moving&&!t._skipDown&&e.y>t.y&&!this.float&&(!this.collide(i,Object.assign(Object.assign({},i),{y:t.y}),t)||!this.collide(i,Object.assign(Object.assign({},i),{y:e.y-i.h}),t))?(t._skipDown=t._skipDown||e.y>t.y,n=this.moveNode(t,Object.assign(Object.assign(Object.assign({},e),{y:i.y+i.h}),l)),i.locked&&n?s.Utils.copyPos(e,t):!i.locked&&n&&o.pack&&(this._packNodes(),e.y=i.y+i.h,s.Utils.copyPos(t,e)),r=r||n):n=this.moveNode(i,Object.assign(Object.assign(Object.assign({},i),{y:e.y+e.h,skip:t}),l)),!n)return r;i=void 0}return r}collide(t,e=t,i){return this.nodes.find((o=>o!==t&&o!==i&&s.Utils.isIntercepted(o,e)))}collideAll(t,e=t,i){return this.nodes.filter((o=>o!==t&&o!==i&&s.Utils.isIntercepted(o,e)))}collideCoverage(t,e,i){if(!e.rect||!t._rect)return;let s,o=t._rect,n=Object.assign({},e.rect);return n.y>o.y?(n.h+=n.y-o.y,n.y=o.y):n.h+=o.y-n.y,n.x>o.x?(n.w+=n.x-o.x,n.x=o.x):n.w+=o.x-n.x,i.forEach((t=>{if(t.locked||!t._rect)return;let e=t._rect,i=Number.MAX_VALUE,r=Number.MAX_VALUE,l=.5;o.y<e.y?i=(n.y+n.h-e.y)/e.h:o.y+o.h>e.y+e.h&&(i=(e.y+e.h-n.y)/e.h),o.x<e.x?r=(n.x+n.w-e.x)/e.w:o.x+o.w>e.x+e.w&&(r=(e.x+e.w-n.x)/e.w);let h=Math.min(r,i);h>l&&(l=h,s=t)})),s}cacheRects(t,e,i,s,o,n){return this.nodes.forEach((r=>r._rect={y:r.y*e+i,x:r.x*t+n,w:r.w*t-n-s,h:r.h*e-i-o})),this}swap(t,e){if(!e||e.locked||!t||t.locked)return!1;function i(){let i=e.x,s=e.y;return e.x=t.x,e.y=t.y,t.h!=e.h?(t.x=i,t.y=e.y+e.h):(t.x=i,t.y=s),t._dirty=e._dirty=!0,!0}let o;if(t.w===e.w&&t.h===e.h&&(t.x===e.x||t.y===e.y)&&(o=s.Utils.isTouching(t,e)))return i();if(!1!==o){if(t.w===e.w&&t.x===e.x&&(o||s.Utils.isTouching(t,e))){if(e.y<t.y){let i=t;t=e,e=i}return i()}return!1}}isAreaEmpty(t,e,i,s){let o={x:t||0,y:e||0,w:i||1,h:s||1};return!this.collide(o)}compact(){if(0===this.nodes.length)return this;this.batchUpdate()._sortNodes();let t=this.nodes;return this.nodes=[],t.forEach((t=>{t.locked||(t.autoPosition=!0),this.addNode(t,!1),t._dirty=!0})),this.commit()}set float(t){this._float!==t&&(this._float=t||!1,t||this._packNodes()._notify())}get float(){return this._float||!1}_sortNodes(t){return this.nodes=s.Utils.sort(this.nodes,t,this.column),this}_packNodes(){return this._sortNodes(),this.float?this.nodes.forEach((t=>{if(t._updating||void 0===t._orig||t.y===t._orig.y)return;let e=t.y;for(;e>t._orig.y;)--e,this.collide(t,{x:t.x,y:e,w:t.w,h:t.h})||(t._dirty=!0,t.y=e)})):this.nodes.forEach(((t,e)=>{if(!t.locked)for(;t.y>0;){let i=0===e?0:t.y-1;if(0!==e&&this.collide(t,{x:t.x,y:i,w:t.w,h:t.h}))break;t._dirty=t.y!==i,t.y=i}})),this}prepareNode(t,e){(t=t||{})._id=t._id||o._idSeq++,void 0!==t.x&&void 0!==t.y&&null!==t.x&&null!==t.y||(t.autoPosition=!0);let i={x:0,y:0,w:1,h:1};return s.Utils.defaults(t,i),t.autoPosition||delete t.autoPosition,t.noResize||delete t.noResize,t.noMove||delete t.noMove,"string"==typeof t.x&&(t.x=Number(t.x)),"string"==typeof t.y&&(t.y=Number(t.y)),"string"==typeof t.w&&(t.w=Number(t.w)),"string"==typeof t.h&&(t.h=Number(t.h)),isNaN(t.x)&&(t.x=i.x,t.autoPosition=!0),isNaN(t.y)&&(t.y=i.y,t.autoPosition=!0),isNaN(t.w)&&(t.w=i.w),isNaN(t.h)&&(t.h=i.h),this.nodeBoundFix(t,e)}nodeBoundFix(t,e){return t.maxW&&(t.w=Math.min(t.w,t.maxW)),t.maxH&&(t.h=Math.min(t.h,t.maxH)),t.minW&&(t.w=Math.max(t.w,t.minW)),t.minH&&(t.h=Math.max(t.h,t.minH)),t.w>this.column?t.w=this.column:t.w<1&&(t.w=1),this.maxRow&&t.h>this.maxRow?t.h=this.maxRow:t.h<1&&(t.h=1),t.x<0&&(t.x=0),t.y<0&&(t.y=0),t.x+t.w>this.column&&(e?t.w=this.column-t.x:t.x=this.column-t.w),this.maxRow&&t.y+t.h>this.maxRow&&(e?t.h=this.maxRow-t.y:t.y=this.maxRow-t.h),t}getDirtyNodes(t){return t?this.nodes.filter((t=>t._dirty&&!s.Utils.samePos(t,t._orig))):this.nodes.filter((t=>t._dirty))}_notify(t,e=!0){if(this.batchMode)return this;let i=(t=void 0===t?[]:Array.isArray(t)?t:[t]).concat(this.getDirtyNodes());return this.onChange&&this.onChange(i,e),this}cleanNodes(){return this.batchMode||this.nodes.forEach((t=>{delete t._dirty,delete t._lastTried})),this}saveInitial(){return this.nodes.forEach((t=>{t._orig=s.Utils.copyPos({},t),delete t._dirty})),this._hasLocked=this.nodes.some((t=>t.locked)),this}restoreInitial(){return this.nodes.forEach((t=>{s.Utils.samePos(t,t._orig)||(s.Utils.copyPos(t,t._orig),t._dirty=!0)})),this._notify(),this}addNode(t,e=!1){let i;if(i=this.nodes.find((e=>e._id===t._id)))return i;if(delete(t=this.prepareNode(t))._temporaryRemoved,delete t._removeDOM,t.autoPosition){this._sortNodes();for(let e=0;;++e){let i=e%this.column,o=Math.floor(e/this.column);if(i+t.w>this.column)continue;let n={x:i,y:o,w:t.w,h:t.h};if(!this.nodes.find((t=>s.Utils.isIntercepted(n,t)))){t.x=i,t.y=o,delete t.autoPosition;break}}}return this.nodes.push(t),e&&this.addedNodes.push(t),this._fixCollisions(t),this._packNodes()._notify(),t}removeNode(t,e=!0,i=!1){if(this.nodes.find((e=>e===t)))return i&&this.removedNodes.push(t),e&&(t._removeDOM=!0),this.nodes=this.nodes.filter((e=>e!==t)),this._packNodes()._notify(t,e)}removeAll(t=!0){return delete this._layouts,0===this.nodes.length?this:(t&&this.nodes.forEach((t=>t._removeDOM=!0)),this.removedNodes=this.nodes,this.nodes=[],this._notify(this.removedNodes,t))}moveNodeCheck(t,e){if(t.locked)return!1;if(!this.changedPosConstrain(t,e))return!1;if(e.pack=!0,!this.maxRow)return this.moveNode(t,e);let i,n=new o({column:this.column,float:this.float,nodes:this.nodes.map((e=>e===t?(i=Object.assign({},e),i):Object.assign({},e)))});if(!i)return!1;let r=n.moveNode(i,e);if(this.maxRow&&r&&(r=n.getRow()<=this.maxRow,!r)){let i=this.collide(t,e);if(i&&this.swap(t,i))return this._notify(),!0}return!!r&&(n.nodes.filter((t=>t._dirty)).forEach((t=>{let e=this.nodes.find((e=>e._id===t._id));e&&(s.Utils.copyPos(e,t),e._dirty=!0)})),this._notify(),!0)}willItFit(t){if(!this.maxRow)return!0;let e=new o({column:this.column,float:this.float,nodes:this.nodes.map((t=>Object.assign({},t)))});return e.addNode(t),e.getRow()<=this.maxRow}isOutside(t,e,i){if(i._isCursorOutside)return!1;if(t<0||t>=this.column||e<0)return!0;if(this.maxRow)return e>=this.maxRow;if(this.float)return!1;let s=this.getRow();if(e<s||0===e)return!1;if(e>s)return!0;if(!i._temporaryRemoved){let s=new o({column:this.column,float:this.float,nodes:this.nodes.filter((t=>t!==i)).map((t=>Object.assign({},t)))}),n=Object.assign(Object.assign({},i),{x:t,y:e});return s.addNode(n),n.y===i.y&&n.x===i.x}return i._temporaryRemoved}changedPosConstrain(t,e){return e.w=e.w||t.w,e.h=e.h||t.h,t.x!==e.x||t.y!==e.y||(t.maxW&&(e.w=Math.min(e.w,t.maxW)),t.maxH&&(e.h=Math.min(e.h,t.maxH)),t.minW&&(e.w=Math.max(e.w,t.minW)),t.minH&&(e.h=Math.max(e.h,t.minH)),t.w!==e.w||t.h!==e.h)}moveNode(t,e){if(!t||t.locked||!e)return!1;void 0===e.pack&&(e.pack=!0),"number"!=typeof e.x&&(e.x=t.x),"number"!=typeof e.y&&(e.y=t.y),"number"!=typeof e.w&&(e.w=t.w),"number"!=typeof e.h&&(e.h=t.h);let i=t.w!==e.w||t.h!==e.h,o={maxW:t.maxW,maxH:t.maxH,minW:t.minW,minH:t.minH};if(s.Utils.copyPos(o,e),o=this.nodeBoundFix(o,i),s.Utils.copyPos(e,o),s.Utils.samePos(t,e))return!1;let n=s.Utils.copyPos({},t),r=o,l=this.collideAll(t,r,e.skip),h=!0;if(l.length){let i=t._moving&&!e.nested?this.collideCoverage(t,e,l):l[0];h=!!i&&!this._fixCollisions(t,o,i,e)}return h&&(t._dirty=!0,s.Utils.copyPos(t,o)),e.pack&&this._packNodes()._notify(),!s.Utils.samePos(t,n)}getRow(){return this.nodes.reduce(((t,e)=>Math.max(t,e.y+e.h)),0)}beginUpdate(t){return t._updating||(t._updating=!0,delete t._skipDown,this.saveInitial()),this}endUpdate(){let t=this.nodes.find((t=>t._updating));return t&&(delete t._updating,delete t._skipDown),this}save(t=!0){let e=[];return this._sortNodes(),this.nodes.forEach((i=>{let s={};for(let t in i)"_"!==t[0]&&null!==i[t]&&void 0!==i[t]&&(s[t]=i[t]);t||delete s.el,delete s.grid,s.autoPosition||delete s.autoPosition,s.noResize||delete s.noResize,s.noMove||delete s.noMove,s.locked||delete s.locked,e.push(s)})),e}layoutsNodesChange(t){return!this._layouts||this._ignoreLayoutsNodeChange||this._layouts.forEach(((e,i)=>{if(!e||i===this.column)return this;i<this.column?this._layouts[i]=void 0:t.forEach((t=>{let s=e.find((e=>e._id===t._id));if(!s)return this;let o=i/this.column;t.y!==t._orig.y&&(s.y+=t.y-t._orig.y),t.x!==t._orig.x&&(s.x=Math.round(t.x*o)),t.w!==t._orig.w&&(s.w=Math.round(t.w*o))}))})),this}updateNodeWidths(t,e,i,o="moveScale"){if(!this.nodes.length||t===e)return this;if(this.cacheLayout(this.nodes,t),1===e&&i&&i.length){let t=0;i.forEach((e=>{e.x=0,e.w=1,e.y=Math.max(e.y,t),t=e.y+e.h}))}else i=s.Utils.sort(this.nodes,-1,t);let n=this._layouts[e]||[],r=this._layouts.length-1;0===n.length&&e>t&&e<r&&(n=this._layouts[r]||[],n.length&&(t=r,n.forEach((t=>{let e=i.findIndex((e=>e._id===t._id));-1!==e&&(i[e].x=t.x,i[e].y=t.y,i[e].w=t.w)})),n=[]));let l=[];if(n.forEach((t=>{let e=i.findIndex((e=>e._id===t._id));-1!==e&&(i[e].x=t.x,i[e].y=t.y,i[e].w=t.w,l.push(i[e]),i.splice(e,1))})),i.length)if("function"==typeof o)o(e,t,l,i);else{let s=e/t,n="move"===o||"moveScale"===o,r="scale"===o||"moveScale"===o;i.forEach((i=>{i.x=1===e?0:n?Math.round(i.x*s):Math.min(i.x,e-1),i.w=1===e||1===t?1:r?Math.round(i.w*s)||1:Math.min(i.w,e),l.push(i)})),i=[]}return l=s.Utils.sort(l,-1,e),this._ignoreLayoutsNodeChange=!0,this.batchUpdate(),this.nodes=[],l.forEach((t=>{this.addNode(t,!1),t._dirty=!0}),this),this.commit(),delete this._ignoreLayoutsNodeChange,this}cacheLayout(t,e,i=!1){let s=[];return t.forEach(((t,e)=>{t._id=t._id||o._idSeq++,s[e]={x:t.x,y:t.y,w:t.w,_id:t._id}})),this._layouts=i?[]:this._layouts||[],this._layouts[e]=s,this}cleanupNode(t){for(let e in t)"_"===e[0]&&"_id"!==e&&delete t[e];return this}}e.GridStackEngine=o,o._idSeq=1},270:(t,e,i)=>{function s(t){for(var i in t)e.hasOwnProperty(i)||(e[i]=t[i])}Object.defineProperty(e,"__esModule",{value:!0});const o=i(62),n=i(593),r=i(334);s(i(593)),s(i(62)),s(i(334));const l={column:12,minRow:0,maxRow:0,itemClass:"grid-stack-item",placeholderClass:"grid-stack-placeholder",placeholderText:"",handle:".grid-stack-item-content",handleClass:null,styleInHead:!1,cellHeight:"auto",cellHeightThrottle:100,margin:10,auto:!0,minWidth:768,float:!1,staticGrid:!1,animate:!0,alwaysShowResizeHandle:!1,resizable:{autoHide:!0,handles:"se"},draggable:{handle:".grid-stack-item-content",scroll:!1,appendTo:"body"},disableDrag:!1,disableResize:!1,rtl:"auto",removable:!1,removableOptions:{accept:".grid-stack-item"},marginUnit:"px",cellHeightUnit:"px",disableOneColumnMode:!1,oneColumnModeDomSort:!1};class h{constructor(t,e={}){this._gsEventHandler={},this.el=t,(e=e||{}).row&&(e.minRow=e.maxRow=e.row,delete e.row);let i=n.Utils.toNumber(t.getAttribute("gs-row")),s=Object.assign(Object.assign({},l),{column:n.Utils.toNumber(t.getAttribute("gs-column"))||12,minRow:i||n.Utils.toNumber(t.getAttribute("gs-min-row"))||0,maxRow:i||n.Utils.toNumber(t.getAttribute("gs-max-row"))||0,staticGrid:n.Utils.toBool(t.getAttribute("gs-static"))||!1,_styleSheetClass:"grid-stack-instance-"+(1e4*Math.random()).toFixed(0),alwaysShowResizeHandle:e.alwaysShowResizeHandle||!1,resizable:{autoHide:!e.alwaysShowResizeHandle,handles:"se"},draggable:{handle:(e.handleClass?"."+e.handleClass:e.handle?e.handle:"")||".grid-stack-item-content",scroll:!1,appendTo:"body"},removableOptions:{accept:"."+(e.itemClass||"grid-stack-item")}});t.getAttribute("gs-animate")&&(s.animate=n.Utils.toBool(t.getAttribute("gs-animate"))),this.opts=n.Utils.defaults(e,s),e=null,this.initMargin(),1!==this.opts.column&&!this.opts.disableOneColumnMode&&this._widthOrContainer()<=this.opts.minWidth&&(this._prevColumn=this.opts.column,this.opts.column=1),"auto"===this.opts.rtl&&(this.opts.rtl="rtl"===t.style.direction),this.opts.rtl&&this.el.classList.add("grid-stack-rtl");let r=n.Utils.closestByClass(this.el,l.itemClass);if(r&&r.gridstackNode&&(this.opts._isNested=r.gridstackNode,this.opts._isNested.subGrid=this,this.el.classList.add("grid-stack-nested")),this._isAutoCellHeight="auto"===this.opts.cellHeight,this._isAutoCellHeight||"initial"===this.opts.cellHeight?this.cellHeight(void 0,!1):this.cellHeight(this.opts.cellHeight,!1),this.el.classList.add(this.opts._styleSheetClass),this._setStaticClass(),this.engine=new o.GridStackEngine({column:this.opts.column,float:this.opts.float,maxRow:this.opts.maxRow,onChange:(t,e=!0)=>{let i=0;this.engine.nodes.forEach((t=>{i=Math.max(i,t.y+t.h)})),t.forEach((t=>{let i=t.el;e&&t._removeDOM?(i&&i.remove(),delete t._removeDOM):this._writePosAttr(i,t)})),this._updateStyles(!1,i)}}),this.opts.auto){this.batchUpdate();let t=[];this.getGridItems().forEach((e=>{let i=parseInt(e.getAttribute("gs-x")),s=parseInt(e.getAttribute("gs-y"));t.push({el:e,i:(Number.isNaN(i)?1e3:i)+(Number.isNaN(s)?1e3:s)*this.opts.column})})),t.sort(((t,e)=>t.i-e.i)).forEach((t=>this._prepareElement(t.el))),this.commit()}this.setAnimation(this.opts.animate),this._updateStyles(),12!=this.opts.column&&this.el.classList.add("grid-stack-"+this.opts.column),this.opts.dragIn&&h.setupDragIn(this.opts.dragIn,this.opts.dragInOptions),delete this.opts.dragIn,delete this.opts.dragInOptions,this._setupRemoveDrop(),this._setupAcceptWidget(),this._updateWindowResizeEvent()}static init(t={},e=".grid-stack"){let i=h.getGridElement(e);return i?(i.gridstack||(i.gridstack=new h(i,Object.assign({},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"){let i=[];return h.getGridElements(e).forEach((e=>{e.gridstack||(e.gridstack=new h(e,Object.assign({},t)),delete t.dragIn,delete t.dragInOptions),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=document.implementation.createHTMLDocument();i.body.innerHTML=`<div class="grid-stack ${e.class||""}"></div>`;let s=i.body.children[0];t.appendChild(s);let o=h.init(e,s);return e.children&&o.load(e.children),o}get placeholder(){if(!this._placeholder){let t=document.createElement("div");t.className="placeholder-content",this.opts.placeholderText&&(t.innerHTML=this.opts.placeholderText),this._placeholder=document.createElement("div"),this._placeholder.classList.add(this.opts.placeholderClass,l.itemClass,this.opts.itemClass),this.placeholder.appendChild(t)}return this._placeholder}addWidget(t,e){if(arguments.length>2){console.warn("gridstack.ts: `addWidget(el, x, y, width...)` is deprecated. Use `addWidget({x, y, w, content, ...})`. It will be removed soon");let e=arguments,i=1,s={x:e[i++],y:e[i++],w:e[i++],h:e[i++],autoPosition:e[i++],minW:e[i++],maxW:e[i++],minH:e[i++],maxH:e[i++],id:e[i++]};return this.addWidget(t,s)}let i;if("string"==typeof t){let e=document.implementation.createHTMLDocument();e.body.innerHTML=t,i=e.body.children[0]}else if(0===arguments.length||1===arguments.length&&(void 0!==(s=t).x||void 0!==s.y||void 0!==s.w||void 0!==s.h||void 0!==s.content)){let s=t&&t.content||"";e=t;let o=document.implementation.createHTMLDocument();o.body.innerHTML=`<div class="grid-stack-item ${this.opts.itemClass||""}"><div class="grid-stack-item-content">${s}</div></div>`,i=o.body.children[0]}else i=t;var s;let o=this._readAttr(i);return e=Object.assign({},e||{}),n.Utils.defaults(e,o),this.engine.prepareNode(e),this._writeAttr(i,e),this._insertNotAppend?this.el.prepend(i):this.el.appendChild(i),this._prepareElement(i,!0,e),this._updateContainerHeight(),this._triggerAddEvent(),this._triggerChangeEvent(),i}save(t=!0,e=!1){let i=this.engine.save(t);if(t&&i.forEach((t=>{if(t.el&&!t.subGrid){let e=t.el.querySelector(".grid-stack-item-content");t.content=e?e.innerHTML:void 0,t.content||delete t.content,delete t.el}})),e){i.forEach((i=>{i.subGrid&&(i.subGrid=i.subGrid.save(t,e))}));let s=Object.assign({},this.opts);return s.marginBottom===s.marginTop&&s.marginRight===s.marginLeft&&s.marginTop===s.marginRight&&(s.margin=s.marginTop,delete s.marginTop,delete s.marginRight,delete s.marginBottom,delete s.marginLeft),s.rtl===("rtl"===this.el.style.direction)&&(s.rtl="auto"),this._isAutoCellHeight&&(s.cellHeight="auto"),n.Utils.removeInternalAndSame(s,l),s.children=i,s}return i}load(t,e=!0){let i=h.Utils.sort(t,-1,this._prevColumn||this.opts.column);this._insertNotAppend=!0,this._prevColumn&&this._prevColumn!==this.opts.column&&i.some((t=>t.x+t.w>this.opts.column))&&(this._ignoreLayoutsNodeChange=!0,this.engine.cacheLayout(i,this._prevColumn,!0));let s=[];return this.batchUpdate(),e&&[...this.engine.nodes].forEach((t=>{i.find((e=>t.id===e.id))||("function"==typeof e?e(this,t,!1):(s.push(t),this.removeWidget(t.el,!0,!1)))})),i.forEach((t=>{let i=t.id||0===t.id?this.engine.nodes.find((e=>e.id===t.id)):void 0;if(i){if(this.update(i.el,t),t.subGrid&&t.subGrid.children){let e=i.el.querySelector(".grid-stack");e&&e.gridstack&&(e.gridstack.load(t.subGrid.children),this._insertNotAppend=!0)}}else if(e&&(t="function"==typeof e?e(this,t,!0).gridstackNode:this.addWidget(t).gridstackNode).subGrid){let e=t.el.querySelector(".grid-stack-item-content");t.subGrid=h.addGrid(e,t.subGrid)}})),this.engine.removedNodes=s,this.commit(),delete this._ignoreLayoutsNodeChange,delete this._insertNotAppend,this}batchUpdate(){return this.engine.batchUpdate(),this}getCellHeight(t=!1){return!this.opts.cellHeight||"auto"===this.opts.cellHeight||t&&this.opts.cellHeightUnit&&"px"!==this.opts.cellHeightUnit?Math.round(this.el.getBoundingClientRect().height)/parseInt(this.el.getAttribute("gs-current-row")):this.opts.cellHeight}cellHeight(t,e=!0){if(e&&void 0!==t&&this._isAutoCellHeight!==("auto"===t)&&(this._isAutoCellHeight="auto"===t,this._updateWindowResizeEvent()),"initial"!==t&&"auto"!==t||(t=void 0),void 0===t){let e=-this.opts.marginRight-this.opts.marginLeft+this.opts.marginTop+this.opts.marginBottom;t=this.cellWidth()+e}let i=n.Utils.parseHeight(t);return this.opts.cellHeightUnit===i.unit&&this.opts.cellHeight===i.h||(this.opts.cellHeightUnit=i.unit,this.opts.cellHeight=i.h,e&&this._updateStyles(!0,this.getRow())),this}cellWidth(){return this._widthOrContainer()/this.opts.column}_widthOrContainer(){return this.el.clientWidth||this.el.parentElement.clientWidth||window.innerWidth}commit(){return this.engine.commit(),this._triggerRemoveEvent(),this._triggerAddEvent(),this._triggerChangeEvent(),this}compact(){return this.engine.compact(),this._triggerChangeEvent(),this}column(t,e="moveScale"){if(this.opts.column===t)return this;let i,s=this.opts.column;return 1===t?this._prevColumn=s:delete this._prevColumn,this.el.classList.remove("grid-stack-"+s),this.el.classList.add("grid-stack-"+t),this.opts.column=this.engine.column=t,1===t&&this.opts.oneColumnModeDomSort&&(i=[],this.getGridItems().forEach((t=>{t.gridstackNode&&i.push(t.gridstackNode)})),i.length||(i=void 0)),this.engine.updateNodeWidths(s,t,i,e),this._isAutoCellHeight&&this.cellHeight(),this._ignoreLayoutsNodeChange=!0,this._triggerChangeEvent(),delete this._ignoreLayoutsNodeChange,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)))}destroy(t=!0){if(this.el)return this._updateWindowResizeEvent(!0),this.setStatic(!0),t?this.el.parentNode.removeChild(this.el):(this.removeAll(t),this.el.classList.remove(this.opts._styleSheetClass)),this._removeStylesheet(),delete this.opts._isNested,delete this.opts,delete this._placeholder,delete this.engine,delete this.el.gridstack,delete this.el,this}float(t){return this.engine.float=t,this._triggerChangeEvent(),this}getFloat(){return this.engine.float}getCellFromPixel(t,e=!1){let i,s=this.el.getBoundingClientRect();i=e?{top:s.top+document.documentElement.scrollTop,left:s.left}:{top:this.el.offsetTop,left:this.el.offsetLeft};let o=t.left-i.left,n=t.top-i.top,r=s.width/this.opts.column,l=s.height/parseInt(this.el.getAttribute("gs-current-row"));return{x:Math.floor(o/r),y:Math.floor(n/l)}}getRow(){return Math.max(this.engine.getRow(),this.opts.minRow)}isAreaEmpty(t,e,i,s){return this.engine.isAreaEmpty(t,e,i,s)}makeWidget(t){let e=h.getElement(t);return this._prepareElement(e,!0),this._updateContainerHeight(),this._triggerAddEvent(),this._triggerChangeEvent(),e}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){let i="enable"===t||"disable"===t;this._gsEventHandler[t]=i?t=>e(t):t=>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?this._gsEventHandler[t]=e:console.log("GridStack.on("+t+') event not supported, but you can still use $(".grid-stack").on(...) while jquery-ui is still used internally.');return this}off(t){return-1!==t.indexOf(" ")?(t.split(" ").forEach((t=>this.off(t))),this):("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)}removeWidget(t,e=!0,i=!0){return h.getElements(t).forEach((t=>{if(t.parentElement!==this.el)return;let s=t.gridstackNode;s||(s=this.engine.nodes.find((e=>t===e.el))),s&&(delete t.gridstackNode,r.GridStackDDI.get().remove(t),this.engine.removeNode(s,e,i),e&&t.parentElement&&t.remove())})),i&&(this._triggerRemoveEvent(),this._triggerChangeEvent()),this}removeAll(t=!0){return this.engine.nodes.forEach((t=>{delete t.el.gridstackNode,r.GridStackDDI.get().remove(t.el)})),this.engine.removeAll(t),this._triggerRemoveEvent(),this}setAnimation(t){return t?this.el.classList.add("grid-stack-animate"):this.el.classList.remove("grid-stack-animate"),this}setStatic(t){return this.opts.staticGrid===t||(this.opts.staticGrid=t,this.engine.nodes.forEach((t=>this._prepareDragDropByNode(t))),this._setStaticClass()),this}update(t,e){if(arguments.length>2){console.warn("gridstack.ts: `update(el, x, y, w, h)` is deprecated. Use `update({x, w, content, ...})`. It will be removed soon");let i=arguments,s=1;return e={x:i[s++],y:i[s++],w:i[s++],h:i[s++]},this.update(t,e)}return h.getElements(t).forEach((t=>{if(!t||!t.gridstackNode)return;let i=t.gridstackNode,s=Object.assign({},e);delete s.autoPosition;let o,n=["x","y","w","h"];if(n.some((t=>void 0!==s[t]&&s[t]!==i[t]))&&(o={},n.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={}),s.content){let e=t.querySelector(".grid-stack-item-content");e&&e.innerHTML!==s.content&&(e.innerHTML=s.content),delete s.content}let r=!1,l=!1;for(const t in s)"_"!==t[0]&&i[t]!==s[t]&&(i[t]=s[t],r=!0,l=l||!this.opts.staticGrid&&("noResize"===t||"noMove"===t||"locked"===t));o&&(this.engine.cleanNodes().beginUpdate(i).moveNode(i,o),this._updateContainerHeight(),this._triggerChangeEvent(),this.engine.endUpdate()),r&&this._writeAttr(t,i),l&&this._prepareDragDropByNode(i)})),this}margin(t){if(!("string"==typeof t&&t.split(" ").length>1)){let e=n.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._updateStyles(!0),this}getMargin(){return this.opts.margin}willItFit(t){if(arguments.length>1){console.warn("gridstack.ts: `willItFit(x,y,w,h,autoPosition)` is deprecated. Use `willItFit({x, y,...})`. It will be removed soon");let t=arguments,e=0,i={x:t[e++],y:t[e++],w:t[e++],h:t[e++],autoPosition:t[e++]};return this.willItFit(i)}return this.engine.willItFit(t)}_triggerChangeEvent(){if(this.engine.batchMode)return this;let t=this.engine.getDirtyNodes(!0);return t&&t.length&&(this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(t),this._triggerEvent("change",t)),this.engine.saveInitial(),this}_triggerAddEvent(){return this.engine.batchMode||this.engine.addedNodes&&this.engine.addedNodes.length>0&&(this._ignoreLayoutsNodeChange||this.engine.layoutsNodesChange(this.engine.addedNodes),this.engine.addedNodes.forEach((t=>{delete t._dirty})),this._triggerEvent("added",this.engine.addedNodes),this.engine.addedNodes=[]),this}_triggerRemoveEvent(){return this.engine.batchMode||this.engine.removedNodes&&this.engine.removedNodes.length>0&&(this._triggerEvent("removed",this.engine.removedNodes),this.engine.removedNodes=[]),this}_triggerEvent(t,e){let i=e?new CustomEvent(t,{bubbles:!1,detail:e}):new Event(t);return this.el.dispatchEvent(i),this}_removeStylesheet(){return this._styles&&(n.Utils.removeStylesheet(this._styles._id),delete this._styles),this}_updateStyles(t=!1,e){if(t&&this._removeStylesheet(),this._updateContainerHeight(),0===this.opts.cellHeight)return this;let i=this.opts.cellHeight,s=this.opts.cellHeightUnit,o=`.${this.opts._styleSheetClass} > .${this.opts.itemClass}`;if(!this._styles){let t="gridstack-style-"+(1e5*Math.random()).toFixed(),e=this.opts.styleInHead?void 0:this.el.parentNode;if(this._styles=n.Utils.createStylesheet(t,e),!this._styles)return this;this._styles._id=t,this._styles._max=0,n.Utils.addCSSRule(this._styles,o,`min-height: ${i}${s}`);let r=this.opts.marginTop+this.opts.marginUnit,l=this.opts.marginBottom+this.opts.marginUnit,h=this.opts.marginRight+this.opts.marginUnit,a=this.opts.marginLeft+this.opts.marginUnit,d=`${o} > .grid-stack-item-content`,g=`.${this.opts._styleSheetClass} > .grid-stack-placeholder > .placeholder-content`;n.Utils.addCSSRule(this._styles,d,`top: ${r}; right: ${h}; bottom: ${l}; left: ${a};`),n.Utils.addCSSRule(this._styles,g,`top: ${r}; right: ${h}; bottom: ${l}; left: ${a};`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-ne`,`right: ${h}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-e`,`right: ${h}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-se`,`right: ${h}; bottom: ${l}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-nw`,`left: ${a}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-w`,`left: ${a}`),n.Utils.addCSSRule(this._styles,`${o} > .ui-resizable-sw`,`left: ${a}; bottom: ${l}`)}if((e=e||this._styles._max)>this._styles._max){let t=t=>i*t+s;for(let i=this._styles._max+1;i<=e;i++){let e=t(i);n.Utils.addCSSRule(this._styles,`${o}[gs-y="${i-1}"]`,`top: ${t(i-1)}`),n.Utils.addCSSRule(this._styles,`${o}[gs-h="${i}"]`,`height: ${e}`),n.Utils.addCSSRule(this._styles,`${o}[gs-min-h="${i}"]`,`min-height: ${e}`),n.Utils.addCSSRule(this._styles,`${o}[gs-max-h="${i}"]`,`max-height: ${e}`)}this._styles._max=e}return this}_updateContainerHeight(){if(!this.engine||this.engine.batchMode)return this;let t=this.getRow(),e=parseInt(getComputedStyle(this.el)["min-height"]);if(e>0){let i=Math.round(e/this.getCellHeight(!0));t<i&&(t=i)}if(this.el.setAttribute("gs-current-row",String(t)),0===t)return this.el.style.removeProperty("height"),this;let i=this.opts.cellHeight,s=this.opts.cellHeightUnit;return i?(this.el.style.height=t*i+s,this):this}_prepareElement(t,e=!1,i){i||(t.classList.add(this.opts.itemClass),i=this._readAttr(t)),t.gridstackNode=i,i.el=t,i.grid=this;let s=Object.assign({},i);return i=this.engine.addNode(i,e),n.Utils.same(i,s)||this._writeAttr(t,i),this._prepareDragDropByNode(i),this}_writePosAttr(t,e){return void 0!==e.x&&null!==e.x&&t.setAttribute("gs-x",String(e.x)),void 0!==e.y&&null!==e.y&&t.setAttribute("gs-y",String(e.y)),e.w&&t.setAttribute("gs-w",String(e.w)),e.h&&t.setAttribute("gs-h",String(e.h)),this}_writeAttr(t,e){if(!e)return this;this._writePosAttr(t,e);let i={autoPosition:"gs-auto-position",minW:"gs-min-w",minH:"gs-min-h",maxW:"gs-max-w",maxH:"gs-max-h",noResize:"gs-no-resize",noMove:"gs-no-move",locked:"gs-locked",id:"gs-id",resizeHandles:"gs-resize-handles"};for(const s in i)e[s]?t.setAttribute(i[s],String(e[s])):t.removeAttribute(i[s]);return this}_readAttr(t){let e={};e.x=n.Utils.toNumber(t.getAttribute("gs-x")),e.y=n.Utils.toNumber(t.getAttribute("gs-y")),e.w=n.Utils.toNumber(t.getAttribute("gs-w")),e.h=n.Utils.toNumber(t.getAttribute("gs-h")),e.maxW=n.Utils.toNumber(t.getAttribute("gs-max-w")),e.minW=n.Utils.toNumber(t.getAttribute("gs-min-w")),e.maxH=n.Utils.toNumber(t.getAttribute("gs-max-h")),e.minH=n.Utils.toNumber(t.getAttribute("gs-min-h")),e.autoPosition=n.Utils.toBool(t.getAttribute("gs-auto-position")),e.noResize=n.Utils.toBool(t.getAttribute("gs-no-resize")),e.noMove=n.Utils.toBool(t.getAttribute("gs-no-move")),e.locked=n.Utils.toBool(t.getAttribute("gs-locked")),e.resizeHandles=t.getAttribute("gs-resize-handles"),e.id=t.getAttribute("gs-id");for(const t in e){if(!e.hasOwnProperty(t))return;e[t]||0===e[t]||delete e[t]}return e}_setStaticClass(){let 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}onParentResize(){if(!this.el||!this.el.clientWidth)return;let t=!this.opts.disableOneColumnMode&&this.el.clientWidth<=this.opts.minWidth,e=!1;return!this._oneColumnMode!=!t&&(this._oneColumnMode=t,e=!0,this.opts.animate&&this.setAnimation(!1),this.column(t?1:this._prevColumn),this.opts.animate&&this.setAnimation(!0)),this._isAutoCellHeight&&(!e&&this.opts.cellHeightThrottle?(this._cellHeightThrottle||(this._cellHeightThrottle=n.Utils.throttle((()=>this.cellHeight()),this.opts.cellHeightThrottle)),this._cellHeightThrottle()):this.cellHeight()),this.engine.nodes.forEach((t=>{t.subGrid&&t.subGrid.onParentResize()})),this}_updateWindowResizeEvent(t=!1){const e=(this._isAutoCellHeight||!this.opts.disableOneColumnMode)&&!this.opts._isNested;return t||!e||this._windowResizeBind?!t&&e||!this._windowResizeBind||(window.removeEventListener("resize",this._windowResizeBind),delete this._windowResizeBind):(this._windowResizeBind=this.onParentResize.bind(this),window.addEventListener("resize",this._windowResizeBind)),this}static getElement(t=".grid-stack-item"){return n.Utils.getElement(t)}static getElements(t=".grid-stack-item"){return n.Utils.getElements(t)}static getGridElement(t){return h.getElement(t)}static getGridElements(t){return n.Utils.getElements(t)}initMargin(){let t,e=0,i=[];return"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=n.Utils.parseHeight(this.opts.margin),this.opts.marginUnit=t.unit,e=this.opts.margin=t.h),void 0===this.opts.marginTop?this.opts.marginTop=e:(t=n.Utils.parseHeight(this.opts.marginTop),this.opts.marginTop=t.h,delete this.opts.margin),void 0===this.opts.marginBottom?this.opts.marginBottom=e:(t=n.Utils.parseHeight(this.opts.marginBottom),this.opts.marginBottom=t.h,delete this.opts.margin),void 0===this.opts.marginRight?this.opts.marginRight=e:(t=n.Utils.parseHeight(this.opts.marginRight),this.opts.marginRight=t.h,delete this.opts.margin),void 0===this.opts.marginLeft?this.opts.marginLeft=e:(t=n.Utils.parseHeight(this.opts.marginLeft),this.opts.marginLeft=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),this}static setupDragIn(t,e){}movable(t,e){return this}resizable(t,e){return this}disable(){return this}enable(){return this}enableMove(t,e=!0){return this}enableResize(t,e=!0){return this}_setupAcceptWidget(){return this}_setupRemoveDrop(){return this}_prepareDragDropByNode(t){return this}_onStartMoving(t,e,i,s,o){}_dragOrResize(t,e,i,s,o){}_leave(t,e,i,s=!1){}}e.GridStack=h,h.Utils=n.Utils,h.Engine=o.GridStackEngine},822:(t,e,i)=>{function s(t){for(var i in t)e.hasOwnProperty(i)||(e[i]=t[i])}Object.defineProperty(e,"__esModule",{value:!0}),s(i(593)),s(i(62)),s(i(334)),s(i(270))},593:(t,e)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.obsolete=function(t,e,i,s,o){let n=(...n)=>(console.warn("gridstack.js: Function `"+i+"` is deprecated in "+o+" and has been replaced with `"+s+"`. It will be **completely** removed in v1.0"),e.apply(t,n));return n.prototype=e.prototype,n},e.obsoleteOpts=function(t,e,i,s){void 0!==t[e]&&(t[i]=t[e],console.warn("gridstack.js: Option `"+e+"` is deprecated in "+s+" and has been replaced with `"+i+"`. It will be **completely** removed in v1.0"))},e.obsoleteOptsDel=function(t,e,i,s){void 0!==t[e]&&console.warn("gridstack.js: Option `"+e+"` is deprecated in "+i+s)},e.obsoleteAttr=function(t,e,i,s){let o=t.getAttribute(e);null!==o&&(t.setAttribute(i,o),console.warn("gridstack.js: attribute `"+e+"`="+o+" is deprecated on this object in "+s+" and has been replaced with `"+i+"`. It will be **completely** removed in v1.0"))};class i{static getElements(t){if("string"==typeof t){let e=document.querySelectorAll(t);return e.length||"."===t[0]||"#"===t[0]||(e=document.querySelectorAll("."+t),e.length||(e=document.querySelectorAll("#"+t))),Array.from(e)}return[t]}static getElement(t){if("string"==typeof t){if(!t.length)return null;if("#"===t[0])return document.getElementById(t.substring(1));if("."===t[0]||"["===t[0])return document.querySelector(t);if(!isNaN(+t[0]))return document.getElementById(t);let e=document.querySelector(t);return e||(e=document.getElementById(t)),e||(e=document.querySelector("."+t)),e}return t}static isIntercepted(t,e){return!(t.y>=e.y+e.h||t.y+t.h<=e.y||t.x+t.w<=e.x||t.x>=e.x+e.w)}static isTouching(t,e){return i.isIntercepted(t,{x:e.x-.5,y:e.y-.5,w:e.w+1,h:e.h+1})}static sort(t,e,i){return i=i||t.reduce(((t,e)=>Math.max(e.x+e.w,t)),0)||12,-1===e?t.sort(((t,e)=>e.x+e.y*i-(t.x+t.y*i))):t.sort(((t,e)=>t.x+t.y*i-(e.x+e.y*i)))}static createStylesheet(t,e){let i=document.createElement("style");return i.setAttribute("type","text/css"),i.setAttribute("gs-style-id",t),i.styleSheet?i.styleSheet.cssText="":i.appendChild(document.createTextNode("")),e?e.insertBefore(i,e.firstChild):(e=document.getElementsByTagName("head")[0]).appendChild(i),i.sheet}static removeStylesheet(t){let e=document.querySelector("STYLE[gs-style-id="+t+"]");e&&e.parentNode&&e.remove()}static addCSSRule(t,e,i){"function"==typeof t.addRule?t.addRule(e,i):"function"==typeof t.insertRule&&t.insertRule(`${e}{${i}}`)}static toBool(t){return"boolean"==typeof t?t:"string"==typeof t?!(""===(t=t.toLowerCase())||"no"===t||"false"===t||"0"===t):Boolean(t)}static toNumber(t){return null===t||0===t.length?void 0:Number(t)}static parseHeight(t){let e,i="px";if("string"==typeof t){let s=t.match(/^(-[0-9]+\.[0-9]+|[0-9]*\.[0-9]+|-[0-9]+|[0-9]+)(px|em|rem|vh|vw|%)?$/);if(!s)throw new Error("Invalid height");i=s[2]||"px",e=parseFloat(s[1])}else e=t;return{h:e,unit:i}}static defaults(t,...e){return e.forEach((e=>{for(const i in e){if(!e.hasOwnProperty(i))return;null===t[i]||void 0===t[i]?t[i]=e[i]:"object"==typeof e[i]&&"object"==typeof t[i]&&this.defaults(t[i],e[i])}})),t}static same(t,e){if("object"!=typeof t)return t==e;if(typeof t!=typeof e)return!1;if(Object.keys(t).length!==Object.keys(e).length)return!1;for(const i in t)if(t[i]!==e[i])return!1;return!0}static copyPos(t,e){return t.x=e.x,t.y=e.y,t.w=e.w,t.h=e.h,t}static samePos(t,e){return t&&e&&t.x===e.x&&t.y===e.y&&t.w===e.w&&t.h===e.h}static removeInternalAndSame(t,e){if("object"==typeof t&&"object"==typeof e)for(let i in t){let s=t[i];if(s&&"object"==typeof s){for(let t in s)s[t]!==e[i][t]&&"_"!==t[0]||delete s[t];Object.keys(s).length||delete t[i]}else s!==e[i]&&"_"!==i[0]||delete t[i]}}static closestByClass(t,e){for(;t=t.parentElement;)if(t.classList.contains(e))return t;return null}static throttle(t,e){let i=!1;return(...s)=>{i||(i=!0,setTimeout((()=>{t(...s),i=!1}),e))}}static removePositioningStyles(t){let e=t.style;e.position&&e.removeProperty("position"),e.left&&e.removeProperty("left"),e.top&&e.removeProperty("top"),e.width&&e.removeProperty("width"),e.height&&e.removeProperty("height")}static getScrollParent(t){if(null===t)return document.documentElement;const e=getComputedStyle(t);return/(auto|scroll)/.test(e.overflow+e.overflowY)?t:this.getScrollParent(t.parentElement)}static updateScrollPosition(t,e,i){let s=t.getBoundingClientRect(),o=window.innerHeight||document.documentElement.clientHeight;if(s.top<0||s.bottom>o){let n=s.bottom-o,r=s.top,l=this.getScrollParent(t);if(null!==l){let h=l.scrollTop;s.top<0&&i<0?t.offsetHeight>o?l.scrollTop+=i:l.scrollTop+=Math.abs(r)>Math.abs(i)?i:r:i>0&&(t.offsetHeight>o?l.scrollTop+=i:l.scrollTop+=n>i?i:n),e.top+=l.scrollTop-h}}}static updateScrollResize(t,e,i){const s=this.getScrollParent(e),o=s.clientHeight,n=t.clientY<i,r=t.clientY>o-i;n?s.scrollBy({behavior:"smooth",top:t.clientY-i}):r&&s.scrollBy({behavior:"smooth",top:i-(o-t.clientY)})}}e.Utils=i}},e={};return function i(s){if(e[s])return e[s].exports;var o=e[s]={exports:{}};return t[s](o,o.exports,i),o.exports}(822)})().GridStack})); | ||
| //# sourceMappingURL=gridstack-static.js.map |
@@ -1,9 +0,3 @@ | ||
| // gridstack-ddi.ts 3.3.0 @preserve | ||
| // gridstack-engine.ts 3.3.0 @preserve | ||
| // gridstack.ts 3.3.0 @preserve | ||
| // index.static.ts 3.3.0 - everything you need for a static Grid (non draggable) @preserve | ||
| // utils.ts 3.3.0 @preserve | ||
| /*! | ||
| * (c) 2021 Alain Dumesny - see root license | ||
| */ |
@@ -1,9 +0,7 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| /*! | ||
| * (c) 2021 Alain Dumesny - see root license | ||
| */ | ||
| import { GridStackEngine } from './gridstack-engine'; | ||
| import { Utils } from './utils'; | ||
| import { GridStackElement, GridItemHTMLElement, GridStackWidget, GridStackNode, GridStackOptions, numberOrString, ColumnOptions } from './types'; | ||
| import { ColumnOptions, GridItemHTMLElement, GridStackElement, GridStackEventHandlerCallback, GridStackOptions, GridStackWidget, numberOrString, DDDragInOpt } from './types'; | ||
| export * from './types'; | ||
@@ -16,3 +14,3 @@ export * from './utils'; | ||
| } | ||
| export declare type GridStackEvent = 'added' | 'change' | 'disable' | 'dragstart' | 'dragstop' | 'dropped' | 'enable' | 'removed' | 'resizestart' | 'resizestop'; | ||
| export declare type GridStackEvent = 'added' | 'change' | 'disable' | 'drag' | 'dragstart' | 'dragstop' | 'dropped' | 'enable' | 'removed' | 'resize' | 'resizestart' | 'resizestop'; | ||
| /** Defines the coordinates of an object */ | ||
@@ -230,3 +228,3 @@ export interface MousePosition { | ||
| */ | ||
| on(name: GridStackEvent, callback: (event: Event, arg2?: GridItemHTMLElement | GridStackNode[]) => void): GridStack; | ||
| on(name: GridStackEvent, callback: GridStackEventHandlerCallback): GridStack; | ||
| /** | ||
@@ -294,2 +292,10 @@ * unsubscribe from the 'on' event below | ||
| /** | ||
| * call to setup dragging in from the outside (say toolbar), by specifying the class selection and options. | ||
| * Called during GridStack.init() as options, but can also be called directly (last param are cached) in case the toolbar | ||
| * is dynamically create and needs to change later. | ||
| * @param dragIn string selector (ex: '.sidebar .grid-stack-item') | ||
| * @param dragInOptions options - see DDDragInOpt. (default: {revert: 'invalid', handle: '.grid-stack-item-content', scroll: false, appendTo: 'body'} | ||
| **/ | ||
| static setupDragIn(dragIn?: string, dragInOptions?: DDDragInOpt): void; | ||
| /** | ||
| * Enables/Disables moving. No-op for static grids. | ||
@@ -296,0 +302,0 @@ * @param els widget or selector to modify. |
| "use strict"; | ||
| // gridstack.ts 3.3.0 @preserve | ||
| function __export(m) { | ||
@@ -7,7 +6,6 @@ for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p]; | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // gridstack.ts 4.0.0 | ||
| /*! | ||
| * (c) 2021 Alain Dumesny - see root license | ||
| */ | ||
| const gridstack_engine_1 = require("./gridstack-engine"); | ||
@@ -48,9 +46,2 @@ const utils_1 = require("./utils"); | ||
| }, | ||
| dragIn: undefined, | ||
| dragInOptions: { | ||
| revert: 'invalid', | ||
| handle: '.grid-stack-item-content', | ||
| scroll: false, | ||
| appendTo: 'body' | ||
| }, | ||
| disableDrag: false, | ||
@@ -63,3 +54,2 @@ disableResize: false, | ||
| }, | ||
| removeTimeout: 2000, | ||
| marginUnit: 'px', | ||
@@ -91,4 +81,2 @@ cellHeightUnit: 'px', | ||
| opts = opts || {}; // handles null/undefined/0 | ||
| utils_1.obsoleteOpts(opts, 'verticalMargin', 'margin', 'v2.0'); | ||
| utils_1.obsoleteAttr(this.el, 'data-gs-current-height', 'gs-current-row', 'v1.0.0'); | ||
| // if row property exists, replace minRow and maxRow instead | ||
@@ -137,3 +125,3 @@ if (opts.row) { | ||
| if (this._isAutoCellHeight || this.opts.cellHeight === 'initial') { | ||
| // make the cell content square initially (will use resize event to keep it square) | ||
| // make the cell content square initially (will use resize/column event to keep it square) | ||
| this.cellHeight(undefined, false); | ||
@@ -155,9 +143,9 @@ } | ||
| let el = n.el; | ||
| if (removeDOM && n._id === null) { | ||
| if (el && el.parentNode) { | ||
| el.parentNode.removeChild(el); | ||
| } | ||
| if (removeDOM && n._removeDOM) { // TODO: do we need to pass 'removeDOM' ? | ||
| if (el) | ||
| el.remove(); | ||
| delete n._removeDOM; | ||
| } | ||
| else { | ||
| this._writePosAttr(el, n.x, n.y, n.w, n.h); | ||
| this._writePosAttr(el, n); | ||
| } | ||
@@ -180,6 +168,5 @@ }); | ||
| }); | ||
| elements.sort(e => e.i).forEach(e => this._prepareElement(e.el)); | ||
| elements.sort((a, b) => a.i - b.i).forEach(e => this._prepareElement(e.el)); | ||
| this.commit(); | ||
| } | ||
| this.engine.saveInitial(); // initial start of items | ||
| this.setAnimation(this.opts.animate); | ||
@@ -190,3 +177,7 @@ this._updateStyles(); | ||
| } | ||
| this._setupDragIn(); | ||
| // legacy support to appear 'per grid` options when really global. | ||
| if (this.opts.dragIn) | ||
| GridStack.setupDragIn(this.opts.dragIn, this.opts.dragInOptions); | ||
| delete this.opts.dragIn; | ||
| delete this.opts.dragInOptions; | ||
| this._setupRemoveDrop(); | ||
@@ -240,2 +231,4 @@ this._setupAcceptWidget(); | ||
| el.gridstack = new GridStack(el, Object.assign({}, options)); | ||
| delete options.dragIn; | ||
| delete options.dragInOptions; // only need to be done once (really a static global thing, not per grid) | ||
| } | ||
@@ -264,3 +257,3 @@ grids.push(el.gridstack); | ||
| let el = doc.body.children[0]; | ||
| parent.append(el); | ||
| parent.appendChild(el); | ||
| // create grid class and load any children | ||
@@ -485,7 +478,8 @@ let grid = GridStack.init(opt, el); | ||
| } | ||
| // else get first cell height | ||
| // or do entire grid and # of rows ? (this.el.getBoundingClientRect().height) / parseInt(this.el.getAttribute('gs-current-row')) | ||
| let el = this.el.querySelector('.' + this.opts.itemClass); | ||
| let height = utils_1.Utils.toNumber(el.getAttribute('gs-h')); | ||
| return Math.round(el.offsetHeight / height); | ||
| // else do entire grid and # of rows | ||
| // or get first cell height ? | ||
| // let el = this.el.querySelector('.' + this.opts.itemClass) as HTMLElement; | ||
| // let height = Utils.toNumber(el.getAttribute('gs-h')); | ||
| // return Math.round(el.offsetHeight / height); | ||
| return Math.round(this.el.getBoundingClientRect().height) / parseInt(this.el.getAttribute('gs-current-row')); | ||
| } | ||
@@ -598,2 +592,4 @@ /** | ||
| this.engine.updateNodeWidths(oldColumn, column, domNodes, layout); | ||
| if (this._isAutoCellHeight) | ||
| this.cellHeight(); | ||
| // and trigger our event last... | ||
@@ -731,3 +727,2 @@ this._ignoreLayoutsNodeChange = true; // skip layout update | ||
| */ | ||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| on(name, callback) { | ||
@@ -751,3 +746,3 @@ // check for array of names being passed instead | ||
| } | ||
| else if (name === 'dragstart' || name === 'dragstop' || name === 'resizestart' || name === 'resizestop' || name === 'dropped') { | ||
| else if (name === 'drag' || name === 'dragstart' || name === 'dragstop' || name === 'resizestart' || name === 'resize' || name === 'resizestop' || name === 'dropped') { | ||
| // drag&drop stop events NEED to be call them AFTER we update node attributes so handle them ourself. | ||
@@ -907,5 +902,5 @@ // do same for start event to make it easier... | ||
| if (m) { | ||
| this.engine.cleanNodes(); | ||
| this.engine.beginUpdate(n); | ||
| this.engine.moveNode(n, m.x, m.y, m.w, m.h); | ||
| this.engine.cleanNodes() | ||
| .beginUpdate(n) | ||
| .moveNode(n, m); | ||
| this._updateContainerHeight(); | ||
@@ -1121,15 +1116,15 @@ this._triggerChangeEvent(); | ||
| } | ||
| /** @internal call to write x,y,w,h attributes back to element */ | ||
| _writePosAttr(el, x, y, w, h) { | ||
| if (x !== undefined && x !== null) { | ||
| el.setAttribute('gs-x', String(x)); | ||
| /** @internal call to write position x,y,w,h attributes back to element */ | ||
| _writePosAttr(el, n) { | ||
| if (n.x !== undefined && n.x !== null) { | ||
| el.setAttribute('gs-x', String(n.x)); | ||
| } | ||
| if (y !== undefined && y !== null) { | ||
| el.setAttribute('gs-y', String(y)); | ||
| if (n.y !== undefined && n.y !== null) { | ||
| el.setAttribute('gs-y', String(n.y)); | ||
| } | ||
| if (w) { | ||
| el.setAttribute('gs-w', String(w)); | ||
| if (n.w) { | ||
| el.setAttribute('gs-w', String(n.w)); | ||
| } | ||
| if (h) { | ||
| el.setAttribute('gs-h', String(h)); | ||
| if (n.h) { | ||
| el.setAttribute('gs-h', String(n.h)); | ||
| } | ||
@@ -1142,3 +1137,3 @@ return this; | ||
| return this; | ||
| this._writePosAttr(el, node.x, node.y, node.w, node.h); | ||
| this._writePosAttr(el, node); | ||
| let attrs /*: GridStackWidget but strings */ = { | ||
@@ -1341,2 +1336,10 @@ autoPosition: 'gs-auto-position', | ||
| /** | ||
| * call to setup dragging in from the outside (say toolbar), by specifying the class selection and options. | ||
| * Called during GridStack.init() as options, but can also be called directly (last param are cached) in case the toolbar | ||
| * is dynamically create and needs to change later. | ||
| * @param dragIn string selector (ex: '.sidebar .grid-stack-item') | ||
| * @param dragInOptions options - see DDDragInOpt. (default: {revert: 'invalid', handle: '.grid-stack-item-content', scroll: false, appendTo: 'body'} | ||
| **/ | ||
| static setupDragIn(dragIn, dragInOptions) { } | ||
| /** | ||
| * Enables/Disables moving. No-op for static grids. | ||
@@ -1391,25 +1394,10 @@ * @param els widget or selector to modify. | ||
| _setupRemoveDrop() { return this; } | ||
| /** @internal */ | ||
| _setupRemovingTimeout(el) { return this; } | ||
| /** @internal */ | ||
| _clearRemovingTimeout(el) { return this; } | ||
| /** @internal call to setup dragging in from the outside (say toolbar), with options */ | ||
| _setupDragIn() { return this; } | ||
| /** @internal prepares the element for drag&drop **/ | ||
| _prepareDragDropByNode(node) { return this; } | ||
| // 2.x API that just calls the new and better update() - keep those around for backward compat only... | ||
| /** @internal */ | ||
| locked(els, locked) { return this.update(els, { locked }); } | ||
| /** @internal */ | ||
| maxWidth(els, maxW) { return this.update(els, { maxW }); } | ||
| /** @internal */ | ||
| minWidth(els, minW) { return this.update(els, { minW }); } | ||
| /** @internal */ | ||
| maxHeight(els, maxH) { return this.update(els, { maxH }); } | ||
| /** @internal */ | ||
| minHeight(els, minH) { return this.update(els, { minH }); } | ||
| /** @internal */ | ||
| move(els, x, y) { return this.update(els, { x, y }); } | ||
| /** @internal */ | ||
| resize(els, w, h) { return this.update(els, { w, h }); } | ||
| /** @internal handles actual drag/resize start **/ | ||
| _onStartMoving(event, ui, node, cellWidth, cellHeight) { return; } | ||
| /** @internal handles actual drag/resize **/ | ||
| _dragOrResize(event, ui, node, cellWidth, cellHeight) { return; } | ||
| /** @internal called when a node leaves our area (mouse out or shape outside) **/ | ||
| _leave(node, el, helper, dropoutEvent = false) { return; } | ||
| } | ||
@@ -1416,0 +1404,0 @@ exports.GridStack = GridStack; |
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| export declare type EventCallback = (event: Event) => boolean | void; | ||
@@ -7,0 +2,0 @@ export declare abstract class DDBaseImplement { |
| "use strict"; | ||
| // dd-base-impl.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -29,10 +28,4 @@ class DDBaseImplement { | ||
| triggerEvent(eventName, event) { | ||
| if (this.disabled) | ||
| return; | ||
| if (!this._eventRegister) { | ||
| return; | ||
| } // used when destroy before triggerEvent fire | ||
| if (this._eventRegister[eventName]) { | ||
| if (!this.disabled && this._eventRegister && this._eventRegister[eventName]) | ||
| return this._eventRegister[eventName](event); | ||
| } | ||
| } | ||
@@ -39,0 +32,0 @@ } |
| "use strict"; | ||
| // dd-draggable.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // dd-draggable.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| const dd_manager_1 = require("./dd-manager"); | ||
@@ -42,3 +38,2 @@ const dd_utils_1 = require("./dd-utils"); | ||
| this._dragEnd = this._dragEnd.bind(this); | ||
| this._dragFollow = this._dragFollow.bind(this); | ||
| this.enable(); | ||
@@ -45,0 +40,0 @@ } |
| "use strict"; | ||
| // dd-droppable.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -61,4 +60,6 @@ const dd_manager_1 = require("./dd-manager"); | ||
| return; | ||
| event.preventDefault(); | ||
| if (this.moving) | ||
| return; // ignore multiple 'dragenter' as we go over existing items | ||
| this.moving = true; | ||
| event.preventDefault(); | ||
| const ev = dd_utils_1.DDUtils.initEvent(event, { target: this.el, type: 'dropover' }); | ||
@@ -92,2 +93,3 @@ if (this.option.over) { | ||
| } | ||
| delete this.moving; | ||
| } | ||
@@ -105,2 +107,3 @@ /** @internal item is being dropped on us - call the client drop event */ | ||
| this._removeLeaveCallbacks(); | ||
| delete this.moving; | ||
| } | ||
@@ -115,2 +118,3 @@ /** @internal called to remove callbacks when leaving or dropping */ | ||
| } | ||
| // Note: this.moving is reset by callee of this routine to control the flow | ||
| } | ||
@@ -117,0 +121,0 @@ /** @internal */ |
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| import { DDResizable, DDResizableOpt } from './dd-resizable'; | ||
@@ -7,0 +2,0 @@ import { GridItemHTMLElement } from './../types'; |
| "use strict"; | ||
| // dd-elements.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // dd-elements.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| const dd_resizable_1 = require("./dd-resizable"); | ||
@@ -10,0 +6,0 @@ const dd_draggable_1 = require("./dd-draggable"); |
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| import { DDDraggable } from './dd-draggable'; | ||
@@ -7,0 +2,0 @@ export declare class DDManager { |
| "use strict"; | ||
| // dd-manager.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -4,0 +3,0 @@ class DDManager { |
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| export interface DDResizableHandleOpt { | ||
@@ -7,0 +2,0 @@ start?: (event: any) => void; |
| "use strict"; | ||
| // dd-resizable-handle.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -4,0 +3,0 @@ class DDResizableHandle { |
| "use strict"; | ||
| // dd-resizable.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // dd-resizable.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| const dd_resizable_handle_1 = require("./dd-resizable-handle"); | ||
@@ -10,0 +6,0 @@ const dd_base_impl_1 = require("./dd-base-impl"); |
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| export declare class DDUtils { | ||
@@ -7,0 +2,0 @@ static isEventSupportPassiveOption: boolean; |
| "use strict"; | ||
| // dd-utils.ts 3.3.0 @preserve | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // dd-utils.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| class DDUtils { | ||
@@ -24,3 +20,3 @@ static clone(el) { | ||
| if (parentNode) { | ||
| parentNode.append(el); | ||
| parentNode.appendChild(el); | ||
| } | ||
@@ -27,0 +23,0 @@ } |
| "use strict"; | ||
| // gridstack-dd-native.ts 3.3.0 @preserve | ||
| function __export(m) { | ||
@@ -7,7 +6,4 @@ for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p]; | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2020 rhlin, Alain Dumesny | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| // gridstack-dd-native.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| const dd_manager_1 = require("./dd-manager"); | ||
@@ -14,0 +10,0 @@ const dd_element_1 = require("./dd-element"); |
@@ -1,6 +0,1 @@ | ||
| /** JQuery UI Drag&Drop plugin | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| import { GridStackElement } from '../gridstack'; | ||
@@ -7,0 +2,0 @@ import { GridStackDD, DDOpts, DDKey, DDDropOpt, DDCallback, DDValue } from '../gridstack-dd'; |
| "use strict"; | ||
| // gridstack-dd-jqueryui.ts 3.1.3-dev @preserve | ||
| function __export(m) { | ||
@@ -4,0 +3,0 @@ for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p]; |
@@ -1,6 +0,1 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| import { GridStack } from './gridstack'; | ||
@@ -18,2 +13,3 @@ /** different layout options when changing # of columns, | ||
| export declare type GridStackElement = string | HTMLElement | GridItemHTMLElement; | ||
| export declare type GridStackEventHandlerCallback = (event: Event, arg2?: GridItemHTMLElement | GridStackNode | GridStackNode[], newNode?: GridStackNode) => void; | ||
| /** | ||
@@ -124,6 +120,4 @@ * Defines the options for a Grid | ||
| removable?: boolean | string; | ||
| /** allows to override UI removable options. (default?: { accept: '.' + opts.itemClass }) */ | ||
| /** allows to override UI removable options. (default?: { accept: '.grid-stack-item' }) */ | ||
| removableOptions?: DDRemoveOpt; | ||
| /** time in milliseconds before widget is being removed while dragging outside of the grid. (default?: 2000) */ | ||
| removeTimeout?: number; | ||
| /** fix grid number of rows. This is a shortcut of writing `minRow:N, maxRow:N`. (default `0` no constrain) */ | ||
@@ -145,6 +139,20 @@ row?: number; | ||
| } | ||
| /** | ||
| * GridStack Widget creation options | ||
| */ | ||
| export interface GridStackWidget { | ||
| /** options used during GridStackEngine.moveNode() */ | ||
| export interface GridStackMoveOpts extends GridStackPosition { | ||
| /** node to skip collision */ | ||
| skip?: GridStackNode; | ||
| /** do we pack (default true) */ | ||
| pack?: boolean; | ||
| /** true if we are calling this recursively to prevent simple swap or coverage collision - default false*/ | ||
| nested?: boolean; | ||
| cellWidth?: number; | ||
| cellHeight?: number; | ||
| marginTop?: number; | ||
| marginBottom?: number; | ||
| marginLeft?: number; | ||
| marginRight?: number; | ||
| /** position in pixels of the currently dragged items (for overlap check) */ | ||
| rect?: GridStackPosition; | ||
| } | ||
| export interface GridStackPosition { | ||
| /** widget position x (default?: 0) */ | ||
@@ -158,2 +166,7 @@ x?: number; | ||
| h?: number; | ||
| } | ||
| /** | ||
| * GridStack Widget creation options | ||
| */ | ||
| export interface GridStackWidget extends GridStackPosition { | ||
| /** if true then x, y parameters will be ignored and widget will be places on the first available position (default?: false) */ | ||
@@ -160,0 +173,0 @@ autoPosition?: boolean; |
| "use strict"; | ||
| // types.ts 3.3.0 @preserve | ||
| // types.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| //# sourceMappingURL=types.js.map |
@@ -1,7 +0,2 @@ | ||
| /** | ||
| * https://gridstackjs.com/ | ||
| * (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov | ||
| * gridstack.js may be freely distributed under the MIT license. | ||
| */ | ||
| import { GridStackElement, GridStackWidget, GridStackNode, GridStackOptions, numberOrString } from './types'; | ||
| import { GridStackElement, GridStackNode, GridStackOptions, numberOrString, GridStackPosition } from './types'; | ||
| export interface HeightData { | ||
@@ -28,3 +23,5 @@ h: number; | ||
| /** returns true if a and b overlap */ | ||
| static isIntercepted(a: GridStackWidget, b: GridStackWidget): boolean; | ||
| static isIntercepted(a: GridStackPosition, b: GridStackPosition): boolean; | ||
| /** returns true if a and b touch edges or corners */ | ||
| static isTouching(a: GridStackPosition, b: GridStackPosition): boolean; | ||
| /** | ||
@@ -55,2 +52,4 @@ * Sorts array of nodes | ||
| static same(a: unknown, b: unknown): boolean; | ||
| static copyPos(a: GridStackPosition, b: GridStackPosition): GridStackPosition; | ||
| static samePos(a: GridStackPosition, b: GridStackPosition): boolean; | ||
| /** removes field from the first object if same as the second objects (like diffing) and internal '_' for saving */ | ||
@@ -57,0 +56,0 @@ static removeInternalAndSame(a: unknown, b: unknown): void; |
| "use strict"; | ||
| // utils.ts 3.3.0 @preserve | ||
| // utils.ts 4.0.0 | ||
| // (c) 2021 Alain Dumesny - see root license | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -89,4 +90,8 @@ /** checks for obsolete method names */ | ||
| static isIntercepted(a, b) { | ||
| return !(a.x + a.w <= b.x || b.x + b.w <= a.x || a.y + a.h <= b.y || b.y + b.h <= a.y); | ||
| return !(a.y >= b.y + b.h || a.y + a.h <= b.y || a.x + a.w <= b.x || a.x >= b.x + b.w); | ||
| } | ||
| /** returns true if a and b touch edges or corners */ | ||
| static isTouching(a, b) { | ||
| return Utils.isIntercepted(a, { x: b.x - 0.5, y: b.y - 0.5, w: b.w + 1, h: b.h + 1 }); | ||
| } | ||
| /** | ||
@@ -99,6 +104,3 @@ * Sorts array of nodes | ||
| static sort(nodes, dir, column) { | ||
| if (!column) { | ||
| let widths = nodes.map(n => n.x + n.w); | ||
| column = Math.max(...widths); | ||
| } | ||
| column = column || nodes.reduce((col, n) => Math.max(n.x + n.w, col), 0) || 12; | ||
| if (dir === -1) | ||
@@ -215,2 +217,14 @@ return nodes.sort((a, b) => (b.x + b.y * column) - (a.x + a.y * column)); | ||
| } | ||
| /* copies over b size & position */ | ||
| static copyPos(a, b) { | ||
| a.x = b.x; | ||
| a.y = b.y; | ||
| a.w = b.w; | ||
| a.h = b.h; | ||
| return a; | ||
| } | ||
| /* true if a and b has same size & position */ | ||
| static samePos(a, b) { | ||
| return a && b && a.x === b.x && a.y === b.y && a.w === b.w && a.h === b.h; | ||
| } | ||
| /** removes field from the first object if same as the second objects (like diffing) and internal '_' for saving */ | ||
@@ -217,0 +231,0 @@ static removeInternalAndSame(a, b) { |
@@ -8,2 +8,3 @@ Change log | ||
| - [4.0.0 (2021-3-19)](#400-2021-3-19) | ||
| - [3.3.0 (2021-2-2)](#330-2021-2-2) | ||
@@ -51,2 +52,19 @@ - [3.2.0 (2021-1-25)](#320-2021-1-25) | ||
| <!-- END doctoc generated TOC please keep comment here to allow auto update --> | ||
| ## 4.0.0 (2021-3-19) | ||
| - fix [#149](https://github.com/gridstack/gridstack.js/issues/149) [#1094](https://github.com/gridstack/gridstack.js/issues/1094) [#1605](https://github.com/gridstack/gridstack.js/issues/1605) [#1534](https://github.com/gridstack/gridstack.js/issues/1534) re-write of the **collision code - fixing 6 years old most requested request** | ||
| 1. you can now swap items of the same size (vertical/horizontal) when grid is full, and is the default in `float:false` (top gravity) as it feels more natural. Could add Alt key for swap vs push behavior later. | ||
| 2. Dragging up and down now behave the same (used to require push WAY down past to swap/append). Also much more efficient collision code. | ||
| 3. handle mid point of dragged over items (>50%) rather than just a new row/column and check for the most covered item when multiple collide. | ||
| - fix [#393](https://github.com/gridstack/gridstack.js/issues/393) [#1612](https://github.com/gridstack/gridstack.js/issues/1612) [#1578](https://github.com/gridstack/gridstack.js/issues/1578) re-write of the **drag in/out code - fixing 5 years old bug** | ||
| 1. we now remove item when cursor leaves (`acceptWidgets` case using `dropout` event) or shape is outside (re-using same method) and re-insert on cursor enter (since we only get `dropover` event). Should **not be possible to have 2 placeholders** which confuses the grids. | ||
| 2. major re-write and cleanup of the drag in/out. Vars have been renamed and fully documented as I couldn't understand the legacy buggy code. | ||
| 3. removed any over trash delay feedback as I don't see the point and could introduce race conditions. | ||
| - fix [1617](https://github.com/gridstack/gridstack.js/issues/1617) FireFox DOM order issue. Thanks [@marcel-necker](https://github.com/marcel-necker) | ||
| - fix changing column # `column(n)` now resizes `cellHeight:'auto'` to keep square | ||
| - add [1616](https://github.com/gridstack/gridstack.js/pull/1616) `drag | resize` events while dragging. Thanks [@MrCorba](https://github.com/MrCorba) | ||
| - add [1637](https://github.com/gridstack/gridstack.js/issues/1637) `GridStack.setupDragIn()` so user can update external draggable after the grid has been created | ||
| ## 3.3.0 (2021-2-2) | ||
@@ -53,0 +71,0 @@ |
@@ -17,2 +17,3 @@ gridstack.js API | ||
| - [dragstart(event, el)](#dragstartevent-el) | ||
| - [drag(event, el)](#dragevent-el) | ||
| - [dragstop(event, el)](#dragstopevent-el) | ||
@@ -23,37 +24,42 @@ - [dropped(event, previousWidget, newWidget)](#droppedevent-previouswidget-newwidget) | ||
| - [resizestart(event, el)](#resizestartevent-el) | ||
| - [resize(event, el)](#resizeevent-el) | ||
| - [resizestop(event, el)](#resizestopevent-el) | ||
| - [API Global (static)](#api-global-static) | ||
| - [`init(options: GridStackOptions = {}, elOrString: GridStackElement = '.grid-stack'): GridStack`](#initoptions-gridstackoptions---elorstring-gridstackelement--grid-stack-gridstack) | ||
| - [`initAll(options: GridStackOptions = {}, selector = '.grid-stack'): GridStack[]`](#initalloptions-gridstackoptions---selector--grid-stack-gridstack) | ||
| - [`addGrid(parent: HTMLElement, opt: GridStackOptions = {}): GridStack `](#addgridparent-htmlelement-opt-gridstackoptions---gridstack-) | ||
| - [`setupDragIn(dragIn?: string, dragInOptions?: DDDragInOpt)`](#setupdragindragin-string-draginoptions-dddraginopt) | ||
| - [API](#api) | ||
| - [addGrid(parent: HTMLElement, opt: GridStackOptions)](#addgridparent-htmlelement-opt-gridstackoptions) | ||
| - [addWidget(el?: GridStackWidget | GridStackElement, options?: GridStackWidget)](#addwidgetel-gridstackwidget--gridstackelement-options-gridstackwidget) | ||
| - [batchUpdate()](#batchupdate) | ||
| - [compact()](#compact) | ||
| - [cellHeight(val: number, update = true)](#cellheightval-number-update--true) | ||
| - [cellWidth()](#cellwidth) | ||
| - [commit()](#commit) | ||
| - [column(column: number, layout: ColumnOptions = 'moveScale')](#columncolumn-number-layout-columnoptions--movescale) | ||
| - [destroy([removeDOM])](#destroyremovedom) | ||
| - [disable()](#disable) | ||
| - [enable()](#enable) | ||
| - [enableMove(doEnable, includeNewWidgets)](#enablemovedoenable-includenewwidgets) | ||
| - [enableResize(doEnable, includeNewWidgets)](#enableresizedoenable-includenewwidgets) | ||
| - [float(val?)](#floatval) | ||
| - [getCellHeight()](#getcellheight) | ||
| - [getCellFromPixel(position[, useOffset])](#getcellfrompixelposition-useoffset) | ||
| - [getGridItems(): GridItemHTMLElement[]](#getgriditems-griditemhtmlelement) | ||
| - [getMargin()](#getmargin) | ||
| - [isAreaEmpty(x, y, width, height)](#isareaemptyx-y-width-height) | ||
| - [load(layout: GridStackWidget[], boolean | ((w: GridStackWidget, add: boolean) => void) = true)](#loadlayout-gridstackwidget-boolean--w-gridstackwidget-add-boolean--void---true) | ||
| - [makeWidget(el)](#makewidgetel) | ||
| - [margin(value: numberOrString)](#marginvalue-numberorstring) | ||
| - [movable(el, val)](#movableel-val) | ||
| - [removeWidget(el, removeDOM = true, triggerEvent = true)](#removewidgetel-removedom--true-triggerevent--true) | ||
| - [removeAll(removeDOM = true)](#removeallremovedom--true) | ||
| - [resizable(el, val)](#resizableel-val) | ||
| - [save(saveContent = true): GridStackWidget[]](#savesavecontent--true-gridstackwidget) | ||
| - [setAnimation(doAnimate)](#setanimationdoanimate) | ||
| - [setStatic(staticValue)](#setstaticstaticvalue) | ||
| - [update(el: GridStackElement, opts: GridStackWidget)](#updateel-gridstackelement-opts-gridstackwidget) | ||
| - [willItFit(x, y, width, height, autoPosition)](#willitfitx-y-width-height-autoposition) | ||
| - [`addWidget(el?: GridStackWidget | GridStackElement, options?: GridStackWidget)`](#addwidgetel-gridstackwidget--gridstackelement-options-gridstackwidget) | ||
| - [`batchUpdate()`](#batchupdate) | ||
| - [`compact()`](#compact) | ||
| - [`cellHeight(val: number, update = true)`](#cellheightval-number-update--true) | ||
| - [`cellWidth()`](#cellwidth) | ||
| - [`commit()`](#commit) | ||
| - [`column(column: number, layout: ColumnOptions = 'moveScale')`](#columncolumn-number-layout-columnoptions--movescale) | ||
| - [`destroy([removeDOM])`](#destroyremovedom) | ||
| - [`disable()`](#disable) | ||
| - [`enable()`](#enable) | ||
| - [`enableMove(doEnable, includeNewWidgets)`](#enablemovedoenable-includenewwidgets) | ||
| - [`enableResize(doEnable, includeNewWidgets)`](#enableresizedoenable-includenewwidgets) | ||
| - [`float(val?)`](#floatval) | ||
| - [`getCellHeight()`](#getcellheight) | ||
| - [`getCellFromPixel(position[, useOffset])`](#getcellfrompixelposition-useoffset) | ||
| - [`getGridItems(): GridItemHTMLElement[]`](#getgriditems-griditemhtmlelement) | ||
| - [`getMargin()`](#getmargin) | ||
| - [`isAreaEmpty(x, y, width, height)`](#isareaemptyx-y-width-height) | ||
| - [`load(layout: GridStackWidget[], boolean | ((w: GridStackWidget, add: boolean) => void) = true)`](#loadlayout-gridstackwidget-boolean--w-gridstackwidget-add-boolean--void---true) | ||
| - [`makeWidget(el)`](#makewidgetel) | ||
| - [`margin(value: numberOrString)`](#marginvalue-numberorstring) | ||
| - [`movable(el, val)`](#movableel-val) | ||
| - [`removeWidget(el, removeDOM = true, triggerEvent = true)`](#removewidgetel-removedom--true-triggerevent--true) | ||
| - [`removeAll(removeDOM = true)`](#removeallremovedom--true) | ||
| - [`resizable(el, val)`](#resizableel-val) | ||
| - [`save(saveContent = true): GridStackWidget[]`](#savesavecontent--true-gridstackwidget) | ||
| - [`setAnimation(doAnimate)`](#setanimationdoanimate) | ||
| - [`setStatic(staticValue)`](#setstaticstaticvalue) | ||
| - [`update(el: GridStackElement, opts: GridStackWidget)`](#updateel-gridstackelement-opts-gridstackwidget) | ||
| - [`willItFit(x, y, width, height, autoPosition)`](#willitfitx-y-width-height-autoposition) | ||
| - [Utils](#utils) | ||
| - [GridStack.Utils.sort(nodes[, dir[, width]])](#gridstackutilssortnodes-dir-width) | ||
| - [`GridStack.Utils.sort(nodes[, dir[, width]])`](#gridstackutilssortnodes-dir-width) | ||
@@ -89,4 +95,8 @@ <!-- END doctoc generated TOC please keep comment here to allow auto update --> | ||
| - `disableResize` - disallows resizing of widgets (default: `false`). | ||
| - `dragIn` - specify the class of items that can be dragged into the grid (ex: dragIn: '.newWidget' | ||
| - `dragInOptions` - options for items that can be dragged into the grid (ex: dragInOptions: { revert: 'invalid', scroll: false, appendTo: 'body', helper: 'clone' } | ||
| - `dragIn` - specify the class of items that can be dragged into grids | ||
| * example: `dragIn: '.newWidget'`. | ||
| * **Note**: if you have multiple grids, it's best to call `GridStack.setupDragIn()` with same params as it only need to be done once. | ||
| - `dragInOptions` - options for items that can be dragged into grids | ||
| * example `dragInOptions: { revert: 'invalid', scroll: false, appendTo: 'body', helper: 'clone', handle: '.grid-stack-item-content' }` | ||
| * **Note**: if you have multiple grids, it's best to call `GridStack.setupDragIn()` with same params as it only need to be done once. | ||
| - `draggable` - allows to override jQuery UI draggable options. (default: `{handle: '.grid-stack-item-content', scroll: false, appendTo: 'body', containment: null}`) | ||
@@ -195,2 +205,11 @@ - `dragOut` to let user drag nested grid items out of a parent or not (default false) See [example](http://gridstackjs.com/demo/nested.html) | ||
| ### drag(event, el) | ||
| called while grid item is being dragged, for each new row/column value (not every pixel) | ||
| ```js | ||
| grid.on('drag', function(event: Event, el: GridItemHTMLElement) { | ||
| }); | ||
| ``` | ||
| ### dragstop(event, el) | ||
@@ -245,2 +264,11 @@ called after the user is done moving the item, with updated DOM attributes. | ||
| ### resize(event, el) | ||
| called while grid item is being resized, for each new row/column value (not every pixel) | ||
| ```js | ||
| grid.on('resize', function(event: Event, el: GridItemHTMLElement) { | ||
| }); | ||
| ``` | ||
| ### resizestop(event, el) | ||
@@ -259,11 +287,45 @@ | ||
| ## API | ||
| ## API Global (static) | ||
| ### addGrid(parent: HTMLElement, opt: GridStackOptions) | ||
| ### `init(options: GridStackOptions = {}, elOrString: GridStackElement = '.grid-stack'): GridStack` | ||
| create a grid under given parent, with given options and loading children recursively (for nested grids), instead of `init() + load()`. Used by `load()` to supports nested grids creation. | ||
| see [nested.html](https://github.com/gridstack/gridstack.js/blob/develop/demo/nested.html) demo | ||
| * initializing the HTML element, or selector string, into a grid will return the grid. Calling it again will | ||
| simply return the existing instance (ignore any passed options). There is also an initAll() version that support multiple grids initialization at once. Or you can use addGrid() to create the entire grid from JSON. | ||
| * @param options grid options (optional) | ||
| * @param elOrString element or CSS selector (first one used) to convert to a grid (default to `'.grid-stack'` class selector) | ||
| ```js | ||
| let grid = GridStack.init(); | ||
| // Note: the HTMLElement (of type GridHTMLElement) will store a `gridstack: GridStack` value that can be retrieve later | ||
| let grid = document.querySelector('.grid-stack').gridstack; | ||
| ``` | ||
| ### addWidget(el?: GridStackWidget | GridStackElement, options?: GridStackWidget) | ||
| ### `initAll(options: GridStackOptions = {}, selector = '.grid-stack'): GridStack[]` | ||
| * Will initialize a list of elements (given a selector) and return an array of grids. | ||
| * @param options grid options (optional) | ||
| * @param selector elements selector to convert to grids (default to '.grid-stack' class selector) | ||
| ```js | ||
| let grids = GridStack.initAll(); | ||
| grids.forEach(...) | ||
| ``` | ||
| ### `addGrid(parent: HTMLElement, opt: GridStackOptions = {}): GridStack ` | ||
| * call to create a grid with the given options, including loading any children from JSON structure. This will call `GridStack.init()`, then `grid.load()` on any passed children (recursively). Great alternative to calling `init()` if you want entire grid to come from JSON serialized data, including options. | ||
| * @param parent HTML element parent to the grid | ||
| * @param opt grids options used to initialize the grid, and list of children | ||
| * see [nested.html](https://github.com/gridstack/gridstack.js/blob/develop/demo/nested.html) demo | ||
| ### `setupDragIn(dragIn?: string, dragInOptions?: DDDragInOpt)` | ||
| * call to setup dragging in from the outside (say toolbar), by specifying the class selection and options. | ||
| Called during `GridStack.init()` as options, but can also be called directly (last param are cached) in case the toolbar is dynamically create and needs to change later. | ||
| * @param dragIn string selector (ex: `'.sidebar .grid-stack-item'`) | ||
| * @param dragInOptions options - see `DDDragInOpt`. (default: `{revert: 'invalid', handle: '.grid-stack-item-content', scroll: false, appendTo: 'body'}` | ||
| ## API | ||
| ### `addWidget(el?: GridStackWidget | GridStackElement, options?: GridStackWidget)` | ||
| Creates new widget and returns it. Options is an object containing the fields x,y,width,height,etc... | ||
@@ -286,11 +348,11 @@ | ||
| ### batchUpdate() | ||
| ### `batchUpdate()` | ||
| starts batch updates. You will see no changes until `commit()` method is called. | ||
| ### compact() | ||
| ### `compact()` | ||
| re-layout grid items to reclaim any empty space. | ||
| ### cellHeight(val: number, update = true) | ||
| ### `cellHeight(val: number, update = true)` | ||
@@ -303,11 +365,11 @@ Update current cell height (see - `cellHeight` options format). This method rebuilds an internal CSS stylesheet (unless optional update=false). Note: You can expect performance issues if call this method too often. | ||
| ### cellWidth() | ||
| ### `cellWidth()` | ||
| Gets current cell width (grid width / # of columns). | ||
| ### commit() | ||
| ### `commit()` | ||
| Ends batch updates. Updates DOM nodes. You must call it after `batchUpdate()`. | ||
| ### column(column: number, layout: ColumnOptions = 'moveScale') | ||
| ### `column(column: number, layout: ColumnOptions = 'moveScale')` | ||
@@ -326,3 +388,3 @@ set/get the number of columns in the grid. Will update existing widgets to conform to new number of columns, | ||
| ### destroy([removeDOM]) | ||
| ### `destroy([removeDOM])` | ||
@@ -335,3 +397,3 @@ Destroys a grid instance. | ||
| ### disable() | ||
| ### `disable()` | ||
@@ -345,3 +407,3 @@ Disables widgets moving/resizing. This is a shortcut for: | ||
| ### enable() | ||
| ### `enable()` | ||
@@ -355,3 +417,3 @@ Enables widgets moving/resizing. This is a shortcut for: | ||
| ### enableMove(doEnable, includeNewWidgets) | ||
| ### `enableMove(doEnable, includeNewWidgets)` | ||
@@ -365,3 +427,3 @@ Enables/disables widget moving. `includeNewWidgets` will force new widgets to be draggable as per `doEnable`'s value by changing the `disableDrag` grid option (default: true). This is a shortcut for: | ||
| ### enableResize(doEnable, includeNewWidgets) | ||
| ### `enableResize(doEnable, includeNewWidgets)` | ||
@@ -375,3 +437,3 @@ Enables/disables widget resizing. `includeNewWidgets` will force new widgets to be resizable as per `doEnable`'s value by changing the `disableResize` grid option (default: true). This is a shortcut for: | ||
| ### float(val?) | ||
| ### `float(val?)` | ||
@@ -382,3 +444,3 @@ set/get floating widgets (default: `false`) | ||
| ### getCellHeight() | ||
| ### `getCellHeight()` | ||
@@ -388,3 +450,3 @@ Gets current cell height. | ||
| ### getCellFromPixel(position[, useOffset]) | ||
| ### `getCellFromPixel(position[, useOffset])` | ||
@@ -400,15 +462,15 @@ Get the position of the cell under a pixel on screen. | ||
| ### getGridItems(): GridItemHTMLElement[] | ||
| ### `getGridItems(): GridItemHTMLElement[]` | ||
| Return list of GridItem HTML dom elements (excluding temporary placeholder) | ||
| ### getMargin() | ||
| ### `getMargin()` | ||
| returns current margin value (undefined if all 4 sides don't match). | ||
| ### isAreaEmpty(x, y, width, height) | ||
| ### `isAreaEmpty(x, y, width, height)` | ||
| Checks if specified area is empty. | ||
| ### load(layout: GridStackWidget[], boolean | ((w: GridStackWidget, add: boolean) => void) = true) | ||
| ### `load(layout: GridStackWidget[], boolean | ((w: GridStackWidget, add: boolean) => void) = true)` | ||
@@ -422,3 +484,3 @@ - load the widgets from a list (see `save()`). This will call `update()` on each (matching by id) or add/remove widgets that are not there. | ||
| ### makeWidget(el) | ||
| ### `makeWidget(el)` | ||
@@ -438,3 +500,3 @@ If you add elements to your gridstack container by hand, you have to tell gridstack afterwards to make them widgets. If you want gridstack to add the elements for you, use `addWidget` instead. | ||
| ### margin(value: numberOrString) | ||
| ### `margin(value: numberOrString)` | ||
@@ -447,3 +509,3 @@ gap between grid item and content (default?: 10). This will set all 4 sides and support the CSS formats below | ||
| ### movable(el, val) | ||
| ### `movable(el, val)` | ||
@@ -455,3 +517,3 @@ Enables/Disables moving. | ||
| ### removeWidget(el, removeDOM = true, triggerEvent = true) | ||
| ### `removeWidget(el, removeDOM = true, triggerEvent = true)` | ||
@@ -466,3 +528,3 @@ Removes widget from the grid. | ||
| ### removeAll(removeDOM = true) | ||
| ### `removeAll(removeDOM = true)` | ||
@@ -475,3 +537,3 @@ Removes all widgets from the grid. | ||
| ### resizable(el, val) | ||
| ### `resizable(el, val)` | ||
@@ -483,3 +545,3 @@ Enables/Disables resizing. | ||
| ### save(saveContent = true): GridStackWidget[] | ||
| ### `save(saveContent = true): GridStackWidget[]` | ||
@@ -489,3 +551,3 @@ - returns the layout of the grid (and optionally the html content as well) that can be serialized (list of item non default attributes, not just w,y,x,y but also min/max and id). See `load()` | ||
| ### setAnimation(doAnimate) | ||
| ### `setAnimation(doAnimate)` | ||
@@ -496,3 +558,3 @@ Toggle the grid animation state. Toggles the `grid-stack-animate` class. | ||
| ### setStatic(staticValue) | ||
| ### `setStatic(staticValue)` | ||
@@ -503,3 +565,3 @@ Toggle the grid static state. Also toggle the `grid-stack-static` class. | ||
| ### update(el: GridStackElement, opts: GridStackWidget) | ||
| ### `update(el: GridStackElement, opts: GridStackWidget)` | ||
@@ -513,3 +575,3 @@ Parameters: | ||
| ### willItFit(x, y, width, height, autoPosition) | ||
| ### `willItFit(x, y, width, height, autoPosition)` | ||
@@ -530,3 +592,3 @@ Returns `true` if the `height` of the grid will be less the vertical constraint. Always returns `true` if grid doesn't | ||
| ### GridStack.Utils.sort(nodes[, dir[, width]]) | ||
| ### `GridStack.Utils.sort(nodes[, dir[, width]])` | ||
@@ -533,0 +595,0 @@ Sorts array of nodes |
| { | ||
| "name": "gridstack", | ||
| "version": "3.3.0", | ||
| "description": "TypeScript/Javascript lib for dashboard layout and creation, no external dependencies, with many wrappers (React, Angular, Ember, knockout...)", | ||
| "version": "4.0.0", | ||
| "description": "TypeScript/JS lib for dashboard layout and creation, no external dependencies, with many wrappers (React, Angular, Vue, Ember, knockout...)", | ||
| "main": "./dist/gridstack.js", | ||
@@ -11,2 +11,9 @@ "types": "./dist/gridstack.d.ts", | ||
| }, | ||
| "funding": [{ | ||
| "type" : "paypal", | ||
| "url" : "https://www.paypal.me/alaind831" | ||
| }, { | ||
| "type" : "venmo", | ||
| "url" : "https://www.venmo.com/adumesny" | ||
| }], | ||
| "scripts": { | ||
@@ -35,2 +42,3 @@ "build": "yarn --no-progress && rm -rf dist/* && grunt && webpack && tsc --stripInternal && yarn doc", | ||
| "React", | ||
| "Vue", | ||
| "JavaScript" | ||
@@ -37,0 +45,0 @@ ], |
@@ -46,2 +46,3 @@ # gridstack.js | ||
| - [Migrating to v3](#migrating-to-v3) | ||
| - [Migrating to v4](#migrating-to-v4) | ||
| - [jQuery Application](#jquery-application) | ||
@@ -264,16 +265,9 @@ - [Changes](#changes) | ||
| NOTE: gridstack v3.2+ jq version now compile this in, so it works out of the box, so need for anything. | ||
| gridstack v3.2 jq version compiles touch support (html5 version does not yet support `touchmove` events. This will be added in a future release), so it works out of the box, no need for anything. | ||
| You **used** to need [jQuery UI Touch Punch](https://github.com/RWAP/jquery-ui-touch-punch) to make jQuery UI Draggable/Resizable | ||
| work on touch-based devices (now distributed as `dist/jq/jquery.ui.touch-punch.js` for reference). | ||
| NOTE2: HTML5 v3+ does not currently support `touchmove` events. This will be added in a future release. | ||
| Use latest RWAP branch of [jQuery UI Touch Punch](https://github.com/RWAP/jquery-ui-touch-punch) to make jQuery UI Draggable/Resizable | ||
| working on touch-based devices (which we now also include in v3.2 as `dist/jq/jquery.ui.touch-punch.js`). | ||
| This option will be useful: | ||
| ```html | ||
| <script src="gridstack-jq.js"></script> | ||
| <script src="jquery.ui.touch-punch.min.js"></script> | ||
| ``` | ||
| Also `alwaysShowResizeHandle` option may be useful: | ||
| ```js | ||
@@ -387,3 +381,4 @@ let options = { | ||
| Note: HTML5 is almost on parity with the old jquery-ui based drag&drop. the `containment` (prevent a child from being dragged outside it's parent) and `revert` (not clear what it for yet) are not yet implemented in initial release of v3.0.0 | ||
| **NOTE**: HTML5 version is almost on parity with the old jquery-ui based drag&drop. the `containment` (prevent a child from being dragged outside it's parent) and `revert` (not clear what it is for yet) are not yet implemented in initial release of v3.0.0.<br> | ||
| Also mobile devices don't support h5 `drag` events (will need to handle `touch`) whereas v3.2 jq version now now supports out of the box (see [v3.2 release](https://github.com/gridstack/gridstack.js/releases/tag/v3.2.0)) | ||
@@ -402,7 +397,31 @@ Breaking changes: | ||
| ## Migrating to v4 | ||
| make sure to read v3 migration first! | ||
| v4 is a complete re-write of the collision and drag in/out heuristics to fix some very long standing request & bugs. It also greatly improved usability. Read the release notes for more detail. | ||
| **Unlikely** Breaking Changes (internal usage): | ||
| 1. `removeTimeout` was removed (feedback over trash will be immediate - actual removal still on mouse up) | ||
| 2. the following `GridStackEngine` methods changed (used internally, doesn't affect `GridStack` public API) | ||
| ```js | ||
| // moved to 3 methods with new option params to support new code and pixel coverage check | ||
| `collision()` -> `collide(), collideAll(), collideCoverage()` | ||
| `moveNodeCheck(node, x, y, w, h)` -> `moveNodeCheck(node, opt: GridStackMoveOpts)` | ||
| `isNodeChangedPosition(node, x, y, w, h)` -> `changedPosConstrain(node, opt: GridStackMoveOpts)` | ||
| `moveNode(node, x, y, w, h, noPack)` -> `moveNode(node, opt: GridStackMoveOpts)` | ||
| ``` | ||
| 3. removed old obsolete (v0.6-v1 methods/attrs) `getGridHeight()`, `verticalMargin`, `data-gs-current-height`, | ||
| `locked()`, `maxWidth()`, `minWidth()`, `maxHeight()`, `minHeight()`, `move()`, `resize()` | ||
| # jQuery Application | ||
| We now have a native HTML5 drag'n'drop through the plugin system (default), but the jquery-ui version can be used instead. It will bundle `jquery` (3.5.1) + `jquery-ui` (1.12.1 minimal drag|drop|resize) in `gridstack-jq.js`. IFF your app needs to bring your own version instead, you should **instead** include `gridstack-poly.min.js` (optional IE support) + `gridstack.min.js` + `gridstack.jQueryUI.min.js` after you import your JQ libs. But note that there are issue with jQuery and ES6 import (see [1306](https://github.com/gridstack/gridstack.js/issues/1306)). | ||
| We now have a native HTML5 drag'n'drop through the plugin system (default), but the jquery-ui version can be used instead. It will bundle `jquery` (3.5.1) + `jquery-ui` (1.12.1 minimal drag|drop|resize) + `jquery-ui-touch-punch` (1.0.8 for mobile support) in `gridstack-jq.js`. IFF you want to use gridstack-jq instead and your app needs to bring your own JQ version (only possible in 1.x), you should **instead** use v1.x and include `gridstack-poly.min.js` (optional IE support) + `gridstack.min.js` + `gridstack.jQueryUI.min.js` after you import your JQ libs. But note that there are issue with jQuery and ES6 import (see [1306](https://github.com/gridstack/gridstack.js/issues/1306)). | ||
| NOTE: v2.x / v3.x does not currently support importing GridStack Drag&Drop without also including our jquery + jquery-ui. Still trying to figure how to make that bundle possible. You will have to use 1.x for now... | ||
| **NOTE**: v2.x / v3.x does not currently support importing GridStack Drag&Drop without also including our jquery + jquery-ui. Still trying to figure how to make that bundle possible. You will have to use 1.x for now, or use the HTML5 version (no jq). | ||
@@ -409,0 +428,0 @@ As for events, you can still use `$(".grid-stack").on(...)` for the version that uses jquery-ui for things we don't support. |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Unidentified License
License(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by3.81%
2753632
- Number of low license alerts
- decreased by-33.33%
2
- Lines of code
- increased by2.63%
8162
- Number of lines in readme file
- increased by4.58%
434
No dependency changes