react-draggable - npm Package Compare versions

Comparing version 3.3.0 to 3.3.1

bower.json

 {
   "name": "react-draggable",
-  "version": "3.3.0",
+  "version": "3.3.1",
   "homepage": "https://github.com/mzabriskie/react-draggable",
@@ -5,0 +5,0 @@ "authors": [

CHANGELOG.md

 # Changelog
 
+### 3.3.1 (Aug 12, 2019)
+
+- Fix React 16.9 `componentWillMount` deprecation.
+
 ### 3.3.0 (Apr 18, 2019)
@@ -4,0 +8,0 @@

dist/react-draggable.min.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react-dom"),require("react")):"function"==typeof define&&define.amd?define(["react-dom","react"],e):t.ReactDraggable=e(t.ReactDOM,t.React)}(this,function(t,e){"use strict";function n(t,e){return t(e={exports:{}},e.exports),e.exports}function r(t){return function(){return t}}t=t&&t.hasOwnProperty("default")?t.default:t,e=e&&e.hasOwnProperty("default")?e.default:e;var o=function(){};o.thatReturns=r,o.thatReturnsFalse=r(!1),o.thatReturnsTrue=r(!0),o.thatReturnsNull=r(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(t){return t};var a=o;var i=function(t,e,n,r,o,a,i,s){if(!t){var u;if(void 0===e)u=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var l=[n,r,o,a,i,s],c=0;(u=new Error(e.replace(/%s/g,function(){return l[c++]}))).name="Invariant Violation"}throw u.framesToPop=1,u}},s=Object.getOwnPropertySymbols,u=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable;(function(){try{if(!Object.assign)return!1;var t=new String("abc");if(t[5]="de","5"===Object.getOwnPropertyNames(t)[0])return!1;for(var e={},n=0;n<10;n++)e["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(e).map(function(t){return e[t]}).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach(function(t){r[t]=t}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(t){return!1}})()&&Object.assign;var c="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",p=n(function(t){t.exports=function(){function t(t,e,n,r,o,a){a!==c&&i(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function e(){return t}t.isRequired=t;var n={array:t,bool:t,func:t,number:t,object:t,string:t,symbol:t,any:t,arrayOf:e,element:t,instanceOf:e,node:t,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e};return n.checkPropTypes=a,n.PropTypes=n,n}()}),f=n(function(t){!function(){var e={}.hasOwnProperty;function n(){for(var t=[],r=0;r<arguments.length;r++){var o=arguments[r];if(o){var a=typeof o;if("string"===a||"number"===a)t.push(o);else if(Array.isArray(o))t.push(n.apply(null,o));else if("object"===a)for(var i in o)e.call(o,i)&&o[i]&&t.push(i)}}return t.join(" ")}t.exports?t.exports=n:window.classNames=n}()});function d(t,e){for(var n=0,r=t.length;n<r;n++)if(e.apply(e,[t[n],n,t]))return t[n]}function g(t){return"function"==typeof t||"[object Function]"===Object.prototype.toString.call(t)}function h(t){return"number"==typeof t&&!isNaN(t)}function m(t){return parseInt(t,10)}function y(t,e,n){if(t[e])return new Error("Invalid prop "+e+" passed to "+n+" - do not set this, set it on the child.")}var b=["Moz","Webkit","O","ms"];function v(t,e){return e?""+e+function(t){for(var e="",n=!0,r=0;r<t.length;r++)n?(e+=t[r].toUpperCase(),n=!1):"-"===t[r]?n=!0:e+=t[r];return e}(t):t}var w=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"transform";if("undefined"==typeof window||void 0===window.document)return"";var e=window.document.documentElement.style;if(t in e)return"";for(var n=0;n<b.length;n++)if(v(t,b[n])in e)return b[n];return""}(),S=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},D=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),x=function(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t},O=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},T=function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)},E=function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e},N=function(){return function(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return function(t,e){var n=[],r=!0,o=!1,a=void 0;try{for(var i,s=t[Symbol.iterator]();!(r=(i=s.next()).done)&&(n.push(i.value),!e||n.length!==e);r=!0);}catch(t){o=!0,a=t}finally{try{!r&&s.return&&s.return()}finally{if(o)throw a}}return n}(t,e);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),k="";function M(t,e){return k||(k=d(["matches","webkitMatchesSelector","mozMatchesSelector","msMatchesSelector","oMatchesSelector"],function(e){return g(t[e])})),!!g(t[k])&&t[k](e)}function P(t,e,n){var r=t;do{if(M(r,e))return!0;if(r===n)return!1;r=r.parentNode}while(r);return!1}function C(t,e,n){t&&(t.attachEvent?t.attachEvent("on"+e,n):t.addEventListener?t.addEventListener(e,n,!0):t["on"+e]=n)}function j(t,e,n){t&&(t.detachEvent?t.detachEvent("on"+e,n):t.removeEventListener?t.removeEventListener(e,n,!0):t["on"+e]=null)}function R(t,e,n){var r="translate("+t.x+n+","+t.y+n+")";e&&(r="translate("+(""+("string"==typeof e.x?e.x:e.x+n))+", "+(""+("string"==typeof e.y?e.y:e.y+n))+")"+r);return r}function X(t){if(t){var e,n,r=t.getElementById("react-draggable-style-el");r||((r=t.createElement("style")).type="text/css",r.id="react-draggable-style-el",r.innerHTML=".react-draggable-transparent-selection *::-moz-selection {background: transparent;}\n",r.innerHTML+=".react-draggable-transparent-selection *::selection {background: transparent;}\n",t.getElementsByTagName("head")[0].appendChild(r)),t.body&&(e=t.body,n="react-draggable-transparent-selection",e.classList?e.classList.add(n):e.className.match(new RegExp("(?:^|\\s)"+n+"(?!\\S)"))||(e.className+=" "+n))}}function Y(t){try{t&&t.body&&(e=t.body,n="react-draggable-transparent-selection",e.classList?e.classList.remove(n):e.className=e.className.replace(new RegExp("(?:^|\\s)"+n+"(?!\\S)","g"),"")),t.selection?t.selection.empty():window.getSelection().removeAllRanges()}catch(t){}var e,n}function _(t,e,n){if(!t.props.bounds)return[e,n];var r=t.props.bounds;r="string"==typeof r?r:function(t){return{left:t.left,top:t.top,right:t.right,bottom:t.bottom}}(r);var o=I(t);if("string"==typeof r){var a=o.ownerDocument,i=a.defaultView,s=void 0;if(!((s="parent"===r?o.parentNode:a.querySelector(r))instanceof i.HTMLElement))throw new Error('Bounds selector "'+r+'" could not find an element.');var u=i.getComputedStyle(o),l=i.getComputedStyle(s);r={left:-o.offsetLeft+m(l.paddingLeft)+m(u.marginLeft),top:-o.offsetTop+m(l.paddingTop)+m(u.marginTop),right:function(t){var e=t.clientWidth,n=t.ownerDocument.defaultView.getComputedStyle(t);return e-=m(n.paddingLeft),e-=m(n.paddingRight)}(s)-function(t){var e=t.clientWidth,n=t.ownerDocument.defaultView.getComputedStyle(t);return e+=m(n.borderLeftWidth),e+=m(n.borderRightWidth)}(o)-o.offsetLeft+m(l.paddingRight)-m(u.marginRight),bottom:function(t){var e=t.clientHeight,n=t.ownerDocument.defaultView.getComputedStyle(t);return e-=m(n.paddingTop),e-=m(n.paddingBottom)}(s)-function(t){var e=t.clientHeight,n=t.ownerDocument.defaultView.getComputedStyle(t);return e+=m(n.borderTopWidth),e+=m(n.borderBottomWidth)}(o)-o.offsetTop+m(l.paddingBottom)-m(u.marginBottom)}}return h(r.right)&&(e=Math.min(e,r.right)),h(r.bottom)&&(n=Math.min(n,r.bottom)),h(r.left)&&(e=Math.max(e,r.left)),h(r.top)&&(n=Math.max(n,r.top)),[e,n]}function L(t,e,n){var r="number"==typeof e?function(t,e){return t.targetTouches&&d(t.targetTouches,function(t){return e===t.identifier})||t.changedTouches&&d(t.changedTouches,function(t){return e===t.identifier})}(t,e):null;if("number"==typeof e&&!r)return null;var o=I(n);return function(t,e){var n=e===e.ownerDocument.body?{left:0,top:0}:e.getBoundingClientRect();return{x:t.clientX+e.scrollLeft-n.left,y:t.clientY+e.scrollTop-n.top}}(r||t,n.props.offsetParent||o.offsetParent||o.ownerDocument.body)}function A(t,e,n){var r=t.state,o=!h(r.lastX),a=I(t);return o?{node:a,deltaX:0,deltaY:0,lastX:e,lastY:n,x:e,y:n}:{node:a,deltaX:e-r.lastX,deltaY:n-r.lastY,lastX:r.lastX,lastY:r.lastY,x:e,y:n}}function U(t,e){var n=t.props.scale;return{node:e.node,x:t.state.x+e.deltaX/n,y:t.state.y+e.deltaY/n,deltaX:e.deltaX/n,deltaY:e.deltaY/n,lastX:t.state.x,lastY:t.state.y}}function I(e){var n=t.findDOMNode(e);if(!n)throw new Error("<DraggableCore>: Unmounted during event!");return n}var V={touch:{start:"touchstart",move:"touchmove",stop:"touchend"},mouse:{start:"mousedown",move:"mousemove",stop:"mouseup"}},W=V.mouse,B=function(n){function r(){var e,n,o;S(this,r);for(var a=arguments.length,i=Array(a),s=0;s<a;s++)i[s]=arguments[s];return n=o=E(this,(e=r.__proto__||Object.getPrototypeOf(r)).call.apply(e,[this].concat(i))),o.state={dragging:!1,lastX:NaN,lastY:NaN,touchIdentifier:null},o.handleDragStart=function(e){if(o.props.onMouseDown(e),!o.props.allowAnyClick&&"number"==typeof e.button&&0!==e.button)return!1;var n=t.findDOMNode(o);if(!n||!n.ownerDocument||!n.ownerDocument.body)throw new Error("<DraggableCore> not mounted on DragStart!");var r=n.ownerDocument;if(!(o.props.disabled||!(e.target instanceof r.defaultView.Node)||o.props.handle&&!P(e.target,o.props.handle,n)||o.props.cancel&&P(e.target,o.props.cancel,n))){var a=function(t){return t.targetTouches&&t.targetTouches[0]?t.targetTouches[0].identifier:t.changedTouches&&t.changedTouches[0]?t.changedTouches[0].identifier:void 0}(e);o.setState({touchIdentifier:a});var i=L(e,a,o);if(null!=i){var s=i.x,u=i.y,l=A(o,s,u);o.props.onStart,!1!==o.props.onStart(e,l)&&(o.props.enableUserSelectHack&&X(r),o.setState({dragging:!0,lastX:s,lastY:u}),C(r,W.move,o.handleDrag),C(r,W.stop,o.handleDragStop))}}},o.handleDrag=function(t){"touchmove"===t.type&&t.preventDefault();var e=L(t,o.state.touchIdentifier,o);if(null!=e){var n,r,a,i=e.x,s=e.y;if(Array.isArray(o.props.grid)){var u=i-o.state.lastX,l=s-o.state.lastY,c=(n=o.props.grid,r=u,a=l,[Math.round(r/n[0])*n[0],Math.round(a/n[1])*n[1]]),p=N(c,2);if(u=p[0],l=p[1],!u&&!l)return;i=o.state.lastX+u,s=o.state.lastY+l}var f=A(o,i,s);if(!1!==o.props.onDrag(t,f))o.setState({lastX:i,lastY:s});else try{o.handleDragStop(new MouseEvent("mouseup"))}catch(t){var d=document.createEvent("MouseEvents");d.initMouseEvent("mouseup",!0,!0,window,0,0,0,0,0,!1,!1,!1,!1,0,null),o.handleDragStop(d)}}},o.handleDragStop=function(e){if(o.state.dragging){var n=L(e,o.state.touchIdentifier,o);if(null!=n){var r=n.x,a=n.y,i=A(o,r,a),s=t.findDOMNode(o);s&&o.props.enableUserSelectHack&&Y(s.ownerDocument),o.setState({dragging:!1,lastX:NaN,lastY:NaN}),o.props.onStop(e,i),s&&(j(s.ownerDocument,W.move,o.handleDrag),j(s.ownerDocument,W.stop,o.handleDragStop))}}},o.onMouseDown=function(t){return W=V.mouse,o.handleDragStart(t)},o.onMouseUp=function(t){return W=V.mouse,o.handleDragStop(t)},o.onTouchStart=function(t){return W=V.touch,o.handleDragStart(t)},o.onTouchEnd=function(t){return W=V.touch,o.handleDragStop(t)},E(o,n)}return T(r,n),D(r,[{key:"componentWillUnmount",value:function(){var e=t.findDOMNode(this);if(e){var n=e.ownerDocument;j(n,V.mouse.move,this.handleDrag),j(n,V.touch.move,this.handleDrag),j(n,V.mouse.stop,this.handleDragStop),j(n,V.touch.stop,this.handleDragStop),this.props.enableUserSelectHack&&Y(n)}}},{key:"render",value:function(){return e.cloneElement(e.Children.only(this.props.children),{style:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return O({touchAction:"none"},t)}(this.props.children.props.style),onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onMouseUp:this.onMouseUp,onTouchEnd:this.onTouchEnd})}}]),r}(e.Component);B.displayName="DraggableCore",B.propTypes={allowAnyClick:p.bool,disabled:p.bool,enableUserSelectHack:p.bool,offsetParent:function(t,e){if(t[e]&&1!==t[e].nodeType)throw new Error("Draggable's offsetParent must be a DOM Node.")},grid:p.arrayOf(p.number),scale:p.number,handle:p.string,cancel:p.string,onStart:p.func,onDrag:p.func,onStop:p.func,onMouseDown:p.func,className:y,style:y,transform:y},B.defaultProps={allowAnyClick:!1,cancel:null,disabled:!1,enableUserSelectHack:!0,offsetParent:null,handle:null,grid:null,transform:null,onStart:function(){},onDrag:function(){},onStop:function(){},onMouseDown:function(){}};var H=function(n){function r(t){S(this,r);var e=E(this,(r.__proto__||Object.getPrototypeOf(r)).call(this,t));return e.onDragStart=function(t,n){if(!1===e.props.onStart(t,U(e,n)))return!1;e.setState({dragging:!0,dragged:!0})},e.onDrag=function(t,n){if(!e.state.dragging)return!1;var r=U(e,n),o={x:r.x,y:r.y};if(e.props.bounds){var a=o.x,i=o.y;o.x+=e.state.slackX,o.y+=e.state.slackY;var s=_(e,o.x,o.y),u=N(s,2),l=u[0],c=u[1];o.x=l,o.y=c,o.slackX=e.state.slackX+(a-o.x),o.slackY=e.state.slackY+(i-o.y),r.x=o.x,r.y=o.y,r.deltaX=o.x-e.state.x,r.deltaY=o.y-e.state.y}if(!1===e.props.onDrag(t,r))return!1;e.setState(o)},e.onDragStop=function(t,n){if(!e.state.dragging)return!1;if(!1===e.props.onStop(t,U(e,n)))return!1;var r={dragging:!1,slackX:0,slackY:0};if(Boolean(e.props.position)){var o=e.props.position,a=o.x,i=o.y;r.x=a,r.y=i}e.setState(r)},e.state={dragging:!1,dragged:!1,x:t.position?t.position.x:t.defaultPosition.x,y:t.position?t.position.y:t.defaultPosition.y,slackX:0,slackY:0,isElementSVG:!1},e}return T(r,n),D(r,[{key:"componentWillMount",value:function(){!this.props.position||this.props.onDrag||this.props.onStop||console.warn("A `position` was applied to this <Draggable>, without drag handlers. This will make this component effectively undraggable. Please attach `onDrag` or `onStop` handlers so you can adjust the `position` of this element.")}},{key:"componentDidMount",value:function(){void 0!==window.SVGElement&&t.findDOMNode(this)instanceof window.SVGElement&&this.setState({isElementSVG:!0})}},{key:"componentWillReceiveProps",value:function(t){!t.position||this.props.position&&t.position.x===this.props.position.x&&t.position.y===this.props.position.y||this.setState({x:t.position.x,y:t.position.y})}},{key:"componentWillUnmount",value:function(){this.setState({dragging:!1})}},{key:"render",value:function(){var t,n,r,o={},a=null,i=!Boolean(this.props.position)||this.state.dragging,s=this.props.position||this.props.defaultPosition,u={x:function(t){return"both"===t.props.axis||"x"===t.props.axis}(this)&&i?this.state.x:s.x,y:function(t){return"both"===t.props.axis||"y"===t.props.axis}(this)&&i?this.state.y:s.y};this.state.isElementSVG?(n=u,r=this.props.positionOffset,a=R(n,r,"")):o=function(t,e){var n=R(t,e,"px");return x({},v("transform",w),n)}(u,this.props.positionOffset);var l=this.props,c=l.defaultClassName,p=l.defaultClassNameDragging,d=l.defaultClassNameDragged,g=e.Children.only(this.props.children),h=f(g.props.className||"",c,(x(t={},p,this.state.dragging),x(t,d,this.state.dragged),t));return e.createElement(B,O({},this.props,{onStart:this.onDragStart,onDrag:this.onDrag,onStop:this.onDragStop}),e.cloneElement(g,{className:h,style:O({},g.props.style,o),transform:a}))}}]),r}(e.Component);return H.displayName="Draggable",H.propTypes=O({},B.propTypes,{axis:p.oneOf(["both","x","y","none"]),bounds:p.oneOfType([p.shape({left:p.number,right:p.number,top:p.number,bottom:p.number}),p.string,p.oneOf([!1])]),defaultClassName:p.string,defaultClassNameDragging:p.string,defaultClassNameDragged:p.string,defaultPosition:p.shape({x:p.number,y:p.number}),positionOffset:p.shape({x:p.oneOfType([p.number,p.string]),y:p.oneOfType([p.number,p.string])}),position:p.shape({x:p.number,y:p.number}),className:y,style:y,transform:y}),H.defaultProps=O({},B.defaultProps,{axis:"both",bounds:!1,defaultClassName:"react-draggable",defaultClassNameDragging:"react-draggable-dragging",defaultClassNameDragged:"react-draggable-dragged",defaultPosition:{x:0,y:0},position:null,scale:1}),H.default=H,H.DraggableCore=B,H});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react-dom"),require("react")):"function"==typeof define&&define.amd?define(["react-dom","react"],e):t.ReactDraggable=e(t.ReactDOM,t.React)}(this,function(t,e){"use strict";function n(t,e){return t(e={exports:{}},e.exports),e.exports}function r(t){return function(){return t}}t=t&&t.hasOwnProperty("default")?t.default:t,e=e&&e.hasOwnProperty("default")?e.default:e;var o=function(){};o.thatReturns=r,o.thatReturnsFalse=r(!1),o.thatReturnsTrue=r(!0),o.thatReturnsNull=r(null),o.thatReturnsThis=function(){return this},o.thatReturnsArgument=function(t){return t};var a=o;var i=function(t,e,n,r,o,a,i,s){if(!t){var u;if(void 0===e)u=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var l=[n,r,o,a,i,s],c=0;(u=new Error(e.replace(/%s/g,function(){return l[c++]}))).name="Invariant Violation"}throw u.framesToPop=1,u}},s=Object.getOwnPropertySymbols,u=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable;(function(){try{if(!Object.assign)return!1;var t=new String("abc");if(t[5]="de","5"===Object.getOwnPropertyNames(t)[0])return!1;for(var e={},n=0;n<10;n++)e["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(e).map(function(t){return e[t]}).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach(function(t){r[t]=t}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(t){return!1}})()&&Object.assign;var c="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",p=n(function(t){t.exports=function(){function t(t,e,n,r,o,a){a!==c&&i(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function e(){return t}t.isRequired=t;var n={array:t,bool:t,func:t,number:t,object:t,string:t,symbol:t,any:t,arrayOf:e,element:t,instanceOf:e,node:t,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e};return n.checkPropTypes=a,n.PropTypes=n,n}()}),f=n(function(t){!function(){var e={}.hasOwnProperty;function n(){for(var t=[],r=0;r<arguments.length;r++){var o=arguments[r];if(o){var a=typeof o;if("string"===a||"number"===a)t.push(o);else if(Array.isArray(o))t.push(n.apply(null,o));else if("object"===a)for(var i in o)e.call(o,i)&&o[i]&&t.push(i)}}return t.join(" ")}t.exports?t.exports=n:window.classNames=n}()});function d(t,e){for(var n=0,r=t.length;n<r;n++)if(e.apply(e,[t[n],n,t]))return t[n]}function g(t){return"function"==typeof t||"[object Function]"===Object.prototype.toString.call(t)}function h(t){return"number"==typeof t&&!isNaN(t)}function m(t){return parseInt(t,10)}function y(t,e,n){if(t[e])return new Error("Invalid prop "+e+" passed to "+n+" - do not set this, set it on the child.")}var b=["Moz","Webkit","O","ms"];function v(t,e){return e?""+e+function(t){for(var e="",n=!0,r=0;r<t.length;r++)n?(e+=t[r].toUpperCase(),n=!1):"-"===t[r]?n=!0:e+=t[r];return e}(t):t}var w=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"transform";if("undefined"==typeof window||void 0===window.document)return"";var e=window.document.documentElement.style;if(t in e)return"";for(var n=0;n<b.length;n++)if(v(t,b[n])in e)return b[n];return""}(),S=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},D=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),x=function(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t},O=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},T=function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)},E=function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e},N=function(){return function(t,e){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return function(t,e){var n=[],r=!0,o=!1,a=void 0;try{for(var i,s=t[Symbol.iterator]();!(r=(i=s.next()).done)&&(n.push(i.value),!e||n.length!==e);r=!0);}catch(t){o=!0,a=t}finally{try{!r&&s.return&&s.return()}finally{if(o)throw a}}return n}(t,e);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),k="";function P(t,e){return k||(k=d(["matches","webkitMatchesSelector","mozMatchesSelector","msMatchesSelector","oMatchesSelector"],function(e){return g(t[e])})),!!g(t[k])&&t[k](e)}function M(t,e,n){var r=t;do{if(P(r,e))return!0;if(r===n)return!1;r=r.parentNode}while(r);return!1}function C(t,e,n){t&&(t.attachEvent?t.attachEvent("on"+e,n):t.addEventListener?t.addEventListener(e,n,!0):t["on"+e]=n)}function j(t,e,n){t&&(t.detachEvent?t.detachEvent("on"+e,n):t.removeEventListener?t.removeEventListener(e,n,!0):t["on"+e]=null)}function R(t,e,n){var r="translate("+t.x+n+","+t.y+n+")";e&&(r="translate("+(""+("string"==typeof e.x?e.x:e.x+n))+", "+(""+("string"==typeof e.y?e.y:e.y+n))+")"+r);return r}function X(t){if(t){var e,n,r=t.getElementById("react-draggable-style-el");r||((r=t.createElement("style")).type="text/css",r.id="react-draggable-style-el",r.innerHTML=".react-draggable-transparent-selection *::-moz-selection {background: transparent;}\n",r.innerHTML+=".react-draggable-transparent-selection *::selection {background: transparent;}\n",t.getElementsByTagName("head")[0].appendChild(r)),t.body&&(e=t.body,n="react-draggable-transparent-selection",e.classList?e.classList.add(n):e.className.match(new RegExp("(?:^|\\s)"+n+"(?!\\S)"))||(e.className+=" "+n))}}function Y(t){try{t&&t.body&&(e=t.body,n="react-draggable-transparent-selection",e.classList?e.classList.remove(n):e.className=e.className.replace(new RegExp("(?:^|\\s)"+n+"(?!\\S)","g"),"")),t.selection?t.selection.empty():window.getSelection().removeAllRanges()}catch(t){}var e,n}function _(t,e,n){if(!t.props.bounds)return[e,n];var r=t.props.bounds;r="string"==typeof r?r:function(t){return{left:t.left,top:t.top,right:t.right,bottom:t.bottom}}(r);var o=I(t);if("string"==typeof r){var a=o.ownerDocument,i=a.defaultView,s=void 0;if(!((s="parent"===r?o.parentNode:a.querySelector(r))instanceof i.HTMLElement))throw new Error('Bounds selector "'+r+'" could not find an element.');var u=i.getComputedStyle(o),l=i.getComputedStyle(s);r={left:-o.offsetLeft+m(l.paddingLeft)+m(u.marginLeft),top:-o.offsetTop+m(l.paddingTop)+m(u.marginTop),right:function(t){var e=t.clientWidth,n=t.ownerDocument.defaultView.getComputedStyle(t);return e-=m(n.paddingLeft),e-=m(n.paddingRight)}(s)-function(t){var e=t.clientWidth,n=t.ownerDocument.defaultView.getComputedStyle(t);return e+=m(n.borderLeftWidth),e+=m(n.borderRightWidth)}(o)-o.offsetLeft+m(l.paddingRight)-m(u.marginRight),bottom:function(t){var e=t.clientHeight,n=t.ownerDocument.defaultView.getComputedStyle(t);return e-=m(n.paddingTop),e-=m(n.paddingBottom)}(s)-function(t){var e=t.clientHeight,n=t.ownerDocument.defaultView.getComputedStyle(t);return e+=m(n.borderTopWidth),e+=m(n.borderBottomWidth)}(o)-o.offsetTop+m(l.paddingBottom)-m(u.marginBottom)}}return h(r.right)&&(e=Math.min(e,r.right)),h(r.bottom)&&(n=Math.min(n,r.bottom)),h(r.left)&&(e=Math.max(e,r.left)),h(r.top)&&(n=Math.max(n,r.top)),[e,n]}function L(t,e,n){var r="number"==typeof e?function(t,e){return t.targetTouches&&d(t.targetTouches,function(t){return e===t.identifier})||t.changedTouches&&d(t.changedTouches,function(t){return e===t.identifier})}(t,e):null;if("number"==typeof e&&!r)return null;var o=I(n);return function(t,e){var n=e===e.ownerDocument.body?{left:0,top:0}:e.getBoundingClientRect();return{x:t.clientX+e.scrollLeft-n.left,y:t.clientY+e.scrollTop-n.top}}(r||t,n.props.offsetParent||o.offsetParent||o.ownerDocument.body)}function A(t,e,n){var r=t.state,o=!h(r.lastX),a=I(t);return o?{node:a,deltaX:0,deltaY:0,lastX:e,lastY:n,x:e,y:n}:{node:a,deltaX:e-r.lastX,deltaY:n-r.lastY,lastX:r.lastX,lastY:r.lastY,x:e,y:n}}function U(t,e){var n=t.props.scale;return{node:e.node,x:t.state.x+e.deltaX/n,y:t.state.y+e.deltaY/n,deltaX:e.deltaX/n,deltaY:e.deltaY/n,lastX:t.state.x,lastY:t.state.y}}function I(e){var n=t.findDOMNode(e);if(!n)throw new Error("<DraggableCore>: Unmounted during event!");return n}var V={touch:{start:"touchstart",move:"touchmove",stop:"touchend"},mouse:{start:"mousedown",move:"mousemove",stop:"mouseup"}},B=V.mouse,H=function(n){function r(){var e,n,o;S(this,r);for(var a=arguments.length,i=Array(a),s=0;s<a;s++)i[s]=arguments[s];return n=o=E(this,(e=r.__proto__||Object.getPrototypeOf(r)).call.apply(e,[this].concat(i))),o.state={dragging:!1,lastX:NaN,lastY:NaN,touchIdentifier:null},o.handleDragStart=function(e){if(o.props.onMouseDown(e),!o.props.allowAnyClick&&"number"==typeof e.button&&0!==e.button)return!1;var n=t.findDOMNode(o);if(!n||!n.ownerDocument||!n.ownerDocument.body)throw new Error("<DraggableCore> not mounted on DragStart!");var r=n.ownerDocument;if(!(o.props.disabled||!(e.target instanceof r.defaultView.Node)||o.props.handle&&!M(e.target,o.props.handle,n)||o.props.cancel&&M(e.target,o.props.cancel,n))){var a=function(t){return t.targetTouches&&t.targetTouches[0]?t.targetTouches[0].identifier:t.changedTouches&&t.changedTouches[0]?t.changedTouches[0].identifier:void 0}(e);o.setState({touchIdentifier:a});var i=L(e,a,o);if(null!=i){var s=i.x,u=i.y,l=A(o,s,u);o.props.onStart,!1!==o.props.onStart(e,l)&&(o.props.enableUserSelectHack&&X(r),o.setState({dragging:!0,lastX:s,lastY:u}),C(r,B.move,o.handleDrag),C(r,B.stop,o.handleDragStop))}}},o.handleDrag=function(t){"touchmove"===t.type&&t.preventDefault();var e=L(t,o.state.touchIdentifier,o);if(null!=e){var n,r,a,i=e.x,s=e.y;if(Array.isArray(o.props.grid)){var u=i-o.state.lastX,l=s-o.state.lastY,c=(n=o.props.grid,r=u,a=l,[Math.round(r/n[0])*n[0],Math.round(a/n[1])*n[1]]),p=N(c,2);if(u=p[0],l=p[1],!u&&!l)return;i=o.state.lastX+u,s=o.state.lastY+l}var f=A(o,i,s);if(!1!==o.props.onDrag(t,f))o.setState({lastX:i,lastY:s});else try{o.handleDragStop(new MouseEvent("mouseup"))}catch(t){var d=document.createEvent("MouseEvents");d.initMouseEvent("mouseup",!0,!0,window,0,0,0,0,0,!1,!1,!1,!1,0,null),o.handleDragStop(d)}}},o.handleDragStop=function(e){if(o.state.dragging){var n=L(e,o.state.touchIdentifier,o);if(null!=n){var r=n.x,a=n.y,i=A(o,r,a),s=t.findDOMNode(o);s&&o.props.enableUserSelectHack&&Y(s.ownerDocument),o.setState({dragging:!1,lastX:NaN,lastY:NaN}),o.props.onStop(e,i),s&&(j(s.ownerDocument,B.move,o.handleDrag),j(s.ownerDocument,B.stop,o.handleDragStop))}}},o.onMouseDown=function(t){return B=V.mouse,o.handleDragStart(t)},o.onMouseUp=function(t){return B=V.mouse,o.handleDragStop(t)},o.onTouchStart=function(t){return B=V.touch,o.handleDragStart(t)},o.onTouchEnd=function(t){return B=V.touch,o.handleDragStop(t)},E(o,n)}return T(r,n),D(r,[{key:"componentWillUnmount",value:function(){var e=t.findDOMNode(this);if(e){var n=e.ownerDocument;j(n,V.mouse.move,this.handleDrag),j(n,V.touch.move,this.handleDrag),j(n,V.mouse.stop,this.handleDragStop),j(n,V.touch.stop,this.handleDragStop),this.props.enableUserSelectHack&&Y(n)}}},{key:"render",value:function(){return e.cloneElement(e.Children.only(this.props.children),{style:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return O({touchAction:"none"},t)}(this.props.children.props.style),onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onMouseUp:this.onMouseUp,onTouchEnd:this.onTouchEnd})}}]),r}(e.Component);H.displayName="DraggableCore",H.propTypes={allowAnyClick:p.bool,disabled:p.bool,enableUserSelectHack:p.bool,offsetParent:function(t,e){if(t[e]&&1!==t[e].nodeType)throw new Error("Draggable's offsetParent must be a DOM Node.")},grid:p.arrayOf(p.number),scale:p.number,handle:p.string,cancel:p.string,onStart:p.func,onDrag:p.func,onStop:p.func,onMouseDown:p.func,className:y,style:y,transform:y},H.defaultProps={allowAnyClick:!1,cancel:null,disabled:!1,enableUserSelectHack:!0,offsetParent:null,handle:null,grid:null,transform:null,onStart:function(){},onDrag:function(){},onStop:function(){},onMouseDown:function(){}};var W=function(n){function r(t){S(this,r);var e=E(this,(r.__proto__||Object.getPrototypeOf(r)).call(this,t));return e.onDragStart=function(t,n){if(!1===e.props.onStart(t,U(e,n)))return!1;e.setState({dragging:!0,dragged:!0})},e.onDrag=function(t,n){if(!e.state.dragging)return!1;var r=U(e,n),o={x:r.x,y:r.y};if(e.props.bounds){var a=o.x,i=o.y;o.x+=e.state.slackX,o.y+=e.state.slackY;var s=_(e,o.x,o.y),u=N(s,2),l=u[0],c=u[1];o.x=l,o.y=c,o.slackX=e.state.slackX+(a-o.x),o.slackY=e.state.slackY+(i-o.y),r.x=o.x,r.y=o.y,r.deltaX=o.x-e.state.x,r.deltaY=o.y-e.state.y}if(!1===e.props.onDrag(t,r))return!1;e.setState(o)},e.onDragStop=function(t,n){if(!e.state.dragging)return!1;if(!1===e.props.onStop(t,U(e,n)))return!1;var r={dragging:!1,slackX:0,slackY:0};if(Boolean(e.props.position)){var o=e.props.position,a=o.x,i=o.y;r.x=a,r.y=i}e.setState(r)},e.state={dragging:!1,dragged:!1,x:t.position?t.position.x:t.defaultPosition.x,y:t.position?t.position.y:t.defaultPosition.y,slackX:0,slackY:0,isElementSVG:!1},!t.position||t.onDrag||t.onStop||console.warn("A `position` was applied to this <Draggable>, without drag handlers. This will make this component effectively undraggable. Please attach `onDrag` or `onStop` handlers so you can adjust the `position` of this element."),e}return T(r,n),D(r,[{key:"componentDidMount",value:function(){void 0!==window.SVGElement&&t.findDOMNode(this)instanceof window.SVGElement&&this.setState({isElementSVG:!0})}},{key:"componentWillReceiveProps",value:function(t){!t.position||this.props.position&&t.position.x===this.props.position.x&&t.position.y===this.props.position.y||this.setState({x:t.position.x,y:t.position.y})}},{key:"componentWillUnmount",value:function(){this.setState({dragging:!1})}},{key:"render",value:function(){var t,n,r,o={},a=null,i=!Boolean(this.props.position)||this.state.dragging,s=this.props.position||this.props.defaultPosition,u={x:function(t){return"both"===t.props.axis||"x"===t.props.axis}(this)&&i?this.state.x:s.x,y:function(t){return"both"===t.props.axis||"y"===t.props.axis}(this)&&i?this.state.y:s.y};this.state.isElementSVG?(n=u,r=this.props.positionOffset,a=R(n,r,"")):o=function(t,e){var n=R(t,e,"px");return x({},v("transform",w),n)}(u,this.props.positionOffset);var l=this.props,c=l.defaultClassName,p=l.defaultClassNameDragging,d=l.defaultClassNameDragged,g=e.Children.only(this.props.children),h=f(g.props.className||"",c,(x(t={},p,this.state.dragging),x(t,d,this.state.dragged),t));return e.createElement(H,O({},this.props,{onStart:this.onDragStart,onDrag:this.onDrag,onStop:this.onDragStop}),e.cloneElement(g,{className:h,style:O({},g.props.style,o),transform:a}))}}]),r}(e.Component);return W.displayName="Draggable",W.propTypes=O({},H.propTypes,{axis:p.oneOf(["both","x","y","none"]),bounds:p.oneOfType([p.shape({left:p.number,right:p.number,top:p.number,bottom:p.number}),p.string,p.oneOf([!1])]),defaultClassName:p.string,defaultClassNameDragging:p.string,defaultClassNameDragged:p.string,defaultPosition:p.shape({x:p.number,y:p.number}),positionOffset:p.shape({x:p.oneOfType([p.number,p.string]),y:p.oneOfType([p.number,p.string])}),position:p.shape({x:p.number,y:p.number}),className:y,style:y,transform:y}),W.defaultProps=O({},H.defaultProps,{axis:"both",bounds:!1,defaultClassName:"react-draggable",defaultClassNameDragging:"react-draggable-dragging",defaultClassNameDragged:"react-draggable-dragged",defaultPosition:{x:0,y:0},position:null,scale:1}),W.default=W,W.DraggableCore=H,W});
 //# sourceMappingURL=react-draggable.min.js.map

