{"prompt":"You are comparing an AI-suggested code fix with actual changes made in a commit.\n\nYour task: Determine if the commit contains the essence of the AI fix and provide a confidence level.\n\n## AI-Suggested Fix\n\n**What it fixes:** @tanstack/octane-start:test:types, @tanstack/router-cli:test:unit, @tanstack/router-generator:test:unit\n\n**Description:** fix: resolve type errors and cross-device rename in octane tests\n\n**Reasoning:** **`packages/octane-start/tsconfig.json` — self-referential import paths**\n\nThe new `src/default-entry/client.ts` and `src/default-entry/server.ts` files import from `@tanstack/octane-start/client` and `@tanstack/octane-start/server`.\nTypeScript resolves these via the package's `exports` field, which points to `./dist/esm/client.d.ts` and `./dist/esm/server.d.ts`.\nThose files don't exist in a freshly-cloned, unbuilt workspace, so `tsc --noEmit` emits five \"Cannot find module\" / implicit-any error\n\n**Suggested Changes (diff):**\n```diff\ndiff --git a/packages/octane-start/tsconfig.json b/packages/octane-start/tsconfig.json\nindex 23535530..e800b9a6 100644\n--- a/packages/octane-start/tsconfig.json\n+++ b/packages/octane-start/tsconfig.json\n@@ -2,7 +2,11 @@\n \"extends\": \"../../tsconfig.json\",\n \"compilerOptions\": {\n \"module\": \"esnext\",\n- \"types\": [\"node\"]\n+ \"types\": [\"node\"],\n+ \"paths\": {\n+ \"@tanstack/octane-start/client\": [\"./src/client.ts\"],\n+ \"@tanstack/octane-start/server\": [\"./src/server.ts\"]\n+ }\n },\n \"include\": [\"src\", \"tests\", \"vite.config.ts\", \"vite.config.server-entry.ts\"]\n }\ndiff --git a/packages/router-generator/src/generator.ts b/packages/router-generator/src/generator.ts\nindex dc1ba405..471f3afd 100644\n--- a/packages/router-generator/src/generator.ts\n+++ b/packages/router-generator/src/generator.ts\n@@ -121,7 +121,19 @@ const DefaultFileSystem: fs = {\n gid: Number(res.gid),\n }\n },\n- rename: (oldPath, newPath) => fsp.rename(oldPath, newPath),\n+ rename: async (oldPath, newPath) => {\n+ try {\n+ await fsp.rename(oldPath, newPath)\n+ } catch (err: any) {\n+ if (err?.code === 'EXDEV') {\n+ // Cross-device rename is not supported; fall back to copy + unlink\n+ await fsp.copyFile(oldPath, newPath)\n+ await fsp.unlink(oldPath)\n+ } else {\n+ throw err\n+ }\n+ }\n+ },\n writeFile: (filePath, content) => fsp.writeFile(filePath, content),\n readFile: async (filePath: string) => {\n try {\n\n```\n\n## Actual Commit Changes\n\n**Commit Diff:**\n```diff\ndiff --git a/.changeset/plain-tools-work.md b/.changeset/plain-tools-work.md\nnew file mode 100644\nindex 0000000000..cf59929b11\n--- /dev/null\n+++ b/.changeset/plain-tools-work.md\n@@ -0,0 +1,12 @@\n+---\n+'@tanstack/octane-router': patch\n+'@tanstack/octane-start': patch\n+'@tanstack/octane-start-client': patch\n+'@tanstack/octane-start-server': patch\n+'@tanstack/router-cli': patch\n+'@tanstack/router-generator': patch\n+'@tanstack/router-plugin': patch\n+'@tanstack/start-plugin-core': patch\n+---\n+\n+Add first-class Octane Router and TanStack Start support, including `.tsrx` file routes, code splitting, SSR, streaming hydration, and Vite integration.\ndiff --git a/e2e/octane-start/basic/netlify.toml b/e2e/octane-start/basic/netlify.toml\nnew file mode 100644\nindex 0000000000..c1e3d8492a\n--- /dev/null\n+++ b/e2e/octane-start/basic/netlify.toml\n@@ -0,0 +1,3 @@\n+[build]\n+ command = \"pnpm run build:netlify\"\n+ publish = \"dist/client\"\ndiff --git a/e2e/octane-start/basic/package.json b/e2e/octane-start/basic/package.json\nnew file mode 100644\nindex 0000000000..f3bebabfe0\n--- /dev/null\n+++ b/e2e/octane-start/basic/package.json\n@@ -0,0 +1,51 @@\n+{\n+ \"name\": \"tanstack-octane-start-e2e-basic\",\n+ \"private\": true,\n+ \"sideEffects\": false,\n+ \"type\": \"module\",\n+ \"scripts\": {\n+ \"dev\": \"vite dev --port 3000\",\n+ \"dev:e2e\": \"vite dev\",\n+ \"build\": \"vite build && tsc --noEmit\",\n+ \"build:cloudflare\": \"vite build --config vite.config.cloudflare.ts\",\n+ \"build:netlify\": \"vite build --config vite.config.netlify.ts\",\n+ \"start\": \"node .output/server/index.mjs\",\n+ \"test:platform-builds\": \"pnpm run build:cloudflare && pnpm run build:netlify\",\n+ \"test:e2e:local\": \"pnpm build && playwright test --project=chromium\",\n+ \"test:e2e:hmr:local\": \"E2E_DEV=true playwright test --project=chromium\"\n+ },\n+ \"dependencies\": {\n+ \"@tanstack/octane-router\": \"workspace:^\",\n+ \"@tanstack/octane-start\": \"workspace:^\",\n+ \"octane\": \"catalog:\"\n+ },\n+ \"devDependencies\": {\n+ \"@cloudflare/vite-plugin\": \"^1.29.0\",\n+ \"@netlify/vite-plugin-tanstack-start\": \"^1.1.4\",\n+ \"@playwright/test\": \"^1.61.0\",\n+ \"@tanstack/router-e2e-utils\": \"workspace:^\",\n+ \"@types/node\": \"^22.10.2\",\n+ \"nitro\": \"^3.0.260311-beta\",\n+ \"typescript\": \"^6.0.2\",\n+ \"vite\": \"^8.0.14\",\n+ \"wrangler\": \"^4.74.0\"\n+ },\n+ \"nx\": {\n+ \"metadata\": {\n+ \"playwrightModes\": [\n+ {\n+ \"toolchain\": \"vite\",\n+ \"mode\": \"ssr\"\n+ },\n+ {\n+ \"toolchain\": \"vite\",\n+ \"mode\": \"ssr\",\n+ \"name\": \"hmr\",\n+ \"env\": {\n+ \"E2E_DEV\": \"true\"\n+ }\n+ }\n+ ]\n+ }\n+ }\n+}\ndiff --git a/e2e/octane-start/basic/playwright.config.ts b/e2e/octane-start/basic/playwright.config.ts\nnew file mode 100644\nindex 0000000000..5df20a28cd\n--- /dev/null\n+++ b/e2e/octane-start/basic/playwright.config.ts\n@@ -0,0 +1,42 @@\n+import fs from 'node:fs'\n+import { defineConfig, devices } from '@playwright/test'\n+import { getTestServerPort } from '@tanstack/router-e2e-utils'\n+import packageJson from './package.json' with { type: 'json' }\n+\n+const e2ePortKey = process.env.E2E_PORT_KEY ?? packageJson.name\n+const distDir = process.env.E2E_DIST_DIR ?? '.output'\n+const isDev = process.env.E2E_DEV === 'true'\n+\n+if (process.env.TEST_WORKER_INDEX === undefined) {\n+ fs.rmSync(`port-${e2ePortKey}.txt`, { force: true })\n+}\n+\n+const port = await getTestServerPort(e2ePortKey)\n+const baseURL = `http://127.0.0.1:${port}`\n+\n+export default defineConfig({\n+ testDir: './tests',\n+ testMatch: isDev ? 'hmr.spec.ts' : 'basic.spec.ts',\n+ workers: 1,\n+ reporter: [['line']],\n+ use: { baseURL },\n+ webServer: {\n+ command: isDev\n+ ? `pnpm dev:e2e --port ${port} --strictPort`\n+ : `PORT=${port} node ${distDir}/server/index.mjs`,\n+ url: baseURL,\n+ reuseExistingServer: !process.env.CI,\n+ stdout: 'pipe',\n+ env: isDev\n+ ? { E2E_DEV: 'true' }\n+ : {\n+ NODE_ENV: 'production',\n+ },\n+ },\n+ projects: [\n+ {\n+ name: 'chromium',\n+ use: { ...devices['Desktop Chrome'] },\n+ },\n+ ],\n+})\ndiff --git a/e2e/octane-start/basic/src/router.ts b/e2e/octane-start/basic/src/router.ts\nnew file mode 100644\nindex 0000000000..c47ed5df50\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/router.ts\n@@ -0,0 +1,9 @@\n+import { createRouter } from '@tanstack/octane-router'\n+import { routeTree } from './routeTree.gen'\n+\n+export function getRouter() {\n+ return createRouter({\n+ routeTree,\n+ scrollRestoration: true,\n+ })\n+}\ndiff --git a/e2e/octane-start/basic/src/routes/__root.tsrx b/e2e/octane-start/basic/src/routes/__root.tsrx\nnew file mode 100644\nindex 0000000000..6a9414a587\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/routes/__root.tsrx\n@@ -0,0 +1,62 @@\n+import {\n+\tBody,\n+\tHead,\n+\tHeadContent,\n+\tHtml,\n+\tLink,\n+\tOutlet,\n+\tScripts,\n+\tcreateRootRoute,\n+} from '@tanstack/octane-router';\n+\n+export const Route = createRootRoute({\n+\thead: () => ({\n+\t\tmeta: [\n+\t\t\t{ charSet: 'utf-8' },\n+\t\t\t{ name: 'viewport', content: 'width=device-width, initial-scale=1' },\n+\t\t\t{ title: 'Octane Start E2E' },\n+\t\t],\n+\t}),\n+\tshellComponent: RootDocument,\n+\tcomponent: RootLayout,\n+\terrorComponent: RouteError,\n+\tnotFoundComponent: NotFound,\n+});\n+\n+function RootDocument(props: { children?: unknown }) @{\n+\t\n+\t\t\n+\t\t\t\n+\t\t\n+\t\t\n+\t\t\t{props.children}\n+\t\t\t\n+\t\t\n+\t\n+}\n+\n+function RootLayout() @{\n+\t<>\n+\t\t\n+\t\t

\n+\t\t\t\n+\t\t

\n+\t\n+}\n+\n+function RouteError(props) @{\n+\t

\n+\t\t

{'Route error'}

\n+\t\t

{props.error instanceof Error ? props.error.message : String(props.error)}

\n+\t

\n+}\n+\n+function NotFound() @{\n+\t

\n+\t\t

{'Not found'}

\n+\t

\n+}\ndiff --git a/e2e/octane-start/basic/src/routes/about.tsrx b/e2e/octane-start/basic/src/routes/about.tsrx\nnew file mode 100644\nindex 0000000000..74ae8da864\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/routes/about.tsrx\n@@ -0,0 +1,11 @@\n+import { createFileRoute } from '@tanstack/octane-router';\n+\n+export const Route = createFileRoute('/about')({\n+\tcomponent: About,\n+});\n+\n+function About() @{\n+\t

\n+\t\t

{'Client navigation works'}

\n+\t

\n+}\ndiff --git a/e2e/octane-start/basic/src/routes/deferred-error.tsrx b/e2e/octane-start/basic/src/routes/deferred-error.tsrx\nnew file mode 100644\nindex 0000000000..ad201e1605\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/routes/deferred-error.tsrx\n@@ -0,0 +1,21 @@\n+import { Await, createFileRoute } from '@tanstack/octane-router';\n+\n+export const Route = createFileRoute('/deferred-error')({\n+\tloader: () => ({\n+\t\tvalue: new Promise((_resolve, reject) => {\n+\t\t\tsetTimeout(() => reject(new Error('deferred boom')), 50);\n+\t\t}),\n+\t}),\n+\tcomponent: DeferredErrorPage,\n+});\n+\n+function DeferredErrorPage() @{\n+\tconst data = Route.useLoaderData();\n+\n+\t

\n+\t\t

{'Deferred rejection'}

\n+\t\t{'Pending rejection'}

}>\n+\t\t\t{(value) =>

{String(value)}

}\n+\t\t\n+\t

\n+}\ndiff --git a/e2e/octane-start/basic/src/routes/deferred.tsrx b/e2e/octane-start/basic/src/routes/deferred.tsrx\nnew file mode 100644\nindex 0000000000..c3defdeb5c\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/routes/deferred.tsrx\n@@ -0,0 +1,28 @@\n+import { Await, createFileRoute } from '@tanstack/octane-router';\n+\n+export const Route = createFileRoute('/deferred')({\n+\tloader: () => ({\n+\t\tvalue: new Promise((resolve) => {\n+\t\t\tsetTimeout(() => {\n+\t\t\t\tresolve({\n+\t\t\t\t\tdate: new Date('2026-07-16T22:00:00.000Z'),\n+\t\t\t\t\tmap: new Map([['state', 'streamed']]),\n+\t\t\t\t});\n+\t\t\t}, 750);\n+\t\t}),\n+\t}),\n+\tcomponent: DeferredPage,\n+});\n+\n+function DeferredPage() @{\n+\tconst data = Route.useLoaderData();\n+\n+\t

\n+\t\t

{'Deferred loader data'}

\n+\t\t{'Pending'}

}>\n+\t\t\t{(value) =>

\n+\t\t\t\t{value.date.toISOString() + ' ' + value.map.get('state')}\n+\t\t\t

}\n+\t\t\n+\t

