@solidjs/router 2.0.0-next.27 → 2.0.0-next.29

package/README.md

@@ -371,14 +371,14 @@ Resolution is cached per thunk and append-only: the tree never changes shape aft
 
 ### Server Component Routes (experimental)
 
-Solid's experimental [server components](https://github.com/solidjs/solid/blob/main/documentation/solid-2.0/11-server-components.md) are `"use server"` functions that return a component. `serverRouteComponent` uses one as a route's `component` directly — the router owns the URL → call translation a client wrapper used to spell out:
+Solid's experimental [server components](https://github.com/solidjs/solid/blob/main/documentation/solid-2.0/11-server-components.md) are `"use server"` functions that return a component. `serverRouteComponent` takes a `query` over one and uses it as a route's `component` directly — the router owns the URL → call translation a client wrapper used to spell out:
 
 ```tsx
-// views.tsx
-"use server";
-import type { ServerRouteArgs } from "@solidjs/router";
+// story.tsx — the source owns its key
+import { query, type ServerRouteArgs } from "@solidjs/router";
 
-export async function storyView({ params }: ServerRouteArgs<{ id: string }>) {
+export const getStory = query(async ({ params }: ServerRouteArgs<{ id: string }>) => {
+  "use server";
   const story = await db.stories.get(params.id);
   return props => (
     <article>
@@ -386,20 +386,46 @@ export async function storyView({ params }: ServerRouteArgs<{ id: string }>) {
       {props.children}
     </article>
   );
-}
+}, "story");
 
 // routes.ts
-defineRoute({ path: "/stories/:id", component: serverRouteComponent(storyView) });
+defineRoute({ path: "/stories/:id", component: serverRouteComponent(getStory) });
 ```
 
-The function is called with **derived** arguments, not a live location — the call's `(function, arguments)` address keys both the query cache and the frame store, so the args name exactly what the route depends on:
+The source is called with **derived** arguments, not a live location — the call's `(function, arguments)` address keys both the query cache and the frame store, so the args name exactly what the route depends on:
 
 - `params`: the params this route's pattern (and its ancestors') declares — never a child's, so a layout does not refetch when a leaf param changes. `defineRoute` checks them against the pattern.
 - `search`: the validated output of the route's [`search` schema](#typed-search-params), only when one is declared. Otherwise `undefined`, and the route never tracks the query string.
 
