@tanstack/react-router 0.0.1-beta.269 → 0.0.1-beta.270

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tanstack/react-router",
   "author": "Tanner Linsley",
-  "version": "0.0.1-beta.269",
+  "version": "0.0.1-beta.270",
   "license": "MIT",
   "repository": "tanstack/router",
   "homepage": "https://tanstack.com/router",
@@ -44,7 +44,7 @@
     "@tanstack/store": "^0.1.3",
     "tiny-invariant": "^1.3.1",
     "tiny-warning": "^1.0.3",
-    "@tanstack/history": "0.0.1-beta.269"
+    "@tanstack/history": "0.0.1-beta.270"
   },
   "scripts": {
     "build": "rollup --config rollup.config.js"

package/src/Matches.tsx

@@ -29,14 +29,12 @@ export interface RouteMatch<
   status: 'pending' | 'success' | 'error'
   isFetching: boolean
   showPending: boolean
-  invalid: boolean
   error: unknown
   paramsError: unknown
   searchError: unknown
   updatedAt: number
   loadPromise?: Promise<void>
   loaderData?: RouteById<TRouteTree, TRouteId>['types']['loaderData']
-  __resolveLoadPromise?: () => void
   routeContext: RouteById<TRouteTree, TRouteId>['types']['routeContext']
   context: RouteById<TRouteTree, TRouteId>['types']['allContext']
   search: FullSearchSchema<TRouteTree> &
@@ -56,26 +54,12 @@ export function Matches() {
       return getRenderedMatches(s)[0]?.id
     },
   })
