Allow a "hidden" or "fallback" option to ensure video playback doesn't pause

[tr00st]

We're currently using react-reverse-portal to move around a playing <video> element in our application. We've had some issues where our application logic gets complicated enough that it's difficult to guarantee an OutputPortal is rendered at all times, but we'd like playback to continue (eg: to ensure audio still continues). For that purpose, we'd like some way of having a hidden mounting point that's guaranteed to be active whenever no OutputPortal is active.

My idea is to implement this with a "fallback" location - ie: when an OutputPortal is unmounted before another OutputPortal is created. For our purposes, this would just be a hidden <div style='display: none;'>, though for other uses this could be actively displaying the InPortal content in a default location.

I've put together a possible implementation (PR to come), which boils down to adding a new option to the createPortalNode call named fallbackMountNode, which accepts a Ref to a node to mount in. Seemed like the simplest way to put together an illustrative example.

API-wise, I think it might be nicer to have this option as a flag on OutPortal (eg: <OutPortal node={portalNode} fallbackOnly />), or a separate component (eg: <FallbackPortal node={portalNode} />), but haven't yet looked into how cleanly these could be implemented yet. Happy to look at reimplementing with an alternative API, but figured it'd be best to provide a PR with stories as a clean example.

Give me a shout if you've got any questions about our expected usage, the implementation, or anything else 😄