react-infinite-scroll-loading/dist/react-infinite-scroll-loading.cjs.js

Infinite scroll component for React.

'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var React = require('react');
var React__default = _interopDefault(React);
var PropTypes = _interopDefault(require('prop-types'));

function _objectWithoutPropertiesLoose(source, excluded) {
  if (source == null) return {};
  var target = {};
  var sourceKeys = Object.keys(source);
  var key, i;

  for (i = 0; i < sourceKeys.length; i++) {
    key = sourceKeys[i];
    if (excluded.indexOf(key) >= 0) continue;
    target[key] = source[key];
  }

  return target;
}

var objectWithoutPropertiesLoose = _objectWithoutPropertiesLoose;

function _objectWithoutProperties(source, excluded) {
  if (source == null) return {};
  var target = objectWithoutPropertiesLoose(source, excluded);
  var key, i;

  if (Object.getOwnPropertySymbols) {
    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);

    for (i = 0; i < sourceSymbolKeys.length; i++) {
      key = sourceSymbolKeys[i];
      if (excluded.indexOf(key) >= 0) continue;
      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
      target[key] = source[key];
    }
  }

  return target;
}

var objectWithoutProperties = _objectWithoutProperties;

function _classCallCheck(instance, Constructor) {
  if (!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
}

var classCallCheck = _classCallCheck;

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);
  }
}

function _createClass(Constructor, protoProps, staticProps) {
  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  if (staticProps) _defineProperties(Constructor, staticProps);
  return Constructor;
}

var createClass = _createClass;

function createCommonjsModule(fn, module) {
	return module = { exports: {} }, fn(module, module.exports), module.exports;
}

var _typeof_1 = createCommonjsModule(function (module) {
function _typeof2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof2(obj); }

function _typeof(obj) {
  if (typeof Symbol === "function" && _typeof2(Symbol.iterator) === "symbol") {
    module.exports = _typeof = function _typeof(obj) {
      return _typeof2(obj);
    };
  } else {
    module.exports = _typeof = function _typeof(obj) {
      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : _typeof2(obj);
    };
  }

  return _typeof(obj);
}

module.exports = _typeof;
});

function _assertThisInitialized(self) {
  if (self === void 0) {
    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  }

  return self;
}

var assertThisInitialized = _assertThisInitialized;

function _possibleConstructorReturn(self, call) {
  if (call && (_typeof_1(call) === "object" || typeof call === "function")) {
    return call;
  }

  return assertThisInitialized(self);
}

var possibleConstructorReturn = _possibleConstructorReturn;

var getPrototypeOf = createCommonjsModule(function (module) {
function _getPrototypeOf(o) {
  module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
    return o.__proto__ || Object.getPrototypeOf(o);
  };
  return _getPrototypeOf(o);
}

module.exports = _getPrototypeOf;
});

var setPrototypeOf = createCommonjsModule(function (module) {
function _setPrototypeOf(o, p) {
  module.exports = _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
    o.__proto__ = p;
    return o;
  };

  return _setPrototypeOf(o, p);
}

module.exports = _setPrototypeOf;
});

function _inherits(subClass, superClass) {
  if (typeof superClass !== "function" && superClass !== null) {
    throw new TypeError("Super expression must either be null or a function");
  }

  subClass.prototype = Object.create(superClass && superClass.prototype, {
    constructor: {
      value: subClass,
      writable: true,
      configurable: true
    }
  });
  if (superClass) setPrototypeOf(subClass, superClass);
}

var inherits = _inherits;

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

var defineProperty = _defineProperty;

