Make fixes for [email protected]

Author: fritz-c

package.json

@@ -33,6 +33,7 @@
     "react-modal": "^1.4.0"
   },
   "peerDependencies": {
+    "prop-types": "^15.5.8",
     "react": "^15.0.0",
     "react-dom": "^15.0.0"
   },
@@ -58,6 +59,7 @@
     "html-webpack-plugin": "^2.22.0",
     "node-sass": "^3.8.0",
     "postcss-loader": "^1.1.0",
+    "prop-types": "^15.5.8",
     "react": "^15.2.0",
     "react-dom": "^15.2.0",
     "react-hot-loader": "^1.3.0",

src/examples/cats/app.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Component } from 'react';
 import ReactDOM from 'react-dom';
 import Lightbox from '../../react-image-lightbox';
 import styles from './stylesheets/app.scss';
@@ -81,28 +81,41 @@ const captions = [
     '',
 ];
 
-const App = React.createClass({
-    getInitialState() {
-        return {
+class App extends Component {
+    constructor() {
+        super();
+
+        this.state = {
             index: 0,
             isOpen: false
         };
-    },
+
+        this.openLightbox = this.openLightbox.bind(this);
+        this.closeLightbox = this.closeLightbox.bind(this);
+        this.moveNext = this.moveNext.bind(this);
+        this.movePrev = this.movePrev.bind(this);
+    }
+
     openLightbox() {
         this.setState({ isOpen: true });
-    },
+    }
+
     closeLightbox() {
         this.setState({ isOpen: false });
-    },
+    }
+
     moveNext() {
         this.setState({ index: (this.state.index + 1) % images.length });
-    },
+    }
+
     movePrev() {
         this.setState({ index: (this.state.index + images.length - 1) % images.length });
-    },
-    onImageLoadError(imageSrc, _srcType, errorEvent) {
+    }
+
+    static onImageLoadError(imageSrc, _srcType, errorEvent) {
         console.error(`Could not load image at ${imageSrc}`, errorEvent); // eslint-disable-line no-console
-    },
+    }
+
     render() {
         let lightbox;
         if (this.state.isOpen) {
@@ -119,7 +132,7 @@ const App = React.createClass({
                     onCloseRequest={this.closeLightbox}
                     onMovePrevRequest={this.movePrev}
                     onMoveNextRequest={this.moveNext}
-                    onImageLoadError={this.onImageLoadError}
+                    onImageLoadError={App.onImageLoadError}
 
                     imageTitle={titles[this.state.index]}
                     imageCaption={captions[this.state.index]}
@@ -191,6 +204,6 @@ const App = React.createClass({
             </div>
         );
     }
-});
+}
 
 ReactDOM.render(<App />, document.getElementById('app'));

src/react-image-lightbox.js

@@ -4,7 +4,8 @@
  * @license Open source under the MIT License
  */
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import Modal from 'react-modal';
 import {
     translate,