fix: use createServerFn().validator() instead of deprecated inputValidator

README.md

@@ -51,14 +51,29 @@ openssl rand -base64 24
 Create or update `src/start.ts`:
 
 ```typescript
-import { createStart } from '@tanstack/react-start';
+import { createStart, createCsrfMiddleware } from '@tanstack/react-start';
 import { authkitMiddleware } from '@workos/authkit-tanstack-react-start';
 
+// Reject cross-site requests to server-function RPC endpoints.
+const csrfMiddleware = createCsrfMiddleware({
+  filter: (ctx) => ctx.handlerType === 'serverFn',
+});
+
 export const startInstance = createStart(() => ({
-  requestMiddleware: [authkitMiddleware()],
+  requestMiddleware: [csrfMiddleware, authkitMiddleware()],
 }));
 ```
 
+> **Why `createCsrfMiddleware`?** TanStack Start applies CSRF protection to server
+> functions automatically — but _only_ when your app doesn't define its own
+> `startInstance`. Registering `authkitMiddleware` means you do, which silently
+> opts you out of that default. Adding `createCsrfMiddleware` back restores it.
+> It's a pure header check (`Sec-Fetch-Site` / `Origin` / `Referer`) with no
+> tokens and no interaction with the AuthKit session cookie; list it before
+> `authkitMiddleware` so cross-site requests are rejected before any session work
+> runs. If you handle CSRF another way, omit it — Start will warn in dev, which
+> you can silence with `tanstackStart({ serverFns: { disableCsrfMiddlewareWarning: true } })`.
+
 #### 2. Create Callback Route
 
 Create `src/routes/api/auth/callback.tsx`:
@@ -573,6 +588,11 @@ authkitMiddleware({
 
 - `redirectUri` - Override the default redirect URI from `WORKOS_REDIRECT_URI`. Useful for dynamic environments like preview deployments.
 
+> **CSRF:** Registering `authkitMiddleware` in `requestMiddleware` opts your app
+> out of the CSRF middleware TanStack Start applies by default. Pair it with
+> `createCsrfMiddleware` (from `@tanstack/react-start`) to protect your
+> server-function RPC endpoints — see [step 1 of setup](#1-configure-middleware).
+
 ## TypeScript
 
 This library is fully typed. Common types:

example/package.json

@@ -17,9 +17,9 @@
   "dependencies": {
     "@radix-ui/themes": "^3.2.1",
     "@workos/authkit-tanstack-react-start": "workspace:*",
-    "@tanstack/react-router": "^1.154.8",
-    "@tanstack/react-router-devtools": "^1.154.8",
-    "@tanstack/react-start": "^1.154.8",
+    "@tanstack/react-router": "^1.170.15",
+    "@tanstack/react-router-devtools": "^1.167.0",
+    "@tanstack/react-start": "^1.168.25",
     "iron-session": "^8.0.4",
     "jose": "^6.1.3",
     "react": "^19.2.3",

example/src/routes/__root.tsx

@@ -1,7 +1,6 @@
 import { Box, Button, Card, Container, Flex, Theme } from '@radix-ui/themes';
 import { HeadContent, Link, Outlet, Scripts, createRootRoute } from '@tanstack/react-router';
 import appCssUrl from '../app.css?url';
-import { TanStackRouterDevtools } from '@tanstack/react-router-devtools';
 import { Suspense } from 'react';
 import { AuthKitProvider, Impersonation, getAuthAction } from '@workos/authkit-tanstack-react-start/client';
 import Footer from '../components/footer';
@@ -80,7 +79,12 @@ function RootComponent() {
           </Container>
         </Theme>
         <Impersonation />
-        <TanStackRouterDevtools position="bottom-right" />
+        {/*
+          TanStackRouterDevtools is omitted: @tanstack/router-devtools-core (<=1.168.0)
+          reads routerState.cachedMatches, which @tanstack/router-core@1.171.13
+          (pulled in by react-router 1.170.15) no longer provides, crashing the panel.
+          Re-add once upstream devtools support the current router-core.
+        */}
       </AuthKitProvider>
     </RootDocument>
   );

example/src/start.ts

@@ -1,13 +1,26 @@
-import { createStart } from '@tanstack/react-start';
+import { createStart, createCsrfMiddleware } from '@tanstack/react-start';
 import { authkitMiddleware } from '@workos/authkit-tanstack-react-start';
 
+/**
+ * Reject cross-site requests to server-function RPC endpoints.
+ *
+ * Defining a `startInstance` with a custom `requestMiddleware` list opts the app
+ * out of the CSRF middleware TanStack Start applies by default, so we add it back
+ * here. It's a pure header check (Sec-Fetch-Site / Origin / Referer) — no tokens,
+ * no interaction with the AuthKit session cookie. Scoped to server functions so
+ * cross-site flows like the WorkOS OAuth callback navigation are not blocked.
+ */
+const csrfMiddleware = createCsrfMiddleware({
+  filter: (ctx) => ctx.handlerType === 'serverFn',
+});
+
 /**
  * Configure TanStack Start with AuthKit middleware.
  * The middleware runs on every server request and provides auth context.
  */
 export const startInstance = createStart(() => {
   return {
-    // Run AuthKit middleware on every request
-    requestMiddleware: [authkitMiddleware()],
+    // CSRF first so cross-site requests are rejected before any session work runs
+    requestMiddleware: [csrfMiddleware, authkitMiddleware()],
   };
 });

package.json

@@ -69,15 +69,15 @@
   },
   "peerDependencies": {
     "@tanstack/react-router": ">=1.0.0",
-    "@tanstack/react-start": ">=1.0.0",
+    "@tanstack/react-start": ">=1.168.25",
     "react": "^18.0 || ^19.0",
     "react-dom": "^18.0 || ^19.0"
   },
   "devDependencies": {
-    "@tanstack/react-router": "^1.154.8",
-    "@tanstack/react-router-devtools": "^1.154.8",
-    "@tanstack/react-start": "^1.154.8",
-    "@tanstack/start-server-core": "^1.154.8",
+    "@tanstack/react-router": "^1.170.15",
+    "@tanstack/react-router-devtools": "^1.167.0",
+    "@tanstack/react-start": "^1.168.25",
+    "@tanstack/start-server-core": "^1.169.14",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.1",
     "@testing-library/user-event": "^14.6.1",