@tanstack/react-router 0.0.1-beta.57 → 0.0.1-beta.58
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/index.js +5 -4
- package/build/cjs/index.js.map +1 -1
- package/build/esm/index.js +5 -4
- package/build/esm/index.js.map +1 -1
- package/build/stats-html.html +1 -1
- package/build/stats-react.json +49 -49
- package/build/types/index.d.ts +22 -22
- package/build/umd/index.development.js +132 -81
- package/build/umd/index.development.js.map +1 -1
- package/build/umd/index.production.js +3 -3
- package/build/umd/index.production.js.map +1 -1
- package/package.json +2 -2
- package/src/index.tsx +48 -56
package/src/index.tsx
CHANGED
|
@@ -2,7 +2,7 @@ import * as React from 'react'
|
|
|
2
2
|
|
|
3
3
|
import {
|
|
4
4
|
Route,
|
|
5
|
-
|
|
5
|
+
RegisteredRoutesInfo,
|
|
6
6
|
RegisteredRouter,
|
|
7
7
|
RouterStore,
|
|
8
8
|
last,
|
|
@@ -10,15 +10,14 @@ import {
|
|
|
10
10
|
RouterOptions,
|
|
11
11
|
RouteMatch,
|
|
12
12
|
MatchRouteOptions,
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
DefaultAllRouteInfo,
|
|
13
|
+
AnyRoute,
|
|
14
|
+
AnyRoutesInfo,
|
|
15
|
+
DefaultRoutesInfo,
|
|
17
16
|
functionalUpdate,
|
|
18
|
-
|
|
17
|
+
RoutesInfo,
|
|
19
18
|
ValidFromPath,
|
|
20
19
|
LinkOptions,
|
|
21
|
-
|
|
20
|
+
RouteByPath,
|
|
22
21
|
ResolveRelativePath,
|
|
23
22
|
NoInfer,
|
|
24
23
|
ToOptions,
|
|
@@ -62,9 +61,9 @@ export function lazy(
|
|
|
62
61
|
}
|
|
63
62
|
|
|
64
63
|
export type LinkPropsOptions<
|
|
65
|
-
TFrom extends
|
|
64
|
+
TFrom extends RegisteredRoutesInfo['routePaths'] = '/',
|
|
66
65
|
TTo extends string = '.',
|
|
67
|
-
> = LinkOptions<
|
|
66
|
+
> = LinkOptions<RegisteredRoutesInfo, TFrom, TTo> & {
|
|
68
67
|
// A function that returns additional props for the `active` state of this link. These props override other props passed to the link (`style`'s are merged, `className`'s are concatenated)
|
|
69
68
|
activeProps?:
|
|
70
69
|
| React.AnchorHTMLAttributes<HTMLAnchorElement>
|
|
@@ -76,33 +75,33 @@ export type LinkPropsOptions<
|
|
|
76
75
|
}
|
|
77
76
|
|
|
78
77
|
export type MakeUseMatchRouteOptions<
|
|
79
|
-
TFrom extends
|
|
78
|
+
TFrom extends RegisteredRoutesInfo['routePaths'] = '/',
|
|
80
79
|
TTo extends string = '.',
|
|
81
|
-
> = ToOptions<
|
|
80
|
+
> = ToOptions<RegisteredRoutesInfo, TFrom, TTo> & MatchRouteOptions
|
|
82
81
|
|
|
83
82
|
export type MakeMatchRouteOptions<
|
|
84
|
-
TFrom extends
|
|
83
|
+
TFrom extends RegisteredRoutesInfo['routePaths'] = '/',
|
|
85
84
|
TTo extends string = '.',
|
|
86
|
-
> = ToOptions<
|
|
85
|
+
> = ToOptions<RegisteredRoutesInfo, TFrom, TTo> &
|
|
87
86
|
MatchRouteOptions & {
|
|
88
87
|
// 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
|
|
89
88
|
children?:
|
|
90
89
|
| ReactNode
|
|
91
90
|
| ((
|
|
92
|
-
params:
|
|
93
|
-
|
|
91
|
+
params: RouteByPath<
|
|
92
|
+
RegisteredRoutesInfo,
|
|
94
93
|
ResolveRelativePath<TFrom, NoInfer<TTo>>
|
|
95
|
-
>['allParams'],
|
|
94
|
+
>['__types']['allParams'],
|
|
96
95
|
) => ReactNode)
|
|
97
96
|
}
|
|
98
97
|
|
|
99
98
|
export type MakeLinkPropsOptions<
|
|
100
|
-
TFrom extends ValidFromPath<
|
|
99
|
+
TFrom extends ValidFromPath<RegisteredRoutesInfo> = '/',
|
|
101
100
|
TTo extends string = '.',
|
|
102
101
|
> = LinkPropsOptions<TFrom, TTo> & React.AnchorHTMLAttributes<HTMLAnchorElement>
|
|
103
102
|
|
|
104
103
|
export type MakeLinkOptions<
|
|
105
|
-
TFrom extends
|
|
104
|
+
TFrom extends RegisteredRoutesInfo['routePaths'] = '/',
|
|
106
105
|
TTo extends string = '.',
|
|
107
106
|
> = LinkPropsOptions<TFrom, TTo> &
|
|
108
107
|
React.AnchorHTMLAttributes<HTMLAnchorElement> &
|
|
@@ -120,7 +119,7 @@ declare module '@tanstack/router' {
|
|
|
120
119
|
}>
|
|
121
120
|
}
|
|
122
121
|
|
|
123
|
-
interface RouterOptions<
|
|
122
|
+
interface RouterOptions<TRouteTree, TRouterContext> {
|
|
124
123
|
// ssrFooter?: () => JSX.Element | Node
|
|
125
124
|
}
|
|
126
125
|
}
|
|
@@ -134,7 +133,7 @@ export type PromptProps = {
|
|
|
134
133
|
//
|
|
135
134
|
|
|
136
135
|
export function useLinkProps<
|
|
137
|
-
TFrom extends ValidFromPath<
|
|
136
|
+
TFrom extends ValidFromPath<RegisteredRoutesInfo> = '/',
|
|
138
137
|
TTo extends string = '.',
|
|
139
138
|
>(
|
|
140
139
|
options: MakeLinkPropsOptions<TFrom, TTo>,
|
|
@@ -245,11 +244,11 @@ export function useLinkProps<
|
|
|
245
244
|
}
|
|
246
245
|
|
|
247
246
|
export interface LinkFn<
|
|
248
|
-
TDefaultFrom extends
|
|
247
|
+
TDefaultFrom extends RegisteredRoutesInfo['routePaths'] = '/',
|
|
249
248
|
TDefaultTo extends string = '.',
|
|
250
249
|
> {
|
|
251
250
|
<
|
|
252
|
-
TFrom extends
|
|
251
|
+
TFrom extends RegisteredRoutesInfo['routePaths'] = TDefaultFrom,
|
|
253
252
|
TTo extends string = TDefaultTo,
|
|
254
253
|
>(
|
|
255
254
|
props: MakeLinkOptions<TFrom, TTo> & React.RefAttributes<HTMLAnchorElement>,
|
|
@@ -288,10 +287,10 @@ export type MatchesProviderProps = {
|
|
|
288
287
|
}
|
|
289
288
|
|
|
290
289
|
export class ReactRouter<
|
|
291
|
-
TRouteConfig extends
|
|
292
|
-
|
|
290
|
+
TRouteConfig extends AnyRoute = Route,
|
|
291
|
+
TRoutesInfo extends AnyRoutesInfo = RoutesInfo<TRouteConfig>,
|
|
293
292
|
TRouterContext = unknown,
|
|
294
|
-
> extends Router<TRouteConfig,
|
|
293
|
+
> extends Router<TRouteConfig, TRoutesInfo, TRouterContext> {
|
|
295
294
|
constructor(opts: RouterOptions<TRouteConfig, TRouterContext>) {
|
|
296
295
|
super({
|
|
297
296
|
...opts,
|
|
@@ -307,21 +306,18 @@ export class ReactRouter<
|
|
|
307
306
|
}
|
|
308
307
|
|
|
309
308
|
export type RouterProps<
|
|
310
|
-
TRouteConfig extends
|
|
311
|
-
|
|
309
|
+
TRouteConfig extends AnyRoute = Route,
|
|
310
|
+
TRoutesInfo extends AnyRoutesInfo = DefaultRoutesInfo,
|
|
312
311
|
TRouterContext = unknown,
|
|
313
312
|
> = RouterOptions<TRouteConfig, TRouterContext> & {
|
|
314
|
-
router: Router<TRouteConfig,
|
|
313
|
+
router: Router<TRouteConfig, TRoutesInfo, TRouterContext>
|
|
315
314
|
}
|
|
316
315
|
|
|
317
316
|
export function RouterProvider<
|
|
318
|
-
TRouteConfig extends
|
|
319
|
-
|
|
317
|
+
TRouteConfig extends AnyRoute = Route,
|
|
318
|
+
TRoutesInfo extends AnyRoutesInfo = DefaultRoutesInfo,
|
|
320
319
|
TRouterContext = unknown,
|
|
321
|
-
>({
|
|
322
|
-
router,
|
|
323
|
-
...rest
|
|
324
|
-
}: RouterProps<TRouteConfig, TAllRouteInfo, TRouterContext>) {
|
|
320
|
+
>({ router, ...rest }: RouterProps<TRouteConfig, TRoutesInfo, TRouterContext>) {
|
|
325
321
|
router.update(rest)
|
|
326
322
|
|
|
327
323
|
const currentMatches = useStore(
|
|
@@ -362,11 +358,11 @@ export function useMatches(): RouteMatch[] {
|
|
|
362
358
|
}
|
|
363
359
|
|
|
364
360
|
export function useMatch<
|
|
365
|
-
TFrom extends keyof
|
|
361
|
+
TFrom extends keyof RegisteredRoutesInfo['routesById'],
|
|
366
362
|
TStrict extends boolean = true,
|
|
367
363
|
TRouteMatch = RouteMatch<
|
|
368
|
-
|
|
369
|
-
|
|
364
|
+
RegisteredRoutesInfo,
|
|
365
|
+
RegisteredRoutesInfo['routesById'][TFrom]
|
|
370
366
|
>,
|
|
371
367
|
>(opts?: {
|
|
372
368
|
from: TFrom
|
|
@@ -412,10 +408,8 @@ export function useMatch<
|
|
|
412
408
|
}
|
|
413
409
|
|
|
414
410
|
export function useRoute<
|
|
415
|
-
TId extends keyof
|
|
416
|
-
>(
|
|
417
|
-
routeId: TId,
|
|
418
|
-
): Route<RegisteredAllRouteInfo, RegisteredAllRouteInfo['routeInfoById'][TId]> {
|
|
411
|
+
TId extends keyof RegisteredRoutesInfo['routesById'] = '/',
|
|
412
|
+
>(routeId: TId): RegisteredRoutesInfo['routesById'][TId] {
|
|
419
413
|
const router = useRouter()
|
|
420
414
|
const resolvedRoute = router.getRoute(routeId as any)
|
|
421
415
|
|
|
@@ -430,9 +424,9 @@ export function useRoute<
|
|
|
430
424
|
}
|
|
431
425
|
|
|
432
426
|
export function useSearch<
|
|
433
|
-
TFrom extends keyof
|
|
427
|
+
TFrom extends keyof RegisteredRoutesInfo['routesById'],
|
|
434
428
|
TStrict extends boolean = true,
|
|
435
|
-
TSearch =
|
|
429
|
+
TSearch = RegisteredRoutesInfo['routesById'][TFrom]['__types']['fullSearchSchema'],
|
|
436
430
|
TSelected = TSearch,
|
|
437
431
|
>(opts?: {
|
|
438
432
|
from: TFrom
|
|
@@ -449,10 +443,10 @@ export function useSearch<
|
|
|
449
443
|
}
|
|
450
444
|
|
|
451
445
|
export function useParams<
|
|
452
|
-
TFrom extends keyof
|
|
446
|
+
TFrom extends keyof RegisteredRoutesInfo['routesById'] = '/',
|
|
453
447
|
TDefaultSelected = Expand<
|
|
454
|
-
|
|
455
|
-
|
|
448
|
+
RegisteredRoutesInfo['allParams'] &
|
|
449
|
+
RegisteredRoutesInfo['routesById'][TFrom]['__types']['allParams']
|
|
456
450
|
>,
|
|
457
451
|
TSelected = TDefaultSelected,
|
|
458
452
|
>(opts?: {
|
|
@@ -469,11 +463,11 @@ export function useParams<
|
|
|
469
463
|
}
|
|
470
464
|
|
|
471
465
|
export function useNavigate<
|
|
472
|
-
TDefaultFrom extends keyof
|
|
466
|
+
TDefaultFrom extends keyof RegisteredRoutesInfo['routesById'] = '/',
|
|
473
467
|
>(defaultOpts?: { from?: TDefaultFrom }) {
|
|
474
468
|
const router = useRouter()
|
|
475
469
|
return <
|
|
476
|
-
TFrom extends keyof
|
|
470
|
+
TFrom extends keyof RegisteredRoutesInfo['routesById'] = TDefaultFrom,
|
|
477
471
|
TTo extends string = '.',
|
|
478
472
|
>(
|
|
479
473
|
opts?: MakeLinkOptions<TFrom, TTo>,
|
|
@@ -486,7 +480,7 @@ export function useMatchRoute() {
|
|
|
486
480
|
const router = useRouter()
|
|
487
481
|
|
|
488
482
|
return <
|
|
489
|
-
TFrom extends ValidFromPath<
|
|
483
|
+
TFrom extends ValidFromPath<RegisteredRoutesInfo> = '/',
|
|
490
484
|
TTo extends string = '.',
|
|
491
485
|
>(
|
|
492
486
|
opts: MakeUseMatchRouteOptions<TFrom, TTo>,
|
|
@@ -501,7 +495,7 @@ export function useMatchRoute() {
|
|
|
501
495
|
}
|
|
502
496
|
|
|
503
497
|
export function MatchRoute<
|
|
504
|
-
TFrom extends ValidFromPath<
|
|
498
|
+
TFrom extends ValidFromPath<RegisteredRoutesInfo> = '/',
|
|
505
499
|
TTo extends string = '.',
|
|
506
500
|
>(props: MakeMatchRouteOptions<TFrom, TTo>): any {
|
|
507
501
|
const matchRoute = useMatchRoute()
|
|
@@ -599,6 +593,10 @@ function SubOutlet({
|
|
|
599
593
|
)
|
|
600
594
|
}
|
|
601
595
|
|
|
596
|
+
// This is the messiest thing ever... I'm either seriously tired (likely) or
|
|
597
|
+
// there has to be a better way to reset error boundaries when the
|
|
598
|
+
// router's location key changes.
|
|
599
|
+
|
|
602
600
|
class CatchBoundary extends React.Component<{
|
|
603
601
|
children: any
|
|
604
602
|
errorComponent: any
|
|
@@ -608,17 +606,14 @@ class CatchBoundary extends React.Component<{
|
|
|
608
606
|
error: false,
|
|
609
607
|
info: undefined,
|
|
610
608
|
}
|
|
611
|
-
|
|
612
609
|
componentDidCatch(error: any, info: any) {
|
|
613
610
|
console.error(`Error in route match: ${this.props.match.id}`)
|
|
614
611
|
console.error(error)
|
|
615
|
-
|
|
616
612
|
this.setState({
|
|
617
613
|
error,
|
|
618
614
|
info,
|
|
619
615
|
})
|
|
620
616
|
}
|
|
621
|
-
|
|
622
617
|
render() {
|
|
623
618
|
return (
|
|
624
619
|
<CatchBoundaryInner
|
|
@@ -630,9 +625,6 @@ class CatchBoundary extends React.Component<{
|
|
|
630
625
|
}
|
|
631
626
|
}
|
|
632
627
|
|
|
633
|
-
// This is the messiest thing ever... I'm either seriously tired (likely) or
|
|
634
|
-
// there has to be a better way to reset error boundaries when the
|
|
635
|
-
// router's location key changes.
|
|
636
628
|
function CatchBoundaryInner(props: {
|
|
637
629
|
children: any
|
|
638
630
|
errorComponent: any
|