react-scroll - npm Package Compare versions

Comparing version 1.6.7 to 1.7.0

modules/__tests__/animate-scroll-test.js

@@ -36,2 +36,3 @@ 'use strict';
   var node = void 0;
+  var node2 = void 0;
   var duration = 10;
@@ -67,5 +68,34 @@ var waitDuration = duration * 10;
 
+  var tallComponent2 = _react2.default.createElement(
+    'div',
+    { id: 'hugeComponent2' },
+    _react2.default.createElement(
+      'a',
+      { onClick: function onClick() {
+          return _animateScroll2.default.scrollToTop();
+        } },
+      'Scroll To Top!'
+    ),
+    _react2.default.createElement(
+      'a',
+      { onClick: function onClick() {
+          return _animateScroll2.default.scrollTo(100);
+        } },
+      'Scroll To 100!'
+    ),
+    _react2.default.createElement(
+      'a',
+      { onClick: function onClick() {
+          return _animateScroll2.default.scrollMore(10);
+        } },
+      'Scroll More!'
+    ),
+    _react2.default.createElement('div', { style: { height: '10000px' } })
+  );
+
   beforeEach(function () {
     node = document.createElement('div');
+    node2 = document.createElement('div');
     document.body.appendChild(node);
+    document.body.appendChild(node2);
   });
@@ -76,6 +106,9 @@
     node.style.cssText = "";
+    node2.style.cssText = "";
     document.body.style.cssText = "";
 
     (0, _reactDom.unmountComponentAtNode)(node);
+    (0, _reactDom.unmountComponentAtNode)(node2);
     document.body.removeChild(node);
+    document.body.removeChild(node2);
     document.body.innerHtml = "";
@@ -199,2 +232,21 @@ });
   });
+
+  it('can scroll two DIVs', function (done) {
+    (0, _reactDom.render)(tallComponent, node, function () {
+      (0, _reactDom.render)(tallComponent2, node2, function () {
+        window.scrollTo(0, 0);
+        node.style.cssText = "position: fixed; top: 0; bottom: 200px; width 100%; overflow: scroll";
+        node2.style.cssText = "position: fixed; top: 0; bottom: 200px; width 100%; overflow: scroll";
+        document.body.style.cssText = "overflow: hidden;";
+
+        _animateScroll2.default.scrollTo(300, { duration: duration, container: node });
+        _animateScroll2.default.scrollTo(400, { duration: duration, container: node2 });
+        setTimeout(function () {
+          (0, _expect2.default)(node.scrollTop).toEqual(300);
+          (0, _expect2.default)(node2.scrollTop).toEqual(400);
+          done();
+        }, waitDuration);
+      });
+    });
+  });
 });

modules/__tests__/element-test.js

@@ -13,8 +13,12 @@ 'use strict';
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _Element = require('../components/Element.js');
 
-var Element = require('../components/Element.js');
+var _Element2 = _interopRequireDefault(_Element);
 
-var assert = require('assert');
+var _assert = require('assert');
 
