upgrade(types): upgrade react-router to v8 and fix types mismatches

.github/workflows/ci.yaml

@@ -13,7 +13,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [ 20.x, 22.x, 24.x ]
+        node-version: [ 22.x, 24.x ]
 
     steps:
       - name: Checkout code

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-router-dataflow",
-  "version": "1.1.2",
+  "version": "2.0.0",
   "license": "MIT",
   "type": "module",
   "author": "Paulin Héleine",
@@ -37,23 +37,26 @@
   "scripts": {
     "test": "vitest --typecheck",
     "test:run": "vitest run --typecheck",
+    "tsc": "tsc --noEmit",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "build": "tsup"
   },
   "devDependencies": {
-    "@eslint/js": "^9.39.2",
-    "@stylistic/eslint-plugin": "^5.6.1",
-    "@types/node": "^25.0.3",
-    "@types/react": "^18.0.0",
-    "@vitest/coverage-v8": "4.0.16",
-    "eslint": "^9.39.2",
-    "eslint-plugin-unused-imports": "^4.3.0",
-    "react-router": "^7.0.0",
+    "@eslint/js": "^10.0.1",
+    "@stylistic/eslint-plugin": "^5.10.0",
+    "@types/node": "^26.0.0",
+    "@types/react": "^19.2.17",
+    "@vitest/coverage-v8": "4.1.9",
+    "eslint": "^10.5.0",
+    "eslint-plugin-unused-imports": "^4.4.1",
+    "react-router": "^8.0.1",
     "tsup": "^8.5.1",
-    "typescript": "^5.0.0",
-    "typescript-eslint": "^8.51.0",
-    "vitest": "^4.0.16"
+    "typescript": "^6.0.3",
+    "typescript-eslint": "^8.61.1",
+    "vitest": "^4.1.9"
   },
   "peerDependencies": {
-    "react-router": "^7.0.0"
+    "react-router": "^8.0.0"
   }
 }

pnpm-workspace.yaml

@@ -0,0 +1,5 @@
+packages:
+  - '.'
+
+allowBuilds:
+  esbuild: true

src/route-middleware.ts

@@ -1,10 +1,7 @@
-import type { MiddlewareFunction, Params } from "react-router";
+import type { MiddlewareFunction } from "react-router";
 import { Normalize, ContextBuilder } from "./shared-types";
 
-type RouteMiddlewareArgs = {
-    request: Request;
-    params: Params;
-};
+type RouteMiddlewareArgs = Parameters<MiddlewareFunction>[0];
 
 type RouteRequirement<R extends object | null, C extends object = object> = (args: RouteMiddlewareArgs, context: C) => Promise<R>;
 type RouteMiddlewareHandler<C> = (args: RouteMiddlewareArgs, context: C) => Promise<Response | null>;

tests/action.test.ts

@@ -1,19 +1,21 @@
 import { describe, expect, expectTypeOf, it } from "vitest";
 import { Action, ActionMiddleware, Middleware } from "../src/index";
-import { ActionFunctionArgs } from "react-router";
+import { ActionFunctionArgs, RouterContextProvider } from "react-router";
 
-const MOCK_ARGS_POST = {
+const MOCK_ARGS_POST: ActionFunctionArgs = {
     params: { id: "test" },
+    url: new URL("http://example.com"),
     request: new Request("http://example.com", { method: "POST" }),
-    context: {},
-    unstable_pattern: ""
+    context: {} as Readonly<RouterContextProvider>,
+    pattern: ""
 };
 
-const MOCK_ARGS_DELETE = {
+const MOCK_ARGS_DELETE: ActionFunctionArgs = {
     params: { id: "test" },
+    url: new URL("http://example.com"),
     request: new Request("http://example.com", { method: "DELETE" }),
-    context: {},
-    unstable_pattern: ""
+    context: {} as Readonly<RouterContextProvider>,
+    pattern: ""
 };
 
 describe("Action builder", () => {

tests/loader.test.ts

@@ -1,12 +1,13 @@
 import { describe, expect, expectTypeOf, it } from "vitest";
 import { Loader, LoaderMiddleware, Middleware } from "../src/index";
-import { LoaderFunctionArgs } from "react-router";
+import { LoaderFunctionArgs, RouterContextProvider } from "react-router";
 
-const MOCK_ARGS = {
+const MOCK_ARGS: LoaderFunctionArgs = {
     params: { id: "test" },
+    url: new URL("http://example.com"),
     request: new Request("http://example.com", { method: "GET" }),
-    context: {},
-    unstable_pattern: ""
+    context: {} as Readonly<RouterContextProvider>,
+    pattern: ""
 };
 
 describe("Loader builder", () => {

tests/route-middleware.test.ts

@@ -1,14 +1,14 @@
 import { describe, expect, expectTypeOf, it } from "vitest";
 import { RouteMiddleware, RouteRequirement } from "../src";
 import { RouteMiddlewareArgs } from "../src/route-middleware";
+import { RouterContextProvider } from "react-router";
 
-const MOCK_ARGS = {
+const MOCK_ARGS: RouteMiddlewareArgs = {
     params: { id: "test" },
+    url: new URL("http://example.com"),
     request: new Request("http://example.com", { method: "GET" }),
-    // Any is used to mock the RouterContextProvider of React Router for testing.
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    context: {} as any,
-    unstable_pattern: ""
+    context: {} as Readonly<RouterContextProvider>,
+    pattern: ""
 };
 const MOCK_NEXT = async () => new Response();
 const CUSTOM_RESPONSE = new Response(null, { statusText: "custom response" });

tsconfig.json

@@ -10,7 +10,8 @@
         "outDir": "dist",
         "declaration": true,
         "skipLibCheck": false,
-        "strict": true
+        "strict": true,
+        "ignoreDeprecations": "6.0"
     },
     "include": [
         "src",