Merge branch 'release-next' into dev

DEVELOPMENT.md

@@ -43,6 +43,10 @@ You may need to make changes to a pre-release prior to publishing a final stable
   - Convert the `react-router@6.x.y` tag to a Release on Github with the name `v6.x.y`
   - Copy the relevant changelog entries from all packages into the Release Notes and adjust accordingly, matching the format used by prior releases
 
+### Hotfix releases
+
+Hotfix releases follow the same process as standard releases above, but the `release-*` branch should be branched off latest `main` instead of `dev`. Once the stable hotfix is published, the `release-*` branch should be merged back into both `main` and `dev` just like a normal release.
+
 ### Experimental releases
 
 Experimental releases and hot-fixes do not need to be branched off of `dev`. Experimental releases can be branched from anywhere as they are not intended for general use.

contributors.yml

@@ -2,6 +2,7 @@
 - abhi-kr-2100
 - AchThomas
 - adamdotjs
+- adil62
 - afzalsayed96
 - Ajayff4
 - alany411
@@ -14,7 +15,9 @@
 - awreese
 - aymanemadidi
 - bavardage
+- BDomzalski
 - bhbs
+- bobziroll
 - BrianT1414
 - brockross
 - brophdawg11
@@ -113,6 +116,7 @@
 - p13i
 - parched
 - paulsmithkc
+- pavsoldatov
 - pcattori
 - petersendidit
 - promet99
@@ -147,6 +151,7 @@
 - vijaypushkin
 - vikingviolinist
 - vishwast03
+- WalkAlone0325
 - willemarcel
 - williamsdyyz
 - xavier-lc

docs/components/link.md

@@ -56,7 +56,7 @@ A relative `<Link to>` value (that does not begin with `/`) resolves relative to
 
 ## `relative`
 
-By default, links are relative to the route hierarchy, so `..` will go up one `Route` level. Occasionally, you may find that you have matching URL patterns that do not make sense to be nested, and you're prefer to use relative _path_ routing. You can opt into this behavior with `relative`:
+By default, links are relative to the route hierarchy, so `..` will go up one `Route` level. Occasionally, you may find that you have matching URL patterns that do not make sense to be nested, and you'd prefer to use relative _path_ routing. You can opt into this behavior with `relative`:
 
 ```jsx
 // Contact and EditContact do not share additional UI layout

docs/guides/deferred.md

@@ -65,7 +65,7 @@ Let's take a dive into how to accomplish this.
 
 Start by adding `<Await />` for your slow data requests where you'd rather render a fallback UI. Let's do that for our example above:
 
-```jsx lines=[1,5,10,20-33]
+```jsx lines=[3,9,13,24-40]
 import {
   Await,
   defer,

docs/hooks/use-fetchers.md

@@ -44,16 +44,19 @@ When the user clicks a checkbox, the submission goes to the action to change the
 function Task({ task }) {
   const { projectId, id } = task;
   const toggle = useFetcher();
-  const checked =
-    toggle.formData?.get("complete") || task.complete;
+  const checked = toggle.formData
+    ? toggle.formData.get("complete") === "on"
+    : task.complete;
 
   return (
     <toggle.Form
       method="put"
-      action={`/project/${projectId}/tasks/${id}`}
+      action={`/projects/${projectId}/tasks/${id}`}
     >
+      <input name="id" type="hidden" defaultValue={id} />
       <label>
         <input
+          name="complete"
           type="checkbox"
           checked={checked}
           onChange={(e) => toggle.submit(e.target.form)}
@@ -98,15 +101,15 @@ function ProjectTaskCount({ project }) {
   const fetchers = useFetchers();
 
   // Find this project's fetchers
-  let projectFetchers = fetchers.filter((fetcher) => {
+  const relevantFetchers = fetchers.filter((fetcher) => {
     return fetcher.formAction?.startsWith(
-      `/projects/${project.id}/task`
+      `/projects/${project.id}/tasks/`
     );
   });
 
   // Store in a map for easy lookup
   const myFetchers = new Map(
-    fetchers.map(({ formData }) => [
+    relevantFetchers.map(({ formData }) => [
       formData.get("id"),
       formData.get("complete") === "on",
     ])

docs/route/route.md

@@ -278,7 +278,7 @@ Please see the [errorElement][errorelement] documentation for more details.
 
 [outlet]: ./outlet
 [remix]: https://remix.run
-[indexroute]: ../guides/index-route
+[indexroute]: ../start/concepts#index-routes
 [outlet]: ../components/outlet
 [useloaderdata]: ../hooks/use-loader-data
 [loader]: ./loader

docs/start/overview.md

@@ -173,7 +173,7 @@ See:
 
 ## Ranked Route Matching
 
-When matching URLs to routes, React Router will rank the routes according the number of segments, static segments, dynamic segments, splats, etc. and pick the _most specific_ match.
+When matching URLs to routes, React Router will rank the routes according to the number of segments, static segments, dynamic segments, splats, etc. and pick the _most specific_ match.
 
 For example, consider these two routes:
 

docs/start/tutorial.md

@@ -67,13 +67,12 @@ The `main.jsx` file is the entry point. Open it up and we'll put React Router on
 
 👉 **Create and render a [browser router][createbrowserrouter] in `main.jsx`**
 
-```jsx lines=[3-7,10-15,19] filename=src/main.jsx
+```jsx lines=[3-6,9-14,18] filename=src/main.jsx
 import React from "react";
 import ReactDOM from "react-dom/client";
 import {
   createBrowserRouter,
   RouterProvider,
-  Route,
 } from "react-router-dom";
 import "./index.css";
 
@@ -605,7 +604,8 @@ import {
 import { getContacts, createContact } from "../contacts";
 
 export async function action() {
-  await createContact();
+  const contact = await createContact();
+  return { contact };
 }
 
 /* other code */

packages/react-router-dom-v5-compat/CHANGELOG.md

@@ -1,5 +1,13 @@
 # `react-router-dom-v5-compat`
 
+## 6.5.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.5.0`
+  - `react-router-dom@6.5.0`
+
 ## 6.4.5
 
 ### Patch Changes

