title: How to avoid native onDrop event from being overwritten for react-dnd?
body: <p>I'm successfully using react-dnd in a react component for a requirement of the application I'm working on.</p>
  
  <p>Said component also has a button that show a simple modal window:</p>
  
  <pre><code>&lt;Modal show={this.props.show} onHide={this.props.onHide} id={'image-modal'} {...this.props}  animation={true}&gt;
        ...
        &lt;Modal.Body&gt;
            &lt;div id="drop-target" onDragOver={this.handleDrag} onDrop={this.handleDrop}&gt;
              &lt;div className="text-center"&gt;&lt;p&gt;Put your image here&lt;/p&gt;&lt;/div&gt;
            &lt;/div&gt;
        &lt;/Modal.Body&gt;
        ...
      &lt;/Modal&gt; 
  </code></pre>
  
  <p>As you can see, this modal contains a div element that is listening for native html drag and drop events. My problem is that apparently these native events are somehow being overwritten for react-dnd, rendering them useless.</p>
  
  <p>I tested by eliminating all reeact-dnd drop target from the component and as I expected, the native events are now working. How can I achieve the behavior I'm expecting? </p>