@tanstack/react-router 1.64.1 → 1.64.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/react-router",
-  "version": "1.64.1",
+  "version": "1.64.3",
   "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",

package/src/RouterProvider.tsx

@@ -48,6 +48,7 @@ export type BuildLocationFn = <
 >(
   opts: ToOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {
     leaveParams?: boolean
+    _includeValidateSearch?: boolean
   },
 ) => ParsedLocation
 

package/src/link.tsx

@@ -649,32 +649,48 @@ export function useLinkProps<
 
   const isActive = useRouterState({
     select: (s) => {
-      // Compare path/hash for matches
-      const currentPathSplit = removeTrailingSlash(
-        s.location.pathname,
-        router.basepath,
-      ).split('/')
-      const nextPathSplit = removeTrailingSlash(
-        next.pathname,
-        router.basepath,
-      ).split('/')
-      const pathIsFuzzyEqual = nextPathSplit.every(
-        (d, i) => d === currentPathSplit[i],
-      )
-      // Combine the matches based on user router.options
-      const pathTest = activeOptions?.exact
-        ? exactPathTest(s.location.pathname, next.pathname, router.basepath)
-        : pathIsFuzzyEqual
-      const hashTest = activeOptions?.includeHash
-        ? s.location.hash === next.hash
-        : true
-      const searchTest =
-        (activeOptions?.includeSearch ?? true)
-          ? deepEqual(s.location.search, next.search, !activeOptions?.exact)
-          : true
-
-      // The final "active" test
-      return pathTest && hashTest && searchTest
+      if (activeOptions?.exact) {
+        const testExact = exactPathTest(
+          s.location.pathname,
+          next.pathname,
+          router.basepath,
+        )
+        if (!testExact) {
+          return false
+        }
+      } else {
+        const currentPathSplit = removeTrailingSlash(
+          s.location.pathname,
+          router.basepath,
+        ).split('/')
+        const nextPathSplit = removeTrailingSlash(
+          next.pathname,
+          router.basepath,
+        ).split('/')
+
+        const pathIsFuzzyEqual = nextPathSplit.every(
+          (d, i) => d === currentPathSplit[i],
+        )
+        if (!pathIsFuzzyEqual) {
+          return false
+        }
+      }
+
+      if (activeOptions?.includeSearch ?? true) {
+        const searchTest = deepEqual(
+          s.location.search,
+          next.search,
+          !activeOptions?.exact,
+        )
+        if (!searchTest) {
+          return false
+        }
+      }
+
+      if (activeOptions?.includeHash) {
+        return s.location.hash === next.hash
+      }
+      return true
     },
   })
 
@@ -741,8 +757,9 @@ export function useLinkProps<
       })
 
       // All is well? Navigate!
-      router.commitLocation({
-        ...next,
+      // N.B. we don't call `router.commitLocation(next) here because we want to run `validateSearch` before committing
+      router.buildAndCommitLocation({
+        ...options,
         replace,
         resetScroll,
         startTransition,
@@ -975,7 +992,7 @@ export const Link: LinkComponent<'a'> = React.forwardRef<Element, any>(
         : rest.children
 
     if (typeof _asChild === 'undefined') {
-      // the ReturnType of useLinkProps returns the correct type for a <a> element, not a general component that has a delete prop
+      // the ReturnType of useLinkProps returns the correct type for a <a> element, not a general component that has a disabled prop
       // @ts-expect-error
       delete linkProps.disabled
     }

package/src/router.ts

@@ -1460,8 +1460,24 @@ export class Router<
         ? postSearchFilters.reduce((prev, next) => next(prev), destSearch)
         : destSearch
 
-      const search = replaceEqualDeep(fromSearch, postFilteredSearch)
+      let search = postFilteredSearch
 
+      if (opts._includeValidateSearch) {
+        matchedRoutesResult?.matchedRoutes.forEach((route) => {
+          try {
+            if (route.options.validateSearch) {
+              const validator =
+                typeof route.options.validateSearch === 'object'
+                  ? route.options.validateSearch.parse
+                  : route.options.validateSearch
+              search = { ...search, ...validator(search) }
+            }
+          } catch (e) {
+            // ignore errors here because they are already handled in matchRoutes
+          }
+        })
+      }
+      search = replaceEqualDeep(fromSearch, search)
       const searchStr = this.options.stringifySearch(search)
 
       const hash =
@@ -1644,7 +1660,10 @@ export class Router<
       rest.hash = parsed.hash
     }
 
-    const location = this.buildLocation(rest as any)
+    const location = this.buildLocation({
+      ...(rest as any),
+      _includeValidateSearch: true,
+    })
     return this.commitLocation({
       ...location,
       viewTransition,