drag-enabled - npm Package Compare versions

Comparing version 0.1.2 to 0.2.0

bundles/drag-enabled.umd.js

@@ -149,4 +149,2 @@ (function (global, factory) {
         var dragEvent = this.dataTransfer.getData("source");
-        dragEvent.clientX = event.clientX;
-        dragEvent.clientY = event.clientY;
         this.onDragEnd.emit(dragEvent);
@@ -181,2 +179,73 @@ this.renderer.setElementClass(this.el.nativeElement, "drag-over", false);
 };
+var DragInDocumentDirective = /** @class */ (function () {
+    function DragInDocumentDirective(dataTransfer, renderer, el) {
+        this.dataTransfer = dataTransfer;
+        this.renderer = renderer;
+        this.el = el;
+        this.dragEffect = "move";
+        this.dragEnabled = function (event) { return true; };
+        this.onDragStart = new core.EventEmitter();
+        this.onDragEnd = new core.EventEmitter();
+        this.onDrag = new core.EventEmitter();
+    }
+    DragInDocumentDirective.prototype.dragStart = function (event) {
+        event.stopPropagation();
+        var rect = this.el.nativeElement.getBoundingClientRect();
+        var dragEvent = {
+            medium: this.medium,
+            node: this.el.nativeElement,
+            clientX: event.clientX,
+            clientY: event.clientY,
+            offset: {
+                x: event.clientX - rect.left,
+                y: event.clientY - rect.top
+            }
+        };
+        if (this.dragEnabled(dragEvent)) {
+            event.dataTransfer.effectAllowed = this.dragEffect;
+            event.dataTransfer.setData("makeItTick", "true");
+            this.dataTransfer.setData("source", dragEvent);
+            this.onDragStart.emit(dragEvent);
+        }
+    };
+    DragInDocumentDirective.prototype.drag = function (event) {
+        var dragEvent = this.dataTransfer.getData("source");
+        dragEvent.clientX = event.clientX;
+        dragEvent.clientY = event.clientY;
+        if (this.dragEnabled(dragEvent)) {
+            this.onDrag.emit(dragEvent);
+        }
+    };
+    DragInDocumentDirective.prototype.dragEnd = function (event) {
+        event.stopPropagation();
+        var dragEvent = this.dataTransfer.getData("source");
+        this.onDragEnd.emit(dragEvent);
+        this.renderer.setElementClass(this.el.nativeElement, "drag-over", false);
+    };
+    return DragInDocumentDirective;
+}());
+DragInDocumentDirective.decorators = [
+    { type: core.Directive, args: [{
+                selector: '[dragInDocument]',
+                host: {
+                    '[draggable]': 'true'
+                }
+            },] },
+];
+DragInDocumentDirective.ctorParameters = function () { return [
+    { type: DataTransfer, },
+    { type: core.Renderer, },
+    { type: core.ElementRef, },
+]; };
+DragInDocumentDirective.propDecorators = {
+    "medium": [{ type: core.Input, args: ["medium",] },],
+    "dragEffect": [{ type: core.Input, args: ["dragEffect",] },],
+    "dragEnabled": [{ type: core.Input, args: ["dragEnabled",] },],
+    "onDragStart": [{ type: core.Output },],
+    "onDragEnd": [{ type: core.Output },],
+    "onDrag": [{ type: core.Output },],
+    "dragStart": [{ type: core.HostListener, args: ['dragstart', ['$event'],] },],
+    "drag": [{ type: core.HostListener, args: ['document:drag', ['$event'],] },],
+    "dragEnd": [{ type: core.HostListener, args: ['document:dragend', ['$event'],] },],
+};
 var DragDropModule = /** @class */ (function () {
@@ -194,2 +263,3 @@ function DragDropModule() {
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective
@@ -199,2 +269,3 @@ ],
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective
@@ -205,2 +276,3 @@ ],
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective,
@@ -216,2 +288,3 @@ DataTransfer
 exports.DragDirective = DragDirective;
+exports.DragInDocumentDirective = DragInDocumentDirective;
 exports.DragDropModule = DragDropModule;
@@ -218,0 +291,0 @@ exports.ɵa = DataTransfer;

bundles/drag-enabled.umd.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common"],t):t(e["drag-enabled"]={},e.ng.core,e.ng.common)}(this,function(e,n,t){"use strict";var r=function(){function e(){this.data={}}return e.prototype.setData=function(e,t){this.data[e]=t},e.prototype.getData=function(e){return this.data[e]},e}();r.decorators=[{type:n.Injectable}],r.ctorParameters=function(){return[]};var a=function(){function e(e,t,r){this.dataTransfer=e,this.renderer=t,this.el=r,this.dropEffect="move",this.dropEnabled=function(e){return!0},this.onDragEnter=new n.EventEmitter,this.onDragLeave=new n.EventEmitter,this.onDrop=new n.EventEmitter,this.onDragOver=new n.EventEmitter}return e.prototype.createDropEvent=function(e){return{source:this.dataTransfer.getData("source"),destination:{medium:this.medium,node:this.el.nativeElement,clientX:e.clientX,clientY:e.clientY}}},e.prototype.drop=function(e){e.preventDefault();var t=this.createDropEvent(e);this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1),this.dropEnabled(t)&&this.onDrop.emit(t)},e.prototype.dragEnter=function(e){e.preventDefault();var t=this.createDropEvent(e);this.dropEnabled(t)?(e.dataTransfer.dropEffect=this.dropEffect,this.renderer.setElementClass(this.el.nativeElement,"drag-over",!0),this.onDragEnter.emit(t)):this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1)},e.prototype.dragLeave=function(e){e.preventDefault(),this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1),this.onDragLeave.emit(e)},e.prototype.dragOver=function(e){var t=this.createDropEvent(e);this.dropEnabled(t)?(e.preventDefault(),this.renderer.setElementClass(this.el.nativeElement,"drag-over",!0),this.onDragOver.emit(t)):this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1)},e}();a.decorators=[{type:n.Directive,args:[{selector:"[dropEnabled]"}]}],a.ctorParameters=function(){return[{type:r},{type:n.Renderer},{type:n.ElementRef}]},a.propDecorators={medium:[{type:n.Input,args:["medium"]}],dropEffect:[{type:n.Input}],dropEnabled:[{type:n.Input,args:["dropEnabled"]}],onDragEnter:[{type:n.Output}],onDragLeave:[{type:n.Output}],onDrop:[{type:n.Output}],onDragOver:[{type:n.Output}],drop:[{type:n.HostListener,args:["drop",["$event"]]}],dragEnter:[{type:n.HostListener,args:["dragenter",["$event"]]}],dragLeave:[{type:n.HostListener,args:["dragleave",["$event"]]}],dragOver:[{type:n.HostListener,args:["dragover",["$event"]]}]};var o=function(){function e(e,t,r){this.dataTransfer=e,this.renderer=t,this.el=r,this.dragEffect="move",this.dragEnabled=function(e){return!0},this.onDragStart=new n.EventEmitter,this.onDragEnd=new n.EventEmitter,this.onDrag=new n.EventEmitter}return e.prototype.dragStart=function(e){e.stopPropagation();var t=this.el.nativeElement.getBoundingClientRect(),r={medium:this.medium,node:this.el.nativeElement,clientX:e.clientX,clientY:e.clientY,offset:{x:e.clientX-t.left,y:e.clientY-t.top}};this.dragEnabled(r)&&(e.dataTransfer.effectAllowed=this.dragEffect,e.dataTransfer.setData("makeItTick","true"),this.dataTransfer.setData("source",r),this.onDragStart.emit(r))},e.prototype.drag=function(e){var t=this.dataTransfer.getData("source");t.clientX=e.clientX,t.clientY=e.clientY,this.dragEnabled(t)&&this.onDrag.emit(t)},e.prototype.dragEnd=function(e){e.stopPropagation();var t=this.dataTransfer.getData("source");t.clientX=e.clientX,t.clientY=e.clientY,this.onDragEnd.emit(t),this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1)},e}();o.decorators=[{type:n.Directive,args:[{selector:"[dragEnabled]",host:{"[draggable]":"true"}}]}],o.ctorParameters=function(){return[{type:r},{type:n.Renderer},{type:n.ElementRef}]},o.propDecorators={medium:[{type:n.Input,args:["medium"]}],dragEffect:[{type:n.Input,args:["dragEffect"]}],dragEnabled:[{type:n.Input,args:["dragEnabled"]}],onDragStart:[{type:n.Output}],onDragEnd:[{type:n.Output}],onDrag:[{type:n.Output}],dragStart:[{type:n.HostListener,args:["dragstart",["$event"]]}],drag:[{type:n.HostListener,args:["drag",["$event"]]}],dragEnd:[{type:n.HostListener,args:["dragend",["$event"]]}]};var i=function(){};i.decorators=[{type:n.NgModule,args:[{imports:[t.CommonModule],declarations:[o,a],exports:[o,a],entryComponents:[],providers:[o,a,r],schemas:[n.CUSTOM_ELEMENTS_SCHEMA]}]}],i.ctorParameters=function(){return[]},e.DropDirective=a,e.DragDirective=o,e.DragDropModule=i,e.ɵa=r,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common"],t):t(e["drag-enabled"]={},e.ng.core,e.ng.common)}(this,function(e,n,t){"use strict";var r=function(){function e(){this.data={}}return e.prototype.setData=function(e,t){this.data[e]=t},e.prototype.getData=function(e){return this.data[e]},e}();r.decorators=[{type:n.Injectable}],r.ctorParameters=function(){return[]};var a=function(){function e(e,t,r){this.dataTransfer=e,this.renderer=t,this.el=r,this.dropEffect="move",this.dropEnabled=function(e){return!0},this.onDragEnter=new n.EventEmitter,this.onDragLeave=new n.EventEmitter,this.onDrop=new n.EventEmitter,this.onDragOver=new n.EventEmitter}return e.prototype.createDropEvent=function(e){return{source:this.dataTransfer.getData("source"),destination:{medium:this.medium,node:this.el.nativeElement,clientX:e.clientX,clientY:e.clientY}}},e.prototype.drop=function(e){e.preventDefault();var t=this.createDropEvent(e);this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1),this.dropEnabled(t)&&this.onDrop.emit(t)},e.prototype.dragEnter=function(e){e.preventDefault();var t=this.createDropEvent(e);this.dropEnabled(t)?(e.dataTransfer.dropEffect=this.dropEffect,this.renderer.setElementClass(this.el.nativeElement,"drag-over",!0),this.onDragEnter.emit(t)):this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1)},e.prototype.dragLeave=function(e){e.preventDefault(),this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1),this.onDragLeave.emit(e)},e.prototype.dragOver=function(e){var t=this.createDropEvent(e);this.dropEnabled(t)?(e.preventDefault(),this.renderer.setElementClass(this.el.nativeElement,"drag-over",!0),this.onDragOver.emit(t)):this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1)},e}();a.decorators=[{type:n.Directive,args:[{selector:"[dropEnabled]"}]}],a.ctorParameters=function(){return[{type:r},{type:n.Renderer},{type:n.ElementRef}]},a.propDecorators={medium:[{type:n.Input,args:["medium"]}],dropEffect:[{type:n.Input}],dropEnabled:[{type:n.Input,args:["dropEnabled"]}],onDragEnter:[{type:n.Output}],onDragLeave:[{type:n.Output}],onDrop:[{type:n.Output}],onDragOver:[{type:n.Output}],drop:[{type:n.HostListener,args:["drop",["$event"]]}],dragEnter:[{type:n.HostListener,args:["dragenter",["$event"]]}],dragLeave:[{type:n.HostListener,args:["dragleave",["$event"]]}],dragOver:[{type:n.HostListener,args:["dragover",["$event"]]}]};var i=function(){function e(e,t,r){this.dataTransfer=e,this.renderer=t,this.el=r,this.dragEffect="move",this.dragEnabled=function(e){return!0},this.onDragStart=new n.EventEmitter,this.onDragEnd=new n.EventEmitter,this.onDrag=new n.EventEmitter}return e.prototype.dragStart=function(e){e.stopPropagation();var t=this.el.nativeElement.getBoundingClientRect(),r={medium:this.medium,node:this.el.nativeElement,clientX:e.clientX,clientY:e.clientY,offset:{x:e.clientX-t.left,y:e.clientY-t.top}};this.dragEnabled(r)&&(e.dataTransfer.effectAllowed=this.dragEffect,e.dataTransfer.setData("makeItTick","true"),this.dataTransfer.setData("source",r),this.onDragStart.emit(r))},e.prototype.drag=function(e){var t=this.dataTransfer.getData("source");t.clientX=e.clientX,t.clientY=e.clientY,this.dragEnabled(t)&&this.onDrag.emit(t)},e.prototype.dragEnd=function(e){e.stopPropagation();var t=this.dataTransfer.getData("source");this.onDragEnd.emit(t),this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1)},e}();i.decorators=[{type:n.Directive,args:[{selector:"[dragEnabled]",host:{"[draggable]":"true"}}]}],i.ctorParameters=function(){return[{type:r},{type:n.Renderer},{type:n.ElementRef}]},i.propDecorators={medium:[{type:n.Input,args:["medium"]}],dragEffect:[{type:n.Input,args:["dragEffect"]}],dragEnabled:[{type:n.Input,args:["dragEnabled"]}],onDragStart:[{type:n.Output}],onDragEnd:[{type:n.Output}],onDrag:[{type:n.Output}],dragStart:[{type:n.HostListener,args:["dragstart",["$event"]]}],drag:[{type:n.HostListener,args:["drag",["$event"]]}],dragEnd:[{type:n.HostListener,args:["dragend",["$event"]]}]};var o=function(){function e(e,t,r){this.dataTransfer=e,this.renderer=t,this.el=r,this.dragEffect="move",this.dragEnabled=function(e){return!0},this.onDragStart=new n.EventEmitter,this.onDragEnd=new n.EventEmitter,this.onDrag=new n.EventEmitter}return e.prototype.dragStart=function(e){e.stopPropagation();var t=this.el.nativeElement.getBoundingClientRect(),r={medium:this.medium,node:this.el.nativeElement,clientX:e.clientX,clientY:e.clientY,offset:{x:e.clientX-t.left,y:e.clientY-t.top}};this.dragEnabled(r)&&(e.dataTransfer.effectAllowed=this.dragEffect,e.dataTransfer.setData("makeItTick","true"),this.dataTransfer.setData("source",r),this.onDragStart.emit(r))},e.prototype.drag=function(e){var t=this.dataTransfer.getData("source");t.clientX=e.clientX,t.clientY=e.clientY,this.dragEnabled(t)&&this.onDrag.emit(t)},e.prototype.dragEnd=function(e){e.stopPropagation();var t=this.dataTransfer.getData("source");this.onDragEnd.emit(t),this.renderer.setElementClass(this.el.nativeElement,"drag-over",!1)},e}();o.decorators=[{type:n.Directive,args:[{selector:"[dragInDocument]",host:{"[draggable]":"true"}}]}],o.ctorParameters=function(){return[{type:r},{type:n.Renderer},{type:n.ElementRef}]},o.propDecorators={medium:[{type:n.Input,args:["medium"]}],dragEffect:[{type:n.Input,args:["dragEffect"]}],dragEnabled:[{type:n.Input,args:["dragEnabled"]}],onDragStart:[{type:n.Output}],onDragEnd:[{type:n.Output}],onDrag:[{type:n.Output}],dragStart:[{type:n.HostListener,args:["dragstart",["$event"]]}],drag:[{type:n.HostListener,args:["document:drag",["$event"]]}],dragEnd:[{type:n.HostListener,args:["document:dragend",["$event"]]}]};var s=function(){};s.decorators=[{type:n.NgModule,args:[{imports:[t.CommonModule],declarations:[i,o,a],exports:[i,o,a],entryComponents:[],providers:[i,o,a,r],schemas:[n.CUSTOM_ELEMENTS_SCHEMA]}]}],s.ctorParameters=function(){return[]},e.DropDirective=a,e.DragDirective=i,e.DragInDocumentDirective=o,e.DragDropModule=s,e.ɵa=r,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=drag-enabled.umd.min.js.map

