Skip to content

Commit dedafeb

Browse files
committed
Merge branch 'release-next'
2 parents fe661c5 + ed17fcd commit dedafeb

File tree

23 files changed

+889
-265
lines changed

23 files changed

+889
-265
lines changed

docs/guides/api-development-strategy.md

Lines changed: 35 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,12 +49,46 @@ The lifecycle is thus either:
4949

5050
## Current Future Flags
5151

52-
Here's the current future flags in React Router v6 today:
52+
Here's the current future flags in React Router v6 today.
53+
54+
### `@remix-run/router` Future Flags
55+
56+
These flags are only applicable when using a [Data Router][picking-a-router] and are passed when creating the `router` instance:
57+
58+
```js
59+
const router = createBrowserRouter(routes, {
60+
future: {
61+
v7_normalizeFormMethod: true,
62+
},
63+
});
64+
```
5365

5466
| Flag | Description |
5567
| ------------------------ | --------------------------------------------------------------------- |
5668
| `v7_normalizeFormMethod` | Normalize `useNavigation().formMethod` to be an uppercase HTTP Method |
5769

70+
### React Router Future Flags
71+
72+
These flags apply to both Data and non-Data Routers and are passed to the rendered React component:
73+
74+
```jsx
75+
<BrowserRouter future={{ v7_startTransition: true }}>
76+
<Routes>{/*...*/}</Routes>
77+
</BrowserRouter>
78+
```
79+
80+
```jsx
81+
<RouterProvider
82+
router={router}
83+
future={{ v7_startTransition: true }}
84+
/>
85+
```
86+
87+
| Flag | Description |
88+
| -------------------- | --------------------------------------------------------------------------- |
89+
| `v7_startTransition` | Wrap all router state updates in [`React.startTransition`][starttransition] |
90+
5891
[future-flags-blog-post]: https://remix.run/blog/future-flags
5992
[feature-flowchart]: https://remix.run/docs-images/feature-flowchart.png
6093
[picking-a-router]: ../routers/picking-a-router
94+
[starttransition]: https://react.dev/reference/react/startTransition

