Error: useRoutes() may be used only in the context of a <Router> component

I’m adding React modules dynamically using System JS, and it works great!
Except if I try to use the react-router context from the loaded module.

"react-router-dom": "6.0.0-beta.0"

You can see in the react component explorer that there is definitely a <Router> component as an ancestor.
The routing works fine in the host application – it only breaks when called from a dynamically loaded component.

I’m a novice with React, so I could be making a wrong assumption of how the contexts are provided to deeply nested or dynamically loaded children.

enter image description here

Router is mounted here –

Module is being loaded here –

The module element that throws the exception is here –

Source: React Router Questions