angular-gridster2 - npm Package Compare versions

Comparing version 4.2.0 to 4.3.0

dist/gridster.component.js

@@ -21,14 +21,2 @@ "use strict";
         this.dragInProgress = false;
-        this.$options.draggable.stop = undefined;
-        this.$options.draggable.start = undefined;
-        this.$options.resizable.stop = undefined;
-        this.$options.resizable.start = undefined;
-        this.$options.itemChangeCallback = undefined;
-        this.$options.itemResizeCallback = undefined;
-        this.$options.itemInitCallback = undefined;
-        this.$options.itemRemovedCallback = undefined;
-        this.$options.emptyCellClickCallback = undefined;
-        this.$options.emptyCellContextMenuCallback = undefined;
-        this.$options.emptyCellDropCallback = undefined;
-        this.$options.emptyCellDragCallback = undefined;
         this.emptyCell = new gridsterEmptyCell_service_1.GridsterEmptyCell(this);
@@ -176,8 +164,8 @@ this.compact = new gridsterCompact_service_1.GridsterCompact(this);
         if (this.$options.outerMargin) {
-            this.curColWidth = Math.floor((this.curWidth - this.$options.margin) / this.columns);
-            this.curRowHeight = Math.floor((this.curHeight - this.$options.margin) / this.rows);
+            this.curColWidth = (this.curWidth - this.$options.margin) / this.columns;
+            this.curRowHeight = (this.curHeight - this.$options.margin) / this.rows;
         }
         else {
-            this.curColWidth = Math.floor((this.curWidth + this.$options.margin) / this.columns);
-            this.curRowHeight = Math.floor((this.curHeight + this.$options.margin) / this.rows);
+            this.curColWidth = (this.curWidth + this.$options.margin) / this.columns;
+            this.curRowHeight = (this.curHeight + this.$options.margin) / this.rows;
         }
@@ -269,8 +257,2 @@ var addClass = '';
         this.calculateLayoutDebounce();
-        if (itemComponent.$item.initCallback) {
-            itemComponent.$item.initCallback(itemComponent.item, itemComponent);
-        }
-        if (this.$options.itemInitCallback) {
-            this.$options.itemInitCallback(itemComponent.item, itemComponent);
-        }
     };
@@ -280,4 +262,4 @@ GridsterComponent.prototype.removeItem = function (itemComponent) {
         this.calculateLayoutDebounce();
-        if (this.$options.itemRemovedCallback) {
-            this.$options.itemRemovedCallback(itemComponent.item, itemComponent);
+        if (this.options.itemRemovedCallback) {
+            this.options.itemRemovedCallback(itemComponent.item, itemComponent);
         }
@@ -284,0 +266,0 @@ };

dist/gridsterConfig.constant.js

@@ -145,3 +145,5 @@ "use strict";
     // disable the window on resize listener. This will stop grid to recalculate on window resize.
-    disableWarnings: false // disable console log warnings about misplacements grid items
+    disableWarnings: false,
+    // disable console log warnings about misplacement of grid items
+    scrollToNewItems: false,
 };

