sibujs 4.14.0 → 4.15.0

package/dist/{chunk-VM2U5LEL.js → chunk-EHSJESRN.js}

@@ -1,23 +1,28 @@
 import {
   acquireTitle
-} from "./chunk-52XFPGSN.js";
+} from "./chunk-HTPOIAAL.js";
+import {
+  commitWhenActive
+} from "./chunk-DS5V2PRE.js";
 import {
   STATIC_VALUE_RESOLVER,
   planHeadElementEntry,
   planMetaEntry,
   recordServerHead,
   serializeHeadEntry
-} from "./chunk-BOYKGGVD.js";
+} from "./chunk-DRWOD7RZ.js";
 import {
   appendChildren,
+  beginLoading,
+  registerNodesRange,
   resolveClassValue
-} from "./chunk-CJ7KS3DF.js";
+} from "./chunk-VSTX3XSX.js";
 import {
   setSafeAttribute
-} from "./chunk-HQIAL7F2.js";
+} from "./chunk-XPDZ2LDR.js";
 import {
   effect
-} from "./chunk-AE32RGWX.js";
+} from "./chunk-LGUXYHTZ.js";
 import {
   sanitizeUrl,
   stripControlChars
@@ -28,18 +33,21 @@ import {
 } from "./chunk-UYTYNCMZ.js";
 import {
   signal
-} from "./chunk-4FJSAUKB.js";
+} from "./chunk-IUBV5WO5.js";
 import {
   bindOwnerScope,
+  captureFrozen,
   getOwnerScope,
+  holdSubtree,
+  reactiveBinding,
   runWithOwnerScope,
-  track,
+  structuralBinding,
   untracked
-} from "./chunk-MIRKTVH4.js";
+} from "./chunk-GFM5WWPU.js";
 import {
   dispose,
   registerDisposer
-} from "./chunk-S37PZD6I.js";
+} from "./chunk-BF3WBJJQ.js";
 import {
   captureScope,
   devWarn,
@@ -929,7 +937,14 @@ var _ComponentLoader = class _ComponentLoader {
    * is a configuration error, not something to chase.
    */
   async instantiateFactory(component, route2, routePath, scope, depth = 0) {
-    const build = () => scope ? runWithOwnerScope(scope, component) : component();
+    const gate = scope?.gate;
+    if (gate) {
+      while (gate.held()) if (!await gate.until()) throw gate.cancellation();
+      if (scope?.current?.() === false) throw gate.cancellation();
+    }
+    const owner = scope?.owner;
+    const invoke = () => scope ? runWithOwnerScope(scope, component) : component();
+    const build = owner ? () => owner.run(invoke) : invoke;
     const result = scope?.adopt ? inScope(scope.adopt, build) : build();
     const value = this.isThenable(result) ? await result : result;
     if (this.isElement(value)) return value;
@@ -1138,7 +1153,7 @@ var _SibuRouter = class _SibuRouter {
     return this.loadedPromise;
   }
   createInitialRoute() {
-    return {
+    const route2 = {
       path: "/",
       params: {},
       query: {},
@@ -1147,6 +1162,8 @@ var _SibuRouter = class _SibuRouter {
       meta: {},
       matched: []
     };
+    bootstrapRoutes.add(route2);
+    return route2;
   }
   handleLocationChange(skipHistory = true, initialResolution = false) {
     const path = this.getCurrentPath();
@@ -1187,8 +1204,31 @@ var _SibuRouter = class _SibuRouter {
       matched
     };
   }
+  /**
+   * Once no navigation is in flight: if the route is still the placeholder
+   * the router started with — every navigation that could have replaced it
+   * was cancelled by a guard, failed, or was a duplicate — that IS the
+   * outcome, and the outlets that rendered nothing for it settle (see
+   * `settleEmpty`). Checked when a navigation has definitively completed,
+   * never from `isReady` (set before the guards run). A navigation still
+   * pending — a newer one, or a guard that never resolves — keeps them
+   * pending; an outlet's enter is bounded by its own deadline then.
+   */
+  settleBootstrap() {
+    if (this.destroyed || this.navigator.isNavigating) return;
+    const current = untracked(() => this.currentRouteGetter());
+    if (!bootstrapRoutes.delete(current)) return;
+    const waiting = bootstrapWaiters.get(current);
+    bootstrapWaiters.delete(current);
+    if (waiting) for (const settle of waiting) settle();
+  }
   // Public API
   async navigate(to, options = {}) {
+    const result = await this.attemptNavigation(to, options);
+    this.settleBootstrap();
+    return result;
+  }
+  async attemptNavigation(to, options) {
     try {
       await this.navigator.navigate(async (signal2) => {
         const targetPath = this.resolvePath(to);
@@ -1442,6 +1482,13 @@ var _SibuRouter = class _SibuRouter {
   /**
    * Create exactly one real instance from an already-resolved plan. With a
    * `scope`, the factory runs in it (see `RouteScope`).
+   *
+   * When the scope belongs to an outlet whose branch is paused (playing a
+   * leave it may still be taken back from), a lazy module that resolves does
+   * not run its factory yet: the promise stays pending and continues once the
+   * branch resumes. If the branch ends, or the outlet's pass was superseded
+   * meanwhile, it rejects with a `DOMException` named `"AbortError"`. Genuine
+   * loader and component failures reject with their own error, as before.
    */
   async instantiateComponent(plan, route2, routePath, scope) {
     return prerenderWait(this.loader.instantiate(plan, route2, routePath, scope), `router:render ${route2.path}`);
@@ -1690,6 +1737,21 @@ var RouteScope = class {
   constructor(route2) {
     /** Creation scope the instance is built in (adopting hydration); see `adoptScope`. */
     this.adopt = null;
+    /**
+     * The outlet's pause gate: while the branch holding the outlet is paused (it
+     * began a leave and may still be taken back), a lazy module that resolves
+     * does not get its factory invoked yet; instantiation waits for the branch
+     * to resume, and is cancelled if it ends.
+     */
+    this.gate = null;
+    /** Whether the outlet pass this instance is for is still the current one. */
+    this.current = null;
+    /**
+     * The instance's structural owner, nested under the outlet's: its factory
+     * runs as it, so what it creates is paused with the branch holding the
+     * outlet, and ends (`lifecycleScope()` work included) with the instance.
+     */
+    this.owner = null;
     this.released = false;
     const [get, set] = signal(route2);
     this.get = get;
@@ -1716,6 +1778,112 @@ var RouteScope = class {
     queueMicrotask(() => this.set(null));
   }
 };
+var NOOP = () => {
+};
+var bootstrapRoutes = /* @__PURE__ */ new WeakSet();
+var bootstrapWaiters = /* @__PURE__ */ new WeakMap();
+function settleEmpty(route2, loaded, current) {
+  if (!bootstrapRoutes.has(route2)) {
+    loaded.done();
+    return;
+  }
+  let waiting = bootstrapWaiters.get(route2);
+  if (waiting === void 0) bootstrapWaiters.set(route2, waiting = /* @__PURE__ */ new Set());
+  waiting.add(() => {
+    if (current()) loaded.done();
+  });
+}
+var cancellations = /* @__PURE__ */ new WeakSet();
+function pauseGate(frozen) {
+  let closed = false;
+  const pending = /* @__PURE__ */ new Set();
+  return {
+    held: () => closed || frozen(),
+    until: () => {
+      if (closed) return Promise.resolve(false);
+      return new Promise((resolve) => {
+        const settle = (active) => {
+          pending.delete(cancel);
+          resolve(active && !closed);
+        };
+        const drop = frozen.wait(
+          () => settle(true),
+          () => settle(false)
+        );
+        const cancel = () => {
+          drop();
+          settle(false);
+        };
+        pending.add(cancel);
+      });
+    },
+    cancellation: () => {
+      const error = new DOMException("Route instantiation cancelled: its branch was released", "AbortError");
+      cancellations.add(error);
+      return error;
+    },
+    close: () => {
+      closed = true;
+      for (const cancel of [...pending]) cancel();
+    },
+    run: frozen.run,
+    frozen,
+    closed: () => closed,
+    onClose: (fn) => {
+      pending.add(fn);
+      return () => {
+        pending.delete(fn);
+      };
+    }
+  };
+}
+function whenActive(gate, fn) {
+  if (!gate.held()) fn();
+  else
+    void gate.until().then((active) => {
+      if (active) whenActive(gate, fn);
+    });
+}
+function commitPass(gate, c) {
+  const frozen = gate.frozen;
+  const held = {
+    state: frozen.state,
+    wait: (onActive, onEnd) => {
+      let live = true;
+      const later = (fn) => () => {
+        void Promise.resolve().then(() => {
+          if (live) fn();
+        });
+      };
+      const drop = frozen.wait(later(onActive), later(onEnd));
+      return () => {
+        live = false;
+        drop();
+      };
+    }
+  };
+  return new Promise((resolve, reject) => {
+    const slot = { cancel: NOOP };
+    const untrack = gate.onClose(() => slot.cancel());
+    const settle = (fn) => () => {
+      untrack();
+      try {
+        fn();
+        resolve();
+      } catch (error) {
+        reject(error);
+      }
+    };
+    commitWhenActive(slot, {
+      held,
+      node: c.node,
+      owned: () => !gate.closed() && c.owned(),
+      teardown: c.teardown,
+      insert: settle(c.insert),
+      discard: settle(c.discard)
+    });
+  });
+}
 function activeRouteScope() {
   const scope = getOwnerScope();
   return scope instanceof RouteScope ? scope : null;
@@ -1729,14 +1897,27 @@ function scopedRoute(router2) {
   return router2.currentRoute;
 }
 var instanceScopes = /* @__PURE__ */ new WeakMap();
-async function instantiateScoped(router2, plan, routeDef, routePath, route2, adopt = null) {
+async function instantiateScoped(router2, plan, routeDef, routePath, route2, adopt = null, gate = null, current = null) {
   const scope = new RouteScope(route2);
   scope.adopt = adopt;
-  const node = await router2.instantiateComponent(plan, routeDef, routePath, scope);
+  scope.gate = gate;
+  scope.current = current;
+  const owner = gate ? gate.run(() => structuralBinding(NOOP)) : structuralBinding(NOOP);
+  scope.owner = owner;
+  let node;
+  try {
+    node = await router2.instantiateComponent(plan, routeDef, routePath, scope);
+  } catch (error) {
+    owner.stop();
+    throw error;
+  }
   if (node) {
     instanceScopes.set(node, scope);
-    registerDisposer(node, () => scope.release());
-  }
+    registerDisposer(node, () => {
+      owner.stop();
+      scope.release();
+    });
+  } else owner.stop();
   return node;
 }
 function updateInstanceRoute(node, route2) {
@@ -1835,6 +2016,8 @@ function instanceKey(owner, records, route2) {
 function Route() {
   const anchor = document.createComment("route-outlet");
   const adoptScope = captureScope();
+  const frozen = captureFrozen();
+  const gate = pauseGate(frozen);
   let currentNode = null;
   let loadingNode = null;
   let errorNode = null;
@@ -1842,6 +2025,7 @@ function Route() {
   let currentTopRoute = null;
   let currentKey = null;
   let routeTorn = false;
+  const loaded = beginLoading(anchor);
   const commitTarget = (seq) => routeTorn || seq !== navSeq ? null : anchor.parentNode;
   const retryIfDetached = (seq) => {
     if (!routeTorn && seq === navSeq && !anchor.parentNode) attachWait.request();
@@ -1886,24 +2070,54 @@ function Route() {
       loadingNode = null;
     }
   };
-  const showError = (error, routeDef) => {
+  const showError = (seq, error, routeDef) => {
     if (!anchor.parentNode) return;
-    cleanupNodes();
-    errorNode = document.createElement("div");
-    errorNode.className = "route-error";
-    errorNode.setAttribute("role", "alert");
-    errorNode.setAttribute("aria-live", "assertive");
+    const view = errorView(error, routeDef);
+    void commitPass(gate, {
+      node: view,
+      owned: () => !routeTorn && seq === navSeq,
+      discard: () => dispose(view),
+      teardown: () => {
+        if (!anchor.parentNode || !(currentNode || loadingNode || errorNode)) return false;
+        cleanupNodes();
+        return true;
+      },
+      insert: () => {
+        const parent = anchor.parentNode;
+        if (!parent) {
+          dispose(view);
+          unshownFailure = { seq, error, routeDef };
+          attachWait.request();
+          return;
+        }
+        errorNode = view;
+        try {
+          parent.insertBefore(view, anchor.nextSibling);
+        } catch (err) {
+          if (errorNode === view) errorNode = null;
+          release(view);
+          throw err;
+        }
+        if (!routeTorn && seq === navSeq) loaded.done();
+      }
+    }).catch((err) => console.error("[Route] Error view failed:", err));
+  };
+  const errorView = (error, routeDef) => {
+    const errorNode2 = document.createElement("div");
+    errorNode2.className = "route-error";
+    errorNode2.setAttribute("role", "alert");
+    errorNode2.setAttribute("aria-live", "assertive");
     if (routeDef && "component" in routeDef) {
       const src = routeDef.component.toString();
       const importMatch = src.match(/import\(["']([^"']+)["']\)/);
       if (importMatch) {
-        errorNode.setAttribute("data-component-source", importMatch[1]);
+        errorNode2.setAttribute("data-component-source", importMatch[1]);
       }
       if (routeDef.component.name) {
-        errorNode.setAttribute("data-component-name", routeDef.component.name);
+        errorNode2.setAttribute("data-component-name", routeDef.component.name);
       }
     }
-    errorNode.__routeError = error;
+    errorNode2.__routeError = error;
     const title = document.createElement("h3");
     title.textContent = "Route Error";
     title.className = "route-error-title";
@@ -1922,10 +2136,10 @@ function Route() {
     };
     retryButton.addEventListener("click", onRetryClick);
     registerDisposer(retryButton, () => retryButton.removeEventListener("click", onRetryClick));
-    errorNode.appendChild(title);
-    errorNode.appendChild(message);
-    errorNode.appendChild(retryButton);
-    anchor.parentNode.insertBefore(errorNode, anchor.nextSibling);
+    errorNode2.appendChild(title);
+    errorNode2.appendChild(message);
+    errorNode2.appendChild(retryButton);
+    return errorNode2;
   };
   const update = async () => {
     routerRevision();
@@ -1938,12 +2152,14 @@ function Route() {
         currentTopRoute = null;
         currentKey = null;
         cleanupNodes();
+        settleEmpty(route2, loaded, () => !routeTorn && seq === navSeq);
         return;
       }
       const routeDef = match.matched[0] || match.route;
       const key = instanceKey(routeDef, [routeDef], route2);
       if (routeDef === currentTopRoute && key === currentKey && currentNode) {
         updateInstanceRoute(currentNode, route2);
+        loaded.done();
         return;
       }
       if ("redirect" in routeDef) {
@@ -1962,6 +2178,7 @@ function Route() {
             showLoading();
           }
           const plan = await _routerRef.current.loadPlan(routeDef, route2.path);
+          while (gate.held()) if (!await gate.until()) return;
           if (!commitTarget(seq)) {
             retryIfDetached(seq);
             return;
@@ -1972,28 +2189,57 @@ function Route() {
             routeDef,
             route2.path,
             route2,
-            keyedScope(adoptScope, routeDef.path)
+            keyedScope(adoptScope, routeDef.path),
+            gate,
+            () => commitTarget(seq) !== null
           );
-          const parent = commitTarget(seq);
-          if (!parent) {
-            release(node);
-            retryIfDetached(seq);
-            return;
-          }
-          if (node) {
-            currentTopRoute = routeDef;
-            currentKey = key;
-            cleanupNodes();
-            parent.insertBefore(node, anchor.nextSibling);
-            currentNode = node;
-          }
+          await commitPass(gate, {
+            node,
+            owned: () => !routeTorn && seq === navSeq,
+            discard: () => release(node),
+            // The outgoing views go first — only when there is a page to
+            // show, and a parent to show it in.
+            teardown: () => {
+              if (!node || !anchor.parentNode || !(currentNode || loadingNode || errorNode)) return false;
+              cleanupNodes();
+              return true;
+            },
+            insert: () => {
+              const parent = commitTarget(seq);
+              if (!parent) {
+                release(node);
+                retryIfDetached(seq);
+                return;
+              }
+              if (node) {
+                currentTopRoute = routeDef;
+                currentKey = key;
+                currentNode = node;
+                try {
+                  parent.insertBefore(node, anchor.nextSibling);
+                } catch (error) {
+                  if (currentNode === node) {
+                    currentNode = null;
+                    currentTopRoute = null;
+                    currentKey = null;
+                  }
+                  release(node);
+                  throw error;
+                }
+              }
+              if (!routeTorn && seq === navSeq) loaded.done();
+            }
+          });
         } catch (error) {
+          if (cancellations.has(error)) return;
           if (routeTorn || seq !== navSeq) return;
-          hideLoading();
           console.error("[Route] Component error:", error);
+          while (gate.held()) if (!await gate.until()) return;
+          if (routeTorn || seq !== navSeq) return;
+          hideLoading();
           fail(seq, error, routeDef);
         }
-      }
+      } else settleEmpty(route2, loaded, () => !routeTorn && seq === navSeq);
     } catch (error) {
       if (seq !== navSeq) return;
       if (routeTorn) return;
@@ -2005,16 +2251,20 @@ function Route() {
   const fail = (seq, error, routeDef) => {
     const err = error instanceof Error ? error : new Error(String(error));
     if (anchor.parentNode) {
-      showError(err, routeDef);
+      showError(seq, err, routeDef);
       return;
     }
     unshownFailure = { seq, error: err, routeDef };
     attachWait.request();
   };
   const onAttached = () => {
+    if (gate.held()) {
+      void gate.until().then((active) => active && onAttached());
+      return;
+    }
     const failure = unshownFailure;
     unshownFailure = null;
-    if (failure && failure.seq === navSeq) showError(failure.error, failure.routeDef);
+    if (failure && failure.seq === navSeq) showError(failure.seq, failure.error, failure.routeDef);
     else update();
   };
   let routeInitialized = false;
@@ -2024,11 +2274,16 @@ function Route() {
     routeInitialized = true;
   };
   const attachWait = attachRetry(anchor, onAttached);
-  const routeTeardown = track(wrappedUpdate);
+  const routeTeardown = reactiveBinding(wrappedUpdate, anchor);
   if (!routeInitialized) {
     queueMicrotask(
       bindOwnerScope(() => {
-        if (!routeInitialized && anchor.parentNode) wrappedUpdate();
+        whenActive(
+          gate,
+          bindOwnerScope(() => {
+            if (!routeInitialized && anchor.parentNode) wrappedUpdate();
+          })
+        );
       })
     );
   }
@@ -2036,6 +2291,8 @@ function Route() {
     if (routeTorn) return;
     routeTorn = true;
     navSeq++;
+    gate.close();
+    loaded.cancel();
     routeTeardown();
     attachWait.cancel();
     unshownFailure = null;
@@ -2043,6 +2300,7 @@ function Route() {
     currentTopRoute = null;
     currentKey = null;
   };
+  registerNodesRange(anchor, () => [currentNode, loadingNode, errorNode]);
   registerDisposer(anchor, routeCleanup);
   routeCleanups.push(routeCleanup);
   return anchor;
@@ -2052,15 +2310,42 @@ function KeepAliveRoute(options) {
   const anchor = document.createComment("keep-alive-route");
   const cache = /* @__PURE__ */ new Map();
   const lruOrder = [];
+  const frozen = captureFrozen();
+  const gate = pauseGate(frozen);
   const routerOpts = _routerRef.current["options"];
   const keepAliveOpt = routerOpts.keepAlive;
   const maxCache = options?.max ?? (typeof keepAliveOpt === "number" ? keepAliveOpt : 20);
   const includeNames = options?.include ?? (Array.isArray(keepAliveOpt) ? keepAliveOpt : void 0);
+  const suspendInactive = options?.suspendInactive === true;
+  const suspended = /* @__PURE__ */ new Map();
+  const suspend = (node) => {
+    if (!suspendInactive || suspended.has(node)) return;
+    const owner = instanceScopes.get(node)?.owner ?? null;
+    owner?.freeze?.();
+    suspended.set(node, { owner, unhold: holdSubtree(node) });
+  };
+  const activate = (node) => {
+    const paused = suspended.get(node);
+    if (paused === void 0) return;
+    suspended.delete(node);
+    paused.unhold();
+    paused.owner?.thaw?.();
+  };
+  const disposeCached = (node) => {
+    const paused = suspended.get(node);
+    suspended.delete(node);
+    try {
+      disposeOwned(node);
+    } finally {
+      paused?.unhold();
+    }
+  };
   let currentNode = null;
   let currentKey = "";
   let currentCached = false;
   let updateSeq = 0;
   let kaTorn = false;
+  const loaded = beginLoading(anchor);
   const update = async () => {
     routerRevision();
     if (kaTorn || !_routerRef.current) return;
@@ -2068,7 +2353,10 @@ function KeepAliveRoute(options) {
     const router2 = _routerRef.current;
     const route2 = scopedRoute(router2);
     const match = router2["matcher"].match(route2.path);
-    if (!match) return;
+    if (!match) {
+      settleEmpty(route2, loaded, () => !kaTorn && seq === updateSeq);
+      return;
+    }
     const { route: routeDef } = match;
     if ("redirect" in routeDef) {
       const redirectPath = typeof routeDef.redirect === "function" ? routeDef.redirect(route2) : routeDef.redirect;
@@ -2079,11 +2367,15 @@ function KeepAliveRoute(options) {
       });
       return;
     }
-    if (!("component" in routeDef)) return;
+    if (!("component" in routeDef)) {
+      settleEmpty(route2, loaded, () => !kaTorn && seq === updateSeq);
+      return;
+    }
     const cacheKey = JSON.stringify([route2.path, queryIdentity(route2.queryAll), route2.hash]);
     const shouldCache = !includeNames || routeDef.name != null && includeNames.includes(routeDef.name);
     if (cacheKey === currentKey && currentNode) {
       updateInstanceRoute(currentNode, route2);
+      loaded.done();
       return;
     }
     if (!anchor.parentNode) {
@@ -2098,81 +2390,142 @@ function KeepAliveRoute(options) {
     } else {
       try {
         const plan = await router2.loadPlan(routeDef, route2.path);
+        while (gate.held()) if (!await gate.until()) return;
         if (kaTorn || seq !== updateSeq) return;
-        node = await instantiateScoped(router2, plan, routeDef, route2.path, route2);
+        node = await instantiateScoped(
+          router2,
+          plan,
+          routeDef,
+          route2.path,
+          route2,
+          null,
+          gate,
+          () => !kaTorn && seq === updateSeq
+        );
       } catch (error) {
-        if (kaTorn || seq !== updateSeq) return;
+        if (cancellations.has(error) || kaTorn || seq !== updateSeq) return;
         console.error("[KeepAliveRoute] Component error:", error);
+        loaded.cancel();
         return;
       }
-      if (!node) return;
-      if (kaTorn || seq !== updateSeq) {
-        disposeOwned(node);
+      if (!node) {
+        if (!kaTorn && seq === updateSeq) loaded.done();
         return;
       }
     }
-    const parent = anchor.parentNode;
-    if (!parent) {
+    await commit(seq, node, fromCache, cacheKey, shouldCache, route2);
+  };
+  const commit = (seq, node, fromCache, cacheKey, shouldCache, route2) => commitPass(gate, {
+    node: fromCache ? null : node,
+    owned: () => !kaTorn && seq === updateSeq,
+    discard: () => {
       if (!fromCache) disposeOwned(node);
-      attachWait.request();
-      return;
-    }
-    if (currentNode && currentNode !== node) {
-      if (currentNode.parentNode) currentNode.parentNode.removeChild(currentNode);
-      if (!currentCached) disposeOwned(currentNode);
-    }
-    if (fromCache) {
-      updateInstanceRoute(node, route2);
-      const idx = lruOrder.indexOf(cacheKey);
-      if (idx !== -1) lruOrder.splice(idx, 1);
-      lruOrder.push(cacheKey);
-    } else if (shouldCache) {
-      cache.set(cacheKey, node);
-      lruOrder.push(cacheKey);
-      while (lruOrder.length > maxCache) {
+    },
+    // The outgoing view goes first: detached, and disposed unless it is
+    // cached (then paused, with `suspendInactive`). Once only: it is no
+    // longer the current view afterwards.
+    teardown: () => {
+      const outgoing = currentNode;
+      if (outgoing === null || outgoing === node || !anchor.parentNode) return false;
+      const wasCached = currentCached;
+      currentNode = null;
+      currentKey = "";
+      currentCached = false;
+      outgoing.parentNode?.removeChild(outgoing);
+      if (!wasCached) disposeOwned(outgoing);
+      else if (!kaTorn) suspend(outgoing);
+      return true;
+    },
+    insert: () => {
+      const parent = anchor.parentNode;
+      if (!parent) {
+        if (!fromCache) disposeOwned(node);
+        attachWait.request();
+        return;
+      }
+      if (fromCache) {
+        updateInstanceRoute(node, route2);
+        const idx = lruOrder.indexOf(cacheKey);
+        if (idx !== -1) lruOrder.splice(idx, 1);
+        lruOrder.push(cacheKey);
+      } else if (shouldCache) {
+        cache.set(cacheKey, node);
+        lruOrder.push(cacheKey);
+      }
+      currentNode = node;
+      currentCached = fromCache || shouldCache;
+      currentKey = cacheKey;
+      try {
+        parent.insertBefore(node, anchor.nextSibling);
+      } catch (error) {
+        if (currentNode === node) {
+          currentNode = null;
+          currentKey = "";
+          currentCached = false;
+        }
+        if (!fromCache) {
+          if (cache.get(cacheKey) === node) {
+            cache.delete(cacheKey);
+            const at = lruOrder.lastIndexOf(cacheKey);
+            if (at !== -1) lruOrder.splice(at, 1);
+          }
+          disposeOwned(node);
+        }
+        console.error("[KeepAliveRoute] Component error:", error);
+        if (!kaTorn && seq === updateSeq) loaded.cancel();
+        return;
+      }
+      if (kaTorn) return;
+      if (seq === updateSeq) loaded.done();
+      if (fromCache) activate(node);
+      while (!kaTorn && lruOrder.length > maxCache) {
         const evictKey = lruOrder.shift();
         if (evictKey === cacheKey) {
           lruOrder.push(evictKey);
           break;
         }
         const evictNode = cache.get(evictKey);
+        cache.delete(evictKey);
         if (evictNode) {
-          disposeOwned(evictNode);
-          if (evictNode.parentNode) evictNode.parentNode.removeChild(evictNode);
-          cache.delete(evictKey);
+          disposeCached(evictNode);
+          evictNode.parentNode?.removeChild(evictNode);
         }
       }
     }
-    currentNode = node;
-    currentCached = fromCache || shouldCache;
-    currentKey = cacheKey;
-    parent.insertBefore(node, anchor.nextSibling);
-  };
+  });
   let initialized = false;
   const wrappedUpdate = async () => {
     await update();
     initialized = true;
   };
-  const attachWait = attachRetry(anchor, update);
-  const kaTeardown = track(wrappedUpdate);
+  const attachWait = attachRetry(anchor, () => whenActive(gate, update));
+  const kaTeardown = reactiveBinding(wrappedUpdate, anchor);
   if (!initialized) {
     queueMicrotask(
       bindOwnerScope(() => {
-        if (!initialized && anchor.parentNode) wrappedUpdate();
+        whenActive(
+          gate,
+          bindOwnerScope(() => {
+            if (!initialized && anchor.parentNode) wrappedUpdate();
+          })
+        );
       })
     );
   }
   const kaCleanup = () => {
     if (kaTorn) return;
     kaTorn = true;
+    gate.close();
+    loaded.cancel();
     updateSeq++;
     kaTeardown();
     attachWait.cancel();
     for (const node of cache.values()) {
-      disposeOwned(node);
+      disposeCached(node);
       if (node.parentNode) node.parentNode.removeChild(node);
     }
     cache.clear();
+    suspended.clear();
     lruOrder.length = 0;
     if (currentNode?.parentNode) currentNode.parentNode.removeChild(currentNode);
     if (currentNode && !currentCached) disposeOwned(currentNode);
@@ -2180,6 +2533,7 @@ function KeepAliveRoute(options) {
     currentKey = "";
     currentCached = false;
   };
+  registerNodesRange(anchor, () => [currentNode]);
   registerDisposer(anchor, kaCleanup);
   routeCleanups.push(kaCleanup);
   return anchor;
@@ -2255,6 +2609,15 @@ function Suspense(props) {
   const anchor = document.createComment("suspense-boundary");
   let currentNode = null;
   let fallbackNode = null;
+  const frozen = captureFrozen();
+  let contentOwner = structuralBinding(NOOP);
+  let fallbackOwner = null;
+  const endContent = () => {
+    const owner = contentOwner;
+    contentOwner = null;
+    owner?.stop();
+  };
+  const loaded = beginLoading(anchor);
   let isLoading = false;
   let generation = 0;
   let tornDown = false;
@@ -2269,21 +2632,36 @@ function Suspense(props) {
     release(fallbackNode);
     currentNode = null;
     fallbackNode = null;
+    endFallback();
+  };
+  const endFallback = () => {
+    const owner = fallbackOwner;
+    fallbackOwner = null;
+    owner?.stop();
   };
   const showFallback = (myGeneration) => {
     if (fallbackNode || !props.fallback || tornDown) return;
     if (!anchor.parentNode) return;
     let fallback;
     try {
-      fallback = typeof props.fallback === "function" ? props.fallback() : props.fallback;
+      const factory = props.fallback;
+      if (typeof factory === "function") {
+        const owner = fallbackOwner = frozen.run(() => structuralBinding(NOOP));
+        fallback = owner.run(factory);
+      } else fallback = factory;
     } catch (error) {
       console.error("[Suspense] Fallback error:", error);
+      endFallback();
+      return;
+    }
+    if (!fallback || fallback.nodeType !== 1) {
+      endFallback();
       return;
     }
-    if (!fallback || fallback.nodeType !== 1) return;
     const parent = commitTarget(myGeneration);
     if (!parent) {
       release(fallback);
+      endFallback();
       return;
     }
     fallbackNode = fallback;
@@ -2294,7 +2672,9 @@ function Suspense(props) {
     isLoading = true;
     const myGeneration = ++generation;
     try {
-      const result = props.nodes();
+      const owner = contentOwner;
+      if (owner === null) return;
+      const result = owner.run(props.nodes);
       let element;
       const isNode = typeof result?.nodeType === "number";
       if (!isNode && result != null && typeof result.then === "function") {
@@ -2303,35 +2683,84 @@ function Suspense(props) {
       } else {
         element = result;
       }
-      const parent = commitTarget(myGeneration);
-      if (!parent) {
-        release(element);
-        cleanupNodes();
-        return;
-      }
-      cleanupNodes();
-      parent.insertBefore(element, anchor.nextSibling);
-      currentNode = element;
+      settle(myGeneration, true, element);
     } catch (error) {
       console.error("[Suspense] Nodes error:", error);
-      const parent = commitTarget(myGeneration);
-      cleanupNodes();
-      if (!parent) return;
-      const errorElement = document.createElement("div");
-      errorElement.className = "suspense-error";
-      errorElement.textContent = error instanceof Error ? error.message : "Failed to load";
-      parent.insertBefore(errorElement, anchor.nextSibling);
-      currentNode = errorElement;
+      endContent();
+      settle(myGeneration, false, error);
     } finally {
       isLoading = false;
     }
   };
+  const committing = { cancel: NOOP };
+  let dropWait = null;
+  const settle = (myGeneration, ok, value) => {
+    let view;
+    if (ok) view = value;
+    else {
+      view = document.createElement("div");
+      view.className = "suspense-error";
+      view.textContent = value instanceof Error ? value.message : "Failed to load";
+    }
+    commitWhenActive(committing, {
+      held: frozen,
+      node: view,
+      owned: () => !tornDown && myGeneration === generation,
+      // Never shown: the content (or what is left of it) is abandoned.
+      discard: () => {
+        release(view);
+        endContent();
+        loaded.cancel();
+      },
+      teardown: () => {
+        if (!anchor.parentNode || !(currentNode || fallbackNode || fallbackOwner)) return false;
+        cleanupNodes();
+        return true;
+      },
+      insert: () => {
+        const parent = commitTarget(myGeneration);
+        if (!parent) {
+          release(view);
+          cleanupNodes();
+          endContent();
+          loaded.cancel();
+          return;
+        }
+        currentNode = view;
+        try {
+          parent.insertBefore(view, anchor.nextSibling);
+        } catch (error) {
+          if (currentNode === view) currentNode = null;
+          release(view);
+          endContent();
+          console.error("[Suspense] Nodes error:", error);
+          if (ok) settle(myGeneration, false, error);
+          else loaded.cancel();
+          return;
+        }
+        if (!tornDown && myGeneration === generation) loaded.done();
+      }
+    });
+  };
+  registerNodesRange(anchor, () => [currentNode, fallbackNode]);
   registerDisposer(anchor, () => {
     tornDown = true;
     generation++;
+    dropWait?.();
+    dropWait = null;
+    committing.cancel();
     cleanupNodes();
+    endContent();
+    loaded.cancel();
+  });
+  const renderInScope = bindOwnerScope(() => {
+    if (!tornDown) render();
   });
-  queueMicrotask(bindOwnerScope(render));
+  queueMicrotask(
+    bindOwnerScope(() => {
+      dropWait = frozen.wait(renderInScope, NOOP);
+    })
+  );
   return anchor;
 }
 var LAZY_MARKER = /* @__PURE__ */ Symbol.for("sibujs:lazy");
@@ -2393,11 +2822,14 @@ function __removeRouterPagehideHandler() {
 function Outlet() {
   const anchor = document.createComment("route-outlet-nested");
   const adoptScope = captureScope();
+  const frozen = captureFrozen();
+  const gate = pauseGate(frozen);
   let currentNode = null;
   let currentChild = null;
   let currentKey = null;
   let navSeq = 0;
   let outletTorn = false;
+  const loaded = beginLoading(anchor);
   const clearCurrent = () => {
     if (currentNode) {
       disposeOwned(currentNode);
@@ -2423,21 +2855,25 @@ function Outlet() {
     const route2 = scopedRoute(_routerRef.current);
     if (route2.matched.length < 2) {
       clearCurrent();
+      settleEmpty(route2, loaded, () => !outletTorn && seq === navSeq);
       return;
     }
     const childRoute = route2.matched[route2.matched.length - 1];
     if (!childRoute || !("component" in childRoute)) {
       clearCurrent();
+      loaded.done();
       return;
     }
     const key = instanceKey(childRoute, route2.matched.slice(1), route2);
     if (childRoute === currentChild && key === currentKey && currentNode) {
       updateInstanceRoute(currentNode, route2);
+      loaded.done();
       return;
     }
     try {
       const cacheKey = `${route2.path}\0${childRoute.path}`;
       const plan = await _routerRef.current.loadPlan(childRoute, cacheKey);
+      while (gate.held()) if (!await gate.until()) return;
       if (!commitTarget(seq)) {
         retryIfDetached(seq);
         return;
@@ -2448,31 +2884,64 @@ function Outlet() {
         childRoute,
         cacheKey,
         route2,
-        keyedScope(adoptScope, childRoute.path)
+        keyedScope(adoptScope, childRoute.path),
+        gate,
+        () => commitTarget(seq) !== null
       );
-      const parent = commitTarget(seq);
-      if (!parent) {
-        release(node);
-        retryIfDetached(seq);
-        return;
-      }
-      if (!node) return;
-      clearCurrent();
-      parent.insertBefore(node, anchor.nextSibling);
-      currentNode = node;
-      currentChild = childRoute;
-      currentKey = key;
+      await commitPass(gate, {
+        node,
+        owned: () => !outletTorn && seq === navSeq,
+        discard: () => release(node),
+        teardown: () => {
+          if (!node || !anchor.parentNode || !currentNode) return false;
+          clearCurrent();
+          return true;
+        },
+        insert: () => {
+          const parent = commitTarget(seq);
+          if (!parent) {
+            release(node);
+            retryIfDetached(seq);
+            return;
+          }
+          if (node) {
+            currentNode = node;
+            currentChild = childRoute;
+            currentKey = key;
+            try {
+              parent.insertBefore(node, anchor.nextSibling);
+            } catch (error) {
+              if (currentNode === node) {
+                currentNode = null;
+                currentChild = null;
+                currentKey = null;
+              }
+              release(node);
+              throw error;
+            }
+          }
+          if (!outletTorn && seq === navSeq) loaded.done();
+        }
+      });
     } catch (error) {
-      if (outletTorn || seq !== navSeq) return;
+      if (cancellations.has(error) || outletTorn || seq !== navSeq) return;
       console.error("[Outlet] Failed to render child route:", error);
+      loaded.cancel();
     }
   };
-  const attachWait = attachRetry(anchor, update);
-  const outletTeardown = track(update);
+  const attachWait = attachRetry(anchor, () => whenActive(gate, update));
+  const outletTeardown = reactiveBinding(() => {
+    void update();
+  }, anchor);
   if (!anchor.parentNode) {
     queueMicrotask(
       bindOwnerScope(() => {
-        if (anchor.parentNode) update();
+        whenActive(
+          gate,
+          bindOwnerScope(() => {
+            if (anchor.parentNode) update();
+          })
+        );
       })
     );
   }
@@ -2480,6 +2949,8 @@ function Outlet() {
     if (outletTorn) return;
     outletTorn = true;
     navSeq++;
+    gate.close();
+    loaded.cancel();
     outletTeardown();
     attachWait.cancel();
     if (currentNode) {
@@ -2490,6 +2961,7 @@ function Outlet() {
     currentChild = null;
     currentKey = null;
   };
+  registerNodesRange(anchor, () => [currentNode]);
   registerDisposer(anchor, outletCleanup);
   routeCleanups.push(outletCleanup);
   return anchor;