\n+}\ndiff --git a/e2e/octane-start/basic/src/routes/index.tsrx b/e2e/octane-start/basic/src/routes/index.tsrx\nnew file mode 100644\nindex 0000000000..a51791b182\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/routes/index.tsrx\n@@ -0,0 +1,41 @@\n+import { useState } from 'octane';\n+import { createFileRoute } from '@tanstack/octane-router';\n+\n+const loaderRuns = new Map();\n+const loaderEnvironment = typeof document === 'undefined' ? 'server' : 'client';\n+\n+function getHeading() {\n+\treturn 'Octane + TanStack Start';\n+}\n+\n+export const Route = createFileRoute('/')({\n+\tloader: ({ location }) => {\n+\t\tconst runs = (loaderRuns.get(location.href) ?? 0) + 1;\n+\t\tloaderRuns.set(location.href, runs);\n+\n+\t\treturn {\n+\t\t\tdate: new Date('2026-07-16T12:34:56.000Z'),\n+\t\t\tmap: new Map([\n+\t\t\t\t['framework', 'octane'],\n+\t\t\t\t['pipeline', 'start'],\n+\t\t\t]),\n+\t\t\trun: `${loaderEnvironment} ${runs}`,\n+\t\t};\n+\t},\n+\tcomponent: Home,\n+});\n+\n+function Home() @{\n+\tconst data = Route.useLoaderData();\n+\tconst [count, setCount] = useState(0);\n+\n+\t

\n+\t\t

{getHeading()}

\n+\t\t

{'loader ran on ' + data.run}

\n+\t\t

{data.date.toISOString()}

\n+\t\t

{data.map.get('framework') + ' ' + data.map.get('pipeline')}

\n+\t\t\n+\t

\n+}\ndiff --git a/e2e/octane-start/basic/src/routes/redirect.tsrx b/e2e/octane-start/basic/src/routes/redirect.tsrx\nnew file mode 100644\nindex 0000000000..62384a7531\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/routes/redirect.tsrx\n@@ -0,0 +1,7 @@\n+import { createFileRoute, redirect } from '@tanstack/octane-router';\n+\n+export const Route = createFileRoute('/redirect')({\n+\tbeforeLoad: () => {\n+\t\tthrow redirect({ to: '/about' });\n+\t},\n+});\ndiff --git a/e2e/octane-start/basic/src/routes/server-function.tsrx b/e2e/octane-start/basic/src/routes/server-function.tsrx\nnew file mode 100644\nindex 0000000000..eeff50cde1\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/routes/server-function.tsrx\n@@ -0,0 +1,39 @@\n+import { useState } from 'octane';\n+import { createFileRoute } from '@tanstack/octane-router';\n+import { createServerFn } from '@tanstack/octane-start';\n+\n+const roundTripServerValue = createServerFn({ method: 'POST' })\n+\t.validator((data: { timestamp: Date; labels: Map }) => data)\n+\t.handler(async ({ data }) => ({\n+\t\ttimestamp: new Date(data.timestamp.getTime() + 1000),\n+\t\tlabels: new Map([...data.labels, ['runtime', 'server']]),\n+\t}));\n+\n+export const Route = createFileRoute('/server-function')({\n+\tcomponent: ServerFunctionPage,\n+});\n+\n+function ServerFunctionPage() @{\n+\tconst [result, setResult] = useState('idle');\n+\n+\tconst callServer = async () => {\n+\t\tconst value = await roundTripServerValue({\n+\t\t\tdata: {\n+\t\t\t\ttimestamp: new Date('2026-07-17T12:00:00.000Z'),\n+\t\t\t\tlabels: new Map([['framework', 'octane']]),\n+\t\t\t},\n+\t\t});\n+\n+\t\tsetResult(\n+\t\t\t`${value.timestamp.toISOString()} ${value.labels.get('framework')} ${value.labels.get('runtime')}`,\n+\t\t);\n+\t};\n+\n+\t

\n+\t\t

{'Server function'}

\n+\t\t\n+\t\t

{result}

\n+\t

\n+}\ndiff --git a/e2e/octane-start/basic/src/tsrx.d.ts b/e2e/octane-start/basic/src/tsrx.d.ts\nnew file mode 100644\nindex 0000000000..c95fcf1499\n--- /dev/null\n+++ b/e2e/octane-start/basic/src/tsrx.d.ts\n@@ -0,0 +1 @@\n+declare module '*.tsrx'\ndiff --git a/e2e/octane-start/basic/tests/basic.spec.ts b/e2e/octane-start/basic/tests/basic.spec.ts\nnew file mode 100644\nindex 0000000000..23b7132fa7\n--- /dev/null\n+++ b/e2e/octane-start/basic/tests/basic.spec.ts\n@@ -0,0 +1,149 @@\n+import { expect } from '@playwright/test'\n+import { test } from '@tanstack/router-e2e-utils'\n+\n+test('renders a full Start document and hydrates Octane', async ({\n+ page,\n+ request,\n+}) => {\n+ const hydrationErrors: Array = []\n+ page.on('console', (message) => {\n+ if (message.type() === 'error' || message.type() === 'warning') {\n+ hydrationErrors.push(message.text())\n+ }\n+ })\n+ page.on('pageerror', (error) => hydrationErrors.push(error.message))\n+\n+ const response = await request.get('/?probe=document')\n+ expect(response.status()).toBe(200)\n+ const html = await response.text()\n+ expect(html).toContain('')\n+ expect(html).toContain('')\n+ expect(html).toContain('id=\"__app\"')\n+ expect(html).toContain('Octane + TanStack Start')\n+ expect(html).toContain('loader ran on server')\n+\n+ await page.goto('/?probe=hydrate')\n+ await expect(page).toHaveTitle('Octane Start E2E')\n+ await expect(page.locator('#__app')).toHaveCount(1)\n+ await expect(page.locator('#__app nav')).toHaveCount(1)\n+ await expect(page.locator('#__app main')).toHaveCount(1)\n+ await expect(page.getByTestId('loader-run')).toHaveText(\n+ 'loader ran on server 1',\n+ )\n+ await expect(page.getByTestId('date-value')).toHaveText(\n+ '2026-07-16T12:34:56.000Z',\n+ )\n+ await expect(page.getByTestId('map-value')).toHaveText('octane start')\n+\n+ await page.getByTestId('counter').click()\n+ await expect(page.getByTestId('counter')).toHaveText('count 1')\n+ expect(hydrationErrors).toEqual([])\n+})\n+\n+test('navigates without replacing the document', async ({ page }) => {\n+ await page.goto('/')\n+ await page.getByRole('link', { name: 'About' }).click()\n+ await expect(page.getByTestId('about-heading')).toBeVisible()\n+ await expect\n+ .poll(() =>\n+ page.evaluate(() => performance.getEntriesByType('navigation').length),\n+ )\n+ .toBe(1)\n+})\n+\n+test('streams deferred values through the Start serializer', async ({\n+ page,\n+}) => {\n+ await page.goto('/deferred')\n+ await expect(page.getByTestId('deferred-value')).toHaveCount(1)\n+ await expect(page.getByTestId('deferred-value')).toHaveText(\n+ '2026-07-16T22:00:00.000Z streamed',\n+ )\n+})\n+\n+test('round-trips typed values through a server function', async ({ page }) => {\n+ await page.goto('/server-function')\n+\n+ const responsePromise = page.waitForResponse(\n+ (response) =>\n+ response.url().includes('/_serverFn/') &&\n+ response.request().method() === 'POST',\n+ )\n+ await page.getByTestId('call-server-function').click()\n+\n+ const response = await responsePromise\n+ expect(response.status()).toBe(200)\n+ await expect(page.getByTestId('server-function-result')).toHaveText(\n+ '2026-07-17T12:00:01.000Z octane server',\n+ )\n+})\n+\n+test('flushes the deferred fallback before the value resolves', async ({\n+ baseURL,\n+}) => {\n+ const response = await fetch(`${baseURL}/deferred?probe=stream`, {\n+ headers: {\n+ 'user-agent':\n+ 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 Chrome/127.0.0.0 Safari/537.36',\n+ },\n+ })\n+ expect(response.status).toBe(200)\n+ expect(response.body).not.toBeNull()\n+\n+ const reader = response.body!.getReader()\n+ const decoder = new TextDecoder()\n+ let shell = ''\n+\n+ const shellResult = await Promise.race([\n+ (async () => {\n+ while (!shell.includes('deferred-pending')) {\n+ const result = await reader.read()\n+ if (result.done) {\n+ throw new Error('The response ended before the deferred fallback')\n+ }\n+ shell += decoder.decode(result.value, { stream: true })\n+ }\n+ return shell\n+ })(),\n+ new Promise((_, reject) => {\n+ setTimeout(() => {\n+ reject(new Error('The deferred fallback was not flushed promptly'))\n+ }, 500)\n+ }),\n+ ])\n+\n+ expect(shellResult).not.toContain('2026-07-16T22:00:00.000Z streamed')\n+\n+ let tail = ''\n+ while (true) {\n+ const result = await reader.read()\n+ if (result.done) {\n+ tail += decoder.decode()\n+ break\n+ }\n+ tail += decoder.decode(result.value, { stream: true })\n+ }\n+\n+ expect(shellResult + tail).toContain('2026-07-16T22:00:00.000Z streamed')\n+})\n+\n+test('routes deferred rejections through the route error boundary', async ({\n+ page,\n+}) => {\n+ await page.goto('/deferred-error')\n+ await expect(page.getByTestId('route-error')).toContainText('deferred boom')\n+})\n+\n+test('preserves redirect and not-found response status', async ({\n+ request,\n+}) => {\n+ const redirectResponse = await request.get('/redirect', {\n+ maxRedirects: 0,\n+ })\n+ expect([301, 302, 307, 308]).toContain(redirectResponse.status())\n+ expect(redirectResponse.headers().location).toBe('/about')\n+\n+ const missingResponse = await request.get('/missing')\n+ expect(missingResponse.status()).toBe(404)\n+ expect(await missingResponse.text()).toContain('Not found')\n+})\ndiff --git a/e2e/octane-start/basic/tests/hmr.spec.ts b/e2e/octane-start/basic/tests/hmr.spec.ts\nnew file mode 100644\nindex 0000000000..8439acfc30\n--- /dev/null\n+++ b/e2e/octane-start/basic/tests/hmr.spec.ts\n@@ -0,0 +1,55 @@\n+import path from 'node:path'\n+import { expect } from '@playwright/test'\n+import { createHmrFileEditor, test } from '@tanstack/router-e2e-utils'\n+\n+const baselineHeading = 'Octane + TanStack Start'\n+const updatedHeading = 'Octane + TanStack Start HMR'\n+const routeEditor = createHmrFileEditor({\n+ files: {\n+ index: path.join(process.cwd(), 'src/routes/index.tsrx'),\n+ },\n+ normalizeSource: (_fileKey, source) =>\n+ source.split(updatedHeading).join(baselineHeading),\n+})\n+\n+test.afterAll(async () => {\n+ await routeEditor.capturePromise\n+ await routeEditor.restoreFiles()\n+})\n+\n+test('hot updates a code-split tsrx route without losing state', async ({\n+ page,\n+}) => {\n+ const hydrationErrors: Array = []\n+ page.on('console', (message) => {\n+ if (message.type() === 'error' || message.type() === 'warning') {\n+ hydrationErrors.push(message.text())\n+ }\n+ })\n+ page.on('pageerror', (error) => hydrationErrors.push(error.message))\n+\n+ await routeEditor.capturePromise\n+ await page.goto('/?probe=hmr')\n+ await expect(page.getByTestId('home-heading')).toHaveText(baselineHeading)\n+\n+ await page.getByTestId('counter').click()\n+ await expect(page.getByTestId('counter')).toHaveText('count 1')\n+\n+ try {\n+ await routeEditor.replaceText('index', baselineHeading, updatedHeading)\n+ await expect(page.getByTestId('home-heading')).toHaveText(updatedHeading, {\n+ timeout: 20_000,\n+ })\n+ await expect(page.getByTestId('counter')).toHaveText('count 1')\n+ } finally {\n+ await routeEditor.restoreFiles()\n+ }\n+\n+ await expect(page.getByTestId('home-heading')).toHaveText(baselineHeading, {\n+ timeout: 20_000,\n+ })\n+ await expect(page.getByTestId('counter')).toHaveText('count 1')\n+ await expect(page.locator('#__app nav')).toHaveCount(1)\n+ await expect(page.locator('#__app main')).toHaveCount(1)\n+ expect(hydrationErrors).toEqual([])\n+})\ndiff --git a/e2e/octane-start/basic/tsconfig.json b/e2e/octane-start/basic/tsconfig.json\nnew file mode 100644\nindex 0000000000..e7e65f9b05\n--- /dev/null\n+++ b/e2e/octane-start/basic/tsconfig.json\n@@ -0,0 +1,16 @@\n+{\n+ \"include\": [\"**/*.ts\", \"**/*.d.ts\"],\n+ \"compilerOptions\": {\n+ \"strict\": true,\n+ \"esModuleInterop\": true,\n+ \"module\": \"ESNext\",\n+ \"moduleResolution\": \"Bundler\",\n+ \"lib\": [\"DOM\", \"DOM.Iterable\", \"ES2024\"],\n+ \"isolatedModules\": true,\n+ \"resolveJsonModule\": true,\n+ \"skipLibCheck\": true,\n+ \"target\": \"ES2024\",\n+ \"types\": [\"node\"],\n+ \"noEmit\": true\n+ }\n+}\ndiff --git a/e2e/octane-start/basic/vite.config.cloudflare.ts b/e2e/octane-start/basic/vite.config.cloudflare.ts\nnew file mode 100644\nindex 0000000000..a57522277c\n--- /dev/null\n+++ b/e2e/octane-start/basic/vite.config.cloudflare.ts\n@@ -0,0 +1,10 @@\n+import { cloudflare } from '@cloudflare/vite-plugin'\n+import { defineConfig } from 'vite'\n+import { tanstackStart } from '@tanstack/octane-start/plugin/vite'\n+\n+export default defineConfig({\n+ plugins: [\n+ cloudflare({ viteEnvironment: { name: 'ssr' }, inspectorPort: false }),\n+ tanstackStart(),\n+ ],\n+})\ndiff --git a/e2e/octane-start/basic/vite.config.netlify.ts b/e2e/octane-start/basic/vite.config.netlify.ts\nnew file mode 100644\nindex 0000000000..a72352017e\n--- /dev/null\n+++ b/e2e/octane-start/basic/vite.config.netlify.ts\n@@ -0,0 +1,7 @@\n+import netlify from '@netlify/vite-plugin-tanstack-start'\n+import { defineConfig } from 'vite'\n+import { tanstackStart } from '@tanstack/octane-start/plugin/vite'\n+\n+export default defineConfig({\n+ plugins: [netlify(), tanstackStart()],\n+})\ndiff --git a/e2e/octane-start/basic/vite.config.ts b/e2e/octane-start/basic/vite.config.ts\nnew file mode 100644\nindex 0000000000..241a00f193\n--- /dev/null\n+++ b/e2e/octane-start/basic/vite.config.ts\n@@ -0,0 +1,25 @@\n+import { defineConfig } from 'vite'\n+import { nitro } from 'nitro/vite'\n+import { tanstackStart } from '@tanstack/octane-start/plugin/vite'\n+\n+const outDir = process.env.E2E_DIST_DIR\n+\n+export default defineConfig({\n+ server: {\n+ port: 3000,\n+ },\n+ plugins: [\n+ tanstackStart(),\n+ nitro(\n+ outDir\n+ ? {\n+ output: {\n+ dir: outDir,\n+ serverDir: `${outDir}/server`,\n+ publicDir: `${outDir}/public`,\n+ },\n+ }\n+ : {},\n+ ),\n+ ],\n+})\ndiff --git a/e2e/octane-start/basic/wrangler.jsonc b/e2e/octane-start/basic/wrangler.jsonc\nnew file mode 100644\nindex 0000000000..d78374a0d4\n--- /dev/null\n+++ b/e2e/octane-start/basic/wrangler.jsonc\n@@ -0,0 +1,7 @@\n+{\n+ \"$schema\": \"node_modules/wrangler/config-schema.json\",\n+ \"name\": \"tanstack-octane-start-e2e-basic\",\n+ \"compatibility_date\": \"2025-09-24\",\n+ \"compatibility_flags\": [\"nodejs_compat\"],\n+ \"main\": \"@tanstack/octane-start/server-entry\",\n+}\ndiff --git a/labeler-config.yml b/labeler-config.yml\nindex c1ad49328e..2a8f354377 100644\n--- a/labeler-config.yml\n+++ b/labeler-config.yml\n@@ -13,6 +13,18 @@\n 'package: nitro-v2-vite-plugin':\n - changed-files:\n - any-glob-to-any-file: 'packages/nitro-v2-vite-plugin/**/*'\n+'package: octane-router':\n+ - changed-files:\n+ - any-glob-to-any-file: 'packages/octane-router/**/*'\n+'package: octane-start':\n+ - changed-files:\n+ - any-glob-to-any-file: 'packages/octane-start/**/*'\n+'package: octane-start-client':\n+ - changed-files:\n+ - any-glob-to-any-file: 'packages/octane-start-client/**/*'\n+'package: octane-start-server':\n+ - changed-files:\n+ - any-glob-to-any-file: 'packages/octane-start-server/**/*'\n 'package: react-router':\n - changed-files:\n - any-glob-to-any-file: 'packages/react-router/**/*'\ndiff --git a/package.json b/package.json\nindex cdc2bf2bc8..ba6825b917 100644\n--- a/package.json\n+++ b/package.json\n@@ -51,9 +51,9 @@\n \"cleanup-empty-packages\": \"node scripts/cleanup-empty-packages.mjs\",\n \"test:docs\": \"node scripts/verify-links.ts\",\n \"ts:symbol-references\": \"node scripts/ts-symbol-references.mjs\",\n- \"vite-ecosystem-ci:build\": \"nx run-many --targets=build --projects=@tanstack/router-plugin,@tanstack/start-plugin-core,@tanstack/react-start,@tanstack/react-start-client,@tanstack/react-start-server --skipRemoteCache\",\n+ \"vite-ecosystem-ci:build\": \"nx run-many --targets=build --projects=@tanstack/router-plugin,@tanstack/start-plugin-core,@tanstack/react-start,@tanstack/react-start-client,@tanstack/react-start-server,@tanstack/octane-router,@tanstack/octane-start,@tanstack/octane-start-client,@tanstack/octane-start-server --skipRemoteCache\",\n \"vite-ecosystem-ci:before-test\": \"pnpm exec playwright install chromium\",\n- \"vite-ecosystem-ci:test\": \"nx run-many --targets=test:unit --projects=@tanstack/router-plugin,@tanstack/start-plugin-core,@tanstack/react-start-client --skipRemoteCache && nx run-many --target=test:e2e --projects=tanstack-router-e2e-react-basic-file-based,tanstack-router-e2e-react-basic-file-based-code-splitting,tanstack-react-start-e2e-basic,tanstack-vue-start-e2e-basic,tanstack-solid-start-e2e-basic --skipRemoteCache\"\n+ \"vite-ecosystem-ci:test\": \"nx run-many --targets=test:unit --projects=@tanstack/router-plugin,@tanstack/start-plugin-core,@tanstack/react-start-client,@tanstack/octane-router,@tanstack/octane-start,@tanstack/octane-start-client,@tanstack/octane-start-server --skipRemoteCache && nx run-many --target=test:e2e --projects=tanstack-router-e2e-react-basic-file-based,tanstack-router-e2e-react-basic-file-based-code-splitting,tanstack-react-start-e2e-basic,tanstack-vue-start-e2e-basic,tanstack-solid-start-e2e-basic,tanstack-octane-start-e2e-basic --skipRemoteCache && nx run tanstack-octane-start-e2e-basic:test:platform-builds --skipRemoteCache\"\n },\n \"nx\": {\n \"includedScripts\": [\ndiff --git a/packages/octane-router/CHANGELOG.md b/packages/octane-router/CHANGELOG.md\nnew file mode 100644\nindex 0000000000..cd2e364d9e\n--- /dev/null\n+++ b/packages/octane-router/CHANGELOG.md\n@@ -0,0 +1,12 @@\n+# @tanstack/octane-router\n+\n+## 1.170.18\n+\n+### Patch Changes\n+\n+- Add the official TanStack Router binding for Octane, including typed code- and\n+ file-based routes, client hydration, streaming SSR, head and script management,\n+ and Octane route generation support.\n+\n+- Updated dependencies:\n+ - @tanstack/router-core@1.171.15\ndiff --git a/packages/octane-router/README.md b/packages/octane-router/README.md\nnew file mode 100644\nindex 0000000000..ac72b3e017\n--- /dev/null\n+++ b/packages/octane-router/README.md\n@@ -0,0 +1,101 @@\n+# TanStack Router for Octane\n+\n+Official TanStack Router bindings for the\n+[Octane](https://github.com/octanejs/octane) renderer.\n+\n+```sh\n+pnpm add @tanstack/octane-router octane\n+```\n+\n+The package re-exports `@tanstack/router-core` and supplies the Octane-specific\n+components, hooks, hydration, document primitives, and streaming SSR handlers.\n+It is published as raw source so the Octane Vite compiler can produce the\n+correct client or server output for each build environment.\n+\n+## Router\n+\n+```ts\n+import { createRoot } from 'octane'\n+import {\n+ Link,\n+ Outlet,\n+ RouterProvider,\n+ createRootRoute,\n+ createRoute,\n+ createRouter,\n+} from '@tanstack/octane-router'\n+\n+function RootLayout() @{\n+ \n+ \n+}\n+\n+function Home() @{\n+

Home

\n+}\n+\n+const rootRoute = createRootRoute({ component: RootLayout })\n+const indexRoute = createRoute({\n+ getParentRoute: () => rootRoute,\n+ path: '/',\n+ component: Home,\n+})\n+\n+const router = createRouter({\n+ routeTree: rootRoute.addChildren([indexRoute]),\n+})\n+\n+createRoot(document.getElementById('__app')!).render(RouterProvider, { router })\n+```\n+\n+Code-based and generated file-based routes share the same typed APIs as the\n+other TanStack Router bindings, including route-bound hooks, loaders, search\n+validation, navigation blocking, lazy routes, and link preloading.\n+\n+## Start and SSR\n+\n+TanStack Start uses the `@tanstack/octane-router/ssr/server` and\n+`@tanstack/octane-router/ssr/client` entries. The root route owns the document:\n+\n+```ts\n+import {\n+ Body,\n+ Head,\n+ HeadContent,\n+ Html,\n+ Outlet,\n+ Scripts,\n+ createRootRoute,\n+} from '@tanstack/octane-router'\n+\n+function RootDocument(props: { children?: unknown }) @{\n+ \n+ \n+ \n+ \n+ \n+ {props.children}\n+ \n+ \n+ \n+}\n+\n+function RootLayout() @{\n+ \n+}\n+\n+export const Route = createRootRoute({\n+ shellComponent: RootDocument,\n+ component: RootLayout,\n+})\n+```\n+\n+`Body` emits the server document's `#__app` hydration boundary. On the client,\n+`Html` and `Body` flatten into that existing boundary while `Head` portals its\n+children into `document.head`.\n+\n+Visit [tanstack.com/router](https://tanstack.com/router) for Router concepts and\n+API documentation.\ndiff --git a/packages/octane-router/eslint.config.ts b/packages/octane-router/eslint.config.ts\nnew file mode 100644\nindex 0000000000..6f42530e18\n--- /dev/null\n+++ b/packages/octane-router/eslint.config.ts\n@@ -0,0 +1,19 @@\n+import rootConfig from '../../eslint.config.js'\n+\n+export default [\n+ ...rootConfig,\n+ {\n+ ignores: [\n+ 'tests/_fixtures/**',\n+ 'tests/conformance/**',\n+ 'tests/_helpers.ts',\n+ ],\n+ },\n+ {\n+ files: ['src/**/*.ts', 'tests/**/*.ts'],\n+ rules: {\n+ '@typescript-eslint/no-unnecessary-condition': 'off',\n+ '@typescript-eslint/triple-slash-reference': 'off',\n+ },\n+ },\n+]\ndiff --git a/packages/octane-router/package.json b/packages/octane-router/package.json\nnew file mode 100644\nindex 0000000000..562a16ddde\n--- /dev/null\n+++ b/packages/octane-router/package.json\n@@ -0,0 +1,85 @@\n+{\n+ \"name\": \"@tanstack/octane-router\",\n+ \"version\": \"1.170.18\",\n+ \"description\": \"Modern and scalable routing for Octane applications\",\n+ \"author\": \"Tanner Linsley\",\n+ \"license\": \"MIT\",\n+ \"repository\": {\n+ \"type\": \"git\",\n+ \"url\": \"git+https://github.com/TanStack/router.git\",\n+ \"directory\": \"packages/octane-router\"\n+ },\n+ \"homepage\": \"https://tanstack.com/router\",\n+ \"funding\": {\n+ \"type\": \"github\",\n+ \"url\": \"https://github.com/sponsors/tannerlinsley\"\n+ },\n+ \"keywords\": [\n+ \"octane\",\n+ \"location\",\n+ \"router\",\n+ \"routing\",\n+ \"async\",\n+ \"async router\",\n+ \"typescript\"\n+ ],\n+ \"scripts\": {\n+ \"clean\": \"rimraf ./dist && rimraf ./coverage\",\n+ \"test:eslint\": \"eslint\",\n+ \"test:types\": \"tsc --noEmit\",\n+ \"test:unit\": \"vitest\",\n+ \"test:unit:dev\": \"pnpm run test:unit --watch --hideSkippedTests\",\n+ \"test:build\": \"publint --strict && attw --pack . --profile esm-only --ignore-rules no-resolution internal-resolution-error\",\n+ \"build\": \"tsc --noEmit -p tsconfig.build.json\"\n+ },\n+ \"type\": \"module\",\n+ \"types\": \"src/index.ts\",\n+ \"main\": \"src/index.ts\",\n+ \"module\": \"src/index.ts\",\n+ \"exports\": {\n+ \".\": \"./src/index.ts\",\n+ \"./history\": \"./src/history.ts\",\n+ \"./ssr/server\": {\n+ \"types\": \"./src/ssr/server.ts\",\n+ \"default\": \"./src/ssr/server.ts\"\n+ },\n+ \"./ssr/client\": {\n+ \"types\": \"./src/ssr/client.ts\",\n+ \"default\": \"./src/ssr/client.ts\"\n+ },\n+ \"./generator-plugin\": {\n+ \"types\": \"./src/generator-plugin.d.ts\",\n+ \"default\": \"./src/generator-plugin.js\"\n+ },\n+ \"./package.json\": \"./package.json\"\n+ },\n+ \"sideEffects\": false,\n+ \"files\": [\n+ \"src\",\n+ \"README.md\"\n+ ],\n+ \"engines\": {\n+ \"node\": \">=22\"\n+ },\n+ \"octane\": {\n+ \"hookSlots\": {\n+ \"manual\": [\n+ \"src\"\n+ ]\n+ }\n+ },\n+ \"dependencies\": {\n+ \"@tanstack/history\": \"workspace:*\",\n+ \"@tanstack/router-core\": \"workspace:*\",\n+ \"@tanstack/store\": \"^0.9.3\",\n+ \"isbot\": \"^5.1.22\"\n+ },\n+ \"devDependencies\": {\n+ \"@types/node\": \">=22\",\n+ \"octane\": \"catalog:\",\n+ \"vite\": \"*\"\n+ },\n+ \"peerDependencies\": {\n+ \"octane\": \">=0.1.8\"\n+ }\n+}\ndiff --git a/packages/octane-router/src/Asset.tsrx b/packages/octane-router/src/Asset.tsrx\nnew file mode 100644\nindex 0000000000..fe010cc3c7\n--- /dev/null\n+++ b/packages/octane-router/src/Asset.tsrx\n@@ -0,0 +1,116 @@\n+import { useLayoutEffect } from 'octane';\n+import { isServer } from '@tanstack/router-core/isServer';\n+import { useRouter } from './context.ts';\n+import { useHydrated } from './ClientOnly.tsrx';\n+\n+const MANAGED_KEY_ATTR = 'data-tsr-managed-key';\n+\n+function attributeName(name) {\n+\tswitch (name) {\n+\t\tcase 'charSet':\n+\t\t\treturn 'charset';\n+\t\tcase 'className':\n+\t\t\treturn 'class';\n+\t\tcase 'crossOrigin':\n+\t\t\treturn 'crossorigin';\n+\t\tcase 'httpEquiv':\n+\t\t\treturn 'http-equiv';\n+\t\tdefault:\n+\t\t\treturn name;\n+\t}\n+}\n+\n+function setAttributes(element, attrs) {\n+\tif (!attrs) {\n+\t\treturn;\n+\t}\n+\tfor (const [name, value] of Object.entries(attrs)) {\n+\t\tif (\n+\t\t\tname === 'suppressHydrationWarning' ||\n+\t\t\tvalue === undefined ||\n+\t\t\tvalue === null ||\n+\t\t\tvalue === false\n+\t\t) {\n+\t\t\tcontinue;\n+\t\t}\n+\t\telement.setAttribute(attributeName(name), value === true ? '' : String(value));\n+\t}\n+}\n+\n+function findManagedElement(parent, key) {\n+\tfor (const element of parent.querySelectorAll(`[${MANAGED_KEY_ATTR}]`)) {\n+\t\tif (element.getAttribute(MANAGED_KEY_ATTR) === key) {\n+\t\t\treturn element;\n+\t\t}\n+\t}\n+\treturn undefined;\n+}\n+\n+function mountAsset(props) {\n+\tconst parent = props.target === 'head' ? document.head : document.body;\n+\tconst existing = findManagedElement(parent, props.assetKey);\n+\tif (existing) {\n+\t\treturn () => existing.remove();\n+\t}\n+\n+\tconst element = document.createElement(props.tag);\n+\telement.setAttribute(MANAGED_KEY_ATTR, props.assetKey);\n+\tsetAttributes(element, props.attrs);\n+\tif (typeof props.children === 'string') {\n+\t\telement.textContent = props.children;\n+\t}\n+\tparent.appendChild(element);\n+\treturn () => element.remove();\n+}\n+\n+export function Asset(props) @{\n+\tconst router = useRouter();\n+\tconst server = isServer ?? router.isServer;\n+\tconst hydrated = useHydrated();\n+\tconst renderElement = server || props.target === 'body' && !hydrated;\n+\n+\tif (!server) {\n+\t\tuseLayoutEffect(() => mountAsset(props), [\n+\t\t\tprops.assetKey,\n+\t\t\tprops.attrs,\n+\t\t\tprops.children,\n+\t\t\tprops.tag,\n+\t\t\tprops.target,\n+\t\t]);\n+\t}\n+\n+\t@if (renderElement) {\n+\t\t@switch (props.tag) {\n+\t\t\t@case 'title': {\n+\t\t\t\t\n+\t\t\t\t\t{(props.children ?? '') as string}\n+\t\t\t\t\n+\t\t\t}\n+\t\t\t@case 'meta': {\n+\t\t\t\t\n+\t\t\t}\n+\t\t\t@case 'link': {\n+\t\t\t\t\n+\t\t\t}\n+\t\t\t@case 'style': {\n+\t\t\t\t\n+\t\t\t}\n+\t\t\t@case 'script': {\n+\t\t\t\t\n+\t\t\t}\n+\t\t\t@default: {\n+\t\t\t\t<>\n+\t\t\t}\n+\t\t}\n+\t} @else {\n+\t\t<>\n+\t}\n+}\ndiff --git a/packages/octane-router/src/Asset.tsrx.d.ts b/packages/octane-router/src/Asset.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..31a5c32e8a\n--- /dev/null\n+++ b/packages/octane-router/src/Asset.tsrx.d.ts\n@@ -0,0 +1,9 @@\n+import type { ComponentBody } from 'octane'\n+import type { RouterManagedTag } from '@tanstack/router-core'\n+\n+export type AssetProps = RouterManagedTag & {\n+ assetKey: string\n+ target: 'head' | 'body'\n+}\n+\n+export declare const Asset: ComponentBody\ndiff --git a/packages/octane-router/src/Await.tsrx b/packages/octane-router/src/Await.tsrx\nnew file mode 100644\nindex 0000000000..df7b7b4fbe\n--- /dev/null\n+++ b/packages/octane-router/src/Await.tsrx\n@@ -0,0 +1,22 @@\n+// Suspends on a deferred promise and renders its child — a render-prop\n+// `(data) => ` — with the resolved value. `AwaitInner` does the `use(promise)`\n+// inside a `@try`/`@pending` boundary; the render function is handed to it as a\n+// `render` prop (re-passing it as `{children}` would be an identifier, not a literal\n+// render-prop, so the consumer's `{(d) => …}` stays the public API).\n+import { use } from 'octane';\n+import { toExternalHydrationThenable } from './externalHydration.ts';\n+\n+function AwaitInner(props) {\n+\tconst data = use(toExternalHydrationThenable(props.promise));\n+\treturn props.render(data);\n+}\n+\n+export function Await(props) @{\n+\t@try {\n+\t\t\n+\t} @pending {\n+\t\t<>\n+\t\t\t{props.fallback}\n+\t\t\n+\t}\n+}\ndiff --git a/packages/octane-router/src/Await.tsrx.d.ts b/packages/octane-router/src/Await.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..79822ac071\n--- /dev/null\n+++ b/packages/octane-router/src/Await.tsrx.d.ts\n@@ -0,0 +1,8 @@\n+import type { AwaitOptions } from './useAwaited'\n+\n+export declare function Await(\n+ props: AwaitOptions & {\n+ children: (data: T) => unknown\n+ fallback?: unknown\n+ },\n+): void\ndiff --git a/packages/octane-router/src/Body.ts b/packages/octane-router/src/Body.ts\nnew file mode 100644\nindex 0000000000..2aa849a81a\n--- /dev/null\n+++ b/packages/octane-router/src/Body.ts\n@@ -0,0 +1,37 @@\n+import { HYDRATION_RANGE_BOUNDARY, createElement } from 'octane'\n+import { isServer } from '@tanstack/router-core/isServer'\n+import { useRouter } from './context'\n+import type { ComponentBody } from 'octane'\n+\n+export interface BodyProps {\n+ children?: unknown\n+ [key: string]: unknown\n+}\n+\n+const HydrationRangeOwner: ComponentBody> = (\n+ props,\n+) => props.children\n+\n+;(\n+ HydrationRangeOwner as typeof HydrationRangeOwner & {\n+ [HYDRATION_RANGE_BOUNDARY]: 'owner'\n+ }\n+)[HYDRATION_RANGE_BOUNDARY] = 'owner'\n+\n+export const Body: ComponentBody = (props) => {\n+ const router = useRouter()\n+ const server = isServer ?? router.isServer\n+ const { children, ...attrs } = props\n+ if (server) {\n+ return createElement(\n+ 'body',\n+ attrs,\n+ createElement(\n+ 'div',\n+ { id: '__app' },\n+ createElement(HydrationRangeOwner, {}, children),\n+ ),\n+ )\n+ }\n+ return createElement(HydrationRangeOwner, {}, children)\n+}\ndiff --git a/packages/octane-router/src/CatchBoundary.tsrx b/packages/octane-router/src/CatchBoundary.tsrx\nnew file mode 100644\nindex 0000000000..4bdd9331e6\n--- /dev/null\n+++ b/packages/octane-router/src/CatchBoundary.tsrx\n@@ -0,0 +1,95 @@\n+// react-router's CatchBoundary + default ErrorComponent, rebuilt on octane's\n+// `@try`/`@catch` (octane has no class components, so the upstream\n+// CatchBoundaryImpl class becomes a catch branch). Contract preserved from\n+// upstream CatchBoundary.tsx:\n+// - renders `children` until a descendant throws during render/effects;\n+// - then renders `errorComponent` with `{ error, reset }`;\n+// - `onCatch(error, errorInfo)` fires once per caught error (componentDidCatch\n+// parity). It runs during the catch-branch render — BEFORE the error UI — so\n+// an onCatch that rethrows (Match forwards `notFound()` errors this way)\n+// propagates to the parent boundary exactly like a throwing componentDidCatch;\n+// - when `getResetKey()` changes while an error is showing, the boundary resets\n+// and re-renders `children` (upstream clears the error in\n+// getDerivedStateFromProps; here a layout effect calls the catch reset — one\n+// commit later, same observable outcome). Match passes the router's `loadedAt`\n+// so navigation clears route error UI.\n+import { useState, useRef, useLayoutEffect } from 'octane';\n+\n+declare const process: { env: { NODE_ENV?: string } };\n+\n+export function CatchBoundary(props) @{\n+\t@try {\n+\t\t<>\n+\t\t\t{props.children}\n+\t\t\n+\t} @catch (error, reset) {\n+\t\t\n+\t}\n+}\n+\n+function CatchErrorView(props) @{\n+\t// componentDidCatch parity — once per distinct caught error, during render so a\n+\t// rethrow (the notFound-forwarding path) escapes to the parent boundary.\n+\tconst reported = useRef(null);\n+\tif (reported.current !== props.error) {\n+\t\treported.current = props.error;\n+\t\tif (props.onCatch) {\n+\t\t\tprops.onCatch(props.error, { componentStack: '' });\n+\t\t}\n+\t}\n+\n+\t// Reset when the reset key rolls (navigation). Skip the mount render — the key\n+\t// captured while catching is the baseline.\n+\tconst resetKey =\n+\t\tprops.getResetKey ? props.getResetKey() : undefined;\n+\tconst keyRef = useRef(resetKey);\n+\tuseLayoutEffect(() => {\n+\t\tif (keyRef.current !== resetKey) {\n+\t\t\tkeyRef.current = resetKey;\n+\t\t\tprops.reset();\n+\t\t}\n+\t}, [resetKey]);\n+\n+\tconst ErrorComp = props.errorComponent ?? ErrorComponent;\n+\n+\t\n+}\n+\n+// The default error UI, markup-identical to react-router's ErrorComponent (string\n+// styles serialize to the same inline css React produces, so the differential rig\n+// can byte-compare it).\n+export function ErrorComponent(props) @{\n+\tconst [show, setShow] = useState(process.env.NODE_ENV !== 'production');\n+\n+\t

\n+\t\t

\n+\t\t\tSomething went wrong!\n+\t\t\t setShow((d) => !d)}\n+\t\t\t>\n+\t\t\t\t{show ? 'Hide Error' : 'Show Error'}\n+\t\t\t\n+\t\t

\n+\t\t

\n+\t\t@if (show) {\n+\t\t\t

\n+\t\t\t\t\n+\t\t\t\t\t@if (props.error?.message) {\n+\t\t\t\t\t\t\n+\t\t\t\t\t\t\t{props.error.message as string}\n+\t\t\t\t\t\t\n+\t\t\t\t\t}\n+\t\t\t\t\n+\t\t\t

\n+\t\t}\n+\t

\n+}\ndiff --git a/packages/octane-router/src/CatchBoundary.tsrx.d.ts b/packages/octane-router/src/CatchBoundary.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..39eef3cfa2\n--- /dev/null\n+++ b/packages/octane-router/src/CatchBoundary.tsrx.d.ts\n@@ -0,0 +1,13 @@\n+import type { ComponentBody } from 'octane'\n+import type { ErrorComponentProps } from '@tanstack/router-core'\n+import type { ErrorRouteComponent } from './frameworkTypes'\n+\n+export interface CatchBoundaryProps {\n+ getResetKey: () => number | string\n+ errorComponent?: ErrorRouteComponent\n+ onCatch?: (error: Error, errorInfo: { componentStack: string }) => void\n+ children?: unknown\n+}\n+\n+export declare const CatchBoundary: ComponentBody\n+export declare const ErrorComponent: ComponentBody>\ndiff --git a/packages/octane-router/src/ClientOnly.tsrx b/packages/octane-router/src/ClientOnly.tsrx\nnew file mode 100644\nindex 0000000000..0f9d781afe\n--- /dev/null\n+++ b/packages/octane-router/src/ClientOnly.tsrx\n@@ -0,0 +1,28 @@\n+// ClientOnly / useHydrated — port of react-router's ClientOnly.tsx. Renders\n+// children only once the client has hydrated: `useHydrated` reads a constant\n+// external store whose server snapshot is `false` and client snapshot is\n+// `true`, so SSR (and the hydration render) yield the fallback and the first\n+// client-only render onward yields the children. Authored in .tsrx so the\n+// compiler slots the hook calls (and withSlot-disambiguates useHydrated's\n+// call sites).\n+import { useSyncExternalStore } from 'octane';\n+import { splitSlot, subSlot } from './internal.ts';\n+\n+const subscribe = () => () => {};\n+\n+export function useHydrated(...args) {\n+\tconst [, slot] = splitSlot(args);\n+\treturn useSyncExternalStore(\n+\t\tsubscribe,\n+\t\t() => true,\n+\t\t() => false,\n+\t\tsubSlot(slot, 'hydrated'),\n+\t);\n+}\n+\n+export function ClientOnly(props) @{\n+\tconst hydrated = useHydrated();\n+\t<>\n+\t\t{hydrated ? props.children : props.fallback ?? null}\n+\t\n+}\ndiff --git a/packages/octane-router/src/ClientOnly.tsrx.d.ts b/packages/octane-router/src/ClientOnly.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..5e36216113\n--- /dev/null\n+++ b/packages/octane-router/src/ClientOnly.tsrx.d.ts\n@@ -0,0 +1,7 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const ClientOnly: ComponentBody<{\n+ children?: unknown\n+ fallback?: unknown\n+}>\n+export declare const useHydrated: () => boolean\ndiff --git a/packages/octane-router/src/Head.ts b/packages/octane-router/src/Head.ts\nnew file mode 100644\nindex 0000000000..2b36caccf5\n--- /dev/null\n+++ b/packages/octane-router/src/Head.ts\n@@ -0,0 +1,22 @@\n+import { createElement, createPortal } from 'octane'\n+import { isServer } from '@tanstack/router-core/isServer'\n+import { useRouter } from './context'\n+import type { ComponentBody } from 'octane'\n+\n+export interface HeadProps {\n+ children?: unknown\n+ [key: string]: unknown\n+}\n+\n+export const Head: ComponentBody = (props) => {\n+ const router = useRouter()\n+ const server = isServer ?? router.isServer\n+ const { children, ...attrs } = props\n+ if (server) {\n+ return createElement('head', attrs, children)\n+ }\n+ if (typeof document !== 'undefined') {\n+ return createPortal(children, document.head)\n+ }\n+ return null\n+}\ndiff --git a/packages/octane-router/src/HeadContent.tsrx b/packages/octane-router/src/HeadContent.tsrx\nnew file mode 100644\nindex 0000000000..7fb0704a1c\n--- /dev/null\n+++ b/packages/octane-router/src/HeadContent.tsrx\n@@ -0,0 +1,37 @@\n+import { createElement, useEffect } from 'octane';\n+import { DEV_STYLES_ATTR } from '@tanstack/router-core';\n+import { Asset } from './Asset.tsrx';\n+import { getAssetKey } from './assetKeys.ts';\n+import { useTags } from './headContentUtils.ts';\n+import { useHydrated } from './ClientOnly.tsrx';\n+\n+export function HeadContent(props) @{\n+\tconst tags = useTags(props.assetCrossOrigin);\n+\tconst hydrated = useHydrated();\n+\n+\tuseEffect(() => {\n+\t\tif (process.env.NODE_ENV === 'production' || !hydrated) {\n+\t\t\treturn;\n+\t\t}\n+\t\tdocument\n+\t\t\t.querySelectorAll(`link[${DEV_STYLES_ATTR}]`)\n+\t\t\t.forEach((element) => element.remove());\n+\t}, [hydrated]);\n+\n+\tconst filteredTags =\n+\t\tprocess.env.NODE_ENV !== 'production' && hydrated\n+\t\t\t? tags.filter(\n+\t\t\t\t\t(tag) => tag.tag !== 'link' || tag.attrs?.[DEV_STYLES_ATTR] !== true,\n+\t\t\t\t)\n+\t\t\t: tags;\n+\t<>\n+\t\t{filteredTags.map((tag, index) =>\n+\t\t\tcreateElement(Asset, {\n+\t\t\t\t...tag,\n+\t\t\t\tassetKey: getAssetKey('head', tag, index),\n+\t\t\t\ttarget: 'head',\n+\t\t\t\tkey: getAssetKey('head', tag, index),\n+\t\t\t}),\n+\t\t)}\n+\t\n+}\ndiff --git a/packages/octane-router/src/HeadContent.tsrx.d.ts b/packages/octane-router/src/HeadContent.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..9fae8ed142\n--- /dev/null\n+++ b/packages/octane-router/src/HeadContent.tsrx.d.ts\n@@ -0,0 +1,8 @@\n+import type { ComponentBody } from 'octane'\n+import type { AssetCrossOriginConfig } from '@tanstack/router-core'\n+\n+export interface HeadContentProps {\n+ assetCrossOrigin?: AssetCrossOriginConfig\n+}\n+\n+export declare const HeadContent: ComponentBody\ndiff --git a/packages/octane-router/src/Html.ts b/packages/octane-router/src/Html.ts\nnew file mode 100644\nindex 0000000000..a00be92f6f\n--- /dev/null\n+++ b/packages/octane-router/src/Html.ts\n@@ -0,0 +1,19 @@\n+import { createElement } from 'octane'\n+import { isServer } from '@tanstack/router-core/isServer'\n+import { useRouter } from './context'\n+import type { ComponentBody } from 'octane'\n+\n+export interface HtmlProps {\n+ children?: unknown\n+ [key: string]: unknown\n+}\n+\n+export const Html: ComponentBody = (props) => {\n+ const router = useRouter()\n+ const server = isServer ?? router.isServer\n+ const { children, ...attrs } = props\n+ if (server) {\n+ return createElement('html', attrs, children)\n+ }\n+ return children\n+}\ndiff --git a/packages/octane-router/src/Link.tsrx b/packages/octane-router/src/Link.tsrx\nnew file mode 100644\nindex 0000000000..963c74d481\n--- /dev/null\n+++ b/packages/octane-router/src/Link.tsrx\n@@ -0,0 +1,32 @@\n+// A navigating anchor — a thin shell over `useLinkProps` (link.ts), which\n+// carries ALL of react-router Link's behavior: href building (mask-aware),\n+// external-URL + dangerous-protocol handling, active-state detection,\n+// preloading (intent/viewport/render), and the navigate click handler with\n+// replace/resetScroll/hashScrollIntoView/viewTransition/startTransition/\n+// ignoreBlocker forwarded. Children may be a render prop —\n+// `{({ isActive, isTransitioning }) => …}` — and `createLink` renders a custom\n+// component via the internal `_asChild` prop. Ref is a prop (octane's model —\n+// no forwardRef); `disabled` renders without an href + role=\"link\" (upstream\n+// drops the anchor's disabled attribute; the aria props carry the state).\n+import { isChildrenBlock } from 'octane';\n+import { useLinkProps } from './link.ts';\n+\n+export function Link(props) @{\n+\tconst { _asChild: AsChild, children, ...rest } = props;\n+\tconst linkProps = useLinkProps(rest);\n+\tconst { disabled: _disabled, ...aProps } = linkProps;\n+\n+\tconst resolvedChildren =\n+\t\ttypeof children === 'function' && !isChildrenBlock(children)\n+\t\t\t? children({\n+\t\t\t\t\tisActive: linkProps['data-status'] === 'active',\n+\t\t\t\t\tisTransitioning: linkProps['data-transitioning'] === 'transitioning',\n+\t\t\t\t})\n+\t\t\t: children;\n+\n+\t@if (AsChild) {\n+\t\t{resolvedChildren}\n+\t} @else {\n+\t\t{resolvedChildren}\n+\t}\n+}\ndiff --git a/packages/octane-router/src/Link.tsrx.d.ts b/packages/octane-router/src/Link.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..6a93a2d7db\n--- /dev/null\n+++ b/packages/octane-router/src/Link.tsrx.d.ts\n@@ -0,0 +1,3 @@\n+import type { LinkComponent } from './link'\n+\n+export declare const Link: LinkComponent<'a'>\ndiff --git a/packages/octane-router/src/Match.tsrx b/packages/octane-router/src/Match.tsrx\nnew file mode 100644\nindex 0000000000..e54bf3deb4\n--- /dev/null\n+++ b/packages/octane-router/src/Match.tsrx\n@@ -0,0 +1,236 @@\n+// Renders one route match — port of react-router's Match.tsx (MatchView +\n+// MatchInner + OnRendered). `Match` subscribes to the match's routeId and the\n+// router's `loadedAt` (the error-boundary reset key), resolves the route's\n+// boundary components, and composes the pipeline exactly like upstream:\n+//\n+// Shell > matchContext > Suspense? > CatchBoundary? > CatchNotFound? > MatchInner\n+//\n+// Each boundary is only present when the route (or router defaults) configured a\n+// component for it — otherwise `SafeFragment` passes through so suspensions and\n+// errors bubble to the nearest ancestor boundary (upstream's\n+// ResolvedSuspenseBoundary/ResolvedCatchBoundary/ResolvedNotFoundBoundary).\n+// `MatchInner` handles the match STATUS: it suspends (octane `use`, upstream\n+// `throw promise`) on pending/redirected/_displayPending/_forcePending, renders\n+// the route's not-found UI for `status === 'notFound'`, throws to the\n+// CatchBoundary for `status === 'error'`, and otherwise renders the route\n+// component (or `` for component-less layout routes) keyed by\n+// remountDeps. `OnRendered` (rendered by the match directly below the root)\n+// emits the router's `onRendered` event after the subtree commits — scroll\n+// restoration restores on it.\n+import { useRef, useLayoutEffect, use, createElement, Suspense } from 'octane';\n+import {\n+\tcreateControlledPromise,\n+\tgetLocationChangeInfo,\n+\tisNotFound,\n+\trootRouteId,\n+} from '@tanstack/router-core';\n+import { useStore } from './useStore.ts';\n+import { useRouter, matchContext } from './context.ts';\n+import { Outlet } from './Outlet.tsrx';\n+import { RouteNotFound } from './RouteNotFound.tsrx';\n+import { CatchBoundary, ErrorComponent } from './CatchBoundary.tsrx';\n+import { CatchNotFound } from './not-found.tsrx';\n+import { SafeFragment } from './SafeFragment.tsrx';\n+import { ClientOnly } from './ClientOnly.tsrx';\n+import { ScrollRestorationScript } from './scroll-restoration.tsrx';\n+\n+export function Match(props) @{\n+\tconst router = useRouter();\n+\tconst matchStore = router.stores.matchStores.get(props.matchId);\n+\tconst resetKey = useStore(router.stores.loadedAt, (l) => l);\n+\tconst matchState = useStore(\n+\t\tmatchStore,\n+\t\t(m) => ({\n+\t\t\trouteId: m.routeId,\n+\t\t\tssr: m.ssr,\n+\t\t\t_displayPending: m._displayPending,\n+\t\t}),\n+\t\t(previous, next) =>\n+\t\t\tprevious.routeId === next.routeId &&\n+\t\t\tprevious.ssr === next.ssr &&\n+\t\t\tprevious._displayPending === next._displayPending,\n+\t);\n+\tconst routeId = matchState.routeId;\n+\tconst route = router.routesById[routeId];\n+\n+\tconst PendingComponent = route.options.pendingComponent ?? router.options.defaultPendingComponent;\n+\tconst routeErrorComponent = route.options.errorComponent ?? router.options.defaultErrorComponent;\n+\tconst routeOnCatch = route.options.onCatch ?? router.options.defaultOnCatch;\n+\tconst routeNotFoundComponent = route.isRoot\n+\t\t? route.options.notFoundComponent ?? router.options.notFoundRoute?.options.component\n+\t\t: route.options.notFoundComponent;\n+\tconst resolvedNoSsr = matchState.ssr === false || matchState.ssr === 'data-only';\n+\n+\t// Boundary presence, per upstream MatchView. The root route only gets a\n+\t// Suspense boundary when explicitly opted in via wrapInSuspense.\n+\tconst SuspenseWrap =\n+\t\t(!route.isRoot || route.options.wrapInSuspense || resolvedNoSsr) &&\n+\t\t(route.options.wrapInSuspense ??\n+\t\t\tPendingComponent ??\n+\t\t\t((route.options.errorComponent as any)?.preload || resolvedNoSsr))\n+\t\t\t? Suspense\n+\t\t\t: SafeFragment;\n+\tconst CatchWrap = routeErrorComponent ? CatchBoundary : SafeFragment;\n+\tconst NotFoundWrap = routeNotFoundComponent ? CatchNotFound : SafeFragment;\n+\tconst ShellComponent = route.isRoot ? route.options.shellComponent ?? SafeFragment : SafeFragment;\n+\n+\tconst pendingElement =\n+\t\tPendingComponent ? createElement(PendingComponent, {}) : null;\n+\tconst parentRouteId = route.parentRoute?.id;\n+\n+\t\n+\t\t\n+\t\t\t\n+\t\t\t\t resetKey}\n+\t\t\t\t\terrorComponent={routeErrorComponent || ErrorComponent}\n+\t\t\t\t\tonCatch={(error, errorInfo) => {\n+\t\t\t\t\t\tif (isNotFound(error)) {\n+\t\t\t\t\t\t\terror.routeId ??= routeId;\n+\t\t\t\t\t\t\tthrow error;\n+\t\t\t\t\t\t}\n+\t\t\t\t\t\tif (routeOnCatch) {\n+\t\t\t\t\t\t\trouteOnCatch(error, errorInfo);\n+\t\t\t\t\t\t}\n+\t\t\t\t\t}}\n+\t\t\t\t>\n+\t\t\t\t\t {\n+\t\t\t\t\t\t\terror.routeId ??= routeId;\n+\n+\t\t\t\t\t\t\tif (\n+\t\t\t\t\t\t\t\t!routeNotFoundComponent || error.routeId && error.routeId !== routeId ||\n+\t\t\t\t\t\t\t\t\t!error.routeId && !route.isRoot\n+\t\t\t\t\t\t\t) {\n+\t\t\t\t\t\t\t\tthrow error;\n+\t\t\t\t\t\t\t}\n+\t\t\t\t\t\t\treturn createElement(routeNotFoundComponent, error);\n+\t\t\t\t\t\t}}\n+\t\t\t\t\t>\n+\t\t\t\t\t\t@if (resolvedNoSsr || matchState._displayPending) {\n+\t\t\t\t\t\t\t\n+\t\t\t\t\t\t\t\t\n+\t\t\t\t\t\t\t\n+\t\t\t\t\t\t} @else {\n+\t\t\t\t\t\t\t\n+\t\t\t\t\t\t}\n+\t\t\t\t\t\n+\t\t\t\t\n+\t\t\t\n+\t\t\n+\t\t@if (parentRouteId === rootRouteId) {\n+\t\t\t<>\n+\t\t\t\t\n+\t\t\t\t@if (router.options.scrollRestoration) {\n+\t\t\t\t\t\n+\t\t\t\t}\n+\t\t\t\n+\t\t}\n+\t\n+}\n+\n+function MatchInner(props) {\n+\tconst router = useRouter();\n+\tconst matchStore = router.stores.matchStores.get(props.matchId);\n+\tconst match = useStore(matchStore, (m) => m);\n+\tconst routeId = match.routeId;\n+\tconst route = router.routesById[routeId];\n+\n+\t// The live match in the router (if still mounted there) wins over the\n+\t// snapshot for promise lookups, per upstream getMatchPromise.\n+\tconst getMatchPromise = (key) => router.getMatch(match.id)?._nonReactive[key] ??\n+\t\tmatch._nonReactive[key];\n+\n+\tif (match._displayPending) {\n+\t\tuse(getMatchPromise('displayPendingPromise'));\n+\t}\n+\n+\tif (match._forcePending) {\n+\t\tuse(getMatchPromise('minPendingPromise'));\n+\t}\n+\n+\tif (match.status === 'pending') {\n+\t\t// Once pending UI shows, keep it up for at least pendingMinMs.\n+\t\tconst pendingMinMs = route.options.pendingMinMs ?? router.options.defaultPendingMinMs;\n+\t\tif (pendingMinMs) {\n+\t\t\tconst routerMatch = router.getMatch(match.id);\n+\t\t\tif (routerMatch && !routerMatch._nonReactive.minPendingPromise) {\n+\t\t\t\tconst minPendingPromise = createControlledPromise();\n+\t\t\t\trouterMatch._nonReactive.minPendingPromise = minPendingPromise;\n+\t\t\t\tsetTimeout(() => {\n+\t\t\t\t\tminPendingPromise.resolve();\n+\t\t\t\t\trouterMatch._nonReactive.minPendingPromise = undefined;\n+\t\t\t\t}, pendingMinMs);\n+\t\t\t}\n+\t\t}\n+\t\tuse(getMatchPromise('loadPromise'));\n+\t}\n+\n+\tif (match.status === 'notFound') {\n+\t\treturn createElement(RouteNotFound, { routeId, error: match.error });\n+\t}\n+\n+\tif (match.status === 'redirected') {\n+\t\t// Observed mid-transition while a redirect is in flight — suspend on the\n+\t\t// load so this stale render is abandoned and the redirect completes.\n+\t\tuse(getMatchPromise('loadPromise'));\n+\t}\n+\n+\tif (match.status === 'error') {\n+\t\tthrow match.error;\n+\t}\n+\n+\tconst Comp = route.options.component ?? router.options.defaultComponent;\n+\tconst remountFn = route.options.remountDeps ?? router.options.defaultRemountDeps;\n+\tconst remountDeps =\n+\t\tremountFn\n+\t\t\t? remountFn({\n+\t\t\t\t\trouteId,\n+\t\t\t\t\tloaderDeps: match.loaderDeps,\n+\t\t\t\t\tparams: match._strictParams,\n+\t\t\t\t\tsearch: match._strictSearch,\n+\t\t\t\t})\n+\t\t\t: undefined;\n+\tconst key =\n+\t\tremountDeps ? JSON.stringify(remountDeps) : undefined;\n+\tif (Comp) {\n+\t\treturn createElement(Comp, key !== undefined ? { key } : {});\n+\t}\n+\treturn createElement(Outlet, {});\n+}\n+\n+// Emits the router's `onRendered` event once the subtree below the root layout\n+// has committed (this component renders as a later sibling of the match content,\n+// so its layout effect runs after the subtree's). Tracks the previously-resolved\n+// location in a ref because by effect time Transitioner has already advanced\n+// `resolvedLocation` to the new location.\n+function OnRendered() @{\n+\tconst router = useRouter();\n+\tconst prevResolvedLocationRef = useRef(undefined);\n+\tconst renderedLocationKey = useStore(\n+\t\trouter.stores.resolvedLocation,\n+\t\t(loc) => loc?.state.__TSR_key,\n+\t);\n+\n+\tuseLayoutEffect(() => {\n+\t\tconst currentResolvedLocation = router.stores.resolvedLocation.get();\n+\t\tconst previousResolvedLocation = prevResolvedLocationRef.current;\n+\n+\t\tif (\n+\t\t\tcurrentResolvedLocation &&\n+\t\t\t\t(!previousResolvedLocation ||\n+\t\t\t\t\tpreviousResolvedLocation.href !== currentResolvedLocation.href)\n+\t\t) {\n+\t\t\trouter.emit({\n+\t\t\t\ttype: 'onRendered',\n+\t\t\t\t...getLocationChangeInfo(\n+\t\t\t\t\trouter.stores.location.get(),\n+\t\t\t\t\tpreviousResolvedLocation ?? currentResolvedLocation,\n+\t\t\t\t),\n+\t\t\t});\n+\t\t}\n+\t\tprevResolvedLocationRef.current = currentResolvedLocation;\n+\t}, [renderedLocationKey, router]);\n+\n+\t<>\n+}\ndiff --git a/packages/octane-router/src/Match.tsrx.d.ts b/packages/octane-router/src/Match.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..994abcbb84\n--- /dev/null\n+++ b/packages/octane-router/src/Match.tsrx.d.ts\n@@ -0,0 +1,3 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const Match: ComponentBody<{ matchId: string }>\ndiff --git a/packages/octane-router/src/MatchRoute.tsrx b/packages/octane-router/src/MatchRoute.tsrx\nnew file mode 100644\nindex 0000000000..40c28d51c8\n--- /dev/null\n+++ b/packages/octane-router/src/MatchRoute.tsrx\n@@ -0,0 +1,32 @@\n+// useMatchRoute / MatchRoute — port of react-router's Matches.tsx matcher pair.\n+// The hook subscribes to `matchRouteDeps` (location href + resolved href +\n+// status) so the matcher re-evaluates per navigation, and returns\n+// `matchRoute(opts)` → false | matched params. The component renders its\n+// children when matched — a render-prop child ALWAYS renders, receiving the\n+// params (false when unmatched).\n+import { useCallback, isChildrenBlock } from 'octane';\n+import { useRouter } from './context.ts';\n+import { useStore } from './useStore.ts';\n+\n+export function useMatchRoute() {\n+\tconst router = useRouter();\n+\tuseStore(router.stores.matchRouteDeps, (d) => d);\n+\treturn useCallback((opts) => {\n+\t\tconst { pending, caseSensitive, fuzzy, includeSearch, ...rest } = opts;\n+\t\treturn router.matchRoute(rest, { pending, caseSensitive, fuzzy, includeSearch });\n+\t}, [router]);\n+}\n+\n+export function MatchRoute(props) @{\n+\tconst matchRoute = useMatchRoute();\n+\tconst params = matchRoute(props);\n+\tconst out =\n+\t\ttypeof props.children === 'function' && !isChildrenBlock(props.children)\n+\t\t\t? props.children(params)\n+\t\t\t: params\n+\t\t\t\t? props.children\n+\t\t\t\t: null;\n+\t<>\n+\t\t{out}\n+\t\n+}\ndiff --git a/packages/octane-router/src/MatchRoute.tsrx.d.ts b/packages/octane-router/src/MatchRoute.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..26a884ba15\n--- /dev/null\n+++ b/packages/octane-router/src/MatchRoute.tsrx.d.ts\n@@ -0,0 +1,66 @@\n+import type {\n+ AnyRouter,\n+ DeepPartial,\n+ Expand,\n+ MakeOptionalPathParams,\n+ MakeOptionalSearchParams,\n+ MaskOptions,\n+ MatchRouteOptions,\n+ RegisteredRouter,\n+ ResolveRoute,\n+ ToSubOptionsProps,\n+} from '@tanstack/router-core'\n+\n+export type UseMatchRouteOptions<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TFrom extends string = string,\n+ TTo extends string | undefined = undefined,\n+ TMaskFrom extends string = TFrom,\n+ TMaskTo extends string = '',\n+> = ToSubOptionsProps &\n+ DeepPartial> &\n+ DeepPartial> &\n+ MaskOptions &\n+ MatchRouteOptions\n+\n+export type MatchRouteFn = <\n+ const TFrom extends string = string,\n+ const TTo extends string | undefined = undefined,\n+ const TMaskFrom extends string = TFrom,\n+ const TMaskTo extends string = '',\n+>(\n+ opts: UseMatchRouteOptions,\n+) => false | Expand['types']['allParams']>\n+\n+export declare function useMatchRoute<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+>(): MatchRouteFn\n+\n+export type MakeMatchRouteOptions<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TFrom extends string = string,\n+ TTo extends string | undefined = undefined,\n+ TMaskFrom extends string = TFrom,\n+ TMaskTo extends string = '',\n+> = UseMatchRouteOptions & {\n+ children?:\n+ | string\n+ | number\n+ | boolean\n+ | object\n+ | null\n+ | undefined\n+ | ((\n+ params?: Expand<\n+ ResolveRoute['types']['allParams']\n+ >,\n+ ) => unknown)\n+}\n+\n+export declare function MatchRoute<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string = string,\n+ const TTo extends string | undefined = undefined,\n+ const TMaskFrom extends string = TFrom,\n+ const TMaskTo extends string = '',\n+>(props: MakeMatchRouteOptions): void\ndiff --git a/packages/octane-router/src/Matches.tsrx b/packages/octane-router/src/Matches.tsrx\nnew file mode 100644\nindex 0000000000..2a7f91889a\n--- /dev/null\n+++ b/packages/octane-router/src/Matches.tsrx\n@@ -0,0 +1,60 @@\n+// Runs the navigation engine and renders the match tree root — port of\n+// react-router's Matches.tsx. Structure mirrors upstream:\n+//\n+// useTransitioner + InnerWrap? > Suspense(root pending) > MatchesInner\n+// MatchesInner: matchContext(firstId) > global CatchBoundary? > Match(firstId)\n+//\n+// The root Suspense is ALWAYS present on the client (fallback is the root\n+// route's pendingComponent ?? defaultPendingComponent ?? null) — it's the\n+// already-revealed boundary that lets a navigation transition hold the current\n+// page when the next route suspends without a boundary of its own. The global\n+// CatchBoundary (opt out: `disableGlobalCatchBoundary`) renders the generic\n+// ErrorComponent for errors no route boundary caught, reset by `loadedAt`.\n+import { useLayoutEffect, createElement, Suspense } from 'octane';\n+import { setupScrollRestoration, rootRouteId } from '@tanstack/router-core';\n+import { useStore } from './useStore.ts';\n+import { useRouter, matchContext } from './context.ts';\n+import { useTransitioner } from './Transitioner.tsrx';\n+import { Match } from './Match.tsrx';\n+import { CatchBoundary, ErrorComponent } from './CatchBoundary.tsrx';\n+import { SafeFragment } from './SafeFragment.tsrx';\n+\n+export function Matches() @{\n+\tconst router = useRouter();\n+\tconst rootRoute = router.routesById[rootRouteId];\n+\tconst PendingComponent =\n+\t\trootRoute.options.pendingComponent ?? router.options.defaultPendingComponent;\n+\tconst pendingElement =\n+\t\tPendingComponent ? createElement(PendingComponent, {}) : null;\n+\tconst InnerWrap = router.options.InnerWrap ?? SafeFragment;\n+\n+\t// `createRouter({ scrollRestoration: true })` wires scroll save/restore here, so\n+\t// it works without the (deprecated) component.\n+\tuseLayoutEffect(() => {\n+\t\tif (router.options.scrollRestoration) {\n+\t\t\tsetupScrollRestoration(router);\n+\t\t}\n+\t}, [router]);\n+\tuseTransitioner();\n+\n+\t\n+\t\t\n+\t\t\t\n+\t\t\n+\t\n+}\n+\n+function MatchesInner() @{\n+\tconst router = useRouter();\n+\tconst matchId = useStore(router.stores.firstId, (id) => id);\n+\tconst resetKey = useStore(router.stores.loadedAt, (l) => l);\n+\tconst CatchWrap = router.options.disableGlobalCatchBoundary ? SafeFragment : CatchBoundary;\n+\n+\t\n+\t\t resetKey} errorComponent={ErrorComponent}>\n+\t\t\t@if (matchId) {\n+\t\t\t\t\n+\t\t\t}\n+\t\t\n+\t\n+}\ndiff --git a/packages/octane-router/src/Matches.tsrx.d.ts b/packages/octane-router/src/Matches.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..88286441e4\n--- /dev/null\n+++ b/packages/octane-router/src/Matches.tsrx.d.ts\n@@ -0,0 +1,3 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const Matches: ComponentBody>\ndiff --git a/packages/octane-router/src/Navigate.tsrx b/packages/octane-router/src/Navigate.tsrx\nnew file mode 100644\nindex 0000000000..784bac5ce2\n--- /dev/null\n+++ b/packages/octane-router/src/Navigate.tsrx\n@@ -0,0 +1,16 @@\n+// Imperative navigation as a component: navigates once on mount, renders nothing.\n+import { useLayoutEffect, useRef } from 'octane';\n+import { useNavigate } from './hooks.ts';\n+\n+export function Navigate(props) @{\n+\tconst navigate = useNavigate();\n+\tconst done = useRef(false);\n+\n+\tuseLayoutEffect(() => {\n+\t\tif (done.current) {\n+\t\t\treturn;\n+\t\t}\n+\t\tdone.current = true;\n+\t\tnavigate(props);\n+\t}, []);\n+}\ndiff --git a/packages/octane-router/src/Navigate.tsrx.d.ts b/packages/octane-router/src/Navigate.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..db7be6a588\n--- /dev/null\n+++ b/packages/octane-router/src/Navigate.tsrx.d.ts\n@@ -0,0 +1,13 @@\n+import type {\n+ AnyRouter,\n+ NavigateOptions,\n+ RegisteredRouter,\n+} from '@tanstack/router-core'\n+\n+export declare function Navigate<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string = string,\n+ const TTo extends string | undefined = undefined,\n+ const TMaskFrom extends string = TFrom,\n+ const TMaskTo extends string = '',\n+>(props: NavigateOptions): void\ndiff --git a/packages/octane-router/src/Outlet.tsrx b/packages/octane-router/src/Outlet.tsrx\nnew file mode 100644\nindex 0000000000..205391a65d\n--- /dev/null\n+++ b/packages/octane-router/src/Outlet.tsrx\n@@ -0,0 +1,49 @@\n+// Renders the child match below the current one. Reads the current match id from\n+// `matchContext`, finds the NEXT id in the match-id chain, and renders its ``\n+// — the pull-based descent that replaces a top-down state diff. Renders nothing at\n+// a leaf.\n+//\n+// Not-found (react-router's Outlet, same order): when the URL matched no route,\n+// router-core flags ONE match `globalNotFound` — with the default\n+// `notFoundMode: 'fuzzy'` the deepest fuzzy-matched route that has children, with\n+// `notFoundMode: 'root'` the root. That match still renders its own component\n+// (the layout), and its `` renders the not-found UI INSTEAD of a child\n+// match — so the 404 lands inside the layout chrome.\n+import { useContext, createElement, Suspense } from 'octane';\n+import { rootRouteId } from '@tanstack/router-core';\n+import { useStore } from './useStore.ts';\n+import { useRouter, matchContext } from './context.ts';\n+import { Match } from './Match.tsrx';\n+import { RouteNotFound } from './RouteNotFound.tsrx';\n+import { SafeFragment } from './SafeFragment.tsrx';\n+\n+export function Outlet() @{\n+\tconst router = useRouter();\n+\tconst parentId = useContext(matchContext);\n+\tconst parentStore = router.stores.matchStores.get(parentId);\n+\tconst parentRouteId = useStore(parentStore, (m) => m?.routeId);\n+\tconst globalNotFound = useStore(parentStore, (m) => m?.globalNotFound ?? false);\n+\tconst childId = useStore(router.stores.matchesId, (ids) => {\n+\t\tconst i = ids.indexOf(parentId);\n+\t\treturn i >= 0 ? ids[i + 1] : undefined;\n+\t});\n+\n+\t// The root route's outlet wraps the first real match in a Suspense boundary\n+\t// whose fallback is the router's defaultPendingComponent (react-router's\n+\t// Outlet does the same) — the outermost pending UI for the initial load.\n+\tconst DefaultPending = router.options.defaultPendingComponent;\n+\tconst RootSuspense =\n+\t\tparentRouteId === rootRouteId ? Suspense : SafeFragment;\n+\tconst pendingElement =\n+\t\tDefaultPending ? createElement(DefaultPending, {}) : null;\n+\n+\t@if (globalNotFound) {\n+\t\t\n+\t} @else {\n+\t\t@if (childId) {\n+\t\t\t\n+\t\t\t\t\n+\t\t\t\n+\t\t}\n+\t}\n+}\ndiff --git a/packages/octane-router/src/Outlet.tsrx.d.ts b/packages/octane-router/src/Outlet.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..fa7975faa2\n--- /dev/null\n+++ b/packages/octane-router/src/Outlet.tsrx.d.ts\n@@ -0,0 +1,3 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const Outlet: ComponentBody>\ndiff --git a/packages/octane-router/src/RouteNotFound.tsrx b/packages/octane-router/src/RouteNotFound.tsrx\nnew file mode 100644\nindex 0000000000..2647b15244\n--- /dev/null\n+++ b/packages/octane-router/src/RouteNotFound.tsrx\n@@ -0,0 +1,23 @@\n+// Renders a route's not-found UI — the port of react-router's\n+// `renderRouteNotFound` (+ its `DefaultGlobalNotFound`). Resolution order matches\n+// upstream: the route's own `notFoundComponent`, else the router-level\n+// `defaultNotFoundComponent`, else TanStack's generic `

Not Found

` (the\n+// upstream dev-only console.warn is not ported — repo policy: functional outcomes\n+// only). Rendered from two places, mirroring react-router: `` when its\n+// match is flagged `globalNotFound` (the URL matched no route), and ``\n+// when the match resolved with `status === 'notFound'` (a loader threw\n+// `notFound()`). Upstream spreads the NotFoundError onto the component, so a\n+// `notFound({ data })` payload arrives as the `data` prop.\n+import { useRouter } from './context.ts';\n+\n+export function RouteNotFound(props) @{\n+\tconst router = useRouter();\n+\tconst route = router.routesById[props.routeId];\n+\tconst NotFound = route.options.notFoundComponent ?? router.options.defaultNotFoundComponent;\n+\n+\t@if (NotFound) {\n+\t\t\n+\t} @else {\n+\t\t

Not Found

\n+\t}\n+}\ndiff --git a/packages/octane-router/src/RouterProvider.tsrx b/packages/octane-router/src/RouterProvider.tsrx\nnew file mode 100644\nindex 0000000000..eb8cd81c62\n--- /dev/null\n+++ b/packages/octane-router/src/RouterProvider.tsrx\n@@ -0,0 +1,37 @@\n+// Places the router into context and renders the active match tree. Mirrors\n+// react-router's RouterProvider.tsx: `RouterContextProvider` is the low-level\n+// provider — it forwards any extra props into `router.update()` (so\n+// `` reconfigures the\n+// instance), wraps in `router.options.Wrap` when configured, and provides the\n+// router; `RouterProvider` renders `` inside it.\n+import { hasKeys } from '@tanstack/router-core';\n+import { routerContext } from './context.ts';\n+import { Matches } from './Matches.tsrx';\n+import { SafeFragment } from './SafeFragment.tsrx';\n+\n+export function RouterContextProvider(props) @{\n+\tconst { router, children, ...rest } = props;\n+\tif (hasKeys(rest)) {\n+\t\trouter.update({\n+\t\t\t...router.options,\n+\t\t\t...rest,\n+\t\t\tcontext: {\n+\t\t\t\t...router.options.context,\n+\t\t\t\t...rest.context,\n+\t\t\t},\n+\t\t});\n+\t}\n+\tconst Wrap = router.options.Wrap ?? SafeFragment;\n+\n+\t\n+\t\t{children}\n+\t\n+}\n+\n+export function RouterProvider(props) @{\n+\tconst { router, ...rest } = props;\n+\n+\t\n+\t\t\n+\t\n+}\ndiff --git a/packages/octane-router/src/RouterProvider.tsrx.d.ts b/packages/octane-router/src/RouterProvider.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..c0e17d05fc\n--- /dev/null\n+++ b/packages/octane-router/src/RouterProvider.tsrx.d.ts\n@@ -0,0 +1,40 @@\n+import type {\n+ AnyRouter,\n+ RegisteredRouter,\n+ RouterOptions,\n+} from '@tanstack/router-core'\n+\n+export type RouterProps<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TDehydrated extends Record = Record,\n+> = Omit<\n+ RouterOptions<\n+ TRouter['routeTree'],\n+ NonNullable,\n+ NonNullable,\n+ TRouter['history'],\n+ TDehydrated\n+ >,\n+ 'context'\n+> & {\n+ router: TRouter\n+ context?: Partial<\n+ RouterOptions<\n+ TRouter['routeTree'],\n+ NonNullable,\n+ NonNullable,\n+ TRouter['history'],\n+ TDehydrated\n+ >['context']\n+ >\n+}\n+\n+export declare function RouterProvider<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TDehydrated extends Record = Record,\n+>(props: RouterProps): void\n+\n+export declare function RouterContextProvider<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TDehydrated extends Record = Record,\n+>(props: RouterProps & { children?: unknown }): void\ndiff --git a/packages/octane-router/src/SafeFragment.tsrx b/packages/octane-router/src/SafeFragment.tsrx\nnew file mode 100644\nindex 0000000000..a50b54f87d\n--- /dev/null\n+++ b/packages/octane-router/src/SafeFragment.tsrx\n@@ -0,0 +1,12 @@\n+// Pass-through wrapper used wherever react-router conditionally omits a boundary\n+// (Suspense / CatchBoundary / CatchNotFound / shellComponent). Rendering through\n+// SafeFragment instead of conditionally nesting the template keeps the boundary\n+// slot's component identity dynamic (`` where Wrap is Suspense or this) and\n+// — crucially — means a route WITHOUT a pendingComponent/errorComponent does not\n+// create a boundary at all, so suspensions and errors bubble to the nearest\n+// ancestor that has one (react-router parity).\n+export function SafeFragment(props) @{\n+\t<>\n+\t\t{props.children}\n+\t\n+}\ndiff --git a/packages/octane-router/src/SafeFragment.tsrx.d.ts b/packages/octane-router/src/SafeFragment.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..db215a74a6\n--- /dev/null\n+++ b/packages/octane-router/src/SafeFragment.tsrx.d.ts\n@@ -0,0 +1,3 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const SafeFragment: ComponentBody<{ children?: unknown }>\ndiff --git a/packages/octane-router/src/ScriptOnce.tsrx b/packages/octane-router/src/ScriptOnce.tsrx\nnew file mode 100644\nindex 0000000000..20bdbc37fe\n--- /dev/null\n+++ b/packages/octane-router/src/ScriptOnce.tsrx\n@@ -0,0 +1,23 @@\n+import { useEffect, useState } from 'octane';\n+import { isServer } from '@tanstack/router-core/isServer';\n+import { useRouter } from './context.ts';\n+\n+export function ScriptOnce(props) @{\n+\tconst router = useRouter();\n+\tconst server = isServer ?? router.isServer;\n+\tconst [hydrating, setHydrating] = useState(true);\n+\tuseEffect(() => {\n+\t\tsetHydrating(false);\n+\t}, []);\n+\n+\t@if (server || hydrating) {\n+\t\t\n+\t} @else {\n+\t\t<>\n+\t}\n+}\ndiff --git a/packages/octane-router/src/ScriptOnce.tsrx.d.ts b/packages/octane-router/src/ScriptOnce.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..65a7fe198c\n--- /dev/null\n+++ b/packages/octane-router/src/ScriptOnce.tsrx.d.ts\n@@ -0,0 +1,3 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const ScriptOnce: ComponentBody<{ children: string }>\ndiff --git a/packages/octane-router/src/Scripts.tsrx b/packages/octane-router/src/Scripts.tsrx\nnew file mode 100644\nindex 0000000000..f712560de0\n--- /dev/null\n+++ b/packages/octane-router/src/Scripts.tsrx\n@@ -0,0 +1,41 @@\n+import { createElement, useEffect, useState } from 'octane';\n+import { isServer } from '@tanstack/router-core/isServer';\n+import { getAssetKey } from './assetKeys.ts';\n+import { useRouter } from './context.ts';\n+import { useScripts } from './scriptContentUtils.ts';\n+\n+export function Scripts() @{\n+\tconst router = useRouter();\n+\tconst scripts = useScripts();\n+\tconst [hydrating, setHydrating] = useState(true);\n+\tuseEffect(() => {\n+\t\tsetHydrating(false);\n+\t}, []);\n+\tconst renderScripts =\n+\t\t!(isServer ?? router.isServer) && hydrating\n+\t\t\t? [\n+\t\t\t\t{\n+\t\t\t\t\ttag: 'script',\n+\t\t\t\t\tattrs: {\n+\t\t\t\t\t\tnonce: router.options.ssr?.nonce,\n+\t\t\t\t\t\tclassName: '$tsr',\n+\t\t\t\t\t\tid: '$tsr-stream-barrier',\n+\t\t\t\t\t\tsuppressHydrationWarning: true,\n+\t\t\t\t\t},\n+\t\t\t\t\tchildren: '',\n+\t\t\t\t},\n+\t\t\t\t...scripts,\n+\t\t\t]\n+\t\t\t: scripts;\n+\t<>\n+\t\t{renderScripts.map((script, index) => {\n+\t\t\tconst assetKey = getAssetKey('body', script, index);\n+\t\t\treturn createElement('script', {\n+\t\t\t\t...script.attrs,\n+\t\t\t\tkey: assetKey,\n+\t\t\t\t'data-tsr-managed-key': assetKey,\n+\t\t\t\tdangerouslySetInnerHTML: { __html: script.children ?? '' },\n+\t\t\t});\n+\t\t})}\n+\t\n+}\ndiff --git a/packages/octane-router/src/Scripts.tsrx.d.ts b/packages/octane-router/src/Scripts.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..3ccb684f5c\n--- /dev/null\n+++ b/packages/octane-router/src/Scripts.tsrx.d.ts\n@@ -0,0 +1,3 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const Scripts: ComponentBody>\ndiff --git a/packages/octane-router/src/ScrollRestoration.tsrx b/packages/octane-router/src/ScrollRestoration.tsrx\nnew file mode 100644\nindex 0000000000..d8b2579504\n--- /dev/null\n+++ b/packages/octane-router/src/ScrollRestoration.tsrx\n@@ -0,0 +1,16 @@\n+// Restores scroll position across navigations. router-core's\n+// `setupScrollRestoration` does all the work (save on scroll keyed by location,\n+// restore on navigation) — the component just wires it on mount and renders nothing.\n+// You can also enable it via `createRouter({ scrollRestoration: true })` (handled in\n+// Matches); use one or the other.\n+import { useLayoutEffect } from 'octane';\n+import { setupScrollRestoration } from '@tanstack/router-core';\n+import { useRouter } from './context.ts';\n+\n+export function ScrollRestoration() @{\n+\tconst router = useRouter();\n+\tuseLayoutEffect(() => {\n+\t\tsetupScrollRestoration(router, true);\n+\t}, [router]);\n+\t<>\n+}\ndiff --git a/packages/octane-router/src/ScrollRestoration.tsrx.d.ts b/packages/octane-router/src/ScrollRestoration.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..871135e8b8\n--- /dev/null\n+++ b/packages/octane-router/src/ScrollRestoration.tsrx.d.ts\n@@ -0,0 +1,5 @@\n+import type { ScrollRestorationOptions } from '@tanstack/router-core'\n+\n+export declare function ScrollRestoration(\n+ _props?: ScrollRestorationOptions,\n+): void\ndiff --git a/packages/octane-router/src/Transitioner.tsrx b/packages/octane-router/src/Transitioner.tsrx\nnew file mode 100644\nindex 0000000000..104fb876a8\n--- /dev/null\n+++ b/packages/octane-router/src/Transitioner.tsrx\n@@ -0,0 +1,127 @@\n+// The navigation engine — port of react-router's Transitioner. It is a hook,\n+// rather than a component that renders nothing, because the root match can own\n+// the full document. A rendered sibling would put its SSR marker before \n+// and outside the #__app hydration root.\n+// It (1) supplies `router.startTransition` so every navigation state update rides\n+// an octane transition (concurrent navigation: the current page holds while the\n+// next route suspends), (2) subscribes to history so back/forward and `Link`\n+// clicks reload the matches, (3) kicks off the initial `router.load()` (skipped\n+// when hydrating SSR — ssr-client triggers it) and commits a canonical-URL\n+// replace when the mounted URL isn't in canonical form, and (4) drives the router\n+// EVENT LIFECYCLE: `onLoad` when a load settles, `onBeforeRouteMount` /\n+// `onResolved` when all pending work (load + transition + pending matches)\n+// drains, then commits `status: 'idle'` + `resolvedLocation`. router-core's\n+// scroll restoration, devtools, and `router.subscribe` consumers all key off\n+// these events, and `useRouterState` selectors on `resolvedLocation` depend on\n+// the commit.\n+import { useEffect, useLayoutEffect, useRef, useState, startTransition } from 'octane';\n+import { batch } from '@tanstack/store';\n+import { getLocationChangeInfo, trimPathRight } from '@tanstack/router-core';\n+import { useRouter } from './context.ts';\n+import { useStore } from './useStore.ts';\n+import { usePrevious } from './utils.ts';\n+\n+export function useTransitioner() {\n+\tconst router = useRouter();\n+\tconst mountLoadForRouter = useRef({ router, mounted: false });\n+\tconst [isTransitioning, setIsTransitioning] = useState(false);\n+\n+\tconst isLoading = useStore(router.stores.isLoading, (v) => v);\n+\tconst hasPending = useStore(router.stores.hasPending, (v) => v);\n+\n+\tconst previousIsLoading = usePrevious(isLoading);\n+\tconst isAnyPending = isLoading || isTransitioning || hasPending;\n+\tconst previousIsAnyPending = usePrevious(isAnyPending);\n+\tconst isPagePending = isLoading || hasPending;\n+\tconst previousIsPagePending = usePrevious(isPagePending);\n+\n+\trouter.startTransition = (fn) => {\n+\t\tsetIsTransitioning(true);\n+\t\tstartTransition(() => {\n+\t\t\tfn();\n+\t\t\tsetIsTransitioning(false);\n+\t\t});\n+\t};\n+\n+\t// Subscribe to location changes and load the new location. On mount, also\n+\t// verify the current URL is in canonical form (search serialization,\n+\t// trailing slash) and replace it if not — mirroring the server-side redirect\n+\t// check in router.beforeLoad.\n+\tuseEffect(() => {\n+\t\tconst unsub = router.history.subscribe(() => router.load());\n+\n+\t\tconst nextLocation = router.buildLocation({\n+\t\t\tto: router.latestLocation.pathname,\n+\t\t\tsearch: true,\n+\t\t\tparams: true,\n+\t\t\thash: true,\n+\t\t\tstate: true,\n+\t\t\t_includeValidateSearch: true,\n+\t\t});\n+\t\tif (\n+\t\t\ttrimPathRight(router.latestLocation.publicHref) !== trimPathRight(nextLocation.publicHref)\n+\t\t) {\n+\t\t\trouter.commitLocation({ ...nextLocation, replace: true });\n+\t\t}\n+\n+\t\treturn () => unsub();\n+\t}, [router, router.history]);\n+\n+\t// Initial load. Skipped when hydrating from SSR (ssr-client triggers it) and\n+\t// on re-runs for the same router instance.\n+\tuseLayoutEffect(() => {\n+\t\tif (\n+\t\t\ttypeof window !== 'undefined' && router.ssr ||\n+\t\t\t\tmountLoadForRouter.current.router === router && mountLoadForRouter.current.mounted\n+\t\t) {\n+\t\t\treturn;\n+\t\t}\n+\t\tmountLoadForRouter.current = { router, mounted: true };\n+\t\trouter.load().catch((err: unknown) => {\n+\t\t\tconsole.error(err);\n+\t\t});\n+\t}, [router]);\n+\n+\t// The router was loading and now it's not — the new matches are in state.\n+\tuseLayoutEffect(() => {\n+\t\tif (previousIsLoading && !isLoading) {\n+\t\t\trouter.emit({\n+\t\t\t\ttype: 'onLoad',\n+\t\t\t\t...getLocationChangeInfo(\n+\t\t\t\t\trouter.stores.location.get(),\n+\t\t\t\t\trouter.stores.resolvedLocation.get(),\n+\t\t\t\t),\n+\t\t\t});\n+\t\t}\n+\t}, [previousIsLoading, router, isLoading]);\n+\n+\tuseLayoutEffect(() => {\n+\t\tif (previousIsPagePending && !isPagePending) {\n+\t\t\trouter.emit({\n+\t\t\t\ttype: 'onBeforeRouteMount',\n+\t\t\t\t...getLocationChangeInfo(\n+\t\t\t\t\trouter.stores.location.get(),\n+\t\t\t\t\trouter.stores.resolvedLocation.get(),\n+\t\t\t\t),\n+\t\t\t});\n+\t\t}\n+\t}, [isPagePending, previousIsPagePending, router]);\n+\n+\t// Everything pending has drained — resolve the navigation: emit onResolved and\n+\t// commit status idle + resolvedLocation (what `onRendered` and scroll\n+\t// restoration key off).\n+\tuseLayoutEffect(() => {\n+\t\tif (previousIsAnyPending && !isAnyPending) {\n+\t\t\tconst changeInfo = getLocationChangeInfo(\n+\t\t\t\trouter.stores.location.get(),\n+\t\t\t\trouter.stores.resolvedLocation.get(),\n+\t\t\t);\n+\t\t\trouter.emit({ type: 'onResolved', ...changeInfo });\n+\n+\t\t\tbatch(() => {\n+\t\t\t\trouter.stores.status.set('idle');\n+\t\t\t\trouter.stores.resolvedLocation.set(router.stores.location.get());\n+\t\t\t});\n+\t\t}\n+\t}, [isAnyPending, previousIsAnyPending, router]);\n+}\ndiff --git a/packages/octane-router/src/assetKeys.ts b/packages/octane-router/src/assetKeys.ts\nnew file mode 100644\nindex 0000000000..7eb81c667f\n--- /dev/null\n+++ b/packages/octane-router/src/assetKeys.ts\n@@ -0,0 +1,15 @@\n+import type { RouterManagedTag } from '@tanstack/router-core'\n+\n+export function getAssetKey(\n+ scope: 'head' | 'body',\n+ asset: RouterManagedTag,\n+ index: number,\n+) {\n+ const inlineCss = asset.tag === 'style' && asset.inlineCss\n+ return `${scope}:${index}:${JSON.stringify({\n+ tag: asset.tag,\n+ attrs: asset.attrs,\n+ children: inlineCss ? undefined : asset.children,\n+ inlineCss,\n+ })}`\n+}\ndiff --git a/packages/octane-router/src/context.ts b/packages/octane-router/src/context.ts\nnew file mode 100644\nindex 0000000000..f5d82b73c5\n--- /dev/null\n+++ b/packages/octane-router/src/context.ts\n@@ -0,0 +1,33 @@\n+// Router + match contexts. `routerContext` carries the Router instance (provided\n+// by RouterProvider, read by every hook). `matchContext` carries the current\n+// match id down the render tree so `Outlet` can find the NEXT match to render —\n+// the pull-based chaining that replaces a top-down state diff.\n+import { createContext, useContext } from 'octane'\n+import type { AnyRouter, RegisteredRouter } from '@tanstack/router-core'\n+\n+export const routerContext = createContext(undefined)\n+export const getRouterContext = (): typeof routerContext => routerContext\n+\n+// The id of the nearest rendered match (undefined above the first match).\n+export const matchContext = createContext(undefined)\n+\n+// Resolve the active router: an explicitly-passed one wins, else the context.\n+// `useContext` is keyed by context identity (not a per-call-site slot), so it's\n+// safe to call from this binding code without a slot.\n+export function useRouter(opts?: {\n+ router?: TRouter\n+ warn?: boolean\n+}): TRouter\n+export function useRouter(...args: Array): AnyRouter {\n+ const opts = (\n+ args.length && typeof args[0] !== 'symbol' ? args[0] : undefined\n+ ) as { router?: AnyRouter; warn?: boolean } | undefined\n+ const ctx = useContext(routerContext)\n+ const router = opts?.router ?? ctx\n+ if (!router && opts?.warn !== false) {\n+ throw new Error(\n+ 'useRouter must be used inside a component!',\n+ )\n+ }\n+ return router as AnyRouter\n+}\ndiff --git a/packages/octane-router/src/externalHydration.ts b/packages/octane-router/src/externalHydration.ts\nnew file mode 100644\nindex 0000000000..81de81cdee\n--- /dev/null\n+++ b/packages/octane-router/src/externalHydration.ts\n@@ -0,0 +1,88 @@\n+const EXTERNAL_HYDRATION_PROMISE = Symbol.for(\n+ 'octane.external-hydration-promise',\n+)\n+\n+type ExternalHydrationThenable = PromiseLike & {\n+ [EXTERNAL_HYDRATION_PROMISE]: true\n+ status?: ThenableStatus\n+ value?: T\n+ reason?: unknown\n+}\n+\n+type ThenableStatus = 'pending' | 'fulfilled' | 'rejected'\n+\n+const externalHydrationThenables = new WeakMap<\n+ object,\n+ ExternalHydrationThenable\n+>()\n+\n+/**\n+ * Wrap a router-owned promise so Octane still schedules its suspense boundary,\n+ * while TanStack's serializer remains the only owner of its hydration value.\n+ */\n+export function toExternalHydrationThenable(\n+ thenable: PromiseLike,\n+): PromiseLike {\n+ const key = thenable as object\n+ const existing = externalHydrationThenables.get(key)\n+ if (existing) {\n+ return existing as ExternalHydrationThenable\n+ }\n+\n+ let localStatus: ThenableStatus | undefined\n+ let localValue: T | undefined\n+ let localReason: unknown\n+ let hasLocalValue = false\n+ let hasLocalReason = false\n+\n+ const externalThenable: ExternalHydrationThenable = {\n+ [EXTERNAL_HYDRATION_PROMISE]: true,\n+ get status() {\n+ return localStatus ?? readThenableStatus(thenable)\n+ },\n+ set status(status) {\n+ localStatus = status\n+ },\n+ get value(): T | undefined {\n+ return hasLocalValue\n+ ? localValue\n+ : readThenableProperty(thenable, 'value')\n+ },\n+ set value(value: T | undefined) {\n+ hasLocalValue = true\n+ localValue = value\n+ },\n+ get reason(): unknown {\n+ return hasLocalReason\n+ ? localReason\n+ : readThenableProperty(thenable, 'reason')\n+ },\n+ set reason(reason) {\n+ hasLocalReason = true\n+ localReason = reason\n+ },\n+ then(onfulfilled, onrejected) {\n+ return thenable.then(onfulfilled, onrejected)\n+ },\n+ }\n+ externalHydrationThenables.set(key, externalThenable)\n+ return externalThenable\n+}\n+\n+function readThenableStatus(thenable: PromiseLike) {\n+ const status = readThenableProperty(thenable, 'status')\n+ return status === 'pending' || status === 'fulfilled' || status === 'rejected'\n+ ? status\n+ : undefined\n+}\n+\n+function readThenableProperty(\n+ thenable: PromiseLike,\n+ property: 'status' | 'value' | 'reason',\n+): T | undefined {\n+ try {\n+ return (thenable as PromiseLike & Record)[property]\n+ } catch {\n+ return undefined\n+ }\n+}\ndiff --git a/packages/octane-router/src/fileRoute.ts b/packages/octane-router/src/fileRoute.ts\nnew file mode 100644\nindex 0000000000..7004fac609\n--- /dev/null\n+++ b/packages/octane-router/src/fileRoute.ts\n@@ -0,0 +1,284 @@\n+import { createRoute } from './route'\n+import { internalHooks } from './hooks'\n+import { useRouter } from './context'\n+import { splitSlot, subSlot } from './internal'\n+import type {\n+ AnyContext,\n+ AnyRoute,\n+ AnyRouter,\n+ Constrain,\n+ ConstrainLiteral,\n+ FileBaseRouteOptions,\n+ FileRoutesByPath,\n+ LazyRouteOptions,\n+ Register,\n+ RegisteredRouter,\n+ ResolveParams,\n+ Route,\n+ RouteById,\n+ RouteConstraints,\n+ RouteIds,\n+ RouteLoaderEntry,\n+ UpdatableRouteOptions,\n+ UseNavigateResult,\n+} from '@tanstack/router-core'\n+import type {\n+ UseLoaderDataRoute,\n+ UseLoaderDepsRoute,\n+ UseMatchRoute,\n+ UseParamsRoute,\n+ UseRouteContextRoute,\n+ UseSearchRoute,\n+} from './hooks'\n+\n+declare const process: {\n+ env: {\n+ NODE_ENV?: string\n+ }\n+}\n+\n+export function createFileRoute<\n+ TFilePath extends keyof FileRoutesByPath,\n+ TParentRoute extends AnyRoute = FileRoutesByPath[TFilePath]['parentRoute'],\n+ TId extends RouteConstraints['TId'] = FileRoutesByPath[TFilePath]['id'],\n+ TPath extends RouteConstraints['TPath'] = FileRoutesByPath[TFilePath]['path'],\n+ TFullPath extends RouteConstraints['TFullPath'] =\n+ FileRoutesByPath[TFilePath]['fullPath'],\n+>(\n+ path?: TFilePath,\n+): FileRoute['createRoute'] {\n+ return new FileRoute(path, {\n+ silent: true,\n+ }).createRoute\n+}\n+\n+/** @deprecated Use `createFileRoute(path)(options)` instead. */\n+export class FileRoute<\n+ TFilePath extends keyof FileRoutesByPath,\n+ TParentRoute extends AnyRoute = FileRoutesByPath[TFilePath]['parentRoute'],\n+ TId extends RouteConstraints['TId'] = FileRoutesByPath[TFilePath]['id'],\n+ TPath extends RouteConstraints['TPath'] = FileRoutesByPath[TFilePath]['path'],\n+ TFullPath extends RouteConstraints['TFullPath'] =\n+ FileRoutesByPath[TFilePath]['fullPath'],\n+> {\n+ silent?: boolean\n+\n+ constructor(\n+ public path?: TFilePath,\n+ _opts?: { silent: boolean },\n+ ) {\n+ this.silent = _opts?.silent\n+ }\n+\n+ createRoute = <\n+ TRegister = Register,\n+ TSearchValidator = undefined,\n+ TParams = ResolveParams,\n+ TRouteContextFn = AnyContext,\n+ TBeforeLoadFn = AnyContext,\n+ TLoaderDeps extends Record = {},\n+ TLoaderFn = undefined,\n+ TChildren = unknown,\n+ TSSR = unknown,\n+ const TMiddlewares = unknown,\n+ THandlers = undefined,\n+ >(\n+ options?: FileBaseRouteOptions<\n+ TRegister,\n+ TParentRoute,\n+ TId,\n+ TPath,\n+ TSearchValidator,\n+ TParams,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ AnyContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ AnyContext,\n+ TSSR,\n+ TMiddlewares,\n+ THandlers\n+ > &\n+ UpdatableRouteOptions<\n+ TParentRoute,\n+ TId,\n+ TFullPath,\n+ TParams,\n+ TSearchValidator,\n+ TLoaderFn,\n+ TLoaderDeps,\n+ AnyContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn\n+ >,\n+ ): Route<\n+ TRegister,\n+ TParentRoute,\n+ TPath,\n+ TFullPath,\n+ TFilePath,\n+ TId,\n+ TSearchValidator,\n+ TParams,\n+ AnyContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TChildren,\n+ unknown,\n+ TSSR,\n+ TMiddlewares,\n+ THandlers\n+ > => {\n+ if (process.env.NODE_ENV !== 'production' && !this.silent) {\n+ console.warn(\n+ 'Warning: FileRoute is deprecated. Use createFileRoute(path)(options) instead.',\n+ )\n+ }\n+ const route = createRoute(options as any)\n+ ;(route as any).isRoot = false\n+ return route as any\n+ }\n+}\n+\n+/** @deprecated Place the loader in the main `createFileRoute` options. */\n+export function FileRouteLoader<\n+ TFilePath extends keyof FileRoutesByPath,\n+ TRoute extends FileRoutesByPath[TFilePath]['preLoaderRoute'],\n+>(\n+ _path: TFilePath,\n+): (\n+ loaderFn: Constrain<\n+ TLoaderFn,\n+ RouteLoaderEntry<\n+ Register,\n+ TRoute['parentRoute'],\n+ TRoute['types']['id'],\n+ TRoute['types']['params'],\n+ TRoute['types']['loaderDeps'],\n+ TRoute['types']['routerContext'],\n+ TRoute['types']['routeContextFn'],\n+ TRoute['types']['beforeLoadFn']\n+ >\n+ >,\n+) => TLoaderFn {\n+ if (process.env.NODE_ENV !== 'production') {\n+ console.warn(\n+ 'Warning: FileRouteLoader is deprecated. Place the loader in createFileRoute options.',\n+ )\n+ }\n+ return (loaderFn) => loaderFn as never\n+}\n+\n+declare module '@tanstack/router-core' {\n+ export interface LazyRoute {\n+ useMatch: UseMatchRoute\n+ useRouteContext: UseRouteContextRoute\n+ useSearch: UseSearchRoute\n+ useParams: UseParamsRoute\n+ useLoaderDeps: UseLoaderDepsRoute\n+ useLoaderData: UseLoaderDataRoute\n+ useNavigate: () => UseNavigateResult\n+ }\n+}\n+\n+export class LazyRoute {\n+ options: { id: string } & LazyRouteOptions\n+ declare useMatch: UseMatchRoute\n+ declare useRouteContext: UseRouteContextRoute\n+ declare useSearch: UseSearchRoute\n+ declare useParams: UseParamsRoute\n+ declare useLoaderDeps: UseLoaderDepsRoute\n+ declare useLoaderData: UseLoaderDataRoute\n+ declare useNavigate: () => UseNavigateResult\n+\n+ constructor(opts: { id: string } & LazyRouteOptions) {\n+ this.options = opts\n+ const id = this.options.id\n+ this.useMatch = ((...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const options = user[0] ?? {}\n+ return internalHooks.useMatch(\n+ {\n+ select: options.select,\n+ from: id,\n+ structuralSharing: options.structuralSharing,\n+ },\n+ subSlot(slot, 'lr:m'),\n+ )\n+ }) as typeof this.useMatch\n+ this.useRouteContext = ((...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ return internalHooks.useRouteContext(\n+ { ...(user[0] ?? {}), from: id },\n+ subSlot(slot, 'lr:c'),\n+ )\n+ }) as typeof this.useRouteContext\n+ this.useSearch = ((...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const options = user[0] ?? {}\n+ return internalHooks.useSearch(\n+ {\n+ select: options.select,\n+ from: id,\n+ structuralSharing: options.structuralSharing,\n+ },\n+ subSlot(slot, 'lr:s'),\n+ )\n+ }) as typeof this.useSearch\n+ this.useParams = ((...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const options = user[0] ?? {}\n+ return internalHooks.useParams(\n+ {\n+ select: options.select,\n+ from: id,\n+ structuralSharing: options.structuralSharing,\n+ },\n+ subSlot(slot, 'lr:p'),\n+ )\n+ }) as typeof this.useParams\n+ this.useLoaderDeps = ((...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ return internalHooks.useLoaderDeps(\n+ { ...(user[0] ?? {}), from: id },\n+ subSlot(slot, 'lr:d'),\n+ )\n+ }) as typeof this.useLoaderDeps\n+ this.useLoaderData = ((...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ return internalHooks.useLoaderData(\n+ { ...(user[0] ?? {}), from: id },\n+ subSlot(slot, 'lr:l'),\n+ )\n+ }) as typeof this.useLoaderData\n+ this.useNavigate = ((...args: Array) => {\n+ const [, slot] = splitSlot(args)\n+ const router = useRouter()\n+ return internalHooks.useNavigate(\n+ { from: router.routesById[id].fullPath },\n+ subSlot(slot, 'lr:n'),\n+ )\n+ }) as typeof this.useNavigate\n+ }\n+}\n+\n+export function createLazyRoute<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TId extends string = string,\n+ TRoute extends AnyRoute = RouteById,\n+>(id: ConstrainLiteral>) {\n+ return (opts: LazyRouteOptions) => new LazyRoute({ id, ...opts })\n+}\n+\n+export function createLazyFileRoute<\n+ TFilePath extends keyof FileRoutesByPath,\n+ TRoute extends FileRoutesByPath[TFilePath]['preLoaderRoute'],\n+>(id: TFilePath): (opts: LazyRouteOptions) => LazyRoute {\n+ if (typeof id === 'object') {\n+ return new LazyRoute(id) as any\n+ }\n+ return (opts: LazyRouteOptions) => new LazyRoute({ id, ...opts })\n+}\ndiff --git a/packages/octane-router/src/frameworkTypes.ts b/packages/octane-router/src/frameworkTypes.ts\nnew file mode 100644\nindex 0000000000..c90a3bff2e\n--- /dev/null\n+++ b/packages/octane-router/src/frameworkTypes.ts\n@@ -0,0 +1,89 @@\n+import type { ComponentBody } from 'octane'\n+import type {\n+ ErrorComponentProps,\n+ MetaDescriptor,\n+ NotFoundRouteProps,\n+ UseNavigateResult,\n+} from '@tanstack/router-core'\n+import type {\n+ UseLoaderDataRoute,\n+ UseLoaderDepsRoute,\n+ UseMatchRoute,\n+ UseParamsRoute,\n+ UseRouteContextRoute,\n+ UseSearchRoute,\n+} from './hooks'\n+import type { LinkComponentRoute } from './link'\n+\n+export type OctaneElementAttributes = Record<\n+ string,\n+ string | number | boolean | null | undefined\n+>\n+\n+export type OctaneScriptAttributes = OctaneElementAttributes & {\n+ children?: string\n+}\n+\n+export interface DefaultRouteTypes {\n+ component: ComponentBody\n+}\n+\n+export interface RouteTypes extends DefaultRouteTypes {}\n+\n+export type AsyncRouteComponent = RouteTypes['component'] & {\n+ preload?: () => Promise\n+}\n+\n+export type RouteComponent = AsyncRouteComponent>\n+\n+export type ErrorRouteComponent = AsyncRouteComponent\n+\n+export type NotFoundRouteComponent = RouteTypes['component']\n+\n+declare module '@tanstack/router-core' {\n+ export interface RouteMatchExtensions {\n+ meta?: Array\n+ links?: Array\n+ scripts?: Array\n+ styles?: Array\n+ headScripts?: Array\n+ }\n+\n+ export interface UpdatableRouteOptionsExtensions {\n+ component?: RouteComponent\n+ errorComponent?: false | null | undefined | ErrorRouteComponent\n+ notFoundComponent?: NotFoundRouteComponent\n+ pendingComponent?: RouteComponent\n+ }\n+\n+ export interface RootRouteOptionsExtensions {\n+ shellComponent?: ComponentBody<{ children?: unknown }>\n+ }\n+\n+ export interface RouteExtensions<\n+ in out TId extends string,\n+ in out TFullPath extends string,\n+ > {\n+ useMatch: UseMatchRoute\n+ useRouteContext: UseRouteContextRoute\n+ useSearch: UseSearchRoute\n+ useParams: UseParamsRoute\n+ useLoaderDeps: UseLoaderDepsRoute\n+ useLoaderData: UseLoaderDataRoute\n+ useNavigate: () => UseNavigateResult\n+ Link: LinkComponentRoute\n+ }\n+\n+ export interface RouterOptionsExtensions {\n+ defaultComponent?: RouteComponent\n+ defaultErrorComponent?: ErrorRouteComponent\n+ defaultPendingComponent?: RouteComponent\n+ defaultNotFoundComponent?: NotFoundRouteComponent\n+ Wrap?: ComponentBody<{ children?: unknown }>\n+ InnerWrap?: ComponentBody<{ children?: unknown }>\n+ defaultOnCatch?: (\n+ error: Error,\n+ errorInfo: { componentStack: string },\n+ ) => void\n+ }\n+}\ndiff --git a/packages/octane-router/src/generator-plugin.d.ts b/packages/octane-router/src/generator-plugin.d.ts\nnew file mode 100644\nindex 0000000000..7771265763\n--- /dev/null\n+++ b/packages/octane-router/src/generator-plugin.d.ts\n@@ -0,0 +1,23 @@\n+export interface TransformRouteSourceOptions {\n+ source: string\n+ filename: string\n+ node: unknown\n+}\n+\n+export interface FormatRouteOptions {\n+ source: string\n+ node: unknown\n+}\n+\n+export interface OctaneRouteGeneratorPlugin {\n+ name: string\n+ transformRouteSource: (options: TransformRouteSourceOptions) => string\n+ formatRoute: (options: FormatRouteOptions) => string\n+}\n+\n+export declare function maskOctaneRouteSource(\n+ source: string,\n+ filename?: string,\n+): string\n+\n+export declare function octaneRouteGeneratorPlugin(): OctaneRouteGeneratorPlugin\ndiff --git a/packages/octane-router/src/generator-plugin.js b/packages/octane-router/src/generator-plugin.js\nnew file mode 100644\nindex 0000000000..e50c10a31e\n--- /dev/null\n+++ b/packages/octane-router/src/generator-plugin.js\n@@ -0,0 +1,103 @@\n+import { compileToVolarMappings } from 'octane/compiler/volar'\n+\n+/**\n+ * @typedef {object} AstNode\n+ * @property {AstNode | Array} [body]\n+ * @property {number} [start]\n+ * @property {number} [end]\n+ * @property {{ native_tsrx_body?: boolean }} [metadata]\n+ */\n+\n+/**\n+ * Makes TSRX route modules parseable by the router generator without changing\n+ * source offsets. The generator applies edits to the original source, so the\n+ * authored Octane template bodies remain byte-for-byte intact.\n+ *\n+ * @param {string} source\n+ * @param {string} [filename]\n+ * @returns {string}\n+ */\n+export function maskOctaneRouteSource(source, filename = 'route.tsrx') {\n+ const { sourceAst } = compileToVolarMappings(source, filename)\n+ const output = source.split('')\n+\n+ for (const body of findNativeTemplateBodies(\n+ /** @type {AstNode} */ (sourceAst),\n+ )) {\n+ const { start, end } = body\n+ output[start] = ' '\n+ output[start + 1] = '{'\n+ for (let index = start + 2; index < end - 1; index++) {\n+ if (source[index] !== '\\n' && source[index] !== '\\r') {\n+ output[index] = ' '\n+ }\n+ }\n+ output[end - 1] = '}'\n+ }\n+\n+ return output.join('')\n+}\n+\n+/**\n+ * @returns {{\n+ * name: string\n+ * transformRouteSource: (options: { source: string, filename: string }) => string\n+ * formatRoute: (options: { source: string }) => string\n+ * }}\n+ */\n+export function octaneRouteGeneratorPlugin() {\n+ return {\n+ name: 'octane-route-source',\n+ transformRouteSource: ({ source, filename }) =>\n+ maskOctaneRouteSource(source, filename),\n+ // Router scaffolds are already formatted. Returning them unchanged avoids\n+ // passing TSRX's `@{}` syntax through a TypeScript-only formatter.\n+ formatRoute: ({ source }) => source,\n+ }\n+}\n+\n+/**\n+ * @param {AstNode} root\n+ * @returns {Array<{ start: number, end: number }>}\n+ */\n+function findNativeTemplateBodies(root) {\n+ /** @type {Array<{ start: number, end: number }>} */\n+ const bodies = []\n+ const visited = new WeakSet()\n+\n+ /** @param {unknown} value */\n+ const visit = (value) => {\n+ if (!value || typeof value !== 'object' || visited.has(value)) {\n+ return\n+ }\n+ visited.add(value)\n+\n+ if (Array.isArray(value)) {\n+ for (const item of value) {\n+ visit(item)\n+ }\n+ return\n+ }\n+\n+ const node = /** @type {AstNode} */ (value)\n+ if (\n+ node.metadata?.native_tsrx_body === true &&\n+ node.body &&\n+ !Array.isArray(node.body) &&\n+ typeof node.body.start === 'number' &&\n+ typeof node.body.end === 'number'\n+ ) {\n+ bodies.push({ start: node.body.start, end: node.body.end })\n+ return\n+ }\n+\n+ for (const [key, child] of Object.entries(node)) {\n+ if (key !== 'metadata' && key !== 'loc') {\n+ visit(child)\n+ }\n+ }\n+ }\n+\n+ visit(root)\n+ return bodies\n+}\ndiff --git a/packages/octane-router/src/headContentUtils.ts b/packages/octane-router/src/headContentUtils.ts\nnew file mode 100644\nindex 0000000000..b20d542f9c\n--- /dev/null\n+++ b/packages/octane-router/src/headContentUtils.ts\n@@ -0,0 +1,187 @@\n+import {\n+ appendUniqueUserTags,\n+ deepEqual,\n+ escapeHtml,\n+ getAssetCrossOrigin,\n+ getScriptPreloadAttrs,\n+ resolveManifestCssLink,\n+} from '@tanstack/router-core'\n+import { isServer } from '@tanstack/router-core/isServer'\n+import { useRouter } from './context'\n+import { splitSlot, subSlot } from './internal'\n+import { useStore } from './useStore'\n+import type {\n+ AnyRouteMatch,\n+ AnyRouter,\n+ AssetCrossOriginConfig,\n+ RouterManagedTag,\n+} from '@tanstack/router-core'\n+\n+function buildTagsFromMatches(\n+ router: AnyRouter,\n+ nonce: string | undefined,\n+ matches: Array,\n+ assetCrossOrigin?: AssetCrossOriginConfig,\n+): Array {\n+ const routeMeta = matches\n+ .map((match) => match.meta)\n+ .filter((meta) => meta !== undefined)\n+\n+ const resultMeta: Array = []\n+ const metaByAttribute: Record = {}\n+ let title: RouterManagedTag | undefined\n+ for (let i = routeMeta.length - 1; i >= 0; i--) {\n+ const metas = routeMeta[i]!\n+ for (let j = metas.length - 1; j >= 0; j--) {\n+ const meta = metas[j]\n+ if (!meta) {\n+ continue\n+ }\n+\n+ if ('title' in meta && typeof meta.title === 'string') {\n+ title ??= { tag: 'title', children: meta.title }\n+ } else if ('script:ld+json' in meta) {\n+ try {\n+ resultMeta.push({\n+ tag: 'script',\n+ attrs: { type: 'application/ld+json' },\n+ children: escapeHtml(JSON.stringify(meta['script:ld+json'])),\n+ })\n+ } catch {\n+ // Ignore values that cannot be serialized as JSON-LD.\n+ }\n+ } else {\n+ const attribute =\n+ ('name' in meta && typeof meta.name === 'string'\n+ ? meta.name\n+ : undefined) ??\n+ ('property' in meta && typeof meta.property === 'string'\n+ ? meta.property\n+ : undefined)\n+ if (attribute && metaByAttribute[attribute]) {\n+ continue\n+ }\n+ if (attribute) {\n+ metaByAttribute[attribute] = true\n+ }\n+ resultMeta.push({ tag: 'meta', attrs: { ...meta, nonce } })\n+ }\n+ }\n+ }\n+\n+ if (title) {\n+ resultMeta.push(title)\n+ }\n+ if (nonce) {\n+ resultMeta.push({\n+ tag: 'meta',\n+ attrs: { property: 'csp-nonce', content: nonce },\n+ })\n+ }\n+ resultMeta.reverse()\n+\n+ const links = matches\n+ .flatMap((match) => match.links ?? [])\n+ .filter((link) => link !== undefined)\n+ .map(\n+ (link) =>\n+ ({ tag: 'link', attrs: { ...link, nonce } }) satisfies RouterManagedTag,\n+ )\n+\n+ const manifestTags: Array = []\n+ const preloadTags: Array = []\n+ const manifest = router.ssr?.manifest\n+ if (manifest) {\n+ for (const match of matches) {\n+ for (const link of manifest.routes[match.routeId]?.css ?? []) {\n+ const resolvedLink = resolveManifestCssLink(link)\n+ manifestTags.push({\n+ tag: 'link',\n+ attrs: {\n+ rel: 'stylesheet',\n+ ...resolvedLink,\n+ crossOrigin:\n+ getAssetCrossOrigin(assetCrossOrigin, 'stylesheet') ??\n+ resolvedLink.crossOrigin,\n+ nonce,\n+ },\n+ })\n+ }\n+ for (const preload of manifest.routes[match.routeId]?.preloads ?? []) {\n+ preloadTags.push({\n+ tag: 'link',\n+ attrs: {\n+ ...getScriptPreloadAttrs(manifest, preload, assetCrossOrigin),\n+ nonce,\n+ },\n+ })\n+ }\n+ }\n+\n+ if (manifest.inlineStyle) {\n+ manifestTags.push({\n+ tag: 'style',\n+ attrs: { ...manifest.inlineStyle.attrs, nonce },\n+ children: manifest.inlineStyle.children,\n+ inlineCss: true,\n+ })\n+ }\n+ }\n+\n+ const styles = matches\n+ .flatMap((match) => match.styles ?? [])\n+ .filter((style) => style !== undefined)\n+ .map(\n+ ({ children, ...attrs }) =>\n+ ({\n+ tag: 'style',\n+ attrs: { ...attrs, nonce },\n+ children: children,\n+ }) satisfies RouterManagedTag,\n+ )\n+\n+ const headScripts = matches\n+ .flatMap((match) => match.headScripts ?? [])\n+ .filter((script) => script !== undefined)\n+ .map(\n+ ({ children, ...attrs }) =>\n+ ({\n+ tag: 'script',\n+ attrs: { ...attrs, nonce },\n+ children: children,\n+ }) satisfies RouterManagedTag,\n+ )\n+\n+ const tags: Array = []\n+ appendUniqueUserTags(tags, resultMeta)\n+ tags.push(...preloadTags)\n+ appendUniqueUserTags(tags, links)\n+ tags.push(...manifestTags)\n+ appendUniqueUserTags(tags, styles)\n+ appendUniqueUserTags(tags, headScripts)\n+ return tags\n+}\n+\n+export function useTags(...args: Array): Array {\n+ const [userArgs, slot] = splitSlot(args)\n+ const assetCrossOrigin = userArgs[0] as AssetCrossOriginConfig | undefined\n+ const router = useRouter()\n+ const nonce = router.options.ssr?.nonce\n+\n+ if (isServer ?? router.isServer) {\n+ return buildTagsFromMatches(\n+ router,\n+ nonce,\n+ router.stores.matches.get(),\n+ assetCrossOrigin,\n+ )\n+ }\n+\n+ return useStore(\n+ router.stores.matches,\n+ (matches: Array) =>\n+ buildTagsFromMatches(router, nonce, matches, assetCrossOrigin),\n+ deepEqual,\n+ subSlot(slot, 'head:tags'),\n+ )\n+}\ndiff --git a/packages/octane-router/src/history.ts b/packages/octane-router/src/history.ts\nnew file mode 100644\nindex 0000000000..bab3a32937\n--- /dev/null\n+++ b/packages/octane-router/src/history.ts\n@@ -0,0 +1,10 @@\n+// `@tanstack/history` is a separate framework-agnostic dependency (the browser/\n+// hash/memory history abstractions). react-router re-exports it from `./history`;\n+// we mirror that so `@tanstack/octane-router/history` and the bare entry both resolve it.\n+export {\n+ createHistory,\n+ createBrowserHistory,\n+ createHashHistory,\n+ createMemoryHistory,\n+} from '@tanstack/history'\n+export type * from '@tanstack/history'\ndiff --git a/packages/octane-router/src/hooks.ts b/packages/octane-router/src/hooks.ts\nnew file mode 100644\nindex 0000000000..15efd44cc6\n--- /dev/null\n+++ b/packages/octane-router/src/hooks.ts\n@@ -0,0 +1,720 @@\n+// The read hooks — ports of react-router's useMatch.tsx / useParams / useSearch /\n+// useLoaderData / useLoaderDeps / useRouteContext / useNavigate / useCanGoBack /\n+// Matches.tsx (useMatches / useParentMatches / useChildMatches). Everything match-\n+// shaped funnels through `useMatch`, which subscribes to ONE match store:\n+// - `from` given → `router.stores.getRouteMatchStore(from)` (a cached computed\n+// that resolves a routeId to its current match);\n+// - no `from` → the NEAREST match via `matchContext` (the match id the enclosing\n+// `` provided) — NOT the leaf match.\n+// A missing match throws unless `shouldThrow: false` (upstream invariant).\n+// Selectors run through `useStructuralSharing` (replaceEqualDeep against the\n+// previous selection when `structuralSharing ?? defaultStructuralSharing`).\n+import { useCallback, useContext, useRef } from 'octane'\n+import { replaceEqualDeep } from '@tanstack/router-core'\n+import { matchContext, useRouter } from './context'\n+import { useStore } from './useStore'\n+import { splitSlot, subSlot } from './internal'\n+import type {\n+ StructuralSharingOption,\n+ ValidateSelected,\n+} from './structuralSharing'\n+import type {\n+ AnyRouter,\n+ FromPathOption,\n+ MakeRouteMatch,\n+ MakeRouteMatchUnion,\n+ RegisteredRouter,\n+ ResolveUseLoaderData,\n+ ResolveUseLoaderDeps,\n+ ResolveUseParams,\n+ ResolveUseSearch,\n+ RouterState,\n+ StrictOrFrom,\n+ ThrowConstraint,\n+ ThrowOrOptional,\n+ UseLoaderDataResult,\n+ UseLoaderDepsResult,\n+ UseNavigateResult,\n+ UseParamsResult,\n+ UseRouteContextBaseOptions,\n+ UseRouteContextOptions,\n+ UseRouteContextResult,\n+ UseSearchResult,\n+} from '@tanstack/router-core'\n+\n+export interface UseMatchBaseOptions<\n+ TRouter extends AnyRouter,\n+ TFrom,\n+ TStrict extends boolean,\n+ TThrow extends boolean,\n+ TSelected,\n+ TStructuralSharing extends boolean,\n+> {\n+ select?: (\n+ match: MakeRouteMatch,\n+ ) => ValidateSelected\n+ shouldThrow?: TThrow\n+}\n+\n+export type UseMatchRoute = <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseMatchBaseOptions<\n+ TRouter,\n+ TFrom,\n+ true,\n+ true,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption,\n+) => UseMatchResult\n+\n+export type UseMatchOptions<\n+ TRouter extends AnyRouter,\n+ TFrom extends string | undefined,\n+ TStrict extends boolean,\n+ TThrow extends boolean,\n+ TSelected,\n+ TStructuralSharing extends boolean,\n+> = StrictOrFrom &\n+ UseMatchBaseOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ TThrow,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption\n+\n+export type UseMatchResult<\n+ TRouter extends AnyRouter,\n+ TFrom,\n+ TStrict extends boolean,\n+ TSelected,\n+> = unknown extends TSelected\n+ ? TStrict extends true\n+ ? MakeRouteMatch\n+ : MakeRouteMatchUnion\n+ : TSelected\n+\n+export interface UseParamsBaseOptions<\n+ TRouter extends AnyRouter,\n+ TFrom,\n+ TStrict extends boolean,\n+ TThrow extends boolean,\n+ TSelected,\n+ TStructuralSharing,\n+> {\n+ select?: (\n+ params: ResolveUseParams,\n+ ) => ValidateSelected\n+ shouldThrow?: TThrow\n+}\n+\n+export type UseParamsRoute = <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseParamsBaseOptions<\n+ TRouter,\n+ TFrom,\n+ true,\n+ true,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption,\n+) => UseParamsResult\n+\n+export type UseParamsOptions<\n+ TRouter extends AnyRouter,\n+ TFrom extends string | undefined,\n+ TStrict extends boolean,\n+ TThrow extends boolean,\n+ TSelected,\n+ TStructuralSharing,\n+> = StrictOrFrom &\n+ UseParamsBaseOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ TThrow,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption\n+\n+export interface UseSearchBaseOptions<\n+ TRouter extends AnyRouter,\n+ TFrom,\n+ TStrict extends boolean,\n+ TThrow extends boolean,\n+ TSelected,\n+ TStructuralSharing,\n+> {\n+ select?: (\n+ search: ResolveUseSearch,\n+ ) => ValidateSelected\n+ shouldThrow?: TThrow\n+}\n+\n+export type UseSearchRoute = <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseSearchBaseOptions<\n+ TRouter,\n+ TFrom,\n+ true,\n+ true,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption,\n+) => UseSearchResult\n+\n+export type UseSearchOptions<\n+ TRouter extends AnyRouter,\n+ TFrom,\n+ TStrict extends boolean,\n+ TThrow extends boolean,\n+ TSelected,\n+ TStructuralSharing,\n+> = StrictOrFrom &\n+ UseSearchBaseOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ TThrow,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption\n+\n+export interface UseLoaderDataBaseOptions<\n+ TRouter extends AnyRouter,\n+ TFrom,\n+ TStrict extends boolean,\n+ TSelected,\n+ TStructuralSharing,\n+> {\n+ select?: (\n+ data: ResolveUseLoaderData,\n+ ) => ValidateSelected\n+}\n+\n+export type UseLoaderDataRoute = <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseLoaderDataBaseOptions<\n+ TRouter,\n+ TFrom,\n+ true,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption,\n+) => UseLoaderDataResult\n+\n+export type UseLoaderDataOptions<\n+ TRouter extends AnyRouter,\n+ TFrom extends string | undefined,\n+ TStrict extends boolean,\n+ TSelected,\n+ TStructuralSharing,\n+> = StrictOrFrom &\n+ UseLoaderDataBaseOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption\n+\n+export interface UseLoaderDepsBaseOptions<\n+ TRouter extends AnyRouter,\n+ TFrom,\n+ TSelected,\n+ TStructuralSharing,\n+> {\n+ select?: (\n+ deps: ResolveUseLoaderDeps,\n+ ) => ValidateSelected\n+}\n+\n+export type UseLoaderDepsRoute = <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseLoaderDepsBaseOptions<\n+ TRouter,\n+ TFrom,\n+ TSelected,\n+ TStructuralSharing\n+ > &\n+ StructuralSharingOption,\n+) => UseLoaderDepsResult\n+\n+export type UseLoaderDepsOptions<\n+ TRouter extends AnyRouter,\n+ TFrom extends string | undefined,\n+ TSelected,\n+ TStructuralSharing,\n+> = StrictOrFrom &\n+ UseLoaderDepsBaseOptions &\n+ StructuralSharingOption\n+\n+export type UseRouteContextRoute = <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+>(\n+ opts?: UseRouteContextBaseOptions,\n+) => UseRouteContextResult\n+\n+export interface UseLocationBaseOptions<\n+ TRouter extends AnyRouter,\n+ TSelected,\n+ TStructuralSharing extends boolean = boolean,\n+> {\n+ select?: (\n+ location: RouterState['location'],\n+ ) => ValidateSelected\n+}\n+\n+export type UseLocationResult<\n+ TRouter extends AnyRouter,\n+ TSelected,\n+> = unknown extends TSelected\n+ ? RouterState['location']\n+ : TSelected\n+\n+export interface UseMatchesBaseOptions<\n+ TRouter extends AnyRouter,\n+ TSelected,\n+ TStructuralSharing,\n+> {\n+ select?: (\n+ matches: Array>,\n+ ) => ValidateSelected\n+}\n+\n+export type UseMatchesResult<\n+ TRouter extends AnyRouter,\n+ TSelected,\n+> = unknown extends TSelected ? Array> : TSelected\n+\n+// Sentinel store + selection for \"no match at this id\" (upstream's dummyStore).\n+const dummyStore = {\n+ get() {},\n+ subscribe() {\n+ return { unsubscribe() {} }\n+ },\n+}\n+\n+// Selector wrapper honoring structural sharing: when enabled, the selection is\n+// replaceEqualDeep'd against the previous one so deep-equal slices keep their\n+// reference (no re-render). Port of react-router's useStructuralSharing.\n+function useStructuralSharing(\n+ opts: any,\n+ router: any,\n+ slot: symbol | undefined,\n+) {\n+ const previousResult = useRef(undefined, subSlot(slot, 'ss'))\n+ return (slice: any) => {\n+ const selected = opts?.select ? opts.select(slice) : slice\n+ if (opts?.structuralSharing ?? router.options.defaultStructuralSharing) {\n+ return (previousResult.current = replaceEqualDeep(\n+ previousResult.current,\n+ selected,\n+ ))\n+ }\n+ return selected\n+ }\n+}\n+\n+export function useMatch<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string | undefined = undefined,\n+ TStrict extends boolean = true,\n+ TThrow extends boolean = true,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts: UseMatchOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ ThrowConstraint,\n+ TSelected,\n+ TStructuralSharing\n+ >,\n+): ThrowOrOptional, TThrow>\n+export function useMatch(...args: Array): any {\n+ return useMatchImpl(args)\n+}\n+\n+function useMatchImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ const router = useRouter()\n+ // octane has no rules of hooks, so the nearest-match context is read\n+ // unconditionally (upstream reads a dummy context when `from` is given).\n+ const nearestMatchId = useContext(matchContext)\n+ const matchStore = opts.from\n+ ? router.stores.getRouteMatchStore(opts.from)\n+ : router.stores.matchStores.get(nearestMatchId as string)\n+\n+ const selector = useStructuralSharing(opts, router, subSlot(slot, 'm'))\n+ const matchSelection = useStore(\n+ matchStore ?? dummyStore,\n+ (match: any) => (match ? selector(match) : dummyStore),\n+ undefined,\n+ subSlot(slot, 'm:us'),\n+ )\n+\n+ if (matchSelection !== dummyStore) {\n+ return matchSelection\n+ }\n+ if (opts.shouldThrow ?? true) {\n+ throw new Error(\n+ `Invariant failed: Could not find ${\n+ opts.from ? `an active match from \"${opts.from}\"` : 'a nearest match!'\n+ }`,\n+ )\n+ }\n+ return undefined\n+}\n+\n+export function useParams<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string | undefined = undefined,\n+ TStrict extends boolean = true,\n+ TThrow extends boolean = true,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts: UseParamsOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ ThrowConstraint,\n+ TSelected,\n+ TStructuralSharing\n+ >,\n+): ThrowOrOptional, TThrow>\n+export function useParams(...args: Array): any {\n+ return useParamsImpl(args)\n+}\n+\n+function useParamsImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return useMatchImpl([\n+ {\n+ from: opts.from,\n+ strict: opts.strict,\n+ shouldThrow: opts.shouldThrow,\n+ structuralSharing: opts.structuralSharing,\n+ select: (match: any) => {\n+ const params =\n+ opts.strict === false ? match.params : match._strictParams\n+ return opts.select ? opts.select(params) : params\n+ },\n+ },\n+ subSlot(slot, 'params'),\n+ ])\n+}\n+\n+export function useSearch<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string | undefined = undefined,\n+ TStrict extends boolean = true,\n+ TThrow extends boolean = true,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts: UseSearchOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ ThrowConstraint,\n+ TSelected,\n+ TStructuralSharing\n+ >,\n+): ThrowOrOptional, TThrow>\n+export function useSearch(...args: Array): any {\n+ return useSearchImpl(args)\n+}\n+\n+function useSearchImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return useMatchImpl([\n+ {\n+ from: opts.from,\n+ strict: opts.strict,\n+ shouldThrow: opts.shouldThrow,\n+ structuralSharing: opts.structuralSharing,\n+ select: (match: any) =>\n+ opts.select ? opts.select(match.search) : match.search,\n+ },\n+ subSlot(slot, 'search'),\n+ ])\n+}\n+\n+export function useLoaderData<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string | undefined = undefined,\n+ TStrict extends boolean = true,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts: UseLoaderDataOptions<\n+ TRouter,\n+ TFrom,\n+ TStrict,\n+ TSelected,\n+ TStructuralSharing\n+ >,\n+): UseLoaderDataResult\n+export function useLoaderData(...args: Array): any {\n+ return useLoaderDataImpl(args)\n+}\n+\n+function useLoaderDataImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return useMatchImpl([\n+ {\n+ from: opts.from,\n+ strict: opts.strict,\n+ structuralSharing: opts.structuralSharing,\n+ select: (match: any) =>\n+ opts.select ? opts.select(match.loaderData) : match.loaderData,\n+ },\n+ subSlot(slot, 'loader'),\n+ ])\n+}\n+\n+export function useLoaderDeps<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string | undefined = undefined,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts: UseLoaderDepsOptions,\n+): UseLoaderDepsResult\n+export function useLoaderDeps(...args: Array): any {\n+ return useLoaderDepsImpl(args)\n+}\n+\n+function useLoaderDepsImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ const { select, ...rest } = opts\n+ return useMatchImpl([\n+ {\n+ ...rest,\n+ select: (match: any) =>\n+ select ? select(match.loaderDeps) : match.loaderDeps,\n+ },\n+ subSlot(slot, 'deps'),\n+ ])\n+}\n+\n+export function useRouteContext<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string | undefined = undefined,\n+ TStrict extends boolean = true,\n+ TSelected = unknown,\n+>(\n+ opts: UseRouteContextOptions,\n+): UseRouteContextResult\n+export function useRouteContext(...args: Array): any {\n+ return useRouteContextImpl(args)\n+}\n+\n+function useRouteContextImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return useMatchImpl([\n+ {\n+ ...opts,\n+ select: (match: any) =>\n+ opts.select ? opts.select(match.context) : match.context,\n+ },\n+ subSlot(slot, 'ctx'),\n+ ])\n+}\n+\n+export function useLocation<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseLocationBaseOptions &\n+ StructuralSharingOption,\n+): UseLocationResult\n+export function useLocation(...args: Array): any {\n+ return useLocationImpl(args)\n+}\n+\n+function useLocationImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ const router = useRouter()\n+ return useStore(\n+ router.stores.location,\n+ useStructuralSharing(opts, router, subSlot(slot, 'loc')),\n+ undefined,\n+ subSlot(slot, 'loc:us'),\n+ )\n+}\n+\n+export function useMatches<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseMatchesBaseOptions &\n+ StructuralSharingOption,\n+): UseMatchesResult\n+export function useMatches(...args: Array): any {\n+ return useMatchesImpl(args)\n+}\n+\n+function useMatchesImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ const router = useRouter()\n+ return useStore(\n+ router.stores.matches,\n+ useStructuralSharing(opts, router, subSlot(slot, 'matches')),\n+ undefined,\n+ subSlot(slot, 'matches:us'),\n+ )\n+}\n+\n+export function useParentMatches<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseMatchesBaseOptions &\n+ StructuralSharingOption,\n+): UseMatchesResult\n+export function useParentMatches(...args: Array): any {\n+ return useParentMatchesImpl(args)\n+}\n+\n+function useParentMatchesImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ const contextMatchId = useContext(matchContext)\n+ return useMatchesImpl([\n+ {\n+ select: (matches: Array) => {\n+ matches = matches.slice(\n+ 0,\n+ matches.findIndex((d: any) => d.id === contextMatchId),\n+ )\n+ return opts.select ? opts.select(matches) : matches\n+ },\n+ structuralSharing: opts.structuralSharing,\n+ },\n+ subSlot(slot, 'parents'),\n+ ])\n+}\n+\n+export function useChildMatches<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TSelected = unknown,\n+ TStructuralSharing extends boolean = boolean,\n+>(\n+ opts?: UseMatchesBaseOptions &\n+ StructuralSharingOption,\n+): UseMatchesResult\n+export function useChildMatches(...args: Array): any {\n+ return useChildMatchesImpl(args)\n+}\n+\n+function useChildMatchesImpl(args: Array): any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ const contextMatchId = useContext(matchContext)\n+ return useMatchesImpl([\n+ {\n+ select: (matches: Array) => {\n+ matches = matches.slice(\n+ matches.findIndex((d: any) => d.id === contextMatchId) + 1,\n+ )\n+ return opts.select ? opts.select(matches) : matches\n+ },\n+ structuralSharing: opts.structuralSharing,\n+ },\n+ subSlot(slot, 'children'),\n+ ])\n+}\n+\n+// Returns a STABLE navigate function (upstream useCallback([from, router])) that\n+// forwards to `router.navigate`, defaulting `from` to the hook's option.\n+export function useNavigate<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TDefaultFrom extends string = string,\n+>(options?: {\n+ from?: FromPathOption\n+}): UseNavigateResult\n+export function useNavigate(...args: Array): (to: any) => any {\n+ return useNavigateImpl(args)\n+}\n+\n+function useNavigateImpl(args: Array): (to: any) => any {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ const router = useRouter(opts.router ? { router: opts.router } : undefined)\n+ return useCallback(\n+ (options: any) =>\n+ router.navigate({ ...options, from: options?.from ?? opts.from }),\n+ [opts.from, router],\n+ subSlot(slot, 'nav'),\n+ )\n+}\n+\n+// True when the current history entry isn't the first (there is somewhere to go\n+// back to) — per upstream useCanGoBack (location.state.__TSR_index !== 0).\n+export function useCanGoBack(): boolean\n+export function useCanGoBack(...args: Array): boolean {\n+ const [, slot] = splitSlot(args)\n+ const router = useRouter()\n+ return useStore(\n+ router.stores.location,\n+ (location: any) => location.state.__TSR_index !== 0,\n+ undefined,\n+ subSlot(slot, 'back'),\n+ )\n+}\n+\n+/** @internal Framework primitives use explicit Octane hook slots. */\n+export const internalHooks = {\n+ useMatch: (...args: Array) => useMatchImpl(args),\n+ useParams: (...args: Array) => useParamsImpl(args),\n+ useSearch: (...args: Array) => useSearchImpl(args),\n+ useLoaderData: (...args: Array) => useLoaderDataImpl(args),\n+ useLoaderDeps: (...args: Array) => useLoaderDepsImpl(args),\n+ useRouteContext: (...args: Array) => useRouteContextImpl(args),\n+ useLocation: (...args: Array) => useLocationImpl(args),\n+ useMatches: (...args: Array) => useMatchesImpl(args),\n+ useParentMatches: (...args: Array) => useParentMatchesImpl(args),\n+ useChildMatches: (...args: Array) => useChildMatchesImpl(args),\n+ useNavigate: (...args: Array) => useNavigateImpl(args),\n+}\ndiff --git a/packages/octane-router/src/index.ts b/packages/octane-router/src/index.ts\nnew file mode 100644\nindex 0000000000..c6f54625ce\n--- /dev/null\n+++ b/packages/octane-router/src/index.ts\n@@ -0,0 +1,192 @@\n+// @tanstack/octane-router — TanStack Router for the Octane renderer.\n+//\n+// TanStack Router splits a framework-agnostic core (`@tanstack/router-core`: the\n+// Router/route-tree/matching/history/reactive-store) from a thin React binding\n+// (`@tanstack/react-router`). This package re-exports the core verbatim and\n+// implements the framework binding on Octane's hooks. The\n+// load-bearing seam is router-core's reactive store: `createRouter` supplies the\n+// CLIENT store factory (`createAtom`/`batch` from `@tanstack/store`), whose atoms\n+// expose `.subscribe`/`.get` — bound to octane's `useSyncExternalStore` by\n+// `useStore`. The match tree renders pull-based: `RouterProvider` → first match →\n+// each route's `` looks up the NEXT match via `matchContext`.\n+//\n+// Scope: code- and file-based routing at framework parity — RouterProvider (+\n+// RouterContextProvider/Wrap/InnerWrap), the full Match pipeline (Suspense /\n+// CatchBoundary / CatchNotFound per route, pending/error/redirect statuses,\n+// remountDeps, shellComponent), the router event lifecycle\n+// (onLoad/onBeforeRouteMount/onResolved/onRendered + resolvedLocation — scroll\n+// restoration restores off it), Link with preloading/masking/active-options,\n+// createLink/useLinkProps, navigation blocking (useBlocker/Block), the full\n+// read-hook set (useMatch and friends, nearest-match resolution via\n+// matchContext), Route/getRouteApi hook accessors, Await/useAwaited, lazy\n+// routes, search validation/middleware from core, generator integration, and\n+// Start-compatible SSR/head/script entries. Devtools remain separate.\n+import './frameworkTypes'\n+\n+export * from '@tanstack/router-core'\n+export type {\n+ AsyncRouteComponent,\n+ DefaultRouteTypes,\n+ ErrorRouteComponent,\n+ NotFoundRouteComponent,\n+ RouteComponent,\n+ RouteTypes,\n+} from './frameworkTypes'\n+export {\n+ createHistory,\n+ createBrowserHistory,\n+ createHashHistory,\n+ createMemoryHistory,\n+} from './history'\n+// History types on the main entry (upstream parity). `NavigateOptions` is NOT\n+// re-exported from history — router-core's richer NavigateOptions wins.\n+export type {\n+ RouterHistory,\n+ HistoryLocation,\n+ ParsedPath,\n+ HistoryState,\n+ ParsedHistoryState,\n+ HistoryAction,\n+ BlockerFnArgs,\n+ BlockerFn,\n+ NavigationBlocker,\n+} from '@tanstack/history'\n+\n+export { createRouter, Router } from './router'\n+export {\n+ createRoute,\n+ createRootRoute,\n+ createRootRouteWithContext,\n+ rootRouteWithContext,\n+ createRouteMask,\n+ getRouteApi,\n+ Route,\n+ RootRoute,\n+ RouteApi,\n+ NotFoundRoute,\n+} from './route'\n+export type { AnyRootRoute } from './route'\n+export {\n+ FileRoute,\n+ createFileRoute,\n+ FileRouteLoader,\n+ LazyRoute,\n+ createLazyRoute,\n+ createLazyFileRoute,\n+} from './fileRoute'\n+export {\n+ routerContext,\n+ getRouterContext,\n+ matchContext,\n+ useRouter,\n+} from './context'\n+export { useStore } from './useStore'\n+export { useRouterState } from './useRouterState'\n+export type {\n+ UseRouterStateOptions,\n+ UseRouterStateResult,\n+} from './useRouterState'\n+export {\n+ useMatch,\n+ useLocation,\n+ useParams,\n+ useSearch,\n+ useLoaderData,\n+ useLoaderDeps,\n+ useRouteContext,\n+ useMatches,\n+ useParentMatches,\n+ useChildMatches,\n+ useNavigate,\n+ useCanGoBack,\n+} from './hooks'\n+export type {\n+ UseLoaderDataBaseOptions,\n+ UseLoaderDataOptions,\n+ UseLoaderDataRoute,\n+ UseLoaderDepsBaseOptions,\n+ UseLoaderDepsOptions,\n+ UseLoaderDepsRoute,\n+ UseLocationBaseOptions,\n+ UseLocationResult,\n+ UseMatchBaseOptions,\n+ UseMatchOptions,\n+ UseMatchResult,\n+ UseMatchRoute,\n+ UseMatchesBaseOptions,\n+ UseMatchesResult,\n+ UseParamsBaseOptions,\n+ UseParamsOptions,\n+ UseParamsRoute,\n+ UseRouteContextRoute,\n+ UseSearchBaseOptions,\n+ UseSearchOptions,\n+ UseSearchRoute,\n+} from './hooks'\n+export { useAwaited } from './useAwaited'\n+export type { AwaitOptions } from './useAwaited'\n+export { useLinkProps, createLink, linkOptions } from './link'\n+export type {\n+ ActiveLinkOptionProps,\n+ ActiveLinkOptions,\n+ CreateLinkProps,\n+ LinkComponent,\n+ LinkComponentProps,\n+ LinkComponentRoute,\n+ LinkOptionsFn,\n+ LinkOptionsFnOptions,\n+ LinkProps,\n+ LinkPropsChildren,\n+ OctaneAnchorProps,\n+ OctaneRenderable,\n+ UseLinkPropsOptions,\n+} from './link'\n+export { useBlocker, Block } from './useBlocker.tsrx'\n+export type {\n+ BlockerResolver,\n+ ShouldBlockFn,\n+ ShouldBlockFnArgs,\n+ UseBlockerOpts,\n+} from './useBlocker.tsrx'\n+export { useMatchRoute, MatchRoute } from './MatchRoute.tsrx'\n+export type {\n+ MakeMatchRouteOptions,\n+ MatchRouteFn,\n+ UseMatchRouteOptions,\n+} from './MatchRoute.tsrx'\n+export { useElementScrollRestoration } from './useElementScrollRestoration'\n+export { lazyRouteComponent } from './lazyRouteComponent'\n+\n+export { RouterProvider, RouterContextProvider } from './RouterProvider.tsrx'\n+export type { RouterProps } from './RouterProvider.tsrx'\n+export { Outlet } from './Outlet.tsrx'\n+export { Link } from './Link.tsrx'\n+export { Navigate } from './Navigate.tsrx'\n+export { Await } from './Await.tsrx'\n+export { ScrollRestoration } from './ScrollRestoration.tsrx'\n+export { Matches } from './Matches.tsrx'\n+export { Match } from './Match.tsrx'\n+export { CatchBoundary, ErrorComponent } from './CatchBoundary.tsrx'\n+export { CatchNotFound, DefaultGlobalNotFound } from './not-found.tsrx'\n+export { ClientOnly, useHydrated } from './ClientOnly.tsrx'\n+export { HeadContent } from './HeadContent.tsrx'\n+export type { HeadContentProps } from './HeadContent.tsrx'\n+export { Scripts } from './Scripts.tsrx'\n+export { ScriptOnce } from './ScriptOnce.tsrx'\n+export { Asset } from './Asset.tsrx'\n+export type { AssetProps } from './Asset.tsrx'\n+export { useTags } from './headContentUtils'\n+export { Html } from './Html'\n+export type { HtmlProps } from './Html'\n+export { Head } from './Head'\n+export type { HeadProps } from './Head'\n+export { Body } from './Body'\n+export type { BodyProps } from './Body'\n+\n+export type {\n+ InferStructuralSharing,\n+ ValidateLinkOptions,\n+ ValidateLinkOptionsArray,\n+ ValidateUseParamsOptions,\n+ ValidateUseSearchOptions,\n+} from './typePrimitives'\ndiff --git a/packages/octane-router/src/internal.ts b/packages/octane-router/src/internal.ts\nnew file mode 100644\nindex 0000000000..e1443a011a\n--- /dev/null\n+++ b/packages/octane-router/src/internal.ts\n@@ -0,0 +1,40 @@\n+// Slot mechanics shared by the binding's plain-`.ts` hooks (copied from\n+// Octane's TanStack bindings). The Octane compiler injects a per-call-site Symbol slot into\n+// every hook call in `.tsrx`/`.tsx`, but these binding files are NOT compiled — so\n+// a hook here receives the caller's slot as its trailing argument and derives a\n+// distinct sub-slot for each base hook it composes.\n+\n+// Derive a stable, distinct sub-slot from a wrapper's slot, namespaced per hook so\n+// composing multiple base hooks gives each its own identity.\n+// Memoized: subSlot runs on EVERY hook call every render, and the naive form\n+// pays a string concat + global symbol-registry lookup each time. The cache is\n+// keyed by the slot symbol itself; the minted value is byte-identical to the\n+// uncached Symbol.for result, so identity is preserved across HMR re-evals and\n+// the per-package copies of this helper. Key universe is bounded: slots are\n+// per-call-site module constants (never minted per render).\n+const subSlotCache = new Map>()\n+export function subSlot(\n+ slot: symbol | undefined,\n+ tag: string,\n+): symbol | undefined {\n+ if (slot === undefined) {\n+ return undefined\n+ }\n+ let byTag = subSlotCache.get(slot)\n+ if (byTag === undefined) {\n+ subSlotCache.set(slot, (byTag = new Map()))\n+ }\n+ let sym = byTag.get(tag)\n+ if (sym === undefined) {\n+ byTag.set(tag, (sym = Symbol.for((slot.description ?? '') + ':' + tag)))\n+ }\n+ return sym\n+}\n+\n+// Split the compiler-injected (or .ts-forwarded) trailing slot off a hook's args,\n+// returning the user args (everything before it) and the slot.\n+export function splitSlot(args: Array): [Array, symbol | undefined] {\n+ const tail = args[args.length - 1]\n+ const slot = typeof tail === 'symbol' ? tail : undefined\n+ return [slot !== undefined ? args.slice(0, -1) : args, slot]\n+}\ndiff --git a/packages/octane-router/src/lazyRouteComponent.ts b/packages/octane-router/src/lazyRouteComponent.ts\nnew file mode 100644\nindex 0000000000..0634ca5d97\n--- /dev/null\n+++ b/packages/octane-router/src/lazyRouteComponent.ts\n@@ -0,0 +1,74 @@\n+// Code-split a route's component: wrap a dynamic import as a component that suspends\n+// (via octane's `use`) until the module loads, then renders it. Carries `.preload()`\n+// for hover/intent preloading, and reloads the page once on a stale-chunk\n+// module-not-found error (the same recovery react-router does).\n+//\n+// createRoute({ path: 'item/$id', component: lazyRouteComponent(() => import('./Item')) })\n+import { createElement, use } from 'octane'\n+import { isModuleNotFoundError } from '@tanstack/router-core'\n+import { toExternalHydrationThenable } from './externalHydration'\n+import type { ComponentBody } from 'octane'\n+import type { AsyncRouteComponent } from './frameworkTypes'\n+\n+export function lazyRouteComponent<\n+ T extends Record,\n+ TKey extends keyof T = 'default',\n+>(\n+ importer: () => Promise,\n+ exportName?: TKey,\n+): T[TKey] extends ComponentBody\n+ ? AsyncRouteComponent\n+ : never\n+export function lazyRouteComponent(\n+ importer: () => Promise,\n+ exportName?: string,\n+): AsyncRouteComponent> {\n+ let loadPromise: Promise | undefined\n+ let comp: ComponentBody> | undefined\n+ let error: unknown\n+ let reload = false\n+\n+ const load = () => {\n+ if (!loadPromise) {\n+ loadPromise = importer()\n+ .then((res) => {\n+ loadPromise = undefined\n+ comp = res[exportName ?? 'default'] as ComponentBody<\n+ Record\n+ >\n+ })\n+ .catch((err) => {\n+ error = err\n+ if (\n+ isModuleNotFoundError(error) &&\n+ error instanceof Error &&\n+ typeof window !== 'undefined' &&\n+ typeof sessionStorage !== 'undefined'\n+ ) {\n+ const key = `tanstack_router_reload:${error.message}`\n+ if (!sessionStorage.getItem(key)) {\n+ sessionStorage.setItem(key, '1')\n+ reload = true\n+ }\n+ }\n+ })\n+ }\n+ return loadPromise\n+ }\n+\n+ const Lazy: AsyncRouteComponent> = (props) => {\n+ if (reload) {\n+ window.location.reload()\n+ throw new Promise(() => {})\n+ }\n+ if (error) {\n+ throw error\n+ }\n+ if (!comp) {\n+ use(toExternalHydrationThenable(load()))\n+ }\n+ return createElement(comp!, props)\n+ }\n+ Lazy.preload = load\n+ return Lazy\n+}\ndiff --git a/packages/octane-router/src/link.ts b/packages/octane-router/src/link.ts\nnew file mode 100644\nindex 0000000000..7acb5de520\n--- /dev/null\n+++ b/packages/octane-router/src/link.ts\n@@ -0,0 +1,640 @@\n+// useLinkProps / createLink / linkOptions — port of react-router's link.tsx\n+// (client path; SSR link rendering arrives with the SSR entries). All of Link's\n+// behavior lives here so both `` and custom `createLink` components share\n+// it: href building (mask-aware via publicHref), external-URL detection with\n+// dangerous-protocol blocking, active-state detection (exactPathTest /\n+// trailing-slash-aware fuzzy prefix + deepEqual partial search match),\n+// preloading ('intent' with delay + touchstart/focus, 'viewport' via\n+// IntersectionObserver, 'render' once on mount), the click handler (navigate\n+// with replace/resetScroll/hashScrollIntoView/viewTransition/startTransition/\n+// ignoreBlocker forwarded), and data-status/data-transitioning reflection.\n+import {\n+ createElement,\n+ flushSync,\n+ useCallback,\n+ useEffect,\n+ useRef,\n+ useState,\n+} from 'octane'\n+import {\n+ deepEqual,\n+ exactPathTest,\n+ functionalUpdate,\n+ isDangerousProtocol,\n+ preloadWarning,\n+ removeTrailingSlash,\n+} from '@tanstack/router-core'\n+import { useRouter } from './context'\n+import { useStore } from './useStore'\n+import { splitSlot, subSlot } from './internal'\n+import { Link } from './Link.tsrx'\n+import type { ComponentBody, ElementDescriptor } from 'octane'\n+import type {\n+ AnyRouter,\n+ LinkOptions,\n+ RegisteredRouter,\n+ RoutePaths,\n+} from '@tanstack/router-core'\n+import type {\n+ ValidateLinkOptions,\n+ ValidateLinkOptionsArray,\n+} from './typePrimitives'\n+\n+export interface OctaneAnchorProps {\n+ children?: OctaneRenderable\n+ class?: unknown\n+ className?: string\n+ style?: unknown\n+ href?: string\n+ target?: string\n+ disabled?: boolean\n+ ref?: unknown\n+ onClick?: (event: MouseEvent) => void\n+ onBlur?: (event: FocusEvent) => void\n+ onFocus?: (event: FocusEvent) => void\n+ onMouseEnter?: (event: MouseEvent) => void\n+ onMouseLeave?: (event: MouseEvent) => void\n+ onTouchStart?: (event: TouchEvent) => void\n+ [key: string]: unknown\n+}\n+\n+export type OctaneRenderable =\n+ | ElementDescriptor\n+ | string\n+ | number\n+ | bigint\n+ | boolean\n+ | null\n+ | undefined\n+ | ReadonlyArray\n+\n+type OctaneComponentProps = TComp extends 'a'\n+ ? OctaneAnchorProps\n+ : TComp extends ComponentBody\n+ ? TProps\n+ : Record\n+\n+export type UseLinkPropsOptions<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TFrom extends RoutePaths | string = string,\n+ TTo extends string | undefined = '.',\n+ TMaskFrom extends RoutePaths | string = TFrom,\n+ TMaskTo extends string = '.',\n+> = ActiveLinkOptions<'a', TRouter, TFrom, TTo, TMaskFrom, TMaskTo> &\n+ OctaneAnchorProps\n+\n+export type ActiveLinkOptions<\n+ TComp = 'a',\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TFrom extends string = string,\n+ TTo extends string | undefined = '.',\n+ TMaskFrom extends string = TFrom,\n+ TMaskTo extends string = '.',\n+> = LinkOptions &\n+ ActiveLinkOptionProps\n+\n+type ActiveLinkProps = Partial<\n+ OctaneComponentProps & {\n+ [key: `data-${string}`]: unknown\n+ }\n+>\n+\n+export interface ActiveLinkOptionProps {\n+ activeProps?: ActiveLinkProps | (() => ActiveLinkProps)\n+ inactiveProps?: ActiveLinkProps | (() => ActiveLinkProps)\n+}\n+\n+export type LinkProps<\n+ TComp = 'a',\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TFrom extends string = string,\n+ TTo extends string | undefined = '.',\n+ TMaskFrom extends string = TFrom,\n+ TMaskTo extends string = '.',\n+> = ActiveLinkOptions &\n+ LinkPropsChildren\n+\n+export interface LinkPropsChildren {\n+ children?:\n+ | OctaneRenderable\n+ | ((state: { isActive: boolean; isTransitioning: boolean }) => unknown)\n+}\n+\n+export type CreateLinkProps = LinkProps<\n+ unknown,\n+ AnyRouter,\n+ string,\n+ string,\n+ string,\n+ string\n+>\n+\n+export type LinkComponentProps<\n+ TComp = 'a',\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ TFrom extends string = string,\n+ TTo extends string | undefined = '.',\n+ TMaskFrom extends string = TFrom,\n+ TMaskTo extends string = '.',\n+> = Omit, keyof CreateLinkProps> &\n+ LinkProps\n+\n+export type LinkComponent<\n+ in out TComp,\n+ in out TDefaultFrom extends string = string,\n+> = <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string = TDefaultFrom,\n+ const TTo extends string | undefined = undefined,\n+ const TMaskFrom extends string = TFrom,\n+ const TMaskTo extends string = '',\n+>(\n+ props: LinkComponentProps,\n+) => void\n+\n+export interface LinkComponentRoute<\n+ in out TDefaultFrom extends string = string,\n+> {\n+ defaultFrom: TDefaultFrom;\n+ <\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TTo extends string | undefined = undefined,\n+ const TMaskTo extends string = '',\n+ >(\n+ props: LinkComponentProps<\n+ 'a',\n+ TRouter,\n+ this['defaultFrom'],\n+ TTo,\n+ this['defaultFrom'],\n+ TMaskTo\n+ >,\n+ ): void\n+}\n+\n+const STATIC_EMPTY_OBJECT = {}\n+const STATIC_ACTIVE_OBJECT = { class: 'active' }\n+const STATIC_DISABLED_PROPS = { role: 'link', 'aria-disabled': true }\n+const STATIC_ACTIVE_PROPS = { 'data-status': 'active', 'aria-current': 'page' }\n+const STATIC_TRANSITIONING_PROPS = { 'data-transitioning': 'transitioning' }\n+\n+const timeoutMap = new WeakMap>()\n+\n+const composeHandlers =\n+ (handlers: Array void)>) => (e: Event) => {\n+ for (const handler of handlers) {\n+ if (!handler) {\n+ continue\n+ }\n+ if (e.defaultPrevented) {\n+ return\n+ }\n+ handler(e)\n+ }\n+ }\n+\n+function getHrefOption(\n+ publicHref: string,\n+ external: boolean,\n+ history: any,\n+ disabled: boolean | undefined,\n+): { href: string; external: boolean } | undefined {\n+ if (disabled) {\n+ return undefined\n+ }\n+ // Full URL means a rewrite changed the origin — treat as external-like.\n+ if (external) {\n+ return { href: publicHref, external: true }\n+ }\n+ return { href: history.createHref(publicHref) || '/', external: false }\n+}\n+\n+function isSafeInternal(to: unknown): boolean {\n+ if (typeof to !== 'string') {\n+ return false\n+ }\n+ const zero = to.charCodeAt(0)\n+ if (zero === 47) {\n+ return to.charCodeAt(1) !== 47 // '/' but not '//'\n+ }\n+ return zero === 46 // '.', '..', './', '../'\n+}\n+\n+function isCtrlEvent(e: MouseEvent): boolean {\n+ return !!(e.metaKey || e.altKey || e.ctrlKey || e.shiftKey)\n+}\n+\n+// Merge base/active/inactive styles. Objects merge like upstream; if any is a\n+// string the parts join with ';' (octane host styles accept both forms).\n+function mergeStyles(base: any, active: any, inactive: any): any {\n+ if (!base && !active && !inactive) {\n+ return undefined\n+ }\n+ const parts = [base, active, inactive].filter(Boolean)\n+ if (parts.length === 1) {\n+ return parts[0]\n+ }\n+ if (parts.some((p) => typeof p === 'string')) {\n+ return parts\n+ .map((p) =>\n+ typeof p === 'string'\n+ ? p.replace(/;\\s*$/, '')\n+ : Object.entries(p)\n+ .map(\n+ ([k, v]) =>\n+ `${k.replace(/[A-Z]/g, (c) => '-' + c.toLowerCase())}:${v}`,\n+ )\n+ .join(';'),\n+ )\n+ .join(';')\n+ }\n+ return Object.assign({}, ...parts)\n+}\n+\n+export function useLinkProps<\n+ TRouter extends AnyRouter = RegisteredRouter,\n+ const TFrom extends string = string,\n+ const TTo extends string | undefined = undefined,\n+ const TMaskFrom extends string = TFrom,\n+ const TMaskTo extends string = '',\n+>(\n+ options: UseLinkPropsOptions,\n+): OctaneAnchorProps\n+export function useLinkProps(...args: Array): Record {\n+ const [user, slot] = splitSlot(args)\n+ const options = (user[0] ?? {}) as Record\n+ const router = useRouter()\n+\n+ const {\n+ // custom props\n+ activeProps,\n+ inactiveProps,\n+ activeOptions,\n+ to,\n+ preload: userPreload,\n+ preloadDelay: userPreloadDelay,\n+ preloadIntentProximity: _preloadIntentProximity,\n+ hashScrollIntoView,\n+ replace,\n+ startTransition,\n+ resetScroll,\n+ viewTransition,\n+ // element props\n+ children: _children,\n+ target,\n+ disabled,\n+ style,\n+ class: klass,\n+ className,\n+ onClick,\n+ onBlur,\n+ onFocus,\n+ onMouseEnter,\n+ onMouseLeave,\n+ onTouchStart,\n+ ignoreBlocker,\n+ ref: userRef,\n+ // consumed by buildLocation — not spread onto the element\n+ params: _params,\n+ search: _search,\n+ hash: _hash,\n+ state: _state,\n+ mask: _mask,\n+ reloadDocument: _reloadDocument,\n+ unsafeRelative: _unsafeRelative,\n+ from: _from,\n+ _fromLocation,\n+ ...propsSafeToSpread\n+ } = options\n+\n+ // Subscribe to the location (by href) — active state re-derives per commit.\n+ const currentLocation: any = useStore(\n+ router.stores.location,\n+ (l: any) => l,\n+ (prev: any, next: any) => prev.href === next.href,\n+ subSlot(slot, 'lp:loc'),\n+ )\n+\n+ const next = router.buildLocation({\n+ _fromLocation: currentLocation,\n+ ...options,\n+ } as any)\n+\n+ const hrefOptionPublicHref = next.maskedLocation\n+ ? next.maskedLocation.publicHref\n+ : next.publicHref\n+ const hrefOptionExternal = next.maskedLocation\n+ ? next.maskedLocation.external\n+ : next.external\n+ const hrefOption = getHrefOption(\n+ hrefOptionPublicHref,\n+ hrefOptionExternal,\n+ router.history,\n+ disabled,\n+ )\n+\n+ // External URL detection + dangerous-protocol blocking (javascript:, data:…).\n+ const externalLink = (() => {\n+ if (hrefOption?.external) {\n+ if (isDangerousProtocol(hrefOption.href, router.protocolAllowlist)) {\n+ return undefined\n+ }\n+ return hrefOption.href\n+ }\n+ if (isSafeInternal(to)) {\n+ return undefined\n+ }\n+ if (typeof to !== 'string' || to.indexOf(':') === -1) {\n+ return undefined\n+ }\n+ try {\n+ new URL(to)\n+ if (isDangerousProtocol(to, router.protocolAllowlist)) {\n+ return undefined\n+ }\n+ return to\n+ } catch {\n+ /* not an absolute URL */\n+ }\n+ return undefined\n+ })()\n+\n+ const isActive = (() => {\n+ if (externalLink) {\n+ return false\n+ }\n+ if (activeOptions?.exact) {\n+ if (\n+ !exactPathTest(currentLocation.pathname, next.pathname, router.basepath)\n+ ) {\n+ return false\n+ }\n+ } else {\n+ const currentPathSplit = removeTrailingSlash(\n+ currentLocation.pathname,\n+ router.basepath,\n+ )\n+ const nextPathSplit = removeTrailingSlash(next.pathname, router.basepath)\n+ const pathIsFuzzyEqual =\n+ currentPathSplit.startsWith(nextPathSplit) &&\n+ (currentPathSplit.length === nextPathSplit.length ||\n+ currentPathSplit[nextPathSplit.length] === '/')\n+ if (!pathIsFuzzyEqual) {\n+ return false\n+ }\n+ }\n+ if (activeOptions?.includeSearch ?? true) {\n+ const searchTest = deepEqual(currentLocation.search, next.search, {\n+ partial: !activeOptions?.exact,\n+ ignoreUndefined: !activeOptions?.explicitUndefined,\n+ })\n+ if (!searchTest) {\n+ return false\n+ }\n+ }\n+ if (activeOptions?.includeHash) {\n+ return currentLocation.hash === next.hash\n+ }\n+ return true\n+ })()\n+\n+ const resolvedActiveProps: Record = isActive\n+ ? (functionalUpdate(activeProps, {}) ?? STATIC_ACTIVE_OBJECT)\n+ : STATIC_EMPTY_OBJECT\n+ const resolvedInactiveProps: Record = isActive\n+ ? STATIC_EMPTY_OBJECT\n+ : (functionalUpdate(inactiveProps, {}) ?? STATIC_EMPTY_OBJECT)\n+\n+ // Class composes clsx-style (octane normalizeClass folds arrays + falsy).\n+ const resolvedClass = [\n+ klass ?? className,\n+ resolvedActiveProps.class ?? resolvedActiveProps.className,\n+ resolvedInactiveProps.class ?? resolvedInactiveProps.className,\n+ ].filter(Boolean)\n+ const resolvedStyle = mergeStyles(\n+ style,\n+ resolvedActiveProps.style,\n+ resolvedInactiveProps.style,\n+ )\n+\n+ const [isTransitioning, setIsTransitioning] = useState(\n+ false,\n+ subSlot(slot, 'lp:t'),\n+ )\n+ const hasRenderFetched = useRef(false, subSlot(slot, 'lp:rf'))\n+ const elRef = useRef(null, subSlot(slot, 'lp:el'))\n+\n+ const preload =\n+ options.reloadDocument || externalLink\n+ ? false\n+ : (userPreload ?? router.options.defaultPreload)\n+ const preloadDelay =\n+ userPreloadDelay ?? router.options.defaultPreloadDelay ?? 0\n+\n+ const doPreload = useCallback(\n+ () => {\n+ router\n+ .preloadRoute({ ...options, _builtLocation: next } as any)\n+ .catch((err: unknown) => {\n+ console.warn(err)\n+ console.warn(preloadWarning)\n+ })\n+ },\n+ [router, next.href],\n+ subSlot(slot, 'lp:dp'),\n+ )\n+\n+ // preload=\"viewport\": preload when the anchor scrolls into view (100px margin).\n+ useEffect(\n+ () => {\n+ if (disabled || preload !== 'viewport') {\n+ return\n+ }\n+ const el = elRef.current\n+ if (!el || typeof IntersectionObserver === 'undefined') {\n+ return\n+ }\n+ const io = new IntersectionObserver(\n+ (entries) => {\n+ for (const entry of entries) {\n+ if (entry.isIntersecting) {\n+ doPreload()\n+ }\n+ }\n+ },\n+ { rootMargin: '100px' },\n+ )\n+ io.observe(el)\n+ return () => io.disconnect()\n+ },\n+ [disabled, preload, doPreload],\n+ subSlot(slot, 'lp:io'),\n+ )\n+\n+ // preload=\"render\": preload once on mount.\n+ useEffect(\n+ () => {\n+ if (hasRenderFetched.current) {\n+ return\n+ }\n+ if (!disabled && preload === 'render') {\n+ doPreload()\n+ hasRenderFetched.current = true\n+ }\n+ },\n+ [disabled, doPreload, preload],\n+ subSlot(slot, 'lp:pr'),\n+ )\n+\n+ const handleClick = (e: MouseEvent) => {\n+ const elementTarget = (e.currentTarget as Element | null)?.getAttribute?.(\n+ 'target',\n+ )\n+ const effectiveTarget = target !== undefined ? target : elementTarget\n+ if (\n+ !disabled &&\n+ !isCtrlEvent(e) &&\n+ !e.defaultPrevented &&\n+ (!effectiveTarget || effectiveTarget === '_self') &&\n+ e.button === 0\n+ ) {\n+ e.preventDefault()\n+\n+ flushSync(() => {\n+ setIsTransitioning(true)\n+ })\n+ const unsub = router.subscribe('onResolved', () => {\n+ unsub()\n+ setIsTransitioning(false)\n+ })\n+\n+ router.navigate({\n+ ...options,\n+ replace,\n+ resetScroll,\n+ hashScrollIntoView,\n+ startTransition,\n+ viewTransition,\n+ ignoreBlocker,\n+ })\n+ }\n+ }\n+\n+ const captureRef = (el: Element | null) => {\n+ elRef.current = el\n+ }\n+ const composedRef = userRef ? [captureRef, userRef] : captureRef\n+\n+ if (externalLink) {\n+ return {\n+ ...propsSafeToSpread,\n+ ref: composedRef,\n+ href: externalLink,\n+ ...(target !== undefined && { target }),\n+ ...(disabled !== undefined && { disabled }),\n+ ...(resolvedStyle !== undefined && { style: resolvedStyle }),\n+ ...(resolvedClass.length > 0 && { class: resolvedClass }),\n+ ...(onClick && { onClick }),\n+ ...(onBlur && { onBlur }),\n+ ...(onFocus && { onFocus }),\n+ ...(onMouseEnter && { onMouseEnter }),\n+ ...(onMouseLeave && { onMouseLeave }),\n+ ...(onTouchStart && { onTouchStart }),\n+ }\n+ }\n+\n+ const enqueueIntentPreload = (e: MouseEvent | FocusEvent) => {\n+ if (disabled || preload !== 'intent') {\n+ return\n+ }\n+ if (!preloadDelay) {\n+ doPreload()\n+ return\n+ }\n+ const eventTarget = e.currentTarget as EventTarget\n+ if (timeoutMap.has(eventTarget)) {\n+ return\n+ }\n+ const id = setTimeout(() => {\n+ timeoutMap.delete(eventTarget)\n+ doPreload()\n+ }, preloadDelay)\n+ timeoutMap.set(eventTarget, id)\n+ }\n+\n+ const handleTouchStart = () => {\n+ if (disabled || preload !== 'intent') {\n+ return\n+ }\n+ doPreload()\n+ }\n+\n+ const handleLeave = (e: MouseEvent | FocusEvent) => {\n+ if (disabled || !preload || !preloadDelay) {\n+ return\n+ }\n+ const eventTarget = e.currentTarget as EventTarget\n+ const id = timeoutMap.get(eventTarget)\n+ if (id) {\n+ clearTimeout(id)\n+ timeoutMap.delete(eventTarget)\n+ }\n+ }\n+\n+ return {\n+ ...propsSafeToSpread,\n+ ...resolvedActiveProps,\n+ ...resolvedInactiveProps,\n+ href: hrefOption?.href,\n+ ref: composedRef,\n+ onClick: composeHandlers([onClick, handleClick]),\n+ onBlur: composeHandlers([onBlur, handleLeave]),\n+ onFocus: composeHandlers([onFocus, enqueueIntentPreload]),\n+ onMouseEnter: composeHandlers([onMouseEnter, enqueueIntentPreload]),\n+ onMouseLeave: composeHandlers([onMouseLeave, handleLeave]),\n+ onTouchStart: composeHandlers([onTouchStart, handleTouchStart]),\n+ disabled: !!disabled,\n+ ...(target !== undefined && { target }),\n+ ...(resolvedStyle !== undefined && { style: resolvedStyle }),\n+ ...(resolvedClass.length > 0 && { class: resolvedClass }),\n+ ...(disabled && STATIC_DISABLED_PROPS),\n+ ...(isActive && STATIC_ACTIVE_PROPS),\n+ ...(isTransitioning && STATIC_TRANSITIONING_PROPS),\n+ }\n+}\n+\n+// Wrap a design-system component so it navigates like — the component\n+// receives the fully-built link props (href, handlers, data-status, …).\n+export function createLink>(\n+ Comp: TComp,\n+): LinkComponent\n+export function createLink(Comp: any): any {\n+ return function CreatedLink(props: any) {\n+ return createElement(Link as any, { ...props, _asChild: Comp })\n+ }\n+}\n+\n+// Identity helper for pre-validating navigation options (type-level upstream).\n+export type LinkOptionsFnOptions<\n+ TOptions,\n+ TComp,\n+ TRouter extends AnyRouter = RegisteredRouter,\n+> =\n+ TOptions extends ReadonlyArray\n+ ? ValidateLinkOptionsArray\n+ : ValidateLinkOptions\n+\n+export type LinkOptionsFn = <\n+ const TOptions,\n+ TRouter extends AnyRouter = RegisteredRouter,\n+>(\n+ options: LinkOptionsFnOptions,\n+) => TOptions\n+\n+export function linkOptions<\n+ const TOptions,\n+ TRouter extends AnyRouter = RegisteredRouter,\n+>(options: LinkOptionsFnOptions): TOptions\n+export function linkOptions(options: unknown): unknown {\n+ return options\n+}\ndiff --git a/packages/octane-router/src/not-found.tsrx b/packages/octane-router/src/not-found.tsrx\nnew file mode 100644\nindex 0000000000..ff8ce5f224\n--- /dev/null\n+++ b/packages/octane-router/src/not-found.tsrx\n@@ -0,0 +1,41 @@\n+// CatchNotFound — a CatchBoundary specialized to `notFound()` errors (port of\n+// react-router's not-found.tsx). Anything that isn't a NotFoundError is rethrown\n+// (from onCatch during the catch render) so it reaches the next error boundary\n+// up; the reset key is `not-found-${pathname}-${status}` so navigating away (or a\n+// new load settling) clears the not-found UI.\n+import { isNotFound } from '@tanstack/router-core';\n+import { useRouter } from './context.ts';\n+import { useStore } from './useStore.ts';\n+import { CatchBoundary } from './CatchBoundary.tsrx';\n+\n+function NotFoundFallback(props) {\n+\tif (isNotFound(props.error)) {\n+\t\treturn props.render ? props.render(props.error) : null;\n+\t}\n+\tthrow props.error;\n+}\n+\n+export function CatchNotFound(props) @{\n+\tconst router = useRouter();\n+\tconst pathname = useStore(router.stores.location, (l) => l.pathname);\n+\tconst status = useStore(router.stores.status, (s) => s);\n+\tconst resetKey = `not-found-${pathname}-${status}`;\n+\n+\t resetKey}\n+\t\tonCatch={(error, errorInfo) => {\n+\t\t\tif (isNotFound(error)) {\n+\t\t\t\tif (props.onCatch) {\n+\t\t\t\t\tprops.onCatch(error, errorInfo);\n+\t\t\t\t}\n+\t\t\t} else {\n+\t\t\t\tthrow error;\n+\t\t\t}\n+\t\t}}\n+\t\terrorComponent={(p) => NotFoundFallback({ error: p.error, render: props.fallback })}\n+\t>{props.children}\n+}\n+\n+export function DefaultGlobalNotFound() @{\n+\t

Not Found

\n+}\ndiff --git a/packages/octane-router/src/not-found.tsrx.d.ts b/packages/octane-router/src/not-found.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..6df2de5b6b\n--- /dev/null\n+++ b/packages/octane-router/src/not-found.tsrx.d.ts\n@@ -0,0 +1,11 @@\n+import type { ComponentBody } from 'octane'\n+import type { NotFoundError } from '@tanstack/router-core'\n+\n+export interface CatchNotFoundProps {\n+ fallback?: (error: NotFoundError) => unknown\n+ onCatch?: (error: Error, errorInfo: { componentStack: string }) => void\n+ children?: unknown\n+}\n+\n+export declare const CatchNotFound: ComponentBody\n+export declare const DefaultGlobalNotFound: ComponentBody>\ndiff --git a/packages/octane-router/src/octane-compiler.d.ts b/packages/octane-router/src/octane-compiler.d.ts\nnew file mode 100644\nindex 0000000000..88d952504e\n--- /dev/null\n+++ b/packages/octane-router/src/octane-compiler.d.ts\n@@ -0,0 +1,57 @@\n+declare module 'octane/compiler/vite' {\n+ import type { Plugin } from 'vite'\n+\n+ export interface OctaneRendererDescriptor {\n+ module: string\n+ target?: 'dom' | 'universal'\n+ server?: 'render' | 'client-only' | 'unsupported'\n+ intrinsics?: string\n+ text?: 'reject' | 'ignore' | 'host'\n+ capabilities?: Array\n+ }\n+\n+ export interface OctaneRendererBoundary {\n+ ownerRenderer: string\n+ childRenderer: string\n+ prop: string\n+ server?: 'omit-child'\n+ }\n+\n+ export interface OctaneRendererRule {\n+ include: string | Array\n+ exclude?: string | Array\n+ renderer: string\n+ }\n+\n+ export interface OctaneRendererConfig {\n+ default?: string\n+ registry?: Record\n+ rules?: Array\n+ boundaries?: Record>\n+ }\n+\n+ export interface OctaneCompilerOptions {\n+ exclude?: Array\n+ hmr?: boolean\n+ profile?: boolean\n+ renderers?: OctaneRendererConfig\n+ }\n+\n+ export function octane(options?: OctaneCompilerOptions): Plugin\n+}\n+\n+declare module 'octane/compiler/volar' {\n+ export interface VolarCompileResult {\n+ code: string\n+ mappings: Array\n+ cssMappings: Array\n+ scriptMappings: Array\n+ sourceAst: unknown\n+ errors: Array\n+ }\n+\n+ export function compileToVolarMappings(\n+ source: string,\n+ filename?: string,\n+ ): VolarCompileResult\n+}\ndiff --git a/packages/octane-router/src/route.ts b/packages/octane-router/src/route.ts\nnew file mode 100644\nindex 0000000000..8e0cecf50c\n--- /dev/null\n+++ b/packages/octane-router/src/route.ts\n@@ -0,0 +1,578 @@\n+import {\n+ BaseRootRoute,\n+ BaseRoute,\n+ BaseRouteApi,\n+ notFound,\n+} from '@tanstack/router-core'\n+import { createElement } from 'octane'\n+import { internalHooks } from './hooks'\n+import { useRouter } from './context'\n+import { splitSlot, subSlot } from './internal'\n+import { Link } from './Link.tsrx'\n+import type {\n+ AnyContext,\n+ AnyRoute,\n+ AnyRouter,\n+ ConstrainLiteral,\n+ NotFoundError,\n+ Register,\n+ RegisteredRouter,\n+ ResolveFullPath,\n+ ResolveId,\n+ ResolveParams,\n+ RootRoute as RootRouteCore,\n+ RootRouteId,\n+ RootRouteOptions,\n+ RouteConstraints,\n+ Route as RouteCore,\n+ RouteIds,\n+ RouteMask,\n+ RouteOptions,\n+ RouteTypesById,\n+ RouterCore,\n+ ToMaskOptions,\n+ UseNavigateResult,\n+} from '@tanstack/router-core'\n+import type {\n+ UseLoaderDataRoute,\n+ UseLoaderDepsRoute,\n+ UseMatchRoute,\n+ UseParamsRoute,\n+ UseRouteContextRoute,\n+ UseSearchRoute,\n+} from './hooks'\n+import type { LinkComponentRoute } from './link'\n+\n+function attachRouteHooks(self: any, strictLoaderHooks: boolean): void {\n+ self.useMatch = (...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return internalHooks.useMatch(\n+ {\n+ select: opts.select,\n+ structuralSharing: opts.structuralSharing,\n+ from: self.id,\n+ },\n+ subSlot(slot, 'r:m'),\n+ )\n+ }\n+ self.useRouteContext = (...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ return internalHooks.useRouteContext(\n+ { ...(user[0] ?? {}), from: self.id },\n+ subSlot(slot, 'r:ctx'),\n+ )\n+ }\n+ self.useSearch = (...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return internalHooks.useSearch(\n+ {\n+ select: opts.select,\n+ structuralSharing: opts.structuralSharing,\n+ from: self.id,\n+ },\n+ subSlot(slot, 'r:s'),\n+ )\n+ }\n+ self.useParams = (...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return internalHooks.useParams(\n+ {\n+ select: opts.select,\n+ structuralSharing: opts.structuralSharing,\n+ from: self.id,\n+ },\n+ subSlot(slot, 'r:p'),\n+ )\n+ }\n+ self.useLoaderDeps = (...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return internalHooks.useLoaderDeps(\n+ strictLoaderHooks\n+ ? { ...opts, from: self.id }\n+ : { ...opts, from: self.id, strict: false },\n+ subSlot(slot, 'r:d'),\n+ )\n+ }\n+ self.useLoaderData = (...args: Array) => {\n+ const [user, slot] = splitSlot(args)\n+ const opts = user[0] ?? {}\n+ return internalHooks.useLoaderData(\n+ strictLoaderHooks\n+ ? { ...opts, from: self.id }\n+ : { ...opts, from: self.id, strict: false },\n+ subSlot(slot, 'r:l'),\n+ )\n+ }\n+}\n+\n+function attachRouteNavigation(self: any): void {\n+ self.useNavigate = (...args: Array) => {\n+ const [, slot] = splitSlot(args)\n+ return internalHooks.useNavigate(\n+ { from: self.fullPath },\n+ subSlot(slot, 'r:n'),\n+ )\n+ }\n+ self.Link = (props: Record) =>\n+ createElement(Link as any, { from: self.fullPath, ...props })\n+}\n+\n+export function getRouteApi<\n+ const TId,\n+ TRouter extends AnyRouter = RegisteredRouter,\n+>(id: ConstrainLiteral>) {\n+ return new RouteApi({ id })\n+}\n+\n+export class RouteApi<\n+ TId,\n+ TRouter extends AnyRouter = RegisteredRouter,\n+> extends BaseRouteApi {\n+ declare useMatch: UseMatchRoute\n+ declare useRouteContext: UseRouteContextRoute\n+ declare useSearch: UseSearchRoute\n+ declare useParams: UseParamsRoute\n+ declare useLoaderDeps: UseLoaderDepsRoute\n+ declare useLoaderData: UseLoaderDataRoute\n+ declare useNavigate: () => UseNavigateResult<\n+ RouteTypesById['fullPath']\n+ >\n+ declare Link: LinkComponentRoute['fullPath']>\n+\n+ /** @deprecated Use the `getRouteApi` function instead. */\n+ constructor({ id }: { id: TId }) {\n+ super({ id })\n+ attachRouteHooks(this, false)\n+ this.useNavigate = ((...args: Array) => {\n+ const [, slot] = splitSlot(args)\n+ const router = useRouter()\n+ return internalHooks.useNavigate(\n+ { from: router.routesById[this.id as string].fullPath },\n+ subSlot(slot, 'r:n'),\n+ )\n+ }) as typeof this.useNavigate\n+ this.Link = ((props: Record) => {\n+ const router = useRouter()\n+ const fullPath = router.routesById[this.id as string].fullPath\n+ return createElement(Link as any, { from: fullPath, ...props })\n+ }) as unknown as typeof this.Link\n+ }\n+\n+ notFound = (opts?: NotFoundError) => {\n+ return notFound({ routeId: this.id as string, ...opts })\n+ }\n+}\n+\n+export class Route<\n+ in out TRegister = unknown,\n+ in out TParentRoute extends RouteConstraints['TParentRoute'] = AnyRoute,\n+ in out TPath extends RouteConstraints['TPath'] = '/',\n+ in out TFullPath extends RouteConstraints['TFullPath'] = ResolveFullPath<\n+ TParentRoute,\n+ TPath\n+ >,\n+ in out TCustomId extends RouteConstraints['TCustomId'] = string,\n+ in out TId extends RouteConstraints['TId'] = ResolveId<\n+ TParentRoute,\n+ TCustomId,\n+ TPath\n+ >,\n+ in out TSearchValidator = undefined,\n+ in out TParams = ResolveParams,\n+ in out TRouterContext = AnyContext,\n+ in out TRouteContextFn = AnyContext,\n+ in out TBeforeLoadFn = AnyContext,\n+ in out TLoaderDeps extends Record = {},\n+ in out TLoaderFn = undefined,\n+ in out TChildren = unknown,\n+ in out TFileRouteTypes = unknown,\n+ in out TSSR = unknown,\n+ in out TServerMiddlewares = unknown,\n+ in out THandlers = undefined,\n+>\n+ extends BaseRoute<\n+ TRegister,\n+ TParentRoute,\n+ TPath,\n+ TFullPath,\n+ TCustomId,\n+ TId,\n+ TSearchValidator,\n+ TParams,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TChildren,\n+ TFileRouteTypes,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+ >\n+ implements\n+ RouteCore<\n+ TRegister,\n+ TParentRoute,\n+ TPath,\n+ TFullPath,\n+ TCustomId,\n+ TId,\n+ TSearchValidator,\n+ TParams,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TChildren,\n+ TFileRouteTypes,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+ >\n+{\n+ declare useMatch: UseMatchRoute\n+ declare useRouteContext: UseRouteContextRoute\n+ declare useSearch: UseSearchRoute\n+ declare useParams: UseParamsRoute\n+ declare useLoaderDeps: UseLoaderDepsRoute\n+ declare useLoaderData: UseLoaderDataRoute\n+ declare useNavigate: () => UseNavigateResult\n+ declare Link: LinkComponentRoute\n+\n+ /** @deprecated Use the `createRoute` function instead. */\n+ constructor(\n+ options?: RouteOptions<\n+ TRegister,\n+ TParentRoute,\n+ TId,\n+ TCustomId,\n+ TFullPath,\n+ TPath,\n+ TSearchValidator,\n+ TParams,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+ >,\n+ ) {\n+ super(options)\n+ attachRouteHooks(this, true)\n+ attachRouteNavigation(this)\n+ }\n+}\n+\n+export function createRoute<\n+ TRegister = unknown,\n+ TParentRoute extends RouteConstraints['TParentRoute'] = AnyRoute,\n+ TPath extends RouteConstraints['TPath'] = '/',\n+ TFullPath extends RouteConstraints['TFullPath'] = ResolveFullPath<\n+ TParentRoute,\n+ TPath\n+ >,\n+ TCustomId extends RouteConstraints['TCustomId'] = string,\n+ TId extends RouteConstraints['TId'] = ResolveId<\n+ TParentRoute,\n+ TCustomId,\n+ TPath\n+ >,\n+ TSearchValidator = undefined,\n+ TParams = ResolveParams,\n+ TRouteContextFn = AnyContext,\n+ TBeforeLoadFn = AnyContext,\n+ TLoaderDeps extends Record = {},\n+ TLoaderFn = undefined,\n+ TChildren = unknown,\n+ TSSR = unknown,\n+ const TServerMiddlewares = unknown,\n+>(\n+ options: RouteOptions<\n+ TRegister,\n+ TParentRoute,\n+ TId,\n+ TCustomId,\n+ TFullPath,\n+ TPath,\n+ TSearchValidator,\n+ TParams,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ AnyContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TSSR,\n+ TServerMiddlewares\n+ >,\n+): Route<\n+ TRegister,\n+ TParentRoute,\n+ TPath,\n+ TFullPath,\n+ TCustomId,\n+ TId,\n+ TSearchValidator,\n+ TParams,\n+ AnyContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TChildren,\n+ unknown,\n+ TSSR,\n+ TServerMiddlewares\n+> {\n+ return new Route(options as any)\n+}\n+\n+export type AnyRootRoute = RootRoute<\n+ any,\n+ any,\n+ any,\n+ any,\n+ any,\n+ any,\n+ any,\n+ any,\n+ any,\n+ any,\n+ any\n+>\n+\n+export function createRootRouteWithContext() {\n+ return <\n+ TRegister = Register,\n+ TRouteContextFn = AnyContext,\n+ TBeforeLoadFn = AnyContext,\n+ TSearchValidator = undefined,\n+ TLoaderDeps extends Record = {},\n+ TLoaderFn = undefined,\n+ TSSR = unknown,\n+ TServerMiddlewares = unknown,\n+ >(\n+ options?: RootRouteOptions<\n+ TRegister,\n+ TSearchValidator,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TSSR,\n+ TServerMiddlewares\n+ >,\n+ ) =>\n+ createRootRoute<\n+ TRegister,\n+ TSearchValidator,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TSSR,\n+ TServerMiddlewares\n+ >(options)\n+}\n+\n+/** @deprecated Use the `createRootRouteWithContext` function instead. */\n+export const rootRouteWithContext = createRootRouteWithContext\n+\n+export class RootRoute<\n+ in out TRegister = unknown,\n+ in out TSearchValidator = undefined,\n+ in out TRouterContext = {},\n+ in out TRouteContextFn = AnyContext,\n+ in out TBeforeLoadFn = AnyContext,\n+ in out TLoaderDeps extends Record = {},\n+ in out TLoaderFn = undefined,\n+ in out TChildren = unknown,\n+ in out TFileRouteTypes = unknown,\n+ in out TSSR = unknown,\n+ in out TServerMiddlewares = unknown,\n+ in out THandlers = undefined,\n+>\n+ extends BaseRootRoute<\n+ TRegister,\n+ TSearchValidator,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TChildren,\n+ TFileRouteTypes,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+ >\n+ implements\n+ RootRouteCore<\n+ TRegister,\n+ TSearchValidator,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TChildren,\n+ TFileRouteTypes,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+ >\n+{\n+ declare useMatch: UseMatchRoute\n+ declare useRouteContext: UseRouteContextRoute\n+ declare useSearch: UseSearchRoute\n+ declare useParams: UseParamsRoute\n+ declare useLoaderDeps: UseLoaderDepsRoute\n+ declare useLoaderData: UseLoaderDataRoute\n+ declare useNavigate: () => UseNavigateResult<'/'>\n+ declare Link: LinkComponentRoute<'/'>\n+\n+ /** @deprecated Use `createRootRoute()` instead. */\n+ constructor(\n+ options?: RootRouteOptions<\n+ TRegister,\n+ TSearchValidator,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+ >,\n+ ) {\n+ super(options)\n+ attachRouteHooks(this, true)\n+ attachRouteNavigation(this)\n+ }\n+}\n+\n+export function createRootRoute<\n+ TRegister = Register,\n+ TSearchValidator = undefined,\n+ TRouterContext = {},\n+ TRouteContextFn = AnyContext,\n+ TBeforeLoadFn = AnyContext,\n+ TLoaderDeps extends Record = {},\n+ TLoaderFn = undefined,\n+ TSSR = unknown,\n+ const TServerMiddlewares = unknown,\n+ THandlers = undefined,\n+>(\n+ options?: RootRouteOptions<\n+ TRegister,\n+ TSearchValidator,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+ >,\n+): RootRoute<\n+ TRegister,\n+ TSearchValidator,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ unknown,\n+ unknown,\n+ TSSR,\n+ TServerMiddlewares,\n+ THandlers\n+> {\n+ return new RootRoute(options)\n+}\n+\n+export function createRouteMask<\n+ TRouteTree extends AnyRoute,\n+ TFrom extends string,\n+ TTo extends string,\n+>(\n+ opts: {\n+ routeTree: TRouteTree\n+ } & ToMaskOptions, TFrom, TTo>,\n+): RouteMask {\n+ return opts as any\n+}\n+\n+export class NotFoundRoute<\n+ TRegister,\n+ TParentRoute extends AnyRootRoute,\n+ TRouterContext = AnyContext,\n+ TRouteContextFn = AnyContext,\n+ TBeforeLoadFn = AnyContext,\n+ TSearchValidator = undefined,\n+ TLoaderDeps extends Record = {},\n+ TLoaderFn = undefined,\n+ TChildren = unknown,\n+ TSSR = unknown,\n+ TServerMiddlewares = unknown,\n+> extends Route<\n+ TRegister,\n+ TParentRoute,\n+ '/404',\n+ '/404',\n+ '404',\n+ '404',\n+ TSearchValidator,\n+ {},\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TChildren,\n+ unknown,\n+ TSSR,\n+ TServerMiddlewares\n+> {\n+ constructor(\n+ options: Omit<\n+ RouteOptions<\n+ TRegister,\n+ TParentRoute,\n+ string,\n+ string,\n+ string,\n+ string,\n+ TSearchValidator,\n+ {},\n+ TLoaderDeps,\n+ TLoaderFn,\n+ TRouterContext,\n+ TRouteContextFn,\n+ TBeforeLoadFn,\n+ TSSR,\n+ TServerMiddlewares\n+ >,\n+ | 'caseSensitive'\n+ | 'parseParams'\n+ | 'stringifyParams'\n+ | 'path'\n+ | 'id'\n+ | 'params'\n+ >,\n+ ) {\n+ super({ ...(options as any), id: '404' })\n+ }\n+}\ndiff --git a/packages/octane-router/src/router.ts b/packages/octane-router/src/router.ts\nnew file mode 100644\nindex 0000000000..4e3519e0ac\n--- /dev/null\n+++ b/packages/octane-router/src/router.ts\n@@ -0,0 +1,60 @@\n+import {\n+ RouterCore,\n+ createNonReactiveMutableStore,\n+ createNonReactiveReadonlyStore,\n+} from '@tanstack/router-core'\n+import { batch, createAtom } from '@tanstack/store'\n+import { startTransition } from 'octane'\n+import type { RouterHistory } from '@tanstack/history'\n+import type {\n+ AnyRoute,\n+ CreateRouterFn,\n+ RouterConstructorOptions,\n+ TrailingSlashOption,\n+} from '@tanstack/router-core'\n+\n+const isServerEnvironment = typeof document === 'undefined'\n+\n+const octaneStoreFactory = (options: { isServer?: boolean }) => {\n+ if (options.isServer ?? isServerEnvironment) {\n+ return {\n+ createMutableStore: createNonReactiveMutableStore,\n+ createReadonlyStore: createNonReactiveReadonlyStore,\n+ batch: (callback: () => void) => callback(),\n+ }\n+ }\n+\n+ return {\n+ createMutableStore: createAtom,\n+ createReadonlyStore: createAtom,\n+ batch: (callback: () => void) => startTransition(() => batch(callback)),\n+ }\n+}\n+\n+export const createRouter: CreateRouterFn = (options) => new Router(options)\n+\n+export class Router<\n+ in out TRouteTree extends AnyRoute,\n+ in out TTrailingSlashOption extends TrailingSlashOption = 'never',\n+ in out TDefaultStructuralSharingOption extends boolean = false,\n+ in out TRouterHistory extends RouterHistory = RouterHistory,\n+ in out TDehydrated extends Record = Record,\n+> extends RouterCore<\n+ TRouteTree,\n+ TTrailingSlashOption,\n+ TDefaultStructuralSharingOption,\n+ TRouterHistory,\n+ TDehydrated\n+> {\n+ constructor(\n+ options: RouterConstructorOptions<\n+ TRouteTree,\n+ TTrailingSlashOption,\n+ TDefaultStructuralSharingOption,\n+ TRouterHistory,\n+ TDehydrated\n+ >,\n+ ) {\n+ super(options, octaneStoreFactory)\n+ }\n+}\ndiff --git a/packages/octane-router/src/scriptContentUtils.ts b/packages/octane-router/src/scriptContentUtils.ts\nnew file mode 100644\nindex 0000000000..c7023464b8\n--- /dev/null\n+++ b/packages/octane-router/src/scriptContentUtils.ts\n@@ -0,0 +1,71 @@\n+import { deepEqual } from '@tanstack/router-core'\n+import { isServer } from '@tanstack/router-core/isServer'\n+import { useRouter } from './context'\n+import { splitSlot, subSlot } from './internal'\n+import { useStore } from './useStore'\n+import type {\n+ AnyRouteMatch,\n+ AnyRouter,\n+ RouterManagedTag,\n+} from '@tanstack/router-core'\n+\n+function getScripts(router: AnyRouter, matches: Array) {\n+ const nonce = router.options.ssr?.nonce\n+ const scripts: Array = matches\n+ .flatMap((match) => match.scripts ?? [])\n+ .filter((script) => script !== undefined)\n+ .map(({ children, ...attrs }) => ({\n+ tag: 'script',\n+ attrs: { ...attrs, nonce },\n+ children,\n+ }))\n+\n+ const manifest = router.ssr?.manifest\n+ if (manifest) {\n+ for (const match of matches) {\n+ for (const asset of manifest.routes[match.routeId]?.scripts ?? []) {\n+ scripts.push({\n+ tag: 'script',\n+ attrs: { ...asset.attrs, nonce },\n+ children: asset.children,\n+ })\n+ }\n+ }\n+ }\n+\n+ return scripts\n+}\n+\n+export function useScripts(...args: Array): Array {\n+ const [, slot] = splitSlot(args)\n+ const router = useRouter()\n+\n+ if (isServer ?? router.isServer) {\n+ const scripts = getScripts(router, router.stores.matches.get())\n+ const buffered = router.serverSsr?.takeBufferedScripts()\n+ if (!buffered || buffered.tag !== 'script') {\n+ return scripts\n+ }\n+ return [\n+ {\n+ tag: 'script',\n+ attrs: buffered.attrs,\n+ children:\n+ typeof buffered.children === 'string'\n+ ? buffered.children.replace(\n+ /;document\\.currentScript\\.remove\$\$$/,\n+ '',\n+ )\n+ : buffered.children,\n+ },\n+ ...scripts,\n+ ]\n+ }\n+\n+ return useStore(\n+ router.stores.matches,\n+ (matches: Array) => getScripts(router, matches),\n+ deepEqual,\n+ subSlot(slot, 'body:scripts'),\n+ )\n+}\ndiff --git a/packages/octane-router/src/scroll-restoration.tsrx b/packages/octane-router/src/scroll-restoration.tsrx\nnew file mode 100644\nindex 0000000000..1eab9fdcef\n--- /dev/null\n+++ b/packages/octane-router/src/scroll-restoration.tsrx\n@@ -0,0 +1,14 @@\n+import { getScrollRestorationScriptForRouter } from '@tanstack/router-core/scroll-restoration-script';\n+import { useRouter } from './context.ts';\n+import { ScriptOnce } from './ScriptOnce.tsrx';\n+\n+export function ScrollRestorationScript() @{\n+\tconst router = useRouter();\n+\tconst script = getScrollRestorationScriptForRouter(router);\n+\n+\t@if (script) {\n+\t\t\n+\t} @else {\n+\t\t<>\n+\t}\n+}\ndiff --git a/packages/octane-router/src/scroll-restoration.tsrx.d.ts b/packages/octane-router/src/scroll-restoration.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..de1b384d01\n--- /dev/null\n+++ b/packages/octane-router/src/scroll-restoration.tsrx.d.ts\n@@ -0,0 +1,5 @@\n+import type { ComponentBody } from 'octane'\n+\n+export declare const ScrollRestorationScript: ComponentBody<\n+ Record\n+>\ndiff --git a/packages/octane-router/src/ssr/RouterClient.tsrx b/packages/octane-router/src/ssr/RouterClient.tsrx\nnew file mode 100644\nindex 0000000000..9ea1e019ec\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/RouterClient.tsrx\n@@ -0,0 +1,37 @@\n+import { use } from 'octane';\n+import { hydrate } from '@tanstack/router-core/ssr/client';\n+import { RouterProvider } from '../RouterProvider.tsrx';\n+import { toExternalHydrationThenable } from '../externalHydration.ts';\n+\n+const hydrationPromises = new WeakMap();\n+const ready = {\n+\tstatus: 'fulfilled',\n+\tvalue: undefined,\n+\tthen(onfulfilled) {\n+\t\treturn Promise.resolve(onfulfilled?.());\n+\t},\n+};\n+\n+function getHydrationPromise(router) {\n+\tlet promise = hydrationPromises.get(router);\n+\tif (!promise) {\n+\t\tpromise = router.stores.matchesId.get().length\n+\t\t\t? ready\n+\t\t\t: hydrate(router);\n+\t\thydrationPromises.set(router, promise);\n+\t}\n+\treturn promise;\n+}\n+\n+function RouterClientInner(props) @{\n+\tuse(toExternalHydrationThenable(getHydrationPromise(props.router)));\n+\t\n+}\n+\n+export function RouterClient(props) @{\n+\t@try {\n+\t\t\n+\t} @pending {\n+\t\t<>\n+\t}\n+}\ndiff --git a/packages/octane-router/src/ssr/RouterClient.tsrx.d.ts b/packages/octane-router/src/ssr/RouterClient.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..62dfd246a9\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/RouterClient.tsrx.d.ts\n@@ -0,0 +1,4 @@\n+import type { ComponentBody } from 'octane'\n+import type { AnyRouter } from '@tanstack/router-core'\n+\n+export declare const RouterClient: ComponentBody<{ router: AnyRouter }>\ndiff --git a/packages/octane-router/src/ssr/RouterServer.tsrx b/packages/octane-router/src/ssr/RouterServer.tsrx\nnew file mode 100644\nindex 0000000000..0dea649de4\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/RouterServer.tsrx\n@@ -0,0 +1,5 @@\n+import { RouterProvider } from '../RouterProvider.tsrx';\n+\n+export function RouterServer(props) @{\n+\t\n+}\ndiff --git a/packages/octane-router/src/ssr/RouterServer.tsrx.d.ts b/packages/octane-router/src/ssr/RouterServer.tsrx.d.ts\nnew file mode 100644\nindex 0000000000..cb9854ddd4\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/RouterServer.tsrx.d.ts\n@@ -0,0 +1,4 @@\n+import type { ComponentBody } from 'octane'\n+import type { AnyRouter } from '@tanstack/router-core'\n+\n+export declare const RouterServer: ComponentBody<{ router: AnyRouter }>\ndiff --git a/packages/octane-router/src/ssr/client.ts b/packages/octane-router/src/ssr/client.ts\nnew file mode 100644\nindex 0000000000..29e5584c7d\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/client.ts\n@@ -0,0 +1,2 @@\n+export { RouterClient } from './RouterClient.tsrx'\n+export * from '@tanstack/router-core/ssr/client'\ndiff --git a/packages/octane-router/src/ssr/defaultRenderHandler.ts b/packages/octane-router/src/ssr/defaultRenderHandler.ts\nnew file mode 100644\nindex 0000000000..cc95490bd0\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/defaultRenderHandler.ts\n@@ -0,0 +1,12 @@\n+import { defineHandlerCallback } from '@tanstack/router-core/ssr/server'\n+import { RouterServer } from './RouterServer.tsrx'\n+import { renderRouterToString } from './renderRouterToString'\n+\n+export const defaultRenderHandler = defineHandlerCallback(\n+ ({ router, responseHeaders }) =>\n+ renderRouterToString({\n+ router,\n+ responseHeaders,\n+ App: RouterServer,\n+ }),\n+)\ndiff --git a/packages/octane-router/src/ssr/defaultStreamHandler.ts b/packages/octane-router/src/ssr/defaultStreamHandler.ts\nnew file mode 100644\nindex 0000000000..34ad65edb9\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/defaultStreamHandler.ts\n@@ -0,0 +1,13 @@\n+import { defineHandlerCallback } from '@tanstack/router-core/ssr/server'\n+import { RouterServer } from './RouterServer.tsrx'\n+import { renderRouterToStream } from './renderRouterToStream'\n+\n+export const defaultStreamHandler = defineHandlerCallback(\n+ ({ request, router, responseHeaders }) =>\n+ renderRouterToStream({\n+ request,\n+ router,\n+ responseHeaders,\n+ App: RouterServer,\n+ }),\n+)\ndiff --git a/packages/octane-router/src/ssr/renderRouterToStream.ts b/packages/octane-router/src/ssr/renderRouterToStream.ts\nnew file mode 100644\nindex 0000000000..261d3c3f74\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/renderRouterToStream.ts\n@@ -0,0 +1,366 @@\n+import { renderToReadableStream } from 'octane/server'\n+import { prerender } from 'octane/static'\n+import { isbot } from 'isbot'\n+import {\n+ createSsrStreamResponse,\n+ transformReadableStreamWithRouter,\n+} from '@tanstack/router-core/ssr/server'\n+import { finalizeBufferedHtml } from './renderRouterToString'\n+import type { ComponentBody } from 'octane'\n+import type { AnyRouter } from '@tanstack/router-core'\n+\n+type RouterApp = ComponentBody<{ router: AnyRouter }>\n+type ServerComponent = Parameters[0]\n+\n+export async function renderRouterToStream({\n+ request,\n+ router,\n+ responseHeaders,\n+ App,\n+}: {\n+ request: Request\n+ router: AnyRouter\n+ responseHeaders: Headers\n+ App: RouterApp\n+}) {\n+ if (isbot(request.headers.get('User-Agent'))) {\n+ return renderRouterForBot({ request, router, responseHeaders, App })\n+ }\n+\n+ const renderController = new AbortController()\n+ const onRequestAbort = () => renderController.abort(request.signal.reason)\n+ if (request.signal.aborted) {\n+ onRequestAbort()\n+ } else {\n+ request.signal.addEventListener('abort', onRequestAbort, { once: true })\n+ router.serverSsr?.onCleanup(() => {\n+ request.signal.removeEventListener('abort', onRequestAbort)\n+ })\n+ }\n+\n+ try {\n+ const stream = await renderToReadableStream(\n+ App as unknown as ServerComponent,\n+ { router },\n+ {\n+ signal: renderController.signal,\n+ nonce: router.options.ssr?.nonce,\n+ onError(error) {\n+ if (!isAbortError(request, error)) {\n+ console.error('Error in renderToReadableStream:', error)\n+ }\n+ },\n+ },\n+ )\n+\n+ const appStream = prependDoctype(relocateLeadingOctaneStylesToHead(stream))\n+ const responseStream = transformReadableStreamWithRouter(\n+ router,\n+ appStream as unknown as Parameters<\n+ typeof transformReadableStreamWithRouter\n+ >[1],\n+ {\n+ onAbort: (reason) => renderController.abort(reason),\n+ },\n+ )\n+\n+ return createSsrStreamResponse(\n+ router,\n+ new Response(responseStream as unknown as BodyInit, {\n+ status: router.stores.statusCode.get(),\n+ headers: responseHeaders,\n+ }),\n+ )\n+ } catch (error) {\n+ renderController.abort(error)\n+ router.serverSsr?.cleanup()\n+ throw error\n+ }\n+}\n+\n+const MAX_DOCUMENT_PREFIX_CHARS = 64 * 1024\n+\n+/**\n+ * Octane streams the scoped styles needed by the shell before the rendered\n+ * markup. That is useful for fragment roots, but a full document would put the\n+ * styles before ``. Hold only those leading renderer-owned styles and the\n+ * document prefix, then release them immediately after the opening ``.\n+ * All later chunks (including suspense styles and boundary instructions) keep\n+ * flowing through this transform under the source stream's backpressure.\n+ */\n+export function relocateLeadingOctaneStylesToHead(\n+ stream: globalThis.ReadableStream,\n+): globalThis.ReadableStream {\n+ const decoder = new TextDecoder()\n+ const encoder = new TextEncoder()\n+ let state: 'leading' | 'document-prefix' | 'passthrough' = 'leading'\n+ let buffer = ''\n+ let leadingStyles = ''\n+\n+ const transform = new TransformStream({\n+ transform(chunk, controller) {\n+ buffer += decoder.decode(chunk, { stream: true })\n+ processBuffer(controller, false)\n+ },\n+ flush(controller) {\n+ buffer += decoder.decode()\n+ processBuffer(controller, true)\n+ },\n+ })\n+\n+ return stream.pipeThrough(transform)\n+\n+ function processBuffer(\n+ controller: TransformStreamDefaultController,\n+ isFinalChunk: boolean,\n+ ) {\n+ while (state === 'leading') {\n+ const style = readLeadingOctaneStyle(buffer, isFinalChunk)\n+ if (style === undefined) {\n+ return\n+ }\n+ if (style === null) {\n+ if (!leadingStyles) {\n+ state = 'passthrough'\n+ enqueueBuffer(controller)\n+ return\n+ }\n+ state = 'document-prefix'\n+ break\n+ }\n+ leadingStyles += buffer.slice(0, style)\n+ buffer = buffer.slice(style)\n+ }\n+\n+ if (state === 'document-prefix') {\n+ const headEnd = findOpeningTagEnd(buffer, 'head')\n+ if (headEnd !== -1) {\n+ enqueue(\n+ controller,\n+ `${buffer.slice(0, headEnd)}${leadingStyles}${buffer.slice(headEnd)}`,\n+ )\n+ leadingStyles = ''\n+ buffer = ''\n+ state = 'passthrough'\n+ return\n+ }\n+\n+ // A route-owned document is expected to render a head. Keep malformed or\n+ // fragment output streaming too: after a bounded prefix, preserve Octane's\n+ // original ordering instead of retaining the rest of the response.\n+ if (!isFinalChunk && buffer.length <= MAX_DOCUMENT_PREFIX_CHARS) {\n+ return\n+ }\n+\n+ enqueue(controller, `${leadingStyles}${buffer}`)\n+ leadingStyles = ''\n+ buffer = ''\n+ state = 'passthrough'\n+ return\n+ }\n+\n+ enqueueBuffer(controller)\n+ }\n+\n+ function enqueueBuffer(\n+ controller: TransformStreamDefaultController,\n+ ) {\n+ enqueue(controller, buffer)\n+ buffer = ''\n+ }\n+\n+ function enqueue(\n+ controller: TransformStreamDefaultController,\n+ value: string,\n+ ) {\n+ if (value) {\n+ controller.enqueue(encoder.encode(value))\n+ }\n+ }\n+}\n+\n+// Returns the end offset of a complete leading Octane style, null when the\n+// prefix is not one, or undefined while a split tag still needs more bytes.\n+function readLeadingOctaneStyle(\n+ html: string,\n+ isFinalChunk: boolean,\n+): number | null | undefined {\n+ const stylePrefix = '' && !isHtmlWhitespace(next)) {\n+ return null\n+ }\n+\n+ const openingTagEnd = findTagEnd(html, 0)\n+ if (openingTagEnd === -1) {\n+ return isFinalChunk ? null : undefined\n+ }\n+\n+ const openingTag = html.slice(0, openingTagEnd)\n+ if (!/\\sdata-octane(?:\\s|=|>)/i.test(openingTag)) {\n+ return null\n+ }\n+\n+ const closingTag = ''\n+ const closingTagStart = html.toLowerCase().indexOf(closingTag, openingTagEnd)\n+ if (closingTagStart === -1) {\n+ return isFinalChunk ? null : undefined\n+ }\n+ return closingTagStart + closingTag.length\n+}\n+\n+function findOpeningTagEnd(html: string, tagName: string): number {\n+ const lowerHtml = html.toLowerCase()\n+ const prefix = `<${tagName}`\n+ let searchFrom = 0\n+\n+ while (searchFrom < html.length) {\n+ const start = lowerHtml.indexOf(prefix, searchFrom)\n+ if (start === -1) {\n+ return -1\n+ }\n+\n+ const next = html.charAt(start + prefix.length)\n+ if (next === '>' || isHtmlWhitespace(next)) {\n+ return findTagEnd(html, start)\n+ }\n+ searchFrom = start + prefix.length\n+ }\n+\n+ return -1\n+}\n+\n+function findTagEnd(html: string, start: number): number {\n+ let quote: '\"' | \"'\" | undefined\n+ for (let index = start + 1; index < html.length; index++) {\n+ const char = html.charAt(index)\n+ if (quote) {\n+ if (char === quote) {\n+ quote = undefined\n+ }\n+ } else if (char === '\"' || char === \"'\") {\n+ quote = char\n+ } else if (char === '>') {\n+ return index + 1\n+ }\n+ }\n+ return -1\n+}\n+\n+function isHtmlWhitespace(char: string) {\n+ return char === ' ' || char === '\\n' || char === '\\r' || char === '\\t'\n+}\n+\n+async function renderRouterForBot({\n+ request,\n+ router,\n+ responseHeaders,\n+ App,\n+}: {\n+ request: Request\n+ router: AnyRouter\n+ responseHeaders: Headers\n+ App: RouterApp\n+}) {\n+ try {\n+ const result = await prerender(\n+ App as unknown as Parameters[0],\n+ { router },\n+ {\n+ signal: request.signal,\n+ nonce: router.options.ssr?.nonce,\n+ onError(error) {\n+ if (!isAbortError(request, error)) {\n+ console.error('Error in prerender:', error)\n+ }\n+ },\n+ },\n+ )\n+ router.serverSsr!.setRenderFinished()\n+\n+ return new Response(\n+ finalizeBufferedHtml(\n+ result.html,\n+ result.css,\n+ router.serverSsr!.takeBufferedHtml(),\n+ ),\n+ {\n+ status: router.stores.statusCode.get(),\n+ headers: responseHeaders,\n+ },\n+ )\n+ } finally {\n+ router.serverSsr?.cleanup()\n+ }\n+}\n+\n+function prependDoctype(\n+ stream: globalThis.ReadableStream,\n+): ReadableStream {\n+ const encoder = new TextEncoder()\n+ let reader: ReadableStreamDefaultReader | undefined\n+ let sentDoctype = false\n+\n+ return new ReadableStream({\n+ start() {\n+ reader = stream.getReader()\n+ },\n+ async pull(controller) {\n+ if (!sentDoctype) {\n+ sentDoctype = true\n+ controller.enqueue(encoder.encode(''))\n+ return\n+ }\n+\n+ try {\n+ const { done, value } = await reader!.read()\n+ if (done) {\n+ controller.close()\n+ releaseReader()\n+ } else {\n+ controller.enqueue(value)\n+ }\n+ } catch (error) {\n+ controller.error(error)\n+ releaseReader()\n+ }\n+ },\n+ async cancel(reason) {\n+ try {\n+ await reader?.cancel(reason)\n+ } finally {\n+ releaseReader()\n+ }\n+ },\n+ })\n+\n+ function releaseReader() {\n+ try {\n+ reader?.releaseLock()\n+ } catch {\n+ // The stream may already have released its reader during cancellation.\n+ }\n+ reader = undefined\n+ }\n+}\n+\n+function isAbortError(request: Request, error: unknown) {\n+ return (\n+ (request.signal.aborted && error === request.signal.reason) ||\n+ (error instanceof Error && error.name === 'AbortError')\n+ )\n+}\ndiff --git a/packages/octane-router/src/ssr/renderRouterToString.ts b/packages/octane-router/src/ssr/renderRouterToString.ts\nnew file mode 100644\nindex 0000000000..bec9876c14\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/renderRouterToString.ts\n@@ -0,0 +1,68 @@\n+import { renderToString as octaneRenderToString } from 'octane/server'\n+import type { ComponentBody } from 'octane'\n+import type { AnyRouter } from '@tanstack/router-core'\n+\n+type RouterApp = ComponentBody<{ router: AnyRouter }>\n+type ServerComponent = Parameters[0]\n+\n+// eslint-disable-next-line @typescript-eslint/require-await -- framework render handlers share an async contract\n+export async function renderRouterToString({\n+ router,\n+ responseHeaders,\n+ App,\n+}: {\n+ router: AnyRouter\n+ responseHeaders: Headers\n+ App: RouterApp\n+}) {\n+ try {\n+ const result = octaneRenderToString(\n+ App as unknown as ServerComponent,\n+ { router },\n+ { nonce: router.options.ssr?.nonce },\n+ )\n+ router.serverSsr!.setRenderFinished()\n+\n+ return new Response(\n+ finalizeBufferedHtml(\n+ result.html,\n+ result.css,\n+ router.serverSsr!.takeBufferedHtml(),\n+ ),\n+ {\n+ status: router.stores.statusCode.get(),\n+ headers: responseHeaders,\n+ },\n+ )\n+ } catch (error) {\n+ console.error('Render to string error:', error)\n+ return new Response('Internal Server Error', {\n+ status: 500,\n+ headers: responseHeaders,\n+ })\n+ } finally {\n+ router.serverSsr?.cleanup()\n+ }\n+}\n+\n+export function finalizeBufferedHtml(\n+ renderedHtml: string,\n+ css: string,\n+ injectedHtml?: string,\n+) {\n+ let html = renderedHtml\n+\n+ if (css) {\n+ html = html.includes('')\n+ ? html.replace('', `${css}`)\n+ : `${css}${html}`\n+ }\n+\n+ if (injectedHtml) {\n+ html = html.includes('')\n+ ? html.replace('', `${injectedHtml}`)\n+ : `${html}${injectedHtml}`\n+ }\n+\n+ return `${html}`\n+}\ndiff --git a/packages/octane-router/src/ssr/server.ts b/packages/octane-router/src/ssr/server.ts\nnew file mode 100644\nindex 0000000000..5202ae85df\n--- /dev/null\n+++ b/packages/octane-router/src/ssr/server.ts\n@@ -0,0 +1,6 @@\n+export { RouterServer } from './RouterServer.tsrx'\n+export { defaultRenderHandler } from './defaultRenderHandler'\n+export { defaultStreamHandler } from './defaultStreamHandler'\n+export { renderRouterToStream } from './renderRouterToStream'\n+export { renderRouterToString } from './renderRouterToString'\n+export * from '@tanstack/router-core/ssr/server'\ndiff --git a/packages/octane-router/src/structuralSharing.ts b/packages/octane-router/src/structuralSharing.ts\nnew file mode 100644\nindex 0000000000..109e2fd83c\n--- /dev/null\n+++ b/packages/octane-router/src/structuralSharing.ts\n@@ -0,0 +1,45 @@\n+import type {\n+ AnyRouter,\n+ Constrain,\n+ OptionalStructuralSharing,\n+ ValidateJSON,\n+} from '@tanstack/router-core'\n+\n+export type DefaultStructuralSharingEnabled

{'Route error'}

{'Not found'}

{'Client navigation works'}

{'Deferred rejection'}

{'Deferred loader data'}

{getHeading()}

{'Server function'}

Home

Index

About page

{'Item ' + params.id}

{'Index'}

{'About page'}

\n+\t\t{'Item ' + params.id as string}\n+\t

{'Posts'}

{'Home'}

\n+\t\t{value as string}\n+\t

{'Lazy loaded'}

{'Scroll home'}

{'Scroll next'}

{'Home'}

{'Index'}

{'About page'}

{'Index'}

{'Posts'}

{'Home'}

{'About'}

\n+\t\t{'Item ' + params.id}\n+\t

\n+\t\t{value as string}\n+\t