Merge pull request #2904 from adumesny/master

use attr `data-gs-widget`

Author: adumesny

demo/two.html

@@ -30,14 +30,14 @@ <h1>Two grids demo</h1>
           <!-- constrained in code using GridStackWidget[] sidebarContent -->
           <div class="sidebar-item">2x1, max=3</div>
           <!-- DOM JSON spelling GridStackWidget. NOTE: require content:'xyz' to work and RenderCB() to render -->
-          <div class="sidebar-item" gridstacknode='{"w":3, "content":"w:3"}'>w:3</div>
+          <div class="sidebar-item" data-gs-widget='{"w":3, "content":"drop w:3"}'>w:3</div>
           <!-- DOM id handled by myClone() case -->
           <div class="sidebar-item" gs-id="manual">gs-id case</div>
           <!-- DOM require proper GS format to be dropped as is without GridStackWidget above -->
           <div class="grid-stack-item" gs-w="3">
             <div class="grid-stack-item-content">DOM gs-w:3</div>
           </div>
-          <div class="grid-stack-item" gridstacknode='{"w":2}'>
+          <div class="grid-stack-item" data-gs-widget='{"w":2}'>
             <div class="grid-stack-item-content">DOM w:2</div>
           </div>
         </div>

doc/CHANGES.md

@@ -5,6 +5,7 @@ Change log
 <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
 **Table of Contents**  *generated with [DocToc](http://doctoc.herokuapp.com/)*
 
+- [11.1.2-dev (TBD)](#1112-dev-tbd)
 - [11.1.2 (2024-12-08)](#1112-2024-12-08)
 - [11.1.1 (2024-11-26)](#1111-2024-11-26)
 - [11.1.0 (2024-11-17)](#1110-2024-11-17)
@@ -118,6 +119,11 @@ Change log
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
+## 11.1.2-dev (TBD)
+* fix: [#2852](https://github.com/gridstack/gridstack.js/pull/2852) better React example. Thank you [CNine](https://github.com/Aysnine)
+* fix: [#2852](https://github.com/gridstack/gridstack.js/pull/2852) grid in tabs correctly handles CSS. Thank you [Luciano Martorella](https://github.com/lmartorella)
+* fix: [#2900](https://github.com/gridstack/gridstack.js/issues/2900) use attr `data-gs-widget` instead of `gridstacknode` (supported as well for backward compatibility)
+
 ## 11.1.2 (2024-12-08)
 * fix: [#2877](https://github.com/gridstack/gridstack.js/pull/2877) angular wrapper uses standalone, while now being compatible down to ng14. thanks to [andre-steudel](https://github.com/andre-steudel)
 * fix: [#2886](https://github.com/gridstack/gridstack.js/issues/2886) added `gs-size-to-content` support
@@ -129,8 +135,8 @@ Change log
 
 ## 11.1.0 (2024-11-17)
 * feat: [#2864](https://github.com/gridstack/gridstack.js/issues/2864) added `GridStackOptions.layout` for nested grid reflow during resize. default to 'list'.
-* fix: [#2859](https://github.com/gridstack/gridstack.js/pull/2859) re-enabled tests and fix numerous issues found (see CL). Also thank you [lmartorella](https://github.com/lmartorella) for getting me going and starting it.
-* fix: [#2851](https://github.com/gridstack/gridstack.js/pull/2851) added support for custom max layout saving - Thank you [lmartorella](https://github.com/lmartorella)
+* fix: [#2859](https://github.com/gridstack/gridstack.js/pull/2859) re-enabled tests and fix numerous issues found (see CL). Also thank you [Luciano Martorella](https://github.com/lmartorella) for getting me going and starting it.
+* fix: [#2851](https://github.com/gridstack/gridstack.js/pull/2851) added support for custom max layout saving - Thank you [Luciano Martorella](https://github.com/lmartorella)
 * fix: [#2492](https://github.com/gridstack/gridstack.js/issues/2492) loading same layout with overlapping widget fix. v10.3.0 regression.
 
 ## 11.0.1 (2024-10-21)

src/gridstack.ts

@@ -2200,12 +2200,14 @@ export class GridStack {
 
         // sidebar items: load any element attributes if we don't have a node
         if (!node) {
-          if (helper.hasAttribute('gridstacknode')) {
+          const attr = helper.getAttribute('data-gs-widget') || helper.getAttribute('gridstacknode'); // TBD: temp support for old V11.0.0 attribute 
+          if (attr) {
             try {
-              node = JSON.parse(helper.getAttribute('gridstacknode'));
+              node = JSON.parse(attr);
             } catch (error) {
-              console.error("Gridstack dropover: Bad JSON format: ", helper.getAttribute('gridstacknode'));
+              console.error("Gridstack dropover: Bad JSON format: ", attr);
             }
+            helper.removeAttribute('data-gs-widget');
             helper.removeAttribute('gridstacknode');
           }
           if (!node) node = this._readAttr(helper); // used to pass false for #2354, but now we clone top level node