Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

react-draggable

Package Overview
Dependencies
Maintainers
2
Versions
79
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-draggable - npm Package Compare versions

Comparing version 1.1.1 to 1.1.2

2

bower.json
{
"name": "react-draggable",
"version": "1.1.1",
"version": "1.1.2",
"homepage": "https://github.com/mzabriskie/react-draggable",

@@ -5,0 +5,0 @@ "authors": [

5

CHANGELOG.md
# Changelog
### 1.1.2 (Nov 23, 2015)
- Bugfix: `<Draggable>` was calling back with clientX/Y, not offsetX/Y as it did pre-1.0. This unintended
behavior has been fixed and a test has been added.
### 1.1.1 (Nov 14, 2015)

@@ -4,0 +9,0 @@

42

dist/react-draggable.js

@@ -149,5 +149,3 @@ (function webpackUniversalModuleDefinition(root, factory) {

_this.setState({
dragging: true
});
_this.setState({ dragging: true });
};

@@ -159,9 +157,11 @@

var uiEvent = (0, _utilsDomFns.createUIEvent)(_this, coreEvent);
// Short-circuit if user's callback killed it.
var shouldUpdate = _this.props.onDrag(e, (0, _utilsDomFns.createUIEvent)(_this, coreEvent));
var shouldUpdate = _this.props.onDrag(e, uiEvent);
if (shouldUpdate === false) return false;
var newState = {
clientX: _this.state.clientX + coreEvent.position.deltaX,
clientY: _this.state.clientY + coreEvent.position.deltaY
clientX: uiEvent.position.left,
clientY: uiEvent.position.top
};

@@ -523,2 +523,5 @@

function matchesSelector(el, selector) {
if (!(el instanceof Node)) throw new TypeError('Value of argument \'el\' violates contract, expected Node got ' + (el === null ? 'null' : el instanceof Object && el.constructor ? el.constructor.name : typeof el));
if (typeof selector !== 'string') throw new TypeError('Value of argument \'selector\' violates contract, expected string got ' + (selector === null ? 'null' : selector instanceof Object && selector.constructor ? selector.constructor.name : typeof selector));
if (!matchesSelectorFunc) {

@@ -534,2 +537,6 @@ matchesSelectorFunc = (0, _shims.findInArray)(['matches', 'webkitMatchesSelector', 'mozMatchesSelector', 'msMatchesSelector', 'oMatchesSelector'], function (method) {

function addEvent(el, event, handler) {
if (el != null && !(el instanceof Node)) throw new TypeError('Value of argument \'el\' violates contract, expected null or Node got ' + (el === null ? 'null' : el instanceof Object && el.constructor ? el.constructor.name : typeof el));
if (typeof event !== 'string') throw new TypeError('Value of argument \'event\' violates contract, expected string got ' + (event === null ? 'null' : event instanceof Object && event.constructor ? event.constructor.name : typeof event));
if (typeof handler !== 'function') throw new TypeError('Value of argument \'handler\' violates contract, expected function got ' + (handler === null ? 'null' : handler instanceof Object && handler.constructor ? handler.constructor.name : typeof handler));
if (!el) {

@@ -548,2 +555,6 @@ return;

function removeEvent(el, event, handler) {
if (el != null && !(el instanceof Node)) throw new TypeError('Value of argument \'el\' violates contract, expected null or Node got ' + (el === null ? 'null' : el instanceof Object && el.constructor ? el.constructor.name : typeof el));
if (typeof event !== 'string') throw new TypeError('Value of argument \'event\' violates contract, expected string got ' + (event === null ? 'null' : event instanceof Object && event.constructor ? event.constructor.name : typeof event));
if (typeof handler !== 'function') throw new TypeError('Value of argument \'handler\' violates contract, expected function got ' + (handler === null ? 'null' : handler instanceof Object && handler.constructor ? handler.constructor.name : typeof handler));
if (!el) {

@@ -562,2 +573,4 @@ return;

function outerHeight(node) {
if (!(node instanceof Node)) throw new TypeError('Value of argument \'node\' violates contract, expected Node got ' + (node === null ? 'null' : node instanceof Object && node.constructor ? node.constructor.name : typeof node));
// This is deliberately excluding margin for our calculations, since we are using

@@ -573,2 +586,4 @@ // offsetTop which is including margin. See getBoundPosition

function outerWidth(node) {
if (!(node instanceof Node)) throw new TypeError('Value of argument \'node\' violates contract, expected Node got ' + (node === null ? 'null' : node instanceof Object && node.constructor ? node.constructor.name : typeof node));
// This is deliberately excluding margin for our calculations, since we are using

@@ -584,2 +599,4 @@ // offsetLeft which is including margin. See getBoundPosition

function innerHeight(node) {
if (!(node instanceof Node)) throw new TypeError('Value of argument \'node\' violates contract, expected Node got ' + (node === null ? 'null' : node instanceof Object && node.constructor ? node.constructor.name : typeof node));
var height = node.clientHeight;

@@ -593,2 +610,4 @@ var computedStyle = window.getComputedStyle(node);

function innerWidth(node) {
if (!(node instanceof Node)) throw new TypeError('Value of argument \'node\' violates contract, expected Node got ' + (node === null ? 'null' : node instanceof Object && node.constructor ? node.constructor.name : typeof node));
var width = node.clientWidth;

@@ -602,2 +621,5 @@ var computedStyle = window.getComputedStyle(node);

function createTransform(position, isSVG) {
if (typeof position !== 'object') throw new TypeError('Value of argument \'position\' violates contract, expected object got ' + (position === null ? 'null' : position instanceof Object && position.constructor ? position.constructor.name : typeof position));
if (isSVG != null && typeof isSVG !== 'boolean') throw new TypeError('Value of argument \'isSVG\' violates contract, expected null or boolean got ' + (isSVG === null ? 'null' : isSVG instanceof Object && isSVG.constructor ? isSVG.constructor.name : typeof isSVG));
if (isSVG) return createSVGTransform(position);

@@ -611,2 +633,4 @@ return createCSSTransform(position);

return (function () {
if ({ x: x, y: y } === null || typeof { x: x, y: y } !== 'object' || typeof { x: x, y: y }.x !== 'number' || typeof { x: x, y: y }.y !== 'number') throw new TypeError('Value of argument \'undefined\' violates contract, expected Object with properties x and y got ' + ({ x: x, y: y } === null ? 'null' : { x: x, y: y } instanceof Object && { x: x, y: y }.constructor ? { x: x, y: y }.constructor.name : typeof { x: x, y: y }));
// Replace unitless items with px

@@ -626,2 +650,4 @@ var out = { transform: 'translate(' + x + 'px,' + y + 'px)' };

return (function () {
if ({ x: x, y: y } === null || typeof { x: x, y: y } !== 'object' || typeof { x: x, y: y }.x !== 'number' || typeof { x: x, y: y }.y !== 'number') throw new TypeError('Value of argument \'undefined\' violates contract, expected Object with properties x and y got ' + ({ x: x, y: y } === null ? 'null' : { x: x, y: y } instanceof Object && { x: x, y: y }.constructor ? { x: x, y: y }.constructor.name : typeof { x: x, y: y }));
return 'translate(' + x + ',' + y + ')';

@@ -692,4 +718,4 @@ })();

position: {
top: coreEvent.position.clientY,
left: coreEvent.position.clientX
left: draggable.state.clientX + coreEvent.position.deltaX,
top: draggable.state.clientY + coreEvent.position.deltaY
},

@@ -696,0 +722,0 @@ deltaX: coreEvent.position.deltaX,

2

dist/react-draggable.min.js

@@ -1,2 +0,2 @@

!function(root,factory){"object"==typeof exports&&"object"==typeof module?module.exports=factory(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],factory):"object"==typeof exports?exports.ReactDraggable=factory(require("react"),require("react-dom")):root.ReactDraggable=factory(root.React,root.ReactDOM)}(this,function(__WEBPACK_EXTERNAL_MODULE_2__,__WEBPACK_EXTERNAL_MODULE_3__){return function(modules){function __webpack_require__(moduleId){if(installedModules[moduleId])return installedModules[moduleId].exports;var module=installedModules[moduleId]={exports:{},id:moduleId,loaded:!1};return modules[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.loaded=!0,module.exports}var installedModules={};return __webpack_require__.m=modules,__webpack_require__.c=installedModules,__webpack_require__.p="",__webpack_require__(0)}([function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(1),module.exports.DraggableCore=__webpack_require__(10)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_slicedToArray=function(){function sliceIterator(arr,i){var _arr=[],_n=!0,_d=!1,_e=void 0;try{for(var _s,_i=arr[Symbol.iterator]();!(_n=(_s=_i.next()).done)&&(_arr.push(_s.value),!i||_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{!_n&&_i["return"]&&_i["return"]()}finally{if(_d)throw _e}}return _arr}return function(arr,i){if(Array.isArray(arr))return arr;if(Symbol.iterator in Object(arr))return sliceIterator(arr,i);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_get=function(_x,_x2,_x3){for(var _again=!0;_again;){var object=_x,property=_x2,receiver=_x3;_again=!1,null===object&&(object=Function.prototype);var desc=Object.getOwnPropertyDescriptor(object,property);if(void 0!==desc){if("value"in desc)return desc.value;var getter=desc.get;return void 0===getter?void 0:getter.call(receiver)}var parent=Object.getPrototypeOf(object);if(null===parent)return void 0;_x=parent,_x2=property,_x3=receiver,_again=!0,desc=parent=void 0}},_react=__webpack_require__(2),_react2=_interopRequireDefault(_react),_reactDom=__webpack_require__(3),_reactDom2=_interopRequireDefault(_reactDom),_classnames=__webpack_require__(4),_classnames2=_interopRequireDefault(_classnames),_objectAssign=__webpack_require__(5),_objectAssign2=_interopRequireDefault(_objectAssign),_utilsDomFns=__webpack_require__(6),_utilsPositionFns=__webpack_require__(9),_utilsShims=__webpack_require__(7),_DraggableCore2=__webpack_require__(10),_DraggableCore3=_interopRequireDefault(_DraggableCore2),_utilsLog=__webpack_require__(11),_utilsLog2=_interopRequireDefault(_utilsLog),Draggable=function(_DraggableCore){function Draggable(){var _this=this;_classCallCheck(this,Draggable),_get(Object.getPrototypeOf(Draggable.prototype),"constructor",this).apply(this,arguments),this.state={dragging:!1,clientX:this.props.start.x,clientY:this.props.start.y,isElementSVG:!1},this.onDragStart=function(e,coreEvent){(0,_utilsLog2["default"])("Draggable: onDragStart: %j",coreEvent.position);var shouldStart=_this.props.onStart(e,(0,_utilsDomFns.createUIEvent)(_this,coreEvent));return shouldStart===!1?!1:void _this.setState({dragging:!0})},this.onDrag=function(e,coreEvent){if(!_this.state.dragging)return!1;(0,_utilsLog2["default"])("Draggable: onDrag: %j",coreEvent.position);var shouldUpdate=_this.props.onDrag(e,(0,_utilsDomFns.createUIEvent)(_this,coreEvent));if(shouldUpdate===!1)return!1;var newState={clientX:_this.state.clientX+coreEvent.position.deltaX,clientY:_this.state.clientY+coreEvent.position.deltaY};if(_this.props.bounds){var _getBoundPosition=(0,_utilsPositionFns.getBoundPosition)(_this,newState.clientX,newState.clientY),_getBoundPosition2=_slicedToArray(_getBoundPosition,2);newState.clientX=_getBoundPosition2[0],newState.clientY=_getBoundPosition2[1]}_this.setState(newState)},this.onDragStop=function(e,coreEvent){if(!_this.state.dragging)return!1;var shouldStop=_this.props.onStop(e,(0,_utilsDomFns.createUIEvent)(_this,coreEvent));return shouldStop===!1?!1:((0,_utilsLog2["default"])("Draggable: onDragStop: %j",coreEvent.position),void _this.setState({dragging:!1}))}}return _inherits(Draggable,_DraggableCore),_createClass(Draggable,[{key:"componentDidMount",value:function(){_reactDom2["default"].findDOMNode(this)instanceof SVGElement&&this.setState({isElementSVG:!0})}},{key:"render",value:function(){var style=void 0,svgTransform=null;style=(0,_utilsDomFns.createTransform)({x:(0,_utilsPositionFns.canDragX)(this)?this.state.clientX:this.props.start.x,y:(0,_utilsPositionFns.canDragY)(this)?this.state.clientY:this.props.start.y},this.state.isElementSVG),this.state.isElementSVG&&(svgTransform=style,style={}),this.state.dragging&&!isNaN(this.props.zIndex)&&(style.zIndex=this.props.zIndex);var className=(0,_classnames2["default"])(this.props.children.props.className||"","react-draggable",{"react-draggable-dragging":this.state.dragging,"react-draggable-dragged":this.state.dragged});return _react2["default"].createElement(_DraggableCore3["default"],_extends({},this.props,{onStart:this.onDragStart,onDrag:this.onDrag,onStop:this.onDragStop}),_react2["default"].cloneElement(_react2["default"].Children.only(this.props.children),{className:className,style:(0,_objectAssign2["default"])({},this.props.children.props.style,style),transform:svgTransform}))}}],[{key:"displayName",value:"Draggable",enumerable:!0},{key:"propTypes",value:(0,_objectAssign2["default"])({},_DraggableCore3["default"].propTypes,{axis:_react.PropTypes.oneOf(["both","x","y"]),bounds:_react.PropTypes.oneOfType([_react.PropTypes.shape({left:_react.PropTypes.Number,right:_react.PropTypes.Number,top:_react.PropTypes.Number,bottom:_react.PropTypes.Number}),_react.PropTypes.oneOf(["parent",!1])]),start:_react.PropTypes.shape({x:_react.PropTypes.number,y:_react.PropTypes.number}),zIndex:_react.PropTypes.number,className:_utilsShims.dontSetMe,style:_utilsShims.dontSetMe,transform:_utilsShims.dontSetMe}),enumerable:!0},{key:"defaultProps",value:(0,_objectAssign2["default"])({},_DraggableCore3["default"].defaultProps,{axis:"both",bounds:!1,start:{x:0,y:0},zIndex:NaN}),enumerable:!0}]),Draggable}(_DraggableCore3["default"]);exports["default"]=Draggable,module.exports=exports["default"]},function(module,exports){module.exports=__WEBPACK_EXTERNAL_MODULE_2__},function(module,exports){module.exports=__WEBPACK_EXTERNAL_MODULE_3__},function(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_RESULT__;!function(){"use strict";function classNames(){for(var classes="",i=0;i<arguments.length;i++){var arg=arguments[i];if(arg){var argType=typeof arg;if("string"===argType||"number"===argType)classes+=" "+arg;else if(Array.isArray(arg))classes+=" "+classNames.apply(null,arg);else if("object"===argType)for(var key in arg)hasOwn.call(arg,key)&&arg[key]&&(classes+=" "+key)}}return classes.substr(1)}var hasOwn={}.hasOwnProperty;"undefined"!=typeof module&&module.exports?module.exports=classNames:(__WEBPACK_AMD_DEFINE_RESULT__=function(){return classNames}.call(exports,__webpack_require__,exports,module),!(void 0!==__WEBPACK_AMD_DEFINE_RESULT__&&(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)))}()},function(module,exports){"use strict";function toObject(val){if(null===val||void 0===val)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(val)}var hasOwnProperty=Object.prototype.hasOwnProperty,propIsEnumerable=Object.prototype.propertyIsEnumerable;module.exports=Object.assign||function(target,source){for(var from,symbols,to=toObject(target),s=1;s<arguments.length;s++){from=Object(arguments[s]);for(var key in from)hasOwnProperty.call(from,key)&&(to[key]=from[key]);if(Object.getOwnPropertySymbols){symbols=Object.getOwnPropertySymbols(from);for(var i=0;i<symbols.length;i++)propIsEnumerable.call(from,symbols[i])&&(to[symbols[i]]=from[symbols[i]])}}return to}},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function matchesSelector(el,selector){return matchesSelectorFunc||(matchesSelectorFunc=(0,_shims.findInArray)(["matches","webkitMatchesSelector","mozMatchesSelector","msMatchesSelector","oMatchesSelector"],function(method){return(0,_shims.isFunction)(el[method])})),el[matchesSelectorFunc].call(el,selector)}function addEvent(el,event,handler){el&&(el.attachEvent?el.attachEvent("on"+event,handler):el.addEventListener?el.addEventListener(event,handler,!0):el["on"+event]=handler)}function removeEvent(el,event,handler){el&&(el.detachEvent?el.detachEvent("on"+event,handler):el.removeEventListener?el.removeEventListener(event,handler,!0):el["on"+event]=null)}function outerHeight(node){var height=node.clientHeight,computedStyle=window.getComputedStyle(node);return height+=(0,_shims["int"])(computedStyle.borderTopWidth),height+=(0,_shims["int"])(computedStyle.borderBottomWidth)}function outerWidth(node){var width=node.clientWidth,computedStyle=window.getComputedStyle(node);return width+=(0,_shims["int"])(computedStyle.borderLeftWidth),width+=(0,_shims["int"])(computedStyle.borderRightWidth)}function innerHeight(node){var height=node.clientHeight,computedStyle=window.getComputedStyle(node);return height-=(0,_shims["int"])(computedStyle.paddingTop),height-=(0,_shims["int"])(computedStyle.paddingBottom)}function innerWidth(node){var width=node.clientWidth,computedStyle=window.getComputedStyle(node);return width-=(0,_shims["int"])(computedStyle.paddingLeft),width-=(0,_shims["int"])(computedStyle.paddingRight)}function createTransform(position,isSVG){return isSVG?createSVGTransform(position):createCSSTransform(position)}function createCSSTransform(_ref){var x=_ref.x,y=_ref.y;return function(){var out={transform:"translate("+x+"px,"+y+"px)"};return _getPrefix2["default"]&&(out[_getPrefix2["default"]+"Transform"]=out.transform),out}()}function createSVGTransform(_ref2){var x=_ref2.x,y=_ref2.y;return function(){return"translate("+x+","+y+")"}()}function addUserSelectStyles(){var style=document.body.getAttribute("style")||"";document.body.setAttribute("style",style+userSelectStyle)}function removeUserSelectStyles(){var style=document.body.getAttribute("style")||"";document.body.setAttribute("style",style.replace(userSelectStyle,""))}function styleHacks(){var childStyle=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],touchHacks={touchAction:"none"};return(0,_objectAssign2["default"])(touchHacks,childStyle)}function createCoreEvent(draggable,clientX,clientY){var state=draggable._pendingState||draggable.state,isStart=!(0,_shims.isNum)(state.lastX);return{node:_reactDom2["default"].findDOMNode(draggable),position:isStart?{deltaX:0,deltaY:0,lastX:clientX,lastY:clientY,clientX:clientX,clientY:clientY}:{deltaX:clientX-state.lastX,deltaY:clientY-state.lastY,lastX:state.lastX,lastY:state.lastY,clientX:clientX,clientY:clientY}}}function createUIEvent(draggable,coreEvent){return{node:_reactDom2["default"].findDOMNode(draggable),position:{top:coreEvent.position.clientY,left:coreEvent.position.clientX},deltaX:coreEvent.position.deltaX,deltaY:coreEvent.position.deltaY}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.matchesSelector=matchesSelector,exports.addEvent=addEvent,exports.removeEvent=removeEvent,exports.outerHeight=outerHeight,exports.outerWidth=outerWidth,exports.innerHeight=innerHeight,exports.innerWidth=innerWidth,exports.createTransform=createTransform,exports.createCSSTransform=createCSSTransform,exports.createSVGTransform=createSVGTransform,exports.addUserSelectStyles=addUserSelectStyles,exports.removeUserSelectStyles=removeUserSelectStyles,exports.styleHacks=styleHacks,exports.createCoreEvent=createCoreEvent,exports.createUIEvent=createUIEvent;var _shims=__webpack_require__(7),_getPrefix=__webpack_require__(8),_getPrefix2=_interopRequireDefault(_getPrefix),_objectAssign=__webpack_require__(5),_objectAssign2=_interopRequireDefault(_objectAssign),_reactDom=__webpack_require__(3),_reactDom2=_interopRequireDefault(_reactDom),matchesSelectorFunc="",userSelectStyle=";user-select: none;";_getPrefix2["default"]&&(userSelectStyle+="-"+_getPrefix2["default"].toLowerCase()+"-user-select: none;")},function(module,exports){"use strict";function findInArray(array,callback){for(var i=0,_length=array.length;_length>i;i++)if(callback.apply(callback,[array[i],i,array]))return array[i]}function isFunction(func){return"function"==typeof func||"[object Function]"===Object.prototype.toString.call(func)}function isNum(num){return"number"==typeof num&&!isNaN(num)}function int(a){return parseInt(a,10)}function dontSetMe(props,propName,componentName){if(props[propName])throw new Error("Invalid prop "+propName+" passed to "+componentName+" - do not set this, set it on the child.")}Object.defineProperty(exports,"__esModule",{value:!0}),exports.findInArray=findInArray,exports.isFunction=isFunction,exports.isNum=isNum,exports["int"]=int,exports.dontSetMe=dontSetMe},function(module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=function(){if("undefined"==typeof window)return"";var styles=window.getComputedStyle(document.documentElement,""),pre=(Array.prototype.slice.call(styles).join("").match(/-(moz|webkit|ms)-/)||""===styles.OLink&&["","o"])[1];return void 0===pre||null===pre?"":"ms"===pre?pre:void 0===pre||null===pre?"":pre.slice(0,1).toUpperCase()+pre.slice(1)}(),module.exports=exports["default"]},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function getBoundPosition(draggable,clientX,clientY){if(!draggable.props.bounds)return[clientX,clientY];var bounds=JSON.parse(JSON.stringify(draggable.props.bounds)),node=_reactDom2["default"].findDOMNode(draggable),parent=node.parentNode;if("parent"===bounds){var nodeStyle=window.getComputedStyle(node),parentStyle=window.getComputedStyle(parent);bounds={left:-node.offsetLeft+(0,_shims["int"])(parentStyle.paddingLeft)+(0,_shims["int"])(nodeStyle.borderLeftWidth)+(0,_shims["int"])(nodeStyle.marginLeft),top:-node.offsetTop+(0,_shims["int"])(parentStyle.paddingTop)+(0,_shims["int"])(nodeStyle.borderTopWidth)+(0,_shims["int"])(nodeStyle.marginTop),right:(0,_domFns.innerWidth)(parent)-(0,_domFns.outerWidth)(node)-node.offsetLeft,bottom:(0,_domFns.innerHeight)(parent)-(0,_domFns.outerHeight)(node)-node.offsetTop}}return(0,_shims.isNum)(bounds.right)&&(clientX=Math.min(clientX,bounds.right)),(0,_shims.isNum)(bounds.bottom)&&(clientY=Math.min(clientY,bounds.bottom)),(0,_shims.isNum)(bounds.left)&&(clientX=Math.max(clientX,bounds.left)),(0,_shims.isNum)(bounds.top)&&(clientY=Math.max(clientY,bounds.top)),[clientX,clientY]}function snapToGrid(grid,pendingX,pendingY){var x=Math.round(pendingX/grid[0])*grid[0],y=Math.round(pendingY/grid[1])*grid[1];return[x,y]}function canDragX(draggable){return"both"===draggable.props.axis||"x"===draggable.props.axis}function canDragY(draggable){return"both"===draggable.props.axis||"y"===draggable.props.axis}function getControlPosition(e){var position=e.targetTouches&&e.targetTouches[0]||e;return{clientX:position.clientX,clientY:position.clientY}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.getBoundPosition=getBoundPosition,exports.snapToGrid=snapToGrid,exports.canDragX=canDragX,exports.canDragY=canDragY,exports.getControlPosition=getControlPosition;var _shims=__webpack_require__(7),_reactDom=__webpack_require__(3),_reactDom2=_interopRequireDefault(_reactDom),_domFns=__webpack_require__(6)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _slicedToArray=function(){function sliceIterator(arr,i){var _arr=[],_n=!0,_d=!1,_e=void 0;try{for(var _s,_i=arr[Symbol.iterator]();!(_n=(_s=_i.next()).done)&&(_arr.push(_s.value),!i||_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{!_n&&_i["return"]&&_i["return"]()}finally{if(_d)throw _e}}return _arr}return function(arr,i){if(Array.isArray(arr))return arr;if(Symbol.iterator in Object(arr))return sliceIterator(arr,i);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_get=function(_x,_x2,_x3){for(var _again=!0;_again;){var object=_x,property=_x2,receiver=_x3;_again=!1,null===object&&(object=Function.prototype);var desc=Object.getOwnPropertyDescriptor(object,property);if(void 0!==desc){if("value"in desc)return desc.value;var getter=desc.get;return void 0===getter?void 0:getter.call(receiver)}var parent=Object.getPrototypeOf(object);if(null===parent)return void 0;_x=parent,_x2=property,_x3=receiver,_again=!0,desc=parent=void 0}},_react=__webpack_require__(2),_react2=_interopRequireDefault(_react),_utilsDomFns=__webpack_require__(6),_utilsPositionFns=__webpack_require__(9),_utilsShims=__webpack_require__(7),_utilsLog=__webpack_require__(11),_utilsLog2=_interopRequireDefault(_utilsLog),eventsFor={touch:{start:"touchstart",move:"touchmove",stop:"touchend"},mouse:{start:"mousedown",move:"mousemove",stop:"mouseup"}},dragEventFor=eventsFor.mouse,DraggableCore=function(_React$Component){function DraggableCore(){var _this=this;_classCallCheck(this,DraggableCore),_get(Object.getPrototypeOf(DraggableCore.prototype),"constructor",this).apply(this,arguments),this.state={dragging:!1,lastX:null,lastY:null},this.handleDragStart=function(e){if(_this.props.onMouseDown(e),!_this.props.allowAnyClick&&"number"==typeof e.button&&0!==e.button)return!1;if(!(_this.props.disabled||_this.props.handle&&!(0,_utilsDomFns.matchesSelector)(e.target,_this.props.handle)||_this.props.cancel&&(0,_utilsDomFns.matchesSelector)(e.target,_this.props.cancel))){e.targetTouches&&_this.setState({touchIdentifier:e.targetTouches[0].identifier}),_this.props.enableUserSelectHack&&(0,_utilsDomFns.addUserSelectStyles)();var _getControlPosition=(0,_utilsPositionFns.getControlPosition)(e),clientX=_getControlPosition.clientX,clientY=_getControlPosition.clientY,coreEvent=(0,_utilsDomFns.createCoreEvent)(_this,clientX,clientY);(0,_utilsLog2["default"])("DraggableCore: handleDragStart: %j",coreEvent.position),(0,_utilsLog2["default"])("calling",_this.props.onStart);var shouldUpdate=_this.props.onStart(e,coreEvent);shouldUpdate!==!1&&(_this.setState({dragging:!0,lastX:clientX,lastY:clientY,scrollX:document.body.scrollLeft,scrollY:document.body.scrollTop}),(0,_utilsDomFns.addEvent)(document,"scroll",_this.handleScroll),(0,_utilsDomFns.addEvent)(document,dragEventFor.move,_this.handleDrag),(0,_utilsDomFns.addEvent)(document,dragEventFor.stop,_this.handleDragStop))}},this.handleDrag=function(e){if(!e.targetTouches||e.targetTouches[0].identifier===_this.state.touchIdentifier){var _getControlPosition2=(0,_utilsPositionFns.getControlPosition)(e),clientX=_getControlPosition2.clientX,clientY=_getControlPosition2.clientY;if(Array.isArray(_this.props.grid)){var deltaX=clientX-_this.state.lastX,deltaY=clientY-_this.state.lastY,_snapToGrid=(0,_utilsPositionFns.snapToGrid)(_this.props.grid,deltaX,deltaY),_snapToGrid2=_slicedToArray(_snapToGrid,2);if(deltaX=_snapToGrid2[0],deltaY=_snapToGrid2[1],!deltaX&&!deltaY)return;clientX=_this.state.lastX+deltaX,clientY=_this.state.lastY+deltaY}var coreEvent=(0,_utilsDomFns.createCoreEvent)(_this,clientX,clientY);(0,_utilsLog2["default"])("DraggableCore: handleDrag: %j",coreEvent.position);var shouldUpdate=_this.props.onDrag(e,coreEvent);return shouldUpdate===!1?void _this.handleDragStop({}):void _this.setState({lastX:clientX,lastY:clientY})}},this.handleDragStop=function(e){if(_this.state.dragging&&(!e.changedTouches||e.changedTouches[0].identifier===_this.state.touchIdentifier)){_this.props.enableUserSelectHack&&(0,_utilsDomFns.removeUserSelectStyles)();var _getControlPosition3=(0,_utilsPositionFns.getControlPosition)(e),clientX=_getControlPosition3.clientX,clientY=_getControlPosition3.clientY,coreEvent=(0,_utilsDomFns.createCoreEvent)(_this,clientX,clientY);(0,_utilsLog2["default"])("DraggableCore: handleDragStop: %j",coreEvent.position),_this.setState({dragging:!1,lastX:null,lastY:null}),_this.props.onStop(e,coreEvent),(0,_utilsLog2["default"])("DraggableCore: Removing handlers"),(0,_utilsDomFns.removeEvent)(document,"scroll",_this.handleScroll),(0,_utilsDomFns.removeEvent)(document,dragEventFor.move,_this.handleDrag),(0,_utilsDomFns.removeEvent)(document,dragEventFor.stop,_this.handleDragStop)}},this.handleScroll=function(e){var s=_this.state,x=document.body.scrollLeft,y=document.body.scrollTop,coreEvent=(0,_utilsDomFns.createCoreEvent)(_this);coreEvent.position.deltaX=x-s.scrollX,coreEvent.position.deltaY=y-s.scrollY,_this.setState({lastX:s.lastX+coreEvent.position.deltaX,lastY:s.lastY+coreEvent.position.deltaY}),_this.props.onDrag(e,coreEvent)},this.onMouseDown=function(e){return dragEventFor===eventsFor.touch?e.preventDefault():_this.handleDragStart(e)},this.onTouchStart=function(e){return dragEventFor=eventsFor.touch,_this.handleDragStart(e)}}return _inherits(DraggableCore,_React$Component),_createClass(DraggableCore,[{key:"componentWillUnmount",value:function(){(0,_utilsDomFns.removeEvent)(document,eventsFor.mouse.move,this.handleDrag),(0,_utilsDomFns.removeEvent)(document,eventsFor.touch.move,this.handleDrag),(0,_utilsDomFns.removeEvent)(document,eventsFor.mouse.stop,this.handleDragStop),(0,_utilsDomFns.removeEvent)(document,eventsFor.touch.stop,this.handleDragStop),(0,_utilsDomFns.removeEvent)(document,"scroll",this.handleScroll),this.props.enableUserSelectHack&&(0,_utilsDomFns.removeUserSelectStyles)()}},{key:"render",value:function(){return _react2["default"].cloneElement(_react2["default"].Children.only(this.props.children),{style:(0,_utilsDomFns.styleHacks)(this.props.children.props.style),onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onMouseUp:this.handleDragStop,onTouchEnd:this.handleDragStop})}}],[{key:"displayName",value:"DraggableCore",enumerable:!0},{key:"propTypes",value:{allowAnyClick:_react.PropTypes.bool,disabled:_react.PropTypes.bool,enableUserSelectHack:_react.PropTypes.bool,grid:_react.PropTypes.arrayOf(_react.PropTypes.number),handle:_react.PropTypes.string,cancel:_react.PropTypes.string,onStart:_react.PropTypes.func,onDrag:_react.PropTypes.func,onStop:_react.PropTypes.func,onMouseDown:_react.PropTypes.func,className:_utilsShims.dontSetMe,style:_utilsShims.dontSetMe,transform:_utilsShims.dontSetMe},enumerable:!0},{key:"defaultProps",value:{allowAnyClick:!1,cancel:null,disabled:!1,enableUserSelectHack:!0,handle:null,grid:null,transform:null,onStart:function(){},onDrag:function(){},onStop:function(){},onMouseDown:function(){}},enumerable:!0}]),DraggableCore}(_react2["default"].Component);exports["default"]=DraggableCore,module.exports=exports["default"]},function(module,exports,__webpack_require__){"use strict";function log(){}Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=log,module.exports=exports["default"]}])});
!function(root,factory){"object"==typeof exports&&"object"==typeof module?module.exports=factory(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","react-dom"],factory):"object"==typeof exports?exports.ReactDraggable=factory(require("react"),require("react-dom")):root.ReactDraggable=factory(root.React,root.ReactDOM)}(this,function(__WEBPACK_EXTERNAL_MODULE_2__,__WEBPACK_EXTERNAL_MODULE_3__){return function(modules){function __webpack_require__(moduleId){if(installedModules[moduleId])return installedModules[moduleId].exports;var module=installedModules[moduleId]={exports:{},id:moduleId,loaded:!1};return modules[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.loaded=!0,module.exports}var installedModules={};return __webpack_require__.m=modules,__webpack_require__.c=installedModules,__webpack_require__.p="",__webpack_require__(0)}([function(module,exports,__webpack_require__){"use strict";module.exports=__webpack_require__(1),module.exports.DraggableCore=__webpack_require__(10)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_slicedToArray=function(){function sliceIterator(arr,i){var _arr=[],_n=!0,_d=!1,_e=void 0;try{for(var _s,_i=arr[Symbol.iterator]();!(_n=(_s=_i.next()).done)&&(_arr.push(_s.value),!i||_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{!_n&&_i["return"]&&_i["return"]()}finally{if(_d)throw _e}}return _arr}return function(arr,i){if(Array.isArray(arr))return arr;if(Symbol.iterator in Object(arr))return sliceIterator(arr,i);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_get=function(_x,_x2,_x3){for(var _again=!0;_again;){var object=_x,property=_x2,receiver=_x3;_again=!1,null===object&&(object=Function.prototype);var desc=Object.getOwnPropertyDescriptor(object,property);if(void 0!==desc){if("value"in desc)return desc.value;var getter=desc.get;if(void 0===getter)return;return getter.call(receiver)}var parent=Object.getPrototypeOf(object);if(null===parent)return;_x=parent,_x2=property,_x3=receiver,_again=!0,desc=parent=void 0}},_react=__webpack_require__(2),_react2=_interopRequireDefault(_react),_reactDom=__webpack_require__(3),_reactDom2=_interopRequireDefault(_reactDom),_classnames=__webpack_require__(4),_classnames2=_interopRequireDefault(_classnames),_objectAssign=__webpack_require__(5),_objectAssign2=_interopRequireDefault(_objectAssign),_utilsDomFns=__webpack_require__(6),_utilsPositionFns=__webpack_require__(9),_utilsShims=__webpack_require__(7),_DraggableCore2=__webpack_require__(10),_DraggableCore3=_interopRequireDefault(_DraggableCore2),_utilsLog=__webpack_require__(11),_utilsLog2=_interopRequireDefault(_utilsLog),Draggable=function(_DraggableCore){function Draggable(){var _this=this;_classCallCheck(this,Draggable),_get(Object.getPrototypeOf(Draggable.prototype),"constructor",this).apply(this,arguments),this.state={dragging:!1,clientX:this.props.start.x,clientY:this.props.start.y,isElementSVG:!1},this.onDragStart=function(e,coreEvent){(0,_utilsLog2["default"])("Draggable: onDragStart: %j",coreEvent.position);var shouldStart=_this.props.onStart(e,(0,_utilsDomFns.createUIEvent)(_this,coreEvent));return shouldStart===!1?!1:void _this.setState({dragging:!0})},this.onDrag=function(e,coreEvent){if(!_this.state.dragging)return!1;(0,_utilsLog2["default"])("Draggable: onDrag: %j",coreEvent.position);var uiEvent=(0,_utilsDomFns.createUIEvent)(_this,coreEvent),shouldUpdate=_this.props.onDrag(e,uiEvent);if(shouldUpdate===!1)return!1;var newState={clientX:uiEvent.position.left,clientY:uiEvent.position.top};if(_this.props.bounds){var _getBoundPosition=(0,_utilsPositionFns.getBoundPosition)(_this,newState.clientX,newState.clientY),_getBoundPosition2=_slicedToArray(_getBoundPosition,2);newState.clientX=_getBoundPosition2[0],newState.clientY=_getBoundPosition2[1]}_this.setState(newState)},this.onDragStop=function(e,coreEvent){if(!_this.state.dragging)return!1;var shouldStop=_this.props.onStop(e,(0,_utilsDomFns.createUIEvent)(_this,coreEvent));return shouldStop===!1?!1:((0,_utilsLog2["default"])("Draggable: onDragStop: %j",coreEvent.position),void _this.setState({dragging:!1}))}}return _inherits(Draggable,_DraggableCore),_createClass(Draggable,[{key:"componentDidMount",value:function(){_reactDom2["default"].findDOMNode(this)instanceof SVGElement&&this.setState({isElementSVG:!0})}},{key:"render",value:function(){var style=void 0,svgTransform=null;style=(0,_utilsDomFns.createTransform)({x:(0,_utilsPositionFns.canDragX)(this)?this.state.clientX:this.props.start.x,y:(0,_utilsPositionFns.canDragY)(this)?this.state.clientY:this.props.start.y},this.state.isElementSVG),this.state.isElementSVG&&(svgTransform=style,style={}),this.state.dragging&&!isNaN(this.props.zIndex)&&(style.zIndex=this.props.zIndex);var className=(0,_classnames2["default"])(this.props.children.props.className||"","react-draggable",{"react-draggable-dragging":this.state.dragging,"react-draggable-dragged":this.state.dragged});return _react2["default"].createElement(_DraggableCore3["default"],_extends({},this.props,{onStart:this.onDragStart,onDrag:this.onDrag,onStop:this.onDragStop}),_react2["default"].cloneElement(_react2["default"].Children.only(this.props.children),{className:className,style:(0,_objectAssign2["default"])({},this.props.children.props.style,style),transform:svgTransform}))}}],[{key:"displayName",value:"Draggable",enumerable:!0},{key:"propTypes",value:(0,_objectAssign2["default"])({},_DraggableCore3["default"].propTypes,{axis:_react.PropTypes.oneOf(["both","x","y"]),bounds:_react.PropTypes.oneOfType([_react.PropTypes.shape({left:_react.PropTypes.Number,right:_react.PropTypes.Number,top:_react.PropTypes.Number,bottom:_react.PropTypes.Number}),_react.PropTypes.oneOf(["parent",!1])]),start:_react.PropTypes.shape({x:_react.PropTypes.number,y:_react.PropTypes.number}),zIndex:_react.PropTypes.number,className:_utilsShims.dontSetMe,style:_utilsShims.dontSetMe,transform:_utilsShims.dontSetMe}),enumerable:!0},{key:"defaultProps",value:(0,_objectAssign2["default"])({},_DraggableCore3["default"].defaultProps,{axis:"both",bounds:!1,start:{x:0,y:0},zIndex:NaN}),enumerable:!0}]),Draggable}(_DraggableCore3["default"]);exports["default"]=Draggable,module.exports=exports["default"]},function(module,exports){module.exports=__WEBPACK_EXTERNAL_MODULE_2__},function(module,exports){module.exports=__WEBPACK_EXTERNAL_MODULE_3__},function(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_RESULT__;!function(){"use strict";function classNames(){for(var classes="",i=0;i<arguments.length;i++){var arg=arguments[i];if(arg){var argType=typeof arg;if("string"===argType||"number"===argType)classes+=" "+arg;else if(Array.isArray(arg))classes+=" "+classNames.apply(null,arg);else if("object"===argType)for(var key in arg)hasOwn.call(arg,key)&&arg[key]&&(classes+=" "+key)}}return classes.substr(1)}var hasOwn={}.hasOwnProperty;"undefined"!=typeof module&&module.exports?module.exports=classNames:(__WEBPACK_AMD_DEFINE_RESULT__=function(){return classNames}.call(exports,__webpack_require__,exports,module),!(void 0!==__WEBPACK_AMD_DEFINE_RESULT__&&(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)))}()},function(module,exports){"use strict";function toObject(val){if(null===val||void 0===val)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(val)}var hasOwnProperty=Object.prototype.hasOwnProperty,propIsEnumerable=Object.prototype.propertyIsEnumerable;module.exports=Object.assign||function(target,source){for(var from,symbols,to=toObject(target),s=1;s<arguments.length;s++){from=Object(arguments[s]);for(var key in from)hasOwnProperty.call(from,key)&&(to[key]=from[key]);if(Object.getOwnPropertySymbols){symbols=Object.getOwnPropertySymbols(from);for(var i=0;i<symbols.length;i++)propIsEnumerable.call(from,symbols[i])&&(to[symbols[i]]=from[symbols[i]])}}return to}},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function matchesSelector(el,selector){if(!(el instanceof Node))throw new TypeError("Value of argument 'el' violates contract, expected Node got "+(null===el?"null":el instanceof Object&&el.constructor?el.constructor.name:typeof el));if("string"!=typeof selector)throw new TypeError("Value of argument 'selector' violates contract, expected string got "+(null===selector?"null":selector instanceof Object&&selector.constructor?selector.constructor.name:typeof selector));return matchesSelectorFunc||(matchesSelectorFunc=(0,_shims.findInArray)(["matches","webkitMatchesSelector","mozMatchesSelector","msMatchesSelector","oMatchesSelector"],function(method){return(0,_shims.isFunction)(el[method])})),el[matchesSelectorFunc].call(el,selector)}function addEvent(el,event,handler){if(null!=el&&!(el instanceof Node))throw new TypeError("Value of argument 'el' violates contract, expected null or Node got "+(null===el?"null":el instanceof Object&&el.constructor?el.constructor.name:typeof el));if("string"!=typeof event)throw new TypeError("Value of argument 'event' violates contract, expected string got "+(null===event?"null":event instanceof Object&&event.constructor?event.constructor.name:typeof event));if("function"!=typeof handler)throw new TypeError("Value of argument 'handler' violates contract, expected function got "+(null===handler?"null":handler instanceof Object&&handler.constructor?handler.constructor.name:typeof handler));el&&(el.attachEvent?el.attachEvent("on"+event,handler):el.addEventListener?el.addEventListener(event,handler,!0):el["on"+event]=handler)}function removeEvent(el,event,handler){if(null!=el&&!(el instanceof Node))throw new TypeError("Value of argument 'el' violates contract, expected null or Node got "+(null===el?"null":el instanceof Object&&el.constructor?el.constructor.name:typeof el));if("string"!=typeof event)throw new TypeError("Value of argument 'event' violates contract, expected string got "+(null===event?"null":event instanceof Object&&event.constructor?event.constructor.name:typeof event));if("function"!=typeof handler)throw new TypeError("Value of argument 'handler' violates contract, expected function got "+(null===handler?"null":handler instanceof Object&&handler.constructor?handler.constructor.name:typeof handler));el&&(el.detachEvent?el.detachEvent("on"+event,handler):el.removeEventListener?el.removeEventListener(event,handler,!0):el["on"+event]=null)}function outerHeight(node){if(!(node instanceof Node))throw new TypeError("Value of argument 'node' violates contract, expected Node got "+(null===node?"null":node instanceof Object&&node.constructor?node.constructor.name:typeof node));var height=node.clientHeight,computedStyle=window.getComputedStyle(node);return height+=(0,_shims["int"])(computedStyle.borderTopWidth),height+=(0,_shims["int"])(computedStyle.borderBottomWidth)}function outerWidth(node){if(!(node instanceof Node))throw new TypeError("Value of argument 'node' violates contract, expected Node got "+(null===node?"null":node instanceof Object&&node.constructor?node.constructor.name:typeof node));var width=node.clientWidth,computedStyle=window.getComputedStyle(node);return width+=(0,_shims["int"])(computedStyle.borderLeftWidth),width+=(0,_shims["int"])(computedStyle.borderRightWidth)}function innerHeight(node){if(!(node instanceof Node))throw new TypeError("Value of argument 'node' violates contract, expected Node got "+(null===node?"null":node instanceof Object&&node.constructor?node.constructor.name:typeof node));var height=node.clientHeight,computedStyle=window.getComputedStyle(node);return height-=(0,_shims["int"])(computedStyle.paddingTop),height-=(0,_shims["int"])(computedStyle.paddingBottom)}function innerWidth(node){if(!(node instanceof Node))throw new TypeError("Value of argument 'node' violates contract, expected Node got "+(null===node?"null":node instanceof Object&&node.constructor?node.constructor.name:typeof node));var width=node.clientWidth,computedStyle=window.getComputedStyle(node);return width-=(0,_shims["int"])(computedStyle.paddingLeft),width-=(0,_shims["int"])(computedStyle.paddingRight)}function createTransform(position,isSVG){if("object"!=typeof position)throw new TypeError("Value of argument 'position' violates contract, expected object got "+(null===position?"null":position instanceof Object&&position.constructor?position.constructor.name:typeof position));if(null!=isSVG&&"boolean"!=typeof isSVG)throw new TypeError("Value of argument 'isSVG' violates contract, expected null or boolean got "+(null===isSVG?"null":isSVG instanceof Object&&isSVG.constructor?isSVG.constructor.name:typeof isSVG));return isSVG?createSVGTransform(position):createCSSTransform(position)}function createCSSTransform(_ref){var x=_ref.x,y=_ref.y;return function(){if(null==={x:x,y:y}||"object"!=typeof{x:x,y:y}||"number"!=typeof{x:x,y:y}.x||"number"!=typeof{x:x,y:y}.y)throw new TypeError("Value of argument 'undefined' violates contract, expected Object with properties x and y got "+(null==={x:x,y:y}?"null":{x:x,y:y}instanceof Object&&{x:x,y:y}.constructor?{x:x,y:y}.constructor.name:typeof{x:x,y:y}));var out={transform:"translate("+x+"px,"+y+"px)"};return _getPrefix2["default"]&&(out[_getPrefix2["default"]+"Transform"]=out.transform),out}()}function createSVGTransform(_ref2){var x=_ref2.x,y=_ref2.y;return function(){if(null==={x:x,y:y}||"object"!=typeof{x:x,y:y}||"number"!=typeof{x:x,y:y}.x||"number"!=typeof{x:x,y:y}.y)throw new TypeError("Value of argument 'undefined' violates contract, expected Object with properties x and y got "+(null==={x:x,y:y}?"null":{x:x,y:y}instanceof Object&&{x:x,y:y}.constructor?{x:x,y:y}.constructor.name:typeof{x:x,y:y}));return"translate("+x+","+y+")"}()}function addUserSelectStyles(){var style=document.body.getAttribute("style")||"";document.body.setAttribute("style",style+userSelectStyle)}function removeUserSelectStyles(){var style=document.body.getAttribute("style")||"";document.body.setAttribute("style",style.replace(userSelectStyle,""))}function styleHacks(){var childStyle=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],touchHacks={touchAction:"none"};return(0,_objectAssign2["default"])(touchHacks,childStyle)}function createCoreEvent(draggable,clientX,clientY){var state=draggable._pendingState||draggable.state,isStart=!(0,_shims.isNum)(state.lastX);return{node:_reactDom2["default"].findDOMNode(draggable),position:isStart?{deltaX:0,deltaY:0,lastX:clientX,lastY:clientY,clientX:clientX,clientY:clientY}:{deltaX:clientX-state.lastX,deltaY:clientY-state.lastY,lastX:state.lastX,lastY:state.lastY,clientX:clientX,clientY:clientY}}}function createUIEvent(draggable,coreEvent){return{node:_reactDom2["default"].findDOMNode(draggable),position:{left:draggable.state.clientX+coreEvent.position.deltaX,top:draggable.state.clientY+coreEvent.position.deltaY},deltaX:coreEvent.position.deltaX,deltaY:coreEvent.position.deltaY}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.matchesSelector=matchesSelector,exports.addEvent=addEvent,exports.removeEvent=removeEvent,exports.outerHeight=outerHeight,exports.outerWidth=outerWidth,exports.innerHeight=innerHeight,exports.innerWidth=innerWidth,exports.createTransform=createTransform,exports.createCSSTransform=createCSSTransform,exports.createSVGTransform=createSVGTransform,exports.addUserSelectStyles=addUserSelectStyles,exports.removeUserSelectStyles=removeUserSelectStyles,exports.styleHacks=styleHacks,exports.createCoreEvent=createCoreEvent,exports.createUIEvent=createUIEvent;var _shims=__webpack_require__(7),_getPrefix=__webpack_require__(8),_getPrefix2=_interopRequireDefault(_getPrefix),_objectAssign=__webpack_require__(5),_objectAssign2=_interopRequireDefault(_objectAssign),_reactDom=__webpack_require__(3),_reactDom2=_interopRequireDefault(_reactDom),matchesSelectorFunc="",userSelectStyle=";user-select: none;";_getPrefix2["default"]&&(userSelectStyle+="-"+_getPrefix2["default"].toLowerCase()+"-user-select: none;")},function(module,exports){"use strict";function findInArray(array,callback){for(var i=0,_length=array.length;_length>i;i++)if(callback.apply(callback,[array[i],i,array]))return array[i]}function isFunction(func){return"function"==typeof func||"[object Function]"===Object.prototype.toString.call(func)}function isNum(num){return"number"==typeof num&&!isNaN(num)}function int(a){return parseInt(a,10)}function dontSetMe(props,propName,componentName){if(props[propName])throw new Error("Invalid prop "+propName+" passed to "+componentName+" - do not set this, set it on the child.")}Object.defineProperty(exports,"__esModule",{value:!0}),exports.findInArray=findInArray,exports.isFunction=isFunction,exports.isNum=isNum,exports["int"]=int,exports.dontSetMe=dontSetMe},function(module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=function(){if("undefined"==typeof window)return"";var styles=window.getComputedStyle(document.documentElement,""),pre=(Array.prototype.slice.call(styles).join("").match(/-(moz|webkit|ms)-/)||""===styles.OLink&&["","o"])[1];return void 0===pre||null===pre?"":"ms"===pre?pre:void 0===pre||null===pre?"":pre.slice(0,1).toUpperCase()+pre.slice(1)}(),module.exports=exports["default"]},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function getBoundPosition(draggable,clientX,clientY){if(!draggable.props.bounds)return[clientX,clientY];var bounds=JSON.parse(JSON.stringify(draggable.props.bounds)),node=_reactDom2["default"].findDOMNode(draggable),parent=node.parentNode;if("parent"===bounds){var nodeStyle=window.getComputedStyle(node),parentStyle=window.getComputedStyle(parent);bounds={left:-node.offsetLeft+(0,_shims["int"])(parentStyle.paddingLeft)+(0,_shims["int"])(nodeStyle.borderLeftWidth)+(0,_shims["int"])(nodeStyle.marginLeft),top:-node.offsetTop+(0,_shims["int"])(parentStyle.paddingTop)+(0,_shims["int"])(nodeStyle.borderTopWidth)+(0,_shims["int"])(nodeStyle.marginTop),right:(0,_domFns.innerWidth)(parent)-(0,_domFns.outerWidth)(node)-node.offsetLeft,bottom:(0,_domFns.innerHeight)(parent)-(0,_domFns.outerHeight)(node)-node.offsetTop}}return(0,_shims.isNum)(bounds.right)&&(clientX=Math.min(clientX,bounds.right)),(0,_shims.isNum)(bounds.bottom)&&(clientY=Math.min(clientY,bounds.bottom)),(0,_shims.isNum)(bounds.left)&&(clientX=Math.max(clientX,bounds.left)),(0,_shims.isNum)(bounds.top)&&(clientY=Math.max(clientY,bounds.top)),[clientX,clientY]}function snapToGrid(grid,pendingX,pendingY){var x=Math.round(pendingX/grid[0])*grid[0],y=Math.round(pendingY/grid[1])*grid[1];return[x,y]}function canDragX(draggable){return"both"===draggable.props.axis||"x"===draggable.props.axis}function canDragY(draggable){return"both"===draggable.props.axis||"y"===draggable.props.axis}function getControlPosition(e){var position=e.targetTouches&&e.targetTouches[0]||e;return{clientX:position.clientX,clientY:position.clientY}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.getBoundPosition=getBoundPosition,exports.snapToGrid=snapToGrid,exports.canDragX=canDragX,exports.canDragY=canDragY,exports.getControlPosition=getControlPosition;var _shims=__webpack_require__(7),_reactDom=__webpack_require__(3),_reactDom2=_interopRequireDefault(_reactDom),_domFns=__webpack_require__(6)},function(module,exports,__webpack_require__){"use strict";function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}function _inherits(subClass,superClass){if("function"!=typeof superClass&&null!==superClass)throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}Object.defineProperty(exports,"__esModule",{value:!0});var _slicedToArray=function(){function sliceIterator(arr,i){var _arr=[],_n=!0,_d=!1,_e=void 0;try{for(var _s,_i=arr[Symbol.iterator]();!(_n=(_s=_i.next()).done)&&(_arr.push(_s.value),!i||_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{!_n&&_i["return"]&&_i["return"]()}finally{if(_d)throw _e}}return _arr}return function(arr,i){if(Array.isArray(arr))return arr;if(Symbol.iterator in Object(arr))return sliceIterator(arr,i);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),_createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_get=function(_x,_x2,_x3){for(var _again=!0;_again;){var object=_x,property=_x2,receiver=_x3;_again=!1,null===object&&(object=Function.prototype);var desc=Object.getOwnPropertyDescriptor(object,property);if(void 0!==desc){if("value"in desc)return desc.value;var getter=desc.get;if(void 0===getter)return;return getter.call(receiver)}var parent=Object.getPrototypeOf(object);if(null===parent)return;_x=parent,_x2=property,_x3=receiver,_again=!0,desc=parent=void 0}},_react=__webpack_require__(2),_react2=_interopRequireDefault(_react),_utilsDomFns=__webpack_require__(6),_utilsPositionFns=__webpack_require__(9),_utilsShims=__webpack_require__(7),_utilsLog=__webpack_require__(11),_utilsLog2=_interopRequireDefault(_utilsLog),eventsFor={touch:{start:"touchstart",move:"touchmove",stop:"touchend"},mouse:{start:"mousedown",move:"mousemove",stop:"mouseup"}},dragEventFor=eventsFor.mouse,DraggableCore=function(_React$Component){function DraggableCore(){var _this=this;_classCallCheck(this,DraggableCore),_get(Object.getPrototypeOf(DraggableCore.prototype),"constructor",this).apply(this,arguments),this.state={dragging:!1,lastX:null,lastY:null},this.handleDragStart=function(e){if(_this.props.onMouseDown(e),!_this.props.allowAnyClick&&"number"==typeof e.button&&0!==e.button)return!1;if(!(_this.props.disabled||_this.props.handle&&!(0,_utilsDomFns.matchesSelector)(e.target,_this.props.handle)||_this.props.cancel&&(0,_utilsDomFns.matchesSelector)(e.target,_this.props.cancel))){e.targetTouches&&_this.setState({touchIdentifier:e.targetTouches[0].identifier}),_this.props.enableUserSelectHack&&(0,_utilsDomFns.addUserSelectStyles)();var _getControlPosition=(0,_utilsPositionFns.getControlPosition)(e),clientX=_getControlPosition.clientX,clientY=_getControlPosition.clientY,coreEvent=(0,_utilsDomFns.createCoreEvent)(_this,clientX,clientY);(0,_utilsLog2["default"])("DraggableCore: handleDragStart: %j",coreEvent.position),(0,_utilsLog2["default"])("calling",_this.props.onStart);var shouldUpdate=_this.props.onStart(e,coreEvent);shouldUpdate!==!1&&(_this.setState({dragging:!0,lastX:clientX,lastY:clientY,scrollX:document.body.scrollLeft,scrollY:document.body.scrollTop}),(0,_utilsDomFns.addEvent)(document,"scroll",_this.handleScroll),(0,_utilsDomFns.addEvent)(document,dragEventFor.move,_this.handleDrag),(0,_utilsDomFns.addEvent)(document,dragEventFor.stop,_this.handleDragStop))}},this.handleDrag=function(e){if(!e.targetTouches||e.targetTouches[0].identifier===_this.state.touchIdentifier){var _getControlPosition2=(0,_utilsPositionFns.getControlPosition)(e),clientX=_getControlPosition2.clientX,clientY=_getControlPosition2.clientY;if(Array.isArray(_this.props.grid)){var deltaX=clientX-_this.state.lastX,deltaY=clientY-_this.state.lastY,_snapToGrid=(0,_utilsPositionFns.snapToGrid)(_this.props.grid,deltaX,deltaY),_snapToGrid2=_slicedToArray(_snapToGrid,2);if(deltaX=_snapToGrid2[0],deltaY=_snapToGrid2[1],!deltaX&&!deltaY)return;clientX=_this.state.lastX+deltaX,clientY=_this.state.lastY+deltaY}var coreEvent=(0,_utilsDomFns.createCoreEvent)(_this,clientX,clientY);(0,_utilsLog2["default"])("DraggableCore: handleDrag: %j",coreEvent.position);var shouldUpdate=_this.props.onDrag(e,coreEvent);return shouldUpdate===!1?void _this.handleDragStop({}):void _this.setState({lastX:clientX,lastY:clientY})}},this.handleDragStop=function(e){if(_this.state.dragging&&(!e.changedTouches||e.changedTouches[0].identifier===_this.state.touchIdentifier)){_this.props.enableUserSelectHack&&(0,_utilsDomFns.removeUserSelectStyles)();var _getControlPosition3=(0,_utilsPositionFns.getControlPosition)(e),clientX=_getControlPosition3.clientX,clientY=_getControlPosition3.clientY,coreEvent=(0,_utilsDomFns.createCoreEvent)(_this,clientX,clientY);(0,_utilsLog2["default"])("DraggableCore: handleDragStop: %j",coreEvent.position),_this.setState({dragging:!1,lastX:null,lastY:null}),_this.props.onStop(e,coreEvent),(0,_utilsLog2["default"])("DraggableCore: Removing handlers"),(0,_utilsDomFns.removeEvent)(document,"scroll",_this.handleScroll),(0,_utilsDomFns.removeEvent)(document,dragEventFor.move,_this.handleDrag),(0,_utilsDomFns.removeEvent)(document,dragEventFor.stop,_this.handleDragStop)}},this.handleScroll=function(e){var s=_this.state,x=document.body.scrollLeft,y=document.body.scrollTop,coreEvent=(0,_utilsDomFns.createCoreEvent)(_this);coreEvent.position.deltaX=x-s.scrollX,coreEvent.position.deltaY=y-s.scrollY,_this.setState({lastX:s.lastX+coreEvent.position.deltaX,lastY:s.lastY+coreEvent.position.deltaY}),_this.props.onDrag(e,coreEvent)},this.onMouseDown=function(e){return dragEventFor===eventsFor.touch?e.preventDefault():_this.handleDragStart(e)},this.onTouchStart=function(e){return dragEventFor=eventsFor.touch,_this.handleDragStart(e)}}return _inherits(DraggableCore,_React$Component),_createClass(DraggableCore,[{key:"componentWillUnmount",value:function(){(0,_utilsDomFns.removeEvent)(document,eventsFor.mouse.move,this.handleDrag),(0,_utilsDomFns.removeEvent)(document,eventsFor.touch.move,this.handleDrag),(0,_utilsDomFns.removeEvent)(document,eventsFor.mouse.stop,this.handleDragStop),(0,_utilsDomFns.removeEvent)(document,eventsFor.touch.stop,this.handleDragStop),(0,_utilsDomFns.removeEvent)(document,"scroll",this.handleScroll),this.props.enableUserSelectHack&&(0,_utilsDomFns.removeUserSelectStyles)()}},{key:"render",value:function(){return _react2["default"].cloneElement(_react2["default"].Children.only(this.props.children),{style:(0,_utilsDomFns.styleHacks)(this.props.children.props.style),onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,onMouseUp:this.handleDragStop,onTouchEnd:this.handleDragStop})}}],[{key:"displayName",value:"DraggableCore",enumerable:!0},{key:"propTypes",value:{allowAnyClick:_react.PropTypes.bool,disabled:_react.PropTypes.bool,enableUserSelectHack:_react.PropTypes.bool,grid:_react.PropTypes.arrayOf(_react.PropTypes.number),handle:_react.PropTypes.string,cancel:_react.PropTypes.string,onStart:_react.PropTypes.func,onDrag:_react.PropTypes.func,onStop:_react.PropTypes.func,onMouseDown:_react.PropTypes.func,className:_utilsShims.dontSetMe,style:_utilsShims.dontSetMe,transform:_utilsShims.dontSetMe},enumerable:!0},{key:"defaultProps",value:{allowAnyClick:!1,cancel:null,disabled:!1,enableUserSelectHack:!0,handle:null,grid:null,transform:null,onStart:function(){},onDrag:function(){},onStop:function(){},onMouseDown:function(){}},enumerable:!0}]),DraggableCore}(_react2["default"].Component);exports["default"]=DraggableCore,module.exports=exports["default"]},function(module,exports,__webpack_require__){"use strict";function log(){}Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=log,module.exports=exports["default"]}])});
//# sourceMappingURL=dist/react-draggable.min.js

2

package.json
{
"name": "react-draggable",
"version": "1.1.1",
"version": "1.1.2",
"description": "React draggable component",

@@ -5,0 +5,0 @@ "main": "dist/react-draggable.js",

3

README.md

@@ -58,3 +58,3 @@ # React-Draggable [![Build Status](https://travis-ci.org/mzabriskie/react-draggable.svg?branch=master)](https://travis-ci.org/mzabriskie/react-draggable)

// dragging will cancel.
// These callbacks are called with the arity
// These callbacks are called with the arity:
// (event: Event,

@@ -155,3 +155,2 @@ // {

start={{x: 0, y: 0}}
moveOnStartChange={false}
grid={[25, 25]}

@@ -158,0 +157,0 @@ zIndex={100}

dist/react-draggable.js.map

Sorry, the diff of this file is not supported yet

dist/react-draggable.min.js.map

Sorry, the diff of this file is not supported yet

lib/Draggable.es6

Sorry, the diff of this file is not supported yet

lib/utils/domFns.es6

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc