sibujs 4.14.1 → 4.15.0

package/dist/plugins.cjs

@@ -751,6 +751,17 @@ var init_elementPolicy = __esm({
   }
 });
 
+// src/utils/globalSingleton.ts
+function globalSingleton(key, create) {
+  const g2 = globalThis;
+  return g2[key] ?? (g2[key] = create());
+}
+var init_globalSingleton = __esm({
+  "src/utils/globalSingleton.ts"() {
+    "use strict";
+  }
+});
+
 // src/core/rendering/adoptScope.ts
 function inAdoptScope() {
   return current?.s.on === true;
@@ -889,6 +900,7 @@ __export(dispose_exports, {
   registerDisposer: () => registerDisposer,
   replaceChildrenSafely: () => replaceChildrenSafely,
   reportDrainRunaway: () => reportDrainRunaway,
+  stageReplaceChildren: () => stageReplaceChildren,
   unregisterDisposer: () => unregisterDisposer,
   withDisposerRollback: () => withDisposerRollback
 });
@@ -922,7 +934,7 @@ function registerDisposer(node, teardown) {
     elementDisposers.set(node, disposers);
   }
   disposers.push(teardown);
-  if (DEV) activeBindingCount++;
+  if (DEV) bindings.count++;
   const capture = resolveCapture(registrationCaptures[registrationCaptures.length - 1]);
   if (capture) capture.entries.push([node, teardown]);
 }
@@ -975,7 +987,7 @@ function unregisterDisposer(node, teardown) {
   const index = disposers.indexOf(teardown);
   if (index === -1) return false;
   disposers.splice(index, 1);
-  if (DEV) activeBindingCount--;
+  if (DEV) bindings.count--;
   if (disposers.length === 0) elementDisposers.delete(node);
   return true;
 }
@@ -999,17 +1011,17 @@ function disposeNodeOwn(node) {
   let executed = 0;
   let runaway = false;
   while (!runaway) {
-    const pending = elementDisposers.get(node);
-    if (!pending || pending.length === 0) break;
-    const snapshot = pending.slice();
+    const pending2 = elementDisposers.get(node);
+    if (!pending2 || pending2.length === 0) break;
+    const snapshot = pending2.slice();
     elementDisposers.delete(node);
-    if (DEV) activeBindingCount -= snapshot.length;
+    if (DEV) bindings.count -= snapshot.length;
     for (let i2 = 0; i2 < snapshot.length; i2++) {
       if (executed >= MAX_DRAIN_TEARDOWNS) {
         const rest = snapshot.slice(i2);
         const added = elementDisposers.get(node);
         elementDisposers.set(node, added ? rest.concat(added) : rest);
-        if (DEV) activeBindingCount += rest.length;
+        if (DEV) bindings.count += rest.length;
         reportDrainRunaway("dispose", executed, rest.length + (added?.length ?? 0));
         runaway = true;
         break;
@@ -1048,26 +1060,69 @@ function replaceChildrenSafely(parent, ...next) {
   }
   parent.replaceChildren(...next);
 }
+function stageReplaceChildren(parent, next) {
+  const done = /* @__PURE__ */ new Set();
+  const adopted = () => {
+    if (!isHydrating() || next.length === 0 || next[0] !== parent.firstChild) return false;
+    for (let i2 = 1; i2 < next.length; i2++) if (next[i2 - 1].nextSibling !== next[i2]) return false;
+    return true;
+  };
+  const outgoing = () => {
+    if (adopted()) {
+      const out = [];
+      for (let n = next[next.length - 1].nextSibling; n !== null; n = n.nextSibling) out.push(n);
+      return out;
+    }
+    for (let i2 = 0; i2 < next.length; i2++) next[i2].parentNode?.removeChild(next[i2]);
+    return Array.from(parent.childNodes);
+  };
+  return {
+    teardown: () => {
+      let ran = false;
+      for (const node of outgoing()) {
+        if (done.has(node)) continue;
+        done.add(node);
+        ran = true;
+        dispose(node);
+      }
+      return ran;
+    },
+    insert: () => {
+      if (!adopted()) {
+        parent.replaceChildren(...next);
+        return;
+      }
+      const last = next[next.length - 1];
+      while (last.nextSibling) parent.removeChild(last.nextSibling);
+    }
+  };
+}
 function checkLeaks(warnThreshold = 0) {
   if (!DEV) return 0;
-  if (warnThreshold > 0 && activeBindingCount > warnThreshold) {
+  if (warnThreshold > 0 && bindings.count > warnThreshold) {
     devWarn(
-      `checkLeaks: ${activeBindingCount} active DOM bindings detected. Expected \u2264${warnThreshold}. This may indicate a component was removed from the DOM without calling dispose().`
+      `checkLeaks: ${bindings.count} active DOM bindings detected. Expected \u2264${warnThreshold}. This may indicate a component was removed from the DOM without calling dispose().`
     );
   }
-  return activeBindingCount;
+  return bindings.count;
 }
-var elementDisposers, MAX_DRAIN_TEARDOWNS, activeBindingCount, registrationCaptures;
+var state2, elementDisposers, MAX_DRAIN_TEARDOWNS, bindings, registrationCaptures;
 var init_dispose = __esm({
   "src/core/rendering/dispose.ts"() {
     "use strict";
+    init_globalSingleton();
     init_dev();
     init_errors();
     init_hydrationHooks();
-    elementDisposers = /* @__PURE__ */ new WeakMap();
+    state2 = globalSingleton(/* @__PURE__ */ Symbol.for("sibujs.disposers.v1"), () => ({
+      disposers: /* @__PURE__ */ new WeakMap(),
+      captures: [],
+      bindings: { count: 0 }
+    }));
+    elementDisposers = state2.disposers;
     MAX_DRAIN_TEARDOWNS = 1e4;
-    activeBindingCount = 0;
-    registrationCaptures = [];
+    bindings = state2.bindings;
+    registrationCaptures = state2.captures;
   }
 });
 
@@ -1222,6 +1277,178 @@ function bindOwnerScope(fn) {
   if (scope === null) return fn;
   return (...args) => runWithOwnerScope(scope, () => fn(...args));
 }
+function ownerState(tok) {
+  let state5 = ACTIVE;
+  for (let t2 = tok; t2 !== null; ) {
+    const o = t2.sub;
+    if (o === null) return ENDED;
+    if (o._frozen === true) state5 = PAUSED;
+    t2 = o._owner ?? null;
+  }
+  return state5;
+}
+function queueStateCheck() {
+  if (stateCheckQueued || stateWatchers.size === 0) return;
+  stateCheckQueued = true;
+  queueMicrotask(() => {
+    stateCheckQueued = false;
+    for (const watcher of [...stateWatchers]) {
+      if (!stateWatchers.has(watcher)) continue;
+      const state5 = watcher.check.state();
+      if (state5 === ENDED) stateWatchers.delete(watcher);
+      if (state5 === ENDED || state5 === watcher.last) continue;
+      watcher.last = state5;
+      try {
+        watcher.listener(state5);
+      } catch (err) {
+        reportError(err, { phase: "effect" });
+      }
+    }
+  });
+}
+function captureFrozen() {
+  const tok = currentStructOwner;
+  if (tok === null) return ALWAYS_ACTIVE;
+  const state5 = () => ownerState(tok);
+  const check = Object.assign(() => state5() !== ACTIVE, {
+    state: state5,
+    wait: (onActive, onEnd) => {
+      const now = state5();
+      if (now !== PAUSED) {
+        (now === ACTIVE ? onActive : onEnd)();
+        return NOOP;
+      }
+      const waiter = { check, onActive, onEnd };
+      waiters.add(waiter);
+      return () => {
+        waiters.delete(waiter);
+      };
+    },
+    onEnd: (onEnd) => {
+      if (state5() === ENDED) {
+        onEnd();
+        return NOOP;
+      }
+      const watcher = { check, onActive: NOOP, onEnd };
+      endWatchers.add(watcher);
+      return () => {
+        endWatchers.delete(watcher);
+      };
+    },
+    run: (fn) => {
+      const prev = currentStructOwner;
+      currentStructOwner = tok.sub === null ? null : tok;
+      try {
+        return fn();
+      } finally {
+        currentStructOwner = prev;
+      }
+    },
+    onChange: (listener) => {
+      const last = state5();
+      if (last === ENDED) return NOOP;
+      const watcher = { check, last, listener };
+      stateWatchers.add(watcher);
+      return () => {
+        stateWatchers.delete(watcher);
+      };
+    },
+    within: (owner) => {
+      const target = owner.run(() => currentStructOwner);
+      if (target === null) return false;
+      for (let t2 = tok; t2 !== null; ) {
+        if (t2 === target) return true;
+        const o = t2.sub;
+        if (o === null) return false;
+        t2 = o._owner ?? null;
+      }
+      return false;
+    }
+  });
+  return check;
+}
+function holdSubtree(root) {
+  heldRoots.add(root);
+  return () => {
+    if (heldRoots.delete(root)) settleHeld();
+  };
+}
+function isHeld(sub2) {
+  if (frozenOwners !== 0 && hasFrozenOwner(sub2)) return true;
+  if (heldRoots.size !== 0) {
+    const node = sub2._errorNode;
+    if (node != null) {
+      for (const root of heldRoots) if (root.contains(node)) return true;
+    }
+  }
+  return false;
+}
+function notifyEnded() {
+  for (const watcher of stateWatchers) if (watcher.check.state() === ENDED) stateWatchers.delete(watcher);
+  let ended = null;
+  for (const watcher of endWatchers) {
+    if (watcher.check.state() !== ENDED) continue;
+    endWatchers.delete(watcher);
+    (ended ?? (ended = [])).push(watcher);
+  }
+  if (ended === null) return;
+  for (const watcher of ended) {
+    try {
+      watcher.onEnd();
+    } catch (err) {
+      reportError(err, { phase: "cleanup" });
+    }
+  }
+}
+function dropReleasedSkipped() {
+  for (const sub2 of skippedWhileHeld) {
+    if (sub2._disposed === true || sub2.depsHead == null) skippedWhileHeld.delete(sub2);
+  }
+}
+function settleHeld() {
+  for (const sub2 of skippedWhileHeld) {
+    if (sub2._disposed === true) skippedWhileHeld.delete(sub2);
+    else if (!isHeld(sub2)) {
+      skippedWhileHeld.delete(sub2);
+      if (!pendingSet.has(sub2)) {
+        pendingSet.add(sub2);
+        pendingQueue.push(sub2);
+      }
+    }
+  }
+  if (frozenOwners === 0 && heldRoots.size === 0) skippedWhileHeld.clear();
+  let ready = null;
+  for (const waiter of waiters) {
+    if (waiter.check.state() === PAUSED) continue;
+    waiters.delete(waiter);
+    (ready ?? (ready = [])).push(waiter);
+  }
+  if (ready !== null) {
+    const settle = ready;
+    queueMicrotask(() => {
+      for (const waiter of settle) {
+        const state5 = waiter.check.state();
+        if (state5 === PAUSED) waiters.add(waiter);
+        else
+          try {
+            (state5 === ACTIVE ? waiter.onActive : waiter.onEnd)();
+          } catch (err) {
+            reportError(err, { phase: "effect" });
+          }
+      }
+    });
+  }
+  if (pendingQueue.length > 0) drainNotificationQueue();
+}
+function hasFrozenOwner(sub2) {
+  for (let t2 = sub2._owner ?? null; t2 !== null; ) {
+    const o = t2.sub;
+    if (o === null) return false;
+    if (o._frozen === true) return true;
+    t2 = o._owner ?? null;
+  }
+  return false;
+}
 function retrack(effectFn, subscriber) {
   const prev = currentSubscriber;
   let savedDepth = 0;
@@ -1328,6 +1555,20 @@ function structuralBinding(commit, ownerNode) {
       } finally {
         currentStructOwner = prev;
       }
+    },
+    freeze: () => {
+      const s2 = sub2;
+      if (s2._disposed || s2._frozen) return;
+      s2._frozen = true;
+      frozenOwners++;
+      queueStateCheck();
+    },
+    thaw: () => {
+      if (!sub2._frozen) return;
+      sub2._frozen = false;
+      frozenOwners--;
+      queueStateCheck();
+      settleHeld();
     }
   };
 }
@@ -1356,20 +1597,34 @@ function createBinding(commit, ownerNode, structural) {
   subscriber._errorNode = ownerNode;
   subscriber._tok = null;
   subscriber._owner = null;
+  subscriber._frozen = false;
   if (structural) subscriber._tok = { sub: subscriber };
   try {
     run();
   } catch (err) {
     subscriber._disposed = true;
     subscriber._errorNode = void 0;
-    if (subscriber._tok != null) subscriber._tok.sub = null;
+    if (subscriber._tok != null) {
+      subscriber._tok.sub = null;
+      if (endWatchers.size !== 0 || stateWatchers.size !== 0) notifyEnded();
+    }
     cleanup(subscriber);
     throw err;
   }
   subscriber._dispose = () => {
     subscriber._disposed = true;
+    const wasFrozen = subscriber._frozen === true;
+    if (wasFrozen) {
+      subscriber._frozen = false;
+      frozenOwners--;
+    }
     subscriber._errorNode = void 0;
-    if (subscriber._tok != null) subscriber._tok.sub = null;
+    if (subscriber._tok != null) {
+      subscriber._tok.sub = null;
+      if (endWatchers.size !== 0 || stateWatchers.size !== 0) notifyEnded();
+      if (skippedWhileHeld.size !== 0) dropReleasedSkipped();
+      if (wasFrozen || waiters.size !== 0) settleHeld();
+    }
     cleanup(subscriber);
   };
   return subscriber;
@@ -1475,6 +1730,10 @@ function runPendingOwners(sub2) {
   }
 }
 function runQueued(sub2) {
+  if ((frozenOwners !== 0 || heldRoots.size !== 0) && isHeld(sub2)) {
+    skippedWhileHeld.add(sub2);
+    return;
+  }
   if (quarantined.size > 0 && quarantined.has(sub2)) return;
   if (sub2._hasComputedDep === true && !depsChanged(sub2)) return;
   if (tickRepeat(sub2)) {
@@ -1620,7 +1879,7 @@ function forEachSubscriber(signal2, visit) {
     node = node.sigNext;
   }
 }
-var POOL_MAX, nodePool, currentSubscriber, suspendSavedSub, notifyDepth, pendingQueue, pendingSet, propagateStack, suspendDepth, trackingSuspended, currentOwnerScope, currentStructOwner, subscriberEpochCounter, maxSubscriberRepeats, maxDrainIterations, drainEpoch, quarantined;
+var POOL_MAX, nodePool, currentSubscriber, suspendSavedSub, notifyDepth, pendingQueue, pendingSet, propagateStack, suspendDepth, trackingSuspended, currentOwnerScope, currentStructOwner, frozenOwners, ACTIVE, PAUSED, ENDED, NOOP, skippedWhileHeld, waiters, heldRoots, endWatchers, stateWatchers, stateCheckQueued, ALWAYS_ACTIVE, subscriberEpochCounter, maxSubscriberRepeats, maxDrainIterations, drainEpoch, quarantined;
 var init_track_core = __esm({
   "src/reactivity/track-core.ts"() {
     "use strict";
@@ -1638,6 +1897,29 @@ var init_track_core = __esm({
     trackingSuspended = false;
     currentOwnerScope = null;
     currentStructOwner = null;
+    frozenOwners = 0;
+    ACTIVE = 0;
+    PAUSED = 1;
+    ENDED = 2;
+    NOOP = () => {
+    };
+    skippedWhileHeld = /* @__PURE__ */ new Set();
+    waiters = /* @__PURE__ */ new Set();
+    heldRoots = /* @__PURE__ */ new Set();
+    endWatchers = /* @__PURE__ */ new Set();
+    stateWatchers = /* @__PURE__ */ new Set();
+    stateCheckQueued = false;
+    ALWAYS_ACTIVE = Object.assign(() => false, {
+      state: () => ACTIVE,
+      wait: (onActive) => {
+        onActive();
+        return NOOP;
+      },
+      onEnd: () => NOOP,
+      run: (fn) => fn(),
+      onChange: () => NOOP,
+      within: () => false
+    });
     subscriberEpochCounter = 0;
     maxSubscriberRepeats = 1e3;
     maxDrainIterations = 1e6;
@@ -1681,18 +1963,20 @@ function resolveReactiveApi() {
     runWithOwnerScope,
     bindOwnerScope,
     structuralBinding,
+    captureFrozen,
+    holdSubtree,
     version: _runtimeVersion
   };
   g2[REGISTRY_KEY] = local;
   return local;
 }
-var _runtimeVersion, REGISTRY_KEY, API, suspendTracking2, resumeTracking2, isTrackingSuspended2, untracked2, retrack2, track2, reactiveBinding2, recordDependency2, cleanup2, setMaxSubscriberRepeats2, setMaxDrainIterations2, drainNotificationQueue2, queueSignalNotification2, notifySubscribers2, getSubscriberCount2, getSubscriberDeps2, forEachSubscriber2, getOwnerScope2, runWithOwnerScope2, bindOwnerScope2, structuralBinding2;
+var _runtimeVersion, REGISTRY_KEY, API, suspendTracking2, resumeTracking2, isTrackingSuspended2, untracked2, retrack2, track2, reactiveBinding2, recordDependency2, cleanup2, setMaxSubscriberRepeats2, setMaxDrainIterations2, drainNotificationQueue2, queueSignalNotification2, notifySubscribers2, getSubscriberCount2, getSubscriberDeps2, forEachSubscriber2, getOwnerScope2, runWithOwnerScope2, bindOwnerScope2, structuralBinding2, captureFrozen2, holdSubtree2;
 var init_track = __esm({
   "src/reactivity/track.ts"() {
     "use strict";
     init_dev();
     init_track_core();
-    _runtimeVersion = true ? "4.14.1" : "dev";
+    _runtimeVersion = true ? "4.15.0" : "dev";
     REGISTRY_KEY = /* @__PURE__ */ Symbol.for("sibujs.reactive.v1");
     API = resolveReactiveApi();
     suspendTracking2 = API.suspendTracking;
@@ -1716,30 +2000,46 @@ var init_track = __esm({
     runWithOwnerScope2 = API.runWithOwnerScope ?? runWithOwnerScope;
     bindOwnerScope2 = API.bindOwnerScope ?? bindOwnerScope;
     structuralBinding2 = API.structuralBinding ?? ((commit, ownerNode) => ({ stop: API.reactiveBinding(commit, ownerNode), run: (fn) => fn() }));
+    captureFrozen2 = API.captureFrozen ?? (() => Object.assign(() => false, {
+      state: () => 0,
+      wait: (onActive) => {
+        onActive();
+        return () => {
+        };
+      },
+      onEnd: () => () => {
+      },
+      run: (fn) => fn(),
+      onChange: () => () => {
+      },
+      within: () => false
+    }));
+    holdSubtree2 = API.holdSubtree ?? (() => () => {
+    });
   }
 });
 
 // src/core/rendering/streamBoundary.ts
 function currentBoundary() {
-  return slot3.current;
+  return slot2.current;
 }
 function runInBoundary(boundary, fn) {
-  const prev = slot3.current;
-  slot3.current = boundary;
+  const prev = slot2.current;
+  slot2.current = boundary;
   try {
     return fn();
   } finally {
-    slot3.current = prev;
+    slot2.current = prev;
   }
 }
 function setBoundaryHook(hook) {
-  slot3.hook = hook;
+  slot2.hook = hook;
 }
-var _a2, slot3;
+var _a2, slot2;
 var init_streamBoundary = __esm({
   "src/core/rendering/streamBoundary.ts"() {
     "use strict";
-    slot3 = globalThis[_a2 = /* @__PURE__ */ Symbol.for("sibujs.streamBoundary.v1")] ?? (globalThis[_a2] = { hook: null, current: null });
+    slot2 = globalThis[_a2 = /* @__PURE__ */ Symbol.for("sibujs.streamBoundary.v1")] ?? (globalThis[_a2] = { hook: null, current: null });
   }
 });
 
@@ -1836,14 +2136,14 @@ function runInSSRContext(fn) {
 }
 function trackPending(promise, label2, hydration = true) {
   const store = getRequestStore();
-  const pending = store?.pending;
-  const sessions = pending || !hydration ? [] : hydrationOwners();
-  if (!pending && sessions.length === 0) return promise;
+  const pending2 = store?.pending;
+  const sessions = pending2 || !hydration ? [] : hydrationOwners();
+  if (!pending2 && sessions.length === 0) return promise;
   const entry = { label: label2, since: Date.now(), boundary: currentBoundary() ?? void 0 };
-  pending?.add(entry);
+  pending2?.add(entry);
   const release = holdHydration(sessions, entry);
   const done = () => {
-    pending?.delete(entry);
+    pending2?.delete(entry);
     store?.wake?.();
     release();
   };
@@ -1871,14 +2171,28 @@ var init_ssr_context = __esm({
   }
 });
 
-// src/utils/globalSingleton.ts
-function globalSingleton(key, create) {
-  const g2 = globalThis;
-  return g2[key] ?? (g2[key] = create());
-}
-var init_globalSingleton = __esm({
-  "src/utils/globalSingleton.ts"() {
+// src/utils/styleKey.ts
+function styleKeyToProperty(key) {
+  let name = cache.get(key);
+  if (name !== void 0) return name;
+  if (key.startsWith("--")) name = key;
+  else if (Object.hasOwn(EXCEPTIONS, key)) name = EXCEPTIONS[key];
+  else {
+    name = key.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+    if (VENDOR_PREFIX.test(name)) name = `-${name}`;
+  }
+  if (cache.size >= CACHE_MAX) cache.clear();
+  cache.set(key, name);
+  return name;
+}
+var EXCEPTIONS, VENDOR_PREFIX, cache, CACHE_MAX;
+var init_styleKey = __esm({
+  "src/utils/styleKey.ts"() {
     "use strict";
+    EXCEPTIONS = { cssFloat: "float" };
+    VENDOR_PREFIX = /^(webkit|moz|ms|o)-/;
+    cache = /* @__PURE__ */ new Map();
+    CACHE_MAX = 1e3;
   }
 });
 
@@ -2019,7 +2333,7 @@ var init_serverHead = __esm({
 // src/utils/embedPolicy.ts
 function currentEmbedAllowlist() {
   const scoped = getRequestStore()?.caches?.get(REQUEST_CACHE)?.get("allowed");
-  return scoped ?? state2.allowed;
+  return scoped ?? state4.allowed;
 }
 function resolveEmbedSrc(value, allowed = currentEmbedAllowlist()) {
   if (typeof value !== "string" || sanitizeUrl(value) === "") return null;
@@ -2062,7 +2376,7 @@ function narrowEmbedAllow(value) {
   return granted.filter((feature) => !denied.includes(feature)).join("; ");
 }
 function getEmbedRecord(frame) {
-  return state2.frames.get(frame);
+  return state4.frames.get(frame);
 }
 function intersect(current2, permitted, separator) {
   const allowed = permitted.split(separator);
@@ -2107,14 +2421,14 @@ function embedSerializationTail(record, seen) {
   if (seen.fullscreen) tail += ' allowfullscreen=""';
   return tail;
 }
-var state2, REQUEST_CACHE, DEFAULT_EMBED_SANDBOX, EMBED_FEATURES;
+var state4, REQUEST_CACHE, DEFAULT_EMBED_SANDBOX, EMBED_FEATURES;
 var init_embedPolicy = __esm({
   "src/utils/embedPolicy.ts"() {
     "use strict";
     init_ssr_context();
     init_globalSingleton();
     init_sanitize();
-    state2 = globalSingleton(/* @__PURE__ */ Symbol.for("sibujs.embed.v2"), () => ({
+    state4 = globalSingleton(/* @__PURE__ */ Symbol.for("sibujs.embed.v2"), () => ({
       allowed: [],
       frames: /* @__PURE__ */ new WeakMap()
     }));
@@ -2277,23 +2591,18 @@ function splitDeclarations(text2) {
   out.push(text2.slice(start));
   return out;
 }
-function toKebab2(prop) {
-  if (prop.startsWith("--")) return prop;
-  if (Object.hasOwn(CAMEL_EXCEPTIONS, prop)) return CAMEL_EXCEPTIONS[prop];
-  return prop.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`).replace(/^(webkit|moz|ms)-/, "-$1-");
-}
 function styleProxy(style2) {
   return new Proxy(style2, {
     get(target, key, receiver) {
       if (typeof key === "string" && !(key in target)) {
         if (/^\d+$/.test(key)) return target.item(Number(key));
-        return target.getPropertyValue(toKebab2(key));
+        return target.getPropertyValue(styleKeyToProperty(key));
       }
       return Reflect.get(target, key, receiver);
     },
     set(target, key, value, receiver) {
       if (typeof key === "string" && !(key in target)) {
-        target.setProperty(toKebab2(key), value == null ? "" : String(value));
+        target.setProperty(styleKeyToProperty(key), value == null ? "" : String(value));
         return true;
       }
       return Reflect.set(target, key, value, receiver);
@@ -2335,21 +2644,21 @@ function compileSelector(selector) {
     const tokens = text2.match(/(?:\\.|\[[^\]]*\]|[^\s>])+|>/g) ?? [];
     const compounds = [];
     const combinators = [];
-    let pending = " ";
+    let pending2 = " ";
     let scoped = false;
     for (const token of tokens) {
       if (token === ">") {
-        pending = ">";
+        pending2 = ">";
         continue;
       }
       if (token === ":scope") {
         scoped = true;
-        pending = " ";
+        pending2 = " ";
         continue;
       }
-      if (compounds.length > 0) combinators.unshift(pending);
+      if (compounds.length > 0) combinators.unshift(pending2);
       compounds.unshift(parseCompound(token, selector));
-      pending = " ";
+      pending2 = " ";
     }
     if (compounds.length === 0) throw syntaxError(selector);
     groups.push({ compounds, combinators, scoped });
@@ -2575,12 +2884,13 @@ function explainServerError(err) {
 function ensureServerDom() {
   if (typeof document === "undefined") installServerDom();
 }
-var HTML_NS3, SVG_NS4, MATHML_NS, ELEMENT_NODE, ATTRIBUTE_NODE, TEXT_NODE, COMMENT_NODE, DOCUMENT_NODE, DOCUMENT_FRAGMENT_NODE, warnedSites, NAME_RE, ServerNodeList, observations, ServerMutationObserver, _ServerNode, ServerNode, ServerCharacterData, ServerText, ServerComment, ServerDocumentFragment, ServerAttr, ServerNamedNodeMap, CAMEL_EXCEPTIONS, ServerStyle, ServerTokenList, ServerElement, ServerHTMLElement, ServerInputElement, ServerTextAreaElement, ServerOptionElement, ServerSelectElement, ServerButtonElement, ServerDisableableElement, ServerCanvasElement, ServerDialogElement, ServerMediaElement, ServerTemplateElement, ServerSVGElement, ServerMathMLElement, HTML_CLASSES, NODE_FILTER, ServerTreeWalker, ServerDocument, selectorCache, VOID, INSTALLED, BROWSER_GLOBALS, WATCHED, BROWSER_ONLY_NAMES;
+var HTML_NS3, SVG_NS4, MATHML_NS, ELEMENT_NODE, ATTRIBUTE_NODE, TEXT_NODE, COMMENT_NODE, DOCUMENT_NODE, DOCUMENT_FRAGMENT_NODE, warnedSites, NAME_RE, ServerNodeList, observations, ServerMutationObserver, _ServerNode, ServerNode, ServerCharacterData, ServerText, ServerComment, ServerDocumentFragment, ServerAttr, ServerNamedNodeMap, ServerStyle, ServerTokenList, ServerElement, ServerHTMLElement, ServerInputElement, ServerTextAreaElement, ServerOptionElement, ServerSelectElement, ServerButtonElement, ServerDisableableElement, ServerCanvasElement, ServerDialogElement, ServerMediaElement, ServerTemplateElement, ServerSVGElement, ServerMathMLElement, HTML_CLASSES, NODE_FILTER, ServerTreeWalker, ServerDocument, selectorCache, VOID, INSTALLED, BROWSER_GLOBALS, WATCHED, BROWSER_ONLY_NAMES;
 var init_serverDom = __esm({
   "src/platform/serverDom.ts"() {
     "use strict";
     init_dev();
     init_ssr_context();
+    init_styleKey();
     HTML_NS3 = "http://www.w3.org/1999/xhtml";
     SVG_NS4 = "http://www.w3.org/2000/svg";
     MATHML_NS = "http://www.w3.org/1998/Math/MathML";
@@ -3176,7 +3486,6 @@ var init_serverDom = __esm({
         return this.find((a2) => a2.namespaceURI === (ns || null) && a2.localName === localName) ?? null;
       }
     };
-    CAMEL_EXCEPTIONS = { cssFloat: "float" };
     ServerStyle = class {
       constructor(el) {
         this.el = el;
@@ -4264,12 +4573,12 @@ async function hydrateAdopt(component, container, options = {}) {
       inScope(rootScope, () => session.place(container, tree));
     }
     const deadline = Date.now() + (options.timeout ?? 1e4);
-    const { pending, wake } = hydration;
+    const { pending: pending2, wake } = hydration;
     for (; ; ) {
       await macrotask();
-      if (pending.size === 0) {
+      if (pending2.size === 0) {
         await macrotask();
-        if (pending.size === 0) break;
+        if (pending2.size === 0) break;
         continue;
       }
       const remaining = deadline - Date.now();
@@ -4735,9 +5044,9 @@ function installHook() {
   if (hookInstalled) return;
   hookInstalled = true;
   setBoundaryHook((container) => {
-    const state3 = requestSlot("stream");
+    const state5 = requestSlot("stream");
     const store = getRequestStore();
-    if (!state3 || !store) return null;
+    if (!state5 || !store) return null;
     const id = `sibu-sus-${store.suspenseIdCounter++}`;
     container.setAttribute("data-sibu-suspense-id", id);
     const record = {
@@ -4748,8 +5057,8 @@ function installHook() {
       fallbackHtml: null,
       api: {
         enter: (fn) => {
-          if (record.fallbackHtml === null && state3.serialize) {
-            record.fallbackHtml = Array.from(container.childNodes, (n) => state3.serialize?.(n) ?? "").join("");
+          if (record.fallbackHtml === null && state5.serialize) {
+            record.fallbackHtml = Array.from(container.childNodes, (n) => state5.serialize?.(n) ?? "").join("");
           }
           return runInBoundary(record.api, fn);
         },
@@ -4759,7 +5068,7 @@ function installHook() {
         }
       }
     };
-    state3.boundaries.push(record);
+    state5.boundaries.push(record);
     return record.api;
   });
 }
@@ -4840,9 +5149,9 @@ async function waitFor(ready, deadline, stop2) {
     });
   }
 }
-function pendingFor(pending, boundary) {
-  if (!pending) return false;
-  for (const work of pending) if (work.boundary === boundary) return true;
+function pendingFor(pending2, boundary) {
+  if (!pending2) return false;
+  for (const work of pending2) if (work.boundary === boundary) return true;
   return false;
 }
 function streamPage(input2, options = {}) {
@@ -4855,8 +5164,8 @@ function streamPage(input2, options = {}) {
   const MARK_END = "<sibu-stream-end>";
   void runInSSRContext(async () => {
     const store = getRequestStore();
-    const state3 = { boundaries: [], serialize: null };
-    requestSlot("stream", () => state3);
+    const state5 = { boundaries: [], serialize: null };
+    requestSlot("stream", () => state5);
     const errors = [];
     if (store) store.errors = errors;
     let holder = null;
@@ -4877,13 +5186,13 @@ function streamPage(input2, options = {}) {
         throw explainServerError(err);
       }
       const serialize = (node) => renderToStringWith(node, { marker: options.marker ?? "root", ids });
-      state3.serialize = serialize;
+      state5.serialize = serialize;
       holder = document.createDocumentFragment();
       holder.appendChild(root);
       const ready = (b2) => b2.done && !pendingFor(store?.pending, b2.api);
       const serializeWithFallbacks = (node) => {
         const held = [];
-        for (const b2 of state3.boundaries) {
+        for (const b2 of state5.boundaries) {
           if (ready(b2) || b2.container === node || !node.contains(b2.container)) continue;
           if (held.some((h) => h.b.container.contains(b2.container))) continue;
           const nodes = Array.from(b2.container.childNodes);
@@ -4905,9 +5214,9 @@ function streamPage(input2, options = {}) {
       await waitFor(() => !pendingFor(store?.pending, void 0), shellDeadline, stopWaiting);
       failIfErrored();
       if (channel.cancelled) return;
-      for (const b2 of state3.boundaries) {
+      for (const b2 of state5.boundaries) {
         const inline = (x) => x.done && !pendingFor(store?.pending, x.api);
-        const enclosing = state3.boundaries.filter((a2) => a2 !== b2 && a2.container.contains(b2.container));
+        const enclosing = state5.boundaries.filter((a2) => a2 !== b2 && a2.container.contains(b2.container));
         if (inline(b2) && enclosing.every(inline)) b2.emitted = true;
       }
       const shell = serializeWithFallbacks(holder);
@@ -4928,8 +5237,8 @@ function streamPage(input2, options = {}) {
       if (channel.cancelled) return;
       failIfErrored();
       const deadline = Date.now() + (options.timeout ?? 1e4);
-      const outstanding = () => state3.boundaries.filter((b2) => !b2.emitted);
-      const ancestorsOf = (b2) => state3.boundaries.filter((a2) => a2 !== b2 && a2.container.contains(b2.container));
+      const outstanding = () => state5.boundaries.filter((b2) => !b2.emitted);
+      const ancestorsOf = (b2) => state5.boundaries.filter((a2) => a2 !== b2 && a2.container.contains(b2.container));
       const emittable = (b2) => ready(b2) && ancestorsOf(b2).every((a2) => a2.emitted);
       let bodyClosed = false;
       for (; ; ) {
@@ -4953,7 +5262,7 @@ function streamPage(input2, options = {}) {
           if (channel.cancelled) return;
           failIfErrored();
         }
-        for (const b2 of state3.boundaries) {
+        for (const b2 of state5.boundaries) {
           if (b2 === next || !next.container.contains(b2.container) || !ready(b2)) continue;
           const between2 = ancestorsOf(b2).filter((a2) => a2 !== next && next.container.contains(a2.container));
           if (between2.every(ready)) b2.emitted = true;
@@ -5622,12 +5931,12 @@ async function* renderToSuspenseStream(element, pendingBoundaries = [], options)
 function escapeScriptJson(json) {
   return json.replace(/</g, "\\u003c").replace(/>/g, "\\u003e").replace(/&/g, "\\u0026").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
 }
-function serializeState(state3, nonce, options) {
+function serializeState(state5, nonce, options) {
   const globalName = options?.global ?? SSR_DATA_ATTR;
   if (!SAFE_GLOBAL_NAME.test(globalName)) {
     throw new Error(`[SibuJS SSR] serializeState: global must be an identifier (got: ${JSON.stringify(globalName)})`);
   }
-  const rawJson = JSON.stringify(state3);
+  const rawJson = JSON.stringify(state5);
   const maxBytes = options?.maxBytes ?? DEFAULT_MAX_SSR_BYTES;
   const byteLen = typeof TextEncoder !== "undefined" ? new TextEncoder().encode(rawJson).byteLength : Buffer.byteLength(rawJson, "utf8");
   if (byteLen > maxBytes) {
@@ -6020,8 +6329,8 @@ function commitSafeAttribute(el, name, value, options) {
     else el.removeAttribute(name);
     return false;
   }
-  const pending = value == null || value === false ? null : value === true ? "" : String(value);
-  const refusal = contextualAttributeRefusal(el, name, pending, options.reactive ? "reactive" : "runtime");
+  const pending2 = value == null || value === false ? null : value === true ? "" : String(value);
+  const refusal = contextualAttributeRefusal(el, name, pending2, options.reactive ? "reactive" : "runtime");
   if (refusal !== ContextualRefusal.None) {
     warnContextualRefusal(options.label ?? "setSafeAttribute", name, refusal);
     if (ns) el.removeAttributeNS(ns, localName);
@@ -6187,7 +6496,7 @@ function restoreFocusWithin(snapshot, nodes, where, policy) {
   const active = document.activeElement;
   if (active === snapshot.el) return;
   if (active && active !== document.body && active !== document.documentElement) return;
-  if (snapshot.el.isConnected) {
+  if (snapshot.el.isConnected && !snapshot.el.closest("[inert]")) {
     refocus(snapshot.el, snapshot);
     return;
   }
@@ -6214,9 +6523,81 @@ function restoreFocusWithin(snapshot, nodes, where, policy) {
   });
 }
 
+// src/core/rendering/range.ts
+init_globalSingleton();
+init_ssr_context();
+var state3 = globalSingleton(/* @__PURE__ */ Symbol.for("sibujs.ranges.v1"), () => ({
+  ends: /* @__PURE__ */ new WeakMap(),
+  pending: /* @__PURE__ */ new WeakMap(),
+  registrations: /* @__PURE__ */ new Set(),
+  listeners: /* @__PURE__ */ new Set(),
+  notice: { queued: false, batch: [] }
+}));
+var ends = state3.ends;
+function registerRange(start, last) {
+  ends.set(start, last);
+}
+var pending = state3.pending;
+var NOTHING = () => {
+};
+var registrations = state3.registrations;
+var loadListeners = state3.listeners;
+var notice = state3.notice;
+function notifyLoad(settled) {
+  if (loadListeners.size === 0) return;
+  if (settled !== null) notice.batch.push(settled);
+  if (notice.queued) return;
+  notice.queued = true;
+  queueMicrotask(() => {
+    notice.queued = false;
+    const batch2 = notice.batch;
+    notice.batch = [];
+    for (const listener of [...loadListeners]) listener(batch2);
+  });
+}
+function beginPending(at, held) {
+  const entry = { at, held, settled: false, cancelled: false, committed: null };
+  registrations.add(entry);
+  notifyLoad(null);
+  const settle = (cancelled, committed) => {
+    if (entry.settled) return;
+    entry.settled = true;
+    entry.cancelled = cancelled;
+    entry.committed = committed;
+    registrations.delete(entry);
+    notifyLoad(entry);
+  };
+  return {
+    entry,
+    done: (committed) => settle(false, committed ?? null),
+    cancel: () => settle(true, null)
+  };
+}
+var INERT = { done: NOTHING, cancel: NOTHING };
+function beginLoading(anchor) {
+  if (isServer()) return INERT;
+  const { done, cancel } = beginPending(anchor, null);
+  return { done: () => done(), cancel };
+}
+function registerNodesRange(anchor, nodes) {
+  registerRange(anchor, () => {
+    const parent = anchor.parentNode;
+    const wanted = nodes().filter((n) => n !== null && n.parentNode === parent);
+    let last = null;
+    let left = wanted.length;
+    for (let n = anchor.nextSibling; n !== null && left > 0; n = n.nextSibling) {
+      if (wanted.includes(n)) {
+        last = n;
+        left--;
+      }
+    }
+    return last;
+  });
+}
+
 // src/reactivity/bindChildNode.ts
 init_track();
-function bindChildNode(placeholder, getter) {
+function bindChildNode(placeholder, getter, exposeNodes) {
   let lastNodes = [];
   const scope = captureScope();
   function commit() {
@@ -6287,6 +6668,12 @@ function bindChildNode(placeholder, getter) {
     lastNodes = newNodes;
     restoreFocusWithin(focused, newNodes, "bindChildNode");
   }
+  if (exposeNodes) {
+    registerRange(placeholder, () => {
+      for (let i2 = lastNodes.length - 1; i2 >= 0; i2--) if (lastNodes[i2].parentNode !== null) return lastNodes[i2];
+      return null;
+    });
+  }
   return reactiveBinding2(commit, placeholder, true);
 }
 
@@ -6294,6 +6681,7 @@ function bindChildNode(placeholder, getter) {
 init_track();
 init_elementPolicy();
 init_sanitize();
+init_styleKey();
 init_adoptScope();
 init_dispose();
 
@@ -6323,14 +6711,6 @@ var CLOBBER_RISKY_IDS = /* @__PURE__ */ new Set([
 var warnedLoneStrings = /* @__PURE__ */ new Set();
 var MAX_WARNED_LONE_STRINGS = 100;
 var loneStringCapAnnounced = false;
-var kebabCache = /* @__PURE__ */ new Map();
-function toKebab(prop) {
-  let cached = kebabCache.get(prop);
-  if (cached !== void 0) return cached;
-  cached = prop.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
-  kebabCache.set(prop, cached);
-  return cached;
-}
 function applyStyle(el, style2) {
   if (typeof style2 === "function") {
     const getter = style2;
@@ -6354,7 +6734,7 @@ function applyStyle(el, style2) {
         if (!Object.hasOwn(value, prop)) continue;
         const val = value[prop];
         if (val == null) continue;
-        const name = toKebab(prop);
+        const name = styleKeyToProperty(prop);
         next.push(name);
         decl.setProperty(name, sanitizeCSSDeclaration(name, String(val), { element: el }));
       }
@@ -6374,7 +6754,7 @@ function applyStyle(el, style2) {
   for (const prop in style2) {
     if (!Object.hasOwn(style2, prop)) continue;
     const val = style2[prop];
-    const name = toKebab(prop);
+    const name = styleKeyToProperty(prop);
     if (typeof val === "function") {
       const getter = val;
       const teardown = reactiveBinding2(() => {
@@ -6709,7 +7089,7 @@ var details = tagFactory("details");
 var dialog = tagFactory("dialog");
 var menu = tagFactory("menu");
 var summary = tagFactory("summary");
-var slot2 = tagFactory("slot");
+var slot3 = tagFactory("slot");
 var template = tagFactory("template");
 var base = tagFactory("base");
 var link = tagFactory("link");
@@ -6805,7 +7185,7 @@ function emitDevtools(hook, event, payload) {
 // src/core/signals/signal.ts
 var _g = globalThis;
 function signal(initial, options) {
-  const state3 = {
+  const state5 = {
     value: initial,
     __v: 0,
     __sc: 0,
@@ -6818,57 +7198,57 @@ function signal(initial, options) {
   };
   const debugName = DEV ? options?.name : void 0;
   const equalsFn = options?.equals;
-  if (debugName) state3.__name = debugName;
+  if (debugName) state5.__name = debugName;
   function get() {
-    recordDependency2(state3);
-    return state3.value;
+    recordDependency2(state5);
+    return state5.value;
   }
-  get.__signal = state3;
+  get.__signal = state5;
   if (debugName) get.__name = debugName;
   let set;
   if (equalsFn) {
     set = (next) => {
-      const prev = state3.value;
+      const prev = state5.value;
       const newValue = typeof next === "function" ? next(prev) : next;
       if (equalsFn(prev, newValue)) return;
-      state3.value = newValue;
-      state3.__v++;
+      state5.value = newValue;
+      state5.__v++;
       if (DEV) {
         const hook = _g.__SIBU_DEVTOOLS_GLOBAL_HOOK__;
-        if (hook) emitDevtools(hook, "signal:update", { signal: state3, name: debugName, oldValue: prev, newValue });
+        if (hook) emitDevtools(hook, "signal:update", { signal: state5, name: debugName, oldValue: prev, newValue });
       }
-      if (!enqueueBatchedSignal(state3)) {
-        notifySubscribers2(state3);
+      if (!enqueueBatchedSignal(state5)) {
+        notifySubscribers2(state5);
       }
     };
   } else if (DEV) {
     set = (next) => {
-      const prev = state3.value;
+      const prev = state5.value;
       const newValue = typeof next === "function" ? next(prev) : next;
       if (Object.is(newValue, prev)) return;
-      state3.value = newValue;
-      state3.__v++;
+      state5.value = newValue;
+      state5.__v++;
       const hook = _g.__SIBU_DEVTOOLS_GLOBAL_HOOK__;
-      if (hook) emitDevtools(hook, "signal:update", { signal: state3, name: debugName, oldValue: prev, newValue });
-      if (!enqueueBatchedSignal(state3)) {
-        notifySubscribers2(state3);
+      if (hook) emitDevtools(hook, "signal:update", { signal: state5, name: debugName, oldValue: prev, newValue });
+      if (!enqueueBatchedSignal(state5)) {
+        notifySubscribers2(state5);
       }
     };
   } else {
     set = (next) => {
-      const prev = state3.value;
+      const prev = state5.value;
       const newValue = typeof next === "function" ? next(prev) : next;
       if (Object.is(newValue, prev)) return;
-      state3.value = newValue;
-      state3.__v++;
-      if (!enqueueBatchedSignal(state3)) {
-        notifySubscribers2(state3);
+      state5.value = newValue;
+      state5.__v++;
+      if (!enqueueBatchedSignal(state5)) {
+        notifySubscribers2(state5);
       }
     };
   }
   if (DEV) {
     const hook = _g.__SIBU_DEVTOOLS_GLOBAL_HOOK__;
-    if (hook) emitDevtools(hook, "signal:create", { signal: state3, name: debugName, getter: get, initial });
+    if (hook) emitDevtools(hook, "signal:create", { signal: state5, name: debugName, getter: get, initial });
   }
   return [get, set];
 }
@@ -7030,16 +7410,16 @@ function createModuleRegistry() {
   };
 }
 function createBundle(modules) {
-  const cache = /* @__PURE__ */ new Map();
+  const cache2 = /* @__PURE__ */ new Map();
   const bundle = {};
   for (const key of Object.keys(modules)) {
     Object.defineProperty(bundle, key, {
       get() {
-        if (cache.has(key)) {
-          return cache.get(key);
+        if (cache2.has(key)) {
+          return cache2.get(key);
         }
         const value = modules[key]();
-        cache.set(key, value);
+        cache2.set(key, value);
         return value;
       },
       enumerable: true,
@@ -7108,7 +7488,7 @@ var CDN_ENTRY_POINTS = {
 };
 var packageInfo = {
   name: "sibujs",
-  version: true ? "4.14.1" : "dev",
+  version: true ? "4.15.0" : "dev",
   entryPoints: MODULE_ENTRY_POINTS,
   /**
    * Generate the package.json `exports` map. Module entries resolve to the
@@ -7255,18 +7635,18 @@ function createPluginRegistry() {
         return true;
       };
       installStack.add(p2.name);
-      let pending;
+      let pending2;
       try {
-        pending = adoptThenable(p2.install(ctx, options));
+        pending2 = adoptThenable(p2.install(ctx, options));
       } finally {
         installStack.delete(p2.name);
       }
-      if (!pending) {
+      if (!pending2) {
         if (!commit()) throw new PluginInstallCancelledError(p2.name);
         return;
       }
       if (myGeneration === generation) pendingInstalls.set(p2.name, myGeneration);
-      const settled = pending.then(
+      const settled = pending2.then(
         () => {
           if (commit()) return;
           if (pendingInstalls.get(p2.name) === myGeneration) pendingInstalls.delete(p2.name);
@@ -7905,6 +8285,66 @@ function sameAttrs(el, attrs) {
 init_dev();
 init_adoptScope();
 init_dispose();
+
+// src/core/rendering/heldCommit.ts
+init_track();
+var NOOP2 = () => {
+};
+function commitWhenActive(slot4, c) {
+  let over = false;
+  let unhold = null;
+  let drop = NOOP2;
+  const finish = () => {
+    over = true;
+    if (slot4.cancel === cancel) slot4.cancel = NOOP2;
+    drop();
+    drop = NOOP2;
+  };
+  const cancel = () => {
+    if (over) return;
+    finish();
+    const release = unhold;
+    unhold = null;
+    try {
+      c.discard();
+    } finally {
+      release?.();
+    }
+  };
+  const attempt = () => {
+    drop = NOOP2;
+    let clean = false;
+    while (!over) {
+      const state5 = c.held.state();
+      if (state5 === 2 || c.owned !== void 0 && !c.owned()) {
+        cancel();
+        return;
+      }
+      if (state5 === 1) {
+        if (c.node !== null && unhold === null) unhold = holdSubtree2(c.node);
+        drop = c.held.wait(attempt, attempt);
+        return;
+      }
+      if (unhold !== null) {
+        const release = unhold;
+        unhold = null;
+        release();
+        continue;
+      }
+      if (!clean) {
+        clean = c.teardown?.() !== true;
+        continue;
+      }
+      finish();
+      c.insert();
+      return;
+    }
+  };
+  slot4.cancel = cancel;
+  attempt();
+}
+
+// src/plugins/router.ts
 init_hydrationHooks();
 init_ssr_context();
 init_serverHead();
@@ -8472,15 +8912,15 @@ var _ComponentLoader = class _ComponentLoader {
     const cached = this.planCache.get(cacheKey);
     if (cached && cached.kind === "factory") return cached.component;
     this.assertNotHot(cacheKey);
-    let pending = this.moduleLoads.get(cacheKey);
-    const owner = pending === void 0;
-    if (pending === void 0) {
-      pending = plan.load();
-      this.moduleLoads.set(cacheKey, pending);
+    let pending2 = this.moduleLoads.get(cacheKey);
+    const owner = pending2 === void 0;
+    if (pending2 === void 0) {
+      pending2 = plan.load();
+      this.moduleLoads.set(cacheKey, pending2);
     }
     let resolved;
     try {
-      resolved = await pending;
+      resolved = await pending2;
     } catch (error) {
       this.noteError(cacheKey);
       throw error;
@@ -8502,7 +8942,14 @@ var _ComponentLoader = class _ComponentLoader {
    * is a configuration error, not something to chase.
    */
   async instantiateFactory(component, route2, routePath, scope, depth = 0) {
-    const build = () => scope ? runWithOwnerScope2(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 ? runWithOwnerScope2(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;
@@ -8711,7 +9158,7 @@ var _SibuRouter = class _SibuRouter {
     return this.loadedPromise;
   }
   createInitialRoute() {
-    return {
+    const route2 = {
       path: "/",
       params: {},
       query: {},
@@ -8720,6 +9167,8 @@ var _SibuRouter = class _SibuRouter {
       meta: {},
       matched: []
     };
+    bootstrapRoutes.add(route2);
+    return route2;
   }
   handleLocationChange(skipHistory = true, initialResolution = false) {
     const path2 = this.getCurrentPath();
@@ -8760,8 +9209,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 current2 = untracked2(() => this.currentRouteGetter());
+    if (!bootstrapRoutes.delete(current2)) return;
+    const waiting = bootstrapWaiters.get(current2);
+    bootstrapWaiters.delete(current2);
+    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);
@@ -9015,6 +9487,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}`);
@@ -9263,6 +9742,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;
@@ -9289,6 +9783,112 @@ var RouteScope = class {
     queueMicrotask(() => this.set(null));
   }
 };
+var NOOP3 = () => {
+};
+var bootstrapRoutes = /* @__PURE__ */ new WeakSet();
+var bootstrapWaiters = /* @__PURE__ */ new WeakMap();
+function settleEmpty(route2, loaded, current2) {
+  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 (current2()) loaded.done();
+  });
+}
+var cancellations = /* @__PURE__ */ new WeakSet();
+function pauseGate(frozen) {
+  let closed = false;
+  const pending2 = /* @__PURE__ */ new Set();
+  return {
+    held: () => closed || frozen(),
+    until: () => {
+      if (closed) return Promise.resolve(false);
+      return new Promise((resolve) => {
+        const settle = (active) => {
+          pending2.delete(cancel);
+          resolve(active && !closed);
+        };
+        const drop = frozen.wait(
+          () => settle(true),
+          () => settle(false)
+        );
+        const cancel = () => {
+          drop();
+          settle(false);
+        };
+        pending2.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 [...pending2]) cancel();
+    },
+    run: frozen.run,
+    frozen,
+    closed: () => closed,
+    onClose: (fn) => {
+      pending2.add(fn);
+      return () => {
+        pending2.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 slot4 = { cancel: NOOP3 };
+    const untrack = gate.onClose(() => slot4.cancel());
+    const settle = (fn) => () => {
+      untrack();
+      try {
+        fn();
+        resolve();
+      } catch (error) {
+        reject(error);
+      }
+    };
+    commitWhenActive(slot4, {
+      held,
+      node: c.node,
+      owned: () => !gate.closed() && c.owned(),
+      teardown: c.teardown,
+      insert: settle(c.insert),
+      discard: settle(c.discard)
+    });
+  });
+}
 function activeRouteScope() {
   const scope = getOwnerScope2();
   return scope instanceof RouteScope ? scope : null;
@@ -9302,14 +9902,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, current2 = null) {
   const scope = new RouteScope(route2);
   scope.adopt = adopt;
-  const node = await router2.instantiateComponent(plan, routeDef, routePath, scope);
+  scope.gate = gate;
+  scope.current = current2;
+  const owner = gate ? gate.run(() => structuralBinding2(NOOP3)) : structuralBinding2(NOOP3);
+  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) {
@@ -9408,6 +10021,8 @@ function instanceKey(owner, records, route2) {
 function Route() {
   const anchor = document.createComment("route-outlet");
   const adoptScope = captureScope();
+  const frozen = captureFrozen2();
+  const gate = pauseGate(frozen);
   let currentNode = null;
   let loadingNode = null;
   let errorNode = null;
@@ -9415,6 +10030,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();
@@ -9459,24 +10075,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 title2 = document.createElement("h3");
     title2.textContent = "Route Error";
     title2.className = "route-error-title";
@@ -9495,10 +10141,10 @@ function Route() {
     };
     retryButton.addEventListener("click", onRetryClick);
     registerDisposer(retryButton, () => retryButton.removeEventListener("click", onRetryClick));
-    errorNode.appendChild(title2);
-    errorNode.appendChild(message);
-    errorNode.appendChild(retryButton);
-    anchor.parentNode.insertBefore(errorNode, anchor.nextSibling);
+    errorNode2.appendChild(title2);
+    errorNode2.appendChild(message);
+    errorNode2.appendChild(retryButton);
+    return errorNode2;
   };
   const update = async () => {
     routerRevision();
@@ -9511,12 +10157,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) {
@@ -9535,6 +10183,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;
@@ -9545,28 +10194,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;
@@ -9578,16 +10256,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;
@@ -9597,11 +10279,16 @@ function Route() {
     routeInitialized = true;
   };
   const attachWait = attachRetry(anchor, onAttached);
-  const routeTeardown = track2(wrappedUpdate);
+  const routeTeardown = reactiveBinding2(wrappedUpdate, anchor);
   if (!routeInitialized) {
     queueMicrotask(
       bindOwnerScope2(() => {
-        if (!routeInitialized && anchor.parentNode) wrappedUpdate();
+        whenActive(
+          gate,
+          bindOwnerScope2(() => {
+            if (!routeInitialized && anchor.parentNode) wrappedUpdate();
+          })
+        );
       })
     );
   }
@@ -9609,6 +10296,8 @@ function Route() {
     if (routeTorn) return;
     routeTorn = true;
     navSeq++;
+    gate.close();
+    loaded.cancel();
     routeTeardown();
     attachWait.cancel();
     unshownFailure = null;
@@ -9616,6 +10305,7 @@ function Route() {
     currentTopRoute = null;
     currentKey = null;
   };
+  registerNodesRange(anchor, () => [currentNode, loadingNode, errorNode]);
   registerDisposer(anchor, routeCleanup);
   routeCleanups.push(routeCleanup);
   return anchor;
@@ -9623,17 +10313,44 @@ function Route() {
 function KeepAliveRoute(options) {
   if (!_routerRef.current) throw new Error("Router not initialized. Call createRouter() first.");
   const anchor = document.createComment("keep-alive-route");
-  const cache = /* @__PURE__ */ new Map();
+  const cache2 = /* @__PURE__ */ new Map();
   const lruOrder = [];
+  const frozen = captureFrozen2();
+  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: holdSubtree2(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;
@@ -9641,7 +10358,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;
@@ -9652,11 +10372,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) {
@@ -9665,87 +10389,148 @@ function KeepAliveRoute(options) {
     }
     let node = null;
     let fromCache = false;
-    if (shouldCache && cache.has(cacheKey)) {
-      node = cache.get(cacheKey);
+    if (shouldCache && cache2.has(cacheKey)) {
+      node = cache2.get(cacheKey);
       fromCache = true;
     } 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) {
+        cache2.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 (cache2.get(cacheKey) === node) {
+            cache2.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);
+        const evictNode = cache2.get(evictKey);
+        cache2.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 = track2(wrappedUpdate);
+  const attachWait = attachRetry(anchor, () => whenActive(gate, update));
+  const kaTeardown = reactiveBinding2(wrappedUpdate, anchor);
   if (!initialized) {
     queueMicrotask(
       bindOwnerScope2(() => {
-        if (!initialized && anchor.parentNode) wrappedUpdate();
+        whenActive(
+          gate,
+          bindOwnerScope2(() => {
+            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);
+    for (const node of cache2.values()) {
+      disposeCached(node);
       if (node.parentNode) node.parentNode.removeChild(node);
     }
-    cache.clear();
+    cache2.clear();
+    suspended.clear();
     lruOrder.length = 0;
     if (currentNode?.parentNode) currentNode.parentNode.removeChild(currentNode);
     if (currentNode && !currentCached) disposeOwned(currentNode);
@@ -9753,6 +10538,7 @@ function KeepAliveRoute(options) {
     currentKey = "";
     currentCached = false;
   };
+  registerNodesRange(anchor, () => [currentNode]);
   registerDisposer(anchor, kaCleanup);
   routeCleanups.push(kaCleanup);
   return anchor;
@@ -9828,6 +10614,15 @@ function Suspense(props) {
   const anchor = document.createComment("suspense-boundary");
   let currentNode = null;
   let fallbackNode = null;
+  const frozen = captureFrozen2();
+  let contentOwner = structuralBinding2(NOOP3);
+  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;
@@ -9842,21 +10637,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(() => structuralBinding2(NOOP3));
+        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;
@@ -9867,7 +10677,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") {
@@ -9876,35 +10688,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: NOOP3 };
+  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();
   });
-  queueMicrotask(bindOwnerScope2(render));
+  const renderInScope = bindOwnerScope2(() => {
+    if (!tornDown) render();
+  });
+  queueMicrotask(
+    bindOwnerScope2(() => {
+      dropWait = frozen.wait(renderInScope, NOOP3);
+    })
+  );
   return anchor;
 }
 var LAZY_MARKER = /* @__PURE__ */ Symbol.for("sibujs:lazy");
@@ -9966,11 +10827,14 @@ function __removeRouterPagehideHandler() {
 function Outlet() {
   const anchor = document.createComment("route-outlet-nested");
   const adoptScope = captureScope();
+  const frozen = captureFrozen2();
+  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);
@@ -9996,21 +10860,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;
@@ -10021,31 +10889,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 = track2(update);
+  const attachWait = attachRetry(anchor, () => whenActive(gate, update));
+  const outletTeardown = reactiveBinding2(() => {
+    void update();
+  }, anchor);
   if (!anchor.parentNode) {
     queueMicrotask(
       bindOwnerScope2(() => {
-        if (anchor.parentNode) update();
+        whenActive(
+          gate,
+          bindOwnerScope2(() => {
+            if (anchor.parentNode) update();
+          })
+        );
       })
     );
   }
@@ -10053,6 +10954,8 @@ function Outlet() {
     if (outletTorn) return;
     outletTorn = true;
     navSeq++;
+    gate.close();
+    loaded.cancel();
     outletTeardown();
     attachWait.cancel();
     if (currentNode) {
@@ -10063,6 +10966,7 @@ function Outlet() {
     currentChild = null;
     currentKey = null;
   };
+  registerNodesRange(anchor, () => [currentNode]);
   registerDisposer(anchor, outletCleanup);
   routeCleanups.push(outletCleanup);
   return anchor;
@@ -10325,7 +11229,7 @@ function renderRouteToString(url, routes, _options) {
   };
 }
 function renderRouteToDocument(url, routes, options) {
-  const { html: html2, state: state3 } = renderRouteToString(url, routes, options);
+  const { html: html2, state: state5 } = renderRouteToString(url, routes, options);
   const opts = options || {};
   const metaTags = (opts.meta || []).map((attrs) => serializeHeadEntry("meta", attrs)).filter(Boolean).join("\n    ");
   const linkTags = (opts.links || []).map((attrs) => serializeHeadEntry("link", attrs)).filter(Boolean).join("\n    ");
@@ -10334,7 +11238,7 @@ function renderRouteToDocument(url, routes, options) {
     if (!safe) return "";
     return `<script src="${escapeAttrLocal(safe)}"></script>`;
   }).filter(Boolean).join("\n    ");
-  const stateScript = serializeRouteState(state3, opts.nonce);
+  const stateScript = serializeRouteState(state5, opts.nonce);
   return `<!DOCTYPE html>
 <html>
   <head>
@@ -10352,8 +11256,8 @@ function renderRouteToDocument(url, routes, options) {
   </body>
 </html>`;
 }
-function serializeRouteState(state3, nonce) {
-  const json = escapeScriptJson(JSON.stringify(state3));
+function serializeRouteState(state5, nonce) {
+  const json = escapeScriptJson(JSON.stringify(state5));
   const nonceAttr = nonce ? ` nonce="${escapeAttrLocal(nonce)}"` : "";
   return `<script${nonceAttr}>window.${SSR_ROUTE_STATE_KEY}=${json}</script>`;
 }
@@ -10436,24 +11340,24 @@ function assertCacheSize(name, value) {
     throw new RangeError(`[Startup] ${name} must be a non-negative integer, got ${value}`);
   }
 }
-function makeRoomFor(cache, key, maxSize, isValid) {
+function makeRoomFor(cache2, key, maxSize, isValid) {
   if (maxSize === 0) return false;
-  if (cache.has(key)) return true;
-  if (cache.size < maxSize) return true;
-  for (const [k, entry] of cache) {
-    if (!isValid(entry)) cache.delete(k);
+  if (cache2.has(key)) return true;
+  if (cache2.size < maxSize) return true;
+  for (const [k, entry] of cache2) {
+    if (!isValid(entry)) cache2.delete(k);
   }
-  while (cache.size >= maxSize) {
+  while (cache2.size >= maxSize) {
     let oldestKey = null;
     let oldestTime = Infinity;
-    for (const [k, entry] of cache) {
+    for (const [k, entry] of cache2) {
       if (entry.timestamp < oldestTime) {
         oldestTime = entry.timestamp;
         oldestKey = k;
       }
     }
     if (oldestKey === null) break;
-    cache.delete(oldestKey);
+    cache2.delete(oldestKey);
   }
   return true;
 }
@@ -10461,57 +11365,57 @@ function prerenderRoutes(routes, options) {
   const maxCacheSize = options?.maxCacheSize ?? 50;
   const cacheTTL = options?.cacheTTL ?? 0;
   assertCacheSize("maxCacheSize", maxCacheSize);
-  const cache = /* @__PURE__ */ new Map();
+  const cache2 = /* @__PURE__ */ new Map();
   function isValid(entry) {
     if (cacheTTL === 0) return true;
     return Date.now() - entry.timestamp < cacheTTL;
   }
   for (const route2 of routes) {
-    if (!makeRoomFor(cache, route2.path, maxCacheSize, isValid)) break;
+    if (!makeRoomFor(cache2, route2.path, maxCacheSize, isValid)) break;
     const html2 = renderToString(route2.component());
-    cache.set(route2.path, { html: html2, timestamp: Date.now() });
+    cache2.set(route2.path, { html: html2, timestamp: Date.now() });
   }
   return {
     /** Get cached HTML for a route, or undefined if not cached or expired */
     get(path2) {
-      const entry = cache.get(path2);
+      const entry = cache2.get(path2);
       if (!entry) return void 0;
       if (!isValid(entry)) {
-        cache.delete(path2);
+        cache2.delete(path2);
         return void 0;
       }
       return entry.html;
     },
     /** Check if a route has been prerendered and is still valid */
     has(path2) {
-      const entry = cache.get(path2);
+      const entry = cache2.get(path2);
       if (!entry) return false;
       if (!isValid(entry)) {
-        cache.delete(path2);
+        cache2.delete(path2);
         return false;
       }
       return true;
     },
     /** Invalidate a cached route */
     invalidate(path2) {
-      cache.delete(path2);
+      cache2.delete(path2);
     },
     /** Clear all cached routes */
     clear() {
-      cache.clear();
+      cache2.clear();
     },
     /** Get cache statistics */
     stats() {
       if (cacheTTL > 0) {
-        for (const [key, entry] of cache) {
+        for (const [key, entry] of cache2) {
           if (!isValid(entry)) {
-            cache.delete(key);
+            cache2.delete(key);
           }
         }
       }
       return {
-        size: cache.size,
-        routes: Array.from(cache.keys())
+        size: cache2.size,
+        routes: Array.from(cache2.keys())
       };
     }
   };
@@ -10520,7 +11424,7 @@ function createSSRCache(config) {
   const maxSize = config?.maxSize ?? 100;
   const defaultTTL = config?.defaultTTL ?? 6e4;
   assertCacheSize("maxSize", maxSize);
-  const cache = /* @__PURE__ */ new Map();
+  const cache2 = /* @__PURE__ */ new Map();
   let hits = 0;
   let misses = 0;
   function isValid(entry) {
@@ -10530,13 +11434,13 @@ function createSSRCache(config) {
   return {
     /** Get cached HTML for a key, or undefined if not cached or expired */
     get(key) {
-      const entry = cache.get(key);
+      const entry = cache2.get(key);
       if (!entry) {
         misses++;
         return void 0;
       }
       if (!isValid(entry)) {
-        cache.delete(key);
+        cache2.delete(key);
         misses++;
         return void 0;
       }
@@ -10545,8 +11449,8 @@ function createSSRCache(config) {
     },
     /** Cache an HTML string with an optional TTL override */
     set(key, html2, ttl) {
-      if (!makeRoomFor(cache, key, maxSize, isValid)) return;
-      cache.set(key, {
+      if (!makeRoomFor(cache2, key, maxSize, isValid)) return;
+      cache2.set(key, {
         html: html2,
         timestamp: Date.now(),
         ttl: ttl ?? defaultTTL
@@ -10554,27 +11458,27 @@ function createSSRCache(config) {
     },
     /** Check if a key exists in the cache and is still valid */
     has(key) {
-      const entry = cache.get(key);
+      const entry = cache2.get(key);
       if (!entry) return false;
       if (!isValid(entry)) {
-        cache.delete(key);
+        cache2.delete(key);
         return false;
       }
       return true;
     },
     /** Invalidate a cached entry */
     invalidate(key) {
-      cache.delete(key);
+      cache2.delete(key);
     },
     /** Clear all cached entries and reset statistics */
     clear() {
-      cache.clear();
+      cache2.clear();
       hits = 0;
       misses = 0;
     },
     /** Get cache statistics including hit/miss counts */
     stats() {
-      return { size: cache.size, hits, misses };
+      return { size: cache2.size, hits, misses };
     }
   };
 }
@@ -10653,7 +11557,7 @@ function createBootSequence() {
 
 // src/plugins/versioning.ts
 init_globalSingleton();
-var VERSION = true ? "4.14.1" : "dev";
+var VERSION = true ? "4.15.0" : "dev";
 var NUM = "(?:0|[1-9]\\d*)";
 var PRE_ID = `(?:${NUM}|\\d*[a-zA-Z-][0-9a-zA-Z-]*)`;
 var BUILD_ID = "[0-9a-zA-Z-]+";
@@ -10838,9 +11742,9 @@ function createMigrationRunner(config) {
       return serialize(async () => {
         const applied = [];
         const errors = [];
-        let pending;
+        let pending2;
         try {
-          pending = getPending();
+          pending2 = getPending();
         } catch (e) {
           errors.push({
             version: getAppliedVersion() ?? "",
@@ -10848,7 +11752,7 @@ function createMigrationRunner(config) {
           });
           return { applied, errors };
         }
-        for (const migration of pending) {
+        for (const migration of pending2) {
           try {
             await migration.up();
           } catch (e) {