@octanejs/tanstack-router 0.1.51 → 0.1.53

package/README.md

@@ -62,6 +62,15 @@ tree renders **pull-based**: `RouterProvider` renders the first match, and each
 component's `<Outlet/>` looks up the next match via `matchContext` — so navigation
 re-renders only the matches that changed.
 
+## Same-route search navigation
+
+Same-route search navigations now render store updates urgently. If the route
+component suspends on the new search input, its pending fallback can replace the
+current content; the previous automatic same-route hold no longer applies. To
+retain stale content while the new data loads, use `useDeferredValue` from `octane`
+on the search input (for example, `page`) and render the suspending content from
+that deferred value. The router location still advances when navigation commits.
+
 ## Scope
 
 Included: `createRouter`, `createRootRoute`, `createRoute`, `RouterProvider`,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octanejs/tanstack-router",
-  "version": "0.1.51",
+  "version": "0.1.53",
   "license": "MIT",
   "type": "module",
   "engines": {
@@ -62,12 +62,12 @@
   },
   "devDependencies": {
     "@tanstack/react-router": "1.170.18",
-    "@tsrx/react": "^0.2.63",
+    "@tsrx/react": "^0.2.67",
     "esbuild": "^0.28.1",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "vitest": "^4.1.10",
-    "octane": "0.2.0"
+    "octane": "0.2.4"
   },
   "scripts": {
     "test": "vitest run"

package/src/router.ts

@@ -23,27 +23,11 @@ import type {
 
 const isServerEnv = typeof document === 'undefined';
 
-// Every reactive router commit funnels through the store factory's `batch`:
-// `beforeLoad` (location + pending matches), the resolved `onReady` commit
-// (active matches + search), `setMatches`/`setPending`/`setCached`, and
-// `invalidate`. Wrap it in octane's `startTransition` so the resulting
-// `__store`/per-match notifications schedule TRANSITION-priority renders.
-//
-// Why this is needed: router-core already wraps navigation in
-// `router.startTransition` (Transitioner.tsrx), but the RESOLVED commit is run
-// inside `startViewTransition(fn)`, and a real browser defers `fn` to a later
-// task. By then octane's transition window (TRANSITION_DEPTH / the async
-// `startTransition` window) has closed, so the commit would schedule an URGENT
-// re-render. For a same-route `?page` change that urgent re-render lands on a
-// suspending descendant (the route component reading `useSearch`), and an urgent
-// suspend does NOT hold — the route's pending fallback flashes. Re-asserting the
-// transition AT COMMIT TIME makes that re-render ride the concurrent-navigation
-// transition, so octane keeps the current page on screen until the new one is
-// ready (matching cross-route navigation). `startTransition` is re-entrant, so
-// nesting (router-core's own startTransition → this batch) is a no-op extra
-// level; non-navigation router commits ride a transition too, which is harmless
-// (router stores are only ever mutated by router internals, never by urgent user
-// state). SSR uses the non-reactive factory below and is unaffected.
+// Batch router mutations atomically, including resolved commits delivered by a
+// later View Transition callback. The transition scope preserves navigation
+// bookkeeping; useSyncExternalStore notifications still render urgently. Routes
+// that keep stale content while new data loads should defer their render input
+// with useDeferredValue. Server snapshots use the non-reactive factory below.
 const octaneStoreFactory = (opts: { isServer?: boolean }) => {
 	if (opts?.isServer ?? isServerEnv) {
 		return {

package/src/useStore.ts

@@ -45,21 +45,35 @@ export function useStore(...args: any[]): any {
 		subSlot(slot, 'us:cb'),
 	);
 
-	// Memoize selector output: same store input → same output; structurally-equal
-	// output keeps its previous reference (so useSyncExternalStore doesn't loop).
-	const cache = useRef<{ in: unknown; out: unknown } | null>(null, subSlot(slot, 'us:cache'));
-	const getSnapshot = (): unknown => {
+	// A cached snapshot belongs to its atom, selector, and comparator as well as
+	// its input. Route parameters captured by a new selector must be re-evaluated
+	// even when the atom has already published the current match-id list.
+	// Structurally-equal output keeps its previous reference so
+	// useSyncExternalStore does not loop on allocating selectors.
+	const cache = useRef<{
+		atom: Atom<unknown>;
+		in: unknown;
+		selector: typeof selector;
+		compare: typeof compare;
+		out: unknown;
+	} | null>(null, subSlot(slot, 'us:cache'));
+	function getSnapshot(): unknown {
 		const input = atom.get();
 		const prev = cache.current;
-		if (prev && Object.is(prev.in, input)) return prev.out;
-		const next = selector(input);
-		if (prev && compare(prev.out, next)) {
-			cache.current = { in: input, out: prev.out };
+		if (
+			prev &&
+			prev.atom === atom &&
+			prev.selector === selector &&
+			prev.compare === compare &&
+			Object.is(prev.in, input)
+		) {
 			return prev.out;
 		}
-		cache.current = { in: input, out: next };
-		return next;
-	};
+		const next = selector(input);
+		const out = prev && compare(prev.out, next) ? prev.out : next;
+		cache.current = { atom, in: input, selector, compare, out };
+		return out;
+	}
 
 	return useSyncExternalStore(subscribe, getSnapshot, getSnapshot, subSlot(slot, 'us:uses'));
 }