upgrade React to 16

README.md

@@ -74,6 +74,14 @@ Options: "bottom", "bottom right", "top right", "right"
 
 The browser scroll bar width. Default: "17px". [It should fit for most browsers](https://codepen.io/sambible/post/browser-scrollbar-widths).
 
+### `onScrollbarScroll: Function` optional
+
+Fired when the scrollbar is scrolled.
+
+### `onScrollbarScrollTimeout: Number` optional
+
+This timeout adds a throttle for `onScrollbarScroll`. Default is `300`. Set to `0` to remove throttle.
+
 ## Customization
 
 Adding a custom className to the component will give you power to customize the scrollbar's track and handler. Here is an example:

demo/src/entry.jsx

@@ -13,7 +13,7 @@ let List = things.map((item, key) => {
 
 let Text = (<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente sint quos at. Quae in voluptate, autem ipsa porro quisquam architecto eos impedit laudantium, dolorem blanditiis fugiat maxime, veritatis voluptas temporibus?<br/><br/>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic consequuntur, incidunt explicabo reiciendis, reprehenderit voluptates dolorum possimus quo consequatur ratione quasi ipsa provident, ducimus similique. Ipsum quo alias exercitationem corrupti?<br/><br/>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic consequuntur, incidunt explicabo reiciendis, reprehenderit voluptates dolorum possimus quo consequatur ratione quasi ipsa provident, ducimus similique. Ipsum quo alias exercitationem corrupti?<br/><br/>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic consequuntur, incidunt explicabo reiciendis, reprehenderit voluptates dolorum possimus quo consequatur ratione quasi ipsa provident, ducimus similique. Ipsum quo alias exercitationem corrupti?</p>);
 
-let Root = React.createClass({
+class Root extends React.Component {
     render() {
         return (
             <div className="Root">
@@ -66,7 +66,7 @@ let Root = React.createClass({
                         <div className="col-md-6">
                             <h4>Auto hide, and the starting position is on the "bottom right".</h4>
                             <div className="auto-hide">
-                                <FreeScrollBar className="example" autohide={true} fixed={true} start={'bottom right'}>
+                                <FreeScrollBar className="example" autohide={true} fixed={true} start={'bottom right'} onScrollbarScroll={() => {console.log('scrolled')}} onScrollbarScrollTimeout={100}>
                                     <div className="inner">{Text}</div>
                                 </FreeScrollBar>
                             </div>
@@ -82,7 +82,7 @@ let Root = React.createClass({
             </div>
         );
     }
-})
+}
 
 ReactDOM.render(
     <Root/>, document.getElementById('app')

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-free-scrollbar",
-  "version": "0.2.6",
+  "version": "0.3.0",
   "description": "A react module for creating customizable scroll area",
   "main": "dist/index.js",
   "scripts": {
@@ -21,12 +21,7 @@
     "url": "https://github.com/fuermosi777/react-free-scrollbar/issues"
   },
   "homepage": "https://github.com/fuermosi777/react-free-scrollbar#readme",
-  "peerDependencies": {
-    "react": "^15.3.1",
-    "react-dom": "^15.3.1"
-  },
   "devDependencies": {
-    "autoprefixer-loader": "^3.2.0",
     "babel-cli": "^6.4.5",
     "babel-core": "^6.4.5",
     "babel-loader": "^6.2.1",
@@ -40,9 +35,14 @@
     "less-loader": "^2.2.2",
     "react": "^15.3.1",
     "react-dom": "^15.3.1",
-    "react-hot-loader": "^1.3.0",
+    "react-hot-loader": "^3.1.3",
     "style-loader": "^0.13.0",
     "webpack": "^1.12.12",
     "webpack-dev-server": "^1.14.1"
+  },
+  "dependencies": {
+    "prop-types": "^15.6.0",
+    "react": "^16.1.1",
+    "react-dom": "^16.1.1"
   }
 }