Add stopPropagation call when resizing

README.md

@@ -62,3 +62,18 @@ These props apply to both `<Resizable>` and `<ResizableBox>`.
   draggableOpts?: ?Object
 };
 ```
+
+### Drag and resize
+
+This library already implements [react-draggable](https://github.com/mzabriskie/react-draggable) for handling the resizing.
+If you want to use a `react-resizable` box inside a `react-draggable` control, you should wrap the resizable control around a `div`:
+
+```
+<Draggable>
+  <div>
+    <ResizableBox>
+      <span>Resizable and draggable</span>
+    </ResizableBox>
+  </div>
+</Draggable>
+```

lib/Resizable.js

@@ -195,6 +195,8 @@ export default class Resizable extends React.Component<Props, State> {
       } else {
         this.setState(newState);
       }
+
+      e.stopPropagation();
     };
   }
 

test/TestLayout.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import Resizable from '../lib/Resizable';
+import Draggable from 'react-draggable';
 import ResizableBox from '../lib/ResizableBox';
 import 'style-loader!css-loader!../css/styles.css';
 
@@ -54,6 +55,13 @@ export default class TestLayout extends React.Component<{}, {width: number, heig
           <ResizableBox className="box" width={200} height={200} axis="none">
             <span className="text">Not resizable ("none" axis).</span>
           </ResizableBox>
+          <Draggable>
+            <div>
+              <ResizableBox className="box" width={200} height={200}>
+                <span className="text">Both resizable and draggable</span>
+              </ResizableBox>
+            </div>
+          </Draggable>
         </div>
       </div>
     );