docs/router-components/browser-router.md

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ declare function BrowserRouter(
1515
interface BrowserRouterProps {
1616
basename?: string;
1717
children?: React.ReactNode;
18+
future?: FutureConfig;
1819
window?: Window;
1920
}
2021
```
@@ -23,8 +24,6 @@ interface BrowserRouterProps {
2324

2425
A `<BrowserRouter>` stores the current location in the browser's address bar using clean URLs and navigates using the browser's built-in history stack.
2526

26-
`<BrowserRouter window>` defaults to using the current [document's `defaultView`][defaultview], but it may also be used to track changes to another window's URL, in an `<iframe>`, for example.
27-
2827
```tsx
2928
import * as React from "react";
3029
import { createRoot } from "react-dom/client";
@@ -39,4 +38,39 @@ root.render(
3938
);
4039
```
4140

41+
## `basename`
42+
43+
Configure your application to run underneath a specific basename in the URL:
44+
45+
```jsx
46+
function App() {
47+
return (
48+
<BrowserRouter basename="/app">
49+
<Routes>
50+
<Route path="/" /> {/* 👈 Renders at /app/ */}
51+
</Routes>
52+
</BrowserRouter>
53+
);
54+
}
55+
```
56+
57+
## `future`
58+
59+
An optional set of [Future Flags][api-development-strategy] to enable. We recommend opting into newly released future flags sooner rather than later to ease your eventual migration to v7.
60+
61+
```jsx
62+
function App() {
63+
return (
64+
<BrowserRouter future={{ v7_startTransition: true }}>
65+
<Routes>{/*...*/}</Routes>
66+
</BrowserRouter>
67+
);
68+
}
69+
```
70+
71+
## `window`
72+
73+
`BrowserRouter` defaults to using the current [document's `defaultView`][defaultview], but it may also be used to track changes to another window's URL, in an `<iframe>`, for example.
74+
4275
[defaultview]: https://developer.mozilla.org/en-US/docs/Web/API/Document/defaultView
76+
[api-development-strategy]: ../guides/api-development-strategy

docs/router-components/hash-router.md

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ declare function HashRouter(
1515
interface HashRouterProps {
1616
basename?: string;
1717
children?: React.ReactNode;
18+
future?: FutureConfig;
1819
window?: Window;
1920
}
2021
```
@@ -23,8 +24,6 @@ interface HashRouterProps {
2324

2425
`<HashRouter>` is for use in web browsers when the URL should not (or cannot) be sent to the server for some reason. This may happen in some shared hosting scenarios where you do not have full control over the server. In these situations, `<HashRouter>` makes it possible to store the current location in the `hash` portion of the current URL, so it is never sent to the server.
2526

26-
`<HashRouter window>` defaults to using the current [document's `defaultView`][defaultview], but it may also be used to track changes to another window's URL, in an `<iframe>`, for example.
27-
2827
```tsx
2928
import * as React from "react";
3029
import * as ReactDOM from "react-dom";
@@ -40,4 +39,39 @@ ReactDOM.render(
4039

4140
<docs-warning>We strongly recommend you do not use `HashRouter` unless you absolutely have to.</docs-warning>
4241

42+
## `basename`
43+
44+
Configure your application to run underneath a specific basename in the URL:
45+
46+
```jsx
47+
function App() {
48+
return (
49+
<HashRouter basename="/app">
50+
<Routes>
51+
<Route path="/" /> {/* 👈 Renders at /#/app/ */}
52+
</Routes>
53+
</HashRouter>
54+
);
55+
}
56+
```
57+
58+
## `future`
59+
60+
An optional set of [Future Flags][api-development-strategy] to enable. We recommend opting into newly released future flags sooner rather than later to ease your eventual migration to v7.
61+
62+
```jsx
63+
function App() {
64+
return (
65+
<HashRouter future={{ v7_startTransition: true }}>
66+
<Routes>{/*...*/}</Routes>
67+
</HashRouter>
68+
);
69+
}
70+
```
71+
72+
## `window`
73+
74+
`HashRouter` defaults to using the current [document's `defaultView`][defaultview], but it may also be used to track changes to another window's URL, in an `<iframe>`, for example.
75+
4376
[defaultview]: https://developer.mozilla.org/en-US/docs/Web/API/Document/defaultView
77+
[api-development-strategy]: ../guides/api-development-strategy

docs/router-components/memory-router.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ interface MemoryRouterProps {
1717
children?: React.ReactNode;
1818
initialEntries?: InitialEntry[];
1919
initialIndex?: number;
20+
future?: FutureConfig;
2021
}
2122
```
2223

@@ -59,4 +60,36 @@ describe("My app", () => {
5960
});
6061
```
6162

63+
## `basename`
64+
65+
Configure your application to run underneath a specific basename in the URL:
66+
67+
```jsx
68+
function App() {
69+
return (
70+
<MemoryRouter basename="/app">
71+
<Routes>
72+
<Route path="/" /> {/* 👈 Renders at /app/ */}
73+
</Routes>
74+
</MemoryRouter>
75+
);
76+
}
77+
```
78+
79+
## `future`
80+
81+
An optional set of [Future Flags][api-development-strategy] to enable. We recommend opting into newly released future flags sooner rather than later to ease your eventual migration to v7.
82+
83+
```jsx
84+
function App() {
85+
return (
86+
<MemoryRouter future={{ v7_startTransition: true }}>
87+
<Routes>{/*...*/}</Routes>
88+
</MemoryRouter>
89+
);
90+
}
91+
```
92+
93+
[defaultview]: https://developer.mozilla.org/en-US/docs/Web/API/Document/defaultView
94+
[api-development-strategy]: ../guides/api-development-strategy
6295
[tests]: https://github.com/remix-run/react-router/tree/main/packages/react-router/__tests__

docs/routers/router-provider.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,23 @@ new: true
55

66
# `<RouterProvider>`
77

8+
<details>
9+
<summary>Type declaration</summary>
10+
11+
```tsx
12+
declare function RouterProvider(
13+
props: RouterProviderProps
14+
): React.ReactElement;
15+
16+
interface RouterProviderProps {
17+
fallbackElement?: React.ReactNode;
18+
router: Router;
19+
future?: FutureConfig;
20+
}
21+
```
22+
23+
</details>
24+
825
All [data router][picking-a-router] objects are passed to this component to render your app and enable the rest of the data APIs.
926

1027
```jsx lines=[24]
@@ -49,4 +66,20 @@ If you are not server rendering your app, `createBrowserRouter` will initiate al
4966
/>
5067
```
5168

69+
## `future`
70+
71+
An optional set of [Future Flags][api-development-strategy] to enable. We recommend opting into newly released future flags sooner rather than later to ease your eventual migration to v7.
72+
73+
```jsx
74+
function App() {
75+
return (
76+
<RouterProvider
77+
router={router}
78+
future={{ v7_startTransition: true }}
79+
/>
80+
);
81+
}
82+
```
83+
5284
[picking-a-router]: ./picking-a-router
85+
[api-development-strategy]: ../guides/api-development-strategy

package.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -112,16 +112,16 @@
112112
"none": "45 kB"
113113
},
114114
"packages/react-router/dist/react-router.production.min.js": {
115-
"none": "13.4 kB"
115+
"none": "13.5 kB"
116116
},
117117
"packages/react-router/dist/umd/react-router.production.min.js": {
118118
"none": "15.8 kB"
119119
},
120120
"packages/react-router-dom/dist/react-router-dom.production.min.js": {
121-
"none": "12.0 kB"
121+
"none": "12.1 kB"
122122
},
123123
"packages/react-router-dom/dist/umd/react-router-dom.production.min.js": {
124-
"none": "18.0 kB"
124+
"none": "18.1 kB"
125125
}
126126
}
127127
}

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

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,13 @@
11
# `react-router-dom-v5-compat`
22

3+
## 6.13.0
4+
5+
### Patch Changes
6+
7+
- Updated dependencies:
8+
9+
10+
311
## 6.12.1
412

513
### Patch Changes

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-router-dom-v5-compat",
3-
"version": "6.12.1",
3+
"version": "6.13.0",
44
"description": "Migration path to React Router v6 from v4/5",
55
"keywords": [
66
"react",
@@ -24,7 +24,7 @@
2424
"types": "./dist/index.d.ts",
2525
"dependencies": {
2626
"history": "^5.3.0",
27-
"react-router": "6.12.1"
27+
"react-router": "6.13.0"
2828
},
2929
"peerDependencies": {
3030
"react": ">=16.8",

packages/react-router-dom/CHANGELOG.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,42 @@
11
# `react-router-dom`
22

3+
## 6.13.0
4+
5+
### Minor Changes
6+
7+
- Move [`React.startTransition`](https://react.dev/reference/react/startTransition) usage behind a [future flag](https://reactrouter.com/en/main/guides/api-development-strategy) to avoid issues with existing incompatible `Suspense` usages. We recommend folks adopting this flag to be better compatible with React concurrent mode, but if you run into issues you can continue without the use of `startTransition` until v7. Issues usually boils down to creating net-new promises during the render cycle, so if you run into issues you should either lift your promise creation out of the render cycle or put it behind a `useMemo`. ([#10596](https://github.com/remix-run/react-router/pull/10596))
8+
9+
Existing behavior will no longer include `React.startTransition`:
10+
11+
```jsx
12+
<BrowserRouter>
13+
<Routes>{/*...*/}</Routes>
14+
</BrowserRouter>
15+
16+
<RouterProvider router={router} />
17+
```
18+
19+
If you wish to enable `React.startTransition`, pass the future flag to your component:
20+
21+
```jsx
22+
<BrowserRouter future={{ v7_startTransition: true }}>
23+
<Routes>{/*...*/}</Routes>
24+
</BrowserRouter>
25+
26+
<RouterProvider router={router} future={{ v7_startTransition: true }}/>
27+
```
28+
29+
### Patch Changes
30+
31+
- Work around webpack/terser `React.startTransition` minification bug in production mode ([#10588](https://github.com/remix-run/react-router/pull/10588))
32+
- Updated dependencies:
33+
34+
335
## 6.12.1
436

37+
> **Warning**
38+
> Please use version `6.13.0` or later instead of `6.12.1`. This version suffers from a `webpack`/`terser` minification issue resulting in invalid minified code in your resulting production bundles which can cause issues in your application. See [#10579](https://github.com/remix-run/react-router/issues/10579) for more details.
39+
540
### Patch Changes
641

742
- Adjust feature detection of `React.startTransition` to fix webpack + react 17 compilation error ([#10569](https://github.com/remix-run/react-router/pull/10569))

0 commit comments

Comments
 (0)