react-element-pan - npm Package Compare versions

react-element-pan

Package Overview

Dependencies

Maintainers

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 1.0.4 to 1.0.5

package.json

		{
		"name": "react-element-pan",
		"version": "1.0.4",
		"version": "1.0.5",
		"description": "React component for allowing panning of DOM-elements too large for their container, in a Google Maps-like way.",
		@@ -5,0 +5,0 @@ "main": "src/element-pan.js",

umd/element-pan.js

		(function webpackUniversalModuleDefinition(root, factory) {
		if(typeof exports === 'object' && typeof module === 'object')
		module.exports = factory(require("React"));
		module.exports = factory(require("react"));
		else if(typeof define === 'function' && define.amd)
		define(["React"], factory);
		define(["react"], factory);
		else if(typeof exports === 'object')
		exports["reactElementPan"] = factory(require("React"));
		exports["reactElementPan"] = factory(require("react"));
		else
		@@ -9,0 +9,0 @@ root["reactElementPan"] = factory(root["React"]);

umd/element-pan.min.js

		@@ -1,1 +0,1 @@
		!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("React")):"function"==typeof define&&define.amd?define(["React"],e):"object"==typeof exports?exports.reactElementPan=e(require("React")):t.reactElementPan=e(t.React)}(this,function(t){return function(t){function e(n){if(o[n])return o[n].exports;var s=o[n]={exports:{},id:n,loaded:!1};return t[n].call(s.exports,s,s.exports,e),s.loaded=!0,s.exports}var o={};return e.m=t,e.c=o,e.p="",e(0)}([function(t,e,o){"use strict";var n=o(2),s=o(1),i=n.PropTypes,r=n.createClass({displayName:"ElementPan",propTypes:{className:i.string,onPanStart:i.func,onPan:i.func,onPanStop:i.func,startX:i.number,startY:i.number},getDefaultProps:function(){return{className:"element-pan"}},getInitialState:function(){return{dragging:!1}},onDragStart:function(t){t.preventDefault(),s.add(window,"mousemove",this.onDragMove),s.add(window,"touchmove",this.onDragMove),s.add(window,"mouseup",this.onDragStop),s.add(window,"touchend",this.onDragStop);var e,o=t.currentTarget\|\|t.target;e=o.childNodes.length>1?{width:o.scrollWidth,height:o.scrollHeight}:t.target.getBoundingClientRect();var n="undefined"==typeof t.clientX?t.changedTouches[0].clientX:t.clientX,i="undefined"==typeof t.clientY?t.changedTouches[0].clientY:t.clientY,r={dragging:!0,elHeight:this.el.clientHeight,elWidth:this.el.clientWidth,startX:n,startY:i,scrollX:this.el.scrollLeft,scrollY:this.el.scrollTop,maxX:e.width,maxY:e.height};this.setState(r),this.props.onPanStart&&this.props.onPanStart(r)},onDragMove:function(t){if(this.state.dragging){var e="undefined"==typeof t.clientX?t.changedTouches[0].clientX:t.clientX,o="undefined"==typeof t.clientY?t.changedTouches[0].clientY:t.clientY;this.el.scrollLeft=Math.min(this.state.maxX-this.state.elWidth,this.state.scrollX-(e-this.state.startX)),this.el.scrollTop=Math.min(this.state.maxY-this.state.elHeight,this.state.scrollY-(o-this.state.startY)),this.props.onPan&&this.props.onPan({x:this.el.scrollLeft,y:this.el.scrollTop})}},onDragStop:function(){this.setState({dragging:!1}),s.remove(window,"mousemove",this.onDragMove),s.remove(window,"touchmove",this.onDragMove),s.remove(window,"mouseup",this.onDragStop),s.remove(window,"touchend",this.onDragStop),this.props.onPanStop&&this.props.onPanStop({x:this.el.scrollLeft,y:this.el.scrollTop})},componentDidMount:function(){this.el=this.refs.container,this.el instanceof window.Node\|\|(this.el=this.el.getDOMNode()),this.props.startX&&(this.el.scrollLeft=this.props.startX),this.props.startY&&(this.el.scrollTop=this.props.startY)},render:function(){return n.DOM.div({ref:"container",className:this.props.className,style:{overflow:"hidden",cursor:"move"},onMouseDown:this.onDragStart,onTouchStart:this.onDragStart},this.props.children)}});t.exports=r},function(t,e,o){var n,s;!function(i,r){n=r,s="function"==typeof n?n.call(e,o,e,t):n,!(void 0!==s&&(t.exports=s))}(this,function(){function t(t,e){return function(o,n,s,i){o[t]?o[t](n,s,i):o[e]&&o[e]("on"+n,s)}}return{add:t("addEventListener","attachEvent"),remove:t("removeEventListener","detachEvent")}})},function(e,o){e.exports=t}])});
		!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports.reactElementPan=e(require("react")):t.reactElementPan=e(t.React)}(this,function(t){return function(t){function e(n){if(o[n])return o[n].exports;var s=o[n]={exports:{},id:n,loaded:!1};return t[n].call(s.exports,s,s.exports,e),s.loaded=!0,s.exports}var o={};return e.m=t,e.c=o,e.p="",e(0)}([function(t,e,o){"use strict";var n=o(2),s=o(1),i=n.PropTypes,r=n.createClass({displayName:"ElementPan",propTypes:{className:i.string,onPanStart:i.func,onPan:i.func,onPanStop:i.func,startX:i.number,startY:i.number},getDefaultProps:function(){return{className:"element-pan"}},getInitialState:function(){return{dragging:!1}},onDragStart:function(t){t.preventDefault(),s.add(window,"mousemove",this.onDragMove),s.add(window,"touchmove",this.onDragMove),s.add(window,"mouseup",this.onDragStop),s.add(window,"touchend",this.onDragStop);var e,o=t.currentTarget\|\|t.target;e=o.childNodes.length>1?{width:o.scrollWidth,height:o.scrollHeight}:t.target.getBoundingClientRect();var n="undefined"==typeof t.clientX?t.changedTouches[0].clientX:t.clientX,i="undefined"==typeof t.clientY?t.changedTouches[0].clientY:t.clientY,r={dragging:!0,elHeight:this.el.clientHeight,elWidth:this.el.clientWidth,startX:n,startY:i,scrollX:this.el.scrollLeft,scrollY:this.el.scrollTop,maxX:e.width,maxY:e.height};this.setState(r),this.props.onPanStart&&this.props.onPanStart(r)},onDragMove:function(t){if(this.state.dragging){var e="undefined"==typeof t.clientX?t.changedTouches[0].clientX:t.clientX,o="undefined"==typeof t.clientY?t.changedTouches[0].clientY:t.clientY;this.el.scrollLeft=Math.min(this.state.maxX-this.state.elWidth,this.state.scrollX-(e-this.state.startX)),this.el.scrollTop=Math.min(this.state.maxY-this.state.elHeight,this.state.scrollY-(o-this.state.startY)),this.props.onPan&&this.props.onPan({x:this.el.scrollLeft,y:this.el.scrollTop})}},onDragStop:function(){this.setState({dragging:!1}),s.remove(window,"mousemove",this.onDragMove),s.remove(window,"touchmove",this.onDragMove),s.remove(window,"mouseup",this.onDragStop),s.remove(window,"touchend",this.onDragStop),this.props.onPanStop&&this.props.onPanStop({x:this.el.scrollLeft,y:this.el.scrollTop})},componentDidMount:function(){this.el=this.refs.container,this.el instanceof window.Node\|\|(this.el=this.el.getDOMNode()),this.props.startX&&(this.el.scrollLeft=this.props.startX),this.props.startY&&(this.el.scrollTop=this.props.startY)},render:function(){return n.DOM.div({ref:"container",className:this.props.className,style:{overflow:"hidden",cursor:"move"},onMouseDown:this.onDragStart,onTouchStart:this.onDragStart},this.props.children)}});t.exports=r},function(t,e,o){var n,s;!function(i,r){n=r,s="function"==typeof n?n.call(e,o,e,t):n,!(void 0!==s&&(t.exports=s))}(this,function(){function t(t,e){return function(o,n,s,i){o[t]?o[t](n,s,i):o[e]&&o[e]("on"+n,s)}}return{add:t("addEventListener","attachEvent"),remove:t("removeEventListener","detachEvent")}})},function(e,o){e.exports=t}])});