DefaultRenderer in v4

[Jahans3]

Hi guys, thanks for the awesome router. I've used V3 a few times in the past and it's been great, however having some teething problems with V4.

I have a drawer menu, but when I use the following approach it throws "Invariant Violation: Element type is invalid":

Router.js:

<Scene drawer component={MyDrawer}>
    <Scene tabs ... >
        ...
    </Scene>
</Scene>

MyDrawer.js:

<SideMenu disableGestures menu={DrawerMenu} isOpen={drawerOpen} onChange={drawerOpen => setDrawer({ drawerOpen })}>
    <DefaultRenderer navigationState={children[0]} onNavigate={onNavigate} />
  </SideMenu>

I've seen hints of DefaultRenderer being deprecated but nothing concrete. Is there a link I'm missing? Is this something that needs to be added in a future PR? Is there something I've missed?

Thanks!

Version

4.0.0-beta.24

Expected behaviour

Use a DefaultRenderer inside my SideMenu

Actual behaviour

Error saying component is undefined - can't see any hint of it in the docs or package except for historical issues. I assume it's been replaced by something but I cannot find what.

Steps to reproduce

1. Use
2. Error says component is likely not exported (seems to be correct)
3. Search docs for replacement/deprecation information, can't really find anything

Edit: Just saw a bit about custom navigators in an old issue (#2150) - is this something that still needs adding to the docs? Shall I submit a PR or did I miss it?

[foyarash]

1 - Use contentComponent instead of component
2 - Set your scene as an Overlay using either the overlay prop or just the Overlay component
3 - Just use this.props.children[0] in your MyDrawer.js instead of the DefaultRenderer

[temadev]

Hello, @foyarash!
When I'm using {this.props.children[0]} in overlayed drawer component and changing scenes via Actions.someSceneKey() it doesn't change a scene, but I see that Actions.currentScene is changed.
I think we have to update this.props.children[0] with new data to make it work but can't find a solution for that. I'm just thinking, maybe we can inject somehow data from Actions instead of using this.props.children[0]?