Skip to content

Releases: remix-run/react-router

v5.3.4

02 Oct 17:08
Compare
Choose a tag to compare

We removed the mini-create-react-context dependency, moving it into an internal module to eliminate peer dependency warnings for users on React 18 (#9382).

Full Changelog: v5.3.3...v5.3.4

v6.4.1

22 Sep 15:53
Compare
Choose a tag to compare

What's Changed

Bug Fixes

  • Preserve state from initialEntries (#9288)
  • Preserve ?index for fetcher get submissions to index routes (#9312)

Full Changelog: https://github.com/remix-run/react-router/compare/react-router@6.4.0...react-router@6.4.1

v6.4.0

13 Sep 19:48
87851fb
Compare
Choose a tag to compare

Whoa this is a big one! 6.4.0 brings all the data loading and mutation APIs over from Remix. Here's a quick high level overview, but it's recommended you go check out the docs, especially the feature overview and the tutorial.

New APIs

  • Create your router with createMemoryRouter
  • Render your router with <RouterProvider>
  • Load data with a Route loader and mutate with a Route action
  • Handle errors with Route errorElement
  • Defer non-critical data with defer and Await

react-router-dom APIs

  • Create your router with createBrowserRouter/createHashRouter
  • Submit data with the new <Form> component
  • Perform in-page data loads and mutations with useFetcher()
  • Defer non-critical data with defer and Await
  • Manage scroll position with <ScrollRestoration>
  • Perform path-relative navigations with <Link relative="path"> (#9160)

Bug Fixes

  • Path resolution is now trailing slash agnostic (#8861)
  • useLocation returns the scoped location inside a <Routes location> component (#9094)
  • Respect the <Link replace> prop if it is defined (#8779)

v1.0.0

13 Sep 19:48
87851fb
Compare
Choose a tag to compare

This is the first stable release of @remix-run/router, which provides all the underlying routing and data loading/mutation logic for react-router. You should not be using this package directly unless you are authoring a routing library similar to react-router.

For an overview of the features provided by react-router, we recommend you go check out the docs, especially the feature overview and the tutorial.

For an overview of the features provided by @remix-run/router, please check out the README.

react-router-dom@6.4.0-pre.15

08 Sep 22:16
e3d4596
Compare
Choose a tag to compare
Pre-release

Patch Changes

  • fix: remove internal router singleton (#9227)

    This change removes the internal module-level routerSingleton we create and maintain inside our data routers since it was causing a number of headaches for non-simple use cases:

    • Unit tests are a pain because you need to find a way to reset the singleton in-between tests
      • Use use a _resetModuleScope singleton for our tests
      • ...but this isn't exposed to users who may want to do their own tests around our router
    • The JSX children <Route> objects cause non-intuitive behavior based on idiomatic react expectations
      • Conditional runtime <Route>'s won't get picked up
      • Adding new <Route>'s during local dev won't get picked up during HMR
      • Using external state in your elements doesn't work as one might expect (see #9225)

    Instead, we are going to lift the singleton out into user-land, so that they create the router singleton and manage it outside the react tree - which is what react 18 is encouraging with useSyncExternalStore anyways! This also means that since users create the router - there's no longer any difference in the rendering aspect for memory/browser/hash routers (which only impacts router/history creation) - so we can get rid of those and trim to a simple RouterProvider

    // Before
    function App() {
      <DataBrowserRouter>
        <Route path="/" element={<Layout />}>
          <Route index element={<Home />}>
        </Route>
      <DataBrowserRouter>
    }
    
    // After
    let router = createBrowserRouter([{
      path: "/",
      element: <Layout />,
      children: [{
        index: true,
        element: <Home />,
      }]
    }]);
    
    function App() {
      return <RouterProvider router={router} />
    }

    If folks still prefer the JSX notation, they can leverage createRoutesFromElements (aliased from createRoutesFromChildren since they are not "children" in this usage):

    let routes = createRoutesFromElements(
      <Route path="/" element={<Layout />}>
        <Route index element={<Home />}>
      </Route>
    );
    let router = createBrowserRouter(routes);
    
    function App() {
      return <RouterProvider router={router} />
    }

    And now they can also hook into HMR correctly for router disposal:

    if (import.meta.hot) {
      import.meta.hot.dispose(() => router.dispose());
    }
    

    And finally since <RouterProvider> accepts a router, it makes unit testing easer since you can create a fresh router with each test.

    Removed APIs

    • <DataMemoryRouter>
    • <DataBrowserRouter>
    • <DataHashRouter>
    • <DataRouterProvider>
    • <DataRouter>

    Modified APIs

    • createMemoryRouter/createBrowserRouter/createHashRouter used to live in @remix-run/router to prevent devs from needing to create their own history. These are now moved to react-router/react-router-dom and handle the RouteObject -> AgnosticRouteObject conversion.

    Added APIs

    • <RouterProvider>
    • createRoutesFromElements (alias of createRoutesFromChildren)
  • Updated dependencies

    • react-router@6.4.0-pre.15

react-router-dom-v5-compat@6.4.0-pre.15

08 Sep 22:16
e3d4596
Compare
Choose a tag to compare
Pre-release

Patch Changes

  • Updated dependencies
    • react-router@6.4.0-pre.15
    • react-router-dom@6.4.0-pre.15

react-router@6.4.0-pre.14

31 Aug 20:55
c9b343b
Compare
Choose a tag to compare
Pre-release

Patch Changes

  • fix: rename resetScroll -> preventScrollReset (#9199)
  • Updated dependencies
    • @remix-run/router@0.2.0-pre.9

react-router@6.4.0-pre.11

02 Aug 14:18
12f3bd3
Compare
Choose a tag to compare
Pre-release

Patch Changes

  • c3406eb: fix: Rename <Deferred> to <Await> (#9095)

    • We are no longer replacing the Promise on loaderData with the value/error
      when it settles so it's now always a Promise.
    • To that end, we changed from <Deferred value={promise}> to
      <Await resolve={promise}> for clarity, and it also now supports using
      <Await> with raw promises from anywhere, not only those on loaderData
      from a defer() call.
      • Note that raw promises will not be automatically cancelled on interruptions
        so they are not recommended
    • The hooks are now useAsyncValue/useAsyncError
  • Updated dependencies

    • @remix-run/router@0.2.0-pre.6

react-router-native@6.4.0-pre.11

02 Aug 14:18
12f3bd3
Compare
Choose a tag to compare
Pre-release

Patch Changes

  • Updated dependencies
    • react-router@6.4.0-pre.11

react-router-dom@6.4.0-pre.11

02 Aug 14:18
12f3bd3
Compare
Choose a tag to compare
Pre-release

Patch Changes

  • Updated dependencies [c3406eb]
    • react-router@6.4.0-pre.11