dist/gridsterConfig.constant.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":4,"metadata":{"GridsterConfigService":{"gridType":"fit","fixedColWidth":250,"fixedRowHeight":250,"keepFixedHeightInMobile":false,"keepFixedWidthInMobile":false,"compactType":"none","mobileBreakpoint":640,"minCols":1,"maxCols":100,"minRows":1,"maxRows":100,"defaultItemCols":1,"defaultItemRows":1,"maxItemCols":50,"maxItemRows":50,"minItemCols":1,"minItemRows":1,"minItemArea":1,"maxItemArea":2500,"margin":10,"outerMargin":true,"scrollSensitivity":10,"scrollSpeed":20,"initCallback":{"__symbolic":"reference","name":"undefined"},"destroyCallback":{"__symbolic":"reference","name":"undefined"},"itemChangeCallback":{"__symbolic":"reference","name":"undefined"},"itemResizeCallback":{"__symbolic":"reference","name":"undefined"},"itemInitCallback":{"__symbolic":"reference","name":"undefined"},"itemRemovedCallback":{"__symbolic":"reference","name":"undefined"},"enableEmptyCellClick":false,"enableEmptyCellContextMenu":false,"enableEmptyCellDrop":false,"enableEmptyCellDrag":false,"emptyCellClickCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellContextMenuCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellDropCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellDragCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellDragMaxCols":50,"emptyCellDragMaxRows":50,"draggable":{"delayStart":0,"enabled":false,"ignoreContentClass":"gridster-item-content","ignoreContent":false,"dragHandleClass":"drag-handler","stop":{"__symbolic":"reference","name":"undefined"},"start":{"__symbolic":"reference","name":"undefined"}},"resizable":{"delayStart":0,"enabled":false,"handles":{"s":true,"e":true,"n":true,"w":true,"se":true,"ne":true,"sw":true,"nw":true},"stop":{"__symbolic":"reference","name":"undefined"},"start":{"__symbolic":"reference","name":"undefined"}},"swap":true,"pushItems":false,"disablePushOnDrag":false,"disablePushOnResize":false,"pushDirections":{"north":true,"east":true,"south":true,"west":true},"pushResizeItems":false,"displayGrid":"onDrag&Resize","disableWindowResize":false,"disableWarnings":false}}}]
+[{"__symbolic":"module","version":4,"metadata":{"GridsterConfigService":{"gridType":"fit","fixedColWidth":250,"fixedRowHeight":250,"keepFixedHeightInMobile":false,"keepFixedWidthInMobile":false,"compactType":"none","mobileBreakpoint":640,"minCols":1,"maxCols":100,"minRows":1,"maxRows":100,"defaultItemCols":1,"defaultItemRows":1,"maxItemCols":50,"maxItemRows":50,"minItemCols":1,"minItemRows":1,"minItemArea":1,"maxItemArea":2500,"margin":10,"outerMargin":true,"scrollSensitivity":10,"scrollSpeed":20,"initCallback":{"__symbolic":"reference","name":"undefined"},"destroyCallback":{"__symbolic":"reference","name":"undefined"},"itemChangeCallback":{"__symbolic":"reference","name":"undefined"},"itemResizeCallback":{"__symbolic":"reference","name":"undefined"},"itemInitCallback":{"__symbolic":"reference","name":"undefined"},"itemRemovedCallback":{"__symbolic":"reference","name":"undefined"},"enableEmptyCellClick":false,"enableEmptyCellContextMenu":false,"enableEmptyCellDrop":false,"enableEmptyCellDrag":false,"emptyCellClickCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellContextMenuCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellDropCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellDragCallback":{"__symbolic":"reference","name":"undefined"},"emptyCellDragMaxCols":50,"emptyCellDragMaxRows":50,"draggable":{"delayStart":0,"enabled":false,"ignoreContentClass":"gridster-item-content","ignoreContent":false,"dragHandleClass":"drag-handler","stop":{"__symbolic":"reference","name":"undefined"},"start":{"__symbolic":"reference","name":"undefined"}},"resizable":{"delayStart":0,"enabled":false,"handles":{"s":true,"e":true,"n":true,"w":true,"se":true,"ne":true,"sw":true,"nw":true},"stop":{"__symbolic":"reference","name":"undefined"},"start":{"__symbolic":"reference","name":"undefined"}},"swap":true,"pushItems":false,"disablePushOnDrag":false,"disablePushOnResize":false,"pushDirections":{"north":true,"east":true,"south":true,"west":true},"pushResizeItems":false,"displayGrid":"onDrag&Resize","disableWindowResize":false,"disableWarnings":false,"scrollToNewItems":false}}}]

dist/gridsterConfig.interface.d.ts

@@ -45,2 +45,3 @@ export declare type GridType = 'fit' | 'scrollVertical' | 'scrollHorizontal' | 'fixed' | 'verticalFixed' | 'horizontalFixed';
     disableWarnings?: boolean;
+    scrollToNewItems?: boolean;
     enableEmptyCellClick?: boolean;
@@ -47,0 +48,0 @@ enableEmptyCellContextMenu?: boolean;

dist/gridsterConfigS.interface.d.ts

@@ -37,2 +37,3 @@ import { compactType, displayGrid, GridType } from './gridsterConfig.interface';
     disableWarnings: boolean;