-The router mounts the resolved component with the outlet as `children`, so a server component can be a layout. The call is wrapped in `query` (keyed by the function id): link intent warms the same entry the render reads, actions revalidate it, and the [single-flight collector](#server-integration) reproduces it so a mutation's response carries the route's fresh markup. Argument changes deliver into the mounted boundary — it morphs in place rather than remounting.
+A route view is route-shaped on purpose — the address stays stable and `defineRoute` can check its params against the pattern — which means it is only callable as a route. When the same server component is also used elsewhere, keep it a plain (non-exported, non-endpoint) function and have the route view call it with `params.id`. The value `serverRouteComponent` returns is a component only so it fits the `component` field; mounting it any other way (through `lazy()`, or by hand) throws, since outside the match there are only merged params to call with.
+
+The router mounts the resolved component with the outlet as `children`, so a server component can be a layout, and it calls the same source under preload intent — link hover, `preloadRoute`, the [single-flight collector](#server-integration) — with the same derived args. What that call _means_ is the source's: the router does not choose the cache strategy or own the key.
+
+- `query(fn, key)`: link intent warms the entry the render reads, `revalidate("story")` and action responses refetch it, and the collector reproduces it so a mutation's response carries the route's fresh markup. Argument changes deliver into the mounted boundary — it morphs in place rather than remounting.
+- [`liveQuery(fn, key)`](#livequery-experimental): the frame stream stays open and the channel owns it — hover connects it (held through the preload window, so a hovered link is an open stream), `revalidate(key)` reconnects, and the mutation sweep and the single-flight collector both leave it alone — nothing pulls it server-side, and the stream is its own freshness.
+
+Anything else callable with the args works too; wrapping is what gives dedupe, preload, and revalidation.
+
+Mutations reach these routes the way they reach any query, and the cost model is worth knowing: a swept server route is a server-side re-render plus its markup in the response, not a small data blob. From a server action, `redirect(url)` re-collects everything the target shows and a bare `reload()` everything the current page shows — server routes included, shell and layouts too. On a server-component-heavy page, name what a mutation actually changed instead. `Router.keysFor(url)` answers the query keys of the server routes a URL shows, root to leaf — the app's own keys, from pure matching, so it works in an action and never spells a key:
+
+```ts
+export const addComment = action(async (form: FormData) => {
+  "use server";
+  await db.comments.add(form);
+  return reload({ revalidate: Router.keysFor(paths.stories(form.get("id"))) });
+});
+```
+
+Route keys, not addresses: every story page is refetched, which is what prefix matching gives a hand-written `revalidate("story")` too.
+
+An app shell is a pathless layout route whose `component` is a server component. With no pattern, its args are the constant `{ params: {}, search: undefined }` — one call, one address, persisting across every navigation — and as a route it gets preload, collection, and `revalidate` like any other. The `<Router>` root slot exists for client providers that need router context without following route rules; a server component has neither, so it does not go there:
+
+```tsx
+const routes = [{ component: serverRouteComponent(query(appShell, "shell")), children: pages }];
+render(() => <Router routes={routes} />, document.body);
+```
 
-`children` is the only client position the router fills, and the helper's type says so: a server component that requires other props — event handlers, refs, named slots — is rejected. Those come from the client, so that route has a client half; write it as an ordinary route component around `dynamic()`. Interaction that lives on the server — form posts to server actions via `action={addTodo.url}` — needs no client component at all.
+`children` is the only client position the router fills, and the helper's type says so: a server component that requires other props — event handlers, refs, named slots — is rejected. Those come from the client, so that route has a client half; write it as an ordinary route component around `dynamic()`. Interaction that lives on the server — form posts to server actions via `action={addTodo}` — needs no client component at all.
 
 ### File-System Routes
 
@@ -432,6 +458,30 @@ export default function Post(props: RouteProps<typeof route>) {
 
 The pattern string is a typing witness — at runtime the manifest's path (from the filename) is the source of truth. With the plugin's `types` option generating a literal declaration for the virtual module, the file paths flow into `paths` and the typed hooks like a hand-written tree — `paths.blog(42)` typechecks, filters and search schemas included, and `useParams(paths.blog)` works as usual anywhere under the route.
 
+#### Server pages
+
+A route file's page can be a [server component](#server-component-routes-experimental): make the default export a `"use server"` function of the route args. With `fileRoutes({ serverComponents: true })` on the `file-routes` plugin, the scanner flags such a file and the adapter builds the route the hand-written tree spells out — `serverRouteComponent(query(fn, key))` with the file's path as the key. No `query`, key, or wrapper in the route file. (That option turns on server component _routes_; server components themselves are Solid's plugin's `serverFunctions: { components: true }`, the same switch a hand-written server route needs.)
+
+```tsx
+// routes/stories/[id].tsx
+import { defineFileRoute } from "@solidjs/router/fs";
+import type { ServerRouteArgs } from "@solidjs/router";
+
+export const route = defineFileRoute("/stories/:id", { search: storySearch });
+
+export default async function Story({ params, search }: ServerRouteArgs<typeof route>) {
+  "use server";
+  const story = await db.stories.get(params.id);
+  return props => <article>{story.title}{props.children}</article>;
+}
+```
+
+`ServerRouteArgs<typeof route>` reads the config as a witness like `RouteProps` does: `params` from the pattern, `search` as the schema's output (`undefined` with no schema). The key is the file — `Router.keysFor(paths.stories(7))` answers `["src/routes/stories/[id].tsx"]` (plus any server layouts above it), so an action names the page without spelling a path; because keys match by prefix, `revalidate("src/routes/stories")` refetches every page under the directory (pathless layouts have no route path of their own, so the file is what tells them apart). The directive has to be the first statement of the inline default export — behind a wrapper call or a re-export the scanner cannot see it, the page is code-split like a client page, and in development the adapter throws a directed error when the chunk resolves.
+
+A live page names its wrapper in the `route` config — `defineFileRoute("/feed", { query: liveQuery })` — and the adapter sources through that instead of `query`. The route file imports `liveQuery`, so only an app with a live page carries it.
+
+Apps with no server page pay nothing for any of this. The plugin folds the scan into `filesystem-routing/flags`, and the adapter's only path to `serverRouteComponent` and `query` is a module gated on that constant, so the branch — and with it the frames runtime — tree-shakes away. `pnpm build` asserts it.
+
 ## Typed Paths
 
 `paths` is a proxy inferred from the route tree. Property access descends into static segments, calls bind params, and it mirrors URL anatomy — params, then a search object, then a hash string:
@@ -594,7 +644,7 @@ Live queries ride the router's existing machinery rather than adding their own:
 - **Preload** — calling one in a preload function warms the connection, so navigation renders against an already-delivered value instead of holding the transition on connect.
 - **SSR** — the document face renders the first value; hydration adopts it and reconnects. Server-side, consumers of a key within one request observe the same value.
 - **Revalidation** — explicit `revalidate(key)` reconnects (the producer re-yields current state by contract). The post-mutation sweep leaves healthy connections alone: the stream is its own freshness mechanism.
-- **Single-flight** — a mutation's flight payload pushes straight into open channels, so mutated state lands in the same round trip.
+- **Single-flight** — live keys are neither collected nor swept: the stream is the freshness mechanism, and a mutation reaches a live query through its producer (the `watch` yielding the changed state), not through the mutation response. The flight-data seam that pushes payload values into open channels stays available to an integration that collects live keys itself.
 
 The callable carries the `query` conventions (`key`, `keyFor`) plus a reactive `status(...args)` read (`"idle" | "connecting" | "connected" | "reconnecting" | "closed"`) for surfacing connection state in UI.
 

package/dist/data/action.js

@@ -1,9 +1,6 @@
 import { $TRACK, action as createSolidAction, createMemo, onCleanup, getOwner } from "solid-js";
 import { isResponseEnvelope, isServer, REVALIDATE_HEADER } from "@solidjs/web";
 import { createServerReference, decodeRedirectHeaderValue, decodeResponsePayload, parseServerFunctionActionUrl, REDIRECT_HEADER, subscribeFlightData } from "@solidjs/web/server-functions";
-// The explicit /server specifier is safe here: the only call site is
-// server-guarded, so client builds tree-shake the codec away.
-import { decodeFlashCookie } from "@solidjs/web/server-functions/server";
 import { provideFlashDecoder, provideFlightConsumer, useRouter } from "../routing.js";
 import { setRouterFormHandler } from "./events.js";
 import { mockBase, setFunctionName } from "../utils.js";
@@ -116,10 +113,16 @@ function installRouterIntegrations() {
         return;
     integrationsInstalled = true;
     if (isServer) {
-        // Server-only: initSubmissions only decodes during SSR, so client builds
-        // tree-shake the codec (which now lives behind the runtime's server entry).
-        // The codec is async from @solidjs/web 2.0.0-rc.7 (encrypted cookie).
-        provideFlashDecoder(decodeFlashCookie);
+        // The codec lives behind the runtime's SERVER entry, which must stay off
+        // the client module graph entirely — a static import here shipped it to
+        // every Vite dev page (#616; prod tree-shook it, dev doesn't shake). The
+        // decoder slot must still fill synchronously (a cold-start POST-redirect-
+        // GET reads submissions on the very first render), so install a wrapper
+        // and let the first decode pull the module: the codec is async anyway
+        // (encrypted cookie, @solidjs/web 2.0.0-rc.7+) and the seeding read
+        // already parks on the decode promise; a failed load reads as "no flash",
+        // the runtime's own malformed-cookie semantics.
+        provideFlashDecoder(cookieHeader => import("@solidjs/web/server-functions/server").then(m => m.decodeFlashCookie(cookieHeader)));
     }
     else {
         setRouterFormHandler(handleFormAction);

package/dist/data/liveQuery.d.ts

@@ -18,11 +18,11 @@ export type LiveFunction<T extends (...args: any) => any> = T extends (...args:
  *   definite rejection (4xx: the transport stamps HTTP statuses onto
  *   failures) ends the channel and surfaces the error to consumers, as does
  *   a first-connect failure.
- * - Server functions are declared GET at creation (like `query`). Live
- *   queries participate in single-flight on the delivery side: a mutation's
- *   flight payload pushes straight into open channels (the mutation
- *   response is the round trip), while the post-mutation sweep leaves the
- *   healthy connection in place — the live stream stays authoritative.
+ * - Server functions are declared GET at creation (like `query`). Live keys
+ *   are neither collected for single-flight nor swept after a mutation: the
+ *   stream is the freshness mechanism, and the mutation reaches a live
+ *   query through its producer. (The flight-data hook below still adopts a
+ *   live key an integration collects itself.)
  * - Calling under preload intent warms the channel (a temporary hold keeps
  *   it open through the preload window), so navigation renders against an
  *   already-connected stream instead of holding the transition on connect

package/dist/data/liveQuery.js

@@ -205,7 +205,7 @@ function subscriberIterable(open) {
                 }
             };
             return {
-                next: () => (released ? Promise.resolve({ done: true, value: undefined }) : pull()),
+                next: () => released ? Promise.resolve({ done: true, value: undefined }) : pull(),
                 return(value) {
                     release();
                     return Promise.resolve({ done: true, value });
@@ -236,10 +236,12 @@ function push(ch, value) {
 //   connection is alive and is itself the freshness mechanism — a
 //   push-driven producer yields the mutated state on its own, and tearing
 //   down healthy connections on every mutation defeats the model.
-// - Single-flight payloads deliver INTO open channels, exactly as they seed
-//   the query cache: the mutation response is the round trip, the channel
-//   adopts the value immediately, and the live stream stays authoritative
-//   for everything after.
+// - A single-flight payload carrying a live key delivers INTO the open
+//   channel rather than reconnecting it. The router's own collector does not
+//   produce live keys (the stream is the freshness mechanism; collection
+//   for live server components is an open question — a mutation's region
+//   would outrank the standing frame stream under the transport's version
+//   policy), so this path serves an integration that collects them itself.
 let hooked = false;
 function hookRevalidate() {
     if (hooked)
@@ -293,11 +295,11 @@ function hookRevalidate() {
  *   definite rejection (4xx: the transport stamps HTTP statuses onto
  *   failures) ends the channel and surfaces the error to consumers, as does
  *   a first-connect failure.
- * - Server functions are declared GET at creation (like `query`). Live
- *   queries participate in single-flight on the delivery side: a mutation's
- *   flight payload pushes straight into open channels (the mutation
- *   response is the round trip), while the post-mutation sweep leaves the
- *   healthy connection in place — the live stream stays authoritative.
+ * - Server functions are declared GET at creation (like `query`). Live keys
+ *   are neither collected for single-flight nor swept after a mutation: the
+ *   stream is the freshness mechanism, and the mutation reaches a live
+ *   query through its producer. (The flight-data hook below still adopts a
+ *   live key an integration collects itself.)
  * - Calling under preload intent warms the channel (a temporary hold keeps
  *   it open through the preload window), so navigation renders against an
  *   already-connected stream instead of holding the transition on connect
@@ -349,7 +351,7 @@ export function liveQuery(fn, name) {
             // reads the same guarantee). Channels live in the event, retained
             // past teardown so a later consumer replays the settled value instead
             // of reinvoking; the producer still closes with its last consumer.
-            const router = (e.router || (e.router = {}));
+            const router = e.router || (e.router = {});
             const channels = router.liveChannels || (router.liveChannels = new Map());
             return subscriberIterable(() => openChannel(channels, key, () => fn(...args), false, true));
         }

package/dist/fs.d.ts

@@ -1,3 +1,4 @@
+import type { ServerPageQuery } from "./fsServer.js";
 import type { DefinedRouteFilters, RouteParams, RoutePreloadFunc, RoutePreloadFuncArgs, RouteInfo, RouteSectionComponent, StandardSchemaV1, TypedRouteConfig, ValidFilters } from "./types.js";
 /**
  * The type `defineFileRoute` hands back: `matchFilters` and `search` stay
@@ -14,6 +15,7 @@ export type FileRouteConfig<S extends string = string, T = unknown, F = undefine
 }) & {
     preload?: RoutePreloadFunc<T> | undefined;
     info?: RouteInfo | undefined;
+    query?: ServerPageQuery | undefined;
 };
 /**
  * Identity helper for a route file's `route` export that types `preload`'s
@@ -39,6 +41,8 @@ export declare function defineFileRoute<S extends string, T = unknown, const F =
     /** Standard Schema validator for this route's search params; its input type flows into the typed path proxy. */
     search?: Sch;
     info?: RouteInfo | undefined;
+    /** For a server page: the wrapper its source goes through — `query` unless named, e.g. `liveQuery`. */
+    query?: ServerPageQuery | undefined;
 }): FileRouteConfig<S, T, F, Sch>;
 /** A code-split module ref: delivered as a dynamic import. */
 export interface FileRouteLazyRef<M = Record<string, unknown>> {
@@ -54,7 +58,9 @@ export interface FileRouteEagerRef<M = Record<string, unknown>> {
 export interface FileRouteEntry {
     path: string;
     page?: boolean;
-    /** Code-split by default; an eager ref when delivered with `codeSplitting: false`. */
+    /** The page component is a `"use server"` function; its `$component` is an eager ref to the stub. */
+    server?: boolean;
+    /** Code-split by default; an eager ref when delivered with `codeSplitting: false` or for a server page. */
     $component?: FileRouteLazyRef<any> | FileRouteEagerRef<any> | undefined;
     $$route?: FileRouteEagerRef<any> | undefined;
     children?: readonly FileRouteEntry[] | undefined;

package/dist/fs.js

@@ -1,4 +1,7 @@
-import { lazy } from "solid-js";
+import { DEV, lazy } from "solid-js";
+import { isServerFunction } from "@solidjs/web";
+import { serverRoutes } from "filesystem-routing/flags";
+import * as server from "./fsServer.js";
 /**
  * Identity helper for a route file's `route` export that types `preload`'s
  * `args.params` from a pattern witness — the file's path pattern, which the
@@ -31,15 +34,36 @@ export function defineFileRoute(path, config) {
  */
 export function fileRoutes(entries) {
     const components = new Map();
-    const componentOf = (ref) => {
+    const componentOf = (entry, config) => {
+        const ref = entry.$component;
         if ("require" in ref) {
-            return ref.require().default;
+            const component = ref.require()
+                .default;
+            // A server page: the stub is the source; the file is the key (unique,
+            // and a directory prefix is a subtree for `revalidate`).
+            return serverRoutes && entry.server
+                ? server.serverRoute(component, (ref.src || entry.path).split("?")[0], config)
+                : component;
         }
         let component = components.get(ref.src);
         if (!component) {
             // moduleUrl is lazy()'s third argument as of solid 2.0.0-rc.1 (options
             // moved second); route components are default exports, so no { export }.
-            component = lazy(ref.import, undefined, ref.src);
+            component = lazy(
+            // A `"use server"` default the scanner did not see (behind a wrapper
+            // call or a re-export) — or scanned without the plugin's
+            // `serverComponents` option — was code-split like a client page:
+            // say so in development rather than mount a stub as a component.
+            DEV
+                ? () => ref.import().then(mod => {
+                    if (isServerFunction(mod.default))
+                        throw new Error(`Route module "${ref.src}" exports a server function as its page, but it ` +
+                            "was delivered as a client page. Enable `serverComponents: true` on the " +
+                            'file-routes plugin and make the `"use server"` directive the first ' +
+                            "statement of the inline default export.");
+                    return mod;
+                })
+                : ref.import, undefined, ref.src);
             components.set(ref.src, component);
         }
         return component;
@@ -49,7 +73,7 @@ export function fileRoutes(entries) {
         return {
             ...config,
             path: entry.path,
-            component: entry.$component ? componentOf(entry.$component) : undefined,
+            component: entry.$component ? componentOf(entry, config) : undefined,
             info: { ...config.info, filesystem: true },
             children: entry.children ? entry.children.map(toRoute) : undefined
         };

package/dist/fsServer.d.ts

@@ -0,0 +1,15 @@
+import type { RouteSectionComponent } from "./types.js";
+/**
+ * The wrapper a server page's source goes through: `query` unless the route
+ * config names another — `liveQuery`, imported by the route file that wants
+ * it, so only that app carries it.
+ */
+export type ServerPageQuery = (fn: (...args: any[]) => any, key: string) => (...args: any[]) => any;
+/**
+ * The server page half of the fs adapter — the only importer of `query` and
+ * `serverRouteComponent`. fs.ts reaches it behind `serverRoutes` from
+ * `filesystem-routing/flags`, so an app with no server page never bundles it.
+ */
+export declare function serverRoute(fn: (...args: any[]) => any, key: string, config?: {
+    query?: ServerPageQuery | undefined;
+}): RouteSectionComponent;

package/dist/fsServer.js

@@ -0,0 +1,10 @@
+import { query } from "./data/query.js";
+import { serverRouteComponent } from "./serverRouteComponent.js";
+/**
+ * The server page half of the fs adapter — the only importer of `query` and
+ * `serverRouteComponent`. fs.ts reaches it behind `serverRoutes` from
+ * `filesystem-routing/flags`, so an app with no server page never bundles it.
+ */
+export function serverRoute(fn, key, config) {
+    return serverRouteComponent((config?.query ?? query)(fn, key));
+}

package/dist/index.d.ts

@@ -26,4 +26,4 @@ export { int } from "./paths.js";
 export { serverRouteComponent } from "./serverRouteComponent.js";
 export type { RoutePaths, PathParamsOf, PathEnd, TypedMatchFilter, DefaultSearchTypes } from "./paths.js";
 export * from "./data/index.js";
-export type { Location, LocationChange, LocationWrite, SearchParams, MatchFilter, MatchFilters, NavigateOptions, Navigator, OutputMatch, Params, PathMatch, RouteComponent, RouteParams, RouteProps, RouteSectionProps, RoutePreloadFunc, RoutePreloadFuncArgs, RouteDefinition, RouteDescription, RouteMatch, RouterIntegration, RouterUtils, SetParams, SetSearchParams, ServerRouteArgs, ServerRouteFunction, Submission, BeforeLeaveEventArgs, TypedPath, TypedSearchPath, StandardSchemaV1 } from "./types.js";
+export type { Location, LocationChange, LocationWrite, SearchParams, MatchFilter, MatchFilters, NavigateOptions, Navigator, OutputMatch, Params, PathMatch, RouteComponent, RouteParams, RouteProps, RouteSectionProps, RoutePreloadFunc, RoutePreloadFuncArgs, RouteDefinition, RouteDescription, RouteMatch, RouterIntegration, RouterUtils, SetParams, SetSearchParams, ServerRouteArgs, ServerRouteParams, ServerRouteFunction, ServerRouteView, Submission, BeforeLeaveEventArgs, TypedPath, TypedSearchPath, StandardSchemaV1 } from "./types.js";

package/dist/index.js

@@ -1,7 +1,6 @@
 import { getOwner, runWithOwner, createMemo, createRenderEffect, onCleanup, untrack, createContext, createSignal, useContext, NotReadyError, isPending, DEV, latest, createComponent, createRoot, Show, createEffect, sharedConfig, OBSERVE, onSettled, getObserver, $TRACK, action as action$1 } from 'solid-js';
-import { registerElementClaim, delegateEvents, isServer, getRequestEvent, hasFlashCookie, clearFlashCookie, createComponent as createComponent$1, memo, isServerFunction, getServerFunctionMetadata, getServerFunctionRPC, isResponseEnvelope, REVALIDATE_HEADER, dynamic } from '@solidjs/web';
+import { registerElementClaim, delegateEvents, isServer, getRequestEvent, hasFlashCookie, clearFlashCookie, createComponent as createComponent$1, memo, dynamic, isServerFunction, getServerFunctionMetadata, getServerFunctionRPC, isResponseEnvelope, REVALIDATE_HEADER } from '@solidjs/web';
 import { REDIRECT_HEADER, decodeRedirectHeaderValue, subscribeFlightData, decodeResponsePayload, parseServerFunctionActionUrl, createServerReference } from '@solidjs/web/server-functions';
-import { decodeFlashCookie } from '@solidjs/web/server-functions/server';
 
 const hasSchemeRegex = /^(?:[a-z0-9]+:)?\/\//i;
 const trimPathRegex = /^\/+|(\/)\/+$/g;
@@ -38,6 +37,13 @@ function invariant(value, message) {
 function joinPaths(from, to) {
   return normalizePath(from).replace(/\/*(\*.*)?$/g, "") + normalizePath(to);
 }
+
+/** Run a Standard Schema synchronously — the only mode search params support. */
+function validateSearch(schema, raw) {
+  const outcome = schema["~standard"].validate(raw);
+  if (outcome instanceof Promise) throw new Error("Async Standard Schema validation is not supported for search params");
+  return outcome;
+}
 function extractSearchParams(url) {
   const params = {};
   url.searchParams.forEach((value, key) => {
@@ -536,7 +542,7 @@ const SERVER_ROUTE = Symbol("solid-router.serverRoute");
 
 /** The brand carried by a route component built with `serverRouteComponent()`, if any. */
 function serverRouteOf(component) {
-  return typeof component === "function" ? component[SERVER_ROUTE] : undefined;
+  return component?.[SERVER_ROUTE];
 }
 
 /**
@@ -547,17 +553,15 @@ function serverRouteOf(component) {
  */
 function serverRouteArgs(route, params, query) {
   const schema = route.key?.search;
-  let search = undefined;
+  let search;
   if (schema) {
-    const outcome = schema["~standard"].validate({
+    const raw = {
       ...query
-    });
-    if (outcome instanceof Promise) throw new Error("Async Standard Schema validation is not supported for search params");
+    };
+    const outcome = validateSearch(schema, raw);
     // Issues leave the raw values in place, matching useSearchParams: search
     // strings are user input, so defaults belong in the schema itself.
-    search = outcome.issues ? {
-      ...query
-    } : outcome.value;
+    search = outcome.issues ? raw : outcome.value;
   }
   return {
     params: {
@@ -566,15 +570,7 @@ function serverRouteArgs(route, params, query) {
     search
   };
 }
-function shallowEqual(a, b) {
-  if (a === b) return true;
-  if (!a || !b || typeof a !== "object" || typeof b !== "object") return false;
-  const ka = Object.keys(a);
-  const kb = Object.keys(b);
-  if (ka.length !== kb.length) return false;
-  for (const k of ka) if (a[k] !== b[k]) return false;
-  return true;
-}
+const shallowEqual = (a, b) => a === b || !!a && !!b && typeof a === "object" && typeof b === "object" && Object.keys(a).length === Object.keys(b).length && Object.keys(a).every(k => a[k] === b[k]);
 
 /**
  * Structural equality for the args memo: a navigation produces fresh match
@@ -830,8 +826,7 @@ function useSearchParams(path) {
     for (const match of router.matches()) {
       const schema = match.route.key.search;
       if (!schema) continue;
-      const outcome = schema["~standard"].validate(raw);
-      if (outcome instanceof Promise) throw new Error("Async Standard Schema validation is not supported for search params");
+      const outcome = validateSearch(schema, raw);
       if (!outcome.issues) result = Object.assign(result || {
         ...raw
       }, outcome.value);
@@ -1528,33 +1523,49 @@ function createRouterContext(integration, branches, getContext, options = {}) {
     return (to, options) => navigateFromRoute(route, to, options);
   }
   function preloadRoute(url, preloadData) {
-    const matches = getRouteMatches(branches(), url.pathname);
+    const next = getRouteMatches(branches(), url.pathname);
     // An unresolved lazy subtree in the chain: the placeholder's
     // component.preload (below) kicks the table load; once it lands,
     // preload again so the real inner routes warm too. Preloads are
     // speculative: a failed load (held sync throw or rejection) is ignored
     // here — the real navigation surfaces and retries it.
-    const boundary = matches.find(m => m.route.lazy && !m.route.lazy.resolved);
+    const boundary = next.find(m => m.route.lazy && !m.route.lazy.resolved);
     if (boundary) {
       try {
         resolveLazySubtree(boundary.route.lazy).then(() => preloadRoute(url, preloadData), () => {});
       } catch {}
     }
+    // Data preloads run only for levels a navigation would mount fresh or
+    // reuse with changed inputs: this level's params, and search as the
+    // declared schema's output or else the raw string. Navigation itself is
+    // already this selective (a matching level is reused and re-reads through
+    // tracked params), so an unchanged level has nothing new to warm.
+    let current;
+    try {
+      current = untrack(matches);
+    } catch {}
+    const query = extractSearchParams(url);
+    const inputs = (p, q, s, r) => {
+      const a = serverRouteArgs(r, p, q);
+      a.search === undefined && (a.search = s);
+      return a;
+    };
     const prevIntent = preloadIntent;
     preloadIntent = "preload";
-    for (let match in matches) {
+    for (let match in next) {
       const {
         route,
         params
-      } = matches[match];
+      } = next[match];
       route.component && route.component.preload && route.component.preload();
       const {
         preload,
         component
       } = route;
+      const now = current && current[match];
+      const unchanged = now && now.route.key === route.key && serverRouteArgsEqual(inputs(params, query, url.search, route), inputs(now.params, location.query, location.search, route));
       inPreloadFn = true;
-      preloadData && runWithOwner(getContext(), () => {
-        const query = extractSearchParams(url);
+      preloadData && !unchanged && runWithOwner(getContext(), () => {
         // A server component route's data IS its call: warm the same
         // query entry the render will read, under the same derived args.
         const server = serverRouteOf(component);
@@ -2341,6 +2352,8 @@ function createRouter(config) {
   };
   const renderPath = config.history && config.history.utils && config.history.utils.renderPath || undefined;
   const matchPath = pathname => getRouteMatches(branches(), config.transformUrl ? config.transformUrl(pathname) : pathname);
+  // a `paths` node carries its logical pathname under the Href brand
+  const pathnameOf = url => typeof url === "string" ? new URL(url, mockBase).pathname : url[HREF];
   function RouterComponent(props) {
     // One router per app: the session (location, history, delegation, link
     // claims, preloading) has a single owner, and a second instance would
@@ -2398,7 +2411,7 @@ function createRouter(config) {
     routes: config.routes,
     config,
     match(url) {
-      return matchPath(new URL(url, mockBase).pathname).map(({
+      return matchPath(pathnameOf(url)).map(({
         route,
         path,
         params
@@ -2409,6 +2422,17 @@ function createRouter(config) {
         params,
         info: route.info
       }));
+    },
+    keysFor(url) {
+      const pathname = typeof url === "string" ? new URL(url, mockBase).pathname : url[HREF];
+      const keys = [];
+      for (const {
+        route
+      } of matchPath(pathname)) {
+        const key = serverRouteOf(route.component)?.call?.key;
+        typeof key === "string" && key && !keys.includes(key) && keys.push(key);
+      }
+      return keys;
     }
   });
   // Built on first access (a getter via Object.assign would run during the
@@ -2501,6 +2525,93 @@ const useBeforeLeave = listener => {
   onCleanup(s);
 };
 
+// Server component routes (experimental — rides the experimental server
+// components surface in @solidjs/web; the arg shape may change).
+//
+// `serverRouteComponent(source)` turns a function of route arguments that
+// resolves to a component into a route `component`. It replaces the client
+// wrapper a server-component route used to need:
+//
+//   // before: a client component exists only to make the call
+//   const getStory = query(storyView, "story");
+//   component: props => {
+//     const View = dynamic(() => getStory(props.params.id));
+//     return <View>{props.children}</View>;
+//   }
+//   // after
+//   component: serverRouteComponent(query(storyView, "story"))
+//
+// The source is the app's: `query(fn, key)` for a request/response server
+// component, `liveQuery(fn, key)` for one that streams successive versions,
+// or any function of the args. The router does not choose the cache
+// strategy and does not own the key — `revalidate("story")` is the app's,
+// as it is for any query. What the router adds is the URL → call
+// translation: it derives the call's arguments from the match, mounts the
+// resolved component with the outlet as `children`, and calls the same
+// source under preload intent (link hover, `preloadRoute`, the single-flight
+// collector), so the query or live channel is warm before the navigation
+// renders against it.
+//
+// Arguments are derived, not read from a live location: the call's
+// `(function, arguments)` address keys the frame store and the query cache,
+// so the args must name precisely what the route depends on. They are the
+// params this route's pattern (with its ancestors') declares — never a
+// child's, so a layout does not refetch when a leaf param changes — and, only
+// when the route declares a `search` schema, its validated output.
+//
+// The router fills exactly one client position: `children`, with the outlet.
+// A server component that takes other client positions — handlers, refs,
+// named slots — has a client half, and that half is a client component; the
+// helper does not pretend otherwise. Write the wrapper for that route.
+/**
+ * Use a server component as a route (experimental). `source` is a function
+ * of the router-derived {@link ServerRouteArgs} — this route's `params`, and
+ * `search` when the route declares a schema — resolving to a server
+ * component: typically a `"use server"` function wrapped in `query()` or
+ * `liveQuery()`, whose key the app names and revalidates. The router mounts
+ * the result with the outlet as `children` and calls the same source under
+ * preload intent, so link hover and single-flight collection warm it.
+ *
+ * `children` is the only client position the router fills, so the server
+ * component may declare no other. One that takes client handlers, refs, or
+ * slots has a client half — write an ordinary route component for it.
+ *
+ * ```ts
+ * defineRoute({ path: "/stories/:id", component: serverRouteComponent(query(storyView, "story")) });
+ * ```
+ */
+function serverRouteComponent(
+// A source that ignores its args (an app shell) is `(...args: never[])`
+// once `query()` has typed it; that is the same call, so accept it too.
+source) {
+  const call = source;
+
+  // The value is a component only so it fits the `component` field; the
+  // router core never calls it — it mounts through the brand, with THIS
+  // level's params and the declared search output. A direct mount (a
+  // `lazy()` wrapper around the helper, a hand-written `<Route />`) would
+  // have only the merged params to call with: the same view under a second
+  // address, missing the cache and owning its own frame. Refuse it.
+  const route = () => {
+    throw new Error("serverRouteComponent(): mount it as a route's `component`" + (DEV ? " — the router derives the call from the match. It was rendered directly (through " + "lazy(), as the <Router> root, or outside a route). For an app shell, make it a " + "pathless layout route with children." : ""));
+  };
+  function render(args, routeProps) {
+    // The source may answer a component, a promise of one, or (a live query)
+    // successive components; `dynamic`'s memo lands each the same way.
+    const View = dynamic(() => call(args()));
+    return createComponent(View, {
+      get children() {
+        return routeProps.children;
+      }
+    });
+  }
+  route[SERVER_ROUTE] = {
+    call,
+    render
+  };
+  return route;
+}
+
 const LocationHeader = "Location";
 const PRELOAD_TIMEOUT$1 = 5000;
 const CACHE_TIMEOUT = 180000;
@@ -2853,91 +2964,6 @@ function isPlainObject(obj) {
   return obj != null && typeof obj === "object" && (!(proto = Object.getPrototypeOf(obj)) || proto === Object.prototype);
 }
 
-// Server component routes (experimental — rides the experimental server
-// components surface in @solidjs/web; the arg shape may change).
-//
-// `serverRouteComponent(fn)` turns a `"use server"` function that returns a
-// component into a route `component`. It replaces the client wrapper a
-// server-component route used to need:
-//
-//   // before: a client component exists only to make the call
-//   component: props => {
-//     const View = dynamic(() => getStory(props.params.id));
-//     return <View>{props.children}</View>;
-//   }
-//   // after
-//   component: serverRouteComponent(storyRoute)   // async ({ params }) => { "use server"; ... }
-//
-// The mechanism is the same one the wrapper used — `query` for cache identity
-// (preload participation, single-flight collection, revalidation after
-// actions) and `dynamic` for the equals-gated mount that morphs in place —
-// applied by the router rather than restated per route. What the router adds
-// is the URL → call translation: it derives the call's arguments from the
-// match and drives the same call from hover preload and from the single
-// flight collector, so one entry serves render, preload, and mutation
-// responses.
-//
-// Arguments are derived, not read from a live location: the call's
-// `(function, arguments)` address keys the frame store and the query cache,
-// so the args must name precisely what the route depends on. They are the
-// params this route's pattern (with its ancestors') declares — never a
-// child's, so a layout does not refetch when a leaf param changes — and, only
-// when the route declares a `search` schema, its validated output.
-//
-// The router fills exactly one client position: `children`, with the outlet.
-// A server component that takes other client positions — handlers, refs,
-// named slots — has a client half, and that half is a client component; the
-// helper does not pretend otherwise. Write the wrapper for that route.
-/**
- * Use a server component as a route (experimental). `fn` is a `"use server"`
- * function taking the router-derived {@link ServerRouteArgs} — this route's
- * `params`, and `search` when the route declares a schema — and resolving to
- * a server component. The router mounts it with the outlet as `children`,
- * warms the same call on link intent, and collects it for single-flight
- * mutation responses.
- *
- * `children` is the only client position the router fills, so the server
- * component may declare no other. One that takes client handlers, refs, or
- * slots has a client half — write an ordinary route component for it.
- *
- * ```ts
- * defineRoute({ path: "/stories/:id", component: serverRouteComponent(storyView) });
- * ```
- */
-function serverRouteComponent(fn) {
-  const reference = fn;
-  // One query entry per reference: the cache key (the function id) has to
-  // agree between the render that mounts the route, the hover preload that
-  // warms it, and the single-flight collector that re-produces its region.
-  // A server function reference always carries its build-stable id; a
-  // hand-built brand (tests) falls back to the function name.
-  const call = query(reference, "route:" + (reference.id || reference.name));
-
-  // The component itself is the fallback for a mount the router core does
-  // not drive (a plain `createComponent`): it has only the merged params to
-  // go on, so it calls with those. The core mounts through the brand with
-  // this level's params instead.
-  const route = routeProps => render(() => ({
-    params: {
-      ...routeProps.params
-    },
-    search: undefined
-  }), routeProps);
-  function render(args, routeProps) {
-    const View = dynamic(() => call(args()));
-    return createComponent(View, {
-      get children() {
-        return routeProps.children;
-      }
-    });
-  }
-  route[SERVER_ROUTE] = {
-    call,
-    render
-  };
-  return route;
-}
-
 const submitHooksSymbol = Symbol("routerActionSubmitHooks");
 const settledHooksSymbol = Symbol("routerActionSettledHooks");
 const invokeSymbol = Symbol("routerActionInvoke");
@@ -3048,10 +3074,16 @@ function installRouterIntegrations() {
   if (integrationsInstalled) return;
   integrationsInstalled = true;
   if (isServer) {
-    // Server-only: initSubmissions only decodes during SSR, so client builds
-    // tree-shake the codec (which now lives behind the runtime's server entry).
-    // The codec is async from @solidjs/web 2.0.0-rc.7 (encrypted cookie).
-    provideFlashDecoder(decodeFlashCookie);
+    // The codec lives behind the runtime's SERVER entry, which must stay off
+    // the client module graph entirely — a static import here shipped it to
+    // every Vite dev page (#616; prod tree-shook it, dev doesn't shake). The
+    // decoder slot must still fill synchronously (a cold-start POST-redirect-
+    // GET reads submissions on the very first render), so install a wrapper
+    // and let the first decode pull the module: the codec is async anyway
+    // (encrypted cookie, @solidjs/web 2.0.0-rc.7+) and the seeding read
+    // already parks on the decode promise; a failed load reads as "no flash",
+    // the runtime's own malformed-cookie semantics.
+    provideFlashDecoder(cookieHeader => import('@solidjs/web/server-functions/server').then(m => m.decodeFlashCookie(cookieHeader)));
   } else {
     setRouterFormHandler(handleFormAction);
     provideFlightConsumer(setupFlightDataConsumer);
@@ -3569,10 +3601,12 @@ function push(ch, value) {
 //   connection is alive and is itself the freshness mechanism — a
 //   push-driven producer yields the mutated state on its own, and tearing
 //   down healthy connections on every mutation defeats the model.
-// - Single-flight payloads deliver INTO open channels, exactly as they seed
-//   the query cache: the mutation response is the round trip, the channel
-//   adopts the value immediately, and the live stream stays authoritative
-//   for everything after.
+// - A single-flight payload carrying a live key delivers INTO the open
+//   channel rather than reconnecting it. The router's own collector does not
+//   produce live keys (the stream is the freshness mechanism; collection
+//   for live server components is an open question — a mutation's region
+//   would outrank the standing frame stream under the transport's version
+//   policy), so this path serves an integration that collects them itself.
 let hooked = false;
 function hookRevalidate() {
   if (hooked) return;
@@ -3618,11 +3652,11 @@ function hookRevalidate() {
  *   definite rejection (4xx: the transport stamps HTTP statuses onto
  *   failures) ends the channel and surfaces the error to consumers, as does
  *   a first-connect failure.
- * - Server functions are declared GET at creation (like `query`). Live
- *   queries participate in single-flight on the delivery side: a mutation's
- *   flight payload pushes straight into open channels (the mutation
- *   response is the round trip), while the post-mutation sweep leaves the
- *   healthy connection in place — the live stream stays authoritative.
+ * - Server functions are declared GET at creation (like `query`). Live keys
+ *   are neither collected for single-flight nor swept after a mutation: the
+ *   stream is the freshness mechanism, and the mutation reaches a live
+ *   query through its producer. (The flight-data hook below still adopts a
+ *   live key an integration collects itself.)
  * - Calling under preload intent warms the channel (a temporary hold keeps
  *   it open through the preload window), so navigation renders against an
  *   already-connected stream instead of holding the transition on connect

package/dist/routers/factory.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from "@solidjs/web";
 import type { RoutePaths } from "../paths.js";
-import type { DefinedRouteFilters, LazyRouteChildren, OutputMatch, Params, RouteDefinition, RouteInfo, RouteParams, RoutePreloadFunc, RoutePreloadFuncArgs, RouteSectionComponent, RouteSectionProps, StandardSchemaV1, ValidFilters } from "../types.js";
+import type { DefinedRouteFilters, LazyRouteChildren, OutputMatch, Params, RouteDefinition, RouteInfo, RouteParams, RoutePreloadFunc, RoutePreloadFuncArgs, RouteSectionComponent, RouteSectionProps, StandardSchemaV1, TypedPath, ValidFilters } from "../types.js";
 import type { RouterHistory } from "./history.js";
 /**
  * Identity helper that preserves literal types when the route tree is
@@ -116,6 +116,15 @@ export interface RouterInstance<R extends readonly RouteDefinition[] = RouteDefi
     readonly config: RouterConfig<R>;
     /** Pure matching against an arbitrary URL — no rendering or request context involved. Root→leaf; `[]` when nothing matches. */
     match(url: string): OutputMatch[];
+    /**
+     * The query keys of the server component routes a URL shows, root→leaf —
+     * what to name in `reload`/`respond`/`redirect`'s `revalidate` (or the
+     * client's `revalidate()`) to refetch those routes and nothing else. Route
+     * keys, not addresses: the app's `query` key for a hand-written route, the
+     * file for a file-system route. Pure matching, so it works in a server
+     * action; a `paths` node is accepted.
+     */
+    keysFor(url: string | TypedPath): string[];
 }
 export declare function createRouter<const R extends readonly RouteDefinition[]>(config: RouterConfig<R>): RouterInstance<R>;
 export {};

package/dist/routers/factory.jsx

@@ -7,7 +7,8 @@ import { DEV, OBSERVE } from "solid-js";
 import { getRequestEvent, isServer } from "@solidjs/web";
 import { setupLinkClaims } from "../claims.js";
 import { setupNativeEvents } from "../data/events.js";
-import { createPathsProxy } from "../paths.js";
+import { createPathsProxy, HREF } from "../paths.js";
+import { serverRouteOf } from "../serverRouteShared.js";
 import { createBranches, createRouterContext, getRouteMatches, mergeParams, registerFlightRouter, resolveLocationWrite, RouterContextObj, trackLazySubtrees, useOptionalContext } from "../routing.js";
 import { mockBase } from "../utils.js";
 import { Root, Routes } from "./components.jsx";
@@ -186,6 +187,8 @@ export function createRouter(config) {
     };
     const renderPath = (config.history && config.history.utils && config.history.utils.renderPath) || undefined;
     const matchPath = (pathname) => getRouteMatches(branches(), config.transformUrl ? config.transformUrl(pathname) : pathname);
+    // a `paths` node carries its logical pathname under the Href brand
+    const pathnameOf = (url) => typeof url === "string" ? new URL(url, mockBase).pathname : url[HREF];
     function RouterComponent(props) {
         // One router per app: the session (location, history, delegation, link
         // claims, preloading) has a single owner, and a second instance would
@@ -235,13 +238,22 @@ export function createRouter(config) {
         routes: config.routes,
         config,
         match(url) {
-            return matchPath(new URL(url, mockBase).pathname).map(({ route, path, params }) => ({
+            return matchPath(pathnameOf(url)).map(({ route, path, params }) => ({
                 path: route.originalPath,
                 pattern: route.pattern,
                 match: path,
                 params,
                 info: route.info
             }));
+        },
+        keysFor(url) {
+            const pathname = typeof url === "string" ? new URL(url, mockBase).pathname : url[HREF];
+            const keys = [];
+            for (const { route } of matchPath(pathname)) {
+                const key = serverRouteOf(route.component)?.call?.key;
+                typeof key === "string" && key && !keys.includes(key) && keys.push(key);
+            }
+            return keys;
         }
     });
     // Built on first access (a getter via Object.assign would run during the

package/dist/routing.js

@@ -4,7 +4,7 @@ import { runWithOwner } from "solid-js";
 import { DEV } from "solid-js";
 import { createComponent, createContext, createMemo, createSignal, getOwner, isPending, latest, NotReadyError, untrack, useContext } from "solid-js";
 import { clearFlashCookie, getRequestEvent, hasFlashCookie, isServer } from "@solidjs/web";
-import { mockBase, comparablePath, createMemoObject, extractSearchParams, invariant, resolvePath, createMatcher, joinPaths, scoreRoute, mergeSearchString, expandOptionals } from "./utils.js";
+import { mockBase, comparablePath, createMemoObject, extractSearchParams, invariant, resolvePath, createMatcher, joinPaths, scoreRoute, mergeSearchString, expandOptionals, validateSearch } from "./utils.js";
 import { HREF } from "./paths.js";
 import { serverRouteOf, serverRouteArgs, serverRouteArgsEqual } from "./serverRouteShared.js";
 const MAX_REDIRECTS = 100;
@@ -197,9 +197,7 @@ export function useSearchParams(path) {
                 const schema = match.route.key.search;
                 if (!schema)
                     continue;
-                const outcome = schema["~standard"].validate(raw);
-                if (outcome instanceof Promise)
-                    throw new Error("Async Standard Schema validation is not supported for search params");
+                const outcome = validateSearch(schema, raw);
                 if (!outcome.issues)
                     result = Object.assign(result || { ...raw }, outcome.value);
             }
@@ -881,31 +879,51 @@ export function createRouterContext(integration, branches, getContext, options =
         return ((to, options) => navigateFromRoute(route, to, options));
     }
     function preloadRoute(url, preloadData) {
-        const matches = getRouteMatches(branches(), url.pathname);
+        const next = getRouteMatches(branches(), url.pathname);
         // An unresolved lazy subtree in the chain: the placeholder's
         // component.preload (below) kicks the table load; once it lands,
         // preload again so the real inner routes warm too. Preloads are
         // speculative: a failed load (held sync throw or rejection) is ignored
         // here — the real navigation surfaces and retries it.
-        const boundary = matches.find(m => m.route.lazy && !m.route.lazy.resolved);
+        const boundary = next.find(m => m.route.lazy && !m.route.lazy.resolved);
         if (boundary) {
             try {
                 resolveLazySubtree(boundary.route.lazy).then(() => preloadRoute(url, preloadData), () => { });
             }
             catch { }
         }
+        // Data preloads run only for levels a navigation would mount fresh or
+        // reuse with changed inputs: this level's params, and search as the
+        // declared schema's output or else the raw string. Navigation itself is
+        // already this selective (a matching level is reused and re-reads through
+        // tracked params), so an unchanged level has nothing new to warm.
+        let current;
+        try {
+            current = untrack(matches);
+        }
+        catch { }
+        const query = extractSearchParams(url);
+        const inputs = (p, q, s, r) => {
+            const a = serverRouteArgs(r, p, q);
+            a.search === undefined && (a.search = s);
+            return a;
+        };
         const prevIntent = preloadIntent;
         preloadIntent = "preload";
-        for (let match in matches) {
-            const { route, params } = matches[match];
+        for (let match in next) {
+            const { route, params } = next[match];
             route.component &&
                 route.component.preload &&
                 route.component.preload();
             const { preload, component } = route;
+            const now = current && current[match];
+            const unchanged = now &&
+                now.route.key === route.key &&
+                serverRouteArgsEqual(inputs(params, query, url.search, route), inputs(now.params, location.query, location.search, route));
             inPreloadFn = true;
             preloadData &&
+                !unchanged &&
                 runWithOwner(getContext(), () => {
-                    const query = extractSearchParams(url);
                     // A server component route's data IS its call: warm the same
                     // query entry the render will read, under the same derived args.
                     const server = serverRouteOf(component);

package/dist/serverRouteComponent.d.ts

@@ -1,19 +1,20 @@
 import type { Component } from "solid-js";
-import type { Params, RouteSectionProps, ServerRouteFunction } from "./types.js";
+import type { Params, RouteSectionProps, ServerRouteFunction, ServerRouteParams, TypedRouteConfig } from "./types.js";
 /**
- * Use a server component as a route (experimental). `fn` is a `"use server"`
- * function taking the router-derived {@link ServerRouteArgs} — this route's
- * `params`, and `search` when the route declares a schema — and resolving to
- * a server component. The router mounts it with the outlet as `children`,
- * warms the same call on link intent, and collects it for single-flight
- * mutation responses.
+ * Use a server component as a route (experimental). `source` is a function
+ * of the router-derived {@link ServerRouteArgs} — this route's `params`, and
+ * `search` when the route declares a schema — resolving to a server
+ * component: typically a `"use server"` function wrapped in `query()` or
+ * `liveQuery()`, whose key the app names and revalidates. The router mounts
+ * the result with the outlet as `children` and calls the same source under
+ * preload intent, so link hover and single-flight collection warm it.
  *
  * `children` is the only client position the router fills, so the server
  * component may declare no other. One that takes client handlers, refs, or
  * slots has a client half — write an ordinary route component for it.
  *
  * ```ts
- * defineRoute({ path: "/stories/:id", component: serverRouteComponent(storyView) });
+ * defineRoute({ path: "/stories/:id", component: serverRouteComponent(query(storyView, "story")) });
  * ```
  */
-export declare function serverRouteComponent<P extends Params = Params, S = undefined>(fn: ServerRouteFunction<P, S>): Component<RouteSectionProps<unknown, P>>;
+export declare function serverRouteComponent<P extends Params | TypedRouteConfig = Params, S = undefined>(source: ServerRouteFunction<P, S> | ((...args: never[]) => ReturnType<ServerRouteFunction<P, S>>)): Component<RouteSectionProps<unknown, ServerRouteParams<P>>>;

package/dist/serverRouteComponent.js

@@ -1,26 +1,29 @@
 // Server component routes (experimental — rides the experimental server
 // components surface in @solidjs/web; the arg shape may change).
 //
-// `serverRouteComponent(fn)` turns a `"use server"` function that returns a
-// component into a route `component`. It replaces the client wrapper a
-// server-component route used to need:
+// `serverRouteComponent(source)` turns a function of route arguments that
+// resolves to a component into a route `component`. It replaces the client
+// wrapper a server-component route used to need:
 //
 //   // before: a client component exists only to make the call
+//   const getStory = query(storyView, "story");
 //   component: props => {
 //     const View = dynamic(() => getStory(props.params.id));
 //     return <View>{props.children}</View>;
 //   }
 //   // after
-//   component: serverRouteComponent(storyRoute)   // async ({ params }) => { "use server"; ... }
+//   component: serverRouteComponent(query(storyView, "story"))
 //
-// The mechanism is the same one the wrapper used — `query` for cache identity
-// (preload participation, single-flight collection, revalidation after
-// actions) and `dynamic` for the equals-gated mount that morphs in place —
-// applied by the router rather than restated per route. What the router adds
-// is the URL → call translation: it derives the call's arguments from the
-// match and drives the same call from hover preload and from the single
-// flight collector, so one entry serves render, preload, and mutation
-// responses.
+// The source is the app's: `query(fn, key)` for a request/response server
+// component, `liveQuery(fn, key)` for one that streams successive versions,
+// or any function of the args. The router does not choose the cache
+// strategy and does not own the key — `revalidate("story")` is the app's,
+// as it is for any query. What the router adds is the URL → call
+// translation: it derives the call's arguments from the match, mounts the
+// resolved component with the outlet as `children`, and calls the same
+// source under preload intent (link hover, `preloadRoute`, the single-flight
+// collector), so the query or live channel is warm before the navigation
+// renders against it.
 //
 // Arguments are derived, not read from a live location: the call's
 // `(function, arguments)` address keys the frame store and the query cache,
@@ -34,39 +37,47 @@
 // named slots — has a client half, and that half is a client component; the
 // helper does not pretend otherwise. Write the wrapper for that route.
 import { dynamic } from "@solidjs/web";
-import { createComponent } from "solid-js";
-import { query } from "./data/query.js";
+import { createComponent, DEV } from "solid-js";
 import { SERVER_ROUTE } from "./serverRouteShared.js";
 /**
- * Use a server component as a route (experimental). `fn` is a `"use server"`
- * function taking the router-derived {@link ServerRouteArgs} — this route's
- * `params`, and `search` when the route declares a schema — and resolving to
- * a server component. The router mounts it with the outlet as `children`,
- * warms the same call on link intent, and collects it for single-flight
- * mutation responses.
+ * Use a server component as a route (experimental). `source` is a function
+ * of the router-derived {@link ServerRouteArgs} — this route's `params`, and
+ * `search` when the route declares a schema — resolving to a server
+ * component: typically a `"use server"` function wrapped in `query()` or
+ * `liveQuery()`, whose key the app names and revalidates. The router mounts
+ * the result with the outlet as `children` and calls the same source under
+ * preload intent, so link hover and single-flight collection warm it.
  *
  * `children` is the only client position the router fills, so the server
  * component may declare no other. One that takes client handlers, refs, or
  * slots has a client half — write an ordinary route component for it.
  *
  * ```ts
- * defineRoute({ path: "/stories/:id", component: serverRouteComponent(storyView) });
+ * defineRoute({ path: "/stories/:id", component: serverRouteComponent(query(storyView, "story")) });
  * ```
  */
-export function serverRouteComponent(fn) {
-    const reference = fn;
-    // One query entry per reference: the cache key (the function id) has to
-    // agree between the render that mounts the route, the hover preload that
-    // warms it, and the single-flight collector that re-produces its region.
-    // A server function reference always carries its build-stable id; a
-    // hand-built brand (tests) falls back to the function name.
-    const call = query(reference, "route:" + (reference.id || reference.name));
-    // The component itself is the fallback for a mount the router core does
-    // not drive (a plain `createComponent`): it has only the merged params to
-    // go on, so it calls with those. The core mounts through the brand with
-    // this level's params instead.
-    const route = (routeProps) => render(() => ({ params: { ...routeProps.params }, search: undefined }), routeProps);
+export function serverRouteComponent(
+// A source that ignores its args (an app shell) is `(...args: never[])`
+// once `query()` has typed it; that is the same call, so accept it too.
+source) {
+    const call = source;
+    // The value is a component only so it fits the `component` field; the
+    // router core never calls it — it mounts through the brand, with THIS
+    // level's params and the declared search output. A direct mount (a
+    // `lazy()` wrapper around the helper, a hand-written `<Route />`) would
+    // have only the merged params to call with: the same view under a second
+    // address, missing the cache and owning its own frame. Refuse it.
+    const route = () => {
+        throw new Error("serverRouteComponent(): mount it as a route's `component`" +
+            (DEV
+                ? " — the router derives the call from the match. It was rendered directly (through " +
+                    "lazy(), as the <Router> root, or outside a route). For an app shell, make it a " +
+                    "pathless layout route with children."
+                : ""));
+    };
     function render(args, routeProps) {
+        // The source may answer a component, a promise of one, or (a live query)
+        // successive components; `dynamic`'s memo lands each the same way.
         const View = dynamic(() => call(args()));
         return createComponent(View, {
             get children() {

package/dist/serverRouteShared.js

@@ -1,9 +1,8 @@
+import { validateSearch } from "./utils.js";
 export const SERVER_ROUTE = Symbol("solid-router.serverRoute");
 /** The brand carried by a route component built with `serverRouteComponent()`, if any. */
 export function serverRouteOf(component) {
-    return typeof component === "function"
-        ? component[SERVER_ROUTE]
-        : undefined;
+    return component?.[SERVER_ROUTE];
 }
 /**
  * Derive a server route's call arguments from a match: the match's params
@@ -13,31 +12,23 @@ export function serverRouteOf(component) {
  */
 export function serverRouteArgs(route, params, query) {
     const schema = route.key?.search;
-    let search = undefined;
+    let search;
     if (schema) {
-        const outcome = schema["~standard"].validate({ ...query });
-        if (outcome instanceof Promise)
-            throw new Error("Async Standard Schema validation is not supported for search params");
+        const raw = { ...query };
+        const outcome = validateSearch(schema, raw);
         // Issues leave the raw values in place, matching useSearchParams: search
         // strings are user input, so defaults belong in the schema itself.
-        search = outcome.issues ? { ...query } : outcome.value;
+        search = outcome.issues ? raw : outcome.value;
     }
     return { params: { ...params }, search };
 }
-function shallowEqual(a, b) {
-    if (a === b)
-        return true;
-    if (!a || !b || typeof a !== "object" || typeof b !== "object")
-        return false;
-    const ka = Object.keys(a);
-    const kb = Object.keys(b);
-    if (ka.length !== kb.length)
-        return false;
-    for (const k of ka)
-        if (a[k] !== b[k])
-            return false;
-    return true;
-}
+const shallowEqual = (a, b) => a === b ||
+    (!!a &&
+        !!b &&
+        typeof a === "object" &&
+        typeof b === "object" &&
+        Object.keys(a).length === Object.keys(b).length &&
+        Object.keys(a).every(k => a[k] === b[k]));
 /**
  * Structural equality for the args memo: a navigation produces fresh match
  * objects even when this level's params are unchanged, and an equal call

package/dist/types.d.ts

@@ -146,19 +146,31 @@ export type RouteSectionComponent<T = unknown, P extends Params = Params> = Comp
  * the route's pattern (and its ancestors') declares, plus — only when the
  * route declares a `search` schema — that schema's validated output.
  */
-export interface ServerRouteArgs<P extends Params = Params, S = undefined> {
-    params: P;
-    search: S;
+export interface ServerRouteArgs<P extends Params | TypedRouteConfig = Params, S = undefined> {
+    params: ServerRouteParams<P>;
+    search: P extends TypedRouteConfig ? SearchOutputOf<P> : S;
 }
 /**
- * The shape `serverRouteComponent()` accepts (experimental): a `"use server"`
- * function taking the router-derived {@link ServerRouteArgs} and resolving
- * to a server component whose only client position is `children` — the route
- * outlet, which the router fills.
+ * `ServerRouteArgs<typeof route>`: a `defineFileRoute` config is a witness —
+ * params from its pattern, search from its schema — the way
+ * `RouteProps<typeof route>` reads it for a client page.
+ */
+export type ServerRouteParams<P> = P extends TypedRouteConfig<infer Pattern> ? RouteParams<Pattern> : Extract<P, Params>;
+type SearchOutputOf<Def> = Def extends {
+    search: infer Sch extends StandardSchemaV1<any, any>;
+} ? NonNullable<Sch["~standard"]["types"]>["output"] : undefined;
+/**
+ * The shape `serverRouteComponent()` accepts (experimental): a function of
+ * the router-derived {@link ServerRouteArgs} answering a server component —
+ * once (a `query`-wrapped `"use server"` function), or as successive
+ * versions (a `liveQuery`). The component's only client position is
+ * `children` — the route outlet, which the router fills.
  */
-export type ServerRouteFunction<P extends Params = Params, S = undefined> = (args: ServerRouteArgs<P, S>) => Promise<Component<{
+export type ServerRouteFunction<P extends Params | TypedRouteConfig = Params, S = undefined> = (args: ServerRouteArgs<P, S>) => ServerRouteView | Promise<ServerRouteView> | AsyncIterable<ServerRouteView>;
+/** The component a server route resolves to: `children` is its only client position. */
+export type ServerRouteView = Component<{
     children?: JSX.Element;
-}>>;
+}>;
 declare const ROUTE_PATTERN: unique symbol;
 export interface TypedRouteConfig<S extends string = string> {
     readonly [ROUTE_PATTERN]: S;
@@ -354,7 +366,8 @@ export type Submission<T, U> = {
     readonly error: any;
     readonly url: string;
     clear: () => void;
-    retry: () => void;
+    /** Re-run the action with the same input; resolves to its result, like the original call. */
+    retry: () => Promise<U>;
 };
 export interface MaybePreloadableComponent extends Component {
     preload?: () => void;

package/dist/utils.d.ts

@@ -1,4 +1,4 @@
-import type { MatchFilters, PathMatch, RouteDescription, SearchParams, SetSearchParams } from "./types.js";
+import type { StandardSchemaV1, MatchFilters, PathMatch, RouteDescription, SearchParams, SetSearchParams } from "./types.js";
 export declare const mockBase = "http://sr";
 export declare function normalizePath(path: string, omitSlash?: boolean): string;
 /** Pathname stripped of search/hash and trailing slash, lowercased — the form link matching compares. */
@@ -6,6 +6,8 @@ export declare const comparablePath: (path: string) => string;
 export declare function resolvePath(base: string, path: string, from?: string): string | undefined;
 export declare function invariant<T>(value: T | null | undefined, message: string): T;
 export declare function joinPaths(from: string, to: string): string;
+/** Run a Standard Schema synchronously — the only mode search params support. */
+export declare function validateSearch(schema: StandardSchemaV1<any, any>, raw: Record<string, any>): import("./types.js").StandardSchemaResult<any>;
 export declare function extractSearchParams(url: URL): SearchParams;
 export declare function createMatcher<S extends string>(path: S, partial?: boolean, matchFilters?: MatchFilters<S>): (location: string) => PathMatch | null;
 export declare function scoreRoute(route: RouteDescription): number;

package/dist/utils.js

@@ -35,6 +35,13 @@ export function invariant(value, message) {
 export function joinPaths(from, to) {
     return normalizePath(from).replace(/\/*(\*.*)?$/g, "") + normalizePath(to);
 }
+/** Run a Standard Schema synchronously — the only mode search params support. */
+export function validateSearch(schema, raw) {
+    const outcome = schema["~standard"].validate(raw);
+    if (outcome instanceof Promise)
+        throw new Error("Async Standard Schema validation is not supported for search params");
+    return outcome;
+}
 export function extractSearchParams(url) {
     const params = {};
     url.searchParams.forEach((value, key) => {

package/package.json

@@ -6,7 +6,7 @@
     "Ryan Turnquist"
   ],
   "license": "MIT",
-  "version": "2.0.0-next.27",
+  "version": "2.0.0-next.29",
   "homepage": "https://github.com/solidjs/solid-router#readme",
   "repository": {
     "type": "git",
@@ -52,10 +52,16 @@
   },
   "peerDependencies": {
     "@solidjs/web": "^2.0.0-rc.9",
+    "filesystem-routing": ">=0.4.0",
     "solid-js": "^2.0.0-rc.9"
   },
+  "peerDependenciesMeta": {
+    "filesystem-routing": {
+      "optional": true
+    }
+  },
   "scripts": {
-    "build": "rm -rf dist && tsc && rollup -c",
+    "build": "rm -rf dist && tsc && rollup -c && node scripts/check-fs-gate.mjs",
     "test": "vitest run && vitest run --config vitest.config.server.ts && npm run test:types",
     "test:watch": "vitest",
     "test:server": "vitest run --config vitest.config.server.ts",