@solidjs/router 2.0.0-next.36 → 2.0.0-next.38

package/dist/index.js

@@ -1,5 +1,5 @@
-import { getOwner, runWithOwner, createMemo, createRenderEffect, onCleanup, untrack, createContext, createSignal, useContext, NotReadyError, DEV, isPending, latest, createComponent, createRoot, Show, createEffect, OBSERVE, onSettled, getObserver, isHydrating, isHydratable, $TRACK, action as action$1 } from 'solid-js';
-import { registerElementClaim, delegateEvents, isServer, getRequestEvent, hasFlashCookie, clearFlashCookie, createComponent as createComponent$1, memo, dynamic, isServerFunction, getServerFunctionMetadata, getServerFunctionRPC, takeHydrationValue, isResponseEnvelope, REVALIDATE_HEADER, getHydrationWriter } from '@solidjs/web';
+import { getOwner, runWithOwner, createMemo, createRenderEffect, onCleanup, untrack, isPending, NotReadyError, DEV, latest, createContext, createSignal, useContext, createComponent, createOwner, createRoot, Show, onSettled, isHydrating, OBSERVE, getObserver, isHydratable, $TRACK, action as action$1 } from 'solid-js';
+import { registerElementClaim, delegateEvents, dispatchAsInteraction, isServer, getRequestEvent, hasFlashCookie, clearFlashCookie, createComponent as createComponent$1, memo, dynamicComponent, isServerFunction, getServerFunctionMetadata, getServerFunctionRPC, takeHydrationValue, isResponseEnvelope, REVALIDATE_HEADER, getHydrationWriter } from '@solidjs/web';
 import { REDIRECT_HEADER, decodeRedirectHeaderValue, subscribeFlightData, decodeResponsePayload, parseServerFunctionActionUrl, createServerReference } from '@solidjs/web/server-functions';
 
 const hasSchemeRegex = /^(?:[a-z0-9]+:)?\/\//i;
@@ -37,28 +37,35 @@ const comparableQuery = search => {
 };
 
 /**
- * The link-state rule shared by claimed anchors and `useLinkState`, given
- * the location and a link's already-resolved target (path, optional query
- * and hash):
+ * The link-state rule shared by claimed anchors and `useLinkState`, bound to
+ * a location so links matched against the same one share its parse. The
+ * returned matcher takes a link's already-resolved target (path, optional
+ * query and hash):
  *
  * - `current` — same pathname and same query (parameter order and hash aside)
  * - `active` — same pathname or one under it; the router's root (`base`, or
  *   `/` without one) only matches exactly, since it is a prefix of every
  *   page. `end` makes every link exact-only.
  */
