gridstack 4.3.0 → 5.0.0

package/README.md

@@ -44,6 +44,7 @@ Join us on Slack: https://gridstackjs.troolee.com
   - [Migrating to v2](#migrating-to-v2)
   - [Migrating to v3](#migrating-to-v3)
   - [Migrating to v4](#migrating-to-v4)
+  - [Migrating to v5](#migrating-to-v5)
 - [jQuery Application](#jquery-application)
 - [Changes](#changes)
 - [The Team](#the-team)
@@ -92,19 +93,28 @@ which means you can possibly bring your own version
   },
 ```
 
-Alternatively in html
+Alternatively (single combined file) in html
 
 ```html
 <link href="node_modules/gridstack/dist/gridstack.min.css" rel="stylesheet"/>
-<!-- HTML5 drag&drop (68k) -->
+<!-- HTML5 drag&drop (70k) -->
 <script src="node_modules/gridstack/dist/gridstack-h5.js"></script>
-<!-- OR jquery-ui drag&drop (193k) -->
+<!-- OR jquery-ui drag&drop (195k) -->
 <script src="node_modules/gridstack/dist/gridstack-jq.js"></script>
-<!-- OR static grid (38k) -->
+<!-- OR static grid (40k) -->
 <script src="node_modules/gridstack/dist/gridstack-static.js"></script>
 ```
 
-Note: the API is the same, regardless of the plugin (or lack thereof) so you can switch at any time. The Jquery version will export $ that it bundles and currently the only one to support mobile/touch devices through `jquery.ui.touch-punch` (h5 version is planned). Read more at [migrating to v3](#migrating-to-v3)
+**Note**: the API is the same, regardless of the plugin (or lack thereof) so you can switch at any time. The Jquery version will export $ that it bundles and currently the only one to support mobile/touch devices through `jquery.ui.touch-punch` (h5 version is planned). Read more at [migrating to v3](#migrating-to-v3)
+
+**Note2**: IE support was dropped in v2, but restored in v4.4 by an external contributor (I have no interest in testing+supporting obsolete browser so this might break in the future).
+You can use the es5 files and polyfill (larger) for older browser instead. For example:
+```html
+<link href="node_modules/gridstack/dist/gridstack.min.css" rel="stylesheet"/>
+<script src="node_modules/gridstack/dist/es5/gridstack-poly.js"></script>
+<script src="node_modules/gridstack/dist/es5/gridstack-jq.js"></script>
+```
+
 
 ## Basic usage
 
@@ -426,6 +436,13 @@ v4 is a complete re-write of the collision and drag in/out heuristics to fix som
 `locked()`, `maxWidth()`, `minWidth()`, `maxHeight()`, `minHeight()`, `move()`, `resize()`
 
 
+## Migrating to v5
+
+make sure to read v4 migration first!
+
+v5 does not have any breaking changes from v4, but a focus on nested grids in h5 mode:
+You can now drag in/out of parent into nested child, with new API parameters values. See the release notes.
+
 # 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) + `jquery-ui-touch-punch` (1.0.8 for mobile support) in `gridstack-jq.js`. 

package/dist/es5/gridstack-dd.d.ts

@@ -0,0 +1,35 @@
+/**
+ * gridstack-dd.ts 5.0
+ * Copyright (c) 2021 Alain Dumesny - see GridStack root license
+ */
+import { GridStackDDI } from './gridstack-ddi';
+import { GridItemHTMLElement, GridStackElement, DDDragInOpt } from './types';
+/** Drag&Drop drop options */
+export declare type DDDropOpt = {
+    /** function or class type that this grid will accept as dropped items (see GridStackOptions.acceptWidgets) */
+    accept?: (el: GridItemHTMLElement) => boolean;
+};
+/** drag&drop options currently called from the main code, but others can be passed in grid options */
+export declare type DDOpts = 'enable' | 'disable' | 'destroy' | 'option' | string | any;
+export declare type DDKey = 'minWidth' | 'minHeight' | 'maxWidth' | 'maxHeight';
+export declare type DDValue = number | string;
+/** drag&drop events callbacks */
+export declare type DDCallback = (event: Event, arg2: GridItemHTMLElement, helper?: GridItemHTMLElement) => void;
+/**
+ * Base class implementing common Grid drag'n'drop functionality, with domain specific subclass (h5 vs jq subclasses)
+ */
+export declare abstract class GridStackDD extends GridStackDDI {
+    /** override to cast to correct type */
+    static get(): GridStackDD;
+    /** removes any drag&drop present (called during destroy) */
+    remove(el: GridItemHTMLElement): GridStackDD;
+    abstract resizable(el: GridItemHTMLElement, opts: DDOpts, key?: DDKey, value?: DDValue): GridStackDD;
+    abstract isResizable(el: HTMLElement): boolean;
+    abstract draggable(el: GridItemHTMLElement, opts: DDOpts, key?: DDKey, value?: DDValue): GridStackDD;
+    abstract dragIn(el: GridStackElement, opts: DDDragInOpt): GridStackDD;
+    abstract isDraggable(el: HTMLElement): boolean;
+    abstract droppable(el: GridItemHTMLElement, opts: DDOpts | DDDropOpt, key?: DDKey, value?: DDValue): GridStackDD;
+    abstract isDroppable(el: HTMLElement): boolean;
+    abstract on(el: GridItemHTMLElement, eventName: string, callback: DDCallback): GridStackDD;
+    abstract off(el: GridItemHTMLElement, eventName: string): GridStackDD;
+}