React Styleguide with React Router

Question

I am extending a react library that uses react-styleguidist as web-documentation (see https://react-ui.geops.de/). The base URL renders the component guide. I would like to add a path /theme that renders a completely different component (a demo page). I have used react-router-dom in many apps, but I reckon it works a little differently in styleguidist.

I tried to use it the conventional way in the StyleGuide.js file:

export function StyleGuideRenderer({
  classes,
  children,
  version,
  toc,
  hasSidebar,
}) {
  console.log(children);
  return (
    <div className={classes.root}>
      <Router>
        <Route exact path="/theme">
          <DemoPage />
        </Route>
        <Route exact path="/">
          <div>
            <header className={classes.header}>
              <div className={classes.bar}>
                <Logo>
                  <a className={classes.title} href="/">
                    {docConfig.appName}
                  </a>
                </Logo>
              </div>
            </header>
          </div>
          <div className={classes.content}>
            <div className={classes.scrollable}>
              <div className={classes.sidebar}>
                <header className={classes.version}>
                  {version && <Version>{version}</Version>}
                </header>
                {hasSidebar ? toc : null}
              </div>
              <main className={classes.main}>{children}</main>
            </div>
          </div>
        </Route>
      </Router>
    </div>
  );
}

This results in a GET error: Cannot GET /theme. I guess it looks for theme.html, and then throws an error when it can't find anything.

Does anyone have any tips on using react-router-dom within a StyleGuide server?

Thanks for any hints