+    scrollToNewItems: boolean;
     enableEmptyCellClick: boolean;
@@ -39,0 +40,0 @@ enableEmptyCellContextMenu: boolean;

dist/gridsterDraggable.service.js

@@ -36,4 +36,4 @@ "use strict";
         }
-        if (this.gridster.$options.draggable.start) {
-            this.gridster.$options.draggable.start(this.gridsterItem.item, this.gridsterItem, e);
+        if (this.gridster.options.draggable && this.gridster.options.draggable.start) {
+            this.gridster.options.draggable.start(this.gridsterItem.item, this.gridsterItem, e);
         }
@@ -99,4 +99,4 @@ e.stopPropagation();
         this.path = [];
-        if (this.gridster.$options.draggable.stop) {
-            Promise.resolve(this.gridster.$options.draggable.stop(this.gridsterItem.item, this.gridsterItem, e))
+        if (this.gridster.options.draggable && this.gridster.options.draggable.stop) {
+            Promise.resolve(this.gridster.options.draggable.stop(this.gridsterItem.item, this.gridsterItem, e))
                 .then(this.makeDrag.bind(this), this.cancelDrag.bind(this));
@@ -103,0 +103,0 @@ }

dist/gridsterEmptyCell.service.js

@@ -13,3 +13,3 @@ "use strict";
     GridsterEmptyCell.prototype.updateOptions = function () {
-        if (this.gridster.$options.enableEmptyCellClick && !this.emptyCellClick && this.gridster.$options.emptyCellClickCallback) {
+        if (this.gridster.$options.enableEmptyCellClick && !this.emptyCellClick && this.gridster.options.emptyCellClickCallback) {
             this.emptyCellClick = this.gridster.renderer.listen(this.gridster.el, 'click', this.emptyCellClickCb.bind(this));
@@ -25,3 +25,3 @@ this.emptyCellClickTouch = this.gridster.renderer.listen(this.gridster.el, 'touchend', this.emptyCellClickCb.bind(this));
         if (this.gridster.$options.enableEmptyCellContextMenu && !this.emptyCellContextMenu &&
-            this.gridster.$options.emptyCellContextMenuCallback) {
+            this.gridster.options.emptyCellContextMenuCallback) {
             this.emptyCellContextMenu = this.gridster.renderer.listen(this.gridster.el, 'contextmenu', this.emptyCellContextMenuCb.bind(this));
@@ -33,3 +33,3 @@ }
         }
-        if (this.gridster.$options.enableEmptyCellDrop && !this.emptyCellDrop && this.gridster.$options.emptyCellDropCallback) {
+        if (this.gridster.$options.enableEmptyCellDrop && !this.emptyCellDrop && this.gridster.options.emptyCellDropCallback) {
             this.emptyCellDrop = this.gridster.renderer.listen(this.gridster.el, 'drop', this.emptyCellDragDrop.bind(this));
@@ -44,3 +44,3 @@ this.emptyCellMove = this.gridster.renderer.listen(this.gridster.el, 'dragover', this.emptyCellDragOver.bind(this));
         }
-        if (this.gridster.$options.enableEmptyCellDrag && !this.emptyCellDrag && this.gridster.$options.emptyCellDragCallback) {
+        if (this.gridster.$options.enableEmptyCellDrag && !this.emptyCellDrag && this.gridster.options.emptyCellDragCallback) {
             this.emptyCellDrag = this.gridster.renderer.listen(this.gridster.el, 'mousedown', this.emptyCellMouseDown.bind(this));
@@ -64,3 +64,5 @@ this.emptyCellDragTouch = this.gridster.renderer.listen(this.gridster.el, 'touchstart', this.emptyCellMouseDown.bind(this));
         }
-        this.gridster.$options.emptyCellClickCallback(e, item);
+        if (this.gridster.options.emptyCellClickCallback) {
+            this.gridster.options.emptyCellClickCallback(e, item);
+        }
         this.gridster.cdRef.markForCheck();
@@ -78,3 +80,5 @@ };
         }
-        this.gridster.$options.emptyCellContextMenuCallback(e, item);
+        if (this.gridster.options.emptyCellContextMenuCallback) {
+            this.gridster.options.emptyCellContextMenuCallback(e, item);
+        }
         this.gridster.cdRef.markForCheck();
@@ -87,3 +91,5 @@ };
         }
-        this.gridster.$options.emptyCellDropCallback(e, item);
+        if (this.gridster.options.emptyCellDropCallback) {
+            this.gridster.options.emptyCellDropCallback(e, item);
+        }
         this.gridster.cdRef.markForCheck();
@@ -138,3 +144,5 @@ };
         }
