@devexpress/dx-react-core - npm Package Compare versions

Comparing version 1.0.0-alpha.5 to 1.0.0-alpha.6

dist/dx-react-core.es.js

 /**
  * Bundle of @devexpress/dx-react-core
- * Generated: 2017-07-07
- * Version: 1.0.0-alpha.4
+ * Generated: 2017-07-24
+ * Version: 1.0.0-alpha.6
  * License: https://js.devexpress.com/Licensing
@@ -111,4 +111,18 @@ */
 
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];
 
+    for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
 
+  return target;
+};
+
+
+
 var inherits = function (subClass, superClass) {
@@ -138,4 +152,14 @@ if (typeof superClass !== "function" && superClass !== null) {
 
+var objectWithoutProperties = function (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;
+};
+
 var possibleConstructorReturn = function (self, call) {
@@ -153,6 +177,39 @@ if (!self) {
 
+var slicedToArray = function () {
+  function sliceIterator(arr, i) {
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _e = undefined;
 
+    try {
+      for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+        _arr.push(_s.value);
 
+        if (i && _arr.length === i) break;
+      }
+    } catch (err) {
+      _d = true;
+      _e = err;
+    } finally {
+      try {
+        if (!_n && _i["return"]) _i["return"]();
+      } finally {
+        if (_d) throw _e;
+      }
+    }
 
+    return _arr;
+  }
 
+  return function (arr, i) {
+    if (Array.isArray(arr)) {
+      return arr;
+    } else if (Symbol.iterator in Object(arr)) {
+      return sliceIterator(arr, i);
+    } else {
+      throw new TypeError("Invalid attempt to destructure non-iterable instance");
+    }
+  };
+}();
 
@@ -168,2 +225,5 @@
 
+
+
+
 var toConsumableArray = function (arr) {
@@ -221,3 +281,13 @@ if (Array.isArray(arr)) {
         }
-      }, name + 'Getter', function undefined(original) {
+      }, name + 'Getter', function (_undefined) {
+        function undefined(_x) {
+          return _undefined.apply(this, arguments);
+        }
+
+        undefined.toString = function () {
+          return _undefined.toString();
+        };
+
+        return undefined;
+      }(function (original) {
         var _props2 = _this2.props,
@@ -227,3 +297,3 @@ value = _props2.value,
 
-        if (value !== null) return value;
+        if (value !== undefined) return value;
 
@@ -242,3 +312,3 @@ var args = [];
         return pureComputedMemoized.apply(undefined, toConsumableArray(args));
-      });
+      }));
 
