Add useFocus() hook to react-router-dom

[pshrmn]

Like #6449, but as a hook.

import { useFocus } from "react-router-dom";

function App() {
  const ref = useFocus();
  return (
    <main tabIndex={-1} ref={ref}>
      {/* ... */}
    </main>
  );
}

I was having timing issues in the tests and had to use useLayoutEffect in order to get them passing.

[pshrmn]

In the React Hooks RFC, it was mentioned that there will probably be a native useFocus hook at some point, so it wouldn't hurt to rename this to prevent any future accidental collisions. useNavigationFocus? useRouterFocus?

I'm not exactly sure what the use case for React.useFocus is, but I don't think that it will make this unnecessary.