+var _assert2 = _interopRequireDefault(_assert);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 describe('Element', function () {
@@ -34,3 +38,3 @@
     var component = _react2.default.createElement(
-      Element,
+      _Element2.default,
       { name: 'test1', className: 'element' },
@@ -52,3 +56,3 @@ 'Test 1'
       _react2.default.createElement(
-        Element,
+        _Element2.default,
         { name: 'test1', className: 'element' },
@@ -58,3 +62,3 @@ 'A'
       _react2.default.createElement(
-        Element,
+        _Element2.default,
         { name: 'test1', className: 'element' },
@@ -61,0 +65,0 @@ 'B'

modules/__tests__/link-test.js

@@ -5,2 +5,6 @@ 'use strict';
 
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
 var _expect = require('expect');
@@ -10,11 +14,11 @@
 
-var _react = require('react');
+var _assert = require('assert');
 
-var _react2 = _interopRequireDefault(_react);
+var _assert2 = _interopRequireDefault(_assert);
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _Link = require('../components/Link');
 
-var Link = require('../components/Link.js');
+var _Link2 = _interopRequireDefault(_Link);
 
-var assert = require('assert');
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -35,3 +39,3 @@ describe('Link', function () {
     var component = _react2.default.createElement(
-      Link,
+      _Link2.default,
       { to: 'test1', spy: true, smooth: true, duration: 500 },
@@ -53,3 +57,3 @@ 'Test 1'
       _react2.default.createElement(
-        Link,
+        _Link2.default,
         { to: 'test1', spy: true, smooth: true, duration: 500 },
@@ -60,3 +64,3 @@ 'A'
       _react2.default.createElement(
-        Link,
+        _Link2.default,
         { to: 'test1', spy: true, smooth: true, duration: 500 },
@@ -63,0 +67,0 @@ 'B'

modules/__tests__/page-test.js

@@ -33,6 +33,18 @@ 'use strict';
 
+var _sinon = require('sinon');
+
+var _sinon2 = _interopRequireDefault(_sinon);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+/* Components to test */
+var wait = function wait(ms) {
+  return new Promise(function (res, rej) {
+    setTimeout(res, ms);
+  });
+};
 /* Test */
 /* React */
+
+
 describe('Page', function () {
@@ -226,3 +238,119 @@
   });
-});
-/* Components to test */
+
+  it('should call onSetActive', async function () {
+
+    var onSetActive = _sinon2.default.spy();
+    var onSetInactive = _sinon2.default.spy();
+
+    var component = _react2.default.createElement(
+      'div',
+      null,
+      _react2.default.createElement(
+        'ul',
+        null,
+        _react2.default.createElement(
+          'li',
+          null,
+          _react2.default.createElement(
+            _Link2.default,
+            { to: 'test1', spy: true, smooth: true, duration: scrollDuration },
+            'Test 1'
+          )
+        ),
+        _react2.default.createElement(
+          'li',
+          null,
+          _react2.default.createElement(
+            _Link2.default,
+            { to: 'test2', spy: true, smooth: true, duration: scrollDuration },
+            'Test 2'
+          )
+        ),
+        _react2.default.createElement(
+          'li',
+          null,
+          _react2.default.createElement(
+            _Link2.default,
+            { to: 'test3', spy: true, smooth: true, duration: scrollDuration },
+            'Test 3'
+          )
+        ),
+        _react2.default.createElement(
+          'li',
+          null,
+          _react2.default.createElement(
+            _Link2.default,
+            { to: 'test4', spy: true, smooth: true, duration: scrollDuration, onSetActive: onSetActive, onSetInactive: onSetInactive },
+            'Test 4'
+          )
+        ),
+        _react2.default.createElement(
+          'li',
+          null,
+          _react2.default.createElement(
+            _Link2.default,
+            { to: 'test5', spy: true, smooth: true, duration: scrollDuration },
+            'Test 5'
+          )
+        ),
+        _react2.default.createElement(
+          'li',
+          null,
+          _react2.default.createElement(
+            _Link2.default,
+            { to: 'anchor', spy: true, smooth: true, duration: scrollDuration },
+            'Test 6'
+          )
+        )
+      ),
+      _react2.default.createElement(
+        _Element2.default,
+        { name: 'test1', className: 'element' },
+        'test 1'
+      ),
+      _react2.default.createElement(
+        _Element2.default,
+        { name: 'test2', className: 'element' },
+        'test 2'
+      ),
+      _react2.default.createElement(
+        _Element2.default,
+        { name: 'test3', className: 'element' },
+        'test 3'
+      ),
+      _react2.default.createElement(
+        _Element2.default,
+        { name: 'test4', className: 'element' },
+        'test 4'
+      ),
+      _react2.default.createElement(
+        _Element2.default,
+        { name: 'test5', className: 'element' },
+        'test 5'
+      ),
+      _react2.default.createElement(
+        'div',
+        { id: 'anchor', className: 'element', style: lastDivStyle },
+        'test 6'
+      )
+    );
+
+    (0, _reactDom.render)(component, node);
+
+    var link = node.querySelectorAll('a')[3];
+
+    _testUtils2.default.Simulate.click(link);
+
+    await wait(scrollDuration + 500);
+
+    (0, _expect2.default)(onSetActive.calledOnce).toEqual(true);
+
+    link = node.querySelectorAll('a')[4];
+
+    _testUtils2.default.Simulate.click(link);
+
+    await wait(scrollDuration + 500);
+
+    (0, _expect2.default)(onSetInactive.calledOnce).toEqual(true);
+  });
+});

modules/__tests__/scroll-cancellation-test.js

@@ -36,3 +36,3 @@ 'use strict';
 
-describe('scroll cancellation', function () {
+describe('Scroll cancelation', function () {
   var node = document.createElement('div');
@@ -104,9 +104,9 @@ document.body.innerHtml = "";
 
-function wait(ms) {
+var wait = function wait(ms) {
   return new Promise(function (res, rej) {
     setTimeout(res, ms);
   });
-}
+};
 
-function dispatchDOMKeydownEvent(keyCode, element) {
+var dispatchDOMKeydownEvent = function dispatchDOMKeydownEvent(keyCode, element) {
   var event = document.createEvent("KeyboardEvent");
@@ -116,2 +116,2 @@ var initMethod = typeof event.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";
   element.dispatchEvent(event);
-}
+};

modules/components/Button.js

 "use strict";
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _scrollLink = require('../mixins/scroll-link');
+
+var _scrollLink2 = _interopRequireDefault(_scrollLink);
+
+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"); } }
@@ -11,18 +25,15 @@
 
-var React = require('react');
-var Helpers = require('../mixins/Helpers');
+var ButtonElement = function (_React$Component) {
+  _inherits(ButtonElement, _React$Component);
 
-var Button = function (_React$Component) {
-  _inherits(Button, _React$Component);
+  function ButtonElement() {
+    _classCallCheck(this, ButtonElement);
 
-  function Button() {
-    _classCallCheck(this, Button);
-
-    return _possibleConstructorReturn(this, (Button.__proto__ || Object.getPrototypeOf(Button)).apply(this, arguments));
+    return _possibleConstructorReturn(this, (ButtonElement.__proto__ || Object.getPrototypeOf(ButtonElement)).apply(this, arguments));
   }
 
-  _createClass(Button, [{
+  _createClass(ButtonElement, [{
     key: 'render',
     value: function render() {
-      return React.createElement(
+      return _react2.default.createElement(
         'input',
@@ -35,7 +46,7 @@ this.props,
 
-  return Button;
-}(React.Component);
+  return ButtonElement;
+}(_react2.default.Component);
 
 ;
 
-module.exports = Helpers.Scroll(Button);
+exports.default = (0, _scrollLink2.default)(ButtonElement);

modules/components/Element.js

 "use strict";
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
 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; };
@@ -7,2 +11,16 @@
 
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _scrollElement = require('../mixins/scroll-element');
+
+var _scrollElement2 = _interopRequireDefault(_scrollElement);
+
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+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"); } }
@@ -14,15 +32,12 @@
 
-var React = require('react');
-var Helpers = require('../mixins/Helpers');
+var ElementWrapper = function (_React$Component) {
+  _inherits(ElementWrapper, _React$Component);
 
-var Element = function (_React$Component) {
-  _inherits(Element, _React$Component);
+  function ElementWrapper() {
+    _classCallCheck(this, ElementWrapper);
 
-  function Element() {
-    _classCallCheck(this, Element);
-
-    return _possibleConstructorReturn(this, (Element.__proto__ || Object.getPrototypeOf(Element)).apply(this, arguments));
+    return _possibleConstructorReturn(this, (ElementWrapper.__proto__ || Object.getPrototypeOf(ElementWrapper)).apply(this, arguments));
   }
 
-  _createClass(Element, [{
+  _createClass(ElementWrapper, [{
     key: 'render',
@@ -38,3 +53,3 @@ value: function render() {
 
-      return React.createElement(
+      return _react2.default.createElement(
         'div',
@@ -49,7 +64,12 @@ _extends({}, newProps, { ref: function ref(el) {
 
-  return Element;
-}(React.Component);
+  return ElementWrapper;
+}(_react2.default.Component);
 
 ;
 
-module.exports = Helpers.Element(Element);
+ElementWrapper.propTypes = {
+  name: _propTypes2.default.string,
+  id: _propTypes2.default.string
+};
+
+exports.default = (0, _scrollElement2.default)(ElementWrapper);

modules/components/Link.js

 "use strict";
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _scrollLink = require('../mixins/scroll-link');
+
+var _scrollLink2 = _interopRequireDefault(_scrollLink);
+
+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"); } }
@@ -11,30 +23,30 @@
 
-var React = require('react');
-var Helpers = require('../mixins/Helpers');
+var LinkElement = function (_React$Component) {
+  _inherits(LinkElement, _React$Component);
 
-var Link = function (_React$Component) {
-  _inherits(Link, _React$Component);
+  function LinkElement() {
+    var _ref;
 
-  function Link() {
-    _classCallCheck(this, Link);
+    var _temp, _this, _ret;
 
-    return _possibleConstructorReturn(this, (Link.__proto__ || Object.getPrototypeOf(Link)).apply(this, arguments));
-  }
+    _classCallCheck(this, LinkElement);
 
-  _createClass(Link, [{
-    key: 'render',
-    value: function render() {
-      return React.createElement(
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = LinkElement.__proto__ || Object.getPrototypeOf(LinkElement)).call.apply(_ref, [this].concat(args))), _this), _this.render = function () {
+      return _react2.default.createElement(
         'a',
-        this.props,
-        this.props.children
+        _this.props,
+        _this.props.children
       );
-    }
-  }]);
+    }, _temp), _possibleConstructorReturn(_this, _ret);
+  }
 
-  return Link;
-}(React.Component);
+  return LinkElement;
+}(_react2.default.Component);
 
 ;
 
-module.exports = Helpers.Scroll(Link);
+exports.default = (0, _scrollLink2.default)(LinkElement);

modules/index.js

 'use strict';
 
-exports.Link = require('./components/Link.js');
-exports.Button = require('./components/Button.js');
-exports.Element = require('./components/Element.js');
-exports.Helpers = require('./mixins/Helpers.js');
-exports.scroller = require('./mixins/scroller.js');
-exports.Events = require('./mixins/scroll-events.js');
-exports.scrollSpy = require('./mixins/scroll-spy.js');
-exports.animateScroll = require('./mixins/animate-scroll.js');
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _Link = require('./components/Link.js');
+
+Object.defineProperty(exports, 'Link', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_Link).default;
+  }
+});
+
+var _Button = require('./components/Button.js');
+
+Object.defineProperty(exports, 'Button', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_Button).default;
+  }
+});
+
+var _Element = require('./components/Element.js');
+
+Object.defineProperty(exports, 'Element', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_Element).default;
+  }
+});
+
+var _scroller = require('./mixins/scroller.js');
+
+Object.defineProperty(exports, 'scroll', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_scroller).default;
+  }
+});
+
+var _scrollEvents = require('./mixins/scroll-events.js');
+
+Object.defineProperty(exports, 'Events', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_scrollEvents).default;
+  }
+});
+
+var _scrollSpy = require('./mixins/scroll-spy.js');
+
+Object.defineProperty(exports, 'scrollSpy', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_scrollSpy).default;
+  }
+});
+
+var _animateScroll = require('./mixins/animate-scroll.js');
+
+Object.defineProperty(exports, 'animateScroll', {
+  enumerable: true,
+  get: function get() {
+    return _interopRequireDefault(_animateScroll).default;
+  }
+});
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

modules/mixins/animate-scroll.js

 'use strict';
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
 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 utils = require('./utils');
-var smooth = require('./smooth');
-var cancelEvents = require('./cancel-events');
-var events = require('./scroll-events');
+var _utils = require('./utils');
 
+var _utils2 = _interopRequireDefault(_utils);
+
+var _smooth = require('./smooth');
+
+var _smooth2 = _interopRequireDefault(_smooth);
+
+var _cancelEvents = require('./cancel-events');
+
+var _cancelEvents2 = _interopRequireDefault(_cancelEvents);
+
+var _scrollEvents = require('./scroll-events');
+
+var _scrollEvents2 = _interopRequireDefault(_scrollEvents);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 /*
@@ -14,3 +31,3 @@ * Gets the easing type from the smooth prop within options.
 var getAnimationType = function getAnimationType(options) {
-  return smooth[options.smooth] || smooth.defaultEasing;
+  return _smooth2.default[options.smooth] || _smooth2.default.defaultEasing;
 };
@@ -43,24 +60,25 @@ /*
 
-var __currentPositionY = 0;
-var __startPositionY = 0;
-var __targetPositionY = 0;
-var __progress = 0;
-var __duration = 0;
-var __cancel = false;
+var makeData = function makeData() {
+  return {
+    currentPositionY: 0,
+    startPositionY: 0,
+    targetPositionY: 0,
+    progress: 0,
+    duration: 0,
+    cancel: false,
 
-var __target = void 0;
-var __containerElement = void 0;
-var __to = void 0;
-var __start = void 0;
-var __deltaTop = void 0;
-var __percent = void 0;
-var __delayTimeout = void 0;
+    target: null,
+    containerElement: null,
+    to: null,
+    start: null,
+    deltaTop: null,
+    percent: null,
+    delayTimeout: null
+  };
+};
 
-cancelEvents.subscribe(function () {
-  __cancel = true;
-});
-
-var currentPositionY = function currentPositionY() {
-  if (__containerElement && __containerElement !== document && __containerElement !== document.body) {
-    return __containerElement.scrollTop;
+var currentPositionY = function currentPositionY(options) {
+  var containerElement = options.data.containerElement;
+  if (containerElement && containerElement !== document && containerElement !== document.body) {
+    return containerElement.scrollTop;
   } else {
@@ -73,5 +91,6 @@ var supportPageOffset = window.pageXOffset !== undefined;
 
-var scrollContainerHeight = function scrollContainerHeight() {
-  if (__containerElement && __containerElement !== document && __containerElement !== document.body) {
-    return Math.max(__containerElement.scrollHeight, __containerElement.offsetHeight, __containerElement.clientHeight);
+var scrollContainerHeight = function scrollContainerHeight(options) {
+  var containerElement = options.data.containerElement;
+  if (containerElement && containerElement !== document && containerElement !== document.body) {
+    return Math.max(containerElement.scrollHeight, containerElement.offsetHeight, containerElement.clientHeight);
   } else {
@@ -86,7 +105,8 @@ var body = document.body;
 var animateScroll = function animateScroll(easing, options, timestamp) {
+  var data = options.data;
 
   // Cancel on specific events
-  if (!options.ignoreCancelEvents && __cancel) {
-    if (events.registered['end']) {
-      events.registered['end'](__to, __target, __currentPositionY);
+  if (!options.ignoreCancelEvents && data.cancel) {
+    if (_scrollEvents2.default.registered['end']) {
+      _scrollEvents2.default.registered['end'](data.to, data.target, data.currentPositionY);
     }
@@ -96,21 +116,21 @@ return;
 
-  __deltaTop = Math.round(__targetPositionY - __startPositionY);
+  data.deltaTop = Math.round(data.targetPositionY - data.startPositionY);
 
-  if (__start === null) {
-    __start = timestamp;
+  if (data.start === null) {
+    data.start = timestamp;
   }
 
-  __progress = timestamp - __start;
+  data.progress = timestamp - data.start;
 
-  __percent = __progress >= __duration ? 1 : easing(__progress / __duration);
+  data.percent = data.progress >= data.duration ? 1 : easing(data.progress / data.duration);
 
-  __currentPositionY = __startPositionY + Math.ceil(__deltaTop * __percent);
+  data.currentPositionY = data.startPositionY + Math.ceil(data.deltaTop * data.percent);
 
-  if (__containerElement && __containerElement !== document && __containerElement !== document.body) {
-    __containerElement.scrollTop = __currentPositionY;
+  if (data.containerElement && data.containerElement !== document && data.containerElement !== document.body) {
+    data.containerElement.scrollTop = data.currentPositionY;
   } else {
-    window.scrollTo(0, __currentPositionY);
+    window.scrollTo(0, data.currentPositionY);
   }
 
-  if (__percent < 1) {
+  if (data.percent < 1) {
     var easedAnimate = animateScroll.bind(null, easing, options);
@@ -121,4 +141,4 @@ requestAnimationFrameHelper.call(window, easedAnimate);
 
-  if (events.registered['end']) {
-    events.registered['end'](__to, __target, __currentPositionY);
+  if (_scrollEvents2.default.registered['end']) {
+    _scrollEvents2.default.registered['end'](data.to, data.target, data.currentPositionY);
   }
@@ -128,19 +148,24 @@ };
 var setContainer = function setContainer(options) {
-  __containerElement = !options ? null : options.containerId ? document.getElementById(options.containerId) : options.container && options.container.nodeType ? options.container : document;
+  options.data.containerElement = !options ? null : options.containerId ? document.getElementById(options.containerId) : options.container && options.container.nodeType ? options.container : document;
 };
 
 var animateTopScroll = function animateTopScroll(y, options, to, target) {
+  options.data = options.data || makeData();
 
-  window.clearTimeout(__delayTimeout);
+  window.clearTimeout(options.data.delayTimeout);
 
+  _cancelEvents2.default.subscribe(function () {
+    options.data.cancel = true;
+  });
+
   setContainer(options);
 
-  __start = null;
-  __cancel = false;
-  __startPositionY = currentPositionY();
-  __targetPositionY = options.absolute ? y : y + __startPositionY;
+  options.data.start = null;
+  options.data.cancel = false;
+  options.data.startPositionY = currentPositionY(options);
+  options.data.targetPositionY = options.absolute ? y : y + options.data.startPositionY;
 
-  if (__startPositionY === __targetPositionY) {
-    if (events.registered['end']) {
-      events.registered['end'](__to, __target, __currentPositionY);
+  if (options.data.startPositionY === options.data.targetPositionY) {
+    if (_scrollEvents2.default.registered['end']) {
+      _scrollEvents2.default.registered['end'](options.data.to, options.data.target, options.data.currentPositionY);
     }
@@ -150,8 +175,8 @@ return;
 
-  __deltaTop = Math.round(__targetPositionY - __startPositionY);
+  options.data.deltaTop = Math.round(options.data.targetPositionY - options.data.startPositionY);
 
-  __duration = functionWrapper(options.duration)(__deltaTop);
-  __duration = isNaN(parseFloat(__duration)) ? 1000 : parseFloat(__duration);
-  __to = to;
-  __target = target;
+  options.data.duration = functionWrapper(options.duration)(options.data.deltaTop);
+  options.data.duration = isNaN(parseFloat(options.data.duration)) ? 1000 : parseFloat(options.data.duration);
+  options.data.to = to;
+  options.data.target = target;
 
@@ -162,3 +187,3 @@ var easing = getAnimationType(options);
   if (options && options.delay > 0) {
-    __delayTimeout = window.setTimeout(function () {
+    options.data.delayTimeout = window.setTimeout(function () {
       requestAnimationFrameHelper.call(window, easedAnimate);
@@ -174,2 +199,3 @@ }, options.delay);
   options = _extends({}, options);
+  options.data = options.data || makeData();
   options.absolute = true;
@@ -190,3 +216,3 @@ return options;
   setContainer(options);
-  animateTopScroll(scrollContainerHeight(), options);
+  animateTopScroll(scrollContainerHeight(options), options);
 };
@@ -197,6 +223,6 @@
   setContainer(options);
-  animateTopScroll(currentPositionY() + toY, options);
+  animateTopScroll(currentPositionY(options) + toY, options);
 };
 
-module.exports = {
+exports.default = {
   animateTopScroll: animateTopScroll,
@@ -203,0 +229,0 @@ getAnimationType: getAnimationType,

modules/mixins/cancel-events.js

 'use strict';
 
-var _require = require('./passive-event-listeners'),
-    addPassiveEventListener = _require.addPassiveEventListener,
-    removePassiveEventListener = _require.removePassiveEventListener;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 
+var _passiveEventListeners = require('./passive-event-listeners');
+
 var events = ['mousedown', 'mousewheel', 'touchmove', 'keydown'];
 
-module.exports = {
+exports.default = {
   subscribe: function subscribe(cancelEvent) {
     return typeof document !== 'undefined' && events.forEach(function (event) {
-      return addPassiveEventListener(document, event, cancelEvent);
+      return (0, _passiveEventListeners.addPassiveEventListener)(document, event, cancelEvent);
     });
   }
 };

modules/mixins/Helpers.js

 "use strict";
 
+/* DEPRECATED */
+
 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; };
@@ -4,0 +6,0 @@

modules/mixins/scroll-events.js

 "use strict";
 
+Object.defineProperty(exports, "__esModule", {
+	value: true
+});
+
 var Events = {
@@ -15,2 +19,2 @@ registered: {},
 
-module.exports = Events;
+exports.default = Events;

modules/mixins/scroll-hash.js

 'use strict';
 
-var addPassiveEventListener = require('./passive-event-listeners');
-var utils = require('./utils');
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 
+var _passiveEventListeners = require('./passive-event-listeners');
+
+var _utils = require('./utils');
+
+var _utils2 = _interopRequireDefault(_utils);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 var scrollHash = {
@@ -52,7 +61,7 @@ mountFlag: false,
   getHash: function getHash() {
-    return utils.getHash();
+    return _utils2.default.getHash();
   },
   changeHash: function changeHash(to) {
     if (this.isInitialized()) {
-      utils.pushHash(to);
+      _utils2.default.pushHash(to);
     }
@@ -70,2 +79,2 @@ },
 
-module.exports = scrollHash;
+exports.default = scrollHash;

modules/mixins/scroll-spy.js

 'use strict';
 
-var _require = require('./passive-event-listeners'),
-    addPassiveEventListener = _require.addPassiveEventListener;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 
+var _passiveEventListeners = require('./passive-event-listeners');
+
 var eventThrottler = function eventThrottler(eventHandler) {
@@ -32,3 +35,3 @@ var eventHandlerTimeout = void 0;
       scrollSpy.scrollSpyContainers.push(scrollSpyContainer);
-      addPassiveEventListener(scrollSpyContainer, 'scroll', eventHandler);
+      (0, _passiveEventListeners.addPassiveEventListener)(scrollSpyContainer, 'scroll', eventHandler);
     }
@@ -93,2 +96,2 @@ },
 
-module.exports = scrollSpy;
+exports.default = scrollSpy;

modules/mixins/scroller.js

 'use strict';
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
 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 utils = require('./utils');
-var animateScroll = require('./animate-scroll');
-var events = require('./scroll-events');
+var _utils = require('./utils');
 
+var _utils2 = _interopRequireDefault(_utils);
+
+var _animateScroll = require('./animate-scroll');
+
+var _animateScroll2 = _interopRequireDefault(_animateScroll);
+
+var _scrollEvents = require('./scroll-events');
+
+var _scrollEvents2 = _interopRequireDefault(_scrollEvents);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 var __mapped = {};
 var __activeLink = void 0;
 
-module.exports = {
+exports.default = {
 
@@ -61,4 +75,4 @@ unmount: function unmount() {
 
-    if (events.registered.begin) {
-      events.registered.begin(to, target);
+    if (_scrollEvents2.default.registered.begin) {
+      _scrollEvents2.default.registered.begin(to, target);
     }
@@ -68,3 +82,3 @@
 
-    var scrollOffset = utils.scrollOffset(containerElement, target) + (props.offset || 0);
+    var scrollOffset = _utils2.default.scrollOffset(containerElement, target) + (props.offset || 0);
 
@@ -81,4 +95,4 @@ /*
 
-      if (events.registered['end']) {
-        events.registered['end'](to, target);
+      if (_scrollEvents2.default.registered['end']) {
+        _scrollEvents2.default.registered['end'](to, target);
       }
@@ -93,4 +107,4 @@
 
-    animateScroll.animateTopScroll(scrollOffset, props, to, target);
+    _animateScroll2.default.animateTopScroll(scrollOffset, props, to, target);
   }
 };

modules/mixins/smooth.js

 "use strict";
 
-module.exports = {
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = {
   /*
@@ -5,0 +8,0 @@ * https://github.com/oblador/angular-scroll (duScrollDefaultEasing)

modules/mixins/utils.js

 'use strict';
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 var pushHash = function pushHash(hash) {
@@ -30,3 +33,3 @@ hash = hash ? hash.indexOf('#') === 0 ? hash : '#' + hash : '';
 
-module.exports = {
+exports.default = {
   pushHash: pushHash,
@@ -33,0 +36,0 @@ getHash: getHash,

package.json

 {
   "name": "react-scroll",
-  "version": "1.6.7",
+  "version": "1.7.0",
   "description": "A scroll component for React.js",
@@ -63,2 +63,3 @@ "main": "modules",
     "react-dom": "^16.0.0",
+    "sinon": "^4.1.2",
     "webpack": "^2.4.1",
@@ -65,0 +66,0 @@ "webpack-dev-server": "^2.4.2"

README.md

@@ -27,4 +27,4 @@ ## React Scroll
 // ES6 Imports
-import Scroll from 'react-scroll'; // Imports all Mixins
-import {scroller} from 'react-scroll'; //Imports scroller mixin, can use as scroller.scrollTo()
+import * as Scroll from 'react-scroll';
+import { Link, DirectLink, Element , Events, animateScroll as scroll, scrollSpy, scroller } from 'react-scroll'
 
@@ -384,2 +384,7 @@
 #### Changelog
+> 1.7.0
+- Deprecated Helpers.js
+- Allow mulptiple scrolls
+- Support es6/es5 imports.
+
 > 1.6.5
@@ -386,0 +391,0 @@ - Refactored some logic regarding hashspy, now have to set containerId if you want to scroll a specific element.

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

99019

increased by29.97%

Number of package files

25

increased by8.7%

Lines of code

2138

increased by34.89%

Number of lines in readme file

447

increased by1.13%

Worsened metrics

Dev dependency count

26

increased by4%

No dependency changes