drag-enabled.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"DropDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":31,"character":1},"arguments":[{"selector":"[dropEnabled]"}]}],"members":{"medium":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":5},"arguments":["medium"]}]}],"dropEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":5}}]}],"dropEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":5},"arguments":["dropEnabled"]}]}],"onDragEnter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":5}}]}],"onDragLeave":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":48,"character":5}}]}],"onDrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":51,"character":5}}]}],"onDragOver":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":54,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer","line":59,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":60,"character":20}]}],"createDropEvent":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":75,"character":5},"arguments":["drop",["$event"]]}]}],"dragEnter":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":87,"character":5},"arguments":["dragenter",["$event"]]}]}],"dragLeave":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":102,"character":5},"arguments":["dragleave",["$event"]]}]}],"dragOver":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":110,"character":5},"arguments":["dragover",["$event"]]}]}]}},"DropEvent":{"__symbolic":"interface"},"DragDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":22,"character":1},"arguments":[{"selector":"[dragEnabled]","host":{"[draggable]":"true"}}]}],"members":{"medium":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":5},"arguments":["medium"]}]}],"dragEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":5},"arguments":["dragEffect"]}]}],"dragEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":5},"arguments":["dragEnabled"]}]}],"onDragStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":39,"character":5}}]}],"onDragEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":42,"character":5}}]}],"onDrag":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer","line":52,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":53,"character":20}]}],"dragStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":57,"character":5},"arguments":["dragstart",["$event"]]}]}],"drag":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":81,"character":5},"arguments":["drag",["$event"]]}]}],"dragEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":93,"character":5},"arguments":["dragend",["$event"]]}]}]}},"DragEvent":{"__symbolic":"interface"},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":7,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":4}],"declarations":[{"__symbolic":"reference","name":"DragDirective"},{"__symbolic":"reference","name":"DropDirective"}],"exports":[{"__symbolic":"reference","name":"DragDirective"},{"__symbolic":"reference","name":"DropDirective"}],"entryComponents":[],"providers":[{"__symbolic":"reference","name":"DragDirective"},{"__symbolic":"reference","name":"DropDirective"},{"__symbolic":"reference","name":"ɵa"}],"schemas":[{"__symbolic":"reference","module":"@angular/core","name":"CUSTOM_ELEMENTS_SCHEMA","line":26,"character":12}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"setData":[{"__symbolic":"method"}],"getData":[{"__symbolic":"method"}]}}},"origins":{"DropDirective":"./src/app/drag-enabled/drop.directive","DropEvent":"./src/app/drag-enabled/drop.directive","DragDirective":"./src/app/drag-enabled/drag.directive","DragEvent":"./src/app/drag-enabled/drag.directive","DragDropModule":"./src/app/drag-enabled/dragdrop.module","ɵa":"./src/app/drag-enabled/datatransfer"},"importAs":"drag-enabled"}
+{"__symbolic":"module","version":4,"metadata":{"DragEvent":{"__symbolic":"interface"},"DropEvent":{"__symbolic":"interface"},"DropDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"[dropEnabled]"}]}],"members":{"medium":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":5},"arguments":["medium"]}]}],"dropEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":5}}]}],"dropEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5},"arguments":["dropEnabled"]}]}],"onDragEnter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":5}}]}],"onDragLeave":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":5}}]}],"onDrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":34,"character":5}}]}],"onDragOver":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":37,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer","line":42,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":43,"character":20}]}],"createDropEvent":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":58,"character":5},"arguments":["drop",["$event"]]}]}],"dragEnter":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":70,"character":5},"arguments":["dragenter",["$event"]]}]}],"dragLeave":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":85,"character":5},"arguments":["dragleave",["$event"]]}]}],"dragOver":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":93,"character":5},"arguments":["dragover",["$event"]]}]}]}},"DragDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":12,"character":1},"arguments":[{"selector":"[dragEnabled]","host":{"[draggable]":"true"}}]}],"members":{"medium":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":5},"arguments":["medium"]}]}],"dragEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":5},"arguments":["dragEffect"]}]}],"dragEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":5},"arguments":["dragEnabled"]}]}],"onDragStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":29,"character":5}}]}],"onDragEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":32,"character":5}}]}],"onDrag":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":35,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer","line":42,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":43,"character":20}]}],"dragStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":47,"character":5},"arguments":["dragstart",["$event"]]}]}],"drag":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":71,"character":5},"arguments":["drag",["$event"]]}]}],"dragEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":83,"character":5},"arguments":["dragend",["$event"]]}]}]}},"DragInDocumentDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":27,"character":1},"arguments":[{"selector":"[dragInDocument]","host":{"[draggable]":"true"}}]}],"members":{"medium":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":5},"arguments":["medium"]}]}],"dragEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":5},"arguments":["dragEffect"]}]}],"dragEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":5},"arguments":["dragEnabled"]}]}],"onDragStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":44,"character":5}}]}],"onDragEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":5}}]}],"onDrag":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":50,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer","line":57,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":58,"character":20}]}],"dragStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":62,"character":5},"arguments":["dragstart",["$event"]]}]}],"drag":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":86,"character":5},"arguments":["document:drag",["$event"]]}]}],"dragEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":98,"character":5},"arguments":["document:dragend",["$event"]]}]}]}},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":4}],"declarations":[{"__symbolic":"reference","name":"DragDirective"},{"__symbolic":"reference","name":"DragInDocumentDirective"},{"__symbolic":"reference","name":"DropDirective"}],"exports":[{"__symbolic":"reference","name":"DragDirective"},{"__symbolic":"reference","name":"DragInDocumentDirective"},{"__symbolic":"reference","name":"DropDirective"}],"entryComponents":[],"providers":[{"__symbolic":"reference","name":"DragDirective"},{"__symbolic":"reference","name":"DragInDocumentDirective"},{"__symbolic":"reference","name":"DropDirective"},{"__symbolic":"reference","name":"ɵa"}],"schemas":[{"__symbolic":"reference","module":"@angular/core","name":"CUSTOM_ELEMENTS_SCHEMA","line":30,"character":12}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"setData":[{"__symbolic":"method"}],"getData":[{"__symbolic":"method"}]}}},"origins":{"DragEvent":"./src/app/drag-enabled/drag-drop.interfaces","DropEvent":"./src/app/drag-enabled/drag-drop.interfaces","DropDirective":"./src/app/drag-enabled/drop.directive","DragDirective":"./src/app/drag-enabled/drag.directive","DragInDocumentDirective":"./src/app/drag-enabled/drag-only.directive","DragDropModule":"./src/app/drag-enabled/dragdrop.module","ɵa":"./src/app/drag-enabled/datatransfer"},"importAs":"drag-enabled"}