var InfiniteScrollLoading =
/*#__PURE__*/
function (_Component) {
  inherits(InfiniteScrollLoading, _Component);

  function InfiniteScrollLoading() {
    var _getPrototypeOf2;

    var _this;

    classCallCheck(this, InfiniteScrollLoading);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = possibleConstructorReturn(this, (_getPrototypeOf2 = getPrototypeOf(InfiniteScrollLoading)).call.apply(_getPrototypeOf2, [this].concat(args)));

    defineProperty(assertThisInitialized(_this), "scrollComponent", null);

    defineProperty(assertThisInitialized(_this), "pageLoaded", null);

    defineProperty(assertThisInitialized(_this), "scrollListener", function () {
      var el = _this.scrollComponent;
      var scrollEl = window;

      var parentNode = _this.getParentElement(el);

      var offset;

      if (_this.props.useWindow) {
        var doc = document.documentElement || document.body.parentNode || document.body;
        var scrollTop = scrollEl.pageYOffset !== undefined ? scrollEl.pageYOffset : doc.scrollTop;

        if (_this.props.isReverse) {
          offset = scrollTop;
        } else {
          offset = _this.calculateOffset(el, scrollTop);
        }
      } else if (_this.props.isReverse) {
        offset = parentNode.scrollTop;
      } else {
        offset = el.scrollHeight - parentNode.scrollTop - parentNode.clientHeight;
      } // Here we make sure the element is visible as well as checking the offset


      if (offset < Number(_this.props.threshold) && el && el.offsetParent !== null) {
        _this.detachScrollListener();

        _this.beforeScrollHeight = parentNode.scrollHeight;
        _this.beforeScrollTop = parentNode.scrollTop; // Call loadMore after detachScrollListener to allow for non-async loadMore functions

        if (_this.props.hasMore && typeof _this.props.loadMore === 'function') {
          _this.props.loadMore(_this.pageLoaded += 1);

          _this.loadMore = true;
        }
      }
    });

    return _this;
  }

  createClass(InfiniteScrollLoading, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      this.pageLoaded = this.props.pageStart; // this.options = this.eventListenerOptions();

      this.attachScrollListener();
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      if (this.props.isReverse && this.loadMore) {
        var parentElement = this.getParentElement(this.scrollComponent);
        parentElement.scrollTop = parentElement.scrollHeight - this.beforeScrollHeight + this.beforeScrollTop;
        this.loadMore = false;
      }

      this.attachScrollListener();

      if (this.props.resetPage) {
        this.pageLoaded = this.props.pageStart;
        this.scrollToTop();
      }
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      this.detachScrollListener(); // this.detachMousewheelListener();
    }
  }, {
    key: "scrollToTop",
    value: function scrollToTop() {
      var parentElement = this.getParentElement(this.scrollComponent);

      if (this.props.useWindow) {
        window.scrollTo(0, 0);
      } else {
        parentElement.scrollTop = 0;
      }
    } // isPassiveSupported = () => {
    //   let passive = false;
    //   const testOptions = {
    //     get passive() {
    //       passive = true;
    //     },
    //   };
    //   try {
    //     document.addEventListener('test', null, testOptions);
    //     document.removeEventListener('test', null, testOptions);
    //   } catch (e) {
    //     // ignore
    //   }
    //   return passive;
    // };
    // eventListenerOptions = () => {
    //   let options = this.props.useCapture;
    //   if (this.isPassiveSupported()) {
    //     options = {
    //       useCapture: this.props.useCapture,
    //       passive: true,
    //     };
    //   }
    //   return options;
    // };
    // detachMousewheelListener() {
    //   let scrollEl = window;
    //   if (this.props.useWindow === false) {
    //     scrollEl = this.scrollComponent.parentNode;
    //   }
    //   scrollEl.removeEventListener(
    //     'mousewheel',
    //     this.mousewheelListener,
    //     this.options ? this.options : this.props.useCapture,
    //   );
    // }

  }, {
    key: "detachScrollListener",
    value: function detachScrollListener() {
      var scrollEl = window;

      if (this.props.useWindow === false) {
        scrollEl = this.getParentElement(this.scrollComponent);
      }

      scrollEl.removeEventListener('scroll', this.scrollListener,
      /* this.options ? this.options : */
      this.props.useCapture);
      scrollEl.removeEventListener('resize', this.scrollListener,
      /* this.options ? this.options : */
      this.props.useCapture);
    }
  }, {
    key: "getParentElement",
    value: function getParentElement(el) {
      var scrollParent = this.props.getScrollParent && this.props.getScrollParent();
      if (scrollParent != null) return scrollParent;
      return el && el.parentNode;
    }
  }, {
    key: "attachScrollListener",
    value: function attachScrollListener() {
      var parentElement = this.getParentElement(this.scrollComponent);

      if (!this.props.hasMore || !parentElement) {
        return;
      }

      var scrollEl = window;

      if (this.props.useWindow === false) {
        scrollEl = parentElement;
      } // scrollEl.addEventListener(
      //   'mousewheel',
      //   this.mousewheelListener,
      //   this.options ? this.options : this.props.useCapture,
      // );


      scrollEl.addEventListener('scroll', this.scrollListener,
      /* this.options ? this.options : */
      this.props.useCapture);
      scrollEl.addEventListener('resize', this.scrollListener,
      /* this.options ? this.options : */
      this.props.useCapture);

      if (this.props.initialLoad) {
        this.scrollListener();
      }
    } // mousewheelListener = (e) => {
    //   // Prevents Chrome hangups
    //   // See: https://stackoverflow.com/questions/47524205/random-high-content-download-time-in-chrome/47684257#47684257
    //   if (e.deltaY === 1 && !this.isPassiveSupported()) {
    //     e.preventDefault();
    //   }
    // };

  }, {
    key: "calculateOffset",
    value: function calculateOffset(el, scrollTop) {
      if (!el) return 0;
      return this.calculateTopPosition(el) + (el.offsetHeight - scrollTop - window.innerHeight);
    }
  }, {
    key: "calculateTopPosition",
    value: function calculateTopPosition(el) {
      if (!el) return 0;
      return el.offsetTop + this.calculateTopPosition(el.offsetParent);
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var _this$props = this.props,
          children = _this$props.children,
          element = _this$props.element,
          hasMore = _this$props.hasMore,
          initialLoad = _this$props.initialLoad,
          isReverse = _this$props.isReverse,
          loader = _this$props.loader,
          loadMore = _this$props.loadMore,
          pageStart = _this$props.pageStart,
          ref = _this$props.ref,
          threshold = _this$props.threshold,
          useCapture = _this$props.useCapture,
          useWindow = _this$props.useWindow,
          getScrollParent = _this$props.getScrollParent,
          resetPage = _this$props.resetPage,
          props = objectWithoutProperties(_this$props, ["children", "element", "hasMore", "initialLoad", "isReverse", "loader", "loadMore", "pageStart", "ref", "threshold", "useCapture", "useWindow", "getScrollParent", "resetPage"]);

      props.ref = function (node) {
        _this2.scrollComponent = node;

        if (ref) {
          ref(node);
        }
      };

      var childrenArray = [children];

      if (hasMore) {
        if (loader) {
          isReverse ? childrenArray.unshift(loader) : childrenArray.push(loader);
        } else if (this.defaultLoader) {
          isReverse ? childrenArray.unshift(this.defaultLoader) : childrenArray.push(this.defaultLoader);
        }
      }

      return React__default.createElement(element, props, childrenArray);
    }
  }]);

  return InfiniteScrollLoading;
}(React.Component);

defineProperty(InfiniteScrollLoading, "propTypes", {
  children: PropTypes.node,
  ref: PropTypes.func,
  element: PropTypes.node,
  pageStart: PropTypes.number,
  hasMore: PropTypes.bool,
  loadMore: PropTypes.func,
  resetPage: PropTypes.bool,
  threshold: PropTypes.number,
  useWindow: PropTypes.bool,
  getScrollParent: PropTypes.func,
  useCapture: PropTypes.bool,
  // Deprecated
  initialLoad: PropTypes.bool,
  isReverse: PropTypes.bool,
  loader: PropTypes.node
});

defineProperty(InfiniteScrollLoading, "defaultProps", {
  children: undefined,
  ref: null,
  element: 'div',
  pageStart: 0,
  hasMore: false,
  loadMore: null,
  resetPage: false,
  threshold: 250,
  useWindow: true,
  getScrollParent: null,
  useCapture: false,
  // Deprecated
  initialLoad: false,
  isReverse: false,
  loader: null
});

module.exports = InfiniteScrollLoading;
//# sourceMappingURL=react-infinite-scroll-loading.cjs.js.map