-function matchLink(location, target, base, end) {
-  if (target === undefined) return {
-    active: false,
-    current: false
-  };
-  const loc = comparablePath(location.pathname);
-  const path = comparablePath(target);
-  const exact = loc === path;
-  const hashless = target.split("#", 1)[0];
-  const q = hashless.indexOf("?");
-  return {
-    active: exact || !end && path !== "" && path !== comparablePath(base) && loc.startsWith(path + "/"),
-    current: exact && comparableQuery(location.search) === comparableQuery(q < 0 ? "" : hashless.slice(q))
+function linkMatcher({
+  pathname,
+  search
+}, base, end) {
+  const loc = comparablePath(pathname);
+  const root = comparablePath(base);
+  return target => {
+    if (target === undefined) return {
+      active: false,
+      current: false
+    };
+    const path = comparablePath(target);
+    const exact = loc === path;
+    const hashless = target.split("#", 1)[0];
+    const q = hashless.indexOf("?");
+    return {
+      active: exact || !end && path !== "" && path !== root && loc.startsWith(path + "/"),
+      current: exact && comparableQuery(search) === comparableQuery(q < 0 ? "" : hashless.slice(q))
+    };
   };
 }
 function resolvePath(base, path, from) {
@@ -249,9 +256,11 @@ function setFormClaimHandler(handler) {
  *   included (parameter order aside)
  * - `data-active` — pathname exact or prefix match (the router's root, its
  *   base path, exact only)
- * - `data-pending` — the link is the target of an in-flight navigation
+ * - `data-pending` — the link is the target of an in-flight navigation;
+ *   opt-in through `createRouter({ links: pendingLinks })`. Without the
+ *   plugin, claims never read pending state and the sweep does not track it.
  *
- * The matching rule is `matchLink`, shared with `useLinkState`. The router
+ * The matching rule is `linkMatcher`, shared with `useLinkState`. The router
  * only touches an `aria-current` it wrote itself: one the author set (a
  * stepper's `"step"`, a static `"page"`) is left in place, current or not.
  *
@@ -264,8 +273,9 @@ function setFormClaimHandler(handler) {
  * are the same one-shot untracked refresh, reading the element's current
  * `href` from the DOM.
  */
-function setupLinkClaims(router, explicitLinks) {
+function setupLinkClaims(router, explicitLinks, links) {
   const basePath = router.base.path();
+  const plugin = links && links(router, basePath);
   // per-element record; `owned` is whether the `aria-current` on the element
   // is the router's, so it never writes over or removes an authored one
   const claimed = new WeakMap();
@@ -295,25 +305,29 @@ function setupLinkClaims(router, explicitLinks) {
     if (url.origin !== window.location.origin || !isUnderBase(url.pathname, basePath)) return;
     return url;
   }
+
+  // every anchor matches against the same location, so its parse is shared
+  // until the location changes
+  let matched;
+  let match;
   function linkState(a) {
     // read reactive sources unconditionally so the owning effect stays
     // subscribed even while the anchor is not router-managed
     const location = router.location;
-    const routing = router.isRouting();
+    const routing = plugin && plugin.track();
     const url = managedUrl(a);
     const target = url && url.pathname + url.search;
+    const key = location.pathname + location.search;
     // no per-anchor `end` opt-out like useLinkState has
+    if (key !== matched) {
+      matched = key;
+      match = linkMatcher(location, basePath);
+    }
     const {
       active,
       current
-    } = matchLink(location, target, basePath);
-    // effects observe the committed location during a transition, so the
-    // in-flight target comes from pendingTarget — readable here because the
-    // isRouting write flushes after the target is assigned
-    const pending = routing && !!router.pendingTarget && matchLink({
-      pathname: router.pendingTarget.value,
-      search: ""
-    }, target, basePath).active;
+    } = match(target);
+    const pending = !!routing && plugin.pending(target);
     return {
       active,
       pending,
@@ -326,7 +340,7 @@ function setupLinkClaims(router, explicitLinks) {
     current
   }) {
     active ? a.setAttribute("data-active", "") : a.removeAttribute("data-active");
-    pending ? a.setAttribute("data-pending", "") : a.removeAttribute("data-pending");
+    if (plugin) pending ? a.setAttribute("data-pending", "") : a.removeAttribute("data-pending");
     // Ownership is read against the element, not just the record. A
     // server-component morph resets attributes to the server HTML, which
     // never carries router link state, then re-claims: an owned value that
@@ -346,9 +360,10 @@ function setupLinkClaims(router, explicitLinks) {
   const refresh = (a, rec) => untrack(() => apply(a, rec, linkState(a)));
 
   // The one subscription for every anchor: compute tracks the sources
-  // linkState derives from (the in-flight pendingTarget is readable in the
-  // effect phase because the isRouting write flushes after the target is
-  // assigned), the effect phase sweeps the registry untracked.
+  // linkState derives from (with the plugin, its pending read — the
+  // in-flight target is readable in the effect phase because the isRouting
+  // write flushes after the target is assigned), the effect phase sweeps the
+  // registry untracked.
   //
   // `transparent` keeps the effect invisible to the hydration id scheme.
   // This setup is client-only, so an id-consuming node here has no server
@@ -356,7 +371,7 @@ function setupLinkClaims(router, explicitLinks) {
   // slot — lazy-route lookups miss and hydration leaves server nodes
   // unclaimed. (The option is honored by the runtime but missing from the
   // published EffectOptions type, hence the cast.)
-  createRenderEffect(() => (router.location.pathname, router.location.search, router.isRouting()), () => registry.forEach(a => refresh(a, claimed.get(a))), {
+  createRenderEffect(() => (router.location.pathname, router.location.search, plugin && plugin.track()), () => registry.forEach(a => refresh(a, claimed.get(a))), {
     transparent: true
   });
   onCleanup(registerElementClaim(node => {
@@ -383,6 +398,12 @@ function setupLinkClaims(router, explicitLinks) {
   }));
 }
 
+/**
+ * App bundlers define this (`"true"` when server components are on, including
+ * `'external'`, otherwise `"false"`). Not assigned here: the published build
+ * keeps the `typeof` check so they can fold the fallback away.
+ */
+
 /**
  * The submit delegation consults this slot instead of importing the action
  * module: the action side installs its handler on first action creation
@@ -394,24 +415,43 @@ let formHandler;
 function setRouterFormHandler(handler) {
   formHandler = handler;
 }
+
+/**
+ * Link preload strategies reach route preloading through this slot instead
+ * of the event wiring importing it: a strategy installs it when it runs (see
+ * preload.ts), so an app with no strategy and no `usePreloadRoute` never
+ * ships route preloading.
+ */
+let linkPreloader;
+function setLinkPreloader(preloader) {
+  linkPreloader = preloader;
+}
 function setupNativeEvents({
-  preload = true,
+  preload,
   explicitLinks = false,
-  actionBase = "/_server",
-  transformUrl
+  actionBase = "/_server"
 } = {}) {
   return router => {
     const basePath = router.base.path();
     const navigateFromRoute = router.navigatorFactory(router.base);
-    let preloadTimeout;
-    let lastElement;
     function isSvg(el) {
       return el.namespaceURI === "http://www.w3.org/2000/svg";
     }
     function handleAnchor(evt) {
       if (evt.defaultPrevented || evt.button !== 0 || evt.metaKey || evt.altKey || evt.ctrlKey || evt.shiftKey) return;
+      return findAnchor(evt);
+    }
+
+    // no button or modifier gate: focus and touch events carry neither
+    function findAnchor(evt) {
       const a = evt.composedPath().find(el => el instanceof Node && el.nodeName.toUpperCase() === "A");
-      if (!a || explicitLinks && !a.hasAttribute("link")) return;
+      const url = a && anchorUrl(a);
+      return url && [a, url];
+    }
+
+    /** The anchor's URL when the router manages it, else `undefined`. */
+    function anchorUrl(a) {
+      if (explicitLinks && !a.hasAttribute("link")) return;
       const svg = isSvg(a);
       const href = svg ? a.href.baseVal : a.href;
       const target = svg ? a.target.baseVal : a.target;
@@ -423,7 +463,7 @@ function setupNativeEvents({
       // inherit the page origin, so the origin check below won't reject them. #382
       if (url.protocol !== "https:" && url.protocol !== "http:") return;
       if (url.origin !== window.location.origin || !isUnderBase(url.pathname, basePath)) return;
-      return [a, url];
+      return url;
     }
     function handleAnchorClick(evt) {
       const res = handleAnchor(evt);
@@ -432,31 +472,14 @@ function setupNativeEvents({
       const to = router.parsePath(url.pathname + url.search + url.hash);
       const state = a.getAttribute("state");
       evt.preventDefault();
-      navigateFromRoute(to, {
+      // Only a click the router acts on joins the event's interaction: this
+      // listener hears every click on the document.
+      dispatchAsInteraction(evt, () => navigateFromRoute(to, {
         resolve: false,
         replace: a.hasAttribute("replace"),
         scroll: !a.hasAttribute("noscroll"),
         state: state ? JSON.parse(state) : undefined
-      });
-    }
-    function handleAnchorPreload(evt) {
-      const res = handleAnchor(evt);
-      if (!res) return;
-      const [a, url] = res;
-      transformUrl && (url.pathname = transformUrl(url.pathname));
-      router.preloadRoute(url, a.getAttribute("preload") !== "false");
-    }
-    function handleAnchorMove(evt) {
-      clearTimeout(preloadTimeout);
-      const res = handleAnchor(evt);
-      if (!res) return lastElement = null;
-      const [a, url] = res;
-      if (lastElement === a) return;
-      transformUrl && (url.pathname = transformUrl(url.pathname));
-      preloadTimeout = setTimeout(() => {
-        router.preloadRoute(url, a.getAttribute("preload") !== "false");
-        lastElement = a;
-      }, 20);
+      }));
     }
     function handleFormSubmit(evt) {
       if (formHandler) return formHandler(evt, router, actionBase);
@@ -473,35 +496,31 @@ function setupNativeEvents({
       const url = new URL(ref, document.baseURI);
       const path = router.parsePath(url.pathname + url.search);
       if (!path.startsWith(actionBase) || form.method.toUpperCase() !== "POST") return;
-      evt.preventDefault();
-      const data = new FormData(form, evt.submitter);
-      Promise.resolve().then(function () { return serverForms; }).then(m => m.submitServerForm(router, path, form, data));
+      // The import sits inside the check so bundlers drop the server-forms
+      // chunk. An early return above a still-present import() does not.
+      // Missing stays off: an undefined constant does not fold.
+      if (typeof __SOLID_SERVER_COMPONENTS__ !== "undefined" && __SOLID_SERVER_COMPONENTS__) {
+        evt.preventDefault();
+        const data = new FormData(form, evt.submitter);
+        Promise.resolve().then(function () { return serverForms; }).then(m => m.submitServerForm(router, path, form, data));
+      }
     }
+    const handleSubmit = evt => dispatchAsInteraction(evt, () => handleFormSubmit(evt));
 
     // ensure delegated event run first
     delegateEvents(["click", "submit"]);
     document.addEventListener("click", handleAnchorClick);
-    if (preload) {
-      document.addEventListener("mousemove", handleAnchorMove, {
-        passive: true
-      });
-      document.addEventListener("focusin", handleAnchorPreload, {
-        passive: true
-      });
-      document.addEventListener("touchstart", handleAnchorPreload, {
-        passive: true
-      });
-    }
-    document.addEventListener("submit", handleFormSubmit);
+    document.addEventListener("submit", handleSubmit);
     onCleanup(() => {
       document.removeEventListener("click", handleAnchorClick);
-      if (preload) {
-        document.removeEventListener("mousemove", handleAnchorMove);
-        document.removeEventListener("focusin", handleAnchorPreload);
-        document.removeEventListener("touchstart", handleAnchorPreload);
-      }
-      document.removeEventListener("submit", handleFormSubmit);
+      document.removeEventListener("submit", handleSubmit);
     });
+    // the pre-strategy boolean option is ignored (a dev warning names it)
+    if (preload && preload !== true) [].concat(preload).forEach(strategy => strategy({
+      anchor: findAnchor,
+      url: anchorUrl,
+      preload: (url, data) => linkPreloader(router, url, data)
+    }));
   };
 }
 
@@ -610,7 +629,7 @@ function createPathsProxy(renderPath = p => p, base = "") {
 
 // The light half of server component routes: the brand the router core reads
 // off a route `component`, and the derivation of a route's call arguments.
-// Deliberately free of `query`/`dynamic` — routing.ts imports this module,
+// Deliberately free of `query`/`dynamicComponent` — routing.ts imports this module,
 // and routing.ts is in every app's eager graph. The heavy half (the helper
 // that builds the branded component) lives in serverRouteComponent.ts and only
 // enters a bundle when an app calls `serverRouteComponent()`.
@@ -674,6 +693,86 @@ function serverRouteArgsEqual(a, b) {
   return shallowEqual(a.params, b.params) && shallowEqual(a.search, b.search);
 }
 
+/**
+ * Pending navigation state, for the opt-in readers only: `useIsRouting`,
+ * `useLinkState().pending` and the `pendingLinks` claims plugin. `isPending`
+ * and `latest` are UI affordances — the router's own coordination reads its
+ * location writes and their `onSettled` instead — so an app that renders
+ * none of these never bundles Solid's verdict machinery.
+ */
+
+const routing = new WeakMap();
+
+/** Whether a navigation is in flight: one memo per router, under its owner. */
+function routingState(router) {
+  let read = routing.get(router);
+  if (!read) {
+    const {
+      location,
+      matches,
+      _source: source
+    } = router;
+    // `transparent`: created on first use rather than at router setup, so it
+    // must not take a hydration id — the server may never create it, or
+    // create it at a different point.
+    const pending = runWithOwner(router._owner, () => createMemo(() => isPending(() => {
+      try {
+        matches();
+      } catch (e) {
+        if (e instanceof NotReadyError) throw e;
+      }
+      location.search;
+      location.hash;
+    }), {
+      transparent: true,
+      ...(DEV && {
+        name: "routingPending"
+      })
+    }));
+    read = () => pending() || isPending(source);
+    routing.set(router, read);
+  }
+  return read;
+}
+
+/**
+ * The target of the in-flight programmatic navigation, if any. A
+ * back/forward traversal (`_navigation` -1) is not a link's target.
+ */
+function pendingTarget(router) {
+  if (!routingState(router)()) return;
+  const target = latest(router._source);
+  return target._navigation && target._navigation > 0 ? target : undefined;
+}
+
+/** Whether `to` is the destination of the in-flight navigation. */
+function linkPending(router, to, base, end) {
+  const target = pendingTarget(router);
+  return !!target && linkMatcher({
+    pathname: target.value,
+    search: ""
+  }, base, end)(to).active;
+}
+
+/**
+ * Opt-in `data-pending` for plain anchors. Marks claimed links whose path
+ * covers the in-flight destination of a link click or `navigate()` (not
+ * back/forward), until it lands. Agrees with `useLinkState().pending`, which
+ * works without it. `aria-current` and `data-active` need no plugin.
+ *
+ * @example
+ * ```ts
+ * import { createRouter, pendingLinks } from "@solidjs/router";
+ *
+ * const Router = createRouter({ routes, links: pendingLinks });
+ * // CSS: a[data-pending] { opacity: .6 }
+ * ```
+ */
+const pendingLinks = (router, base) => ({
+  track: routingState(router),
+  pending: target => linkPending(router, target, base)
+});
+
 const MAX_REDIRECTS = 100;
 
 /**
@@ -759,6 +858,8 @@ const useLocation = () => useRouter().location;
 /**
  * Retrieves a signal that indicates whether the router is currently processing a navigation.
  * Useful for showing pending navigation state while the next route and its data settle.
+ * This is the way to read routing state: `RouterContext` doesn't carry `isRouting`.
+ * For the in-flight destination, read the location with Solid's `isPending`/`latest`.
  * 
  * @example
  * ```js
@@ -771,7 +872,7 @@ const useLocation = () => useRouter().location;
  * );
  * ```
  */
-const useIsRouting = () => useRouter().isRouting;
+const useIsRouting = () => routingState(useRouter());
 
 /**
  * `useMatch` takes an accessor that returns the path and creates a `Memo` that returns match information if the current path matches the provided path.
@@ -825,23 +926,6 @@ const useRouteMatches = () => {
   return () => router.matches().slice();
 };
 
-/**
- * `usePreloadRoute` returns a function for warming a route by hand — the same
- * work link hover/focus intent triggers automatically: the matched routes'
- * lazy components load, and with `preloadData` their `preload` functions run.
- *
- * @example
- * ```js
- * const preload = usePreloadRoute();
- *
- * preload(paths.users(2).settings, { preloadData: true });
- * ```
- */
-const usePreloadRoute = () => {
-  const pre = useRouter().preloadRoute;
-  return (url, options = {}) => pre(url instanceof URL ? url : new URL(String(url), mockBase), options.preloadData);
-};
-
 /**
  * Retrieves a reactive, store-like object containing the current route path parameters as defined in the Route.
  * 
@@ -950,7 +1034,7 @@ const useLinkState = (href, options = {}) => {
   const location = router.location;
   const to = useResolvedPath(() => String(href()));
   const base = router.base.path();
-  const state = createMemo(() => matchLink(location, to(), base, options.end));
+  const state = createMemo(() => linkMatcher(location, base, options.end)(to()));
   return {
     active: createMemo(() => state().active),
     current: createMemo(() => state().current),
@@ -959,10 +1043,7 @@ const useLinkState = (href, options = {}) => {
     // observe the committed location during a transition
     pending: createMemo(() => {
       state(); // location dependency: mid-flight target swaps recompute
-      return router.isRouting() && !!router.pendingTarget && matchLink({
-        pathname: router.pendingTarget.value,
-        search: ""
-      }, to(), base, options.end).active;
+      return linkPending(router, to(), base, options.end);
     })
   };
 };
@@ -1292,6 +1373,11 @@ let preloadIntent;
 function getIntent() {
   return preloadIntent || useOptionalContext(RouterContextObj)?.intent?.();
 }
+function setPreloadIntent(intent) {
+  const prev = preloadIntent;
+  preloadIntent = intent;
+  return prev;
+}
 let inPreloadFn = false;
 function getInPreloadFn() {
   return inPreloadFn;
@@ -1320,7 +1406,12 @@ function createRouterContext(integration, branches, getContext, options = {}) {
       _navigation: isServer ? undefined : 1
     });
   }
-  const location = createLocation(() => source().value, () => source().state, utils.queryWrapper);
+
+  // The flushed world — what `latest(source)` answers — as the location's own
+  // memo sees it: it recomputes under the transition that carries a write,
+  // never for a write of this same tick (A28).
+  let flushed = initialSource;
+  const location = createLocation(() => (flushed = source()).value, () => source().state, utils.queryWrapper);
   // The flash cookie is consumed eagerly: its one-shot clear (Set-Cookie)
   // must be appended before streaming flushes the response headers, and an
   // unread outcome must not haunt a later request's render. Only detection
@@ -1397,7 +1488,9 @@ function createRouterContext(integration, branches, getContext, options = {}) {
   // NotReadyError's source must be a reactive async node, not the raw
   // Promise. Keep one reader per boundary for this router owner so rejection
   // is delivered through the graph's error channel and resolution wakes the
-  // parked matches computation.
+  // parked matches computation. `transparent`: the reader exists on the
+  // client only (the server parks `matches` on the promise directly), so it
+  // must not take a hydration id the server never allocated.
   const routerOwner = getOwner();
   const lazyReaders = new WeakMap();
   const readLazySubtree = record => {
@@ -1406,16 +1499,19 @@ function createRouterContext(integration, branches, getContext, options = {}) {
       read = runWithOwner(routerOwner, () => createMemo(() => {
         const result = resolveLazySubtree(record);
         return result instanceof Promise ? result.then(() => undefined) : undefined;
-      }, DEV && {
-        name: "lazyRoutes"
+      }, {
+        transparent: true,
+        ...(DEV && {
+          name: "lazyRoutes"
+        })
       }));
       lazyReaders.set(record, read);
     }
     return read();
   };
+  const matchPath = pathname => getRouteMatches(branches(), options.transformUrl ? options.transformUrl(pathname) : pathname);
   const matches = createMemo(() => {
-    const pathname = typeof options.transformUrl === "function" ? options.transformUrl(location.pathname) : location.pathname;
-    const m = getRouteMatches(branches(), pathname);
+    const m = matchPath(location.pathname);
     // An unresolved lazy subtree parks readers on not-ready semantics — the
     // navigation transition (or the SSR stream) holds until the table lands.
     // NotReadyError (not a returned promise) because a match chain is full
@@ -1442,28 +1538,15 @@ function createRouterContext(integration, branches, getContext, options = {}) {
   }, DEV && {
     name: "matches"
   });
-  const routingPending = createMemo(() => isPending(() => {
-    try {
-      matches();
-    } catch (e) {
-      if (e instanceof NotReadyError) throw e;
-    }
-    location.search;
-    location.hash;
-  }), DEV && {
-    name: "routingPending"
-  });
-  const isRouting = () => routingPending() || isPending(source);
+  const headedLocation = () => isServer ? untrack(source) : flushed;
+  // A flushed navigation write whose settle has not run is still in flight.
+  const unsettled = change => change._navigation !== undefined && !!integration.settled && !integration.settled(change);
   const transitionIntent = () => {
-    if (!isPending(source)) return;
-    const navigation = latest(source)._navigation;
+    const head = headedLocation();
+    if (!unsettled(head)) return;
+    const navigation = head._navigation;
     return navigation === -1 ? "native" : navigation && navigation > 0 ? "navigate" : undefined;
   };
-  const pendingNavigation = () => {
-    if (!isRouting()) return;
-    const target = latest(source);
-    return target._navigation && target._navigation > 0 ? target : undefined;
-  };
   const buildParams = () => mergeParams(matches());
   const wrapParams = utils.paramsWrapper ? getParams => utils.paramsWrapper(getParams, branches) : getParams => createMemoObject(getParams);
   const params = wrapParams(buildParams);
@@ -1481,17 +1564,16 @@ function createRouterContext(integration, branches, getContext, options = {}) {
     location,
     params,
     wrapParams,
-    isRouting,
     intent: transitionIntent,
-    get pendingTarget() {
-      return pendingNavigation();
-    },
+    _source: source,
+    _owner: routerOwner,
+    _routeOwner: getContext,
+    _match: matchPath,
     renderPath,
     parsePath,
     navigatorFactory,
     matches,
     beforeLeave,
-    preloadRoute,
     singleFlight: options.singleFlight === undefined ? true : options.singleFlight,
     get submissions() {
       return submissions ||= createSignal(isServer ? initSubmissions() : [], {
@@ -1546,10 +1628,10 @@ function createRouterContext(integration, branches, getContext, options = {}) {
       // the destination the leave guard is told all read it. A write of this
       // same tick is not in it (A28) — see `compose` below.
       //
-      // A redirect hop: the previous navigation is still pending, or has landed
-      // but not yet reached history (a guard redirecting in the landing flush
-      // — its destination was never shown either way).
-      const headed = latest(source);
+      // A redirect hop: the previous navigation's write has not settled — it
+      // is still held, or a guard is redirecting in its landing flush — so its
+      // destination was never shown.
+      const headed = headedLocation();
 
       // A composed target (`setSearchParams`) is a function of where the
       // router is heading, an unflushed write of this tick included. Only
@@ -1579,7 +1661,7 @@ function createRouterContext(integration, branches, getContext, options = {}) {
         resolvedTo = resolveTarget(to);
         if (resolvedTo === undefined) throw unroutable(to);
       }
-      const navigationDepth = !isServer && headed._navigation !== undefined && headed._navigation > 0 && (isPending(source) || integration.inflight?.() === headed) ? headed._navigation : 0;
+      const navigationDepth = !isServer && headed._navigation !== undefined && headed._navigation > 0 && unsettled(headed) ? headed._navigation : 0;
       if (navigationDepth >= MAX_REDIRECTS) {
         throw new Error("Too many redirects");
       }
@@ -1621,71 +1703,6 @@ function createRouterContext(integration, branches, getContext, options = {}) {
     route = route || useOptionalContext(RouteContextObj) || baseRoute;
     return (to, options) => navigateFromRoute(route, to, options);
   }
-  function preloadRoute(url, preloadData) {
-    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 = 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 next) {
-      const {
-        route,
-        params
-      } = next[match];
-      const {
-        preload,
-        component
-      } = route;
-      component?.preload?.();
-      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(), () => {
-        // 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);
-        server && server.call(serverRouteArgs(route, params, query));
-        preload && preload({
-          params,
-          location: {
-            pathname: url.pathname,
-            search: url.search,
-            hash: url.hash,
-            query,
-            state: null,
-            key: ""
-          },
-          intent: "preload"
-        });
-      });
-      inPreloadFn = false;
-    }
-    preloadIntent = prevIntent;
-  }
 
   // Seeds the initial submission from a no-JS form post: the server
   // function runtime redirected back with the outcome in a one-shot flash
@@ -1833,9 +1850,12 @@ function Routes(props) {
   // 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();
+  // are created under an owner of this component rather than the memo's
+  // computation (which disposes its children every time it re-runs). A
+  // dedicated one, created before the memo: the roots draw hydration ids from
+  // its counter, so the ids don't depend on whether the memo first parked on
+  // a lazy subtree (the server's render can park where the client's doesn't).
+  const owner = createOwner();
   const routeStates = createMemo(prev => {
     // While a lazy subtree resolves, `matches()` is not ready and this
     // computation parks with it — no route contexts are created against
@@ -2127,6 +2147,7 @@ function memoryHistory(initial = "/") {
 }
 
 const STORAGE_KEY = "solid-router:scroll";
+const AUTO_KEY = "solid-router:scroll-auto";
 
 /**
  * Explicit scroll restoration for back/forward navigation. The browser's
@@ -2141,7 +2162,7 @@ const STORAGE_KEY = "solid-router:scroll";
  * so restoration survives reloads, which `scrollRestoration = "manual"`
  * otherwise disables.
  *
- * Restoration is a single scroll once routing settles — the same strategy
+ * Restoration is a single scroll once the traversal settles — the same strategy
  * SvelteKit, TanStack Router and React Router use. Settling after the
  * transition commits is what makes the offset reachable; chasing a still-
  * growing document afterwards (a ResizeObserver re-asserting the offset as
@@ -2151,17 +2172,49 @@ const STORAGE_KEY = "solid-router:scroll";
  * layout changes can feed it back into itself. Content that commits after the
  * transition settles — an image without reserved space, a boundary below the
  * fold — keeps whatever offset the document can hold.
+ *
+ * A server-rendered document load is the exception: the browser restores it
+ * natively once the document — streamed boundaries included — has loaded,
+ * which a restore at the first client flush cannot match. So an entry is
+ * handed back to the browser (`auto`) whenever its document may unload
+ * (pagehide), and a hydrating router arriving on a handed-back entry leaves
+ * the restore to the browser: it does not scroll, and it takes the entry back
+ * (`manual`) only after load or at the first client navigation, whichever
+ * comes first. A programmatic scroll during the load cancels the native
+ * restore in Firefox and WebKit, and WebKit restores just after the load
+ * event, so a `manual` write before then — inside a load listener included —
+ * suppresses it; the write waits a task. Handed-back depths are tracked here
+ * rather than read from `history.scrollRestoration`, which Firefox reports as
+ * the mode before pagehide after a reload. An entry this router pushed and
+ * never handed back stays `manual` and gets no native restore, so the router
+ * restores it as on a client-rendered load.
  */
-function createScrollRestoration() {
-  window.history.scrollRestoration = "manual";
+function createScrollRestoration(hydrating) {
+  const h = window.history;
   // the current entry needs its depth stamp for captures to have a key, even
   // if something replaced history.state after the adapter stamped it
   saveCurrentDepth();
+  const depth = () => window.history.state && window.history.state._depth;
   let positions = {};
+  let handedBack = {};
   try {
     positions = JSON.parse(sessionStorage.getItem(STORAGE_KEY)) || {};
+    handedBack = JSON.parse(sessionStorage.getItem(AUTO_KEY)) || {};
   } catch {}
-  const depth = () => window.history.state && window.history.state._depth;
+  const manual = () => {
+    h.scrollRestoration = "manual";
+    const d = depth();
+    if (d != null) delete handedBack[d];
+  };
+  const d = depth();
+  let deferred = !!hydrating && (h.scrollRestoration === "auto" || d != null && !!handedBack[d]);
+  if (!deferred) manual();
+  const claim = () => {
+    if (!deferred) return;
+    deferred = false;
+    manual();
+  };
+  let timer;
   let programmatic = false;
   let pending;
   const unbind = [bindEvent(window, "scroll", () => {
@@ -2170,10 +2223,16 @@ function createScrollRestoration() {
     // the user took over — a pending restore would yank them
     if (!programmatic) pending = undefined;
   }), bindEvent(window, "pagehide", () => {
+    h.scrollRestoration = "auto";
+    const d = depth();
+    if (d != null) handedBack[d] = 1;
     try {
       sessionStorage.setItem(STORAGE_KEY, JSON.stringify(positions));
+      sessionStorage.setItem(AUTO_KEY, JSON.stringify(handedBack));
     } catch {}
-  })];
+  }), bindEvent(window, "pageshow", e => {
+    if (e.persisted) manual();
+  }), bindEvent(window, "load", () => deferred && (timer = setTimeout(claim))), () => clearTimeout(timer)];
   const restore = () => {
     if (pending == null) return;
     const y = positions[pending];
@@ -2186,42 +2245,38 @@ function createScrollRestoration() {
     programmatic = false;
   };
   return {
-    /** When the adapter notifies a traversal: mark the target for restoration. */
+    /**
+     * When the adapter notifies a traversal: mark the target and restore once
+     * the transition carrying it settles. The adapter notifies right before
+     * the location write, in the same tick, so the settle is that write's —
+     * a same-URL traversal included, which no location key would see.
+     */
     onPop() {
+      claim();
       pending = depth();
+      runWithOwner(null, () => onSettled(restore));
     },
+    /** The initial page settled: restore a reload/back_forward arrival. */
+    settled: () => restore(),
+    /** Before a client navigation writes history: the entry it creates copies the current mode. */
+    beforeWrite: claim,
     /** After a push: forward entries died, and this depth may be reused. */
     onPush() {
       const d = depth();
-      if (d != null) for (const k in positions) +k >= d && delete positions[k];
+      if (d != null) {
+        for (const k in positions) +k >= d && delete positions[k];
+        for (const k in handedBack) +k >= d && delete handedBack[k];
+      }
     },
-    create(router) {
-      // Restore once the traversal has settled: key on the location (a fully
-      // synchronous pop commits without isRouting ever flipping) and on
-      // isRouting, which reports in-flight transitions — native pops
-      // included — and holds the restore until they commit. restore() no-ops
-      // unless a traversal marked a target, so push navigations are inert.
-      // `transparent` keeps the effect invisible to the hydration id scheme —
-      // same reasoning as the link-claims effect (claims.ts): this setup is
-      // client-only, so an id-consuming node here has no server counterpart
-      // and every hydration id allocated after it shifts by one child slot.
-      // The visible failure is any <Loading> content that settled before the
-      // shell flush (a cache hit, a preloaded query): its serialized value and
-      // inlined markup are keyed under the server's ids, the shifted client
-      // misses both, recomputes, and re-renders the route fresh — duplicating
-      // the server DOM and leaving it inert.
-      createEffect(() => ({
-        url: router.location.pathname + router.location.search + router.location.hash,
-        routing: router.isRouting()
-      }), current => {
-        if (!current.routing) restore();
-      }, {
-        transparent: true
-      });
+    create() {
       onCleanup(() => unbind.forEach(u => u()));
       // reload/back_forward document loads land on an existing entry (a fresh
-      // navigation starts a new one and belongs at the top); the effect's
-      // initial run performs the restore after first render
+      // navigation starts a new one and belongs at the top); the router calls
+      // `settled` once the initial page has; a deferred arrival is the browser's
+      if (deferred) {
+        document.readyState === "complete" && claim();
+        return;
+      }
       const [nav] = performance.getEntriesByType?.("navigation");
       if (nav && nav.type !== "navigate") pending = depth();
     }
@@ -2237,6 +2292,7 @@ function withScrollRestoration(history, restoration) {
   return {
     ...history,
     set(next) {
+      restoration.beforeWrite();
       history.set(next);
       next.replace || restoration.onPush();
     },
@@ -2384,8 +2440,8 @@ function describeInitial(match, location) {
 /** Wraps a history adapter in the integration signal the router core consumes. Must run under a reactive owner. */
 function createIntegration(history, match) {
   let committing = false;
-  // Written, not yet in history (see `RouterIntegration.inflight`).
-  let inflight;
+  // Writes whose transition has landed (see `RouterIntegration.settled`).
+  const settled = new WeakSet();
   const wrap = value => typeof value === "string" ? {
     value
   } : value;
@@ -2404,14 +2460,16 @@ function createIntegration(history, match) {
       // the no-op rule compares against it, so `navigate()` behind another
       // write in one handler sees that write rather than the flushed world.
       write(headed => (written = resolveLocationWrite(headed, next)) || headed);
-      if (written && written._navigation && written._navigation > 0) {
+      if (written && written._navigation) {
         const next = written;
-        inflight = next;
         // Register out of band so a destination error boundary replacing the
-        // Router subtree cannot suppress the winning history commit.
+        // Router subtree cannot suppress the winning history commit. The
+        // settle is tied to the transition carrying the write: it fires when
+        // that lands, a rejection included, and a superseded write's settle
+        // fires with the transition that absorbed it.
         runWithOwner(null, () => onSettled(() => {
-          if (inflight === next) inflight = undefined;
-          if (read() !== next) return;
+          settled.add(next);
+          if (next._navigation < 0 || read() !== next) return;
           committing = true;
           try {
             history.set(next);
@@ -2445,7 +2503,7 @@ function createIntegration(history, match) {
   }));
   return {
     signal,
-    inflight: () => inflight,
+    settled: write => settled.has(write),
     utils: history.utils
   };
 }
@@ -2478,6 +2536,9 @@ function staticIntegration(url, utils) {
   };
 }
 function createRouter(config) {
+  if (DEV && typeof config.preloadLinks === "boolean") {
+    console.warn("`preloadLinks` takes preload strategies, not a boolean, and preloads nothing by default. " + "Use `preloadLinks: intentPreload()` for hover/focus preloading.");
+  }
   const basePath = config.base || "";
   // Routes are immutable per instance, so compilation is shared by every
   // mount, request, and `match()` call — recompiled only when a lazy subtree
@@ -2510,7 +2571,7 @@ function createRouter(config) {
     let restoration;
     let history = config.history;
     if (!isServer && (config.scrollRestoration ?? !history)) {
-      restoration = createScrollRestoration();
+      restoration = createScrollRestoration(isHydrating());
       history = withScrollRestoration(history || browserHistory(), restoration);
     }
     const integration = isServer ? staticIntegration(props.url, config.history && config.history.utils) : createIntegration(history || browserHistory(), matchPath);
@@ -2527,13 +2588,16 @@ function createRouter(config) {
       setupNativeEvents({
         preload: config.preloadLinks,
         explicitLinks: config.explicitLinks,
-        actionBase: config.actionBase,
-        transformUrl: config.transformUrl
+        actionBase: config.actionBase
       })(routerState);
-      setupLinkClaims(routerState, config.explicitLinks);
+      setupLinkClaims(routerState, config.explicitLinks, config.links);
       if (routerState.singleFlight) onCleanup(registerFlightRouter(routerState));
-      restoration && restoration.create(routerState);
+      restoration && restoration.create();
     }
+    // Registered on both sides, outside the client-only branch: an owned
+    // onSettled takes a hydration id on the server too, so the ids line up.
+    // A no-op when the arrival is left to the browser's native restore.
+    onSettled(() => restoration && restoration.settled());
     return createComponent$1(RouterContextObj, {
       value: routerState,
       get children() {
@@ -2670,6 +2734,289 @@ const useBeforeLeave = listener => {
   onCleanup(s);
 };
 
+/**
+ * Warms the routes `url` matches: their lazy components (and any lazy
+ * subtree on the way) load, and with `preloadData` their `preload` functions
+ * run under `intent: "preload"`. Only link preload strategies and
+ * `usePreloadRoute` import it, so apps using neither don't ship it.
+ */
+function preloadRoute(router, url, preloadData) {
+  const next = router._match(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 = next.find(m => m.route.lazy && !m.route.lazy.resolved);
+  if (boundary) {
+    try {
+      resolveLazySubtree(boundary.route.lazy).then(() => preloadRoute(router, 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(router.matches);
+  } catch {}
+  const {
+    location
+  } = router;
+  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 = setPreloadIntent("preload");
+  for (let match in next) {
+    const {
+      route,
+      params
+    } = next[match];
+    const {
+      preload,
+      component
+    } = route;
+    component?.preload?.();
+    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));
+    setInPreloadFn(true);
+    preloadData && !unchanged && runWithOwner(router._routeOwner(), () => {
+      // 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);
+      server && server.call(serverRouteArgs(route, params, query));
+      preload && preload({
+        params,
+        location: {
+          pathname: url.pathname,
+          search: url.search,
+          hash: url.hash,
+          query,
+          state: null,
+          key: ""
+        },
+        intent: "preload"
+      });
+    });
+    setInPreloadFn(false);
+  }
+  setPreloadIntent(prevIntent);
+}
+
+/**
+ * `usePreloadRoute` returns a function for warming a route by hand — the same
+ * work link preloading triggers: the matched routes' lazy components load,
+ * and with `preloadData` their `preload` functions run.
+ *
+ * @example
+ * ```js
+ * const preload = usePreloadRoute();
+ *
+ * preload(paths.users(2).settings, { preloadData: true });
+ * ```
+ */
+const usePreloadRoute = () => {
+  const router = useRouter();
+  return (url, options) => preloadRoute(router, url instanceof URL ? url : new URL(String(url), mockBase), options?.preloadData);
+};
+
+/**
+ * Anchors as the runtime claims them: at creation and again on `href`
+ * writes. `disarm` runs when the creating owner is disposed. Claims fire
+ * before dynamic attributes are applied (solidjs/solid#3923), so whether a
+ * link is opted in, and where it points, is read when it preloads.
+ */
+function claimAnchors(arm, disarm) {
+  const seen = new WeakSet();
+  setLinkPreloader(preloadRoute);
+  onCleanup(registerElementClaim(node => {
+    if (node.nodeName.toUpperCase() !== "A") return;
+    arm(node);
+    // a re-claim runs under the owner writing `href`, not the anchor's
+    if (seen.has(node)) return;
+    seen.add(node);
+    getOwner() && onCleanup(() => disarm(node));
+  }));
+}
+
+// requests made before the browser is idle run together once it is
+function whenIdle(fn) {
+  let scheduled = false;
+  return () => {
+    if (scheduled) return;
+    scheduled = true;
+    (window.requestIdleCallback || setTimeout)(() => {
+      scheduled = false;
+      fn();
+    });
+  };
+}
+
+/**
+ * Preloads an ambient strategy's anchor: one that names the strategy in its
+ * `preload` attribute, or with `all` any but `preload="false"`. Skipped when
+ * the user asked to save data or the connection is 2g (where the Network
+ * Information API is available).
+ */
+const ambientPreload = ({
+  url,
+  preload
+}, name, all, data) => a => {
+  const value = a.getAttribute("preload");
+  const connection = navigator.connection;
+  const href = (value === name || all && value !== "false") && !(connection && (connection.saveData || /2g/.test(connection.effectiveType))) && url(a);
+  href && preload(href, data);
+};
+
+/**
+ * Preload a link when the pointer rests on it for `delay` ms (default 20),
+ * when it takes focus, and on touchstart. Moving over a link that already
+ * preloaded does not preload it again until the pointer leaves. These
+ * listeners do not check modifier keys or `defaultPrevented`; clicks still do.
+ * Warms route code and, unless `data` is false (default true), runs the
+ * matched routes' `preload` functions.
+ *
+ * @example
+ * ```ts
+ * const Router = createRouter({ routes, preloadLinks: intentPreload() });
+ * ```
+ */
+const intentPreload = ({
+  delay = 20,
+  data = true
+} = {}) => ctx => {
+  let timeout;
+  let lastElement;
+  setLinkPreloader(preloadRoute);
+  const onIntent = evt => {
+    // clear before resolving: a throw must not leave the rest timer armed
+    if (evt.type === "mousemove") clearTimeout(timeout);
+    const res = ctx.anchor(evt);
+    const link = res && res[0].getAttribute("preload") !== "false" ? res : undefined;
+    if (evt.type !== "mousemove") return link && ctx.preload(link[1], data);
+    if (!link) return lastElement = undefined;
+    const [a, url] = link;
+    if (lastElement === a) return;
+    timeout = setTimeout(() => {
+      ctx.preload(url, data);
+      lastElement = a;
+    }, delay);
+  };
+  const passive = {
+    passive: true
+  };
+  document.addEventListener("focusin", onIntent, passive);
+  document.addEventListener("touchstart", onIntent, passive);
+  document.addEventListener("mousemove", onIntent, passive);
+  onCleanup(() => {
+    clearTimeout(timeout);
+    document.removeEventListener("focusin", onIntent);
+    document.removeEventListener("touchstart", onIntent);
+    document.removeEventListener("mousemove", onIntent);
+  });
+};
+
+/**
+ * Preload a link on `pointerdown` (mouse, touch, or pen), ahead of its click.
+ * Does not check modifier keys or `defaultPrevented`. Warms route code and,
+ * unless `data` is false (default true), route data.
+ */
+const tapPreload = ({
+  data = true
+} = {}) => ctx => {
+  setLinkPreloader(preloadRoute);
+  const onTap = evt => {
+    const res = ctx.anchor(evt);
+    res && res[0].getAttribute("preload") !== "false" && ctx.preload(res[1], data);
+  };
+  document.addEventListener("pointerdown", onTap, {
+    passive: true
+  });
+  onCleanup(() => document.removeEventListener("pointerdown", onTap));
+};
+
+/**
+ * Preload a link once it has stayed in the viewport for `delay` ms (default
+ * 100), when the browser is next idle (`requestIdleCallback`, or `setTimeout`
+ * where that is missing). Each link preloads once, and again after its `href`
+ * changes; a link that leaves before then is dropped. One `IntersectionObserver`
+ * is shared. `rootMargin` is passed through to it (the observer's own `"0px"`
+ * when omitted). Applies to links with `preload="viewport"`, or with `all`
+ * (default false) to every link except `preload="false"`. Skips Save-Data and
+ * 2g connections. Warms route code only unless `data` is true (default false).
+ */
+const viewportPreload = ({
+  all,
+  data = false,
+  delay = 100,
+  rootMargin
+} = {}) => ctx => {
+  if (typeof IntersectionObserver === "undefined") return;
+  const warm = ambientPreload(ctx, "viewport", all, data);
+  // visible anchors: a pending dwell timer, or `true` once due
+  const visible = new Map();
+  let observer;
+  const leave = a => {
+    clearTimeout(visible.get(a));
+    visible.delete(a);
+  };
+  const flush = whenIdle(() => visible.forEach((due, a) => {
+    if (due !== true) return;
+    observer.unobserve(a);
+    visible.delete(a);
+    warm(a);
+  }));
+  const intersect = entries => entries.forEach(({
+    target: a,
+    isIntersecting
+  }) => isIntersecting ? visible.set(a, setTimeout(() => (visible.set(a, true), flush()), delay)) : leave(a));
+  claimAnchors(a => (observer ||= new IntersectionObserver(intersect, {
+    rootMargin
+  })).observe(a), a => {
+    observer.unobserve(a);
+    leave(a);
+  });
+  onCleanup(() => {
+    observer && observer.disconnect();
+    visible.forEach((_, a) => leave(a));
+  });
+};
+
+/**
+ * Preload links as soon as the page has loaded and the browser is idle,
+ * including links mounted later. A link removed before the flush is dropped.
+ * Applies to links with `preload="eager"`, or with `all` (default false) to
+ * every link except `preload="false"`. Skips Save-Data and 2g connections.
+ * Warms route code only unless `data` is true (default false).
+ */
+const eagerPreload = ({
+  all,
+  data = false
+} = {}) => ctx => {
+  const warm = ambientPreload(ctx, "eager", all, data);
+  const queue = new Set();
+  const flush = whenIdle(() => {
+    queue.forEach(warm);
+    queue.clear();
+  });
+  addEventListener("load", flush, {
+    once: true
+  });
+  claimAnchors(a => {
+    queue.add(a);
+    document.readyState === "complete" && flush();
+  }, a => queue.delete(a));
+  onCleanup(() => {
+    removeEventListener("load", flush);
+    queue.clear();
+  });
+};
+
 // Server component routes (experimental — rides the experimental server
 // components surface in @solidjs/web; the arg shape may change).
 //
@@ -2680,7 +3027,7 @@ const useBeforeLeave = listener => {
 //   // before: a client component exists only to make the call
 //   const getStory = query(storyView, "story");
 //   component: props => {
-//     const View = dynamic(() => getStory(props.params.id));
+//     const View = dynamicComponent(() => getStory(props.params.id));
 //     return <View>{props.children}</View>;
 //   }
 //   // after
@@ -2742,8 +3089,9 @@ source) {
   };
   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()));
+    // successive components; `dynamicComponent`'s memo lands each the same
+    // way. Never a tag, so the element runtime `dynamic` retains stays out.
+    const View = dynamicComponent(() => call(args()));
     return createComponent(View, {
       get children() {
         return routeProps.children;
@@ -4098,4 +4446,4 @@ var serverForms = /*#__PURE__*/Object.freeze({
   submitServerForm: submitServerForm
 });
 
-export { RouterContextObj as RouterContext, mergeSearchString as _mergeSearchString, action, browserHistory, createBeforeLeave, createRouter, defineRoute, defineRoutes, hashHistory, int, liveQuery, memoryHistory, query, revalidate, serverRouteComponent, useAction, useBeforeLeave, useHref, useIsRouting, useLinkState, useLocation, useMatch, useNavigate, useParams, usePreloadRoute, useResolvedPath, useRouteMatches, useSearchParams, useSubmissions };
+export { RouterContextObj as RouterContext, mergeSearchString as _mergeSearchString, action, browserHistory, createBeforeLeave, createRouter, defineRoute, defineRoutes, eagerPreload, hashHistory, int, intentPreload, liveQuery, memoryHistory, pendingLinks, query, revalidate, serverRouteComponent, tapPreload, useAction, useBeforeLeave, useHref, useIsRouting, useLinkState, useLocation, useMatch, useNavigate, useParams, usePreloadRoute, useResolvedPath, useRouteMatches, useSearchParams, useSubmissions, viewportPreload };