fix #108 "ref is not a prop" error

dist/InfiniteScroll.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', {
   value: true
 });
+exports.InfiniteScroll = undefined;
 
 var _createClass = (function() {
   function defineProperties(target, props) {
@@ -21,6 +22,20 @@ var _createClass = (function() {
   };
 })();
 
+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 _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
@@ -81,7 +96,21 @@ function _inherits(subClass, superClass) {
       : (subClass.__proto__ = superClass);
 }
 
-var InfiniteScroll = (function(_Component) {
+exports.default = _react2.default.forwardRef(function(props, ref) {
+  return _react2.default.createElement(
+    InfiniteScroll,
+    _extends({}, props, {
+      forwardedRef:
+        typeof ref === 'function'
+          ? ref
+          : function(r) {
+              return (ref = r);
+            }
+    })
+  );
+});
+
+var InfiniteScroll = (exports.InfiniteScroll = (function(_Component) {
   _inherits(InfiniteScroll, _Component);
 
   function InfiniteScroll(props) {
@@ -357,7 +386,7 @@ var InfiniteScroll = (function(_Component) {
           loader = renderProps.loader,
           loadMore = renderProps.loadMore,
           pageStart = renderProps.pageStart,
-          ref = renderProps.ref,
+          forwardedRef = renderProps.forwardedRef,
           threshold = renderProps.threshold,
           useCapture = renderProps.useCapture,
           useWindow = renderProps.useWindow,
@@ -371,7 +400,7 @@ var InfiniteScroll = (function(_Component) {
             'loader',
             'loadMore',
             'pageStart',
-            'ref',
+            'forwardedRef',
             'threshold',
             'useCapture',
             'useWindow',
@@ -380,8 +409,8 @@ var InfiniteScroll = (function(_Component) {
 
         props.ref = function(node) {
           _this2.scrollComponent = node;
-          if (ref) {
-            ref(node);
+          if (forwardedRef) {
+            forwardedRef(node);
           }
         };
 
@@ -403,7 +432,7 @@ var InfiniteScroll = (function(_Component) {
   ]);
 
   return InfiniteScroll;
-})(_react.Component);
+})(_react.Component));
 
 InfiniteScroll.propTypes = {
   children: _propTypes2.default.node.isRequired,
@@ -414,7 +443,7 @@ InfiniteScroll.propTypes = {
   loader: _propTypes2.default.node,
   loadMore: _propTypes2.default.func.isRequired,
   pageStart: _propTypes2.default.number,
-  ref: _propTypes2.default.func,
+  forwardedRef: _propTypes2.default.func,
   getScrollParent: _propTypes2.default.func,
   threshold: _propTypes2.default.number,
   useCapture: _propTypes2.default.bool,
@@ -433,5 +462,3 @@ InfiniteScroll.defaultProps = {
   loader: null,
   getScrollParent: null
 };
-exports.default = InfiniteScroll;
-module.exports = exports['default'];

src/InfiniteScroll.js

@@ -1,7 +1,14 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 
-export default class InfiniteScroll extends Component {
+export default React.forwardRef((props, ref) => (
+  <InfiniteScroll
+    {...props}
+    forwardedRef={typeof ref === 'function' ? ref : r => (ref = r)}
+  />
+));
+
+export class InfiniteScroll extends Component {
   static propTypes = {
     children: PropTypes.node.isRequired,
     element: PropTypes.node,
@@ -11,7 +18,7 @@ export default class InfiniteScroll extends Component {
     loader: PropTypes.node,
     loadMore: PropTypes.func.isRequired,
     pageStart: PropTypes.number,
-    ref: PropTypes.func,
+    forwardedRef: PropTypes.func,
     getScrollParent: PropTypes.func,
     threshold: PropTypes.number,
     useCapture: PropTypes.bool,
@@ -256,7 +263,7 @@ export default class InfiniteScroll extends Component {
       loader,
       loadMore,
       pageStart,
-      ref,
+      forwardedRef,
       threshold,
       useCapture,
       useWindow,
@@ -266,8 +273,8 @@ export default class InfiniteScroll extends Component {
 
     props.ref = node => {
       this.scrollComponent = node;
-      if (ref) {
-        ref(node);
+      if (forwardedRef) {
+        forwardedRef(node);
       }
     };
 

test/infiniteScroll_test.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { mount } from 'enzyme';
 import { expect } from 'chai';
 import { stub, spy } from 'sinon';
-import InfiniteScroll from '../src/InfiniteScroll';
+import { InfiniteScroll } from '../src/InfiniteScroll';
 
 describe('InfiniteScroll component', () => {
   it('should render', () => {