From e6edf856bba4da4f1bf330f85c2bf4d3690f6b7a Mon Sep 17 00:00:00 2001
From: Kareem Janoudi <kjanoudi@gmail.com>
Date: Sat, 12 Mar 2016 21:13:25 -0500
Subject: [PATCH] Pass sortable isntance to component as a prop

---
 src/index.jsx | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/index.jsx b/src/index.jsx
index cd3b5a4..e7956bd 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -41,7 +41,11 @@ const extend = (target, ...sources) => {
 };
 
 const SortableMixin = (options = defaultOptions) => (Component) => class extends React.Component {
-    sortableInstance = null;
+    
+    state = {
+        sortableInstance: null
+    };
+
     sortableOptions = extend({}, defaultOptions, options);
 
     componentDidMount() {
@@ -49,7 +53,7 @@ const SortableMixin = (options = defaultOptions) => (Component) => class extends
         const emitEvent = (type, evt) => {
             const methodName = this.sortableOptions[type];
             const method = sortableComponent[methodName];
-            method && method.call(sortableComponent, evt, this.sortableInstance);
+            method && method.call(sortableComponent, evt, this.state.sortableInstance);
         };
 
         let copyOptions = extend({}, this.sortableOptions);
@@ -107,7 +111,8 @@ const SortableMixin = (options = defaultOptions) => (Component) => class extends
         });
 
         const domNode = ReactDOM.findDOMNode(sortableComponent.refs[this.sortableOptions.ref] || sortableComponent);
-        this.sortableInstance = Sortable.create(domNode, copyOptions);
+        const sortableInstance = Sortable.create(domNode, copyOptions);
+        this.setState({sortableInstance});
     }
     componentWillReceiveProps(nextProps) {
         const sortableComponent = this.refs[refName];
@@ -121,15 +126,15 @@ const SortableMixin = (options = defaultOptions) => (Component) => class extends
         }
     }
     componentWillUnmount() {
-        if (this.sortableInstance) {
-            this.sortableInstance.destroy();
-            this.sortableInstance = null;
+        if (this.state.sortableInstance) {
+            this.state.sortableInstance.destroy();
+            this.setState({sortableInstance: null});
         }
     }
 
     render() {
         return (
-            <Component ref={refName} {...this.props} />
+            <Component ref={refName} sortableInstance={this.state.sortableInstance} {...this.props} />
         );
     }
 };