-
@@ -2905,7 +2905,7 @@ function testDomRouter(
`);
});
- it("accepts unstable_defaultShouldRevalidate on fetcher.submit", async () => {
+ it("accepts defaultShouldRevalidate on fetcher.submit", async () => {
let loaderDefer = createDeferred();
let actionDefer = createDeferred();
@@ -2937,7 +2937,7 @@ function testDomRouter(
{
method: "post",
action: "/",
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
},
)
}
diff --git a/packages/react-router/__tests__/dom/ssr/components-test.tsx b/packages/react-router/__tests__/dom/ssr/components-test.tsx
index f13a6b561a..3b4a0a1e36 100644
--- a/packages/react-router/__tests__/dom/ssr/components-test.tsx
+++ b/packages/react-router/__tests__/dom/ssr/components-test.tsx
@@ -390,6 +390,84 @@ describe("
", () => {
});
});
+describe("
", () => {
+ it("propagates nonce to modulepreload links", async () => {
+ let staticHandlerContext = await createStaticHandler([{ path: "/" }]).query(
+ new Request("http://localhost/"),
+ );
+
+ invariant(
+ !(staticHandlerContext instanceof Response),
+ "Expected a context",
+ );
+
+ let context = mockEntryContext({
+ manifest: {
+ routes: {
+ root: {
+ hasLoader: false,
+ hasAction: false,
+ hasErrorBoundary: false,
+ id: "root",
+ module: "root.js",
+ path: "/",
+ },
+ },
+ entry: {
+ imports: ["preload-a.js", "preload-b.js"],
+ module: "entry.js",
+ },
+ url: "manifest.js",
+ version: "",
+ },
+ routeDiscovery: { mode: "initial", manifestPath: "/__manifest" },
+ routeModules: {
+ root: {
+ default: () => (
+ <>
+
Root
+
+
+ ),
+ },
+ },
+ });
+
+ let { container } = render(
+
,
+ );
+
+ let modulePreloads = container.ownerDocument.querySelectorAll(
+ 'link[rel="modulepreload"]',
+ );
+ expect(modulePreloads.length).toBeGreaterThan(0);
+ modulePreloads.forEach((link) => {
+ expect(link).toHaveAttribute("nonce", "test-nonce");
+ });
+
+ expect(
+ container.ownerDocument.querySelector(
+ 'link[rel="modulepreload"][href="manifest.js"]',
+ ),
+ ).toHaveAttribute("nonce", "test-nonce");
+ expect(
+ container.ownerDocument.querySelector(
+ 'link[rel="modulepreload"][href="entry.js"]',
+ ),
+ ).toHaveAttribute("nonce", "test-nonce");
+ expect(
+ container.ownerDocument.querySelector(
+ 'link[rel="modulepreload"][href="preload-a.js"]',
+ ),
+ ).toHaveAttribute("nonce", "test-nonce");
+ expect(
+ container.ownerDocument.querySelector(
+ 'link[rel="modulepreload"][href="preload-b.js"]',
+ ),
+ ).toHaveAttribute("nonce", "test-nonce");
+ });
+});
+
describe("usePrefetchBehavior", () => {
function TestComponent({
prefetch,
diff --git a/packages/react-router/__tests__/react-transitions-test.tsx b/packages/react-router/__tests__/react-transitions-test.tsx
index e3d6a5e4b4..3235d6becc 100644
--- a/packages/react-router/__tests__/react-transitions-test.tsx
+++ b/packages/react-router/__tests__/react-transitions-test.tsx
@@ -29,7 +29,7 @@ import { createDeferred, tick } from "./router/utils/utils";
import getWindow from "./utils/getWindow";
describe("react transitions", () => {
- describe("
", () => {
+ describe("
", () => {
it("normal navigations surface all updates", async () => {
let loaderDfd = createDeferred();
let router = createMemoryRouter([
@@ -333,7 +333,7 @@ describe("react transitions", () => {
});
});
- describe("
", () => {
+ describe("
", () => {
it("navigations are not transition-enabled", async () => {
let loaderDfd = createDeferred();
let router = createMemoryRouter([
@@ -381,7 +381,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Go to page"));
@@ -487,7 +487,7 @@ describe("react transitions", () => {
});
});
- describe("
", () => {
+ describe("
", () => {
it("Link navigations are transition-enabled", async () => {
let loaderDfd = createDeferred();
let router = createMemoryRouter([
@@ -535,7 +535,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Go to page"));
@@ -607,7 +607,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Go to page"));
@@ -684,7 +684,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Go to page"));
@@ -760,7 +760,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Submit"));
@@ -843,7 +843,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Submit"));
@@ -930,7 +930,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Submit"));
@@ -1000,7 +1000,7 @@ describe("react transitions", () => {
);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Submit"));
@@ -1056,7 +1056,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Fetch"));
@@ -1120,7 +1120,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Fetch"));
@@ -1191,7 +1191,7 @@ describe("react transitions", () => {
]);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Go to page"));
@@ -1263,7 +1263,7 @@ describe("react transitions", () => {
);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Revalidate"));
@@ -1338,7 +1338,7 @@ describe("react transitions", () => {
);
let { container } = render(
-
,
+
,
);
await waitFor(() => screen.getByText("Revalidate"));
diff --git a/packages/react-router/__tests__/router/fetchers-test.ts b/packages/react-router/__tests__/router/fetchers-test.ts
index a8bcf82c96..4f42d4a36c 100644
--- a/packages/react-router/__tests__/router/fetchers-test.ts
+++ b/packages/react-router/__tests__/router/fetchers-test.ts
@@ -177,8 +177,8 @@ describe("fetchers", () => {
request: new Request("http://localhost/foo", {
signal: A.loaders.foo.stub.mock.calls[0][0].request.signal,
}),
- unstable_pattern: "/foo",
- unstable_url: new URL("http://localhost/foo"),
+ pattern: "/foo",
+ url: new URL("http://localhost/foo"),
context: {},
});
});
@@ -226,8 +226,8 @@ describe("fetchers", () => {
request: new Request("http://localhost/foo?key=value", {
signal: A.loaders.foo.stub.mock.calls[0][0].request.signal,
}),
- unstable_pattern: "/foo",
- unstable_url: new URL("http://localhost/foo?key=value"),
+ pattern: "/foo",
+ url: new URL("http://localhost/foo?key=value"),
context: {},
});
@@ -280,8 +280,8 @@ describe("fetchers", () => {
expect(A.actions.foo.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: "/foo",
- unstable_url: new URL("http://localhost/foo"),
+ pattern: "/foo",
+ url: new URL("http://localhost/foo"),
context: {},
});
@@ -393,8 +393,8 @@ describe("fetchers", () => {
request: new Request("http://localhost/foo", {
signal: A.loaders.root.stub.mock.calls[0][0].request.signal,
}),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
});
@@ -3395,8 +3395,8 @@ describe("fetchers", () => {
expect(F.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -3426,8 +3426,8 @@ describe("fetchers", () => {
expect(F.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -3455,8 +3455,8 @@ describe("fetchers", () => {
expect(F.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -3484,8 +3484,8 @@ describe("fetchers", () => {
expect(F.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -3514,8 +3514,8 @@ describe("fetchers", () => {
expect(F.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -3546,8 +3546,8 @@ describe("fetchers", () => {
expect(F.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -3577,8 +3577,8 @@ describe("fetchers", () => {
expect(F.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
diff --git a/packages/react-router/__tests__/router/instrumentation-test.ts b/packages/react-router/__tests__/router/instrumentation-test.ts
index 52bab8a3b0..49d84ac871 100644
--- a/packages/react-router/__tests__/router/instrumentation-test.ts
+++ b/packages/react-router/__tests__/router/instrumentation-test.ts
@@ -43,7 +43,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -87,7 +87,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -135,7 +135,7 @@ describe("instrumentation", () => {
index: "INDEX",
},
},
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -176,7 +176,7 @@ describe("instrumentation", () => {
action: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -219,7 +219,7 @@ describe("instrumentation", () => {
lazy: () => lazyDfd.promise,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -263,7 +263,7 @@ describe("instrumentation", () => {
lazy: () => lazyDfd.promise,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -311,7 +311,7 @@ describe("instrumentation", () => {
lazy: () => lazyDfd.promise,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -363,7 +363,7 @@ describe("instrumentation", () => {
lazy: () => lazyDfd.promise,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -422,7 +422,7 @@ describe("instrumentation", () => {
lazy: () => lazyDfd.promise,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -487,7 +487,7 @@ describe("instrumentation", () => {
},
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -551,7 +551,7 @@ describe("instrumentation", () => {
},
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -613,7 +613,7 @@ describe("instrumentation", () => {
},
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -682,7 +682,7 @@ describe("instrumentation", () => {
action: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -763,7 +763,7 @@ describe("instrumentation", () => {
lazy: () => lazyDfd.promise,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -838,7 +838,7 @@ describe("instrumentation", () => {
},
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -931,7 +931,7 @@ describe("instrumentation", () => {
]);
}
},
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1009,7 +1009,7 @@ describe("instrumentation", () => {
]);
}
},
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1090,7 +1090,7 @@ describe("instrumentation", () => {
]);
}
},
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1169,7 +1169,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1228,7 +1228,7 @@ describe("instrumentation", () => {
path: "/target",
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1295,7 +1295,7 @@ describe("instrumentation", () => {
path: "/target",
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1365,7 +1365,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1408,7 +1408,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1451,7 +1451,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1488,7 +1488,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1530,7 +1530,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1554,7 +1554,7 @@ describe("instrumentation", () => {
expect(args.request.headers.get).toBeDefined();
expect(args.request.headers.set).not.toBeDefined();
expect(args.params).toEqual({ slug: "a", extra: "extra" });
- expect(args.unstable_pattern).toBe("/:slug");
+ expect(args.pattern).toBe("/:slug");
expect(args.context.get).toBeDefined();
expect(args.context.set).not.toBeDefined();
expect(t.router.state.matches[0].params).toEqual({ slug: "a" });
@@ -1573,7 +1573,7 @@ describe("instrumentation", () => {
loader: true,
},
],
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1624,7 +1624,7 @@ describe("instrumentation", () => {
},
],
{
- unstable_instrumentations: [
+ instrumentations: [
{
router(router) {
router.instrument({
@@ -1666,7 +1666,7 @@ describe("instrumentation", () => {
},
],
{
- unstable_instrumentations: [
+ instrumentations: [
{
router(router) {
router.instrument({
@@ -1719,7 +1719,7 @@ describe("instrumentation", () => {
},
],
{
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1766,7 +1766,7 @@ describe("instrumentation", () => {
},
],
{
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1811,7 +1811,7 @@ describe("instrumentation", () => {
},
],
{
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1879,7 +1879,7 @@ describe("instrumentation", () => {
},
],
{
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1922,7 +1922,7 @@ describe("instrumentation", () => {
},
],
{
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -1974,7 +1974,7 @@ describe("instrumentation", () => {
handleDocumentRequest(request) {
return new Response(`${request.method} ${request.url} COMPONENT`);
},
- unstable_instrumentations: [
+ instrumentations: [
{
handler(handler) {
handler.instrument({
@@ -2050,7 +2050,7 @@ describe("instrumentation", () => {
handleDocumentRequest(request) {
return new Response(`${request.method} ${request.url} COMPONENT`);
},
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -2081,7 +2081,7 @@ describe("instrumentation", () => {
},
},
params: {},
- unstable_pattern: "/",
+ pattern: "/",
context: {
get: expect.any(Function),
},
@@ -2100,7 +2100,7 @@ describe("instrumentation", () => {
},
},
params: {},
- unstable_pattern: "/",
+ pattern: "/",
context: {
get: expect.any(Function),
},
@@ -2126,7 +2126,7 @@ describe("instrumentation", () => {
handleDocumentRequest(request) {
return new Response(`${request.method} ${request.url} COMPONENT`);
},
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -2157,7 +2157,7 @@ describe("instrumentation", () => {
},
},
params: {},
- unstable_pattern: "/",
+ pattern: "/",
context: {},
},
],
@@ -2173,7 +2173,7 @@ describe("instrumentation", () => {
},
},
params: {},
- unstable_pattern: "/",
+ pattern: "/",
context: {},
},
],
@@ -2197,7 +2197,7 @@ describe("instrumentation", () => {
handleDocumentRequest(request) {
return new Response(`${request.method} ${request.url} COMPONENT`);
},
- unstable_instrumentations: [
+ instrumentations: [
{
route(route) {
route.instrument({
@@ -2230,7 +2230,7 @@ describe("instrumentation", () => {
},
},
params: {},
- unstable_pattern: "/",
+ pattern: "/",
context: {},
},
],
@@ -2246,7 +2246,7 @@ describe("instrumentation", () => {
},
},
params: {},
- unstable_pattern: "/",
+ pattern: "/",
context: {},
},
],
diff --git a/packages/react-router/__tests__/router/mask-test.ts b/packages/react-router/__tests__/router/mask-test.ts
index 0ab7ea5444..70cb65f69e 100644
--- a/packages/react-router/__tests__/router/mask-test.ts
+++ b/packages/react-router/__tests__/router/mask-test.ts
@@ -16,7 +16,7 @@ describe("location masking", () => {
// Navigate to /gallery?photo=123 but mask browser URL as /images/123
let A = await t.navigate("/gallery?photo=123", {
- unstable_mask: "/images/123",
+ mask: "/images/123",
});
// The loader should receive the router location URL in the request
@@ -29,7 +29,7 @@ describe("location masking", () => {
expect(t.router.state.location).toMatchObject({
pathname: "/gallery",
search: "?photo=123",
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "",
@@ -54,7 +54,7 @@ describe("location masking", () => {
// Navigate to /gallery?photo=123 with mask
let A = await t.navigate("/gallery?photo=123", {
- unstable_mask: "/images/123",
+ mask: "/images/123",
});
await A.loaders.gallery.resolve("GALLERY DATA");
@@ -71,7 +71,7 @@ describe("location masking", () => {
expect(t.router.state.location).toMatchObject({
pathname: "/gallery",
search: "?photo=123",
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "",
@@ -91,7 +91,7 @@ describe("location masking", () => {
});
let A = await t.navigate("/gallery?photo=123", {
- unstable_mask: "/images/123",
+ mask: "/images/123",
replace: true,
});
@@ -101,7 +101,7 @@ describe("location masking", () => {
expect(t.router.state.location).toMatchObject({
pathname: "/gallery",
search: "?photo=123",
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "",
@@ -119,7 +119,7 @@ describe("location masking", () => {
});
let A = await t.navigate("/gallery?photo=123#header", {
- unstable_mask: "/images/123#preview",
+ mask: "/images/123#preview",
});
expect(A.loaders.gallery).toBeDefined();
@@ -135,7 +135,7 @@ describe("location masking", () => {
pathname: "/gallery",
search: "?photo=123",
hash: "#header",
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "#preview",
@@ -153,7 +153,7 @@ describe("location masking", () => {
});
let A = await t.navigate("/gallery?photo=123", {
- unstable_mask: "/images/123",
+ mask: "/images/123",
state: { customData: "test" },
});
@@ -163,7 +163,7 @@ describe("location masking", () => {
pathname: "/gallery",
search: "?photo=123",
state: { customData: "test" },
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "",
@@ -181,7 +181,7 @@ describe("location masking", () => {
});
let A = await t.navigate("/gallery?photo=123", {
- unstable_mask: "/images/123",
+ mask: "/images/123",
formMethod: "post",
formData: createFormData({ test: "value" }),
});
@@ -204,7 +204,7 @@ describe("location masking", () => {
expect(t.router.state.location).toMatchObject({
pathname: "/gallery",
search: "?photo=123",
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "",
@@ -226,7 +226,7 @@ describe("location masking", () => {
});
let A = await t.navigate("/gallery?photo=123", {
- unstable_mask: "/images/123",
+ mask: "/images/123",
});
expect(A.loaders.gallery).toBeDefined();
@@ -235,7 +235,7 @@ describe("location masking", () => {
expect(t.router.state.location).toMatchObject({
pathname: "/gallery",
search: "?photo=123",
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "",
@@ -257,14 +257,14 @@ describe("location masking", () => {
// Navigate to non-existent route with mask
await t.navigate("/nonexistent", {
- unstable_mask: "/images/123",
+ mask: "/images/123",
});
// Should get a 404 error
expect(t.router.state.errors).toBeDefined();
expect(t.router.state.location).toMatchObject({
pathname: "/nonexistent",
- unstable_mask: {
+ mask: {
pathname: "/images/123",
search: "",
hash: "",
diff --git a/packages/react-router/__tests__/router/router-test.ts b/packages/react-router/__tests__/router/router-test.ts
index 7bd315f1b1..1e808f1df1 100644
--- a/packages/react-router/__tests__/router/router-test.ts
+++ b/packages/react-router/__tests__/router/router-test.ts
@@ -1751,8 +1751,8 @@ describe("a router", () => {
request: new Request("http://localhost/tasks", {
signal: nav.loaders.tasks.stub.mock.calls[0][0].request.signal,
}),
- unstable_pattern: "/tasks",
- unstable_url: new URL("http://localhost/tasks"),
+ pattern: "/tasks",
+ url: new URL("http://localhost/tasks"),
context: {},
});
@@ -1762,8 +1762,8 @@ describe("a router", () => {
request: new Request("http://localhost/tasks/1", {
signal: nav2.loaders.tasksId.stub.mock.calls[0][0].request.signal,
}),
- unstable_pattern: "/tasks/:id",
- unstable_url: new URL("http://localhost/tasks/1"),
+ pattern: "/tasks/:id",
+ url: new URL("http://localhost/tasks/1"),
context: {},
});
@@ -1773,8 +1773,8 @@ describe("a router", () => {
request: new Request("http://localhost/tasks?foo=bar", {
signal: nav3.loaders.tasks.stub.mock.calls[0][0].request.signal,
}),
- unstable_pattern: "/tasks",
- unstable_url: new URL("http://localhost/tasks?foo=bar#hash"),
+ pattern: "/tasks",
+ url: new URL("http://localhost/tasks?foo=bar#hash"),
context: {},
});
@@ -1786,8 +1786,8 @@ describe("a router", () => {
request: new Request("http://localhost/tasks?foo=bar", {
signal: nav4.loaders.tasks.stub.mock.calls[0][0].request.signal,
}),
- unstable_pattern: "/tasks",
- unstable_url: new URL("http://localhost/tasks?foo=bar#hash"),
+ pattern: "/tasks",
+ url: new URL("http://localhost/tasks?foo=bar#hash"),
context: {},
});
@@ -2213,8 +2213,8 @@ describe("a router", () => {
expect(nav.actions.tasks.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: "/tasks",
- unstable_url: new URL("http://localhost/tasks"),
+ pattern: "/tasks",
+ url: new URL("http://localhost/tasks"),
context: {},
});
@@ -2259,8 +2259,8 @@ describe("a router", () => {
expect(nav.actions.tasks.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: "/tasks",
- unstable_url: new URL("http://localhost/tasks?foo=bar"),
+ pattern: "/tasks",
+ url: new URL("http://localhost/tasks?foo=bar"),
context: {},
});
// Assert request internals, cannot do a deep comparison above since some
@@ -2294,8 +2294,8 @@ describe("a router", () => {
expect(nav.actions.tasks.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
diff --git a/packages/react-router/__tests__/router/should-revalidate-test.ts b/packages/react-router/__tests__/router/should-revalidate-test.ts
index 27b79e055a..707c270bfc 100644
--- a/packages/react-router/__tests__/router/should-revalidate-test.ts
+++ b/packages/react-router/__tests__/router/should-revalidate-test.ts
@@ -1251,7 +1251,7 @@ describe("shouldRevalidate", () => {
});
let A = await t.navigate("/?foo=bar", {
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
});
A.loaders.index.resolve("SHOULD NOT BE CALLED");
@@ -1290,7 +1290,7 @@ describe("shouldRevalidate", () => {
});
let A = await t.navigate("/?foo=bar", {
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
});
A.loaders.index.resolve("SHOULD NOT BE CALLED");
@@ -1345,7 +1345,7 @@ describe("shouldRevalidate", () => {
{
formMethod: "post",
formData: createFormData({}),
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
},
["fetch"],
);
@@ -1418,7 +1418,7 @@ describe("shouldRevalidate", () => {
{
formMethod: "post",
formData: createFormData({}),
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
},
["fetch"],
);
@@ -1483,7 +1483,7 @@ describe("shouldRevalidate", () => {
let B = await t.fetch("/fetch", actionKey, "index", {
formMethod: "post",
formData: createFormData({}),
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
});
t.shimHelper(B.loaders, "fetch", "loader", "fetch");
@@ -1552,7 +1552,7 @@ describe("shouldRevalidate", () => {
let B = await t.fetch("/fetch", actionKey, "index", {
formMethod: "post",
formData: createFormData({}),
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
});
t.shimHelper(B.loaders, "fetch", "loader", "fetch");
@@ -1623,7 +1623,7 @@ describe("shouldRevalidate", () => {
let B = await t.fetch("/fetch", actionKey, "index", {
formMethod: "post",
formData: createFormData({}),
- unstable_defaultShouldRevalidate: false,
+ defaultShouldRevalidate: false,
});
t.shimHelper(B.loaders, "fetch", "loader", "fetch");
diff --git a/packages/react-router/__tests__/router/ssr-test.ts b/packages/react-router/__tests__/router/ssr-test.ts
index 2cf9bd61c2..3aa9b11512 100644
--- a/packages/react-router/__tests__/router/ssr-test.ts
+++ b/packages/react-router/__tests__/router/ssr-test.ts
@@ -840,8 +840,8 @@ describe("ssr", () => {
expect(rootLoaderStub).toHaveBeenCalledTimes(1);
expect(rootLoaderStub).toHaveBeenCalledWith({
request: new Request("http://localhost/child"),
- unstable_pattern: "/child",
- unstable_url: new URL("http://localhost/child"),
+ pattern: "/child",
+ url: new URL("http://localhost/child"),
params: {},
context: {},
});
@@ -853,8 +853,8 @@ describe("ssr", () => {
expect(childLoaderStub).toHaveBeenCalledTimes(1);
expect(childLoaderStub).toHaveBeenCalledWith({
request: new Request("http://localhost/child"),
- unstable_pattern: "/child",
- unstable_url: new URL("http://localhost/child"),
+ pattern: "/child",
+ url: new URL("http://localhost/child"),
params: {},
context: {},
});
@@ -894,8 +894,8 @@ describe("ssr", () => {
expect(actionStub).toHaveBeenCalledTimes(1);
expect(actionStub).toHaveBeenCalledWith({
request: expect.any(Request),
- unstable_pattern: "/child",
- unstable_url: new URL("http://localhost/child"),
+ pattern: "/child",
+ url: new URL("http://localhost/child"),
params: {},
context: {},
});
@@ -911,8 +911,8 @@ describe("ssr", () => {
expect(rootLoaderStub).toHaveBeenCalledTimes(1);
expect(rootLoaderStub).toHaveBeenCalledWith({
request: expect.any(Request),
- unstable_pattern: "/child",
- unstable_url: new URL("http://localhost/child"),
+ pattern: "/child",
+ url: new URL("http://localhost/child"),
params: {},
context: {},
});
@@ -926,8 +926,8 @@ describe("ssr", () => {
expect(childLoaderStub).toHaveBeenCalledTimes(1);
expect(childLoaderStub).toHaveBeenCalledWith({
request: expect.any(Request),
- unstable_pattern: "/child",
- unstable_url: new URL("http://localhost/child"),
+ pattern: "/child",
+ url: new URL("http://localhost/child"),
params: {},
context: {},
});
diff --git a/packages/react-router/__tests__/router/submission-test.ts b/packages/react-router/__tests__/router/submission-test.ts
index fcfb3d369a..32774da019 100644
--- a/packages/react-router/__tests__/router/submission-test.ts
+++ b/packages/react-router/__tests__/router/submission-test.ts
@@ -948,8 +948,8 @@ describe("submissions", () => {
expect(nav.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -984,8 +984,8 @@ describe("submissions", () => {
expect(nav.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -1018,8 +1018,8 @@ describe("submissions", () => {
expect(nav.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -1124,8 +1124,8 @@ describe("submissions", () => {
expect(nav.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -1164,8 +1164,8 @@ describe("submissions", () => {
expect(nav.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
@@ -1201,8 +1201,8 @@ describe("submissions", () => {
expect(nav.actions.root.stub).toHaveBeenCalledWith({
params: {},
request: expect.any(Request),
- unstable_pattern: expect.any(String),
- unstable_url: expect.any(URL),
+ pattern: expect.any(String),
+ url: expect.any(URL),
context: {},
});
diff --git a/packages/react-router/__tests__/server-runtime/utils.ts b/packages/react-router/__tests__/server-runtime/utils.ts
index 10771ca1dc..fb5759a4fd 100644
--- a/packages/react-router/__tests__/server-runtime/utils.ts
+++ b/packages/react-router/__tests__/server-runtime/utils.ts
@@ -15,7 +15,7 @@ import type {
LoaderFunction,
MiddlewareFunction,
} from "../../lib/router/utils";
-import type { unstable_ServerInstrumentation } from "../../lib/router/instrumentation";
+import type { ServerInstrumentation } from "../../lib/router/instrumentation";
export function mockServerBuild(
routes: Record<
@@ -36,14 +36,13 @@ export function mockServerBuild(
future?: Partial
;
handleError?: HandleErrorFunction;
handleDocumentRequest?: HandleDocumentRequestFunction;
- unstable_instrumentations?: unstable_ServerInstrumentation[];
+ instrumentations?: ServerInstrumentation[];
} = {},
): ServerBuild {
return {
ssr: true,
future: {
v8_middleware: false,
- unstable_subResourceIntegrity: false,
...opts.future,
},
prerender: [],
@@ -98,7 +97,7 @@ export function mockServerBuild(
),
handleDataRequest: jest.fn(async (response) => response),
handleError: opts.handleError,
- unstable_instrumentations: opts.unstable_instrumentations,
+ instrumentations: opts.instrumentations,
},
},
routes: Object.entries(routes).reduce(
diff --git a/packages/react-router/__tests__/utils/framework.ts b/packages/react-router/__tests__/utils/framework.ts
index 79e48247ed..78c677183e 100644
--- a/packages/react-router/__tests__/utils/framework.ts
+++ b/packages/react-router/__tests__/utils/framework.ts
@@ -31,7 +31,6 @@ export function mockFrameworkContext(
},
future: {
v8_middleware: false,
- unstable_subResourceIntegrity: false,
},
ssr: true,
isSpaMode: false,
diff --git a/packages/react-router/index.ts b/packages/react-router/index.ts
index a398f1d0ed..5ebb3cfaef 100644
--- a/packages/react-router/index.ts
+++ b/packages/react-router/index.ts
@@ -71,12 +71,12 @@ export {
parsePath,
} from "./lib/router/history";
export type {
- unstable_ServerInstrumentation,
- unstable_ClientInstrumentation,
- unstable_InstrumentRequestHandlerFunction,
- unstable_InstrumentRouterFunction,
- unstable_InstrumentRouteFunction,
- unstable_InstrumentationHandlerResult,
+ ServerInstrumentation,
+ ClientInstrumentation,
+ InstrumentRequestHandlerFunction,
+ InstrumentRouterFunction,
+ InstrumentRouteFunction,
+ InstrumentationHandlerResult,
} from "./lib/router/instrumentation";
export {
IDLE_NAVIGATION,
diff --git a/packages/react-router/lib/components.tsx b/packages/react-router/lib/components.tsx
index 84832b3927..5234145af9 100644
--- a/packages/react-router/lib/components.tsx
+++ b/packages/react-router/lib/components.tsx
@@ -31,6 +31,7 @@ import type {
NonIndexRouteObject,
Params,
PatchRoutesOnNavigationFunction,
+ RouteManifest,
RouteMatch,
RouteObject,
TrackedPromise,
@@ -72,7 +73,7 @@ import {
} from "./hooks";
import type { ViewTransition } from "./dom/global";
import { warnOnce } from "./server-runtime/warnings";
-import type { unstable_ClientInstrumentation } from "./router/instrumentation";
+import type { ClientInstrumentation } from "./router/instrumentation";
/**
* Webpack can fail to compile against react versions without this export -
@@ -210,7 +211,7 @@ export interface MemoryRouterOpts {
*
* ```tsx
* let router = createBrowserRouter(routes, {
- * unstable_instrumentations: [logging]
+ * instrumentations: [logging]
* });
*
*
@@ -248,7 +249,7 @@ export interface MemoryRouterOpts {
* }
* ```
*/
- unstable_instrumentations?: unstable_ClientInstrumentation[];
+ instrumentations?: ClientInstrumentation[];
/**
* Override the default data strategy of running loaders in parallel -
* see the [docs](../../how-to/data-strategy) for more information.
@@ -301,7 +302,7 @@ export interface MemoryRouterOpts {
* @param {MemoryRouterOpts.hydrationData} opts.hydrationData n/a
* @param {MemoryRouterOpts.initialEntries} opts.initialEntries n/a
* @param {MemoryRouterOpts.initialIndex} opts.initialIndex n/a
- * @param {MemoryRouterOpts.unstable_instrumentations} opts.unstable_instrumentations n/a
+ * @param {MemoryRouterOpts.instrumentations} opts.instrumentations n/a
* @param {MemoryRouterOpts.patchRoutesOnNavigation} opts.patchRoutesOnNavigation n/a
* @returns An initialized {@link DataRouter} to pass to {@link RouterProvider | ``}
*/
@@ -323,7 +324,7 @@ export function createMemoryRouter(
mapRouteProperties,
dataStrategy: opts?.dataStrategy,
patchRoutesOnNavigation: opts?.patchRoutesOnNavigation,
- unstable_instrumentations: opts?.unstable_instrumentations,
+ instrumentations: opts?.instrumentations,
}).initialize();
}
@@ -362,7 +363,7 @@ export interface ClientOnErrorFunction {
info: {
location: Location;
params: Params;
- unstable_pattern: string;
+ pattern: string;
errorInfo?: React.ErrorInfo;
},
): void;
@@ -398,7 +399,7 @@ export interface RouterProviderProps {
*
* ```tsx
* {
- * let { location, params, unstable_pattern, errorInfo } = info;
+ * let { location, params, pattern, errorInfo } = info;
* console.error(error, location, errorInfo);
* reportToErrorService(error, location, errorInfo);
* }} />
@@ -421,9 +422,9 @@ export interface RouterProviderProps {
* - When set to `false`, the router will not leverage `React.startTransition` or
* `React.useOptimistic` on any navigations or state changes.
*
- * For more information, please see the [docs](https://reactrouter.com/explanation/react-transitions).
+ * For more information, please see the [docs](../../explanation/react-transitions).
*/
- unstable_useTransitions?: boolean;
+ useTransitions?: boolean;
}
/**
@@ -455,17 +456,17 @@ export interface RouterProviderProps {
* @param {RouterProviderProps.flushSync} props.flushSync n/a
* @param {RouterProviderProps.onError} props.onError n/a
* @param {RouterProviderProps.router} props.router n/a
- * @param {RouterProviderProps.unstable_useTransitions} props.unstable_useTransitions n/a
+ * @param {RouterProviderProps.useTransitions} props.useTransitions n/a
* @returns React element for the rendered router
*/
export function RouterProvider({
router,
flushSync: reactDomFlushSyncImpl,
onError,
- unstable_useTransitions,
+ useTransitions,
}: RouterProviderProps): React.ReactElement {
let unstable_rsc = useIsRSCRouterContext();
- unstable_useTransitions = unstable_rsc || unstable_useTransitions;
+ useTransitions = unstable_rsc || useTransitions;
let [_state, setStateImpl] = React.useState(router.state);
let [state, setOptimisticState] = useOptimisticSafe(_state);
@@ -493,7 +494,7 @@ export function RouterProvider({
onError(error, {
location: newState.location,
params: newState.matches[0]?.params ?? {},
- unstable_pattern: getRoutePattern(newState.matches),
+ pattern: getRoutePattern(newState.matches),
}),
);
}
@@ -532,11 +533,11 @@ export function RouterProvider({
if (!viewTransitionOpts || !isViewTransitionAvailable) {
if (reactDomFlushSyncImpl && flushSync) {
reactDomFlushSyncImpl(() => setStateImpl(newState));
- } else if (unstable_useTransitions === false) {
+ } else if (useTransitions === false) {
setStateImpl(newState);
} else {
React.startTransition(() => {
- if (unstable_useTransitions === true) {
+ if (useTransitions === true) {
setOptimisticState((s) => getOptimisticRouterState(s, newState));
}
setStateImpl(newState);
@@ -608,7 +609,7 @@ export function RouterProvider({
reactDomFlushSyncImpl,
transition,
renderDfd,
- unstable_useTransitions,
+ useTransitions,
setOptimisticState,
onError,
],
@@ -648,11 +649,11 @@ export function RouterProvider({
let newState = pendingState;
let renderPromise = renderDfd.promise;
let transition = router.window.document.startViewTransition(async () => {
- if (unstable_useTransitions === false) {
+ if (useTransitions === false) {
setStateImpl(newState);
} else {
React.startTransition(() => {
- if (unstable_useTransitions === true) {
+ if (useTransitions === true) {
setOptimisticState((s) => getOptimisticRouterState(s, newState));
}
setStateImpl(newState);
@@ -672,7 +673,7 @@ export function RouterProvider({
pendingState,
renderDfd,
router.window,
- unstable_useTransitions,
+ useTransitions,
setOptimisticState,
]);
@@ -752,10 +753,11 @@ export function RouterProvider({
location={state.location}
navigationType={state.historyAction}
navigator={navigator}
- unstable_useTransitions={unstable_useTransitions}
+ useTransitions={useTransitions}
>
`} for client-side
* routing.
*/
@@ -874,7 +884,7 @@ export function MemoryRouter({
children,
initialEntries,
initialIndex,
- unstable_useTransitions,
+ useTransitions,
}: MemoryRouterProps): React.ReactElement {
let historyRef = React.useRef();
if (historyRef.current == null) {
@@ -892,13 +902,13 @@ export function MemoryRouter({
});
let setState = React.useCallback(
(newState: { action: NavigationType; location: Location }) => {
- if (unstable_useTransitions === false) {
+ if (useTransitions === false) {
setStateImpl(newState);
} else {
React.startTransition(() => setStateImpl(newState));
}
},
- [unstable_useTransitions],
+ [useTransitions],
);
React.useLayoutEffect(() => history.listen(setState), [history, setState]);
@@ -910,7 +920,7 @@ export function MemoryRouter({
location={state.location}
navigationType={state.action}
navigator={history}
- unstable_useTransitions={unstable_useTransitions}
+ useTransitions={useTransitions}
/>
);
}
@@ -1339,9 +1349,9 @@ export interface RouterProps {
* - When set to `false`, the router will not leverage `React.startTransition`
* on any navigations or state changes.
*
- * For more information, please see the [docs](https://reactrouter.com/explanation/react-transitions).
+ * For more information, please see the [docs](../../explanation/react-transitions).
*/
- unstable_useTransitions?: boolean;
+ useTransitions?: boolean;
}
/**
@@ -1361,7 +1371,7 @@ export interface RouterProps {
* @param {RouterProps.navigationType} props.navigationType n/a
* @param {RouterProps.navigator} props.navigator n/a
* @param {RouterProps.static} props.static n/a
- * @param {RouterProps.unstable_useTransitions} props.unstable_useTransitions n/a
+ * @param {RouterProps.useTransitions} props.useTransitions n/a
* @returns React element for the rendered router or `null` if the location does
* not match the {@link props.basename}
*/
@@ -1372,7 +1382,7 @@ export function Router({
navigationType = NavigationType.Pop,
navigator,
static: staticProp = false,
- unstable_useTransitions,
+ useTransitions,
}: RouterProps): React.ReactElement | null {
invariant(
!useInRouterContext(),
@@ -1388,10 +1398,10 @@ export function Router({
basename,
navigator,
static: staticProp,
- unstable_useTransitions,
+ useTransitions,
future: {},
}),
- [basename, navigator, staticProp, unstable_useTransitions],
+ [basename, navigator, staticProp, useTransitions],
);
if (typeof locationProp === "string") {
@@ -1404,7 +1414,7 @@ export function Router({
hash = "",
state = null,
key = "default",
- unstable_mask,
+ mask,
} = locationProp;
let locationContext = React.useMemo(() => {
@@ -1421,20 +1431,11 @@ export function Router({
hash,
state,
key,
- unstable_mask,
+ mask,
},
navigationType,
};
- }, [
- basename,
- pathname,
- search,
- hash,
- state,
- key,
- navigationType,
- unstable_mask,
- ]);
+ }, [basename, pathname, search, hash, state, key, navigationType, mask]);
warning(
locationContext != null,
@@ -1674,7 +1675,7 @@ export function Await({
dataRouterContext.onError(error, {
location: dataRouterStateContext.location,
params: dataRouterStateContext.matches[0]?.params || {},
- unstable_pattern: getRoutePattern(dataRouterStateContext.matches),
+ pattern: getRoutePattern(dataRouterStateContext.matches),
errorInfo,
});
}
diff --git a/packages/react-router/lib/context.ts b/packages/react-router/lib/context.ts
index bdfb1ccef3..ef86a35db1 100644
--- a/packages/react-router/lib/context.ts
+++ b/packages/react-router/lib/context.ts
@@ -15,9 +15,9 @@ import type { TrackedPromise, RouteMatch } from "./router/utils";
export interface DataRouterContextObject
// Omit `future` since those can be pulled from the `router`
- // `NavigationContext` needs `future`/`unstable_useTransitions` since it doesn't
+ // `NavigationContext` needs `future`/`useTransitions` since it doesn't
// have a `router` in all cases
- extends Omit {
+ extends Omit {
router: Router;
staticContext?: StaticHandlerContext;
onError?: ClientOnErrorFunction;
@@ -74,7 +74,7 @@ export interface NavigateOptions {
/** Replace the current entry in the history stack instead of pushing a new one */
replace?: boolean;
/** Masked URL */
- unstable_mask?: To;
+ mask?: To;
/** Adds persistent client side routing state to the next location */
state?: any;
/** If you are using {@link ScrollRestoration ``}, prevent the scroll position from being reset to the top of the window when navigating */
@@ -86,7 +86,7 @@ export interface NavigateOptions {
/** Enables a {@link https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API View Transition} for this navigation by wrapping the final state update in `document.startViewTransition()`. If you need to apply specific styles for this view transition, you will also need to leverage the {@link useViewTransitionState `useViewTransitionState()`} hook. */
viewTransition?: boolean;
/** Specifies the default revalidation behavior after this submission */
- unstable_defaultShouldRevalidate?: boolean;
+ defaultShouldRevalidate?: boolean;
}
/**
@@ -111,7 +111,7 @@ interface NavigationContextObject {
basename: string;
navigator: Navigator;
static: boolean;
- unstable_useTransitions: boolean | undefined;
+ useTransitions: boolean | undefined;
// TODO: Re-introduce a singular `FutureConfig` once we land our first
// future.unstable_ or future.v8_ flag
future: {};
diff --git a/packages/react-router/lib/dom-export/hydrated-router.tsx b/packages/react-router/lib/dom-export/hydrated-router.tsx
index ddb69df172..a27ac7fbc3 100644
--- a/packages/react-router/lib/dom-export/hydrated-router.tsx
+++ b/packages/react-router/lib/dom-export/hydrated-router.tsx
@@ -27,7 +27,7 @@ import {
} from "react-router";
import { CRITICAL_CSS_DATA_ATTRIBUTE } from "../dom/ssr/components";
import { RouterProvider } from "./dom-router-provider";
-import type { unstable_ClientInstrumentation } from "../router/instrumentation";
+import type { ClientInstrumentation } from "../router/instrumentation";
type SSRInfo = {
context: NonNullable<(typeof window)["__reactRouterContext"]>;
@@ -79,10 +79,10 @@ function initSsrInfo(): void {
function createHydratedRouter({
getContext,
- unstable_instrumentations,
+ instrumentations,
}: {
getContext?: RouterInit["getContext"];
- unstable_instrumentations?: unstable_ClientInstrumentation[];
+ instrumentations?: ClientInstrumentation[];
}): DataRouter {
initSsrInfo();
@@ -185,11 +185,10 @@ function createHydratedRouter({
getContext,
hydrationData,
hydrationRouteProperties,
- unstable_instrumentations,
+ instrumentations,
mapRouteProperties,
future: {
- unstable_passThroughRequests:
- ssrInfo.context.future.unstable_passThroughRequests,
+ v8_passThroughRequests: ssrInfo.context.future.v8_passThroughRequests,
},
dataStrategy: getTurboStreamSingleFetchDataStrategy(
() => router,
@@ -287,12 +286,12 @@ export interface HydratedRouterProps {
* startTransition(() => {
* hydrateRoot(
* document,
- * {
- * let { location, params, unstable_pattern, errorInfo } = info;
+ * let { location, params, pattern, errorInfo } = info;
* console.error(error, location, errorInfo);
* reportToErrorService(error, location, errorInfo);
* }} />
@@ -328,9 +327,9 @@ export interface HydratedRouterProps {
* - When set to `false`, the router will not leverage `React.startTransition` or
* `React.useOptimistic` on any navigations or state changes.
*
- * For more information, please see the [docs](https://reactrouter.com/explanation/react-transitions).
+ * For more information, please see the [docs](../../explanation/react-transitions).
*/
- unstable_useTransitions?: boolean;
+ useTransitions?: boolean;
}
/**
@@ -349,7 +348,7 @@ export function HydratedRouter(props: HydratedRouterProps) {
if (!router) {
router = createHydratedRouter({
getContext: props.getContext,
- unstable_instrumentations: props.unstable_instrumentations,
+ instrumentations: props.instrumentations,
});
}
@@ -437,7 +436,7 @@ export function HydratedRouter(props: HydratedRouterProps) {
diff --git a/packages/react-router/lib/dom/dom.ts b/packages/react-router/lib/dom/dom.ts
index 476af2552d..562050adbe 100644
--- a/packages/react-router/lib/dom/dom.ts
+++ b/packages/react-router/lib/dom/dom.ts
@@ -204,7 +204,7 @@ interface SharedSubmitOptions {
* By default (when not specified), loaders will revalidate according to the routers
* standard revalidation behavior.
*/
- unstable_defaultShouldRevalidate?: boolean;
+ defaultShouldRevalidate?: boolean;
}
/**
diff --git a/packages/react-router/lib/dom/lib.tsx b/packages/react-router/lib/dom/lib.tsx
index 8e371b6682..9f6dde80bf 100644
--- a/packages/react-router/lib/dom/lib.tsx
+++ b/packages/react-router/lib/dom/lib.tsx
@@ -95,7 +95,7 @@ import {
useRouteId,
} from "../hooks";
import type { SerializeFrom } from "../types/route-data";
-import type { unstable_ClientInstrumentation } from "../router/instrumentation";
+import type { ClientInstrumentation } from "../router/instrumentation";
import { escapeHtml } from "./ssr/markup";
////////////////////////////////////////////////////////////////////////////////
@@ -247,7 +247,7 @@ export interface DOMRouterOpts {
*
* ```tsx
* let router = createBrowserRouter(routes, {
- * unstable_instrumentations: [logging]
+ * instrumentations: [logging]
* });
*
*
@@ -285,7 +285,7 @@ export interface DOMRouterOpts {
* }
* ```
*/
- unstable_instrumentations?: unstable_ClientInstrumentation[];
+ instrumentations?: ClientInstrumentation[];
/**
* Override the default data strategy of running loaders in parallel -
* see the [docs](../../how-to/data-strategy) for more information.
@@ -635,7 +635,7 @@ export interface DOMRouterOpts {
* @param {DOMRouterOpts.future} opts.future n/a
* @param {DOMRouterOpts.getContext} opts.getContext n/a
* @param {DOMRouterOpts.hydrationData} opts.hydrationData n/a
- * @param {DOMRouterOpts.unstable_instrumentations} opts.unstable_instrumentations n/a
+ * @param {DOMRouterOpts.instrumentations} opts.instrumentations n/a
* @param {DOMRouterOpts.patchRoutesOnNavigation} opts.patchRoutesOnNavigation n/a
* @param {DOMRouterOpts.window} opts.window n/a
* @returns An initialized {@link DataRouter| data router} to pass to {@link RouterProvider | ``}
@@ -656,7 +656,7 @@ export function createBrowserRouter(
dataStrategy: opts?.dataStrategy,
patchRoutesOnNavigation: opts?.patchRoutesOnNavigation,
window: opts?.window,
- unstable_instrumentations: opts?.unstable_instrumentations,
+ instrumentations: opts?.instrumentations,
}).initialize();
}
@@ -673,7 +673,7 @@ export function createBrowserRouter(
* @param {DOMRouterOpts.future} opts.future n/a
* @param {DOMRouterOpts.getContext} opts.getContext n/a
* @param {DOMRouterOpts.hydrationData} opts.hydrationData n/a
- * @param {DOMRouterOpts.unstable_instrumentations} opts.unstable_instrumentations n/a
+ * @param {DOMRouterOpts.instrumentations} opts.instrumentations n/a
* @param {DOMRouterOpts.dataStrategy} opts.dataStrategy n/a
* @param {DOMRouterOpts.patchRoutesOnNavigation} opts.patchRoutesOnNavigation n/a
* @param {DOMRouterOpts.window} opts.window n/a
@@ -695,7 +695,7 @@ export function createHashRouter(
dataStrategy: opts?.dataStrategy,
patchRoutesOnNavigation: opts?.patchRoutesOnNavigation,
window: opts?.window,
- unstable_instrumentations: opts?.unstable_instrumentations,
+ instrumentations: opts?.instrumentations,
}).initialize();
}
@@ -788,9 +788,9 @@ export interface BrowserRouterProps {
* - When set to `false`, the router will not leverage `React.startTransition`
* on any navigations or state changes.
*
- * For more information, please see the [docs](https://reactrouter.com/explanation/react-transitions).
+ * For more information, please see the [docs](../../explanation/react-transitions).
*/
- unstable_useTransitions?: boolean;
+ useTransitions?: boolean;
/**
* [`Window`](https://developer.mozilla.org/en-US/docs/Web/API/Window) object
* override. Defaults to the global `window` instance
@@ -808,7 +808,7 @@ export interface BrowserRouterProps {
* @param props Props
* @param {BrowserRouterProps.basename} props.basename n/a
* @param {BrowserRouterProps.children} props.children n/a
- * @param {BrowserRouterProps.unstable_useTransitions} props.unstable_useTransitions n/a
+ * @param {BrowserRouterProps.useTransitions} props.useTransitions n/a
* @param {BrowserRouterProps.window} props.window n/a
* @returns A declarative {@link Router | ``} using the browser [`History`](https://developer.mozilla.org/en-US/docs/Web/API/History)
* API for client-side routing.
@@ -816,7 +816,7 @@ export interface BrowserRouterProps {
export function BrowserRouter({
basename,
children,
- unstable_useTransitions,
+ useTransitions,
window,
}: BrowserRouterProps) {
let historyRef = React.useRef();
@@ -831,13 +831,13 @@ export function BrowserRouter({
});
let setState = React.useCallback(
(newState: { action: NavigationType; location: Location }) => {
- if (unstable_useTransitions === false) {
+ if (useTransitions === false) {
setStateImpl(newState);
} else {
React.startTransition(() => setStateImpl(newState));
}
},
- [unstable_useTransitions],
+ [useTransitions],
);
React.useLayoutEffect(() => history.listen(setState), [history, setState]);
@@ -849,7 +849,7 @@ export function BrowserRouter({
location={state.location}
navigationType={state.action}
navigator={history}
- unstable_useTransitions={unstable_useTransitions}
+ useTransitions={useTransitions}
/>
);
}
@@ -878,9 +878,9 @@ export interface HashRouterProps {
* - When set to `false`, the router will not leverage `React.startTransition`
* on any navigations or state changes.
*
- * For more information, please see the [docs](https://reactrouter.com/explanation/react-transitions).
+ * For more information, please see the [docs](../../explanation/react-transitions).
*/
- unstable_useTransitions?: boolean;
+ useTransitions?: boolean;
/**
* [`Window`](https://developer.mozilla.org/en-US/docs/Web/API/Window) object
* override. Defaults to the global `window` instance
@@ -899,7 +899,7 @@ export interface HashRouterProps {
* @param props Props
* @param {HashRouterProps.basename} props.basename n/a
* @param {HashRouterProps.children} props.children n/a
- * @param {HashRouterProps.unstable_useTransitions} props.unstable_useTransitions n/a
+ * @param {HashRouterProps.useTransitions} props.useTransitions n/a
* @param {HashRouterProps.window} props.window n/a
* @returns A declarative {@link Router | ``} using the URL [`hash`](https://developer.mozilla.org/en-US/docs/Web/API/URL/hash)
* for client-side routing.
@@ -907,7 +907,7 @@ export interface HashRouterProps {
export function HashRouter({
basename,
children,
- unstable_useTransitions,
+ useTransitions,
window,
}: HashRouterProps) {
let historyRef = React.useRef();
@@ -922,13 +922,13 @@ export function HashRouter({
});
let setState = React.useCallback(
(newState: { action: NavigationType; location: Location }) => {
- if (unstable_useTransitions === false) {
+ if (useTransitions === false) {
setStateImpl(newState);
} else {
React.startTransition(() => setStateImpl(newState));
}
},
- [unstable_useTransitions],
+ [useTransitions],
);
React.useLayoutEffect(() => history.listen(setState), [history, setState]);
@@ -940,7 +940,7 @@ export function HashRouter({
location={state.location}
navigationType={state.action}
navigator={history}
- unstable_useTransitions={unstable_useTransitions}
+ useTransitions={useTransitions}
/>
);
}
@@ -973,9 +973,9 @@ export interface HistoryRouterProps {
* - When set to `false`, the router will not leverage `React.startTransition`
* on any navigations or state changes.
*
- * For more information, please see the [docs](https://reactrouter.com/explanation/react-transitions).
+ * For more information, please see the [docs](../../explanation/react-transitions).
*/
- unstable_useTransitions?: boolean;
+ useTransitions?: boolean;
}
/**
@@ -993,7 +993,7 @@ export interface HistoryRouterProps {
* @param {HistoryRouterProps.basename} props.basename n/a
* @param {HistoryRouterProps.children} props.children n/a
* @param {HistoryRouterProps.history} props.history n/a
- * @param {HistoryRouterProps.unstable_useTransitions} props.unstable_useTransitions n/a
+ * @param {HistoryRouterProps.useTransitions} props.useTransitions n/a
* @returns A declarative {@link Router | ``} using the provided history
* implementation for client-side routing.
*/
@@ -1001,7 +1001,7 @@ export function HistoryRouter({
basename,
children,
history,
- unstable_useTransitions,
+ useTransitions,
}: HistoryRouterProps) {
let [state, setStateImpl] = React.useState({
action: history.action,
@@ -1009,13 +1009,13 @@ export function HistoryRouter({
});
let setState = React.useCallback(
(newState: { action: NavigationType; location: Location }) => {
- if (unstable_useTransitions === false) {
+ if (useTransitions === false) {
setStateImpl(newState);
} else {
React.startTransition(() => setStateImpl(newState));
}
},
- [unstable_useTransitions],
+ [useTransitions],
);
React.useLayoutEffect(() => history.listen(setState), [history, setState]);
@@ -1027,7 +1027,7 @@ export function HistoryRouter({
location={state.location}
navigationType={state.action}
navigator={history}
- unstable_useTransitions={unstable_useTransitions}
+ useTransitions={useTransitions}
/>
);
}
@@ -1206,7 +1206,7 @@ export interface LinkProps
* Specify the default revalidation behavior for the navigation.
*
* ```tsx
- * (
function LinkWithRef(
@@ -1311,18 +1311,18 @@ export const Link = React.forwardRef(
relative,
reloadDocument,
replace,
- unstable_mask,
+ mask,
state,
target,
to,
preventScrollReset,
viewTransition,
- unstable_defaultShouldRevalidate,
+ defaultShouldRevalidate,
...rest
},
forwardedRef,
) {
- let { basename, navigator, unstable_useTransitions } =
+ let { basename, navigator, useTransitions } =
React.useContext(NavigationContext);
let isAbsolute = typeof to === "string" && ABSOLUTE_URL_REGEX.test(to);
@@ -1335,13 +1335,13 @@ export const Link = React.forwardRef(
let maskedHref: string | null = null;
- if (unstable_mask) {
+ if (mask) {
// Inlined version of the `useHref` logic operating off the masked location
// instead of the current location
let resolved = resolveTo(
- unstable_mask,
+ mask,
[],
- location.unstable_mask ? location.unstable_mask.pathname : "/",
+ location.mask ? location.mask.pathname : "/",
true,
);
@@ -1366,14 +1366,14 @@ export const Link = React.forwardRef(
let internalOnClick = useLinkClickHandler(to, {
replace,
- unstable_mask,
+ mask,
state,
target,
preventScrollReset,
relative,
viewTransition,
- unstable_defaultShouldRevalidate,
- unstable_useTransitions,
+ defaultShouldRevalidate,
+ useTransitions,
});
function handleClick(
event: React.MouseEvent,
@@ -1788,7 +1788,7 @@ interface SharedFormProps extends React.FormHTMLAttributes {
* By default (when not specified), loaders will revalidate according to the routers
* standard revalidation behavior.
*/
- unstable_defaultShouldRevalidate?: boolean;
+ defaultShouldRevalidate?: boolean;
}
/**
@@ -1912,7 +1912,7 @@ type HTMLFormSubmitter = HTMLButtonElement | HTMLInputElement;
* @param {FormProps.replace} replace n/a
* @param {FormProps.state} state n/a
* @param {FormProps.viewTransition} viewTransition n/a
- * @param {FormProps.unstable_defaultShouldRevalidate} unstable_defaultShouldRevalidate n/a
+ * @param {FormProps.defaultShouldRevalidate} defaultShouldRevalidate n/a
* @returns A progressively enhanced [`