Merge pull request #30231 from bkniffler/master

Reach router "router" component div props

types/reach__router/index.d.ts

@@ -24,7 +24,9 @@ export interface History {
     navigate: NavigateFn;
 }
 
-export class Router extends React.Component<RouterProps> { }
+export class Router extends React.Component<
+  RouterProps & React.HTMLProps<HTMLDivElement>
+> {}
 
 export interface RouterProps {
     basepath?: string;

types/reach__router/reach__router-tests.tsx

@@ -4,9 +4,9 @@ import {
     RouteComponentProps,
     Router,
     Redirect
-} from "@reach/router";
-import * as React from "react";
-import { render } from "react-dom";
+} from '@reach/router';
+import * as React from 'react';
+import { render } from 'react-dom';
 
 interface DashParams {
     id: string;
@@ -21,7 +21,7 @@ const Dash = (props: RouteComponentProps<DashParams>) => (
 const NotFound = (props: RouteComponentProps) => <div>Route not found</div>;
 
 render(
-    <Router>
+    <Router className="my-class">
         <Router component="div">
             <Home path="/" />
         </Router>
@@ -33,18 +33,18 @@ render(
         <NotFound default />
 
         <Link to="/somepath" rel="noopener noreferrer" target="_blank" />
-        <Redirect to="/somepath" replace={false} state={{ from: "/" }} />
+        <Redirect to="/somepath" replace={false} state={{ from: '/' }} />
 
         <Location>
             {context => (
                 <>
                     <div>hostname is {context.location.hostname}</div>
-                    <button onClick={() => context.navigate("/")}>
+                    <button onClick={() => context.navigate('/')}>
                         Go Home
                     </button>
                 </>
             )}
         </Location>
     </Router>,
-    document.getElementById("app-root")
+    document.getElementById('app-root')
 );