-        this.gridster.$options.emptyCellDragCallback(e, this.gridster.movingItem);
+        if (this.gridster.options.emptyCellDragCallback) {
+            this.gridster.options.emptyCellDragCallback(e, this.gridster.movingItem);
+        }
         setTimeout(function () {
@@ -141,0 +149,0 @@ this.initialItem = null;

dist/gridsterItem.component.d.ts

@@ -1,2 +0,2 @@
-import { ElementRef, EventEmitter, OnDestroy, OnInit, Renderer2 } from '@angular/core';
+import { ElementRef, OnDestroy, OnInit, Renderer2 } from '@angular/core';
 import { GridsterItem } from './gridsterItem.interface';
@@ -11,4 +11,2 @@ import { GridsterComponent } from './gridster.component';
     item: GridsterItem;
-    itemChange: EventEmitter<GridsterItem>;
-    itemResize: EventEmitter<GridsterItem>;
     $item: GridsterItemS;
@@ -29,2 +27,3 @@ el: any;
     notPlaced: boolean;
+    init: boolean;
     constructor(el: ElementRef, gridster: GridsterComponent, renderer: Renderer2);
@@ -31,0 +30,0 @@ ngOnInit(): void;

dist/gridsterItem.component.js

@@ -11,4 +11,2 @@ "use strict";
         this.renderer = renderer;
-        this.itemChange = new core_1.EventEmitter();
-        this.itemResize = new core_1.EventEmitter();
         this.el = el.nativeElement;
@@ -35,3 +33,2 @@ this.$item = {
             y: undefined,
-            initCallback: undefined,
             dragEnabled: undefined,
@@ -50,3 +47,2 @@ resizeEnabled: undefined,
         this.gridster.removeItem(this);
-        delete this.$item.initCallback;
         delete this.gridster;
@@ -97,6 +93,17 @@ this.drag.destroy();
         this.renderer.setStyle(this.el, 'margin', this.itemMargin + 'px');
+        if (!this.init && this.width > 0 && this.height > 0) {
+            this.init = true;
+            if (this.item.initCallback) {
+                this.item.initCallback(this.item, this);
+            }
+            if (this.gridster.options.itemInitCallback) {
+                this.gridster.options.itemInitCallback(this.item, this);
+            }
+            if (this.gridster.$options.scrollToNewItems) {
+                this.el.scrollIntoView(false);
+            }
+        }
         if (this.width !== this.itemWidth || this.height !== this.itemHeight) {
-            this.itemResize.emit(this.item);
-            if (this.gridster.$options.itemResizeCallback) {
-                this.gridster.$options.itemResizeCallback(this.item, this);
+            if (this.gridster.options.itemResizeCallback) {
+                this.gridster.options.itemResizeCallback(this.item, this);
             }
@@ -110,5 +117,4 @@ }
     GridsterItemComponent.prototype.itemChanged = function () {
-        this.itemChange.emit(this.item);
-        if (this.gridster.$options.itemChangeCallback) {
-            this.gridster.$options.itemChangeCallback(this.item, this);
+        if (this.gridster.options.itemChangeCallback) {
+            this.gridster.options.itemChangeCallback(this.item, this);
         }
@@ -158,4 +164,2 @@ };
         "item": [{ type: core_1.Input },],
-        "itemChange": [{ type: core_1.Output },],
-        "itemResize": [{ type: core_1.Output },],
     };
@@ -162,0 +166,0 @@ return GridsterItemComponent;

dist/gridsterItem.component.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":4,"metadata":{"GridsterItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"gridster-item","template":"<ng-content></ng-content> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.s || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-s\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.e || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-e\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.n || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-n\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.w || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-w\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.se || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-se\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.ne || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-ne\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.sw || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-sw\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.nw || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-nw\"></div>","styles":[":host {   box-sizing: border-box;   z-index: 1;   position: absolute;   overflow: hidden;   transition: .3s;   display: none;   background: white; }  :host(.gridster-item-moving) {   cursor: move; }  :host(.gridster-item-resizing), :host(.gridster-item-moving) {   transition: 0s;   z-index: 2;   box-shadow: 0 0 5px 5px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12); }  .gridster-item-resizable-handler {   position: absolute;   z-index: 2; }  .gridster-item-resizable-handler.handle-n {   cursor: n-resize;   height: 10px;   right: 0;   top: 0;   left: 0; }  .gridster-item-resizable-handler.handle-e {   cursor: e-resize;   width: 10px;   bottom: 0;   right: 0;   top: 0; }  .gridster-item-resizable-handler.handle-s {   cursor: s-resize;   height: 10px;   right: 0;   bottom: 0;   left: 0; }  .gridster-item-resizable-handler.handle-w {   cursor: w-resize;   width: 10px;   left: 0;   top: 0;   bottom: 0; }  .gridster-item-resizable-handler.handle-ne {   cursor: ne-resize;   width: 10px;   height: 10px;   right: 0;   top: 0; }  .gridster-item-resizable-handler.handle-nw {   cursor: nw-resize;   width: 10px;   height: 10px;   left: 0;   top: 0; }  .gridster-item-resizable-handler.handle-se {   cursor: se-resize;   width: 0;   height: 0;   right: 0;   bottom: 0;   border-style: solid;   border-width: 0 0 10px 10px;   border-color: transparent; }  .gridster-item-resizable-handler.handle-sw {   cursor: sw-resize;   width: 10px;   height: 10px;   left: 0;   bottom: 0; }  :host(:hover) .gridster-item-resizable-handler.handle-se {   border-color: transparent transparent #ccc }"]}]}],"members":{"item":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"itemChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":17,"character":3}}]}],"itemResize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":18,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Host","line":35,"character":31}}],null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":35,"character":18},{"__symbolic":"reference","module":"./gridster.component","name":"GridsterComponent","line":35,"character":48},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":35,"character":84}]}],"ngOnInit":[{"__symbolic":"method"}],"updateOptions":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"setSize":[{"__symbolic":"method"}],"itemChanged":[{"__symbolic":"method"}],"checkItemChanges":[{"__symbolic":"method"}],"canBeDragged":[{"__symbolic":"method"}],"canBeResized":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"GridsterItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"gridster-item","template":"<ng-content></ng-content> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.s || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-s\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.e || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-e\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.n || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-n\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.w || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-w\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.se || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-se\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.ne || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-ne\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.sw || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-sw\"></div> <div (mousedown)=\"resize.dragStartDelay($event)\" (touchstart)=\"resize.dragStartDelay($event)\"      [hidden]=\"!gridster.$options.resizable.handles.nw || !resize.resizeEnabled\"      class=\"gridster-item-resizable-handler handle-nw\"></div>","styles":[":host {   box-sizing: border-box;   z-index: 1;   position: absolute;   overflow: hidden;   transition: .3s;   display: none;   background: white; }  :host(.gridster-item-moving) {   cursor: move; }  :host(.gridster-item-resizing), :host(.gridster-item-moving) {   transition: 0s;   z-index: 2;   box-shadow: 0 0 5px 5px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12); }  .gridster-item-resizable-handler {   position: absolute;   z-index: 2; }  .gridster-item-resizable-handler.handle-n {   cursor: n-resize;   height: 10px;   right: 0;   top: 0;   left: 0; }  .gridster-item-resizable-handler.handle-e {   cursor: e-resize;   width: 10px;   bottom: 0;   right: 0;   top: 0; }  .gridster-item-resizable-handler.handle-s {   cursor: s-resize;   height: 10px;   right: 0;   bottom: 0;   left: 0; }  .gridster-item-resizable-handler.handle-w {   cursor: w-resize;   width: 10px;   left: 0;   top: 0;   bottom: 0; }  .gridster-item-resizable-handler.handle-ne {   cursor: ne-resize;   width: 10px;   height: 10px;   right: 0;   top: 0; }  .gridster-item-resizable-handler.handle-nw {   cursor: nw-resize;   width: 10px;   height: 10px;   left: 0;   top: 0; }  .gridster-item-resizable-handler.handle-se {   cursor: se-resize;   width: 0;   height: 0;   right: 0;   bottom: 0;   border-style: solid;   border-width: 0 0 10px 10px;   border-color: transparent; }  .gridster-item-resizable-handler.handle-sw {   cursor: sw-resize;   width: 10px;   height: 10px;   left: 0;   bottom: 0; }  :host(:hover) .gridster-item-resizable-handler.handle-se {   border-color: transparent transparent #ccc }"]}]}],"members":{"item":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Host","line":34,"character":31}}],null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":34,"character":18},{"__symbolic":"reference","module":"./gridster.component","name":"GridsterComponent","line":34,"character":48},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":34,"character":84}]}],"ngOnInit":[{"__symbolic":"method"}],"updateOptions":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"setSize":[{"__symbolic":"method"}],"itemChanged":[{"__symbolic":"method"}],"checkItemChanges":[{"__symbolic":"method"}],"canBeDragged":[{"__symbolic":"method"}],"canBeResized":[{"__symbolic":"method"}]}}}}]

