@tanstack/react-router 1.131.5 → 1.132.0-alpha.0

package/dist/llms/rules/api.js

@@ -808,6 +808,7 @@ interface RouteMatch {
   paramsError: unknown
   searchError: unknown
   updatedAt: number
+  loadPromise?: Promise<void>
   loaderData?: Route['loaderData']
   context: Route['allContext']
   search: Route['fullSearchSchema']

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/react-router",
-  "version": "1.131.5",
+  "version": "1.132.0-alpha.0",
   "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",
@@ -79,8 +79,8 @@
     "isbot": "^5.1.22",
     "tiny-invariant": "^1.3.3",
     "tiny-warning": "^1.0.3",
-    "@tanstack/history": "1.131.2",
-    "@tanstack/router-core": "1.131.5"
+    "@tanstack/history": "1.132.0-alpha.0",
+    "@tanstack/router-core": "1.132.0-alpha.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",

package/src/Match.tsx

@@ -6,6 +6,7 @@ import {
   getLocationChangeInfo,
   isNotFound,
   isRedirect,
+  pick,
   rootRouteId,
 } from '@tanstack/router-core'
 import { CatchBoundary, ErrorComponent } from './CatchBoundary'
@@ -36,11 +37,7 @@ export const Match = React.memo(function MatchImpl({
         match,
         `Could not find match for matchId "${matchId}". Please file an issue!`,
       )
-      return {
-        routeId: match.routeId,
-        ssr: match.ssr,
-        _displayPending: match._displayPending,
-      }
+      return pick(match, ['routeId', 'ssr', '_displayPending'])
     },
     structuralSharing: true as any,
   })
@@ -189,7 +186,8 @@ export const MatchInner = React.memo(function MatchInnerImpl({
 
   const { match, key, routeId } = useRouterState({
     select: (s) => {
-      const match = s.matches.find((d) => d.id === matchId)!
+      const matchIndex = s.matches.findIndex((d) => d.id === matchId)
+      const match = s.matches[matchIndex]!
       const routeId = match.routeId as string
 
       const remountFn =
@@ -206,13 +204,13 @@ export const MatchInner = React.memo(function MatchInnerImpl({
       return {
         key,
         routeId,
-        match: {
-          id: match.id,
-          status: match.status,
-          error: match.error,
-          _forcePending: match._forcePending,
-          _displayPending: match._displayPending,
-        },
+        match: pick(match, [
+          'id',
+          'status',
+          'error',
+          '_forcePending',
+          '_displayPending',
+        ]),
       }
     },
     structuralSharing: true as any,
@@ -229,11 +227,11 @@ export const MatchInner = React.memo(function MatchInnerImpl({
   }, [key, route.options.component, router.options.defaultComponent])
 
   if (match._displayPending) {
-    throw router.getMatch(match.id)?._nonReactive.displayPendingPromise
+    throw router.getMatch(match.id)?.displayPendingPromise
   }
 
   if (match._forcePending) {
-    throw router.getMatch(match.id)?._nonReactive.minPendingPromise
+    throw router.getMatch(match.id)?.minPendingPromise
   }
 
   // see also hydrate() in packages/router-core/src/ssr/ssr-client.ts
@@ -241,26 +239,31 @@ export const MatchInner = React.memo(function MatchInnerImpl({
     // We're pending, and if we have a minPendingMs, we need to wait for it
     const pendingMinMs =
       route.options.pendingMinMs ?? router.options.defaultPendingMinMs
-    if (pendingMinMs) {
-      const routerMatch = router.getMatch(match.id)
-      if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {
-        // Create a promise that will resolve after the minPendingMs
-        if (!router.isServer) {
-          const minPendingPromise = createControlledPromise<void>()
-
-          Promise.resolve().then(() => {
-            routerMatch._nonReactive.minPendingPromise = minPendingPromise
-          })
 
-          setTimeout(() => {
-            minPendingPromise.resolve()
-            // We've handled the minPendingPromise, so we can delete it
-            routerMatch._nonReactive.minPendingPromise = undefined
-          }, pendingMinMs)
-        }
+    if (pendingMinMs && !router.getMatch(match.id)?.minPendingPromise) {
+      // Create a promise that will resolve after the minPendingMs
+      if (!router.isServer) {
+        const minPendingPromise = createControlledPromise<void>()
+
+        Promise.resolve().then(() => {
+          router.updateMatch(match.id, (prev) => ({
+            ...prev,
+            minPendingPromise,
+          }))
+        })
+
+        setTimeout(() => {
+          minPendingPromise.resolve()
+
+          // We've handled the minPendingPromise, so we can delete it
+          router.updateMatch(match.id, (prev) => ({
+            ...prev,
+            minPendingPromise: undefined,
+          }))
+        }, pendingMinMs)
       }
     }
-    throw router.getMatch(match.id)?._nonReactive.loadPromise
+    throw router.getMatch(match.id)?.loadPromise
   }
 
   if (match.status === 'notFound') {
@@ -277,7 +280,7 @@ export const MatchInner = React.memo(function MatchInnerImpl({
     //   false,
     //   'Tried to render a redirected route match! This is a weird circumstance, please file an issue!',
     // )
-    throw router.getMatch(match.id)?._nonReactive.loadPromise
+    throw router.getMatch(match.id)?.loadPromise
   }
 
   if (match.status === 'error') {

package/src/index.tsx

@@ -1,6 +1,3 @@
-export { default as invariant } from 'tiny-invariant'
-export { default as warning } from 'tiny-warning'
-
 export {
   defer,
   TSR_DEFERRED_PROMISE,
@@ -24,14 +21,12 @@ export {
   defaultStringifySearch,
   parseSearchWith,
   stringifySearchWith,
-  escapeJSON, // SSR
   pick,
   functionalUpdate,
   replaceEqualDeep,
   isPlainObject,
   isPlainArray,
   deepEqual,
-  shallow,
   createControlledPromise,
   retainSearchParams,
   stripSearchParams,

package/src/useBlocker.tsx

@@ -176,7 +176,7 @@ export function useBlocker(
       function getLocation(
         location: HistoryLocation,
       ): AnyShouldBlockFnLocation {
-        const parsedLocation = router.parseLocation(location)
+        const parsedLocation = router.parseLocation(undefined, location)
         const matchedRoutes = router.getMatchedRoutes(
           parsedLocation.pathname,
           undefined,