Allow to render styles to multiple documents

[layershifter]

Feature Request

Problem description

Fela uses own per-renderer cache for style nodes, it means that if you will try to render something into a separate document you will fail 💣 Styles will be inserted into the parent document 🎲

See CodeSandbox for more details.

Repro

https://codesandbox.io/s/62m20qlpn

Proposed solution

I tried to combine our existing two renderers (felaRenderer & felaRtlRenderer) to one renderer, but we will still have broken transitions (see #516).

So, we will still need two renderers 😭

Expose ltrRenderer and rtlRenderer on Provider

Original idea was to expose only renderer prop, but it failed, so we need to expose two renders.

import { createRendererConfig, Provider, themes } from '@stardust-ui/react'

const subRenderer = createRendererConfig()
const subRtlRenderer = createRendererConfig()

ReactDOM.render(
  <Provider ltrRenderer={subRenderer} rtlRenderer={subRtlRenderer} theme={themes.teams}>
    <App />
  </Provider>,
  document.getElementById('root'),
)

Create renderers on demand

Generic idea is to pass current document via context and if it's different, create new renderers.

Pros

• Do not expose anything weird via API

[layershifter]

Linking: robinweser/fela#693