added GridStackOptions.layout for nested grid reflow

* fix #2864
* reiszing subgrid will now reflow content as requested. 'none' was changed to do nothing (so user can custimize/load/overide) a little while back.

Author: adumesny

demo/nested.html

@@ -55,6 +55,7 @@ <h1>Nested grids demo</h1>
       minRow: 2, // don't collapse when empty
       acceptWidgets: true,
       id: 'main',
+      resizable: { handles: 'se,e,s,sw,w'},
       subGridOpts: subOptions, // all sub grids will default to those
       children: [
         {x:0, y:0, content: 'regular item'},

doc/CHANGES.md

@@ -120,6 +120,7 @@ Change log
 * 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: [#2492](https://github.com/gridstack/gridstack.js/issues/2492) loading same layout with overlapping widget fix. v10.3.0 regression.
+* fix: [#2864](https://github.com/gridstack/gridstack.js/issues/2864) added `GridStackOptions.layout` for nested grid reflow during resize. default to 'list'.
 
 ## 11.0.1 (2024-10-21)
 * fix: [#2834](https://github.com/gridstack/gridstack.js/pull/2834) v11 angular missing package.json

spec/e2e/html/2576_insert_column_shift_content.html

@@ -5,7 +5,7 @@
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Column insert bug #2578</title>
+  <title>Column insert bug #2576</title>
   <link rel="stylesheet" href="../../../demo/demo.css" />
   <script src="../../../dist/gridstack-all.js"></script>
   <link rel="stylesheet" href="../../../dist/gridstack-extra.css"/>

src/gridstack.ts

@@ -1786,7 +1786,7 @@ export class GridStack {
     let columnChanged = false;
     if (this._autoColumn && this.parentGridNode) {
       if (this.opts.column !== this.parentGridNode.w) {
-        this.column(this.parentGridNode.w, 'none');
+        this.column(this.parentGridNode.w, this.opts.layout || 'none');
         columnChanged = true;
       }
     } else {

src/types.ts

@@ -191,6 +191,9 @@ export interface GridStackOptions {
   /** additional widget class (default?: 'grid-stack-item') */
   itemClass?: string;
 
+  /** re-layout mode when we're a subgrid and we are being resized. default to 'list' */
+  layout?: ColumnOptions;
+
   /** true when widgets are only created when they scroll into view (visible) */
   lazyLoad?: boolean;