esm2015/drag-enabled.js

@@ -38,6 +38,2 @@ import { Injectable, Directive, ElementRef, HostListener, Input, Output, Renderer, EventEmitter, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
  */
-/**
- * @record
- */
-
 class DropDirective {
@@ -157,6 +153,2 @@ /**
  */
-/**
- * @record
- */
-
 class DragDirective {
@@ -221,4 +213,2 @@ /**
         const /** @type {?} */ dragEvent = this.dataTransfer.getData("source");
-        dragEvent.clientX = event.clientX;
-        dragEvent.clientY = event.clientY;
         this.onDragEnd.emit(dragEvent);
@@ -258,2 +248,99 @@ this.renderer.setElementClass(this.el.nativeElement, "drag-over", false);
  */
+/**
+ * @record
+ */
+
+class DragInDocumentDirective {
+    /**
+     * @param {?} dataTransfer
+     * @param {?} renderer
+     * @param {?} el
+     */
+    constructor(dataTransfer, renderer, el) {
+        this.dataTransfer = dataTransfer;
+        this.renderer = renderer;
+        this.el = el;
+        this.dragEffect = "move";
+        this.dragEnabled = (event) => true;
+        this.onDragStart = new EventEmitter();
+        this.onDragEnd = new EventEmitter();
+        this.onDrag = new EventEmitter();
+    }
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    dragStart(event) {
+        event.stopPropagation();
+        const /** @type {?} */ rect = this.el.nativeElement.getBoundingClientRect();
+        const /** @type {?} */ dragEvent = {
+            medium: this.medium,
+            node: this.el.nativeElement,
+            clientX: event.clientX,
+            clientY: event.clientY,
+            offset: {
+                x: event.clientX - rect.left,
+                y: event.clientY - rect.top
+            }
+        };
+        if (this.dragEnabled(dragEvent)) {
+            event.dataTransfer.effectAllowed = this.dragEffect;
+            event.dataTransfer.setData("makeItTick", "true"); // this is needed just to make drag/drop event trigger.
+            this.dataTransfer.setData("source", dragEvent);
+            this.onDragStart.emit(dragEvent);
+        }
+    }
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    drag(event) {
+        const /** @type {?} */ dragEvent = this.dataTransfer.getData("source");
+        dragEvent.clientX = event.clientX;
+        dragEvent.clientY = event.clientY;
+        if (this.dragEnabled(dragEvent)) {
+            this.onDrag.emit(dragEvent);
+        }
+    }
+    /**
+     * @param {?} event
+     * @return {?}
+     */
+    dragEnd(event) {
+        event.stopPropagation();
+        const /** @type {?} */ dragEvent = this.dataTransfer.getData("source");
+        this.onDragEnd.emit(dragEvent);
+        this.renderer.setElementClass(this.el.nativeElement, "drag-over", false);
+    }
+}
+DragInDocumentDirective.decorators = [
+    { type: Directive, args: [{
+                selector: '[dragInDocument]',
+                host: {
+                    '[draggable]': 'true'
+                }
+            },] },
+];
+/** @nocollapse */
+DragInDocumentDirective.ctorParameters = () => [
+    { type: DataTransfer, },
+    { type: Renderer, },
+    { type: ElementRef, },
+];
+DragInDocumentDirective.propDecorators = {
+    "medium": [{ type: Input, args: ["medium",] },],
+    "dragEffect": [{ type: Input, args: ["dragEffect",] },],
+    "dragEnabled": [{ type: Input, args: ["dragEnabled",] },],
+    "onDragStart": [{ type: Output },],
+    "onDragEnd": [{ type: Output },],
+    "onDrag": [{ type: Output },],
+    "dragStart": [{ type: HostListener, args: ['dragstart', ['$event'],] },],
+    "drag": [{ type: HostListener, args: ['document:drag', ['$event'],] },],
+    "dragEnd": [{ type: HostListener, args: ['document:dragend', ['$event'],] },],
+};
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes} checked by tsc
+ */
 class DragDropModule {
@@ -268,2 +355,3 @@ }
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective
@@ -273,2 +361,3 @@ ],
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective
@@ -279,2 +368,3 @@ ],
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective,
@@ -302,3 +392,3 @@ DataTransfer
 
