Table components should expose innerRef

[gustavopch]

• This is not a v0.x issue.
• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

Table components (Table, TableBody, TableRow, etc.) should provide innerRef prop exposing the HTMLElement.

Current Behavior

Currently it exposes a ref to a wrapper ReactComponent instead of to the real HTMLElement.

Examples

...
<DragDropContext ...>
  <Droppable ...>
    {provided => (
      <TableBody innerRef={provided.innerRef}>
        ...
      </TableBody>
  </Droppable>
</DragDropContext>
...

Context

Trying to make draggable table rows by using react-beautiful-dnd.

[oliviertassinari]

You can use the RootRef component or the React.findDOMNode API. In the future, you will be able to provide a ref directly once #10825 is closed.

[OdinSongeThorsen]

I've been removing findDomNode from my codebase because of this post by Dan Abramov, and while it does seem like using RootRef works fine, is that just using findDomNode behind the scenes like the example it is based on does?

[oliviertassinari]

@Odinsama Yes it's. The React team has recently deprecated the usage of findDOMNode in the strict mode. Check out the linked issue to keep up to date with our progress.