diff --git a/CHANGELOG.md b/CHANGELOG.md index bdd0563a7c..cbe2f44418 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,12 @@ We manage release notes in this file instead of the paginated Github Releases Pa Table of Contents - [React Router Releases](#react-router-releases) + - [v7.0.2](#v702) + - [Patch Changes](#patch-changes) + - [Changes by Package](#changes-by-package) + - [v7.0.1](#v701) + - [Patch Changes](#patch-changes-1) + - [Changes by Package](#changes-by-package-1) - [v7.0.0](#v700) - [Breaking Changes](#breaking-changes) - [Package Restructuring](#package-restructuring) @@ -29,188 +35,188 @@ We manage release notes in this file instead of the paginated Github Releases Pa - [Major Changes (`react-router`)](#major-changes-react-router) - [Major Changes (`@react-router/*`)](#major-changes-react-router-1) - [Minor Changes](#minor-changes) - - [Patch Changes](#patch-changes) - - [Changes by Package](#changes-by-package) + - [Patch Changes](#patch-changes-2) + - [Changes by Package](#changes-by-package-2) - [v6.28.0](#v6280) - [What's Changed](#whats-changed) - [Minor Changes](#minor-changes-1) - - [Patch Changes](#patch-changes-1) + - [Patch Changes](#patch-changes-3) - [v6.27.0](#v6270) - [What's Changed](#whats-changed-1) - [Stabilized APIs](#stabilized-apis) - [Minor Changes](#minor-changes-2) - - [Patch Changes](#patch-changes-2) + - [Patch Changes](#patch-changes-4) - [v6.26.2](#v6262) - - [Patch Changes](#patch-changes-3) + - [Patch Changes](#patch-changes-5) - [v6.26.1](#v6261) - - [Patch Changes](#patch-changes-4) + - [Patch Changes](#patch-changes-6) - [v6.26.0](#v6260) - [Minor Changes](#minor-changes-3) - - [Patch Changes](#patch-changes-5) + - [Patch Changes](#patch-changes-7) - [v6.25.1](#v6251) - - [Patch Changes](#patch-changes-6) + - [Patch Changes](#patch-changes-8) - [v6.25.0](#v6250) - [What's Changed](#whats-changed-2) - [Stabilized `v7_skipActionErrorRevalidation`](#stabilized-v7_skipactionerrorrevalidation) - [Minor Changes](#minor-changes-4) - - [Patch Changes](#patch-changes-7) + - [Patch Changes](#patch-changes-9) - [v6.24.1](#v6241) - - [Patch Changes](#patch-changes-8) + - [Patch Changes](#patch-changes-10) - [v6.24.0](#v6240) - [What's Changed](#whats-changed-3) - [Lazy Route Discovery (a.k.a. "Fog of War")](#lazy-route-discovery-aka-fog-of-war) - [Minor Changes](#minor-changes-5) - - [Patch Changes](#patch-changes-9) + - [Patch Changes](#patch-changes-11) - [v6.23.1](#v6231) - - [Patch Changes](#patch-changes-10) + - [Patch Changes](#patch-changes-12) - [v6.23.0](#v6230) - [What's Changed](#whats-changed-4) - [Data Strategy (unstable)](#data-strategy-unstable) - [Skip Action Error Revalidation (unstable)](#skip-action-error-revalidation-unstable) - [Minor Changes](#minor-changes-6) - [v6.22.3](#v6223) - - [Patch Changes](#patch-changes-11) + - [Patch Changes](#patch-changes-13) - [v6.22.2](#v6222) - - [Patch Changes](#patch-changes-12) + - [Patch Changes](#patch-changes-14) - [v6.22.1](#v6221) - - [Patch Changes](#patch-changes-13) + - [Patch Changes](#patch-changes-15) - [v6.22.0](#v6220) - [What's Changed](#whats-changed-5) - [Core Web Vitals Technology Report Flag](#core-web-vitals-technology-report-flag) - [Minor Changes](#minor-changes-7) - - [Patch Changes](#patch-changes-14) + - [Patch Changes](#patch-changes-16) - [v6.21.3](#v6213) - - [Patch Changes](#patch-changes-15) + - [Patch Changes](#patch-changes-17) - [v6.21.2](#v6212) - - [Patch Changes](#patch-changes-16) + - [Patch Changes](#patch-changes-18) - [v6.21.1](#v6211) - - [Patch Changes](#patch-changes-17) + - [Patch Changes](#patch-changes-19) - [v6.21.0](#v6210) - [What's Changed](#whats-changed-6) - [`future.v7_relativeSplatPath`](#futurev7_relativesplatpath) - [Partial Hydration](#partial-hydration) - [Minor Changes](#minor-changes-8) - - [Patch Changes](#patch-changes-18) + - [Patch Changes](#patch-changes-20) - [v6.20.1](#v6201) - - [Patch Changes](#patch-changes-19) + - [Patch Changes](#patch-changes-21) - [v6.20.0](#v6200) - [Minor Changes](#minor-changes-9) - - [Patch Changes](#patch-changes-20) + - [Patch Changes](#patch-changes-22) - [v6.19.0](#v6190) - [What's Changed](#whats-changed-7) - [`unstable_flushSync` API](#unstable_flushsync-api) - [Minor Changes](#minor-changes-10) - - [Patch Changes](#patch-changes-21) + - [Patch Changes](#patch-changes-23) - [v6.18.0](#v6180) - [What's Changed](#whats-changed-8) - [New Fetcher APIs](#new-fetcher-apis) - [Persistence Future Flag (`future.v7_fetcherPersist`)](#persistence-future-flag-futurev7_fetcherpersist) - [Minor Changes](#minor-changes-11) - - [Patch Changes](#patch-changes-22) + - [Patch Changes](#patch-changes-24) - [v6.17.0](#v6170) - [What's Changed](#whats-changed-9) - [View Transitions 🚀](#view-transitions-) - [Minor Changes](#minor-changes-12) - - [Patch Changes](#patch-changes-23) + - [Patch Changes](#patch-changes-25) - [v6.16.0](#v6160) - [Minor Changes](#minor-changes-13) - - [Patch Changes](#patch-changes-24) + - [Patch Changes](#patch-changes-26) - [v6.15.0](#v6150) - [Minor Changes](#minor-changes-14) - - [Patch Changes](#patch-changes-25) + - [Patch Changes](#patch-changes-27) - [v6.14.2](#v6142) - - [Patch Changes](#patch-changes-26) + - [Patch Changes](#patch-changes-28) - [v6.14.1](#v6141) - - [Patch Changes](#patch-changes-27) + - [Patch Changes](#patch-changes-29) - [v6.14.0](#v6140) - [What's Changed](#whats-changed-10) - [JSON/Text Submissions](#jsontext-submissions) - [Minor Changes](#minor-changes-15) - - [Patch Changes](#patch-changes-28) + - [Patch Changes](#patch-changes-30) - [v6.13.0](#v6130) - [What's Changed](#whats-changed-11) - [`future.v7_startTransition`](#futurev7_starttransition) - [Minor Changes](#minor-changes-16) - - [Patch Changes](#patch-changes-29) + - [Patch Changes](#patch-changes-31) - [v6.12.1](#v6121) - - [Patch Changes](#patch-changes-30) + - [Patch Changes](#patch-changes-32) - [v6.12.0](#v6120) - [What's Changed](#whats-changed-12) - [`React.startTransition` support](#reactstarttransition-support) - [Minor Changes](#minor-changes-17) - - [Patch Changes](#patch-changes-31) + - [Patch Changes](#patch-changes-33) - [v6.11.2](#v6112) - - [Patch Changes](#patch-changes-32) + - [Patch Changes](#patch-changes-34) - [v6.11.1](#v6111) - - [Patch Changes](#patch-changes-33) + - [Patch Changes](#patch-changes-35) - [v6.11.0](#v6110) - [Minor Changes](#minor-changes-18) - - [Patch Changes](#patch-changes-34) + - [Patch Changes](#patch-changes-36) - [v6.10.0](#v6100) - [What's Changed](#whats-changed-13) - [Minor Changes](#minor-changes-19) - [`future.v7_normalizeFormMethod`](#futurev7_normalizeformmethod) - - [Patch Changes](#patch-changes-35) + - [Patch Changes](#patch-changes-37) - [v6.9.0](#v690) - [What's Changed](#whats-changed-14) - [`Component`/`ErrorBoundary` route properties](#componenterrorboundary-route-properties) - [Introducing Lazy Route Modules](#introducing-lazy-route-modules) - [Minor Changes](#minor-changes-20) - - [Patch Changes](#patch-changes-36) + - [Patch Changes](#patch-changes-38) - [v6.8.2](#v682) - - [Patch Changes](#patch-changes-37) + - [Patch Changes](#patch-changes-39) - [v6.8.1](#v681) - - [Patch Changes](#patch-changes-38) + - [Patch Changes](#patch-changes-40) - [v6.8.0](#v680) - [Minor Changes](#minor-changes-21) - - [Patch Changes](#patch-changes-39) + - [Patch Changes](#patch-changes-41) - [v6.7.0](#v670) - [Minor Changes](#minor-changes-22) - - [Patch Changes](#patch-changes-40) + - [Patch Changes](#patch-changes-42) - [v6.6.2](#v662) - - [Patch Changes](#patch-changes-41) + - [Patch Changes](#patch-changes-43) - [v6.6.1](#v661) - - [Patch Changes](#patch-changes-42) + - [Patch Changes](#patch-changes-44) - [v6.6.0](#v660) - [What's Changed](#whats-changed-15) - [Minor Changes](#minor-changes-23) - - [Patch Changes](#patch-changes-43) + - [Patch Changes](#patch-changes-45) - [v6.5.0](#v650) - [What's Changed](#whats-changed-16) - [Minor Changes](#minor-changes-24) - - [Patch Changes](#patch-changes-44) + - [Patch Changes](#patch-changes-46) - [v6.4.5](#v645) - - [Patch Changes](#patch-changes-45) + - [Patch Changes](#patch-changes-47) - [v6.4.4](#v644) - - [Patch Changes](#patch-changes-46) + - [Patch Changes](#patch-changes-48) - [v6.4.3](#v643) - - [Patch Changes](#patch-changes-47) + - [Patch Changes](#patch-changes-49) - [v6.4.2](#v642) - - [Patch Changes](#patch-changes-48) + - [Patch Changes](#patch-changes-50) - [v6.4.1](#v641) - - [Patch Changes](#patch-changes-49) + - [Patch Changes](#patch-changes-51) - [v6.4.0](#v640) - [What's Changed](#whats-changed-17) - [Remix Data APIs](#remix-data-apis) - - [Patch Changes](#patch-changes-50) + - [Patch Changes](#patch-changes-52) - [v6.3.0](#v630) - [Minor Changes](#minor-changes-25) - [v6.2.2](#v622) - - [Patch Changes](#patch-changes-51) + - [Patch Changes](#patch-changes-53) - [v6.2.1](#v621) - - [Patch Changes](#patch-changes-52) + - [Patch Changes](#patch-changes-54) - [v6.2.0](#v620) - [Minor Changes](#minor-changes-26) - - [Patch Changes](#patch-changes-53) + - [Patch Changes](#patch-changes-55) - [v6.1.1](#v611) - - [Patch Changes](#patch-changes-54) + - [Patch Changes](#patch-changes-56) - [v6.1.0](#v610) - [Minor Changes](#minor-changes-27) - - [Patch Changes](#patch-changes-55) + - [Patch Changes](#patch-changes-57) - [v6.0.2](#v602) - - [Patch Changes](#patch-changes-56) + - [Patch Changes](#patch-changes-58) - [v6.0.1](#v601) - - [Patch Changes](#patch-changes-57) + - [Patch Changes](#patch-changes-59) - [v6.0.0](#v600) diff --git a/contributors.yml b/contributors.yml index 1a2c85439a..789480eae5 100644 --- a/contributors.yml +++ b/contributors.yml @@ -19,6 +19,7 @@ - alexandernanberg - alexanderson1993 - alexlbr +- AlexWebLab - amitdahan - AmRo045 - amsal diff --git a/docs/start/framework/routing.md b/docs/start/framework/routing.md index bd842033ba..80f94d042b 100644 --- a/docs/start/framework/routing.md +++ b/docs/start/framework/routing.md @@ -325,4 +325,4 @@ Note that these routes do not participate in data loading, actions, code splitti Next: [Route Module](./route-module) [file-route-conventions]: ../../how-to/file-route-conventions -[outlet]: ../../api/react-router/Outlet +[outlet]: https://api.reactrouter.com/v7/functions/react_router.Outlet.html diff --git a/docs/tutorials/address-book.md b/docs/tutorials/address-book.md index f4622f4bd9..82a911bffe 100644 --- a/docs/tutorials/address-book.md +++ b/docs/tutorials/address-book.md @@ -340,7 +340,7 @@ export default function App() { Now the child route should be rendering through the outlet. - + ## Client Side Routing @@ -456,7 +456,7 @@ export default function App({ loaderData }) { That's it! React Router will now automatically keep that data in sync with your UI. The sidebar should now look like this: - + You may be wondering why we're "client" loading data instead of loading the data on the server so we can do server-side rendering (SSR). Right now our contacts site is a [Single Page App][spa], so there's no server-side rendering. This makes it really easy to deploy to any static hosting provider, but we'll talk more about how to enable SSR in a bit so you can learn about all the different [rendering strategies][rendering-strategies] React Router offers. @@ -519,13 +519,13 @@ export function HydrateFallback() { Now if you refresh the page, you'll briefly see the loading splash before the app is hydrated. - + ## Index Routes When you load the app and aren't yet on a contact page, you'll notice a big blank page on the right side of the list. - + When a route has children, and you're at the parent route's path, the `` has nothing to render because no children match. You can think of [index routes][index-route] as the default child route to fill in that space. @@ -565,7 +565,7 @@ export default function Home() { } ``` - + Voilà! No more blank space. It's common to put dashboards, stats, feeds, etc. at index routes. They can participate in data loading as well. @@ -661,7 +661,7 @@ export default function App() { Now navigate to the [about page][about-page] and it should look like this: - + ## Layout Routes @@ -798,7 +798,7 @@ export default function App() { Now with that shuffling around done, our about page no longer loads contacts data nor is it nested inside of the sidebar layout: - + ## Pre-rendering a Static Route @@ -865,7 +865,7 @@ Whether you set `ssr` to `true` or `false` depends on you and your users needs. We should be seeing our old static contact page again, with one difference: the URL now has a real ID for the record. - + Remember the `:contactId` part of the route definition in `app/routes.ts`? These dynamic segments will match dynamic (changing) values in that position of the URL. We call these values in the URL "URL Params", or just "params" for short. @@ -898,7 +898,7 @@ export default function Contact({ // existing code ``` - + ## Throwing Responses @@ -934,7 +934,7 @@ Without client side routing, the browser will serialize the `form`'s data automa We can test this out by clicking the "New" button in our app. - + React Router sends a 405 because there is no code on the server to handle this form navigation. @@ -959,7 +959,7 @@ export async function action() { That's it! Go ahead and click the "New" button, and you should see a new record pop into the list 🥳 - + The `createEmptyContact` method just creates an empty contact with no name or data or anything. But it does still create a record, promise! @@ -1081,7 +1081,7 @@ export default function EditContact({ Now click on your new record, then click the "Edit" button. We should see the new route. - + ## Updating Contacts with `FormData` @@ -1110,7 +1110,7 @@ export async function action({ Fill out the form, hit save, and you should see something like this! (Except easier on the eyes and maybe with the patience to cut watermelon.) - + ## Mutation Discussion @@ -1203,7 +1203,7 @@ export async function action() { Now when we click "New", we should end up on the edit page: - + ## Active Link Styling @@ -1253,7 +1253,7 @@ export default function SidebarLayout({ Note that we are passing a function to `className`. When the user is at the URL that matches ``, then `isActive` will be true. When it's _about_ to be active (the data is still loading) then `isPending` will be true. This allows us to easily indicate where the user is and also provide immediate feedback when links are clicked but data needs to be loaded. - + ## Global Pending UI @@ -1298,7 +1298,7 @@ export default function SidebarLayout({ In our case, we add a `"loading"` class to the main part of the app if we're not idle. The CSS then adds a nice fade after a short delay (to avoid flickering the UI for fast loads). You could do anything you want though, like show a spinner or loading bar across the top. - + ## Deleting Records @@ -1448,7 +1448,7 @@ export async function loader({ // existing code ``` - + Because this is a `GET`, not a `POST`, React Router _does not_ call the `action` function. Submitting a `GET` `form` is the same as clicking a link: only the URL changes. @@ -1766,13 +1766,13 @@ export default function SidebarLayout({ You should now have a nice spinner on the left side of the search input. - + ## Managing the History Stack Since the form is submitted for every keystroke, typing the characters "alex" and then deleting them with backspace results in a huge history stack 😂. We definitely don't want this: - + We can avoid this by _replacing_ the current entry in the history stack with the next page, instead of pushing into it. @@ -1880,7 +1880,7 @@ export async function action({ Alright, we're ready to click the star next to the user's name! - + Check that out, both stars automatically update. Our new `` works almost exactly like the `
` we've been using: it calls the action and then all data is revalidated automatically — even your errors will be caught the same way.