packages/react-router-dom-v5-compat/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-router-dom-v5-compat",
-  "version": "6.4.5",
+  "version": "6.5.0",
   "description": "Migration path to React Router v6 from v4/5",
   "keywords": [
     "react",
@@ -24,7 +24,7 @@
   "types": "./dist/index.d.ts",
   "dependencies": {
     "history": "^5.3.0",
-    "react-router": "6.4.5"
+    "react-router": "6.5.0"
   },
   "peerDependencies": {
     "react": ">=16.8",

packages/react-router-dom/CHANGELOG.md

@@ -1,5 +1,13 @@
 # `react-router-dom`
 
+## 6.5.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.5.0`
+  - `@remix-run/router@1.1.0`
+
 ## 6.4.5
 
 ### Patch Changes

packages/react-router-dom/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-router-dom",
-  "version": "6.4.5",
+  "version": "6.5.0",
   "description": "Declarative routing for React web applications",
   "keywords": [
     "react",
@@ -23,8 +23,8 @@
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "dependencies": {
-    "@remix-run/router": "1.0.5",
-    "react-router": "6.4.5"
+    "@remix-run/router": "1.1.0",
+    "react-router": "6.5.0"
   },
   "devDependencies": {
     "react": "^18.2.0",

packages/react-router-native/CHANGELOG.md

@@ -1,5 +1,12 @@
 # `react-router-native`
 
+## 6.5.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.5.0`
+
 ## 6.4.5
 
 ### Patch Changes

packages/react-router-native/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-router-native",
-  "version": "6.4.5",
+  "version": "6.5.0",
   "description": "Declarative routing for React Native applications",
   "keywords": [
     "react",
@@ -22,7 +22,7 @@
   "types": "./dist/index.d.ts",
   "dependencies": {
     "@ungap/url-search-params": "^0.1.4",
-    "react-router": "6.4.5"
+    "react-router": "6.5.0"
   },
   "devDependencies": {
     "react": "^18.2.0",

packages/react-router/CHANGELOG.md

@@ -1,5 +1,60 @@
 # `react-router`
 
+## 6.5.0
+
+This release introduces support for [Optional Route Segments](https://github.com/remix-run/react-router/issues/9546). Now, adding a `?` to the end of any path segment will make that entire segment optional. This works for both static segments and dynamic parameters.
+
+**Optional Params Examples**
+
+- `<Route path=":lang?/about>` will match:
+  - `/:lang/about`
+  - `/about`
+- `<Route path="/multistep/:widget1?/widget2?/widget3?">` will match:
+  - `/multistep`
+  - `/multistep/:widget1`
+  - `/multistep/:widget1/:widget2`
+  - `/multistep/:widget1/:widget2/:widget3`
+
+**Optional Static Segment Example**
+
+- `<Route path="/home?">` will match:
+  - `/`
+  - `/home`
+- `<Route path="/fr?/about">` will match:
+  - `/about`
+  - `/fr/about`
+
+### Minor Changes
+
+- Allows optional routes and optional static segments ([#9650](https://github.com/remix-run/react-router/pull/9650))
+
+### Patch Changes
+
+- Stop incorrectly matching on partial named parameters, i.e. `<Route path="prefix-:param">`, to align with how splat parameters work. If you were previously relying on this behavior then it's recommended to extract the static portion of the path at the `useParams` call site: ([#9506](https://github.com/remix-run/react-router/pull/9506))
+
+```jsx
+// Old behavior at URL /prefix-123
+<Route path="prefix-:id" element={<Comp /> }>
+
+function Comp() {
+  let params = useParams(); // { id: '123' }
+  let id = params.id; // "123"
+  ...
+}
+
+// New behavior at URL /prefix-123
+<Route path=":id" element={<Comp /> }>
+
+function Comp() {
+  let params = useParams(); // { id: 'prefix-123' }
+  let id = params.id.replace(/^prefix-/, ''); // "123"
+  ...
+}
+```
+
+- Updated dependencies:
+  - `@remix-run/router@1.1.0`
+
 ## 6.4.5
 
 ### Patch Changes