-export { DropDirective, DragDirective, DragDropModule, DataTransfer as ɵa };
+export { DropDirective, DragDirective, DragInDocumentDirective, DragDropModule, DataTransfer as ɵa };
 //# sourceMappingURL=drag-enabled.js.map

esm5/drag-enabled.js

@@ -146,4 +146,2 @@ import { Injectable, Directive, ElementRef, HostListener, Input, Output, Renderer, EventEmitter, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
         var dragEvent = this.dataTransfer.getData("source");
-        dragEvent.clientX = event.clientX;
-        dragEvent.clientY = event.clientY;
         this.onDragEnd.emit(dragEvent);
@@ -178,2 +176,73 @@ this.renderer.setElementClass(this.el.nativeElement, "drag-over", false);
 };
+var DragInDocumentDirective = /** @class */ (function () {
+    function DragInDocumentDirective(dataTransfer, renderer, el) {
+        this.dataTransfer = dataTransfer;
+        this.renderer = renderer;
+        this.el = el;
+        this.dragEffect = "move";
+        this.dragEnabled = function (event) { return true; };
+        this.onDragStart = new EventEmitter();
+        this.onDragEnd = new EventEmitter();
+        this.onDrag = new EventEmitter();
+    }
+    DragInDocumentDirective.prototype.dragStart = function (event) {
+        event.stopPropagation();
+        var rect = this.el.nativeElement.getBoundingClientRect();
+        var dragEvent = {
+            medium: this.medium,
+            node: this.el.nativeElement,
+            clientX: event.clientX,
+            clientY: event.clientY,
+            offset: {
+                x: event.clientX - rect.left,
+                y: event.clientY - rect.top
+            }
+        };
+        if (this.dragEnabled(dragEvent)) {
+            event.dataTransfer.effectAllowed = this.dragEffect;
+            event.dataTransfer.setData("makeItTick", "true");
+            this.dataTransfer.setData("source", dragEvent);
+            this.onDragStart.emit(dragEvent);
+        }
+    };
+    DragInDocumentDirective.prototype.drag = function (event) {
+        var dragEvent = this.dataTransfer.getData("source");
+        dragEvent.clientX = event.clientX;
+        dragEvent.clientY = event.clientY;
+        if (this.dragEnabled(dragEvent)) {
+            this.onDrag.emit(dragEvent);
+        }
+    };
+    DragInDocumentDirective.prototype.dragEnd = function (event) {
+        event.stopPropagation();
+        var dragEvent = this.dataTransfer.getData("source");
+        this.onDragEnd.emit(dragEvent);
+        this.renderer.setElementClass(this.el.nativeElement, "drag-over", false);
+    };
+    return DragInDocumentDirective;
+}());
+DragInDocumentDirective.decorators = [
+    { type: Directive, args: [{
+                selector: '[dragInDocument]',
+                host: {
+                    '[draggable]': 'true'
+                }
+            },] },
+];
+DragInDocumentDirective.ctorParameters = function () { return [
+    { type: DataTransfer, },
+    { type: Renderer, },
+    { type: ElementRef, },
+]; };
+DragInDocumentDirective.propDecorators = {
+    "medium": [{ type: Input, args: ["medium",] },],
+    "dragEffect": [{ type: Input, args: ["dragEffect",] },],
+    "dragEnabled": [{ type: Input, args: ["dragEnabled",] },],
+    "onDragStart": [{ type: Output },],
+    "onDragEnd": [{ type: Output },],
+    "onDrag": [{ type: Output },],
+    "dragStart": [{ type: HostListener, args: ['dragstart', ['$event'],] },],
+    "drag": [{ type: HostListener, args: ['document:drag', ['$event'],] },],
+    "dragEnd": [{ type: HostListener, args: ['document:dragend', ['$event'],] },],
+};
 var DragDropModule = /** @class */ (function () {
@@ -191,2 +260,3 @@ function DragDropModule() {
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective
@@ -196,2 +266,3 @@ ],
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective
@@ -202,2 +273,3 @@ ],
                     DragDirective,
+                    DragInDocumentDirective,
                     DropDirective,
@@ -211,3 +283,3 @@ DataTransfer
 
-export { DropDirective, DragDirective, DragDropModule, DataTransfer as ɵa };
+export { DropDirective, DragDirective, DragInDocumentDirective, DragDropModule, DataTransfer as ɵa };
 //# sourceMappingURL=drag-enabled.js.map

package.json

 {
   "name": "drag-enabled",
-  "version": "0.1.2",
+  "version": "0.2.0",
   "license": "MIT",
@@ -5,0 +5,0 @@ "scripts": {

public_api.d.ts

@@ -1,3 +0,5 @@
-export { DropDirective, DropEvent } from './src/app/drag-enabled/drop.directive';
-export { DragDirective, DragEvent } from './src/app/drag-enabled/drag.directive';
+export { DragEvent, DropEvent } from './src/app/drag-enabled/drag-drop.interfaces';
+export { DropDirective } from './src/app/drag-enabled/drop.directive';
+export { DragDirective } from './src/app/drag-enabled/drag.directive';
+export { DragInDocumentDirective } from './src/app/drag-enabled/drag-only.directive';
 export { DragDropModule } from './src/app/drag-enabled/dragdrop.module';

README.md

 
-
 # Welcome to Drag Enabled!
-
 Have you looked at all the other Angular drag and drop libraries and noted they are not generic enough to fit within your design?
 
-This library provides Angular 4 directives that enables you to have any html tag drag drop enabled within your component control just by adding DragDropModule into your AppModule.
+This library provides Angular 4 directives that enables you to have any html tag drag drop enabled within your component control just by adding **DragDropModule** into your AppModule.
 
 You will be able to pass a medium object to the directives. The medium will supposedly have or know of certain things that can help your code make a decision on allowing a drag or a drop to take place. It could be a reference to a node or a structure in your code. At the start, a "dragEnabled" requst with a DragEvent will be sent to your component. if returned true, dragging begins. At the end of drag operation, an event with the source medium, source HTMLElement, destination medium, and destination HTMLElement will be sent to your component to perform any action necessary.
 
+# Version 0.2.0
+
+Added a **DragInDocumentDirective** to resolve issue found in Mozzila when there is a drag only process and a need to drag an element within a document. If you want to do a drag and drop on a node within hierarchy, we recommend you use **DragDirective** and **DropDirective**.
+
+```javascript
+MODULE:
+	DragDropModule
+
+EXPORTS:
+	DragDirective,
+	DragInDocumentDirective,
+	DropDirective
+
+DEPENDENCIES:
+	basic Angular core libraries
+```
+
 # Version 0.1.2
 Turned out that this library can become a lot more useful if I pass the event location as well. So here it is... Made the new attributes optional to make it compatible for those who are using previous version if they get an accidental upgrade through npm install...
-```
+
+```javascript
 export interface DragEvent {
-    medium: any,
-    node: HTMLElement,
-    clientX?: number,
-    clientY?: number,
-    offset?: {
-        x: number, 
-        y: number
-    }
+	medium: any,
+	node: HTMLElement,
+	clientX?: number,
+	clientY?: number,
+	offset?: {
+		x: number,
+		y: number
+	}
 }
 
 export interface DropEvent {
-    source: {
+	source: DragEvent,
+	destination: {
 		medium: any,
 		node: HTMLElement,
 		clientX?: number,
-		clientY?: number,
-		offset?: {
-			x: number, 
-			y: number
-		}
-    },
-    destination: {
-        medium: any,
-        node: HTMLElement,
-		clientX?: number,
 		clientY?: number
-    }
+	}
 }
@@ -46,26 +53,25 @@ ```
 # Version 0.0.1
-```
-MODULE: 
-		DragDropModule
 
-DEPENDENCIES: 
-		basic Angular core libraries
+```javascript
+MODULE:
+	DragDropModule
+
+DEPENDENCIES:
+	basic Angular core libraries
 ```
 
 Interfaces
-```
+
+```javascript
 export interface DragEvent {
-    medium: any,
-    node: HTMLElement
+	medium: any,
+	node: HTMLElement
 }
 
 export interface DropEvent {
-    source: {
-        medium: any,
-        node: HTMLElement
-    },
-    destination: {
-        medium: any,
-        node: HTMLElement
-    }
+	source: DragEvent,
+	destination: {
+		medium: any,
+		node: HTMLElement
+	}
 }
@@ -77,3 +83,4 @@ ```
 Sample code
-```
+
+```javascript
 <th scope="col"
@@ -88,36 +95,32 @@ [medium]="headerInfo"
 
-	.............
+.............
 
-  	isDragEnabled(event: DragEvent) {
-		return event.medium.dragable;
-	}
-	onDragStart(event: DragEvent){
-	}
-	onDrag(event: DragEvent){
-	}
-	onDragEnd(event: DragEvent){
-	}
-	
-	dropEnabled(event: DropEvent) {
-		return event.destination.medium.dragable;
-	}
-	onDrop(event: DropEvent){
-	//	swapColumns(source.medium, source.node, destination.medium, destination.node);
-	}
+isDragEnabled(event: DragEvent) {
+	return event.medium.dragable;
+}
+onDragStart(event: DragEvent){
+}
+onDrag(event: DragEvent){
+}
+onDragEnd(event: DragEvent){
+}
+dropEnabled(event: DropEvent) {
+	return event.destination.medium.dragable;
+}
+onDrop(event: DropEvent){
+	// swapColumns(source.medium, source.node, destination.medium, destination.node);
+}
+.............
 
-	.............
-
-	table {
-		th {
-			&.drag-over {
-				background-color: #9b9b9b;
-
-				.title, .icon {
-				color: #eee;
-			}
+table {
+	th {
+		&.drag-over {
+		background-color: #9b9b9b;
+		.title, .icon {
+			color: #eee;
 		}
 	}
-	
+}
 ```
 
 [Source code](https://github.com/msalehisedeh/drag-enabled)

src/app/drag-enabled/drag.directive.d.ts

 import { ElementRef, EventEmitter, Renderer } from '@angular/core';
 import { DataTransfer } from './datatransfer';
-export interface DragEvent {
-    medium: any;
-    node: HTMLElement;
-    clientX?: number;
-    clientY?: number;
-    offset?: {
-        x: number;
-        y: number;
-    };
-}
 export declare class DragDirective {
@@ -14,0 +4,0 @@ private dataTransfer;

src/app/drag-enabled/drop.directive.d.ts

 import { ElementRef, Renderer, EventEmitter } from '@angular/core';
 import { DataTransfer } from './datatransfer';
-export interface DropEvent {
-    source: {
-        medium: any;
-        node: HTMLElement;
-        clientX?: number;
-        clientY?: number;
-        offset?: {
-            x: number;
-            y: number;
-        };
-    };
-    destination: {
-        medium: any;
-        node: HTMLElement;
-        clientX?: number;
-        clientY?: number;
-    };
-}
+import { DropEvent } from './drag-drop.interfaces';
 export declare class DropDirective {
@@ -22,0 +5,0 @@ private dataTransfer;

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

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

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

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

151699

increased by33.66%

Number of package files

20

increased by11.11%

Lines of code

1079

increased by33.87%

Number of lines in readme file

124

increased by2.48%

No dependency changes