@tanstack/react-router 1.22.7 → 1.22.9

package/src/link.tsx

@@ -2,7 +2,7 @@ import * as React from 'react'
 import { useMatch } from './Matches'
 import { useRouterState } from './useRouterState'
 import { useRouter } from './useRouter'
-import { deepEqual, functionalUpdate } from './utils'
+import { deepEqual, exactPathTest, functionalUpdate } from './utils'
 import type { HistoryState } from '@tanstack/history'
 import type { Trim } from './fileRoute'
 import type { AnyRoute, RootSearchSchema } from './route'
@@ -435,7 +435,7 @@ export function useLinkProps<
       )
       // Combine the matches based on user router.options
       const pathTest = activeOptions?.exact
-        ? s.location.pathname === next.pathname
+        ? exactPathTest(s.location.pathname, next.pathname)
         : pathIsFuzzyEqual
       const hashTest = activeOptions?.includeHash
         ? s.location.hash === next.hash
@@ -625,7 +625,7 @@ export type LinkProps<
     | ((state: { isActive: boolean }) => React.ReactNode)
 }
 
-type LinkComponent<TComp> = <
+export type LinkComponent<TComp> = <
   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
   TFrom extends RoutePaths<TRouteTree> | string = string,
   TTo extends string = '',
@@ -652,7 +652,7 @@ type LinkComponent<TComp> = <
 ) => React.ReactElement
 
 export function createLink<const TComp>(Comp: TComp): LinkComponent<TComp> {
-  return React.forwardRef(function Link(props, ref) {
+  return React.forwardRef(function CreatedLink(props, ref) {
     return <Link {...(props as any)} _asChild={Comp} ref={ref} />
   }) as any
 }

package/src/router.ts

@@ -139,8 +139,8 @@ export interface RouterOptions<
   hydrate?: (dehydrated: TDehydrated) => void
   routeMasks?: Array<RouteMask<TRouteTree>>
   unmaskOnReload?: boolean
-  Wrap?: (props: { children: any }) => React.ReactNode
-  InnerWrap?: (props: { children: any }) => React.ReactNode
+  Wrap?: (props: { children: any }) => React.JSX.Element
+  InnerWrap?: (props: { children: any }) => React.JSX.Element
   /**
    * @deprecated
    * Use `notFoundComponent` instead.

package/src/utils.ts

@@ -348,3 +348,18 @@ export function escapeJSON(jsonString: string) {
     .replace(/'/g, "\\'") // Escape single quotes
     .replace(/"/g, '\\"') // Escape double quotes
 }
+
+export function removeTrailingSlash(value: string): string {
+  if (value.endsWith('/') && value !== '/') {
+    return value.slice(0, -1)
+  }
+  return value
+}
+
+// intended to only compare path name
+// see the usage in the isActive under useLinkProps
+// /sample/path1 = /sample/path1/
+// /sample/path1/some <> /sample/path1
+export function exactPathTest(pathName1: string, pathName2: string): boolean {
+  return removeTrailingSlash(pathName1) === removeTrailingSlash(pathName2)
+}