Tooltip: Warning when wrapping Tooltip with <p> tag

[brookback]

🐛 Bug report

Current Behavior

I've got this pretty straight forward code:

<p>
   <Tooltip label="Tooltip">
      <button>Button</button>
   </Tooltip>
</p>

This actually works, but errors are printed in console:

Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>.
    in div (created by Portal)
    in Portal (created by TooltipPopup)
    in TooltipPopup (created by Tooltip)
    in Tooltip (at App.js:13)
    in p (at App.js:12)
    in div (at App.js:9)
    in App (at src/index.js:7)

I see the issue with DOM nesting of p and div tags, but I'd think that my use case – wrapping a button with Tooltip – is pretty intuitive, and it shouldn't cause errors/warnings.

Expected behavior

No errors are printed.

Reproducible example

https://codesandbox.io/s/trusting-bhabha-lfrsm

Suggested solution(s)

Additional context

Your environment

Software	Name(s)	Version
Reach Package	tooltip	0.8.4
React		16.8.x
Browser	Chrome	80.x
Assistive tech
Node
npm/yarn
Operating System	macOS	10.14.x

[enforce-template-use]

Thank you for opening this issue

[chaance]

This is because we use a div initially in @reach/portal as a temporary mount node. I'll use a span instead and patch this up in the next release.

[chaance]

Fixed in 0.8.5

[brookback]

Super! Thanks for being so responsive! 💞