From 485a646b44a5e523a389c0345f62a9b52897f176 Mon Sep 17 00:00:00 2001
From: bskimball <brian.kimball@bdkonline.com>
Date: Tue, 28 Jun 2016 15:02:56 -0400
Subject: [PATCH 1/4] change from a function to a React class

I was getting an error saying the propTypes were undefined for Packery. I compared the code to the Masonry package which I did not get the errors. I just changed the module from a function to a React class and explicitly required React
---
 lib/index.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/lib/index.js b/lib/index.js
index 35ce392..d1aad36 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -2,9 +2,9 @@ var isBrowser = (typeof window !== 'undefined');
 var Packery = isBrowser ? window.Packery || require('packery') : null;
 var imagesloaded = isBrowser ? require('imagesloaded') : null;
 var refName = 'packeryContainer';
+var React = require('react');
 
-function PackeryComponent(React) {
-    return React.createClass({
+PackeryComponent = React.createClass({
         packery: false,
 
         domChildren: [],
@@ -182,6 +182,6 @@ function PackeryComponent(React) {
             }, this.props.children);
         }
     })
-}
+
 
 module.exports = PackeryComponent;

From b1a75f5f03947de84cb77f0e71e6ba224784a54f Mon Sep 17 00:00:00 2001
From: bskimball <brian.kimball@bdkonline.com>
Date: Wed, 29 Jun 2016 07:46:28 -0400
Subject: [PATCH 2/4] Update index.js

---
 lib/index.js | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/lib/index.js b/lib/index.js
index d1aad36..3087c41 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -1,8 +1,19 @@
 var isBrowser = (typeof window !== 'undefined');
 var Packery = isBrowser ? window.Packery || require('packery') : null;
 var imagesloaded = isBrowser ? require('imagesloaded') : null;
-var refName = 'packeryContainer';
 var React = require('react');
+var refName = 'packeryContainer';
+
+function extend() {
+    var result = {};
+    for (var i = 0; i < arguments.length; i++) {
+        var keys = Object.keys(arguments[i]);
+        for (var j = 0; j < keys.length; j++) {
+            result[keys[j]] = arguments[i][keys[j]];
+        }
+    }
+    return result;
+}
 
 PackeryComponent = React.createClass({
         packery: false,
@@ -176,10 +187,7 @@ PackeryComponent = React.createClass({
         },
 
         render: function() {
-            return React.createElement(this.props.elementType, {
-                className: this.props.className,
-                ref: refName
-            }, this.props.children);
+            return React.createElement(this.props.elementType, extend(this.props, {ref: refName}), this.props.children);
         }
     })
 

From c3f53a80bf79b66af1e7d6b88b25adf9b4f57150 Mon Sep 17 00:00:00 2001
From: bskimball <brian.kimball@bdkonline.com>
Date: Thu, 30 Jun 2016 06:37:54 -0400
Subject: [PATCH 3/4] update to 2.0.0

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 3d6b19c..9267e8a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-packery-component",
-  "version": "1.0.2",
+  "version": "2.0.0",
   "main": "./lib/index",
   "description": "A Packery component for React.js",
   "dependencies": {

From b04ea07e40c517a7548593c2d315c69a36833477 Mon Sep 17 00:00:00 2001
From: bskimball <brian.kimball@bdkonline.com>
Date: Thu, 30 Jun 2016 07:09:11 -0400
Subject: [PATCH 4/4] Update README.md

removed the React injection which is no longer necessary as of version 2. Added an es2015 example.
---
 README.md | 45 ++++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 42 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 17633eb..a16d87b 100644
--- a/README.md
+++ b/README.md
@@ -21,12 +21,12 @@ React >= 0.14.x
 * You can optionally include Packery as a script tag if there should be any reason for doing so:
 `<script src='//cdnjs.cloudflare.com/ajax/libs/packery/1.3.0/packery.pkgd.min.js' />`
 
-* To use the component just require the module and inject `React`
-* Example code:
+* To use the component just require the module
+* Example es5 code:
 
 ```js
 var React = require('react');
-var Packery = require('react-packery-component')(React);
+var Packery = require('react-packery-component');
 
 var packeryOptions = {
     transitionDuration: 0
@@ -57,3 +57,42 @@ var Gallery = React.createClass({
 
 module.exports = Gallery;
 ```
+* Example es2015 code:
+
+```js
+import React,{Component} from 'react';
+import Packery from 'react-packery-component';
+
+const packeryOptions = {
+    transitionDuration: 0
+};
+
+class Gallery extends Component {
+    constructor() {
+        super();
+    }
+    render() {
+        const childElements = this.props.elements.map((element) => {
+           return (
+                <li className="image-element-class">
+                    <img src={element.src} />
+                </li>
+            );
+        });
+
+        return (
+            <Packery
+                className={'my-gallery-class'} // default ''
+                elementType={'ul'} // default 'div'
+                options={packeryOptions} // default {}
+                disableImagesLoaded={false} // default false
+            >
+                {childElements}
+            </Packery>
+        );
+    }
+});
+
+export default Gallery;
+```
+