@@ -272,3 +342,3 @@ pluginHost.registerPlugin(this.plugin);
 Getter.defaultProps = {
-  value: null,
+  value: undefined,
   pureComputed: null,
@@ -505,4 +575,4 @@ connectArgs: null,
 
-var TemplateConnector = function (_React$PureComponent) {
-  inherits(TemplateConnector, _React$PureComponent);
+var TemplateConnector = function (_React$Component) {
+  inherits(TemplateConnector, _React$Component);
 
@@ -607,3 +677,3 @@ function TemplateConnector(props, context) {
   return TemplateConnector;
-}(React.PureComponent);
+}(React.Component);
 TemplateConnector.defaultProps = {
@@ -626,4 +696,4 @@ name: null,
 
-var TemplatePlaceholder = function (_React$PureComponent) {
-  inherits(TemplatePlaceholder, _React$PureComponent);
+var TemplatePlaceholder = function (_React$Component) {
+  inherits(TemplatePlaceholder, _React$Component);
 
@@ -727,3 +797,3 @@ function TemplatePlaceholder(props, context) {
   return TemplatePlaceholder;
-}(React.PureComponent);
+}(React.Component);
 
@@ -876,16 +946,2 @@ TemplatePlaceholder.propTypes = {
 
-var combineTemplates = function combineTemplates() {
-  var userTemplate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
-    return undefined;
-  };
-  var defaultTemplate = arguments[1];
-  return function (props) {
-    var result = userTemplate(props);
-    if (result === undefined) {
-      result = defaultTemplate(props);
-    }
-    return result;
-  };
-};
-
 var DragDropContextCore = function () {
@@ -977,9 +1033,149 @@ function DragDropContextCore() {
 
+var TIMEOUT = 180;
+
+var TouchStrategy = function () {
+  function TouchStrategy(delegate) {
+    classCallCheck(this, TouchStrategy);
+
+    this.delegate = delegate;
+    this.touchStartTimeout = null;
+    this.dragging = false;
+  }
+
+  createClass(TouchStrategy, [{
+    key: "start",
+    value: function start(e) {
+      var _this = this;
+
+      var _e$touches$ = e.touches[0],
+          x = _e$touches$.clientX,
+          y = _e$touches$.clientY;
+
+      this.touchStartTimeout = setTimeout(function () {
+        _this.delegate.onStart({ x: x, y: y });
+        _this.dragging = true;
+      }, TIMEOUT);
+    }
+  }, {
+    key: "move",
+    value: function move(e) {
+      clearTimeout(this.touchStartTimeout);
+      if (this.dragging) {
+        var _e$touches$2 = e.touches[0],
+            clientX = _e$touches$2.clientX,
+            clientY = _e$touches$2.clientY;
+
+        e.preventDefault();
+        this.delegate.onMove({ x: clientX, y: clientY });
+      }
+    }
+  }, {
+    key: "end",
+    value: function end(e) {
+      clearTimeout(this.touchStartTimeout);
+      if (this.dragging) {
+        var _e$changedTouches$ = e.changedTouches[0],
+            clientX = _e$changedTouches$.clientX,
+            clientY = _e$changedTouches$.clientY;
+
+        this.delegate.onEnd({ x: clientX, y: clientY });
+      }
+      this.mouseInitialOffset = null;
+      this.dragging = false;
+    }
+  }]);
+  return TouchStrategy;
+}();
+
 /* globals window:true */
 
-var BOUNDARY = 1;
+var BOUNDARY = 10;
 var clamp = function clamp(value, min, max) {
   return Math.max(Math.min(value, max), min);
 };
+var isBoundExceeded = function isBoundExceeded(_ref, _ref2) {
+  var initialX = _ref.x,
+      initialY = _ref.y;
+  var x = _ref2.x,
+      y = _ref2.y;
+  return clamp(x, initialX - BOUNDARY, initialX + BOUNDARY) !== x || clamp(y, initialY - BOUNDARY, initialY + BOUNDARY) !== y;
+};
 
+var MouseStrategy = function () {
+  function MouseStrategy(delegate) {
+    classCallCheck(this, MouseStrategy);
+
+    this.delegate = delegate;
+    this.mouseInitialOffset = null;
+    this.dragging = false;
+  }
+
+  createClass(MouseStrategy, [{
+    key: "start",
+    value: function start(e) {
+      var x = e.clientX,
+          y = e.clientY;
+
+      this.mouseInitialOffset = { x: x, y: y };
+    }
+  }, {
+    key: "move",
+    value: function move(e) {
+      var x = e.clientX,
+          y = e.clientY;
+
+      if (!this.dragging && this.mouseInitialOffset) {
+        if (isBoundExceeded(this.mouseInitialOffset, { x: x, y: y })) {
+          this.delegate.onStart(this.mouseInitialOffset);
+          if (window.getSelection) {
+            window.getSelection().removeAllRanges();
+          }
+          this.dragging = true;
+        }
+      }
+      if (this.dragging) {
+        e.preventDefault();
+        this.delegate.onMove({ x: x, y: y });
+      }
+    }
+  }, {
+    key: "end",
+    value: function end(e) {
+      if (this.dragging) {
+        var x = e.clientX,
+            y = e.clientY;
+
+        this.delegate.onEnd({ x: x, y: y });
+      }
+      this.mouseInitialOffset = null;
+      this.dragging = false;
+    }
+  }]);
+  return MouseStrategy;
+}();
+
+/* globals window:true */
+
+var eventEmitter = null;
+var getSharedEventEmitter = function getSharedEventEmitter() {
+  if (!eventEmitter) {
+    eventEmitter = new EventEmitter();
+
+    ['mousemove', 'mouseup', 'touchmove', 'touchend', 'touchcancel'].forEach(function (name) {
+      return window.addEventListener(name, function (e) {
+        return eventEmitter.emit([name, e]);
+      }, { passive: false });
+    });
+  }
+  return eventEmitter;
+};
+
+var touchEvents = false;
+var touchEventsSupported = function touchEventsSupported() {
+  if (!touchEvents) {
+    touchEvents = 'ontouchstart' in window;
+  }
+  return touchEvents;
+};
+
 var Draggable = function (_React$Component) {
@@ -993,81 +1189,27 @@ inherits(Draggable, _React$Component);
 
-    _this.initialOffset = null;
-    _this.offset = null;
+    var delegate = {
+      onStart: function onStart(_ref) {
+        var x = _ref.x,
+            y = _ref.y;
 
-    _this.isBoundExceeded = function (_ref) {
-      var x = _ref.x,
-          y = _ref.y;
-      return clamp(x, _this.initialOffset.x - BOUNDARY, _this.initialOffset.x + BOUNDARY) !== x || clamp(y, _this.initialOffset.y - BOUNDARY, _this.initialOffset.y + BOUNDARY) !== y;
-    };
-    _this.onStart = function (_ref2) {
-      var x = _ref2.x,
-          y = _ref2.y;
+        _this.props.onStart({ x: x, y: y });
+      },
+      onMove: function onMove(_ref2) {
+        var x = _ref2.x,
+            y = _ref2.y;
 
-      _this.initialOffset = { x: x, y: y };
-      _this.installListeners();
-    };
-    _this.onMove = function (_ref3) {
-      var x = _ref3.x,
-          y = _ref3.y,
-          prevent = _ref3.prevent;
+        _this.props.onUpdate({ x: x, y: y });
+      },
+      onEnd: function onEnd(_ref3) {
+        var x = _ref3.x,
+            y = _ref3.y;
 
-      if (_this.initialOffset && _this.isBoundExceeded({ x: x, y: y })) {
-        prevent();
-        if (window.getSelection) {
-          window.getSelection().removeAllRanges();
-        }
-        var offset = { x: x, y: y };
-        if (!_this.offset) {
-          _this.props.onStart(_this.initialOffset);
-        } else {
-          _this.props.onUpdate(offset);
-        }
-        _this.offset = offset;
-      }
-    };
-    _this.onEnd = function (_ref4) {
-      var x = _ref4.x,
-          y = _ref4.y,
-          prevent = _ref4.prevent;
-
-      if (_this.offset) {
-        prevent();
         _this.props.onEnd({ x: x, y: y });
       }
-      _this.initialOffset = null;
-      _this.offset = null;
-      _this.removeListeners();
     };
 
-    _this.listeners = [['mousemove', function (e) {
-      var clientX = e.clientX,
-          clientY = e.clientY;
+    _this.mouseStrategy = new MouseStrategy(delegate);
+    _this.touchStrategy = new TouchStrategy(delegate);
 
-      _this.onMove({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }], ['mouseup', function (e) {
-      var clientX = e.clientX,
-          clientY = e.clientY;
-
-      _this.onEnd({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }], ['touchmove', function (e) {
-      var _e$touches$ = e.touches[0],
-          clientX = _e$touches$.clientX,
-          clientY = _e$touches$.clientY;
-
-      _this.onMove({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }, { passive: false }], ['touchend', function (e) {
-      var _e$changedTouches$ = e.changedTouches[0],
-          clientX = _e$changedTouches$.clientX,
-          clientY = _e$changedTouches$.clientY;
-
-      _this.onEnd({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }]];
+    _this.listener = _this.listener.bind(_this);
     return _this;
@@ -1077,2 +1219,7 @@ }
   createClass(Draggable, [{
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      getSharedEventEmitter().subscribe(this.listener);
+    }
+  }, {
     key: 'shouldComponentUpdate',
@@ -1083,18 +1230,34 @@ value: function shouldComponentUpdate(nextProps) {
   }, {
-    key: 'installListeners',
-    value: function installListeners() {
-      this.listeners.forEach(function (args) {
-        var _window;
-
-        return (_window = window).addEventListener.apply(_window, toConsumableArray(args));
-      });
+    key: 'componentWillUnmount',
+    value: function componentWillUnmount() {
+      getSharedEventEmitter().unsubscribe(this.listener);
     }
   }, {
-    key: 'removeListeners',
-    value: function removeListeners() {
-      this.listeners.forEach(function (args) {
-        var _window2;
+    key: 'listener',
+    value: function listener(_ref4) {
+      var _ref5 = slicedToArray(_ref4, 2),
+          name = _ref5[0],
+          e = _ref5[1];
 
-        return (_window2 = window).removeEventListener.apply(_window2, toConsumableArray(args));
-      });
+      switch (name) {
+        case 'mousemove':
+          this.mouseStrategy.move(e);
+          break;
+        case 'mouseup':
+          this.mouseStrategy.end(e);
+          break;
+        case 'touchmove':
+          {
+            this.touchStrategy.move(e);
+            break;
+          }
+        case 'touchend':
+        case 'touchcancel':
+          {
+            this.touchStrategy.end(e);
+            break;
+          }
+        default:
+          break;
+      }
     }
@@ -1108,15 +1271,7 @@ }, {
         onMouseDown: function onMouseDown(e) {
-          var clientX = e.clientX,
-              clientY = e.clientY,
-              currentTarget = e.currentTarget;
-
-          _this2.onStart({ target: currentTarget, x: clientX, y: clientY });
+          if (touchEventsSupported()) return;
+          _this2.mouseStrategy.start(e);
         },
         onTouchStart: function onTouchStart(e) {
-          var currentTarget = e.currentTarget;
-          var _e$touches$2 = e.touches[0],
-              clientX = _e$touches$2.clientX,
-              clientY = _e$touches$2.clientY;
-
-          _this2.onStart({ target: currentTarget, x: clientX, y: clientY });
+          _this2.touchStrategy.start(e);
         }
@@ -1307,3 +1462,24 @@ });
 
-export { PluginHost$1 as PluginHost, PluginContainer, Action, Getter, Watcher, Template, TemplatePlaceholder, combineTemplates, DragDropContext, DragSource, DropTarget };
+var TemplateRenderer = function TemplateRenderer(_ref) {
+  var template = _ref.template,
+      children = _ref.children,
+      restProps = objectWithoutProperties(_ref, ["template", "children"]);
+  return template(_extends({}, restProps, { children: children }));
+};
+
+var combineTemplates = function combineTemplates() {
+  var userTemplate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
+    return undefined;
+  };
+  var defaultTemplate = arguments[1];
+  return function (props) {
+    var result = userTemplate(props);
+    if (result === undefined) {
+      result = defaultTemplate(props);
+    }
+    return result;
+  };
+};
+
+export { PluginHost$1 as PluginHost, PluginContainer, Action, Getter, Watcher, Template, TemplatePlaceholder, DragDropContext, DragSource, DropTarget, TemplateRenderer, combineTemplates };
 //# sourceMappingURL=dx-react-core.es.js.map

dist/dx-react-core.umd.js

 /**
  * Bundle of @devexpress/dx-react-core
- * Generated: 2017-07-07
- * Version: 1.0.0-alpha.4
+ * Generated: 2017-07-24
+ * Version: 1.0.0-alpha.6
  * License: https://js.devexpress.com/Licensing
@@ -115,4 +115,18 @@ */
 
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];
 
+    for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
 
+  return target;
+};
+
+
+
 var inherits = function (subClass, superClass) {
@@ -142,4 +156,14 @@ if (typeof superClass !== "function" && superClass !== null) {
 
+var objectWithoutProperties = function (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;
+};
+
 var possibleConstructorReturn = function (self, call) {
@@ -157,6 +181,39 @@ if (!self) {
 
+var slicedToArray = function () {
+  function sliceIterator(arr, i) {
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _e = undefined;
 
+    try {
+      for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+        _arr.push(_s.value);
 
+        if (i && _arr.length === i) break;
+      }
+    } catch (err) {
+      _d = true;
+      _e = err;
+    } finally {
+      try {
+        if (!_n && _i["return"]) _i["return"]();
+      } finally {
+        if (_d) throw _e;
+      }
+    }
 
+    return _arr;
+  }
 
+  return function (arr, i) {
+    if (Array.isArray(arr)) {
+      return arr;
+    } else if (Symbol.iterator in Object(arr)) {
+      return sliceIterator(arr, i);
+    } else {
+      throw new TypeError("Invalid attempt to destructure non-iterable instance");
+    }
+  };
+}();
 
@@ -172,2 +229,5 @@
 
+
+
+
 var toConsumableArray = function (arr) {
@@ -225,3 +285,13 @@ if (Array.isArray(arr)) {
         }
-      }, name + 'Getter', function undefined(original) {
+      }, name + 'Getter', function (_undefined) {
+        function undefined(_x) {
+          return _undefined.apply(this, arguments);
+        }
+
+        undefined.toString = function () {
+          return _undefined.toString();
+        };
+
+        return undefined;
+      }(function (original) {
         var _props2 = _this2.props,
@@ -231,3 +301,3 @@ value = _props2.value,
 
-        if (value !== null) return value;
+        if (value !== undefined) return value;
 
@@ -246,3 +316,3 @@ var args = [];
         return pureComputedMemoized.apply(undefined, toConsumableArray(args));
-      });
+      }));
 
@@ -276,3 +346,3 @@ pluginHost.registerPlugin(this.plugin);
 Getter.defaultProps = {
-  value: null,
+  value: undefined,
   pureComputed: null,
@@ -509,4 +579,4 @@ connectArgs: null,
 
-var TemplateConnector = function (_React$PureComponent) {
-  inherits(TemplateConnector, _React$PureComponent);
+var TemplateConnector = function (_React$Component) {
+  inherits(TemplateConnector, _React$Component);
 
@@ -611,3 +681,3 @@ function TemplateConnector(props, context) {
   return TemplateConnector;
-}(React.PureComponent);
+}(React.Component);
 TemplateConnector.defaultProps = {
@@ -630,4 +700,4 @@ name: null,
 
-var TemplatePlaceholder = function (_React$PureComponent) {
-  inherits(TemplatePlaceholder, _React$PureComponent);
+var TemplatePlaceholder = function (_React$Component) {
+  inherits(TemplatePlaceholder, _React$Component);
 
@@ -731,3 +801,3 @@ function TemplatePlaceholder(props, context) {
   return TemplatePlaceholder;
-}(React.PureComponent);
+}(React.Component);
 
@@ -880,16 +950,2 @@ TemplatePlaceholder.propTypes = {
 
-var combineTemplates = function combineTemplates() {
-  var userTemplate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
-    return undefined;
-  };
-  var defaultTemplate = arguments[1];
-  return function (props) {
-    var result = userTemplate(props);
-    if (result === undefined) {
-      result = defaultTemplate(props);
-    }
-    return result;
-  };
-};
-
 var DragDropContextCore = function () {
@@ -981,9 +1037,149 @@ function DragDropContextCore() {
 
+var TIMEOUT = 180;
+
+var TouchStrategy = function () {
+  function TouchStrategy(delegate) {
+    classCallCheck(this, TouchStrategy);
+
+    this.delegate = delegate;
+    this.touchStartTimeout = null;
+    this.dragging = false;
+  }
+
+  createClass(TouchStrategy, [{
+    key: "start",
+    value: function start(e) {
+      var _this = this;
+
+      var _e$touches$ = e.touches[0],
+          x = _e$touches$.clientX,
+          y = _e$touches$.clientY;
+
+      this.touchStartTimeout = setTimeout(function () {
+        _this.delegate.onStart({ x: x, y: y });
+        _this.dragging = true;
+      }, TIMEOUT);
+    }
+  }, {
+    key: "move",
+    value: function move(e) {
+      clearTimeout(this.touchStartTimeout);
+      if (this.dragging) {
+        var _e$touches$2 = e.touches[0],
+            clientX = _e$touches$2.clientX,
+            clientY = _e$touches$2.clientY;
+
+        e.preventDefault();
+        this.delegate.onMove({ x: clientX, y: clientY });
+      }
+    }
+  }, {
+    key: "end",
+    value: function end(e) {
+      clearTimeout(this.touchStartTimeout);
+      if (this.dragging) {
+        var _e$changedTouches$ = e.changedTouches[0],
+            clientX = _e$changedTouches$.clientX,
+            clientY = _e$changedTouches$.clientY;
+
+        this.delegate.onEnd({ x: clientX, y: clientY });
+      }
+      this.mouseInitialOffset = null;
+      this.dragging = false;
+    }
+  }]);
+  return TouchStrategy;
+}();
+
 /* globals window:true */
 
-var BOUNDARY = 1;
+var BOUNDARY = 10;
 var clamp = function clamp(value, min, max) {
   return Math.max(Math.min(value, max), min);
 };
+var isBoundExceeded = function isBoundExceeded(_ref, _ref2) {
+  var initialX = _ref.x,
+      initialY = _ref.y;
+  var x = _ref2.x,
+      y = _ref2.y;
+  return clamp(x, initialX - BOUNDARY, initialX + BOUNDARY) !== x || clamp(y, initialY - BOUNDARY, initialY + BOUNDARY) !== y;
+};
 
+var MouseStrategy = function () {
+  function MouseStrategy(delegate) {
+    classCallCheck(this, MouseStrategy);
+
+    this.delegate = delegate;
+    this.mouseInitialOffset = null;
+    this.dragging = false;
+  }
+
+  createClass(MouseStrategy, [{
+    key: "start",
+    value: function start(e) {
+      var x = e.clientX,
+          y = e.clientY;
+
+      this.mouseInitialOffset = { x: x, y: y };
+    }
+  }, {
+    key: "move",
+    value: function move(e) {
+      var x = e.clientX,
+          y = e.clientY;
+
+      if (!this.dragging && this.mouseInitialOffset) {
+        if (isBoundExceeded(this.mouseInitialOffset, { x: x, y: y })) {
+          this.delegate.onStart(this.mouseInitialOffset);
+          if (window.getSelection) {
+            window.getSelection().removeAllRanges();
+          }
+          this.dragging = true;
+        }
+      }
+      if (this.dragging) {
+        e.preventDefault();
+        this.delegate.onMove({ x: x, y: y });
+      }
+    }
+  }, {
+    key: "end",
+    value: function end(e) {
+      if (this.dragging) {
+        var x = e.clientX,
+            y = e.clientY;
+
+        this.delegate.onEnd({ x: x, y: y });
+      }
+      this.mouseInitialOffset = null;
+      this.dragging = false;
+    }
+  }]);
+  return MouseStrategy;
+}();
+
+/* globals window:true */
+
+var eventEmitter = null;
+var getSharedEventEmitter = function getSharedEventEmitter() {
+  if (!eventEmitter) {
+    eventEmitter = new _devexpress_dxCore.EventEmitter();
+
+    ['mousemove', 'mouseup', 'touchmove', 'touchend', 'touchcancel'].forEach(function (name) {
+      return window.addEventListener(name, function (e) {
+        return eventEmitter.emit([name, e]);
+      }, { passive: false });
+    });
+  }
+  return eventEmitter;
+};
+
+var touchEvents = false;
+var touchEventsSupported = function touchEventsSupported() {
+  if (!touchEvents) {
+    touchEvents = 'ontouchstart' in window;
+  }
+  return touchEvents;
+};
+
 var Draggable = function (_React$Component) {
@@ -997,81 +1193,27 @@ inherits(Draggable, _React$Component);
 
-    _this.initialOffset = null;
-    _this.offset = null;
+    var delegate = {
+      onStart: function onStart(_ref) {
+        var x = _ref.x,
+            y = _ref.y;
 
-    _this.isBoundExceeded = function (_ref) {
-      var x = _ref.x,
-          y = _ref.y;
-      return clamp(x, _this.initialOffset.x - BOUNDARY, _this.initialOffset.x + BOUNDARY) !== x || clamp(y, _this.initialOffset.y - BOUNDARY, _this.initialOffset.y + BOUNDARY) !== y;
-    };
-    _this.onStart = function (_ref2) {
-      var x = _ref2.x,
-          y = _ref2.y;
+        _this.props.onStart({ x: x, y: y });
+      },
+      onMove: function onMove(_ref2) {
+        var x = _ref2.x,
+            y = _ref2.y;
 
-      _this.initialOffset = { x: x, y: y };
-      _this.installListeners();
-    };
-    _this.onMove = function (_ref3) {
-      var x = _ref3.x,
-          y = _ref3.y,
-          prevent = _ref3.prevent;
+        _this.props.onUpdate({ x: x, y: y });
+      },
+      onEnd: function onEnd(_ref3) {
+        var x = _ref3.x,
+            y = _ref3.y;
 
-      if (_this.initialOffset && _this.isBoundExceeded({ x: x, y: y })) {
-        prevent();
-        if (window.getSelection) {
-          window.getSelection().removeAllRanges();
-        }
-        var offset = { x: x, y: y };
-        if (!_this.offset) {
-          _this.props.onStart(_this.initialOffset);
-        } else {
-          _this.props.onUpdate(offset);
-        }
-        _this.offset = offset;
-      }
-    };
-    _this.onEnd = function (_ref4) {
-      var x = _ref4.x,
-          y = _ref4.y,
-          prevent = _ref4.prevent;
-
-      if (_this.offset) {
-        prevent();
         _this.props.onEnd({ x: x, y: y });
       }
-      _this.initialOffset = null;
-      _this.offset = null;
-      _this.removeListeners();
     };
 
-    _this.listeners = [['mousemove', function (e) {
-      var clientX = e.clientX,
-          clientY = e.clientY;
+    _this.mouseStrategy = new MouseStrategy(delegate);
+    _this.touchStrategy = new TouchStrategy(delegate);
 
-      _this.onMove({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }], ['mouseup', function (e) {
-      var clientX = e.clientX,
-          clientY = e.clientY;
-
-      _this.onEnd({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }], ['touchmove', function (e) {
-      var _e$touches$ = e.touches[0],
-          clientX = _e$touches$.clientX,
-          clientY = _e$touches$.clientY;
-
-      _this.onMove({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }, { passive: false }], ['touchend', function (e) {
-      var _e$changedTouches$ = e.changedTouches[0],
-          clientX = _e$changedTouches$.clientX,
-          clientY = _e$changedTouches$.clientY;
-
-      _this.onEnd({ x: clientX, y: clientY, prevent: function prevent() {
-          return e.preventDefault();
-        } });
-    }]];
+    _this.listener = _this.listener.bind(_this);
     return _this;
@@ -1081,2 +1223,7 @@ }
   createClass(Draggable, [{
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      getSharedEventEmitter().subscribe(this.listener);
+    }
+  }, {
     key: 'shouldComponentUpdate',
@@ -1087,18 +1234,34 @@ value: function shouldComponentUpdate(nextProps) {
   }, {
-    key: 'installListeners',
-    value: function installListeners() {
-      this.listeners.forEach(function (args) {
-        var _window;
-
-        return (_window = window).addEventListener.apply(_window, toConsumableArray(args));
-      });
+    key: 'componentWillUnmount',
+    value: function componentWillUnmount() {
+      getSharedEventEmitter().unsubscribe(this.listener);
     }
   }, {
-    key: 'removeListeners',
-    value: function removeListeners() {
-      this.listeners.forEach(function (args) {
-        var _window2;
+    key: 'listener',
+    value: function listener(_ref4) {
+      var _ref5 = slicedToArray(_ref4, 2),
+          name = _ref5[0],
+          e = _ref5[1];
 
-        return (_window2 = window).removeEventListener.apply(_window2, toConsumableArray(args));
-      });
+      switch (name) {
+        case 'mousemove':
+          this.mouseStrategy.move(e);
+          break;
+        case 'mouseup':
+          this.mouseStrategy.end(e);
+          break;
+        case 'touchmove':
+          {
+            this.touchStrategy.move(e);
+            break;
+          }
+        case 'touchend':
+        case 'touchcancel':
+          {
+            this.touchStrategy.end(e);
+            break;
+          }
+        default:
+          break;
+      }
     }
@@ -1112,15 +1275,7 @@ }, {
         onMouseDown: function onMouseDown(e) {
-          var clientX = e.clientX,
-              clientY = e.clientY,
-              currentTarget = e.currentTarget;
-
-          _this2.onStart({ target: currentTarget, x: clientX, y: clientY });
+          if (touchEventsSupported()) return;
+          _this2.mouseStrategy.start(e);
         },
         onTouchStart: function onTouchStart(e) {
-          var currentTarget = e.currentTarget;
-          var _e$touches$2 = e.touches[0],
-              clientX = _e$touches$2.clientX,
-              clientY = _e$touches$2.clientY;
-
-          _this2.onStart({ target: currentTarget, x: clientX, y: clientY });
+          _this2.touchStrategy.start(e);
         }
@@ -1311,2 +1466,23 @@ });
 
+var TemplateRenderer = function TemplateRenderer(_ref) {
+  var template = _ref.template,
+      children = _ref.children,
+      restProps = objectWithoutProperties(_ref, ["template", "children"]);
+  return template(_extends({}, restProps, { children: children }));
+};
+
+var combineTemplates = function combineTemplates() {
+  var userTemplate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
+    return undefined;
+  };
+  var defaultTemplate = arguments[1];
+  return function (props) {
+    var result = userTemplate(props);
+    if (result === undefined) {
+      result = defaultTemplate(props);
+    }
+    return result;
+  };
+};
+
 exports.PluginHost = PluginHost$1;
@@ -1319,6 +1495,7 @@ exports.PluginContainer = PluginContainer;
 exports.TemplatePlaceholder = TemplatePlaceholder;
-exports.combineTemplates = combineTemplates;
 exports.DragDropContext = DragDropContext;
 exports.DragSource = DragSource;
 exports.DropTarget = DropTarget;
+exports.TemplateRenderer = TemplateRenderer;
+exports.combineTemplates = combineTemplates;
 
@@ -1325,0 +1502,0 @@ Object.defineProperty(exports, '__esModule', { value: true });

package.json

 {
   "name": "@devexpress/dx-react-core",
-  "version": "1.0.0-alpha.5",
+  "version": "1.0.0-alpha.6",
   "description": "Core library for DevExtreme React Components",
@@ -64,2 +64,3 @@ "author": {
     "eslint-config-airbnb": "^15.0.1",
+    "eslint-plugin-filenames": "^1.2.0",
     "eslint-plugin-import": "^2.3.0",
@@ -81,3 +82,3 @@ "eslint-plugin-jest": "^20.0.3",
   "dependencies": {
-    "@devexpress/dx-core": "1.0.0-alpha.5",
+    "@devexpress/dx-core": "1.0.0-alpha.6",
     "prop-types": "^15.5.8"
@@ -84,0 +85,0 @@ },

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

Improved metrics

Total package byte prevSize

177205

increased by8.55%

Lines of code

2444

increased by14.58%

Worsened metrics

Dev dependency count

27

increased by3.85%

Dependency changes

• + Added@devexpress/dx-core@1.0.0-alpha.6(transitive)

• - Removed@devexpress/dx-core@1.0.0-alpha.5(transitive)

• Updated@devexpress/dx-core@1.0.0-alpha.6