-  const route = router.routesById[rootRouteId]!
-
-  const errorComponent = React.useCallback(
-    (props: any) => {
-      return React.createElement(ErrorComponent, {
-        ...props,
-        useMatch: route.useMatch,
-        useRouteContext: route.useRouteContext,
-        useSearch: route.useSearch,
-        useParams: route.useParams,
-      })
-    },
-    [route],
-  )
 
   return (
     <matchContext.Provider value={matchId}>
       <CatchBoundary
         getResetKey={() => router.state.resolvedLocation.state?.key}
-        errorComponent={errorComponent}
+        errorComponent={ErrorComponent}
         onCatch={() => {
           warning(
             false,
@@ -110,58 +94,41 @@ export function Match({ matchId }: { matchId: string }) {
   const PendingComponent = (route.options.pendingComponent ??
     router.options.defaultPendingComponent) as any
 
-  const pendingElement = PendingComponent
-    ? React.createElement(PendingComponent, {
-        useMatch: route.useMatch,
-        useRouteContext: route.useRouteContext,
-        useSearch: route.useSearch,
-        useParams: route.useParams,
-      })
-    : undefined
-
   const routeErrorComponent =
     route.options.errorComponent ??
     router.options.defaultErrorComponent ??
     ErrorComponent
 
   const ResolvedSuspenseBoundary =
-    route.options.wrapInSuspense ?? pendingElement
+    route.options.wrapInSuspense ??
+    PendingComponent ??
+    route.options.component?.preload ??
+    route.options.pendingComponent?.preload ??
+    (route.options.errorComponent as any)?.preload
       ? React.Suspense
       : SafeFragment
 
-  const errorComponent = routeErrorComponent
-    ? React.useCallback(
-        (props: any) => {
-          return React.createElement(routeErrorComponent, {
-            ...props,
-            useMatch: route.useMatch,
-            useRouteContext: route.useRouteContext,
-            useSearch: route.useSearch,
-            useParams: route.useParams,
-          })
-        },
-        [route],
-      )
-    : undefined
-
-  const ResolvedCatchBoundary = errorComponent ? CatchBoundary : SafeFragment
+  const ResolvedCatchBoundary = routeErrorComponent
+    ? CatchBoundary
+    : SafeFragment
 
   return (
     <matchContext.Provider value={matchId}>
-      <ResolvedSuspenseBoundary fallback={pendingElement}>
+      <ResolvedSuspenseBoundary fallback={PendingComponent}>
         <ResolvedCatchBoundary
           getResetKey={() => router.state.resolvedLocation.state?.key}
-          errorComponent={errorComponent}
+          errorComponent={routeErrorComponent}
           onCatch={() => {
             warning(false, `Error in route match: ${matchId}`)
           }}
         >
-          <MatchInner matchId={matchId!} pendingElement={pendingElement} />
+          <MatchInner matchId={matchId!} pendingElement={PendingComponent} />
         </ResolvedCatchBoundary>
       </ResolvedSuspenseBoundary>
     </matchContext.Provider>
   )
 }
+
 function MatchInner({
   matchId,
   pendingElement,
@@ -199,16 +166,10 @@ function MatchInner({
   }
 
   if (match.status === 'success') {
-    let comp = route.options.component ?? router.options.defaultComponent
-
-    if (comp) {
-      return React.createElement(comp, {
-        useMatch: route.useMatch,
-        useRouteContext: route.useRouteContext as any,
-        useSearch: route.useSearch,
-        useParams: route.useParams as any,
-        useLoaderData: route.useLoaderData,
-      })
+    let Comp = route.options.component ?? router.options.defaultComponent
+
+    if (Comp) {
+      return <Comp />
     }
 
     return <Outlet />
@@ -245,7 +206,7 @@ export interface MatchRouteOptions {
   fuzzy?: boolean
 }
 
-export type MakeUseMatchRouteOptions<
+export type UseMatchRouteOptions<
   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
   TFrom extends RoutePaths<TRouteTree> = '/',
   TTo extends string = '',
@@ -266,13 +227,7 @@ export function useMatchRoute<
       TMaskTo extends string = '',
       TResolved extends string = ResolveRelativePath<TFrom, NoInfer<TTo>>,
     >(
-      opts: MakeUseMatchRouteOptions<
-        TRouteTree,
-        TFrom,
-        TTo,
-        TMaskFrom,
-        TMaskTo
-      >,
+      opts: UseMatchRouteOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>,
     ): false | RouteById<TRouteTree, TResolved>['types']['allParams'] => {
       const { pending, caseSensitive, ...rest } = opts
 
@@ -393,11 +348,21 @@ export function useMatch<
 export function useMatches<T = RouteMatch[]>(opts?: {
   select?: (matches: RouteMatch[]) => T
 }): T {
-  const contextMatchId = React.useContext(matchContext)
-
   return useRouterState({
     select: (state) => {
       let matches = getRenderedMatches(state)
+      return opts?.select ? opts.select(matches) : (matches as T)
+    },
+  })
+}
+
+export function useParentMatches<T = RouteMatch[]>(opts?: {
+  select?: (matches: RouteMatch[]) => T
+}): T {
+  const contextMatchId = React.useContext(matchContext)
+
+  return useMatches({
+    select: (matches) => {
       matches = matches.slice(matches.findIndex((d) => d.id === contextMatchId))
       return opts?.select ? opts.select(matches) : (matches as T)
     },

package/src/fileRoute.ts

@@ -124,12 +124,7 @@ export class FileRoute<
       >,
       'getParentRoute' | 'path' | 'id'
     > &
-      UpdatableRouteOptions<
-        TFullSearchSchema,
-        TAllParams,
-        TContext,
-        TLoaderData
-      >,
+      UpdatableRouteOptions<TFullSearchSchema>,
   ): Route<
     TParentRoute,
     TPath,

package/src/lazyRouteComponent.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { AsyncRouteComponent } from './route'
+import { RouteComponent } from './route'
 
 export function lazyRouteComponent<
   T extends Record<string, any>,
@@ -7,9 +7,7 @@ export function lazyRouteComponent<
 >(
   importer: () => Promise<T>,
   exportName?: TKey,
-): T[TKey] extends (props: infer TProps) => any
-  ? AsyncRouteComponent<TProps>
-  : never {
+): T[TKey] extends (props: any) => any ? RouteComponent : never {
   let loadPromise: Promise<any>
 
   const load = () => {

package/src/link.tsx

@@ -2,7 +2,6 @@ import * as React from 'react'
 import { useMatch } from './Matches'
 import { useRouter, useRouterState } from './RouterProvider'
 import { Trim } from './fileRoute'
-import { LocationState } from './location'
 import { AnyRoute, ReactNode } from './route'
 import {
   AllParams,
@@ -12,7 +11,7 @@ import {
   RoutePaths,
 } from './routeInfo'
 import { RegisteredRouter } from './router'
-import { MakeLinkOptions, MakeLinkPropsOptions } from './useNavigate'
+import { LinkProps, UseLinkPropsOptions } from './useNavigate'
 import {
   Expand,
   NoInfer,
@@ -23,6 +22,7 @@ import {
   deepEqual,
   functionalUpdate,
 } from './utils'
+import { HistoryState } from '@tanstack/history'
 
 export type CleanPath<T extends string> = T extends `${infer L}//${infer R}`
   ? CleanPath<`${CleanPath<L>}/${CleanPath<R>}`>
@@ -156,7 +156,7 @@ export type ToSubOptions<
   // The new has string or a function to update it
   hash?: true | Updater<string>
   // State to pass to the history stack
-  state?: true | NonNullableUpdater<LocationState>
+  state?: true | NonNullableUpdater<HistoryState>
   // The source route path. This is automatically set when using route-level APIs, but for type-safe relative routing on the router itself, this is required
   from?: TFrom
   // // When using relative route paths, this option forces resolution from the current path, instead of the route API's path or `from` path
@@ -348,7 +348,7 @@ export function useLinkProps<
   TMaskFrom extends RoutePaths<TRouteTree> = '/',
   TMaskTo extends string = '',
 >(
-  options: MakeLinkPropsOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>,
+  options: UseLinkPropsOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>,
 ): React.AnchorHTMLAttributes<HTMLAnchorElement> {
   const router = useRouter()
   const matchPathname = useMatch({
@@ -568,7 +568,7 @@ export interface LinkComponent<TProps extends Record<string, any> = {}> {
     TMaskFrom extends RoutePaths<TRouteTree> = '/',
     TMaskTo extends string = '',
   >(
-    props: MakeLinkOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &
+    props: LinkProps<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &
       TProps &
       React.RefAttributes<HTMLAnchorElement>,
   ): ReactNode

package/src/location.ts

@@ -11,5 +11,3 @@ export interface ParsedLocation<TSearchObj extends AnySearchSchema = {}> {
   maskedLocation?: ParsedLocation<TSearchObj>
   unmaskOnReload?: boolean
 }
-
-export interface LocationState {}

package/src/route.ts

@@ -1,4 +1,3 @@
-import { HistoryLocation } from '@tanstack/history'
 import * as React from 'react'
 import invariant from 'tiny-invariant'
 import { useLoaderData, useMatch } from './Matches'
@@ -76,12 +75,7 @@ export type RouteOptions<
   TAllContext,
   TLoaderData
 > &
-  UpdatableRouteOptions<
-    NoInfer<TFullSearchSchema>,
-    NoInfer<TAllParams>,
-    NoInfer<TAllContext>,
-    NoInfer<TLoaderData>
-  >
+  UpdatableRouteOptions<NoInfer<TFullSearchSchema>>
 
 export type ParamsFallback<
   TPath extends string,
@@ -182,9 +176,6 @@ type BeforeLoadFn<
 
 export type UpdatableRouteOptions<
   TFullSearchSchema extends Record<string, any>,
-  TAllParams extends AnyPathParams,
-  TAllContext extends AnyContext,
-  TLoaderData extends any = unknown,
 > = MetaOptions & {
   // test?: (args: TAllContext) => void
   // If true, this route will be matched as case-sensitive
@@ -192,24 +183,9 @@ export type UpdatableRouteOptions<
   // If true, this route will be forcefully wrapped in a suspense boundary
   wrapInSuspense?: boolean
   // The content to be rendered when the route is matched. If no component is provided, defaults to `<Outlet />`
-  component?: RouteComponent<
-    TFullSearchSchema,
-    TAllParams,
-    TAllContext,
-    TLoaderData
-  >
-  // The content to be rendered when the route encounters an error
-  errorComponent?: ErrorRouteComponent<
-    TFullSearchSchema,
-    TAllParams,
-    TAllContext // NOTE: This used to break the universe.... but it seems to work now?
-  > //
-  // If supported by your framework, the content to be rendered as the fallback content until the route is ready to render
-  pendingComponent?: PendingRouteComponent<
-    TFullSearchSchema,
-    TAllParams,
-    TAllContext
-  >
+  component?: RouteComponent
+  errorComponent?: false | null | RouteComponent
+  pendingComponent?: RouteComponent
   pendingMs?: number
   pendingMinMs?: number
   // Filter functions that can manipulate search params *before* they are passed to links and navigate
@@ -222,7 +198,7 @@ export type UpdatableRouteOptions<
   // These functions are called as route matches are loaded, stick around and leave the active
   // matches
   onEnter?: (match: AnyRouteMatch) => void
-  onTransition?: (match: AnyRouteMatch) => void
+  onStay?: (match: AnyRouteMatch) => void
   onLeave?: (match: AnyRouteMatch) => void
 }
 
@@ -337,13 +313,6 @@ export interface AnyRoute
 
 export type MergeFromFromParent<T, U> = IsAny<T, U, T & U>
 
-export type StreamedPromise<T> = {
-  promise: Promise<T>
-  status: 'resolved' | 'pending'
-  data: T
-  resolve: (value: T) => void
-}
-
 export type ResolveAllParams<
   TParentRoute extends AnyRoute,
   TParams extends AnyPathParams,
@@ -623,16 +592,7 @@ export class Route<
     return this as any
   }
 
-  update = (
-    options: UpdatableRouteOptions<
-      TFullSearchSchema,
-      TAllParams,
-      Expand<
-        Assign<IsAny<TParentRoute['types']['allContext'], {}>, TRouteContext>
-      >,
-      TLoaderData
-    >,
-  ) => {
+  update = (options: UpdatableRouteOptions<TFullSearchSchema>) => {
     Object.assign(this.options, options)
     return this
   }
@@ -813,29 +773,6 @@ export function createRouteMask<
   return opts as any
 }
 
-export type RouteProps<
-  TFullSearchSchema extends Record<string, any> = AnySearchSchema,
-  TAllParams extends AnyPathParams = AnyPathParams,
-  TAllContext extends Record<string, any> = AnyContext,
-  TLoaderData extends any = unknown,
-> = {
-  useMatch: <TSelected = TAllContext>(opts?: {
-    select?: (search: TAllContext) => TSelected
-  }) => TSelected
-  useRouteContext: <TSelected = TAllContext>(opts?: {
-    select?: (search: TAllContext) => TSelected
-  }) => TSelected
-  useSearch: <TSelected = TFullSearchSchema>(opts?: {
-    select?: (search: TFullSearchSchema) => TSelected
-  }) => TSelected
-  useParams: <TSelected = TAllParams>(opts?: {
-    select?: (search: TAllParams) => TSelected
-  }) => TSelected
-  useLoaderData: <TSelected = TLoaderData>(opts?: {
-    select?: (search: TLoaderData) => TSelected
-  }) => TSelected
-}
-
 export type ErrorRouteProps<
   TFullSearchSchema extends Record<string, any> = AnySearchSchema,
   TAllParams extends AnyPathParams = AnyPathParams,
@@ -843,74 +780,19 @@ export type ErrorRouteProps<
 > = {
   error: unknown
   info: { componentStack: string }
-} & RouteProps<TFullSearchSchema, TAllParams, TAllContext>
-
-export type PendingRouteProps<
-  TFullSearchSchema extends Record<string, any> = AnySearchSchema,
-  TAllParams extends AnyPathParams = AnyPathParams,
-  TAllContext extends Record<string, any> = AnyContext,
-> = RouteProps<TFullSearchSchema, TAllParams, TAllContext>
+}
 //
 
 export type ReactNode = any
 
-export type SyncRouteComponent<TProps> =
-  | ((props: TProps) => ReactNode)
-  | React.LazyExoticComponent<(props: TProps) => ReactNode>
+export type SyncRouteComponent =
+  | (() => JSX.Element)
+  | React.LazyExoticComponent<() => JSX.Element>
 
-export type AsyncRouteComponent<TProps> = SyncRouteComponent<TProps> & {
+export type RouteComponent = SyncRouteComponent & {
   preload?: () => Promise<void>
 }
 
-export type RouteComponent<
-  TFullSearchSchema extends Record<string, any>,
-  TAllParams extends AnyPathParams,
-  TAllContext extends Record<string, any>,
-  TLoaderData extends any = unknown,
-> = AsyncRouteComponent<
-  RouteProps<TFullSearchSchema, TAllParams, TAllContext, TLoaderData>
->
-
-export type ErrorRouteComponent<
-  TFullSearchSchema extends Record<string, any>,
-  TAllParams extends AnyPathParams,
-  TAllContext extends Record<string, any>,
-> = AsyncRouteComponent<
-  ErrorRouteProps<TFullSearchSchema, TAllParams, TAllContext>
->
-
-export type PendingRouteComponent<
-  TFullSearchSchema extends Record<string, any>,
-  TAllParams extends AnyPathParams,
-  TAllContext extends Record<string, any>,
-> = AsyncRouteComponent<
-  PendingRouteProps<TFullSearchSchema, TAllParams, TAllContext>
->
-
-export type AnyRouteComponent = RouteComponent<any, any, any, any>
-
-export type ComponentPropsFromRoute<TRoute> =
-  TRoute extends (() => infer T extends AnyRoute)
-    ? ComponentPropsFromRoute<T>
-    : TRoute extends Route<
-          infer TParentRoute,
-          infer TPath,
-          infer TFullPath,
-          infer TCustomId,
-          infer TId,
-          infer TSearchSchema,
-          infer TFullSearchSchema,
-          infer TParams,
-          infer TAllParams,
-          infer TRouteContext,
-          infer TAllContext,
-          infer TRouterContext,
-          infer TLoaderData,
-          infer TChildren
-        >
-      ? RouteProps<TFullSearchSchema, TAllParams, TAllContext, TLoaderData>
-      : {}
-
 export class NotFoundRoute<
   TParentRoute extends AnyRootRoute,
   TSearchSchema extends RouteConstraints['TSearchSchema'] = {},

package/src/router.ts

@@ -32,14 +32,9 @@ import {
   pick,
   Timeout,
 } from './utils'
-import {
-  ErrorRouteComponent,
-  PendingRouteComponent,
-  RouteComponent,
-} from './route'
+import { RouteComponent } from './route'
 import { AnyRouteMatch, RouteMatch } from './Matches'
 import { ParsedLocation } from './location'
-import { LocationState } from './location'
 import { SearchSerializer, SearchParser } from './searchParams'
 import {
   BuildLocationFn,
@@ -110,17 +105,9 @@ export interface RouterOptions<
   parseSearch?: SearchParser
   defaultPreload?: false | 'intent'
   defaultPreloadDelay?: number
-  defaultComponent?: RouteComponent<AnySearchSchema, AnyPathParams, AnyContext>
-  defaultErrorComponent?: ErrorRouteComponent<
-    AnySearchSchema,
-    AnyPathParams,
-    AnyContext
-  >
-  defaultPendingComponent?: PendingRouteComponent<
-    AnySearchSchema,
-    AnyPathParams,
-    AnyContext
-  >
+  defaultComponent?: RouteComponent
+  defaultErrorComponent?: RouteComponent
+  defaultPendingComponent?: RouteComponent
   defaultPendingMs?: number
   defaultPendingMinMs?: number
   caseSensitive?: boolean
@@ -153,13 +140,13 @@ export interface BuildNextOptions {
   params?: true | Updater<unknown>
   search?: true | Updater<unknown>
   hash?: true | Updater<string>
-  state?: true | NonNullableUpdater<LocationState>
+  state?: true | NonNullableUpdater<HistoryState>
   mask?: {
     to?: string | number | null
     params?: true | Updater<unknown>
     search?: true | Updater<unknown>
     hash?: true | Updater<string>
-    state?: true | NonNullableUpdater<LocationState>
+    state?: true | NonNullableUpdater<HistoryState>
     unmaskOnReload?: boolean
   }
   from?: string
@@ -171,7 +158,7 @@ export interface DehydratedRouterState {
 
 export type DehydratedRouteMatch = Pick<
   RouteMatch,
-  'fetchedAt' | 'invalid' | 'id' | 'status' | 'updatedAt'
+  'fetchedAt' | 'id' | 'status' | 'updatedAt'
 >
 
 export interface DehydratedRouter {
@@ -663,7 +650,6 @@ export class Router<
             status: hasLoaders ? 'pending' : 'success',
             showPending: false,
             isFetching: false,
-            invalid: false,
             error: undefined,
             paramsError: parseErrors[index],
             loadPromise: Promise.resolve(),
@@ -1115,7 +1101,6 @@ export class Router<
           matches[index] = match = {
             ...match,
             fetchedAt: Date.now(),
-            invalid: false,
             showPending: false,
           }
 
@@ -1385,7 +1370,7 @@ export class Router<
           [
             [exitingMatchIds, 'onLeave'],
             [enteringMatchIds, 'onEnter'],
-            [stayingMatchIds, 'onTransition'],
+            [stayingMatchIds, 'onStay'],
           ] as const
         ).forEach(([matches, hook]) => {
           matches.forEach((match) => {
@@ -1514,14 +1499,7 @@ export class Router<
     return {
       state: {
         dehydratedMatches: this.state.matches.map((d) =>
-          pick(d, [
-            'fetchedAt',
-            'invalid',
-            'id',
-            'status',
-            'updatedAt',
-            'loaderData',
-          ]),
+          pick(d, ['fetchedAt', 'id', 'status', 'updatedAt', 'loaderData']),
         ),
       },
     }

package/src/useNavigate.tsx

@@ -35,19 +35,20 @@ export function useNavigate<
   )
 }
 
-export function typedNavigate<
-  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
-  TDefaultFrom extends RoutePaths<TRouteTree> = '/',
->(navigate: (opts: NavigateOptions<any>) => Promise<void>) {
-  return navigate as <
-    TFrom extends RoutePaths<TRouteTree> = TDefaultFrom,
-    TTo extends string = '',
-    TMaskFrom extends RoutePaths<TRouteTree> = '/',
-    TMaskTo extends string = '',
-  >(
-    opts?: NavigateOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>,
-  ) => Promise<void>
-} //
+// NOTE: I don't know of anyone using this. It's undocumented, so let's wait until someone needs it
+// export function typedNavigate<
+//   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
+//   TDefaultFrom extends RoutePaths<TRouteTree> = '/',
+// >(navigate: (opts: NavigateOptions<any>) => Promise<void>) {
+//   return navigate as <
+//     TFrom extends RoutePaths<TRouteTree> = TDefaultFrom,
+//     TTo extends string = '',
+//     TMaskFrom extends RoutePaths<TRouteTree> = '/',
+//     TMaskTo extends string = '',
+//   >(
+//     opts?: NavigateOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>,
+//   ) => Promise<void>
+// } //
 
 export function Navigate<
   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
@@ -69,22 +70,22 @@ export function Navigate<
   return null
 }
 
-export type MakeLinkPropsOptions<
+export type UseLinkPropsOptions<
   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
   TFrom extends RoutePaths<TRouteTree> = '/',
   TTo extends string = '',
   TMaskFrom extends RoutePaths<TRouteTree> = '/',
   TMaskTo extends string = '',
-> = LinkPropsOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &
+> = ActiveLinkOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &
   React.AnchorHTMLAttributes<HTMLAnchorElement>
 
-export type MakeLinkOptions<
+export type LinkProps<
   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
   TFrom extends RoutePaths<TRouteTree> = '/',
   TTo extends string = '',
   TMaskFrom extends RoutePaths<TRouteTree> = '/',
   TMaskTo extends string = '',
-> = LinkPropsOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &
+> = ActiveLinkOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &
   Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> & {
     // If a function is passed as a child, it will be given the `isActive` boolean to aid in further styling on the element it returns
     children?:
@@ -92,7 +93,7 @@ export type MakeLinkOptions<
       | ((state: { isActive: boolean }) => React.ReactNode)
   }
 
-export type LinkPropsOptions<
+export type ActiveLinkOptions<
   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],
   TFrom extends RoutePaths<TRouteTree> = '/',
   TTo extends string = '',