Skip to content

Commit 6479495

Browse files
birkskyumbirkskyum
authoredMar 18, 2025··
refactor(router-core): move internals of Route to router-core (#3803)
Similar to #3800 , this use base classes to contain shared methods of the solid/react-router Route in the router-core package.
·
v1.114.34v1.114.24
1 parent 3a0c6dd commit 6479495

File tree

4 files changed

+566
-694
lines changed

4 files changed

+566
-694
lines changed
 

‎packages/react-router/src/route.ts

+87-335
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
1-
import invariant from 'tiny-invariant'
21
import {
3-
joinPaths,
2+
BaseRootRoute,
3+
BaseRoute,
4+
BaseRouteApi,
45
notFound,
5-
rootRouteId,
6-
trimPathLeft,
76
} from '@tanstack/router-core'
87
import { useLoaderData } from './useLoaderData'
98
import { useLoaderDeps } from './useLoaderDeps'
@@ -16,10 +15,7 @@ import type {
1615
AnyContext,
1716
AnyRoute,
1817
AnyRouter,
19-
Constrain,
2018
ConstrainLiteral,
21-
LazyRoute as CoreLazyRoute,
22-
Route as CoreRoute,
2319
ErrorComponentProps,
2420
NotFoundError,
2521
NotFoundRouteProps,
@@ -29,22 +25,13 @@ import type {
2925
ResolveParams,
3026
RootRouteId,
3127
RootRouteOptions,
32-
RouteAddChildrenFn,
33-
RouteAddFileChildrenFn,
34-
RouteAddFileTypesFn,
3528
RouteConstraints,
3629
RouteIds,
37-
RouteLazyFn,
38-
RouteLoaderFn,
3930
RouteMask,
4031
RouteOptions,
41-
RoutePathOptionsIntersection,
42-
RouteTypes,
4332
RouteTypesById,
4433
Router,
4534
ToMaskOptions,
46-
TrimPathRight,
47-
UpdatableRouteOptions,
4835
UseNavigateResult,
4936
} from '@tanstack/router-core'
5037
import type { UseLoaderDataRoute } from './useLoaderData'
@@ -84,14 +71,15 @@ export function getRouteApi<
8471
return new RouteApi<TId, TRouter>({ id })
8572
}
8673

87-
export class RouteApi<TId, TRouter extends AnyRouter = RegisteredRouter> {
88-
id: TId
89-
74+
export class RouteApi<
75+
TId,
76+
TRouter extends AnyRouter = RegisteredRouter,
77+
> extends BaseRouteApi<TId, TRouter> {
9078
/**
9179
* @deprecated Use the `getRouteApi` function instead.
9280
*/
9381
constructor({ id }: { id: TId }) {
94-
this.id = id as any
82+
super({ id })
9583
}
9684

9785
useMatch: UseMatchRoute<TId> = (opts) => {
@@ -169,93 +157,22 @@ export class Route<
169157
in out TLoaderFn = undefined,
170158
in out TChildren = unknown,
171159
in out TFileRouteTypes = unknown,
172-
> implements
173-
CoreRoute<
174-
TParentRoute,
175-
TPath,
176-
TFullPath,
177-
TCustomId,
178-
TId,
179-
TSearchValidator,
180-
TParams,
181-
TRouterContext,
182-
TRouteContextFn,
183-
TBeforeLoadFn,
184-
TLoaderDeps,
185-
TLoaderFn,
186-
TChildren,
187-
TFileRouteTypes
188-
>
189-
{
190-
isRoot: TParentRoute extends AnyRoute ? true : false
191-
options: RouteOptions<
192-
TParentRoute,
193-
TId,
194-
TCustomId,
195-
TFullPath,
196-
TPath,
197-
TSearchValidator,
198-
TParams,
199-
TLoaderDeps,
200-
TLoaderFn,
201-
TRouterContext,
202-
TRouteContextFn,
203-
TBeforeLoadFn
204-
>
205-
206-
// The following properties are set up in this.init()
207-
parentRoute!: TParentRoute
208-
private _id!: TId
209-
private _path!: TPath
210-
private _fullPath!: TFullPath
211-
private _to!: TrimPathRight<TFullPath>
212-
private _ssr!: boolean
213-
214-
public get to() {
215-
/* invariant(
216-
this._to,
217-
`trying to access property 'to' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
218-
)*/
219-
return this._to
220-
}
221-
222-
public get id() {
223-
/* invariant(
224-
this._id,
225-
`trying to access property 'id' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
226-
)*/
227-
return this._id
228-
}
229-
230-
public get path() {
231-
/* invariant(
232-
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
233-
this.isRoot || this._id || this._path,
234-
`trying to access property 'path' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
235-
)*/
236-
return this._path
237-
}
238-
239-
public get fullPath() {
240-
/* invariant(
241-
this._fullPath,
242-
`trying to access property 'fullPath' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
243-
)*/
244-
return this._fullPath
245-
}
246-
247-
public get ssr() {
248-
return this._ssr
249-
}
250-
251-
// Optional
252-
children?: TChildren
253-
originalIndex?: number
254-
rank!: number
255-
lazyFn?: () => Promise<CoreLazyRoute>
256-
_lazyPromise?: Promise<void>
257-
_componentsPromise?: Promise<Array<void>>
258-
160+
> extends BaseRoute<
161+
TParentRoute,
162+
TPath,
163+
TFullPath,
164+
TCustomId,
165+
TId,
166+
TSearchValidator,
167+
TParams,
168+
TRouterContext,
169+
TRouteContextFn,
170+
TBeforeLoadFn,
171+
TLoaderDeps,
172+
TLoaderFn,
173+
TChildren,
174+
TFileRouteTypes
175+
> {
259176
/**
260177
* @deprecated Use the `createRoute` function instead.
261178
*/
@@ -275,220 +192,7 @@ export class Route<
275192
TBeforeLoadFn
276193
>,
277194
) {
278-
this.options = (options as any) || {}
279-
280-
this.isRoot = !options?.getParentRoute as any
281-
invariant(
282-
!((options as any)?.id && (options as any)?.path),
283-
`Route cannot have both an 'id' and a 'path' option.`,
284-
)
285-
;(this as any).$$typeof = Symbol.for('react.memo')
286-
}
287-
288-
types!: RouteTypes<
289-
TParentRoute,
290-
TPath,
291-
TFullPath,
292-
TCustomId,
293-
TId,
294-
TSearchValidator,
295-
TParams,
296-
TRouterContext,
297-
TRouteContextFn,
298-
TBeforeLoadFn,
299-
TLoaderDeps,
300-
TLoaderFn,
301-
TChildren,
302-
TFileRouteTypes
303-
>
304-
305-
init = (opts: { originalIndex: number; defaultSsr?: boolean }): void => {
306-
this.originalIndex = opts.originalIndex
307-
308-
const options = this.options as
309-
| (RouteOptions<
310-
TParentRoute,
311-
TId,
312-
TCustomId,
313-
TFullPath,
314-
TPath,
315-
TSearchValidator,
316-
TParams,
317-
TLoaderDeps,
318-
TLoaderFn,
319-
TRouterContext,
320-
TRouteContextFn,
321-
TBeforeLoadFn
322-
> &
323-
RoutePathOptionsIntersection<TCustomId, TPath>)
324-
| undefined
325-
326-
const isRoot = !options?.path && !options?.id
327-
328-
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
329-
this.parentRoute = this.options.getParentRoute?.()
330-
331-
if (isRoot) {
332-
this._path = rootRouteId as TPath
333-
} else {
334-
invariant(
335-
this.parentRoute,
336-
`Child Route instances must pass a 'getParentRoute: () => ParentRoute' option that returns a Route instance.`,
337-
)
338-
}
339-
340-
let path: undefined | string = isRoot ? rootRouteId : options.path
341-
342-
// If the path is anything other than an index path, trim it up
343-
if (path && path !== '/') {
344-
path = trimPathLeft(path)
345-
}
346-
347-
const customId = options?.id || path
348-
349-
// Strip the parentId prefix from the first level of children
350-
let id = isRoot
351-
? rootRouteId
352-
: joinPaths([
353-
this.parentRoute.id === rootRouteId ? '' : this.parentRoute.id,
354-
customId,
355-
])
356-
357-
if (path === rootRouteId) {
358-
path = '/'
359-
}
360-
361-
if (id !== rootRouteId) {
362-
id = joinPaths(['/', id])
363-
}
364-
365-
const fullPath =
366-
id === rootRouteId ? '/' : joinPaths([this.parentRoute.fullPath, path])
367-
368-
this._path = path as TPath
369-
this._id = id as TId
370-
// this.customId = customId as TCustomId
371-
this._fullPath = fullPath as TFullPath
372-
this._to = fullPath as TrimPathRight<TFullPath>
373-
this._ssr = options?.ssr ?? opts.defaultSsr ?? true
374-
}
375-
376-
addChildren: RouteAddChildrenFn<
377-
TParentRoute,
378-
TPath,
379-
TFullPath,
380-
TCustomId,
381-
TId,
382-
TSearchValidator,
383-
TParams,
384-
TRouterContext,
385-
TRouteContextFn,
386-
TBeforeLoadFn,
387-
TLoaderDeps,
388-
TLoaderFn,
389-
TFileRouteTypes
390-
> = (children) => {
391-
return this._addFileChildren(children) as any
392-
}
393-
394-
_addFileChildren: RouteAddFileChildrenFn<
395-
TParentRoute,
396-
TPath,
397-
TFullPath,
398-
TCustomId,
399-
TId,
400-
TSearchValidator,
401-
TParams,
402-
TRouterContext,
403-
TRouteContextFn,
404-
TBeforeLoadFn,
405-
TLoaderDeps,
406-
TLoaderFn,
407-
TFileRouteTypes
408-
> = (children) => {
409-
if (Array.isArray(children)) {
410-
this.children = children as TChildren
411-
}
412-
413-
if (typeof children === 'object' && children !== null) {
414-
this.children = Object.values(children) as TChildren
415-
}
416-
417-
return this as any
418-
}
419-
420-
_addFileTypes: RouteAddFileTypesFn<
421-
TParentRoute,
422-
TPath,
423-
TFullPath,
424-
TCustomId,
425-
TId,
426-
TSearchValidator,
427-
TParams,
428-
TRouterContext,
429-
TRouteContextFn,
430-
TBeforeLoadFn,
431-
TLoaderDeps,
432-
TLoaderFn,
433-
TChildren
434-
> = () => {
435-
return this as any
436-
}
437-
438-
updateLoader = <TNewLoaderFn>(options: {
439-
loader: Constrain<
440-
TNewLoaderFn,
441-
RouteLoaderFn<
442-
TParentRoute,
443-
TCustomId,
444-
TParams,
445-
TLoaderDeps,
446-
TRouterContext,
447-
TRouteContextFn,
448-
TBeforeLoadFn
449-
>
450-
>
451-
}) => {
452-
Object.assign(this.options, options)
453-
return this as unknown as Route<
454-
TParentRoute,
455-
TPath,
456-
TFullPath,
457-
TCustomId,
458-
TId,
459-
TSearchValidator,
460-
TParams,
461-
TRouterContext,
462-
TRouteContextFn,
463-
TBeforeLoadFn,
464-
TLoaderDeps,
465-
TNewLoaderFn,
466-
TChildren,
467-
TFileRouteTypes
468-
>
469-
}
470-
471-
update = (
472-
options: UpdatableRouteOptions<
473-
TParentRoute,
474-
TCustomId,
475-
TFullPath,
476-
TParams,
477-
TSearchValidator,
478-
TLoaderFn,
479-
TLoaderDeps,
480-
TRouterContext,
481-
TRouteContextFn,
482-
TBeforeLoadFn
483-
>,
484-
): this => {
485-
Object.assign(this.options, options)
486-
return this
487-
}
488-
489-
lazy: RouteLazyFn<this> = (lazyFn) => {
490-
this.lazyFn = lazyFn
491-
return this
195+
super(options)
492196
}
493197

494198
useMatch: UseMatchRoute<TId> = (opts) => {
@@ -573,7 +277,7 @@ export function createRoute<
573277
TRouteContextFn,
574278
TBeforeLoadFn
575279
>,
576-
): CoreRoute<
280+
): Route<
577281
TParentRoute,
578282
TPath,
579283
TFullPath,
@@ -586,8 +290,7 @@ export function createRoute<
586290
TBeforeLoadFn,
587291
TLoaderDeps,
588292
TLoaderFn,
589-
TChildren,
590-
unknown
293+
TChildren
591294
> {
592295
return new Route<
593296
TParentRoute,
@@ -650,20 +353,14 @@ export class RootRoute<
650353
in out TLoaderFn = undefined,
651354
in out TChildren = unknown,
652355
in out TFileRouteTypes = unknown,
653-
> extends Route<
654-
any, // TParentRoute
655-
'/', // TPath
656-
'/', // TFullPath
657-
string, // TCustomId
658-
RootRouteId, // TId
659-
TSearchValidator, // TSearchValidator
660-
{}, // TParams
356+
> extends BaseRootRoute<
357+
TSearchValidator,
661358
TRouterContext,
662359
TRouteContextFn,
663360
TBeforeLoadFn,
664361
TLoaderDeps,
665362
TLoaderFn,
666-
TChildren, // TChildren
363+
TChildren,
667364
TFileRouteTypes
668365
> {
669366
/**
@@ -679,7 +376,53 @@ export class RootRoute<
679376
TLoaderFn
680377
>,
681378
) {
682-
super(options as any)
379+
super(options)
380+
}
381+
382+
useMatch: UseMatchRoute<RootRouteId> = (opts) => {
383+
return useMatch({
384+
select: opts?.select,
385+
from: this.id,
386+
structuralSharing: opts?.structuralSharing,
387+
} as any) as any
388+
}
389+
390+
useRouteContext: UseRouteContextRoute<RootRouteId> = (opts) => {
391+
return useMatch({
392+
...opts,
393+
from: this.id,
394+
select: (d) => (opts?.select ? opts.select(d.context) : d.context),
395+
}) as any
396+
}
397+
398+
useSearch: UseSearchRoute<RootRouteId> = (opts) => {
399+
// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
400+
return useSearch({
401+
select: opts?.select,
402+
structuralSharing: opts?.structuralSharing,
403+
from: this.id,
404+
} as any) as any
405+
}
406+
407+
useParams: UseParamsRoute<RootRouteId> = (opts) => {
408+
// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
409+
return useParams({
410+
select: opts?.select,
411+
structuralSharing: opts?.structuralSharing,
412+
from: this.id,
413+
} as any) as any
414+
}
415+
416+
useLoaderDeps: UseLoaderDepsRoute<RootRouteId> = (opts) => {
417+
return useLoaderDeps({ ...opts, from: this.id } as any)
418+
}
419+
420+
useLoaderData: UseLoaderDataRoute<RootRouteId> = (opts) => {
421+
return useLoaderData({ ...opts, from: this.id } as any)
422+
}
423+
424+
useNavigate = (): UseNavigateResult<'/'> => {
425+
return useNavigate({ from: this.fullPath })
683426
}
684427
}
685428

@@ -699,7 +442,16 @@ export function createRootRoute<
699442
TLoaderDeps,
700443
TLoaderFn
701444
>,
702-
) {
445+
): RootRoute<
446+
TSearchValidator,
447+
TRouterContext,
448+
TRouteContextFn,
449+
TBeforeLoadFn,
450+
TLoaderDeps,
451+
TLoaderFn,
452+
unknown,
453+
unknown
454+
> {
703455
return new RootRoute<
704456
TSearchValidator,
705457
TRouterContext,

‎packages/router-core/src/index.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -115,6 +115,7 @@ export { encode, decode } from './qss'
115115
export { rootRouteId } from './root'
116116
export type { RootRouteId } from './root'
117117

118+
export { BaseRoute, BaseRouteApi, BaseRootRoute } from './route'
118119
export type {
119120
AnyPathParams,
120121
SearchSchemaInput,
@@ -182,10 +183,10 @@ export type {
182183
RouteLoaderFn,
183184
LoaderFnContext,
184185
RouteContextFn,
185-
RouteContextOptions,
186186
BeforeLoadFn,
187-
BeforeLoadContextOptions,
188187
ContextOptions,
188+
RouteContextOptions,
189+
BeforeLoadContextOptions,
189190
RootRouteOptions,
190191
UpdatableRouteOptionsExtensions,
191192
RouteConstraints,

‎packages/router-core/src/route.ts

+368
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1+
import { joinPaths, trimPathLeft } from './path'
2+
import { notFound } from './not-found'
3+
import { rootRouteId } from './root'
14
import type { LazyRoute } from './fileRoute'
5+
import type { NotFoundError } from './not-found'
26
import type { NavigateOptions, ParsePathParams } from './link'
37
import type { ParsedLocation } from './location'
48
import type {
@@ -1250,4 +1254,368 @@ export type NotFoundRouteProps = {
12501254
data: unknown
12511255
}
12521256

1257+
export class BaseRoute<
1258+
in out TParentRoute extends AnyRoute = AnyRoute,
1259+
in out TPath extends string = '/',
1260+
in out TFullPath extends string = ResolveFullPath<TParentRoute, TPath>,
1261+
in out TCustomId extends string = string,
1262+
in out TId extends string = ResolveId<TParentRoute, TCustomId, TPath>,
1263+
in out TSearchValidator = undefined,
1264+
in out TParams = ResolveParams<TPath>,
1265+
in out TRouterContext = AnyContext,
1266+
in out TRouteContextFn = AnyContext,
1267+
in out TBeforeLoadFn = AnyContext,
1268+
in out TLoaderDeps extends Record<string, any> = {},
1269+
in out TLoaderFn = undefined,
1270+
in out TChildren = unknown,
1271+
in out TFileRouteTypes = unknown,
1272+
> implements
1273+
Route<
1274+
TParentRoute,
1275+
TPath,
1276+
TFullPath,
1277+
TCustomId,
1278+
TId,
1279+
TSearchValidator,
1280+
TParams,
1281+
TRouterContext,
1282+
TRouteContextFn,
1283+
TBeforeLoadFn,
1284+
TLoaderDeps,
1285+
TLoaderFn,
1286+
TChildren,
1287+
TFileRouteTypes
1288+
>
1289+
{
1290+
isRoot: TParentRoute extends AnyRoute ? true : false
1291+
options: RouteOptions<
1292+
TParentRoute,
1293+
TId,
1294+
TCustomId,
1295+
TFullPath,
1296+
TPath,
1297+
TSearchValidator,
1298+
TParams,
1299+
TLoaderDeps,
1300+
TLoaderFn,
1301+
TRouterContext,
1302+
TRouteContextFn,
1303+
TBeforeLoadFn
1304+
>
1305+
1306+
// The following properties are set up in this.init()
1307+
parentRoute!: TParentRoute
1308+
private _id!: TId
1309+
private _path!: TPath
1310+
private _fullPath!: TFullPath
1311+
private _to!: TrimPathRight<TFullPath>
1312+
private _ssr!: boolean
1313+
1314+
public get to() {
1315+
return this._to
1316+
}
1317+
1318+
public get id() {
1319+
return this._id
1320+
}
1321+
1322+
public get path() {
1323+
return this._path
1324+
}
1325+
1326+
public get fullPath() {
1327+
return this._fullPath
1328+
}
1329+
1330+
public get ssr() {
1331+
return this._ssr
1332+
}
1333+
1334+
// Optional
1335+
children?: TChildren
1336+
originalIndex?: number
1337+
rank!: number
1338+
lazyFn?: () => Promise<LazyRoute>
1339+
_lazyPromise?: Promise<void>
1340+
_componentsPromise?: Promise<Array<void>>
1341+
1342+
constructor(
1343+
options?: RouteOptions<
1344+
TParentRoute,
1345+
TId,
1346+
TCustomId,
1347+
TFullPath,
1348+
TPath,
1349+
TSearchValidator,
1350+
TParams,
1351+
TLoaderDeps,
1352+
TLoaderFn,
1353+
TRouterContext,
1354+
TRouteContextFn,
1355+
TBeforeLoadFn
1356+
>,
1357+
) {
1358+
this.options = (options as any) || {}
1359+
this.isRoot = !options?.getParentRoute as any
1360+
1361+
if ((options as any)?.id && (options as any)?.path) {
1362+
throw new Error(`Route cannot have both an 'id' and a 'path' option.`)
1363+
}
1364+
}
1365+
1366+
types!: RouteTypes<
1367+
TParentRoute,
1368+
TPath,
1369+
TFullPath,
1370+
TCustomId,
1371+
TId,
1372+
TSearchValidator,
1373+
TParams,
1374+
TRouterContext,
1375+
TRouteContextFn,
1376+
TBeforeLoadFn,
1377+
TLoaderDeps,
1378+
TLoaderFn,
1379+
TChildren,
1380+
TFileRouteTypes
1381+
>
1382+
1383+
init = (opts: { originalIndex: number; defaultSsr?: boolean }): void => {
1384+
this.originalIndex = opts.originalIndex
1385+
1386+
const options = this.options as
1387+
| (RouteOptions<
1388+
TParentRoute,
1389+
TId,
1390+
TCustomId,
1391+
TFullPath,
1392+
TPath,
1393+
TSearchValidator,
1394+
TParams,
1395+
TLoaderDeps,
1396+
TLoaderFn,
1397+
TRouterContext,
1398+
TRouteContextFn,
1399+
TBeforeLoadFn
1400+
> &
1401+
RoutePathOptionsIntersection<TCustomId, TPath>)
1402+
| undefined
1403+
1404+
const isRoot = !options?.path && !options?.id
1405+
1406+
this.parentRoute = this.options.getParentRoute?.()
1407+
1408+
if (isRoot) {
1409+
this._path = rootRouteId as TPath
1410+
} else if (!this.parentRoute) {
1411+
throw new Error(
1412+
`Child Route instances must pass a 'getParentRoute: () => ParentRoute' option that returns a Route instance.`,
1413+
)
1414+
}
1415+
1416+
let path: undefined | string = isRoot ? rootRouteId : options?.path
1417+
1418+
// If the path is anything other than an index path, trim it up
1419+
if (path && path !== '/') {
1420+
path = trimPathLeft(path)
1421+
}
1422+
1423+
const customId = options?.id || path
1424+
1425+
// Strip the parentId prefix from the first level of children
1426+
let id = isRoot
1427+
? rootRouteId
1428+
: joinPaths([
1429+
this.parentRoute.id === rootRouteId ? '' : this.parentRoute.id,
1430+
customId,
1431+
])
1432+
1433+
if (path === rootRouteId) {
1434+
path = '/'
1435+
}
1436+
1437+
if (id !== rootRouteId) {
1438+
id = joinPaths(['/', id])
1439+
}
1440+
1441+
const fullPath =
1442+
id === rootRouteId ? '/' : joinPaths([this.parentRoute.fullPath, path])
1443+
1444+
this._path = path as TPath
1445+
this._id = id as TId
1446+
this._fullPath = fullPath as TFullPath
1447+
this._to = fullPath as TrimPathRight<TFullPath>
1448+
this._ssr = options?.ssr ?? opts.defaultSsr ?? true
1449+
}
1450+
1451+
addChildren: RouteAddChildrenFn<
1452+
TParentRoute,
1453+
TPath,
1454+
TFullPath,
1455+
TCustomId,
1456+
TId,
1457+
TSearchValidator,
1458+
TParams,
1459+
TRouterContext,
1460+
TRouteContextFn,
1461+
TBeforeLoadFn,
1462+
TLoaderDeps,
1463+
TLoaderFn,
1464+
TFileRouteTypes
1465+
> = (children) => {
1466+
return this._addFileChildren(children) as any
1467+
}
1468+
1469+
_addFileChildren: RouteAddFileChildrenFn<
1470+
TParentRoute,
1471+
TPath,
1472+
TFullPath,
1473+
TCustomId,
1474+
TId,
1475+
TSearchValidator,
1476+
TParams,
1477+
TRouterContext,
1478+
TRouteContextFn,
1479+
TBeforeLoadFn,
1480+
TLoaderDeps,
1481+
TLoaderFn,
1482+
TFileRouteTypes
1483+
> = (children) => {
1484+
if (Array.isArray(children)) {
1485+
this.children = children as TChildren
1486+
}
1487+
1488+
if (typeof children === 'object' && children !== null) {
1489+
this.children = Object.values(children) as TChildren
1490+
}
1491+
1492+
return this as any
1493+
}
1494+
1495+
_addFileTypes: RouteAddFileTypesFn<
1496+
TParentRoute,
1497+
TPath,
1498+
TFullPath,
1499+
TCustomId,
1500+
TId,
1501+
TSearchValidator,
1502+
TParams,
1503+
TRouterContext,
1504+
TRouteContextFn,
1505+
TBeforeLoadFn,
1506+
TLoaderDeps,
1507+
TLoaderFn,
1508+
TChildren
1509+
> = () => {
1510+
return this as any
1511+
}
1512+
1513+
updateLoader = <TNewLoaderFn>(options: {
1514+
loader: Constrain<
1515+
TNewLoaderFn,
1516+
RouteLoaderFn<
1517+
TParentRoute,
1518+
TCustomId,
1519+
TParams,
1520+
TLoaderDeps,
1521+
TRouterContext,
1522+
TRouteContextFn,
1523+
TBeforeLoadFn
1524+
>
1525+
>
1526+
}) => {
1527+
Object.assign(this.options, options)
1528+
return this as unknown as BaseRoute<
1529+
TParentRoute,
1530+
TPath,
1531+
TFullPath,
1532+
TCustomId,
1533+
TId,
1534+
TSearchValidator,
1535+
TParams,
1536+
TRouterContext,
1537+
TRouteContextFn,
1538+
TBeforeLoadFn,
1539+
TLoaderDeps,
1540+
TNewLoaderFn,
1541+
TChildren,
1542+
TFileRouteTypes
1543+
>
1544+
}
1545+
1546+
update = (
1547+
options: UpdatableRouteOptions<
1548+
TParentRoute,
1549+
TCustomId,
1550+
TFullPath,
1551+
TParams,
1552+
TSearchValidator,
1553+
TLoaderFn,
1554+
TLoaderDeps,
1555+
TRouterContext,
1556+
TRouteContextFn,
1557+
TBeforeLoadFn
1558+
>,
1559+
): this => {
1560+
Object.assign(this.options, options)
1561+
return this
1562+
}
1563+
1564+
lazy: RouteLazyFn<this> = (lazyFn) => {
1565+
this.lazyFn = lazyFn
1566+
return this
1567+
}
1568+
}
1569+
1570+
export class BaseRouteApi<TId, TRouter extends AnyRouter = RegisteredRouter> {
1571+
id: TId
1572+
1573+
constructor({ id }: { id: TId }) {
1574+
this.id = id as any
1575+
}
1576+
1577+
notFound = (opts?: NotFoundError) => {
1578+
return notFound({ routeId: this.id as string, ...opts })
1579+
}
1580+
}
1581+
1582+
export class BaseRootRoute<
1583+
in out TSearchValidator = undefined,
1584+
in out TRouterContext = {},
1585+
in out TRouteContextFn = AnyContext,
1586+
in out TBeforeLoadFn = AnyContext,
1587+
in out TLoaderDeps extends Record<string, any> = {},
1588+
in out TLoaderFn = undefined,
1589+
in out TChildren = unknown,
1590+
in out TFileRouteTypes = unknown,
1591+
> extends BaseRoute<
1592+
any, // TParentRoute
1593+
'/', // TPath
1594+
'/', // TFullPath
1595+
string, // TCustomId
1596+
RootRouteId, // TId
1597+
TSearchValidator, // TSearchValidator
1598+
{}, // TParams
1599+
TRouterContext,
1600+
TRouteContextFn,
1601+
TBeforeLoadFn,
1602+
TLoaderDeps,
1603+
TLoaderFn,
1604+
TChildren, // TChildren
1605+
TFileRouteTypes
1606+
> {
1607+
constructor(
1608+
options?: RootRouteOptions<
1609+
TSearchValidator,
1610+
TRouterContext,
1611+
TRouteContextFn,
1612+
TBeforeLoadFn,
1613+
TLoaderDeps,
1614+
TLoaderFn
1615+
>,
1616+
) {
1617+
super(options as any)
1618+
}
1619+
}
1620+
12531621
//

‎packages/solid-router/src/route.ts

+108-357
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
1-
import invariant from 'tiny-invariant'
21
import {
3-
joinPaths,
2+
BaseRootRoute,
3+
BaseRoute,
4+
BaseRouteApi,
45
notFound,
5-
rootRouteId,
6-
trimPathLeft,
76
} from '@tanstack/router-core'
87
import { useLoaderData } from './useLoaderData'
98
import { useLoaderDeps } from './useLoaderDeps'
@@ -16,10 +15,7 @@ import type {
1615
AnyContext,
1716
AnyRoute,
1817
AnyRouter,
19-
Constrain,
2018
ConstrainLiteral,
21-
LazyRoute as CoreLazyRoute,
22-
Route as CoreRoute,
2319
ErrorComponentProps,
2420
NotFoundError,
2521
NotFoundRouteProps,
@@ -29,22 +25,13 @@ import type {
2925
ResolveParams,
3026
RootRouteId,
3127
RootRouteOptions,
32-
RouteAddChildrenFn,
33-
RouteAddFileChildrenFn,
34-
RouteAddFileTypesFn,
3528
RouteConstraints,
3629
RouteIds,
37-
RouteLazyFn,
38-
RouteLoaderFn,
3930
RouteMask,
4031
RouteOptions,
41-
RoutePathOptionsIntersection,
42-
RouteTypes,
4332
RouteTypesById,
4433
Router,
4534
ToMaskOptions,
46-
TrimPathRight,
47-
UpdatableRouteOptions,
4835
UseNavigateResult,
4936
} from '@tanstack/router-core'
5037
import type { UseLoaderDataRoute } from './useLoaderData'
@@ -84,14 +71,15 @@ export function getRouteApi<
8471
return new RouteApi<TId, TRouter>({ id })
8572
}
8673

87-
export class RouteApi<TId, TRouter extends AnyRouter = RegisteredRouter> {
88-
id: TId
89-
74+
export class RouteApi<
75+
TId,
76+
TRouter extends AnyRouter = RegisteredRouter,
77+
> extends BaseRouteApi<TId, TRouter> {
9078
/**
9179
* @deprecated Use the `getRouteApi` function instead.
9280
*/
9381
constructor({ id }: { id: TId }) {
94-
this.id = id as any
82+
super({ id })
9583
}
9684

9785
useMatch: UseMatchRoute<TId> = (opts) => {
@@ -164,93 +152,22 @@ export class Route<
164152
in out TLoaderFn = undefined,
165153
in out TChildren = unknown,
166154
in out TFileRouteTypes = unknown,
167-
> implements
168-
CoreRoute<
169-
TParentRoute,
170-
TPath,
171-
TFullPath,
172-
TCustomId,
173-
TId,
174-
TSearchValidator,
175-
TParams,
176-
TRouterContext,
177-
TRouteContextFn,
178-
TBeforeLoadFn,
179-
TLoaderDeps,
180-
TLoaderFn,
181-
TChildren,
182-
TFileRouteTypes
183-
>
184-
{
185-
isRoot: TParentRoute extends AnyRoute ? true : false
186-
options: RouteOptions<
187-
TParentRoute,
188-
TId,
189-
TCustomId,
190-
TFullPath,
191-
TPath,
192-
TSearchValidator,
193-
TParams,
194-
TLoaderDeps,
195-
TLoaderFn,
196-
TRouterContext,
197-
TRouteContextFn,
198-
TBeforeLoadFn
199-
>
200-
201-
// The following properties are set up in this.init()
202-
parentRoute!: TParentRoute
203-
private _id!: TId
204-
private _path!: TPath
205-
private _fullPath!: TFullPath
206-
private _to!: TrimPathRight<TFullPath>
207-
private _ssr!: boolean
208-
209-
public get to() {
210-
/* invariant(
211-
this._to,
212-
`trying to access property 'to' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
213-
)*/
214-
return this._to
215-
}
216-
217-
public get id() {
218-
/* invariant(
219-
this._id,
220-
`trying to access property 'id' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
221-
)*/
222-
return this._id
223-
}
224-
225-
public get path() {
226-
/* invariant(
227-
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
228-
this.isRoot || this._id || this._path,
229-
`trying to access property 'path' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
230-
)*/
231-
return this._path
232-
}
233-
234-
public get fullPath() {
235-
/* invariant(
236-
this._fullPath,
237-
`trying to access property 'fullPath' on a route which is not initialized yet. Route properties are only available after 'createRouter' completed.`,
238-
)*/
239-
return this._fullPath
240-
}
241-
242-
public get ssr() {
243-
return this._ssr
244-
}
245-
246-
// Optional
247-
children?: TChildren
248-
originalIndex?: number
249-
rank!: number
250-
lazyFn?: () => Promise<CoreLazyRoute>
251-
_lazyPromise?: Promise<void>
252-
_componentsPromise?: Promise<Array<void>>
253-
155+
> extends BaseRoute<
156+
TParentRoute,
157+
TPath,
158+
TFullPath,
159+
TCustomId,
160+
TId,
161+
TSearchValidator,
162+
TParams,
163+
TRouterContext,
164+
TRouteContextFn,
165+
TBeforeLoadFn,
166+
TLoaderDeps,
167+
TLoaderFn,
168+
TChildren,
169+
TFileRouteTypes
170+
> {
254171
/**
255172
* @deprecated Use the `createRoute` function instead.
256173
*/
@@ -270,218 +187,7 @@ export class Route<
270187
TBeforeLoadFn
271188
>,
272189
) {
273-
this.options = (options as any) || {}
274-
275-
this.isRoot = !options?.getParentRoute as any
276-
invariant(
277-
!((options as any)?.id && (options as any)?.path),
278-
`Route cannot have both an 'id' and a 'path' option.`,
279-
)
280-
}
281-
282-
types!: RouteTypes<
283-
TParentRoute,
284-
TPath,
285-
TFullPath,
286-
TCustomId,
287-
TId,
288-
TSearchValidator,
289-
TParams,
290-
TRouterContext,
291-
TRouteContextFn,
292-
TBeforeLoadFn,
293-
TLoaderDeps,
294-
TLoaderFn,
295-
TChildren,
296-
TFileRouteTypes
297-
>
298-
299-
init = (opts: { originalIndex: number; defaultSsr?: boolean }): void => {
300-
this.originalIndex = opts.originalIndex
301-
302-
const options = this.options as
303-
| (RouteOptions<
304-
TParentRoute,
305-
TId,
306-
TCustomId,
307-
TFullPath,
308-
TPath,
309-
TSearchValidator,
310-
TParams,
311-
TLoaderDeps,
312-
TLoaderFn,
313-
TRouterContext,
314-
TRouteContextFn,
315-
TBeforeLoadFn
316-
> &
317-
RoutePathOptionsIntersection<TCustomId, TPath>)
318-
| undefined
319-
320-
const isRoot = !options?.path && !options?.id
321-
322-
this.parentRoute = this.options.getParentRoute?.()
323-
324-
if (isRoot) {
325-
this._path = rootRouteId as TPath
326-
} else {
327-
invariant(
328-
this.parentRoute,
329-
`Child Route instances must pass a 'getParentRoute: () => ParentRoute' option that returns a Route instance.`,
330-
)
331-
}
332-
333-
let path: undefined | string = isRoot ? rootRouteId : options.path
334-
335-
// If the path is anything other than an index path, trim it up
336-
if (path && path !== '/') {
337-
path = trimPathLeft(path)
338-
}
339-
340-
const customId = options?.id || path
341-
342-
// Strip the parentId prefix from the first level of children
343-
let id = isRoot
344-
? rootRouteId
345-
: joinPaths([
346-
this.parentRoute.id === rootRouteId ? '' : this.parentRoute.id,
347-
customId,
348-
])
349-
350-
if (path === rootRouteId) {
351-
path = '/'
352-
}
353-
354-
if (id !== rootRouteId) {
355-
id = joinPaths(['/', id])
356-
}
357-
358-
const fullPath =
359-
id === rootRouteId ? '/' : joinPaths([this.parentRoute.fullPath, path])
360-
361-
this._path = path as TPath
362-
this._id = id as TId
363-
// this.customId = customId as TCustomId
364-
this._fullPath = fullPath as TFullPath
365-
this._to = fullPath as TrimPathRight<TFullPath>
366-
this._ssr = options?.ssr ?? opts.defaultSsr ?? true
367-
}
368-
369-
addChildren: RouteAddChildrenFn<
370-
TParentRoute,
371-
TPath,
372-
TFullPath,
373-
TCustomId,
374-
TId,
375-
TSearchValidator,
376-
TParams,
377-
TRouterContext,
378-
TRouteContextFn,
379-
TBeforeLoadFn,
380-
TLoaderDeps,
381-
TLoaderFn,
382-
TFileRouteTypes
383-
> = (children) => {
384-
return this._addFileChildren(children) as any
385-
}
386-
387-
_addFileChildren: RouteAddFileChildrenFn<
388-
TParentRoute,
389-
TPath,
390-
TFullPath,
391-
TCustomId,
392-
TId,
393-
TSearchValidator,
394-
TParams,
395-
TRouterContext,
396-
TRouteContextFn,
397-
TBeforeLoadFn,
398-
TLoaderDeps,
399-
TLoaderFn,
400-
TFileRouteTypes
401-
> = (children) => {
402-
if (Array.isArray(children)) {
403-
this.children = children as TChildren
404-
}
405-
406-
if (typeof children === 'object' && children !== null) {
407-
this.children = Object.values(children) as TChildren
408-
}
409-
410-
return this as any
411-
}
412-
413-
_addFileTypes: RouteAddFileTypesFn<
414-
TParentRoute,
415-
TPath,
416-
TFullPath,
417-
TCustomId,
418-
TId,
419-
TSearchValidator,
420-
TParams,
421-
TRouterContext,
422-
TRouteContextFn,
423-
TBeforeLoadFn,
424-
TLoaderDeps,
425-
TLoaderFn,
426-
TChildren
427-
> = () => {
428-
return this as any
429-
}
430-
431-
updateLoader = <TNewLoaderFn>(options: {
432-
loader: Constrain<
433-
TNewLoaderFn,
434-
RouteLoaderFn<
435-
TParentRoute,
436-
TCustomId,
437-
TParams,
438-
TLoaderDeps,
439-
TRouterContext,
440-
TRouteContextFn,
441-
TBeforeLoadFn
442-
>
443-
>
444-
}) => {
445-
Object.assign(this.options, options)
446-
return this as unknown as Route<
447-
TParentRoute,
448-
TPath,
449-
TFullPath,
450-
TCustomId,
451-
TId,
452-
TSearchValidator,
453-
TParams,
454-
TRouterContext,
455-
TRouteContextFn,
456-
TBeforeLoadFn,
457-
TLoaderDeps,
458-
TNewLoaderFn,
459-
TChildren,
460-
TFileRouteTypes
461-
>
462-
}
463-
464-
update = (
465-
options: UpdatableRouteOptions<
466-
TParentRoute,
467-
TCustomId,
468-
TFullPath,
469-
TParams,
470-
TSearchValidator,
471-
TLoaderFn,
472-
TLoaderDeps,
473-
TRouterContext,
474-
TRouteContextFn,
475-
TBeforeLoadFn
476-
>,
477-
): this => {
478-
Object.assign(this.options, options)
479-
return this
480-
}
481-
482-
lazy: RouteLazyFn<this> = (lazyFn) => {
483-
this.lazyFn = lazyFn
484-
return this
190+
super(options)
485191
}
486192

487193
useMatch: UseMatchRoute<TId> = (opts) => {
@@ -561,7 +267,7 @@ export function createRoute<
561267
TRouteContextFn,
562268
TBeforeLoadFn
563269
>,
564-
): CoreRoute<
270+
): Route<
565271
TParentRoute,
566272
TPath,
567273
TFullPath,
@@ -590,7 +296,8 @@ export function createRoute<
590296
TBeforeLoadFn,
591297
TLoaderDeps,
592298
TLoaderFn,
593-
TChildren
299+
TChildren,
300+
unknown
594301
>(options)
595302
}
596303

@@ -638,20 +345,14 @@ export class RootRoute<
638345
in out TLoaderFn = undefined,
639346
in out TChildren = unknown,
640347
in out TFileRouteTypes = unknown,
641-
> extends Route<
642-
any, // TParentRoute
643-
'/', // TPath
644-
'/', // TFullPath
645-
string, // TCustomId
646-
RootRouteId, // TId
647-
TSearchValidator, // TSearchValidator
648-
{}, // TParams
348+
> extends BaseRootRoute<
349+
TSearchValidator,
649350
TRouterContext,
650351
TRouteContextFn,
651352
TBeforeLoadFn,
652353
TLoaderDeps,
653354
TLoaderFn,
654-
TChildren, // TChildren
355+
TChildren,
655356
TFileRouteTypes
656357
> {
657358
/**
@@ -667,35 +368,49 @@ export class RootRoute<
667368
TLoaderFn
668369
>,
669370
) {
670-
super(options as any)
371+
super(options)
671372
}
672-
}
673373

674-
export function createRootRoute<
675-
TSearchValidator = undefined,
676-
TRouterContext = {},
677-
TRouteContextFn = AnyContext,
678-
TBeforeLoadFn = AnyContext,
679-
TLoaderDeps extends Record<string, any> = {},
680-
TLoaderFn = undefined,
681-
>(
682-
options?: RootRouteOptions<
683-
TSearchValidator,
684-
TRouterContext,
685-
TRouteContextFn,
686-
TBeforeLoadFn,
687-
TLoaderDeps,
688-
TLoaderFn
689-
>,
690-
) {
691-
return new RootRoute<
692-
TSearchValidator,
693-
TRouterContext,
694-
TRouteContextFn,
695-
TBeforeLoadFn,
696-
TLoaderDeps,
697-
TLoaderFn
698-
>(options)
374+
useMatch: UseMatchRoute<RootRouteId> = (opts) => {
375+
return useMatch({
376+
select: opts?.select,
377+
from: this.id,
378+
} as any) as any
379+
}
380+
381+
useRouteContext: UseRouteContextRoute<RootRouteId> = (opts) => {
382+
return useMatch({
383+
...opts,
384+
from: this.id,
385+
select: (d) => (opts?.select ? opts.select(d.context) : d.context),
386+
}) as any
387+
}
388+
389+
useSearch: UseSearchRoute<RootRouteId> = (opts) => {
390+
return useSearch({
391+
select: opts?.select,
392+
from: this.id,
393+
} as any) as any
394+
}
395+
396+
useParams: UseParamsRoute<RootRouteId> = (opts) => {
397+
return useParams({
398+
select: opts?.select,
399+
from: this.id,
400+
} as any) as any
401+
}
402+
403+
useLoaderDeps: UseLoaderDepsRoute<RootRouteId> = (opts) => {
404+
return useLoaderDeps({ ...opts, from: this.id } as any)
405+
}
406+
407+
useLoaderData: UseLoaderDataRoute<RootRouteId> = (opts) => {
408+
return useLoaderData({ ...opts, from: this.id } as any)
409+
}
410+
411+
useNavigate = (): UseNavigateResult<'/'> => {
412+
return useNavigate({ from: this.fullPath })
413+
}
699414
}
700415

701416
export function createRouteMask<
@@ -778,3 +493,39 @@ export class NotFoundRoute<
778493
})
779494
}
780495
}
496+
497+
export function createRootRoute<
498+
TSearchValidator = undefined,
499+
TRouterContext = {},
500+
TRouteContextFn = AnyContext,
501+
TBeforeLoadFn = AnyContext,
502+
TLoaderDeps extends Record<string, any> = {},
503+
TLoaderFn = undefined,
504+
>(
505+
options?: RootRouteOptions<
506+
TSearchValidator,
507+
TRouterContext,
508+
TRouteContextFn,
509+
TBeforeLoadFn,
510+
TLoaderDeps,
511+
TLoaderFn
512+
>,
513+
): RootRoute<
514+
TSearchValidator,
515+
TRouterContext,
516+
TRouteContextFn,
517+
TBeforeLoadFn,
518+
TLoaderDeps,
519+
TLoaderFn,
520+
unknown,
521+
unknown
522+
> {
523+
return new RootRoute<
524+
TSearchValidator,
525+
TRouterContext,
526+
TRouteContextFn,
527+
TBeforeLoadFn,
528+
TLoaderDeps,
529+
TLoaderFn
530+
>(options)
531+
}

0 commit comments

Comments
 (0)
Please sign in to comment.