diff --git a/angular/projects/demo/src/app/app.component.ts b/angular/projects/demo/src/app/app.component.ts index 43f4da4fa..aee3a042f 100644 --- a/angular/projects/demo/src/app/app.component.ts +++ b/angular/projects/demo/src/app/app.component.ts @@ -35,12 +35,13 @@ export class AppComponent implements OnInit { ]; public gridOptions: GridStackOptions = { margin: 5, - float: true, + // float: true, minRow: 1, } + private sub0: NgGridStackWidget[] = [{x:0, y:0, selector:'app-a'}, {x:1, y:0, content:'plain html'}, {x:0, y:1, selector:'app-b'} ]; public gridOptionsFull: NgGridStackOptions = { ...this.gridOptions, - children: [{x:0, y:0, selector:'app-a'}, {x:1, y:0, selector:'app-b'}, {x:2, y:0, content:'plain html'}], + children: this.sub0, } // nested grid options @@ -70,8 +71,8 @@ export class AppComponent implements OnInit { constructor() { // give them content and unique id to make sure we track them during changes below... - [...this.items, ...this.subChildren, ...this.sub1, ...this.sub2].forEach((w: NgGridStackWidget) => { - if (!w.selector && !w.subGridOpts) w.content = `item ${ids}`; + [...this.items, ...this.subChildren, ...this.sub1, ...this.sub2, ...this.sub0].forEach((w: NgGridStackWidget) => { + if (!w.selector && !w.content && !w.subGridOpts) w.content = `item ${ids}`; w.id = String(ids++); }); } diff --git a/doc/CHANGES.md b/doc/CHANGES.md index dae29f248..da22fa565 100644 --- a/doc/CHANGES.md +++ b/doc/CHANGES.md @@ -5,6 +5,7 @@ Change log **Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)* +- [8.2.0-dev (TBD)](#820-dev-tbd) - [8.2.0 (2023-05-24)](#820-2023-05-24) - [8.1.2 (2023-05-22)](#812-2023-05-22) - [8.1.1 (2023-05-13)](#811-2023-05-13) @@ -88,6 +89,9 @@ Change log +## 8.2.0-dev (TBD) +* fix: make sure `removeNode()` uses internal _id (unique) and not node itself (since we clone those often) + ## 8.2.0 (2023-05-24) * feat: `makeWidget()` now take optional `GridStackWidget` for sizing * fix: make sure `GridStack.saveCB` is call in `removeWidget()` diff --git a/src/gridstack-engine.ts b/src/gridstack-engine.ts index 3d73b08ad..d94ee5f77 100644 --- a/src/gridstack-engine.ts +++ b/src/gridstack-engine.ts @@ -126,10 +126,14 @@ export class GridStackEngine { /** return the nodes that intercept the given node. Optionally a different area can be used, as well as a second node to skip */ public collide(skip: GridStackNode, area = skip, skip2?: GridStackNode): GridStackNode { - return this.nodes.find(n => n !== skip && n !== skip2 && Utils.isIntercepted(n, area)); + const skipId = skip._id; + const skip2Id = skip2?._id; + return this.nodes.find(n => n._id !== skipId && n._id !== skip2Id && Utils.isIntercepted(n, area)); } public collideAll(skip: GridStackNode, area = skip, skip2?: GridStackNode): GridStackNode[] { - return this.nodes.filter(n => n !== skip && n !== skip2 && Utils.isIntercepted(n, area)); + const skipId = skip._id; + const skip2Id = skip2?._id; + return this.nodes.filter(n => n._id !== skipId && n._id !== skip2Id && Utils.isIntercepted(n, area)); } /** does a pixel coverage collision based on where we started, returning the node that has the most coverage that is >50% mid line */ @@ -522,7 +526,7 @@ export class GridStackEngine { } public removeNode(node: GridStackNode, removeDOM = true, triggerEvent = false): GridStackEngine { - if (!this.nodes.find(n => n === node)) { + if (!this.nodes.find(n => n._id === node._id)) { // TEST console.log(`Error: GridStackEngine.removeNode() node._id=${node._id} not found!`) return this; } @@ -531,7 +535,7 @@ export class GridStackEngine { } 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); + this.nodes = this.nodes.filter(n => n._id !== node._id); return this._packNodes() ._notify([node]); } @@ -564,7 +568,7 @@ export class GridStackEngine { column: this.column, float: this.float, nodes: this.nodes.map(n => { - if (n === node) { + if (n._id === node._id) { clonedNode = {...n}; return clonedNode; }