lib/Draggable.js

@@ -195,7 +195,5 @@ // @flow
     };
-  }
 
-  componentWillMount() {
-    if (this.props.position && !(this.props.onDrag || this.props.onStop)) {
-      // eslint-disable-next-line
+    if (props.position && !(props.onDrag || props.onStop)) {
+      // eslint-disable-next-line no-console
       console.warn('A `position` was applied to this <Draggable>, without drag handlers. This will make this ' +
@@ -202,0 +200,0 @@ 'component effectively undraggable. Please attach `onDrag` or `onStop` handlers so you can adjust the ' +

package.json

 {
   "name": "react-draggable",
-  "version": "3.3.0",
+  "version": "3.3.1",
   "description": "React draggable component",
@@ -5,0 +5,0 @@ "main": "dist/react-draggable.js",

README.md

@@ -78,3 +78,3 @@ # React-Draggable
 View the [Demo](http://mzabriskie.github.io/react-draggable/example/) and its
-[source](/example/index.html) for more.
+[source](/example/example.js) for more.
 
@@ -81,0 +81,0 @@ ```js

typings/index.d.ts

@@ -18,2 +18,3 @@ declare module 'react-draggable' {
     defaultPosition: ControlPosition,
+    positionOffset: PositionOffsetControlPosition,
     position: ControlPosition
@@ -41,2 +42,4 @@ }
 
+  export type PositionOffsetControlPosition = {x: number|string, y: number|string};
+
   export interface DraggableCoreProps {
@@ -43,0 +46,0 @@ allowAnyClick: boolean,

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

Worsened metrics

Total package byte prevSize

363220

decreased by-0.03%

Lines of code

3304

decreased by-0.09%

No dependency changes