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

react-point

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-point - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

lib/PointTarget.js

110

lib/index.js
'use strict';
exports.__esModule = true;
exports.PointTarget = undefined;
var _react = require('react');
var _PointTarget2 = require('./PointTarget');
var _react2 = _interopRequireDefault(_react);
var _PointTarget3 = _interopRequireDefault(_PointTarget2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { 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: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var touchX = function touchX(event) {
return event.touches[0].clientX;
};
var touchY = function touchY(event) {
return event.touches[0].clientY;
};
var Point = function (_React$Component) {
_inherits(Point, _React$Component);
function Point() {
_classCallCheck(this, Point);
return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
}
Point.prototype.handleClick = function handleClick() {
if (!this.usingTouch && this.props.onPoint) this.props.onPoint();
};
Point.prototype.handleTouchStart = function handleTouchStart(event) {
this.usingTouch = true;
if (this.touchStarted) return;
this.touchStarted = true;
this.touchMoved = false;
this.startX = touchX(event);
this.startY = touchY(event);
};
Point.prototype.handleTouchMove = function handleTouchMove(event) {
if (!this.touchMoved) {
var tolerance = this.props.tolerance;
this.touchMoved = Math.abs(this.startX - touchX(event)) > tolerance || Math.abs(this.startY - touchY(event)) > tolerance;
}
};
Point.prototype.handleTouchCancel = function handleTouchCancel() {
this.touchStarted = this.touchMoved = false;
this.startX = this.startY = 0;
};
Point.prototype.handleTouchEnd = function handleTouchEnd() {
this.touchStarted = false;
if (!this.touchMoved && this.props.onPoint) this.props.onPoint();
};
Point.prototype.componentWillMount = function componentWillMount() {
this.usingTouch = false;
// I, for one, welcome our new manual binding overlords.
this.handleClick = this.handleClick.bind(this);
this.handleTouchStart = this.handleTouchStart.bind(this);
this.handleTouchMove = this.handleTouchMove.bind(this);
this.handleTouchCancel = this.handleTouchCancel.bind(this);
this.handleTouchEnd = this.handleTouchEnd.bind(this);
};
Point.prototype.render = function render() {
var _props = this.props;
var component = _props.component;
var props = _objectWithoutProperties(_props, ['component']);
// Let React setup event handlers for us.
// TODO: Warn if they try to pass these props in?
props.onClick = this.handleClick;
props.onTouchStart = this.handleTouchStart;
props.onTouchMove = this.handleTouchMove;
props.onTouchCancel = this.handleTouchCancel;
props.onTouchEnd = this.handleTouchEnd;
return _react2.default.createElement(component, props);
};
return Point;
}(_react2.default.Component);
Point.propTypes = {
component: _react.PropTypes.oneOfType([_react.PropTypes.func, _react.PropTypes.string]).isRequired,
tolerance: _react.PropTypes.number,
onPoint: _react.PropTypes.func
};
Point.defaultProps = {
component: 'div',
tolerance: 10
};
exports.default = Point;
exports.PointTarget = _PointTarget3.default;

2

package.json
{
"name": "react-point",
"version": "1.0.0",
"version": "1.0.1",
"description": "A minimal click/tap component for React",

@@ -5,0 +5,0 @@ "repository": "mjackson/react-point",

55

umd/react-point.js

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

root["ReactPoint"] = factory(root["React"]);
})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {
})(this, function(__WEBPACK_EXTERNAL_MODULE_2__) {
return /******/ (function(modules) { // webpackBootstrap

@@ -61,5 +61,22 @@ /******/ // The module cache

exports.__esModule = true;
exports.PointTarget = undefined;
var _react = __webpack_require__(1);
var _PointTarget2 = __webpack_require__(1);
var _PointTarget3 = _interopRequireDefault(_PointTarget2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.PointTarget = _PointTarget3.default;
/***/ },
/* 1 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _react = __webpack_require__(2);
var _react2 = _interopRequireDefault(_react);

@@ -85,7 +102,7 @@

var Point = function (_React$Component) {
_inherits(Point, _React$Component);
var PointTarget = function (_React$Component) {
_inherits(PointTarget, _React$Component);
function Point() {
_classCallCheck(this, Point);
function PointTarget() {
_classCallCheck(this, PointTarget);

@@ -95,7 +112,7 @@ return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));

Point.prototype.handleClick = function handleClick() {
PointTarget.prototype.handleClick = function handleClick() {
if (!this.usingTouch && this.props.onPoint) this.props.onPoint();
};
Point.prototype.handleTouchStart = function handleTouchStart(event) {
PointTarget.prototype.handleTouchStart = function handleTouchStart(event) {
this.usingTouch = true;

@@ -112,3 +129,3 @@

Point.prototype.handleTouchMove = function handleTouchMove(event) {
PointTarget.prototype.handleTouchMove = function handleTouchMove(event) {
if (!this.touchMoved) {

@@ -122,3 +139,3 @@ var tolerance = this.props.tolerance;

Point.prototype.handleTouchCancel = function handleTouchCancel() {
PointTarget.prototype.handleTouchCancel = function handleTouchCancel() {
this.touchStarted = this.touchMoved = false;

@@ -128,3 +145,3 @@ this.startX = this.startY = 0;

Point.prototype.handleTouchEnd = function handleTouchEnd() {
PointTarget.prototype.handleTouchEnd = function handleTouchEnd() {
this.touchStarted = false;

@@ -135,3 +152,3 @@

Point.prototype.componentWillMount = function componentWillMount() {
PointTarget.prototype.componentWillMount = function componentWillMount() {
this.usingTouch = false;

@@ -147,3 +164,3 @@

Point.prototype.render = function render() {
PointTarget.prototype.render = function render() {
var _props = this.props;

@@ -167,6 +184,6 @@ var component = _props.component;

return Point;
return PointTarget;
}(_react2.default.Component);
Point.propTypes = {
PointTarget.propTypes = {
component: _react.PropTypes.oneOfType([_react.PropTypes.func, _react.PropTypes.string]).isRequired,

@@ -176,13 +193,13 @@ tolerance: _react.PropTypes.number,

};
Point.defaultProps = {
PointTarget.defaultProps = {
component: 'div',
tolerance: 10
};
exports.default = Point;
exports.default = PointTarget;
/***/ },
/* 1 */
/* 2 */
/***/ function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
module.exports = __WEBPACK_EXTERNAL_MODULE_2__;

@@ -189,0 +206,0 @@ /***/ }

2

umd/react-point.min.js

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

!function(t,o){"object"==typeof exports&&"object"==typeof module?module.exports=o(require("react")):"function"==typeof define&&define.amd?define(["react"],o):"object"==typeof exports?exports.ReactPoint=o(require("react")):t.ReactPoint=o(t.React)}(this,function(t){return function(t){function o(n){if(e[n])return e[n].exports;var i=e[n]={exports:{},id:n,loaded:!1};return t[n].call(i.exports,i,i.exports,o),i.loaded=!0,i.exports}var e={};return o.m=t,o.c=e,o.p="",o(0)}([function(t,o,e){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function i(t,o){var e={};for(var n in t)o.indexOf(n)>=0||Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e}function r(t,o){if(!(t instanceof o))throw new TypeError("Cannot call a class as a function")}function h(t,o){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!o||"object"!=typeof o&&"function"!=typeof o?t:o}function c(t,o){if("function"!=typeof o&&null!==o)throw new TypeError("Super expression must either be null or a function, not "+typeof o);t.prototype=Object.create(o&&o.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),o&&(Object.setPrototypeOf?Object.setPrototypeOf(t,o):t.__proto__=o)}o.__esModule=!0;var s=e(1),u=n(s),a=function(t){return t.touches[0].clientX},p=function(t){return t.touches[0].clientY},l=function(t){function o(){return r(this,o),h(this,t.apply(this,arguments))}return c(o,t),o.prototype.handleClick=function(){!this.usingTouch&&this.props.onPoint&&this.props.onPoint()},o.prototype.handleTouchStart=function(t){this.usingTouch=!0,this.touchStarted||(this.touchStarted=!0,this.touchMoved=!1,this.startX=a(t),this.startY=p(t))},o.prototype.handleTouchMove=function(t){if(!this.touchMoved){var o=this.props.tolerance;this.touchMoved=Math.abs(this.startX-a(t))>o||Math.abs(this.startY-p(t))>o}},o.prototype.handleTouchCancel=function(){this.touchStarted=this.touchMoved=!1,this.startX=this.startY=0},o.prototype.handleTouchEnd=function(){this.touchStarted=!1,!this.touchMoved&&this.props.onPoint&&this.props.onPoint()},o.prototype.componentWillMount=function(){this.usingTouch=!1,this.handleClick=this.handleClick.bind(this),this.handleTouchStart=this.handleTouchStart.bind(this),this.handleTouchMove=this.handleTouchMove.bind(this),this.handleTouchCancel=this.handleTouchCancel.bind(this),this.handleTouchEnd=this.handleTouchEnd.bind(this)},o.prototype.render=function(){var t=this.props,o=t.component,e=i(t,["component"]);return e.onClick=this.handleClick,e.onTouchStart=this.handleTouchStart,e.onTouchMove=this.handleTouchMove,e.onTouchCancel=this.handleTouchCancel,e.onTouchEnd=this.handleTouchEnd,u["default"].createElement(o,e)},o}(u["default"].Component);l.propTypes={component:s.PropTypes.oneOfType([s.PropTypes.func,s.PropTypes.string]).isRequired,tolerance:s.PropTypes.number,onPoint:s.PropTypes.func},l.defaultProps={component:"div",tolerance:10},o["default"]=l},function(o,e){o.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.ReactPoint=e(require("react")):t.ReactPoint=e(t.React)}(this,function(t){return function(t){function e(n){if(o[n])return o[n].exports;var i=o[n]={exports:{},id:n,loaded:!1};return t[n].call(i.exports,i,i.exports,e),i.loaded=!0,i.exports}var o={};return e.m=t,e.c=o,e.p="",e(0)}([function(t,e,o){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}e.__esModule=!0,e.PointTarget=void 0;var i=o(1),r=n(i);e.PointTarget=r["default"]},function(t,e,o){"use strict";function n(t){return t&&t.__esModule?t:{"default":t}}function i(t,e){var o={};for(var n in t)e.indexOf(n)>=0||Object.prototype.hasOwnProperty.call(t,n)&&(o[n]=t[n]);return o}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function c(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}function h(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.__esModule=!0;var s=o(2),u=n(s),a=function(t){return t.touches[0].clientX},p=function(t){return t.touches[0].clientY},l=function(t){function e(){return r(this,e),c(this,t.apply(this,arguments))}return h(e,t),e.prototype.handleClick=function(){!this.usingTouch&&this.props.onPoint&&this.props.onPoint()},e.prototype.handleTouchStart=function(t){this.usingTouch=!0,this.touchStarted||(this.touchStarted=!0,this.touchMoved=!1,this.startX=a(t),this.startY=p(t))},e.prototype.handleTouchMove=function(t){if(!this.touchMoved){var e=this.props.tolerance;this.touchMoved=Math.abs(this.startX-a(t))>e||Math.abs(this.startY-p(t))>e}},e.prototype.handleTouchCancel=function(){this.touchStarted=this.touchMoved=!1,this.startX=this.startY=0},e.prototype.handleTouchEnd=function(){this.touchStarted=!1,!this.touchMoved&&this.props.onPoint&&this.props.onPoint()},e.prototype.componentWillMount=function(){this.usingTouch=!1,this.handleClick=this.handleClick.bind(this),this.handleTouchStart=this.handleTouchStart.bind(this),this.handleTouchMove=this.handleTouchMove.bind(this),this.handleTouchCancel=this.handleTouchCancel.bind(this),this.handleTouchEnd=this.handleTouchEnd.bind(this)},e.prototype.render=function(){var t=this.props,e=t.component,o=i(t,["component"]);return o.onClick=this.handleClick,o.onTouchStart=this.handleTouchStart,o.onTouchMove=this.handleTouchMove,o.onTouchCancel=this.handleTouchCancel,o.onTouchEnd=this.handleTouchEnd,u["default"].createElement(e,o)},e}(u["default"].Component);l.propTypes={component:s.PropTypes.oneOfType([s.PropTypes.func,s.PropTypes.string]).isRequired,tolerance:s.PropTypes.number,onPoint:s.PropTypes.func},l.defaultProps={component:"div",tolerance:10},e["default"]=l},function(e,o){e.exports=t}])});
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