gridstack 7.2.3 → 8.0.0

package/doc/CHANGES.md

@@ -5,6 +5,8 @@ Change log
 <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
 **Table of Contents**  *generated with [DocToc](http://doctoc.herokuapp.com/)*
 
+- [8.0.0 (2023-04-29)](#800-2023-04-29)
+- [7.3.0 (2023-04-01)](#730-2023-04-01)
 - [7.2.3 (2023-02-02)](#723-2023-02-02)
 - [7.2.2 (2023-01-16)](#722-2023-01-16)
 - [7.2.1 (2023-01-14)](#721-2023-01-14)
@@ -81,6 +83,23 @@ Change log
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
+## 8.0.0 (2023-04-29)
+* package is now ES2020 (TS exported files), webpack all.js still umd (better than commonjs for browsers), still have es5/ files unchanged (for now)
+* optimize [#2243](https://github.com/gridstack/gridstack.js/issues/2243) removed `gs-min|max_w|h` attribute generated in CSS or written out as they are never used for rendering, only for initial load. This reduce our column/row CSS in half!
+* optimize: removed `gs-w='1'` and `gs-h='1'` dom attribute writing since we already have min-width/min-height set, no need to set more attributes.
+* optimize: remove `'ui-draggable'` and `'ui-resizable'` since wasn't used in CSS and we have the `-disabled` version when off (so we can use `not(xyz-disabled)`).
+* add: `GridStack.saveCB` global callback for each item during save so app can insert any custom data before serializing it. `save()` can now be passed optional callback
+* move: `GridStack.addRemoveCB` is now global instead of grid option. `load()` can still be passed different optional callback
+* fix: addGrid() to handle passing an existing initialized grid already
+* break: `GridStackOptions.subGrid` -> `GridStackOptions.subGridOpts`. We now have `GridStackWidget.subGridOpts` vs `GridStackNode.subGrid` (subclass) rather than try to merge the two at runtime since very different types...
+* tons of improvements for Angular wrapper.
+
+## 7.3.0 (2023-04-01)
+* feat [#2229](https://github.com/gridstack/gridstack.js/pull/2229) support nonce for CSP. Thank you [@jedwards1211](https://github.com/jedwards1211)
+* feat: support nested grids with Angular component demo. Thank you R. Blanken for supporting this.
+* fix [#2206](https://github.com/gridstack/gridstack.js/issues/2206) `load()` with collision fix
+* fix [#2232](https://github.com/gridstack/gridstack.js/issues/2232) `autoPosition` bug loading from DOM
+
 ## 7.2.3 (2023-02-02)
 * fix `addWidget()` to handle passing just {el} which was needed for Angular HMTL template demo
 * add `opts.draggable.scroll` back to disable scrolling. Thank you [@VincentMolinie](https://github.com/VincentMolinie)

package/doc/README.md

@@ -51,6 +51,7 @@ gridstack.js API
   - [`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)
+  - [`makeSubgrid(el)`](#makesubgridel)
   - [`margin(value: numberOrString)`](#marginvalue-numberorstring)
   - [`movable(el, val)`](#movableel-val)
   - [`removeWidget(el, removeDOM = true, triggerEvent = true)`](#removewidgetel-removedom--true-triggerevent--true)
@@ -118,6 +119,8 @@ gridstack.js API
 - `marginLeft`: numberOrString
 - `maxRow` - maximum rows amount. Default is `0` which means no max.
 - `minRow` - minimum rows amount which is handy to prevent grid from collapsing when empty. Default is `0`. You can also do this with `min-height` CSS attribute on the grid div in pixels, which will round to the closest row.
+- `nonce` - If you are using a nonce-based Content Security Policy, pass your nonce here and
+GridStack will add it to the <style> elements it creates.
 - `oneColumnSize` - minimal width. If grid width is less than or equal to, grid will be shown in one-column mode (default: `768`)
 - `oneColumnModeDomSort` - set to `true` if you want oneColumnMode to use the DOM order and ignore x,y from normal multi column layouts during sorting. This enables you to have custom 1 column layout that differ from the rest. (default?: `false`)
 - `placeholderClass` - class for placeholder (default: `'grid-stack-placeholder'`)
@@ -499,7 +502,20 @@ let grid = GridStack.init();
 grid.el.appendChild('<div id="gsi-1" gs-x="0" gs-y="0" gs-w="3" gs-h="2" gs-auto-position="true"></div>')
 grid.makeWidget('#gsi-1');
 ```
-
+### `makeSubgrid(el)`
+Used to add a subgrid into an existing grid.
+```js
+const grid = Gridstack.init()
+grid.el.appendChild(`
+<div id="gsi-1" gs-x="0" gs-y="0" gs-w="3" gs-h="2" gs-auto-position="true">
+      <div class="grid-stack" id="nested-grid">
+          <div id="gsi-2" gs-x="0" gs-y="0" gs-w="3" gs-h="2" gs-auto-position="true">
+          </div>
+      </div>
+</div>`)
+grid.addSubGrid(grid.el.getElementById('nested-grid'))
+```
+Make sure that the subgrid is inside of a grid item. It is important to remember that subgrids are themselves grid items capable of containing other grid items.
 ### `margin(value: numberOrString)`
 
 gap between grid item and content (default?: 10). This will set all 4 sides and support the CSS formats below

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gridstack",
-  "version": "7.2.3",
+  "version": "8.0.0",
   "license": "MIT",
   "author": "Alain Dumesny <alaind831+github@gmail.com> (https://github.com/adumesny)",
   "contributors": [
@@ -25,9 +25,10 @@
     }
   ],
   "scripts": {
-    "build": "yarn --no-progress && rm -rf dist/* && grunt && yarn build:es6 && yarn build:es5 && yarn doc",
+    "build": "yarn --no-progress && rm -rf dist/* && grunt && yarn build:es6 && yarn build:ng && yarn build:es5 && yarn doc",
     "build:es6": "webpack && tsc --stripInternal",
     "build:es5": "webpack --config es5/webpack.config.js && tsc --stripInternal --project es5/tsconfig.json",
+    "build:ng": "tsc --stripInternal --project ./demo/angular/tsconfig.lib.json",
     "w": "webpack",
     "t": "rm -rf dist/* && grunt && tsc --stripInternal",
     "doc": "doctoc ./README.md && doctoc ./doc/README.md && doctoc ./doc/CHANGES.md",
@@ -58,37 +59,37 @@
   "homepage": "http://gridstackjs.com/",
   "dependencies": {},
   "devDependencies": {
-    "@types/jasmine": "^3.5.9",
-    "@typescript-eslint/eslint-plugin": "^4.6.0",
-    "@typescript-eslint/parser": "^4.6.0",
+    "@types/jasmine": "^4.3.1",
+    "@typescript-eslint/eslint-plugin": "^5.58.0",
+    "@typescript-eslint/parser": "^5.58.0",
     "connect": "^3.7.0",
-    "core-js": "^3.6.4",
-    "coveralls": "^3.0.9",
-    "doctoc": "^1.4.0",
-    "eslint": "^7.14",
-    "grunt": "^1.0.4",
+    "core-js": "^3.30.1",
+    "coveralls": "^3.1.1",
+    "doctoc": "^2.2.1",
+    "eslint": "^8.38.0",
+    "grunt": "^1.6.1",
     "grunt-cli": "^1.3.2",
     "grunt-contrib-connect": "^3.0.0",
     "grunt-contrib-copy": "^1.0.0",
-    "grunt-contrib-cssmin": "^3.0.0",
-    "grunt-contrib-uglify": "^5.0.0",
+    "grunt-contrib-cssmin": "^4.0.0",
+    "grunt-contrib-uglify": "^5.2.2",
     "grunt-contrib-watch": "^1.1.0",
-    "grunt-eslint": "^23.0.0",
+    "grunt-eslint": "^24.0.1",
     "grunt-protractor-runner": "^5.0.0",
     "grunt-protractor-webdriver": "^0.2.5",
     "grunt-sass": "3.1.0",
-    "jasmine-core": "^3.5.0",
-    "karma": "^6",
-    "karma-chrome-launcher": "^3.1.0",
+    "jasmine-core": "^4.6.0",
+    "karma": "^6.4.1",
+    "karma-chrome-launcher": "^3.1.1",
     "karma-cli": "^2.0.0",
-    "karma-jasmine": "^4.0.1",
-    "karma-typescript": "4.1.1",
+    "karma-jasmine": "^5.1.0",
+    "karma-typescript": "5.5.3",
     "protractor": "^7.0.0",
-    "sass": "^1.42.1",
-    "serve-static": "^1.14.1",
-    "ts-loader": "^8.0.7",
-    "typescript": "^3.7",
-    "webpack": "^5.3.2",
-    "webpack-cli": "^4.6.0"
+    "sass": "^1.62.0",
+    "serve-static": "^1.15.0",
+    "ts-loader": "^9.4.2",
+    "typescript": "^5.0.4",
+    "webpack": "^5.79.0",
+    "webpack-cli": "^5.0.1"
   }
 }