dist/gridsterItemComponent.interface.d.ts

 import { GridsterItem } from './gridsterItem.interface';
 import { GridsterDraggable } from './gridsterDraggable.service';
-import { EventEmitter, Renderer2 } from '@angular/core';
+import { Renderer2 } from '@angular/core';
 import { GridsterItemS } from './gridsterItemS.interface';
@@ -9,4 +9,2 @@ import { GridsterResizable } from './gridsterResizable.service';
     item: GridsterItem;
-    itemChange: EventEmitter<GridsterItem>;
-    itemResize: EventEmitter<GridsterItem>;
     $item: GridsterItemS;
@@ -13,0 +11,0 @@ itemTop: number;

dist/gridsterResizable.service.js

@@ -33,4 +33,4 @@ "use strict";
         }
-        if (this.gridster.$options.resizable.start) {
-            this.gridster.$options.resizable.start(this.gridsterItem.item, this.gridsterItem, e);
+        if (this.gridster.options.resizable && this.gridster.options.resizable.start) {
+            this.gridster.options.resizable.start(this.gridsterItem.item, this.gridsterItem, e);
         }
@@ -135,4 +135,4 @@ e.stopPropagation();
         this.gridster.gridLines.updateGrid();
-        if (this.gridster.$options.resizable.stop) {
-            Promise.resolve(this.gridster.$options.resizable.stop(this.gridsterItem.item, this.gridsterItem, e))
+        if (this.gridster.options.resizable && this.gridster.options.resizable.stop) {
+            Promise.resolve(this.gridster.options.resizable.stop(this.gridsterItem.item, this.gridsterItem, e))
                 .then(this.makeResize.bind(this), this.cancelResize.bind(this));
@@ -139,0 +139,0 @@ }

package.json

 {
   "name": "angular-gridster2",
-  "version": "4.2.0",
+  "version": "4.3.0",
   "license": "MIT",
@@ -49,24 +49,24 @@ "main": "dist/index.js",
   "devDependencies": {
-    "@angular/animations": "5.1.0",
-    "@angular/cdk": "5.0.0",
-    "@angular/cli": "1.6.0",
-    "@angular/common": "5.1.0",
-    "@angular/compiler": "5.1.0",
-    "@angular/compiler-cli": "5.1.0",
-    "@angular/core": "5.1.0",
-    "@angular/forms": "5.1.0",
-    "@angular/http": "5.1.0",
-    "@angular/language-service": "5.1.0",
-    "@angular/material": "5.0.0",
-    "@angular/platform-browser": "5.1.0",
-    "@angular/platform-browser-dynamic": "5.1.0",
-    "@angular/platform-server": "5.1.0",
-    "@angular/router": "5.1.0",
+    "@angular/animations": "5.1.1",
+    "@angular/cdk": "5.0.1",
+    "@angular/cli": "1.6.1",
+    "@angular/common": "5.1.1",
+    "@angular/compiler": "5.1.1",
+    "@angular/compiler-cli": "5.1.1",
+    "@angular/core": "5.1.1",
+    "@angular/forms": "5.1.1",
+    "@angular/http": "5.1.1",
+    "@angular/language-service": "5.1.1",
+    "@angular/material": "5.0.1",
+    "@angular/platform-browser": "5.1.1",
+    "@angular/platform-browser-dynamic": "5.1.1",
+    "@angular/platform-server": "5.1.1",
+    "@angular/router": "5.1.1",
     "@types/jasmine": "2.8.2",
-    "@types/node": "8.0.57",
-    "codelyzer": "4.0.1",
-    "core-js": "2.5.2",
+    "@types/node": "8.5.1",
+    "codelyzer": "4.0.2",
+    "core-js": "2.5.3",
     "gulp": "3.9.1",
     "gulp-clean": "0.3.2",
-    "gulp-inline-ng2-template": "4.0.0",
+    "gulp-inline-ng2-template": "4.1.0",
     "hammerjs": "2.0.8",
@@ -81,7 +81,7 @@ "jasmine-core": "2.8.0",
     "karma-jasmine-html-reporter": "0.2.2",
-    "protractor": "5.2.1",
+    "protractor": "5.2.2",
     "rxjs": "5.5.5",
     "systemjs": "0.20.19",
     "ts-helpers": "1.1.2",
-    "ts-node": "3.3.0",
+    "ts-node": "4.0.2",
     "tslib": "1.8.1",
@@ -88,0 +88,0 @@ "tslint": "5.8.0",

README.md

@@ -12,4 +12,4 @@ angular-gridster2
 ### Angular 5.x library is [master branch](https://github.com/tiberiuzuld/angular-gridster2/tree/master) 
-### Angular 4.x library is [4.x branch](https://github.com/tiberiuzuld/angular-gridster2/tree/4.x) 
-### Angular 2.x library is [2.4.x branch](https://github.com/tiberiuzuld/angular-gridster2/tree/2.4.x)  
+### Angular 4.x library is [4.x branch](https://github.com/tiberiuzuld/angular-gridster2/tree/4.x)
+### Angular 2.x library is [2.4.x branch](https://github.com/tiberiuzuld/angular-gridster2/tree/2.4.x) (no longer maintained) 
 ### AngularJS >=1.5.x library is [1.x branch](https://github.com/tiberiuzuld/angular-gridster2/tree/1.x)
@@ -123,3 +123,3 @@
   // Arguments: gridsterItem, gridsterItemComponent
-  itemInitCallback: undefined,  // callback to call for each item when is initialized.
+  itemInitCallback: undefined,  // callback to call for each item when is initialized and has size > 0.
   // Arguments: gridsterItem, gridsterItemComponent
@@ -172,5 +172,6 @@ itemRemovedCallback: undefined,  // callback to call for each item when is removed.
   pushResizeItems: false, // on resize of item will shrink adjacent items
-  displayGrid: 'onDrag&Resize', // display background grid of rows and columns
+  displayGrid: 'onDrag&Resize', // display background grid of rows and columns. Options: 'always' | 'onDrag&Resize' | 'none'
   disableWindowResize: false, // disable the window on resize listener. This will stop grid to recalculate on window resize.
-  disableWarnings: false // disable console log warnings about misplacements grid items
+  disableWarnings: false, // disable console log warnings about misplacement of grid items
+  scrollToNewItems: false, // scroll to new items placed in a scrollable view
 };
@@ -207,3 +208,3 @@ ```
   cols?: number; // number of columns if missing will use grid option defaultItemCols
-  initCallback?: Function; // initialization callback. Argument: GridsterItem, GridsterItemComponent
+  initCallback?: Function; // initialization callback and has size > 0. Argument: GridsterItem, GridsterItemComponent
   dragEnabled?: boolean; // override grid option draggable.enabled
@@ -210,0 +211,0 @@ resizeEnabled?: boolean; // override grid option resizable.enabled

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

277

increased by0.36%

Worsened metrics

Total package byte prevSize

178992

decreased by-0.39%

Lines of code

3185

decreased by-0.16%

No dependency changes