@solidjs/router 0.17.0-next.5 → 0.17.0-next.6

package/dist/index.js

@@ -1,6 +1,6 @@
-import { isServer, getRequestEvent, createComponent as createComponent$1, memo, isResponseEnvelope, delegateEvents, spread, mergeProps, template } from '@solidjs/web';
-import { getOwner, runWithOwner, createMemo, createContext, onCleanup, useContext, untrack, createSignal, flush, createComponent, children, merge, createRoot, sharedConfig, getObserver, $TRACK, action as action$1, omit } from 'solid-js';
-import { decodeResponse } from '@solidjs/web/server-functions';
+import { isServer, getRequestEvent, isResponseEnvelope, createComponent as createComponent$1, memo, delegateEvents, spread, mergeProps, template } from '@solidjs/web';
+import { getOwner, runWithOwner, createMemo, createContext, onCleanup, useContext, untrack, children, createSignal, flush, createComponent, getObserver, sharedConfig, $TRACK, action as action$1, merge, createRoot, omit } from 'solid-js';
+import { isServerFunction, getServerFunctionMetadata, GET, decodeResponse, subscribeFlightData } from '@solidjs/web/server-functions';
 
 function createBeforeLeave() {
   let listeners = new Set();
@@ -258,6 +258,63 @@ function setFunctionName(obj, value) {
   return obj;
 }
 
+// The no-JS form convention's cookie codec. When a form posts to a server
+// function without the client runtime (no instance header), the server
+// handler redirects back carrying the outcome in a one-shot "flash" cookie;
+// the next SSR pass reads it here and seeds the router's submission state so
+// useSubmission() renders the result exactly as a scripted submission would.
+// Both halves live in this module so the write (src/server.ts, the handler's
+// handleNoJS) and the read (src/routing.ts, SSR initialization) can never
+// drift apart.
+
+const FLASH_COOKIE = "flash";
+function decodeInputValue(value) {
+  if (value && typeof value === "object") {
+    if (Array.isArray(value.$f)) {
+      const form = new FormData();
+      for (const [k, v] of value.$f) form.append(k, v);
+      return form;
+    }
+    if (Array.isArray(value.$u)) return new URLSearchParams(value.$u);
+  }
+  return value;
+}
+
+/** The Set-Cookie value clearing the flash cookie after it has been read. */
+function clearFlashCookie() {
+  return `${FLASH_COOKIE}=; Max-Age=0; Path=/`;
+}
+const FLASH_MATCHER = new RegExp(`(?:^|;\\s*)${FLASH_COOKIE}=([^;]+)`);
+
+/** Whether a Cookie header carries a flash cookie (readable or not). */
+function hasFlashCookie(cookieHeader) {
+  return !!cookieHeader && FLASH_MATCHER.test(cookieHeader);
+}
+
+/**
+ * Decodes the flash cookie out of a request's Cookie header. Returns
+ * undefined when absent or unreadable (a malformed cookie must never take
+ * down SSR — it is cleared either way).
+ */
+function decodeFlashCookie(cookieHeader) {
+  if (!cookieHeader) return;
+  const match = cookieHeader.match(FLASH_MATCHER);
+  if (!match) return;
+  try {
+    const payload = JSON.parse(decodeURIComponent(match[1]));
+    if (!payload || !payload.result) return;
+    const result = payload.error ? new Error(payload.result) : payload.result;
+    return {
+      input: Array.isArray(payload.input) ? payload.input.map(decodeInputValue) : [],
+      url: payload.url,
+      result: payload.thrown ? undefined : result,
+      error: payload.thrown ? result : undefined
+    };
+  } catch (error) {
+    console.error(error);
+  }
+}
+
 const MAX_REDIRECTS = 100;
 
 /** Consider this API opaque and internal. It is likely to change in the future. */
@@ -548,6 +605,17 @@ function createBranch(routes, index = 0) {
 function asArray(value) {
   return Array.isArray(value) ? value : [value];
 }
+
+/**
+ * Resolves the route tree an app hands the router — JSX `<Route>` children
+ * (`Route` is a data-holder component, evaluating to its merged props),
+ * config objects, arrays, or thunks producing either — into route
+ * definitions. Shared by the `<Router>` component (which keeps the
+ * resolution live) and the server integration's preload runner (one-shot).
+ */
+function resolveRouteDefinitions(routes) {
+  return children(() => routes);
+}
 function createBranches(routeDef, base = "", stack = [], branches = []) {
   const routeDefs = asArray(routeDef);
   for (let i = 0, len = routeDefs.length; i < len; i++) {
@@ -838,11 +906,26 @@ function createRouterContext(integration, branches, getContext, options = {}) {
     }
     intent = prevIntent;
   }
+
+  // Seeds the initial submission from a no-JS form post: the server
+  // function handler redirected back with the outcome in a one-shot flash
+  // cookie (see src/server.ts's handleNoJS), which is read here — and
+  // cleared — so the post-redirect SSR renders useSubmission() state
+  // exactly as a scripted submission would. An explicitly pre-seeded
+  // `event.router.submission` (framework integrations) takes precedence.
   function initFromFlash() {
     const e = getRequestEvent();
-    if (!(e && e.router && e.router.submission)) return [];
+    if (!e) return [];
+    let submission = e.router && e.router.submission;
+    if (!submission) {
+      const cookieHeader = e.request.headers.get("cookie");
+      submission = decodeFlashCookie(cookieHeader);
+      // one-shot: clear it even when unreadable so it can't haunt later renders
+      if (hasFlashCookie(cookieHeader) && e.response && e.response.headers) e.response.headers.append("Set-Cookie", clearFlashCookie());
+    }
+    if (!submission) return [];
     return [{
-      ...e.router.submission,
+      ...submission,
       clear() {},
       retry() {}
     }];
@@ -892,327 +975,99 @@ function createRouteContext(router, parent, outlet, match, matches = () => [matc
   return route;
 }
 
-const createRouterComponent = router => function IntegratedRouter(props) {
-  const {
-    base,
-    singleFlight,
-    transformUrl,
-    root,
-    rootPreload,
-    routeChildren
-  } = untrack(() => ({
-    base: props.base,
-    singleFlight: props.singleFlight,
-    transformUrl: props.transformUrl,
-    root: props.root,
-    rootPreload: props.rootPreload,
-    routeChildren: props.children
-  }));
-  const routeDefs = children(() => routeChildren);
-  const branches = createMemo(() => createBranches(routeDefs(), base || ""));
-  let context;
-  const routerState = createRouterContext(router, branches, () => context, {
-    base,
-    singleFlight,
-    transformUrl
-  });
-  router.create && router.create(routerState);
-  return createComponent$1(RouterContextObj, {
-    value: routerState,
-    get children() {
-      return createComponent$1(Root, {
-        routerState: routerState,
-        root: root,
-        preload: rootPreload,
-        get children() {
-          return [memo(() => (context = getOwner()) && null), createComponent$1(Routes, {
-            routerState: routerState,
-            get branches() {
-              return branches();
-            }
-          })];
-        }
-      });
+const LocationHeader = "Location";
+const PRELOAD_TIMEOUT = 5000;
+const CACHE_TIMEOUT = 180000;
+let cacheMap = new Map();
+
+// cleanup forward/back cache
+if (!isServer) {
+  setInterval(() => {
+    const now = Date.now();
+    for (let [k, v] of cacheMap.entries()) {
+      if (!v[4].count && now - v[0] > CACHE_TIMEOUT) {
+        cacheMap.delete(k);
+      }
     }
+  }, 300000);
+}
+function getCache() {
+  if (!isServer) return cacheMap;
+  const req = getRequestEvent();
+  if (!req) throw new Error("Cannot find cache context");
+  return (req.router || (req.router = {})).cache || (req.router.cache = new Map());
+}
+
+/**
+ * Revalidates the given cache entry/entries.
+ */
+function revalidate(key, force = true) {
+  const now = Date.now();
+  cacheKeyOp(key, entry => {
+    force && (entry[0] = 0); //force cache miss
+    entry[4][1](now); // retrigger live signals
   });
-};
-function Root(props) {
-  const location = props.routerState.location;
-  const params = props.routerState.params;
-  const data = createMemo(() => props.preload && untrack(() => {
-    setInPreloadFn(true);
-    props.preload({
-      params,
-      location,
-      intent: getIntent() || "initial"
-    });
-    setInPreloadFn(false);
-  }));
-  const RootComp = props.root;
-  if (RootComp) {
-    return createComponent$1(RootComp, {
-      params: params,
-      location: location,
-      get data() {
-        return data();
-      },
-      get children() {
-        return props.children;
-      }
-    });
+}
+function cacheKeyOp(key, fn) {
+  key && !Array.isArray(key) && (key = [key]);
+  for (let k of cacheMap.keys()) {
+    if (key === undefined || matchKey(k, key)) fn(cacheMap.get(k));
   }
-  return props.children;
 }
-function Routes(props) {
-  if (isServer) {
-    const e = getRequestEvent();
-    if (e && e.router && e.router.dataOnly) {
-      dataOnly(e, props.routerState, props.branches);
-      return;
-    }
-    e && ((e.router || (e.router = {})).matches || (e.router.matches = props.routerState.matches().map(({
-      route,
-      path,
-      params
-    }) => ({
-      path: route.originalPath,
-      pattern: route.pattern,
-      match: path,
-      params,
-      info: route.info
-    }))));
+function query(fn, name) {
+  // query implies GET: the router primitive is the declaration site, so a
+  // server function handed to query() is wrapped with core `GET(fn)` here,
+  // at query-creation (module scope) — the server half records the method
+  // declaration for dispatch, the client half swaps in the GET transport.
+  // An explicit `GET(fn)` already carries the declaration on the metadata
+  // channel (`getServerFunctionMetadata(fn)?.method === "GET"`) and passes
+  // through; non-server functions are untouched.
+  if (isServerFunction(fn) && !getServerFunctionMetadata(fn)?.method) {
+    fn = GET(fn);
   }
-  const disposers = [];
-  let root;
-  let prevMatches;
-  // dispose the detached per-route roots when this component unmounts, otherwise
-  // they stay subscribed to `matches` and crash on a later navigation (#451)
-  onCleanup(() => disposers.forEach(dispose => dispose()));
-  // Route roots must outlive re-runs of the `routeStates` memo below, so they
-  // are created under the owner of this component rather than the memo's
-  // computation (which disposes its children every time it re-runs).
-  const owner = getOwner();
-  const routeStates = createMemo(prev => {
-    const nextMatches = props.routerState.matches();
-    const previousMatches = prevMatches;
-    let equal = previousMatches && nextMatches.length === previousMatches.length;
-    const next = [];
-    for (let i = 0, len = nextMatches.length; i < len; i++) {
-      const prevMatch = previousMatches && previousMatches[i];
-      const nextMatch = nextMatches[i];
-      if (prev && prevMatch && nextMatch.route.key === prevMatch.route.key) {
-        next[i] = prev[i];
-      } else {
-        equal = false;
-        if (disposers[i]) {
-          disposers[i]();
+  const cachedFn = (...args) => {
+    const cache = getCache();
+    const intent = getIntent();
+    const inPreloadFn = getInPreloadFn();
+    const owner = getOwner();
+    const navigate = owner ? useNavigate() : undefined;
+    const now = Date.now();
+    const key = name + hashKey(args);
+    let cached = cache.get(key);
+    let tracking;
+    if (isServer) {
+      const e = getRequestEvent();
+      if (e) {
+        const dataOnly = (e.router || (e.router = {})).dataOnly;
+        if (dataOnly) {
+          const data = e && (e.router.data || (e.router.data = {}));
+          if (data && key in data) return data[key];
+          if (Array.isArray(dataOnly) && !matchKey(key, dataOnly)) {
+            data[key] = undefined;
+            return Promise.resolve();
+          }
         }
-        runWithOwner(owner, () => createRoot(dispose => {
-          disposers[i] = dispose;
-          const routeKey = nextMatch.route.key;
-          // Retain the last matches in which this route participated so
-          // that its components and preloads never observe another
-          // route's params/path while this route is being torn down.
-          const matchesAtLevel = createMemo(prev => {
-            const routeMatches = props.routerState.matches();
-            const m = routeMatches[i];
-            return m && m.route.key === routeKey ? routeMatches : prev || nextMatches;
-          });
-          next[i] = createRouteContext(props.routerState, next[i - 1] || props.routerState.base, createOutlet(() => routeStates()?.[i + 1]), () => matchesAtLevel()[i], matchesAtLevel);
-        }));
       }
     }
-    disposers.splice(nextMatches.length).forEach(dispose => dispose());
-    if (prev && equal) {
-      prevMatches = nextMatches;
-      return prev;
-    }
-    root = next[0];
-    prevMatches = nextMatches;
-    return next;
-  });
-  const outlet = createOutlet(() => routeStates() && root);
-  return memo(outlet);
-}
-const createOutlet = child => {
-  return () => {
-    const c = child();
-    if (c) {
-      return createComponent$1(RouteContextObj, {
-        value: c,
-        get children() {
-          return c.outlet();
-        }
-      });
+    if (getObserver() && !isServer) {
+      tracking = true;
+      onCleanup(() => cached[4].count--);
     }
-    return undefined;
-  };
-};
-const Route = props => {
-  const childRoutes = children(() => props.children);
-  return merge(props, {
-    get children() {
-      return childRoutes();
-    }
-  });
-};
-
-// for data only mode with single flight mutations
-function dataOnly(event, routerState, branches) {
-  const url = new URL(event.request.url);
-  const prevMatches = getRouteMatches(branches, new URL(event.router.previousUrl || event.request.url).pathname);
-  const matches = getRouteMatches(branches, url.pathname);
-  for (let match = 0; match < matches.length; match++) {
-    if (!prevMatches[match] || matches[match].route !== prevMatches[match].route) event.router.dataOnly = true;
-    const {
-      route,
-      params
-    } = matches[match];
-    route.preload && route.preload({
-      params,
-      location: routerState.location,
-      intent: "preload"
-    });
-  }
-}
-
-function createRouter(config) {
-  let ignore = false;
-  const wrap = value => typeof value === "string" ? {
-    value
-  } : value;
-  const [read, write] = createSignal(wrap(config.get()), {
-    equals: (a, b) => a.value === b.value && a.state === b.state,
-    ownedWrite: true
-  });
-  const signal = [read, next => {
-    !ignore && config.set(next);
-    if (sharedConfig.registry && !sharedConfig.done) sharedConfig.done = true;
-    write(next);
-  }];
-  config.init && onCleanup(config.init((value = config.get()) => {
-    ignore = true;
-    signal[1](wrap(value));
-    ignore = false;
-  }));
-  return createRouterComponent({
-    signal,
-    create: config.create,
-    utils: config.utils
-  });
-}
-function bindEvent(target, type, handler) {
-  target.addEventListener(type, handler);
-  return () => target.removeEventListener(type, handler);
-}
-function scrollToHash(hash, fallbackTop) {
-  const el = hash && document.getElementById(hash);
-  if (el) {
-    el.scrollIntoView();
-  } else if (fallbackTop) {
-    window.scrollTo(0, 0);
-  }
-}
-
-function getPath(url) {
-  const u = new URL(url);
-  return u.pathname + u.search;
-}
-function StaticRouter(props) {
-  let e;
-  const obj = {
-    value: props.url || (e = getRequestEvent()) && getPath(e.request.url) || ""
-  };
-  return createRouterComponent({
-    signal: [() => obj, next => Object.assign(obj, next)]
-  })(props);
-}
-
-const LocationHeader = "Location";
-const PRELOAD_TIMEOUT = 5000;
-const CACHE_TIMEOUT = 180000;
-let cacheMap = new Map();
-
-// cleanup forward/back cache
-if (!isServer) {
-  setInterval(() => {
-    const now = Date.now();
-    for (let [k, v] of cacheMap.entries()) {
-      if (!v[4].count && now - v[0] > CACHE_TIMEOUT) {
-        cacheMap.delete(k);
-      }
-    }
-  }, 300000);
-}
-function getCache() {
-  if (!isServer) return cacheMap;
-  const req = getRequestEvent();
-  if (!req) throw new Error("Cannot find cache context");
-  return (req.router || (req.router = {})).cache || (req.router.cache = new Map());
-}
-
-/**
- * Revalidates the given cache entry/entries.
- */
-function revalidate(key, force = true) {
-  const now = Date.now();
-  cacheKeyOp(key, entry => {
-    force && (entry[0] = 0); //force cache miss
-    entry[4][1](now); // retrigger live signals
-  });
-}
-function cacheKeyOp(key, fn) {
-  key && !Array.isArray(key) && (key = [key]);
-  for (let k of cacheMap.keys()) {
-    if (key === undefined || matchKey(k, key)) fn(cacheMap.get(k));
-  }
-}
-function query(fn, name) {
-  // prioritize GET for server functions
-  if (fn.GET) fn = fn.GET;
-  const cachedFn = (...args) => {
-    const cache = getCache();
-    const intent = getIntent();
-    const inPreloadFn = getInPreloadFn();
-    const owner = getOwner();
-    const navigate = owner ? useNavigate() : undefined;
-    const now = Date.now();
-    const key = name + hashKey(args);
-    let cached = cache.get(key);
-    let tracking;
-    if (isServer) {
-      const e = getRequestEvent();
-      if (e) {
-        const dataOnly = (e.router || (e.router = {})).dataOnly;
-        if (dataOnly) {
-          const data = e && (e.router.data || (e.router.data = {}));
-          if (data && key in data) return data[key];
-          if (Array.isArray(dataOnly) && !matchKey(key, dataOnly)) {
-            data[key] = undefined;
-            return Promise.resolve();
-          }
-        }
-      }
-    }
-    if (getObserver() && !isServer) {
-      tracking = true;
-      onCleanup(() => cached[4].count--);
-    }
-    if (cached && cached[0] && (isServer || intent === "native" || cached[4].count || Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
-      if (tracking) {
-        cached[4].count++;
-        cached[4][0](); // track
-      }
-      if (cached[3] === "preload" && intent !== "preload") {
-        cached[0] = now;
-      }
-      let res = cached[1];
-      if (intent !== "preload") {
-        res = "then" in cached[1] ? cached[1].then(handleResponse(false), handleResponse(true)) : handleResponse(false)(cached[1]);
-        !isServer && intent === "navigate" && cached[4][1](cached[0]); // update version
-      }
-      inPreloadFn && "then" in res && res.catch(() => {});
-      return res;
+    if (cached && cached[0] && (isServer || intent === "native" || cached[4].count || Date.now() - cached[0] < PRELOAD_TIMEOUT)) {
+      if (tracking) {
+        cached[4].count++;
+        cached[4][0](); // track
+      }
+      if (cached[3] === "preload" && intent !== "preload") {
+        cached[0] = now;
+      }
+      let res = cached[1];
+      if (intent !== "preload") {
+        res = "then" in cached[1] ? cached[1].then(handleResponse(false), handleResponse(true)) : handleResponse(false)(cached[1]);
+        !isServer && intent === "navigate" && cached[4][1](cached[0]); // update version
+      }
+      inPreloadFn && "then" in res && res.catch(() => {});
+      return res;
     }
     let res;
     if (!isServer && sharedConfig.has && sharedConfig.has(key)) {
@@ -1362,11 +1217,10 @@ function actionImpl(fn, options = {}) {
     const form = this.f;
     const submitHooks = current[submitHooksSymbol];
     const settledHooks = current[settledHooksSymbol];
-    const runMutation = () => (router.singleFlight && fn.withOptions ? fn.withOptions({
-      headers: {
-        "X-Single-Flight": "true"
-      }
-    }) : fn)(...variables);
+    // Single-flight opt-in is no longer per call: the router's registered
+    // flight-data consumer (see setupFlightDataConsumer) makes the transport
+    // send the request header itself, so the mutation is just called.
+    const runMutation = () => fn(...variables);
     const run = action$1(async function* (context) {
       context.optimistic?.();
       try {
@@ -1480,11 +1334,54 @@ async function settleActionResult(result) {
   }
   return result;
 }
+
+/**
+ * Registers the router as the single-flight consumer of the server function
+ * transport. Subscribing is the opt-in: while registered, the transport
+ * sends the `X-Single-Flight` request header on mutations and delivers the
+ * folded payload here — fresh route data is seeded into the `query` cache
+ * and the envelope metadata (redirect `Location`, `X-Revalidate` keys) is
+ * applied, all before the action sees its plain return value. Called by the
+ * Router component on the client unless `singleFlight={false}`, which now
+ * simply means "never subscribe" — no consumer, no request header, no
+ * collection work on the server. Returns the unsubscribe function.
+ */
+function setupFlightDataConsumer(router) {
+  return subscribeFlightData((data, {
+    response
+  }) => applyResponseMetadata(response, router.navigatorFactory(), data));
+}
+
+/**
+ * Applies a server function response's integration metadata: `X-Revalidate`
+ * keys invalidate, `Location` navigates (hard for absolute urls), flight
+ * data seeds the query cache, and matching entries revalidate. Shared by
+ * the flight-data consumer and the action response path (which still sees
+ * metadata-bearing responses when no flight data was collected).
+ */
+async function applyResponseMetadata(metadata, navigate, flightData) {
+  let keys;
+  if (metadata) {
+    if (metadata.headers.has("X-Revalidate")) keys = metadata.headers.get("X-Revalidate").split(",");
+    if (metadata.headers.has("Location")) {
+      const locationUrl = metadata.headers.get("Location") || "/";
+      if (locationUrl.startsWith("http")) {
+        window.location.href = locationUrl;
+      } else {
+        navigate(locationUrl);
+      }
+    }
+  }
+  // invalidate
+  cacheKeyOp(keys, entry => entry[0] = 0);
+  // set cache
+  flightData && Object.keys(flightData).forEach(k => query.set(k, flightData[k]));
+  // trigger revalidation
+  await revalidate(keys, false);
+}
 async function handleResponse(response, error, navigate) {
   let data;
-  let custom;
-  let keys;
-  let flightKeys;
+  let flightData;
   let metadata;
   if (isResponseEnvelope(response)) {
     // client-only respond(): the value rides in memory beside the metadata
@@ -1492,40 +1389,268 @@ async function handleResponse(response, error, navigate) {
     metadata = response.response;
   } else if (response instanceof Response) {
     metadata = response;
-    // responses the transport hands over whole (redirects, revalidation,
-    // single-flight) carry a codec-encoded body the router decodes itself
+    // responses the transport hands over whole (redirects, revalidation)
+    // carry a codec-encoded body the router decodes itself. With the
+    // flight-data consumer registered single-flight payloads never reach
+    // this path, but a manually opted-in call (no consumer) still can —
+    // unwrap the standardized { value, data } shape for it too.
     if (response.body) {
       data = await decodeResponse(response);
       if (response.headers.has("X-Single-Flight")) {
-        custom = data;
-        data = custom._$value;
-        delete custom._$value;
-        flightKeys = Object.keys(custom);
+        const payload = data;
+        data = payload.value;
+        flightData = payload.data;
       }
     }
   } else if (error) return {
     error: response
   };else data = response;
-  if (metadata) {
-    if (metadata.headers.has("X-Revalidate")) keys = metadata.headers.get("X-Revalidate").split(",");
-    if (metadata.headers.has("Location")) {
-      const locationUrl = metadata.headers.get("Location") || "/";
-      if (locationUrl.startsWith("http")) {
-        window.location.href = locationUrl;
+  await applyResponseMetadata(metadata, navigate, flightData);
+  return data != null ? {
+    data
+  } : undefined;
+}
+
+const createRouterComponent = router => function IntegratedRouter(props) {
+  const {
+    base,
+    singleFlight,
+    transformUrl,
+    root,
+    rootPreload,
+    routeChildren
+  } = untrack(() => ({
+    base: props.base,
+    singleFlight: props.singleFlight,
+    transformUrl: props.transformUrl,
+    root: props.root,
+    rootPreload: props.rootPreload,
+    routeChildren: props.children
+  }));
+  const routeDefs = resolveRouteDefinitions(routeChildren);
+  const branches = createMemo(() => createBranches(routeDefs(), base || ""));
+  let context;
+  const routerState = createRouterContext(router, branches, () => context, {
+    base,
+    singleFlight,
+    transformUrl
+  });
+  router.create && router.create(routerState);
+  if (!isServer && routerState.singleFlight) {
+    // Registering the consumer IS the single-flight opt-in: the transport
+    // sends the request header while one is subscribed. `singleFlight={false}`
+    // simply never subscribes, so the server is never asked to collect.
+    onCleanup(setupFlightDataConsumer(routerState));
+  }
+  return createComponent$1(RouterContextObj, {
+    value: routerState,
+    get children() {
+      return createComponent$1(Root, {
+        routerState: routerState,
+        root: root,
+        preload: rootPreload,
+        get children() {
+          return [memo(() => (context = getOwner()) && null), createComponent$1(Routes, {
+            routerState: routerState,
+            get branches() {
+              return branches();
+            }
+          })];
+        }
+      });
+    }
+  });
+};
+function Root(props) {
+  const location = props.routerState.location;
+  const params = props.routerState.params;
+  const data = createMemo(() => props.preload && untrack(() => {
+    setInPreloadFn(true);
+    props.preload({
+      params,
+      location,
+      intent: getIntent() || "initial"
+    });
+    setInPreloadFn(false);
+  }));
+  const RootComp = props.root;
+  if (RootComp) {
+    return createComponent$1(RootComp, {
+      params: params,
+      location: location,
+      get data() {
+        return data();
+      },
+      get children() {
+        return props.children;
+      }
+    });
+  }
+  return props.children;
+}
+function Routes(props) {
+  if (isServer) {
+    const e = getRequestEvent();
+    if (e && e.router && e.router.dataOnly) {
+      dataOnly(e, props.routerState, props.branches);
+      return;
+    }
+    e && ((e.router || (e.router = {})).matches || (e.router.matches = props.routerState.matches().map(({
+      route,
+      path,
+      params
+    }) => ({
+      path: route.originalPath,
+      pattern: route.pattern,
+      match: path,
+      params,
+      info: route.info
+    }))));
+  }
+  const disposers = [];
+  let root;
+  let prevMatches;
+  // dispose the detached per-route roots when this component unmounts, otherwise
+  // they stay subscribed to `matches` and crash on a later navigation (#451)
+  onCleanup(() => disposers.forEach(dispose => dispose()));
+  // Route roots must outlive re-runs of the `routeStates` memo below, so they
+  // are created under the owner of this component rather than the memo's
+  // computation (which disposes its children every time it re-runs).
+  const owner = getOwner();
+  const routeStates = createMemo(prev => {
+    const nextMatches = props.routerState.matches();
+    const previousMatches = prevMatches;
+    let equal = previousMatches && nextMatches.length === previousMatches.length;
+    const next = [];
+    for (let i = 0, len = nextMatches.length; i < len; i++) {
+      const prevMatch = previousMatches && previousMatches[i];
+      const nextMatch = nextMatches[i];
+      if (prev && prevMatch && nextMatch.route.key === prevMatch.route.key) {
+        next[i] = prev[i];
       } else {
-        navigate(locationUrl);
+        equal = false;
+        if (disposers[i]) {
+          disposers[i]();
+        }
+        runWithOwner(owner, () => createRoot(dispose => {
+          disposers[i] = dispose;
+          const routeKey = nextMatch.route.key;
+          // Retain the last matches in which this route participated so
+          // that its components and preloads never observe another
+          // route's params/path while this route is being torn down.
+          const matchesAtLevel = createMemo(prev => {
+            const routeMatches = props.routerState.matches();
+            const m = routeMatches[i];
+            return m && m.route.key === routeKey ? routeMatches : prev || nextMatches;
+          });
+          next[i] = createRouteContext(props.routerState, next[i - 1] || props.routerState.base, createOutlet(() => routeStates()?.[i + 1]), () => matchesAtLevel()[i], matchesAtLevel);
+        }));
       }
     }
+    disposers.splice(nextMatches.length).forEach(dispose => dispose());
+    if (prev && equal) {
+      prevMatches = nextMatches;
+      return prev;
+    }
+    root = next[0];
+    prevMatches = nextMatches;
+    return next;
+  });
+  const outlet = createOutlet(() => routeStates() && root);
+  return memo(outlet);
+}
+const createOutlet = child => {
+  return () => {
+    const c = child();
+    if (c) {
+      return createComponent$1(RouteContextObj, {
+        value: c,
+        get children() {
+          return c.outlet();
+        }
+      });
+    }
+    return undefined;
+  };
+};
+const Route = props => {
+  const childRoutes = children(() => props.children);
+  return merge(props, {
+    get children() {
+      return childRoutes();
+    }
+  });
+};
+
+// for data only mode with single flight mutations
+function dataOnly(event, routerState, branches) {
+  const url = new URL(event.request.url);
+  const prevMatches = getRouteMatches(branches, new URL(event.router.previousUrl || event.request.url).pathname);
+  const matches = getRouteMatches(branches, url.pathname);
+  for (let match = 0; match < matches.length; match++) {
+    if (!prevMatches[match] || matches[match].route !== prevMatches[match].route) event.router.dataOnly = true;
+    const {
+      route,
+      params
+    } = matches[match];
+    route.preload && route.preload({
+      params,
+      location: routerState.location,
+      intent: "preload"
+    });
   }
-  // invalidate
-  cacheKeyOp(keys, entry => entry[0] = 0);
-  // set cache
-  flightKeys && flightKeys.forEach(k => query.set(k, custom[k]));
-  // trigger revalidation
-  await revalidate(keys, false);
-  return data != null ? {
-    data
-  } : undefined;
+}
+
+function createRouter(config) {
+  let ignore = false;
+  const wrap = value => typeof value === "string" ? {
+    value
+  } : value;
+  const [read, write] = createSignal(wrap(config.get()), {
+    equals: (a, b) => a.value === b.value && a.state === b.state,
+    ownedWrite: true
+  });
+  const signal = [read, next => {
+    !ignore && config.set(next);
+    if (sharedConfig.registry && !sharedConfig.done) sharedConfig.done = true;
+    write(next);
+  }];
+  config.init && onCleanup(config.init((value = config.get()) => {
+    ignore = true;
+    signal[1](wrap(value));
+    ignore = false;
+  }));
+  return createRouterComponent({
+    signal,
+    create: config.create,
+    utils: config.utils
+  });
+}
+function bindEvent(target, type, handler) {
+  target.addEventListener(type, handler);
+  return () => target.removeEventListener(type, handler);
+}
+function scrollToHash(hash, fallbackTop) {
+  const el = hash && document.getElementById(hash);
+  if (el) {
+    el.scrollIntoView();
+  } else if (fallbackTop) {
+    window.scrollTo(0, 0);
+  }
+}
+
+function getPath(url) {
+  const u = new URL(url);
+  return u.pathname + u.search;
+}
+function StaticRouter(props) {
+  let e;
+  const obj = {
+    value: props.url || (e = getRequestEvent()) && getPath(e.request.url) || ""
+  };
+  return createRouterComponent({
+    signal: [() => obj, next => Object.assign(obj, next)]
+  })(props);
 }
 
 function setupNativeEvents({