react-drag-drop-container - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

dist/react-drag-drop-container.js

@@ -192,4 +192,4 @@ (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.DragDropContainer = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
         clickY: y - this.state.top,
-        initialLeftOffset: this.containerElem.offsetLeft,
-        initialTopOffset: this.containerElem.offsetTop
+        initialLeftOffset: this.state.dragged ? this.state.initialLeftOffset : this.containerElem.offsetLeft,
+        initialTopOffset: this.state.dragged ? this.state.initialTopOffset : this.containerElem.offsetTop
       });
@@ -196,0 +196,0 @@ this.props.onStartDrag(this.props.dragData);

dist/react-drag-drop-container.min.js

@@ -1,1 +0,1 @@
-!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.DragDropContainer=e()}}(function(){return function e(t,n,r){function o(a,s){if(!n[a]){if(!t[a]){var u="function"==typeof require&&require;if(!s&&u)return u(a,!0);if(i)return i(a,!0);var d=new Error("Cannot find module '"+a+"'");throw d.code="MODULE_NOT_FOUND",d}var l=n[a]={exports:{}};t[a][0].call(l.exports,function(e){var n=t[a][1][e];return o(n?n:e)},l,l.exports,e,t,n,r)}return n[a].exports}for(var i="function"==typeof require&&require,a=0;a<r.length;a++)o(r[a]);return o}({1:[function(e,t,n){(function(r){"use strict";function o(e){return e&&e.__esModule?e:{"default":e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var s=function(){function e(e,t){var n=[],r=!0,o=!1,i=void 0;try{for(var a,s=e[Symbol.iterator]();!(r=(a=s.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(u){o=!0,i=u}finally{try{!r&&s["return"]&&s["return"]()}finally{if(o)throw i}}return n}return function(t,n){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,n);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),u=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),d=function(e,t,n){for(var r=!0;r;){var o=e,i=t,a=n;r=!1,null===o&&(o=Function.prototype);var s=Object.getOwnPropertyDescriptor(o,i);if(void 0!==s){if("value"in s)return s.value;var u=s.get;if(void 0===u)return;return u.call(a)}var d=Object.getPrototypeOf(o);if(null===d)return;e=d,t=i,n=a,r=!0,s=d=void 0}},l="undefined"!=typeof window?window.React:"undefined"!=typeof r?r.React:null,f=o(l),p=e("./DragDropGhost"),c=o(p),h=function(e){function t(e){i(this,t),d(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.state={clickX:0,clickY:0,left:0,top:0,initialLeftOffset:0,initialTopOffset:0,clicked:!1,dragging:!1,dragged:!1},this.handleMouseDown=this.handleMouseDown.bind(this),this.handleTouchStart=this.handleTouchStart.bind(this),this.startDrag=this.startDrag.bind(this),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleTouchMove=this.handleTouchMove.bind(this),this.drag=this.drag.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this),this.handleTouchEnd=this.handleTouchEnd.bind(this),this.drop=this.drop.bind(this),this.checkForOffsetChanges=this.checkForOffsetChanges.bind(this),this.dragElem=null,this.containerElem=null,this.currentTarget=null,this.prevTarget=null}return a(t,e),u(t,[{key:"componentDidMount",value:function(){this.containerElem=this.refs.drag_container,this.props.dragGhost?this.dragElem=this.refs.drag_ghost.refs.the_ghost:this.dragElem=this.containerElem;var e=this.refs.drag_container;if(this.props.dragHandleClassName)for(var t=e.getElementsByClassName(this.props.dragHandleClassName),n=0;n<t.length;n++)this.addListeners(t[n]);else this.addListeners(e)}},{key:"addListeners",value:function(e){var t=this;e.addEventListener("mousedown",function(e){t.handleMouseDown(e)},!1),e.addEventListener("touchstart",function(e){t.handleTouchStart(e)},!1)}},{key:"createEvent",value:function(e,t,n){var r,o=this;return"function"!=typeof window.CustomEvent?(r=document.createEvent("CustomEvent"),r.initCustomEvent(e,!0,!0,{})):r=new CustomEvent(e,{bubbles:!0,cancelable:!0}),r.dataTransfer={getData:function(e){return e===o.props.dataKey?o.props.dragData:void 0},types:[this.props.dataKey]},r.sourceElement=this.refs.drag_container,r}},{key:"setCurrentTarget",value:function(e,t){this.dragElem.style.zIndex=-1;var n=document.elementFromPoint(e,t)||document.body;this.dragElem.style.zIndex=this.props.zIndex,this.currentTarget=this.dragElem.contains(n)?document.body:n}},{key:"generateEnterLeaveEvents",value:function(e,t){this.setCurrentTarget(e,t),this.currentTarget!==this.prevTarget&&(this.prevTarget&&this.prevTarget.dispatchEvent(this.createEvent(this.props.customEventNameDragLeave,e,t)),this.currentTarget&&this.currentTarget.dispatchEvent(this.createEvent(this.props.customEventNameDragEnter,e,t))),this.prevTarget=this.currentTarget}},{key:"generateDropEvent",value:function(e,t){this.setCurrentTarget(e,t),this.currentTarget.dispatchEvent(this.createEvent(this.props.customEventNameDrop,e,t))}},{key:"handleMouseDown",value:function(e){1!==e.buttons||this.props.noDragging||(document.addEventListener("mousemove",this.handleMouseMove),document.addEventListener("mouseup",this.handleMouseUp),this.startDrag(e.clientX,e.clientY))}},{key:"handleTouchStart",value:function(e){this.props.noDragging||(e.preventDefault(),document.addEventListener("touchmove",this.handleTouchMove),document.addEventListener("touchend",this.handleTouchEnd),this.startDrag(e.targetTouches[0].pageX,e.targetTouches[0].pageY))}},{key:"startDrag",value:function(e,t){this.setState({clicked:!0,clickX:e-this.state.left,clickY:t-this.state.top,initialLeftOffset:this.containerElem.offsetLeft,initialTopOffset:this.containerElem.offsetTop}),this.props.onStartDrag(this.props.dragData)}},{key:"handleMouseMove",value:function(e){this.props.noDragging||(e.preventDefault(),this.state.clicked&&this.drag(e.clientX,e.clientY))}},{key:"handleTouchMove",value:function(e){this.props.noDragging||(e.preventDefault(),this.state.clicked&&this.drag(e.targetTouches[0].pageX,e.targetTouches[0].pageY))}},{key:"drag",value:function(e,t){this.generateEnterLeaveEvents(e,t);var n=this.checkForOffsetChanges(),r=s(n,2),o=r[0],i=r[1];this.setState({dragging:!0,left:o+e-this.state.clickX,top:i+t-this.state.clickY}),this.props.onDragging(this.props.dragData,this.currentTarget,e,t)}},{key:"handleMouseUp",value:function(e){this.setState({clicked:!1}),this.state.dragging&&(document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp),this.drop(e.clientX,e.clientY))}},{key:"handleTouchEnd",value:function(e){this.setState({clicked:!1}),this.state.dragging&&(document.removeEventListener("touchmove",this.handleTouchMove),document.removeEventListener("touchend",this.handleTouchEnd),this.drop(e.changedTouches[0].pageX,e.changedTouches[0].pageY))}},{key:"drop",value:function(e,t){this.generateDropEvent(e,t),this.props.returnToBase?this.setState({left:0,top:0,dragging:!1}):this.setState({dragged:!0,dragging:!1}),this.props.onEndDrag(this.props.dragData,this.currentTarget,e,t)}},{key:"checkForOffsetChanges",value:function(){var e=void 0,t=void 0;return this.props.dragGhost?(e=this.state.initialLeftOffset-this.containerElem.offsetLeft,t=this.state.initialTopOffset-this.containerElem.offsetTop):(e=this.state.initialLeftOffset+this.state.left-this.containerElem.offsetLeft,t=this.state.initialTopOffset+this.state.top-this.containerElem.offsetTop),[e,t]}},{key:"render",value:function(){var e={position:"relative"},t="";return this.props.dragGhost?t=f["default"].createElement(c["default"],{dragging:this.state.dragging,left:this.state.left,top:this.state.top,zIndex:this.props.zIndex,ref:"drag_ghost"},this.props.dragGhost):(e.left=this.state.left,e.top=this.state.top,e.zIndex=this.state.dragging||this.state.dragged?this.props.zIndex:"inherit"),f["default"].createElement("div",{style:e,ref:"drag_container"},this.props.children,t)}}]),t}(f["default"].Component);h.propTypes={children:f["default"].PropTypes.any,customEventNameDragEnter:f["default"].PropTypes.string,customEventNameDragLeave:f["default"].PropTypes.string,customEventNameDrop:f["default"].PropTypes.string,dataKey:f["default"].PropTypes.string,dragData:f["default"].PropTypes.object,dragGhost:f["default"].PropTypes.node,dragHandleClassName:f["default"].PropTypes.string,noDragging:f["default"].PropTypes.bool,onDragging:f["default"].PropTypes.func,onEndDrag:f["default"].PropTypes.func,onStartDrag:f["default"].PropTypes.func,returnToBase:f["default"].PropTypes.bool,zIndex:f["default"].PropTypes.number},h.defaultProps={onStartDrag:function(){},onDragging:function(){},onEndDrag:function(){},dragData:{},dataKey:"data",noDragging:!1,returnToBase:!0,customEventNameDragEnter:"dragEnter",customEventNameDragLeave:"dragLeave",customEventNameDrop:"drop",zIndex:1e3},n["default"]=h,t.exports=n["default"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./DragDropGhost":2}],2:[function(e,t,n){(function(e){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var a=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),s=function(e,t,n){for(var r=!0;r;){var o=e,i=t,a=n;r=!1,null===o&&(o=Function.prototype);var s=Object.getOwnPropertyDescriptor(o,i);if(void 0!==s){if("value"in s)return s.value;var u=s.get;if(void 0===u)return;return u.call(a)}var d=Object.getPrototypeOf(o);if(null===d)return;e=d,t=i,n=a,r=!0,s=d=void 0}},u="undefined"!=typeof window?window.React:"undefined"!=typeof e?e.React:null,d=r(u),l=function(e){function t(){o(this,t),s(Object.getPrototypeOf(t.prototype),"constructor",this).apply(this,arguments)}return i(t,e),a(t,[{key:"render",value:function(){var e={position:"absolute",zIndex:this.props.zIndex,left:this.props.left,top:this.props.top,display:this.props.dragging?"block":"none"};return d["default"].createElement("div",{style:e,ref:"the_ghost"},this.props.children)}}]),t}(d["default"].Component);l.propTypes={children:d["default"].PropTypes.any,display:d["default"].PropTypes.string,dragging:d["default"].PropTypes.bool,left:d["default"].PropTypes.number,top:d["default"].PropTypes.number,zIndex:d["default"].PropTypes.number},n["default"]=l,t.exports=n["default"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});
+!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.DragDropContainer=e()}}(function(){return function e(t,n,r){function o(a,s){if(!n[a]){if(!t[a]){var u="function"==typeof require&&require;if(!s&&u)return u(a,!0);if(i)return i(a,!0);var d=new Error("Cannot find module '"+a+"'");throw d.code="MODULE_NOT_FOUND",d}var l=n[a]={exports:{}};t[a][0].call(l.exports,function(e){var n=t[a][1][e];return o(n?n:e)},l,l.exports,e,t,n,r)}return n[a].exports}for(var i="function"==typeof require&&require,a=0;a<r.length;a++)o(r[a]);return o}({1:[function(e,t,n){(function(r){"use strict";function o(e){return e&&e.__esModule?e:{"default":e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var s=function(){function e(e,t){var n=[],r=!0,o=!1,i=void 0;try{for(var a,s=e[Symbol.iterator]();!(r=(a=s.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(u){o=!0,i=u}finally{try{!r&&s["return"]&&s["return"]()}finally{if(o)throw i}}return n}return function(t,n){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,n);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),u=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),d=function(e,t,n){for(var r=!0;r;){var o=e,i=t,a=n;r=!1,null===o&&(o=Function.prototype);var s=Object.getOwnPropertyDescriptor(o,i);if(void 0!==s){if("value"in s)return s.value;var u=s.get;if(void 0===u)return;return u.call(a)}var d=Object.getPrototypeOf(o);if(null===d)return;e=d,t=i,n=a,r=!0,s=d=void 0}},l="undefined"!=typeof window?window.React:"undefined"!=typeof r?r.React:null,f=o(l),h=e("./DragDropGhost"),p=o(h),c=function(e){function t(e){i(this,t),d(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.state={clickX:0,clickY:0,left:0,top:0,initialLeftOffset:0,initialTopOffset:0,clicked:!1,dragging:!1,dragged:!1},this.handleMouseDown=this.handleMouseDown.bind(this),this.handleTouchStart=this.handleTouchStart.bind(this),this.startDrag=this.startDrag.bind(this),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleTouchMove=this.handleTouchMove.bind(this),this.drag=this.drag.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this),this.handleTouchEnd=this.handleTouchEnd.bind(this),this.drop=this.drop.bind(this),this.checkForOffsetChanges=this.checkForOffsetChanges.bind(this),this.dragElem=null,this.containerElem=null,this.currentTarget=null,this.prevTarget=null}return a(t,e),u(t,[{key:"componentDidMount",value:function(){this.containerElem=this.refs.drag_container,this.props.dragGhost?this.dragElem=this.refs.drag_ghost.refs.the_ghost:this.dragElem=this.containerElem;var e=this.refs.drag_container;if(this.props.dragHandleClassName)for(var t=e.getElementsByClassName(this.props.dragHandleClassName),n=0;n<t.length;n++)this.addListeners(t[n]);else this.addListeners(e)}},{key:"addListeners",value:function(e){var t=this;e.addEventListener("mousedown",function(e){t.handleMouseDown(e)},!1),e.addEventListener("touchstart",function(e){t.handleTouchStart(e)},!1)}},{key:"createEvent",value:function(e,t,n){var r,o=this;return"function"!=typeof window.CustomEvent?(r=document.createEvent("CustomEvent"),r.initCustomEvent(e,!0,!0,{})):r=new CustomEvent(e,{bubbles:!0,cancelable:!0}),r.dataTransfer={getData:function(e){return e===o.props.dataKey?o.props.dragData:void 0},types:[this.props.dataKey]},r.sourceElement=this.refs.drag_container,r}},{key:"setCurrentTarget",value:function(e,t){this.dragElem.style.zIndex=-1;var n=document.elementFromPoint(e,t)||document.body;this.dragElem.style.zIndex=this.props.zIndex,this.currentTarget=this.dragElem.contains(n)?document.body:n}},{key:"generateEnterLeaveEvents",value:function(e,t){this.setCurrentTarget(e,t),this.currentTarget!==this.prevTarget&&(this.prevTarget&&this.prevTarget.dispatchEvent(this.createEvent(this.props.customEventNameDragLeave,e,t)),this.currentTarget&&this.currentTarget.dispatchEvent(this.createEvent(this.props.customEventNameDragEnter,e,t))),this.prevTarget=this.currentTarget}},{key:"generateDropEvent",value:function(e,t){this.setCurrentTarget(e,t),this.currentTarget.dispatchEvent(this.createEvent(this.props.customEventNameDrop,e,t))}},{key:"handleMouseDown",value:function(e){1!==e.buttons||this.props.noDragging||(document.addEventListener("mousemove",this.handleMouseMove),document.addEventListener("mouseup",this.handleMouseUp),this.startDrag(e.clientX,e.clientY))}},{key:"handleTouchStart",value:function(e){this.props.noDragging||(e.preventDefault(),document.addEventListener("touchmove",this.handleTouchMove),document.addEventListener("touchend",this.handleTouchEnd),this.startDrag(e.targetTouches[0].pageX,e.targetTouches[0].pageY))}},{key:"startDrag",value:function(e,t){this.setState({clicked:!0,clickX:e-this.state.left,clickY:t-this.state.top,initialLeftOffset:this.state.dragged?this.state.initialLeftOffset:this.containerElem.offsetLeft,initialTopOffset:this.state.dragged?this.state.initialTopOffset:this.containerElem.offsetTop}),this.props.onStartDrag(this.props.dragData)}},{key:"handleMouseMove",value:function(e){this.props.noDragging||(e.preventDefault(),this.state.clicked&&this.drag(e.clientX,e.clientY))}},{key:"handleTouchMove",value:function(e){this.props.noDragging||(e.preventDefault(),this.state.clicked&&this.drag(e.targetTouches[0].pageX,e.targetTouches[0].pageY))}},{key:"drag",value:function(e,t){this.generateEnterLeaveEvents(e,t);var n=this.checkForOffsetChanges(),r=s(n,2),o=r[0],i=r[1];this.setState({dragging:!0,left:o+e-this.state.clickX,top:i+t-this.state.clickY}),this.props.onDragging(this.props.dragData,this.currentTarget,e,t)}},{key:"handleMouseUp",value:function(e){this.setState({clicked:!1}),this.state.dragging&&(document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp),this.drop(e.clientX,e.clientY))}},{key:"handleTouchEnd",value:function(e){this.setState({clicked:!1}),this.state.dragging&&(document.removeEventListener("touchmove",this.handleTouchMove),document.removeEventListener("touchend",this.handleTouchEnd),this.drop(e.changedTouches[0].pageX,e.changedTouches[0].pageY))}},{key:"drop",value:function(e,t){this.generateDropEvent(e,t),this.props.returnToBase?this.setState({left:0,top:0,dragging:!1}):this.setState({dragged:!0,dragging:!1}),this.props.onEndDrag(this.props.dragData,this.currentTarget,e,t)}},{key:"checkForOffsetChanges",value:function(){var e=void 0,t=void 0;return this.props.dragGhost?(e=this.state.initialLeftOffset-this.containerElem.offsetLeft,t=this.state.initialTopOffset-this.containerElem.offsetTop):(e=this.state.initialLeftOffset+this.state.left-this.containerElem.offsetLeft,t=this.state.initialTopOffset+this.state.top-this.containerElem.offsetTop),[e,t]}},{key:"render",value:function(){var e={position:"relative"},t="";return this.props.dragGhost?t=f["default"].createElement(p["default"],{dragging:this.state.dragging,left:this.state.left,top:this.state.top,zIndex:this.props.zIndex,ref:"drag_ghost"},this.props.dragGhost):(e.left=this.state.left,e.top=this.state.top,e.zIndex=this.state.dragging||this.state.dragged?this.props.zIndex:"inherit"),f["default"].createElement("div",{style:e,ref:"drag_container"},this.props.children,t)}}]),t}(f["default"].Component);c.propTypes={children:f["default"].PropTypes.any,customEventNameDragEnter:f["default"].PropTypes.string,customEventNameDragLeave:f["default"].PropTypes.string,customEventNameDrop:f["default"].PropTypes.string,dataKey:f["default"].PropTypes.string,dragData:f["default"].PropTypes.object,dragGhost:f["default"].PropTypes.node,dragHandleClassName:f["default"].PropTypes.string,noDragging:f["default"].PropTypes.bool,onDragging:f["default"].PropTypes.func,onEndDrag:f["default"].PropTypes.func,onStartDrag:f["default"].PropTypes.func,returnToBase:f["default"].PropTypes.bool,zIndex:f["default"].PropTypes.number},c.defaultProps={onStartDrag:function(){},onDragging:function(){},onEndDrag:function(){},dragData:{},dataKey:"data",noDragging:!1,returnToBase:!0,customEventNameDragEnter:"dragEnter",customEventNameDragLeave:"dragLeave",customEventNameDrop:"drop",zIndex:1e3},n["default"]=c,t.exports=n["default"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./DragDropGhost":2}],2:[function(e,t,n){(function(e){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var a=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),s=function(e,t,n){for(var r=!0;r;){var o=e,i=t,a=n;r=!1,null===o&&(o=Function.prototype);var s=Object.getOwnPropertyDescriptor(o,i);if(void 0!==s){if("value"in s)return s.value;var u=s.get;if(void 0===u)return;return u.call(a)}var d=Object.getPrototypeOf(o);if(null===d)return;e=d,t=i,n=a,r=!0,s=d=void 0}},u="undefined"!=typeof window?window.React:"undefined"!=typeof e?e.React:null,d=r(u),l=function(e){function t(){o(this,t),s(Object.getPrototypeOf(t.prototype),"constructor",this).apply(this,arguments)}return i(t,e),a(t,[{key:"render",value:function(){var e={position:"absolute",zIndex:this.props.zIndex,left:this.props.left,top:this.props.top,display:this.props.dragging?"block":"none"};return d["default"].createElement("div",{style:e,ref:"the_ghost"},this.props.children)}}]),t}(d["default"].Component);l.propTypes={children:d["default"].PropTypes.any,display:d["default"].PropTypes.string,dragging:d["default"].PropTypes.bool,left:d["default"].PropTypes.number,top:d["default"].PropTypes.number,zIndex:d["default"].PropTypes.number},n["default"]=l,t.exports=n["default"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[1])(1)});

lib/DragDropContainer.js

@@ -190,4 +190,4 @@ 'use strict';
         clickY: y - this.state.top,
-        initialLeftOffset: this.containerElem.offsetLeft,
-        initialTopOffset: this.containerElem.offsetTop
+        initialLeftOffset: this.state.dragged ? this.state.initialLeftOffset : this.containerElem.offsetLeft,
+        initialTopOffset: this.state.dragged ? this.state.initialTopOffset : this.containerElem.offsetTop
       });
@@ -194,0 +194,0 @@ this.props.onStartDrag(this.props.dragData);

package.json

 {
   "name": "react-drag-drop-container",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "DragDropContainer",
@@ -5,0 +5,0 @@ "main": "lib/DragDropContainer.js",

src/DragDropContainer.js

@@ -138,4 +138,4 @@ import React from 'react';
       clickY: y - this.state.top,
-      initialLeftOffset: this.containerElem.offsetLeft,
-      initialTopOffset: this.containerElem.offsetTop,
+      initialLeftOffset: this.state.dragged ? this.state.initialLeftOffset : this.containerElem.offsetLeft,
+      initialTopOffset: this.state.dragged ? this.state.initialTopOffset : this.containerElem.offsetTop,
     });
@@ -142,0 +142,0 @@ this.props.onStartDrag(this.props.dragData);

No alert changes

Improved metrics

Total package byte prevSize

286704

increased by0.14%

No dependency changes