title: Where are react-dnd connectors used
body: <p>I'm reading <code>react-dnd</code> docs. I cannot understand what is this <code>connectDropTarget</code> used for (<a href="https://react-dnd.github.io/react-dnd/docs/overview#connectors" rel="nofollow noreferrer">https://react-dnd.github.io/react-dnd/docs/overview#connectors</a>):</p>
  <p><a href="https://i.stack.imgur.com/KOelU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KOelU.png" alt="enter image description here" /></a></p>
  <p>Is this an obsolete way of connecting React elements to the DND system, that has been replaced with second item of <code>useDrag</code> and <code>useDrop</code> hooks (the one that gets attached to ref, check example below), or where is this used?</p>
  <p>Example:</p>
  <pre><code>const [collectedProps, drop] = useDrop(() =&gt; ({
      accept
  }));
  
  return &lt;div ref={drop}&gt;Drop Target&lt;/div&gt;;
  </code></pre>