@tanstack/react-router 1.168.11 → 1.168.13
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/dist/cjs/CatchBoundary.cjs +8 -6
- package/dist/cjs/CatchBoundary.cjs.map +1 -1
- package/dist/cjs/Match.cjs +11 -8
- package/dist/cjs/Match.cjs.map +1 -1
- package/dist/cjs/Matches.cjs.map +1 -1
- package/dist/cjs/Matches.d.cts +2 -2
- package/dist/esm/CatchBoundary.js +8 -6
- package/dist/esm/CatchBoundary.js.map +1 -1
- package/dist/esm/Match.js +11 -8
- package/dist/esm/Match.js.map +1 -1
- package/dist/esm/Matches.d.ts +2 -2
- package/dist/esm/Matches.js.map +1 -1
- package/package.json +1 -1
- package/src/CatchBoundary.tsx +14 -20
- package/src/Match.tsx +28 -14
- package/src/Matches.tsx +3 -7
|
@@ -22,8 +22,13 @@ var CatchBoundaryImpl = class extends react.Component {
|
|
|
22
22
|
super(..._args);
|
|
23
23
|
this.state = { error: null };
|
|
24
24
|
}
|
|
25
|
-
static getDerivedStateFromProps(props) {
|
|
26
|
-
|
|
25
|
+
static getDerivedStateFromProps(props, state) {
|
|
26
|
+
const resetKey = props.getResetKey();
|
|
27
|
+
if (state.error && state.resetKey !== resetKey) return {
|
|
28
|
+
resetKey,
|
|
29
|
+
error: null
|
|
30
|
+
};
|
|
31
|
+
return { resetKey };
|
|
27
32
|
}
|
|
28
33
|
static getDerivedStateFromError(error) {
|
|
29
34
|
return { error };
|
|
@@ -31,15 +36,12 @@ var CatchBoundaryImpl = class extends react.Component {
|
|
|
31
36
|
reset() {
|
|
32
37
|
this.setState({ error: null });
|
|
33
38
|
}
|
|
34
|
-
componentDidUpdate(prevProps, prevState) {
|
|
35
|
-
if (prevState.error && prevState.resetKey !== this.state.resetKey) this.reset();
|
|
36
|
-
}
|
|
37
39
|
componentDidCatch(error, errorInfo) {
|
|
38
40
|
if (this.props.onCatch) this.props.onCatch(error, errorInfo);
|
|
39
41
|
}
|
|
40
42
|
render() {
|
|
41
43
|
return this.props.children({
|
|
42
|
-
error: this.state.
|
|
44
|
+
error: this.state.error,
|
|
43
45
|
reset: () => {
|
|
44
46
|
this.reset();
|
|
45
47
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CatchBoundary.cjs","names":[],"sources":["../../src/CatchBoundary.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { ErrorRouteComponent } from './route'\nimport type { ErrorInfo } from 'react'\n\nexport function CatchBoundary(props: {\n getResetKey: () => number | string\n children: React.ReactNode\n errorComponent?: ErrorRouteComponent\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}) {\n const errorComponent = props.errorComponent ?? ErrorComponent\n\n return (\n <CatchBoundaryImpl\n getResetKey={props.getResetKey}\n onCatch={props.onCatch}\n children={({ error, reset }) => {\n if (error) {\n return React.createElement(errorComponent, {\n error,\n reset,\n })\n }\n\n return props.children\n }}\n />\n )\n}\n\nclass CatchBoundaryImpl extends React.Component<{\n getResetKey: () => number | string\n children: (props: {\n error: Error | null\n reset: () => void\n }) => React.ReactNode\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}> {\n state = { error: null } as { error: Error | null; resetKey
|
|
1
|
+
{"version":3,"file":"CatchBoundary.cjs","names":[],"sources":["../../src/CatchBoundary.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { ErrorRouteComponent } from './route'\nimport type { ErrorInfo } from 'react'\n\nexport function CatchBoundary(props: {\n getResetKey: () => number | string\n children: React.ReactNode\n errorComponent?: ErrorRouteComponent\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}) {\n const errorComponent = props.errorComponent ?? ErrorComponent\n\n return (\n <CatchBoundaryImpl\n getResetKey={props.getResetKey}\n onCatch={props.onCatch}\n children={({ error, reset }) => {\n if (error) {\n return React.createElement(errorComponent, {\n error,\n reset,\n })\n }\n\n return props.children\n }}\n />\n )\n}\n\nclass CatchBoundaryImpl extends React.Component<{\n getResetKey: () => number | string\n children: (props: {\n error: Error | null\n reset: () => void\n }) => React.ReactNode\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}> {\n state = { error: null } as { error: Error | null; resetKey?: string | number }\n\n static getDerivedStateFromProps(\n props: { getResetKey: () => string | number },\n state: { resetKey?: string | number; error: Error | null },\n ) {\n const resetKey = props.getResetKey()\n\n if (state.error && state.resetKey !== resetKey) {\n return { resetKey, error: null }\n }\n\n return { resetKey }\n }\n static getDerivedStateFromError(error: Error) {\n return { error }\n }\n reset() {\n this.setState({ error: null })\n }\n componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n if (this.props.onCatch) {\n this.props.onCatch(error, errorInfo)\n }\n }\n render() {\n return this.props.children({\n error: this.state.error,\n reset: () => {\n this.reset()\n },\n })\n }\n}\n\nexport function ErrorComponent({ error }: { error: any }) {\n const [show, setShow] = React.useState(process.env.NODE_ENV !== 'production')\n\n return (\n <div style={{ padding: '.5rem', maxWidth: '100%' }}>\n <div style={{ display: 'flex', alignItems: 'center', gap: '.5rem' }}>\n <strong style={{ fontSize: '1rem' }}>Something went wrong!</strong>\n <button\n style={{\n appearance: 'none',\n fontSize: '.6em',\n border: '1px solid currentColor',\n padding: '.1rem .2rem',\n fontWeight: 'bold',\n borderRadius: '.25rem',\n }}\n onClick={() => setShow((d) => !d)}\n >\n {show ? 'Hide Error' : 'Show Error'}\n </button>\n </div>\n <div style={{ height: '.25rem' }} />\n {show ? (\n <div>\n <pre\n style={{\n fontSize: '.7em',\n border: '1px solid red',\n borderRadius: '.25rem',\n padding: '.3rem',\n color: 'red',\n overflow: 'auto',\n }}\n >\n {error.message ? <code>{error.message}</code> : null}\n </pre>\n </div>\n ) : null}\n </div>\n )\n}\n"],"mappings":";;;;;AAIA,SAAgB,cAAc,OAK3B;CACD,MAAM,iBAAiB,MAAM,kBAAkB;AAE/C,QACE,iBAAA,GAAA,kBAAA,KAAC,mBAAD;EACE,aAAa,MAAM;EACnB,SAAS,MAAM;EACf,WAAW,EAAE,OAAO,YAAY;AAC9B,OAAI,MACF,QAAO,MAAM,cAAc,gBAAgB;IACzC;IACA;IACD,CAAC;AAGJ,UAAO,MAAM;;EAEf,CAAA;;AAIN,IAAM,oBAAN,cAAgC,MAAM,UAOnC;;;eACO,EAAE,OAAO,MAAM;;CAEvB,OAAO,yBACL,OACA,OACA;EACA,MAAM,WAAW,MAAM,aAAa;AAEpC,MAAI,MAAM,SAAS,MAAM,aAAa,SACpC,QAAO;GAAE;GAAU,OAAO;GAAM;AAGlC,SAAO,EAAE,UAAU;;CAErB,OAAO,yBAAyB,OAAc;AAC5C,SAAO,EAAE,OAAO;;CAElB,QAAQ;AACN,OAAK,SAAS,EAAE,OAAO,MAAM,CAAC;;CAEhC,kBAAkB,OAAc,WAAsB;AACpD,MAAI,KAAK,MAAM,QACb,MAAK,MAAM,QAAQ,OAAO,UAAU;;CAGxC,SAAS;AACP,SAAO,KAAK,MAAM,SAAS;GACzB,OAAO,KAAK,MAAM;GAClB,aAAa;AACX,SAAK,OAAO;;GAEf,CAAC;;;AAIN,SAAgB,eAAe,EAAE,SAAyB;CACxD,MAAM,CAAC,MAAM,WAAW,MAAM,SAAA,QAAA,IAAA,aAAkC,aAAa;AAE7E,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,OAAO;GAAE,SAAS;GAAS,UAAU;GAAQ;YAAlD;GACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,OAAO;KAAE,SAAS;KAAQ,YAAY;KAAU,KAAK;KAAS;cAAnE,CACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;KAAQ,OAAO,EAAE,UAAU,QAAQ;eAAE;KAA8B,CAAA,EACnE,iBAAA,GAAA,kBAAA,KAAC,UAAD;KACE,OAAO;MACL,YAAY;MACZ,UAAU;MACV,QAAQ;MACR,SAAS;MACT,YAAY;MACZ,cAAc;MACf;KACD,eAAe,SAAS,MAAM,CAAC,EAAE;eAEhC,OAAO,eAAe;KAChB,CAAA,CACL;;GACN,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAK,OAAO,EAAE,QAAQ,UAAU,EAAI,CAAA;GACnC,OACC,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;IACE,OAAO;KACL,UAAU;KACV,QAAQ;KACR,cAAc;KACd,SAAS;KACT,OAAO;KACP,UAAU;KACX;cAEA,MAAM,UAAU,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAA,UAAO,MAAM,SAAe,CAAA,GAAG;IAC5C,CAAA,EACF,CAAA,GACJ;GACA"}
|
package/dist/cjs/Match.cjs
CHANGED
|
@@ -128,6 +128,9 @@ function OnRendered({ resetKey }) {
|
|
|
128
128
|
}
|
|
129
129
|
var MatchInner = react.memo(function MatchInnerImpl({ matchId }) {
|
|
130
130
|
const router = require_useRouter.useRouter();
|
|
131
|
+
const getMatchPromise = (match, key) => {
|
|
132
|
+
return router.getMatch(match.id)?._nonReactive[key] ?? match._nonReactive[key];
|
|
133
|
+
};
|
|
131
134
|
if (_tanstack_router_core_isServer.isServer ?? router.isServer) {
|
|
132
135
|
const match = router.stores.activeMatchStoresById.get(matchId)?.state;
|
|
133
136
|
if (!match) {
|
|
@@ -145,9 +148,9 @@ var MatchInner = react.memo(function MatchInnerImpl({ matchId }) {
|
|
|
145
148
|
const key = remountDeps ? JSON.stringify(remountDeps) : void 0;
|
|
146
149
|
const Comp = route.options.component ?? router.options.defaultComponent;
|
|
147
150
|
const out = Comp ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Comp, {}, key) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Outlet, {});
|
|
148
|
-
if (match._displayPending) throw
|
|
149
|
-
if (match._forcePending) throw
|
|
150
|
-
if (match.status === "pending") throw
|
|
151
|
+
if (match._displayPending) throw getMatchPromise(match, "displayPendingPromise");
|
|
152
|
+
if (match._forcePending) throw getMatchPromise(match, "minPendingPromise");
|
|
153
|
+
if (match.status === "pending") throw getMatchPromise(match, "loadPromise");
|
|
151
154
|
if (match.status === "notFound") {
|
|
152
155
|
if (!(0, _tanstack_router_core.isNotFound)(match.error)) {
|
|
153
156
|
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a notFound error");
|
|
@@ -160,7 +163,7 @@ var MatchInner = react.memo(function MatchInnerImpl({ matchId }) {
|
|
|
160
163
|
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a redirect error");
|
|
161
164
|
(0, _tanstack_router_core.invariant)();
|
|
162
165
|
}
|
|
163
|
-
throw
|
|
166
|
+
throw getMatchPromise(match, "loadPromise");
|
|
164
167
|
}
|
|
165
168
|
if (match.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)((route.options.errorComponent ?? router.options.defaultErrorComponent) || require_CatchBoundary.ErrorComponent, {
|
|
166
169
|
error: match.error,
|
|
@@ -202,8 +205,8 @@ var MatchInner = react.memo(function MatchInnerImpl({ matchId }) {
|
|
|
202
205
|
route.options.component,
|
|
203
206
|
router.options.defaultComponent
|
|
204
207
|
]);
|
|
205
|
-
if (match._displayPending) throw
|
|
206
|
-
if (match._forcePending) throw
|
|
208
|
+
if (match._displayPending) throw getMatchPromise(match, "displayPendingPromise");
|
|
209
|
+
if (match._forcePending) throw getMatchPromise(match, "minPendingPromise");
|
|
207
210
|
if (match.status === "pending") {
|
|
208
211
|
const pendingMinMs = route.options.pendingMinMs ?? router.options.defaultPendingMinMs;
|
|
209
212
|
if (pendingMinMs) {
|
|
@@ -219,7 +222,7 @@ var MatchInner = react.memo(function MatchInnerImpl({ matchId }) {
|
|
|
219
222
|
}
|
|
220
223
|
}
|
|
221
224
|
}
|
|
222
|
-
throw
|
|
225
|
+
throw getMatchPromise(match, "loadPromise");
|
|
223
226
|
}
|
|
224
227
|
if (match.status === "notFound") {
|
|
225
228
|
if (!(0, _tanstack_router_core.isNotFound)(match.error)) {
|
|
@@ -233,7 +236,7 @@ var MatchInner = react.memo(function MatchInnerImpl({ matchId }) {
|
|
|
233
236
|
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a redirect error");
|
|
234
237
|
(0, _tanstack_router_core.invariant)();
|
|
235
238
|
}
|
|
236
|
-
throw
|
|
239
|
+
throw getMatchPromise(match, "loadPromise");
|
|
237
240
|
}
|
|
238
241
|
if (match.status === "error") {
|
|
239
242
|
if (_tanstack_router_core_isServer.isServer ?? router.isServer) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)((route.options.errorComponent ?? router.options.defaultErrorComponent) || require_CatchBoundary.ErrorComponent, {
|
package/dist/cjs/Match.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Match.cjs","names":[],"sources":["../../src/Match.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport {\n createControlledPromise,\n getLocationChangeInfo,\n invariant,\n isNotFound,\n isRedirect,\n rootRouteId,\n} from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { CatchNotFound } from './not-found'\nimport { matchContext } from './matchContext'\nimport { SafeFragment } from './SafeFragment'\nimport { renderRouteNotFound } from './renderRouteNotFound'\nimport { ScrollRestoration } from './scroll-restoration'\nimport { ClientOnly } from './ClientOnly'\nimport { useLayoutEffect } from './utils'\nimport type { AnyRoute, RootRouteOptions } from '@tanstack/router-core'\n\nexport const Match = React.memo(function MatchImpl({\n matchId,\n}: {\n matchId: string\n}) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={router.stores.loadedAt.state}\n matchState={{\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId,\n }}\n />\n )\n }\n\n // Subscribe directly to the match store from the pool.\n // The matchId prop is stable for this component's lifetime (set by Outlet),\n // and reconcileMatchPool reuses stores for the same matchId.\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const resetKey = useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const matchState = React.useMemo(() => {\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return {\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId: parentRouteId as string | undefined,\n } satisfies MatchViewState\n }, [match._displayPending, match.routeId, match.ssr, router.routesById])\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={resetKey}\n matchState={matchState}\n />\n )\n})\n\ntype MatchViewState = {\n routeId: string\n ssr: boolean | 'data-only' | undefined\n _displayPending: boolean | undefined\n parentRouteId: string | undefined\n}\n\nfunction MatchView({\n router,\n matchId,\n resetKey,\n matchState,\n}: {\n router: ReturnType<typeof useRouter>\n matchId: string\n resetKey: number\n matchState: MatchViewState\n}) {\n const route: AnyRoute = router.routesById[matchState.routeId]\n\n const PendingComponent =\n route.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n const routeErrorComponent =\n route.options.errorComponent ?? router.options.defaultErrorComponent\n\n const routeOnCatch = route.options.onCatch ?? router.options.defaultOnCatch\n\n const routeNotFoundComponent = route.isRoot\n ? // If it's the root route, use the globalNotFound option, with fallback to the notFoundRoute's component\n (route.options.notFoundComponent ??\n router.options.notFoundRoute?.options.component)\n : route.options.notFoundComponent\n\n const resolvedNoSsr =\n matchState.ssr === false || matchState.ssr === 'data-only'\n const ResolvedSuspenseBoundary =\n // If we're on the root route, allow forcefully wrapping in suspense\n (!route.isRoot || route.options.wrapInSuspense || resolvedNoSsr) &&\n (route.options.wrapInSuspense ??\n PendingComponent ??\n ((route.options.errorComponent as any)?.preload || resolvedNoSsr))\n ? React.Suspense\n : SafeFragment\n\n const ResolvedCatchBoundary = routeErrorComponent\n ? CatchBoundary\n : SafeFragment\n\n const ResolvedNotFoundBoundary = routeNotFoundComponent\n ? CatchNotFound\n : SafeFragment\n\n const ShellComponent = route.isRoot\n ? ((route.options as RootRouteOptions).shellComponent ?? SafeFragment)\n : SafeFragment\n return (\n <ShellComponent>\n <matchContext.Provider value={matchId}>\n <ResolvedSuspenseBoundary fallback={pendingElement}>\n <ResolvedCatchBoundary\n getResetKey={() => resetKey}\n errorComponent={routeErrorComponent || ErrorComponent}\n onCatch={(error, errorInfo) => {\n // Forward not found errors (we don't want to show the error component for these)\n if (isNotFound(error)) {\n error.routeId ??= matchState.routeId as any\n throw error\n }\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`Warning: Error in route match: ${matchId}`)\n }\n routeOnCatch?.(error, errorInfo)\n }}\n >\n <ResolvedNotFoundBoundary\n fallback={(error) => {\n error.routeId ??= matchState.routeId as any\n\n // If the current not found handler doesn't exist or it has a\n // route ID which doesn't match the current route, rethrow the error\n if (\n !routeNotFoundComponent ||\n (error.routeId && error.routeId !== matchState.routeId) ||\n (!error.routeId && !route.isRoot)\n )\n throw error\n\n return React.createElement(routeNotFoundComponent, error as any)\n }}\n >\n {resolvedNoSsr || matchState._displayPending ? (\n <ClientOnly fallback={pendingElement}>\n <MatchInner matchId={matchId} />\n </ClientOnly>\n ) : (\n <MatchInner matchId={matchId} />\n )}\n </ResolvedNotFoundBoundary>\n </ResolvedCatchBoundary>\n </ResolvedSuspenseBoundary>\n </matchContext.Provider>\n {matchState.parentRouteId === rootRouteId ? (\n <>\n <OnRendered resetKey={resetKey} />\n {router.options.scrollRestoration && (isServer ?? router.isServer) ? (\n <ScrollRestoration />\n ) : null}\n </>\n ) : null}\n </ShellComponent>\n )\n}\n\n// On Rendered can't happen above the root layout because it needs to run after\n// the route subtree has committed below the root layout. Keeping it here lets\n// us fire onRendered even after a hydration mismatch above the root layout\n// (like bad head/link tags, which is common).\nfunction OnRendered({ resetKey }: { resetKey: number }) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n return null\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const prevHrefRef = React.useRef<string | undefined>(undefined)\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useLayoutEffect(() => {\n const currentHref = router.latestLocation.href\n\n if (\n prevHrefRef.current === undefined ||\n prevHrefRef.current !== currentHref\n ) {\n router.emit({\n type: 'onRendered',\n ...getLocationChangeInfo(\n router.stores.location.state,\n router.stores.resolvedLocation.state,\n ),\n })\n prevHrefRef.current = currentHref\n }\n }, [router.latestLocation.state.__TSR_key, resetKey, router])\n\n return null\n}\n\nexport const MatchInner = React.memo(function MatchInnerImpl({\n matchId,\n}: {\n matchId: string\n}): any {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n const key = remountDeps ? JSON.stringify(remountDeps) : undefined\n const Comp = route.options.component ?? router.options.defaultComponent\n const out = Comp ? <Comp key={key} /> : <Outlet />\n\n if (match._displayPending) {\n throw router.getMatch(match.id)?._nonReactive.displayPendingPromise\n }\n\n if (match._forcePending) {\n throw router.getMatch(match.id)?._nonReactive.minPendingPromise\n }\n\n if (match.status === 'pending') {\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'error') {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n return out\n }\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const key = React.useMemo(() => {\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n return remountDeps ? JSON.stringify(remountDeps) : undefined\n }, [\n routeId,\n match.loaderDeps,\n match._strictParams,\n match._strictSearch,\n router.options.defaultRemountDeps,\n router.routesById,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const out = React.useMemo(() => {\n const Comp = route.options.component ?? router.options.defaultComponent\n if (Comp) {\n return <Comp key={key} />\n }\n return <Outlet />\n }, [key, route.options.component, router.options.defaultComponent])\n\n if (match._displayPending) {\n throw router.getMatch(match.id)?._nonReactive.displayPendingPromise\n }\n\n if (match._forcePending) {\n throw router.getMatch(match.id)?._nonReactive.minPendingPromise\n }\n\n // see also hydrate() in packages/router-core/src/ssr/ssr-client.ts\n if (match.status === 'pending') {\n // We're pending, and if we have a minPendingMs, we need to wait for it\n const pendingMinMs =\n route.options.pendingMinMs ?? router.options.defaultPendingMinMs\n if (pendingMinMs) {\n const routerMatch = router.getMatch(match.id)\n if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {\n // Create a promise that will resolve after the minPendingMs\n if (!(isServer ?? router.isServer)) {\n const minPendingPromise = createControlledPromise<void>()\n\n routerMatch._nonReactive.minPendingPromise = minPendingPromise\n\n setTimeout(() => {\n minPendingPromise.resolve()\n // We've handled the minPendingPromise, so we can delete it\n routerMatch._nonReactive.minPendingPromise = undefined\n }, pendingMinMs)\n }\n }\n }\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n // Redirects should be handled by the router transition. If we happen to\n // encounter a redirect here, it's a bug. Let's warn, but render nothing.\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n\n // warning(\n // false,\n // 'Tried to render a redirected route match! This is a weird circumstance, please file an issue!',\n // )\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'error') {\n // If we're on the server, we need to use React's new and super\n // wonky api for throwing errors from a server side render inside\n // of a suspense boundary. This is the only way to get\n // renderToPipeableStream to not hang indefinitely.\n // We'll serialize the error and rethrow it on the client.\n if (isServer ?? router.isServer) {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n throw match.error\n }\n\n return out\n})\n\n/**\n * Render the next child match in the route tree. Typically used inside\n * a route component to render nested routes.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/outletComponent\n */\nexport const Outlet = React.memo(function OutletImpl() {\n const router = useRouter()\n const matchId = React.useContext(matchContext)\n\n let routeId: string | undefined\n let parentGlobalNotFound = false\n let childMatchId: string | undefined\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state\n const parentIndex = matchId\n ? matches.findIndex((match) => match.id === matchId)\n : -1\n const parentMatch = parentIndex >= 0 ? matches[parentIndex] : undefined\n routeId = parentMatch?.routeId as string | undefined\n parentGlobalNotFound = parentMatch?.globalNotFound ?? false\n childMatchId =\n parentIndex >= 0 ? (matches[parentIndex + 1]?.id as string) : undefined\n } else {\n // Subscribe directly to the match store from the pool instead of\n // the two-level byId → matchStore pattern.\n const parentMatchStore = matchId\n ? router.stores.activeMatchStoresById.get(matchId)\n : undefined\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n ;[routeId, parentGlobalNotFound] = useStore(parentMatchStore, (match) => [\n match?.routeId as string | undefined,\n match?.globalNotFound ?? false,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n childMatchId = useStore(router.stores.matchesId, (ids) => {\n const index = ids.findIndex((id) => id === matchId)\n return ids[index + 1]\n })\n }\n\n const route = routeId ? router.routesById[routeId] : undefined\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n if (parentGlobalNotFound) {\n if (!route) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n 'Invariant failed: Could not resolve route for Outlet render',\n )\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, undefined)\n }\n\n if (!childMatchId) {\n return null\n }\n\n const nextMatch = <Match matchId={childMatchId} />\n\n if (routeId === rootRouteId) {\n return (\n <React.Suspense fallback={pendingElement}>{nextMatch}</React.Suspense>\n )\n }\n\n return nextMatch\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Match.cjs","names":[],"sources":["../../src/Match.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport {\n createControlledPromise,\n getLocationChangeInfo,\n invariant,\n isNotFound,\n isRedirect,\n rootRouteId,\n} from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { CatchNotFound } from './not-found'\nimport { matchContext } from './matchContext'\nimport { SafeFragment } from './SafeFragment'\nimport { renderRouteNotFound } from './renderRouteNotFound'\nimport { ScrollRestoration } from './scroll-restoration'\nimport { ClientOnly } from './ClientOnly'\nimport { useLayoutEffect } from './utils'\nimport type { AnyRoute, RootRouteOptions } from '@tanstack/router-core'\n\nexport const Match = React.memo(function MatchImpl({\n matchId,\n}: {\n matchId: string\n}) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={router.stores.loadedAt.state}\n matchState={{\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId,\n }}\n />\n )\n }\n\n // Subscribe directly to the match store from the pool.\n // The matchId prop is stable for this component's lifetime (set by Outlet),\n // and reconcileMatchPool reuses stores for the same matchId.\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const resetKey = useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const matchState = React.useMemo(() => {\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return {\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId: parentRouteId as string | undefined,\n } satisfies MatchViewState\n }, [match._displayPending, match.routeId, match.ssr, router.routesById])\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={resetKey}\n matchState={matchState}\n />\n )\n})\n\ntype MatchViewState = {\n routeId: string\n ssr: boolean | 'data-only' | undefined\n _displayPending: boolean | undefined\n parentRouteId: string | undefined\n}\n\nfunction MatchView({\n router,\n matchId,\n resetKey,\n matchState,\n}: {\n router: ReturnType<typeof useRouter>\n matchId: string\n resetKey: number\n matchState: MatchViewState\n}) {\n const route: AnyRoute = router.routesById[matchState.routeId]\n\n const PendingComponent =\n route.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n const routeErrorComponent =\n route.options.errorComponent ?? router.options.defaultErrorComponent\n\n const routeOnCatch = route.options.onCatch ?? router.options.defaultOnCatch\n\n const routeNotFoundComponent = route.isRoot\n ? // If it's the root route, use the globalNotFound option, with fallback to the notFoundRoute's component\n (route.options.notFoundComponent ??\n router.options.notFoundRoute?.options.component)\n : route.options.notFoundComponent\n\n const resolvedNoSsr =\n matchState.ssr === false || matchState.ssr === 'data-only'\n const ResolvedSuspenseBoundary =\n // If we're on the root route, allow forcefully wrapping in suspense\n (!route.isRoot || route.options.wrapInSuspense || resolvedNoSsr) &&\n (route.options.wrapInSuspense ??\n PendingComponent ??\n ((route.options.errorComponent as any)?.preload || resolvedNoSsr))\n ? React.Suspense\n : SafeFragment\n\n const ResolvedCatchBoundary = routeErrorComponent\n ? CatchBoundary\n : SafeFragment\n\n const ResolvedNotFoundBoundary = routeNotFoundComponent\n ? CatchNotFound\n : SafeFragment\n\n const ShellComponent = route.isRoot\n ? ((route.options as RootRouteOptions).shellComponent ?? SafeFragment)\n : SafeFragment\n return (\n <ShellComponent>\n <matchContext.Provider value={matchId}>\n <ResolvedSuspenseBoundary fallback={pendingElement}>\n <ResolvedCatchBoundary\n getResetKey={() => resetKey}\n errorComponent={routeErrorComponent || ErrorComponent}\n onCatch={(error, errorInfo) => {\n // Forward not found errors (we don't want to show the error component for these)\n if (isNotFound(error)) {\n error.routeId ??= matchState.routeId as any\n throw error\n }\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`Warning: Error in route match: ${matchId}`)\n }\n routeOnCatch?.(error, errorInfo)\n }}\n >\n <ResolvedNotFoundBoundary\n fallback={(error) => {\n error.routeId ??= matchState.routeId as any\n\n // If the current not found handler doesn't exist or it has a\n // route ID which doesn't match the current route, rethrow the error\n if (\n !routeNotFoundComponent ||\n (error.routeId && error.routeId !== matchState.routeId) ||\n (!error.routeId && !route.isRoot)\n )\n throw error\n\n return React.createElement(routeNotFoundComponent, error as any)\n }}\n >\n {resolvedNoSsr || matchState._displayPending ? (\n <ClientOnly fallback={pendingElement}>\n <MatchInner matchId={matchId} />\n </ClientOnly>\n ) : (\n <MatchInner matchId={matchId} />\n )}\n </ResolvedNotFoundBoundary>\n </ResolvedCatchBoundary>\n </ResolvedSuspenseBoundary>\n </matchContext.Provider>\n {matchState.parentRouteId === rootRouteId ? (\n <>\n <OnRendered resetKey={resetKey} />\n {router.options.scrollRestoration && (isServer ?? router.isServer) ? (\n <ScrollRestoration />\n ) : null}\n </>\n ) : null}\n </ShellComponent>\n )\n}\n\n// On Rendered can't happen above the root layout because it needs to run after\n// the route subtree has committed below the root layout. Keeping it here lets\n// us fire onRendered even after a hydration mismatch above the root layout\n// (like bad head/link tags, which is common).\nfunction OnRendered({ resetKey }: { resetKey: number }) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n return null\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const prevHrefRef = React.useRef<string | undefined>(undefined)\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useLayoutEffect(() => {\n const currentHref = router.latestLocation.href\n\n if (\n prevHrefRef.current === undefined ||\n prevHrefRef.current !== currentHref\n ) {\n router.emit({\n type: 'onRendered',\n ...getLocationChangeInfo(\n router.stores.location.state,\n router.stores.resolvedLocation.state,\n ),\n })\n prevHrefRef.current = currentHref\n }\n }, [router.latestLocation.state.__TSR_key, resetKey, router])\n\n return null\n}\n\nexport const MatchInner = React.memo(function MatchInnerImpl({\n matchId,\n}: {\n matchId: string\n}): any {\n const router = useRouter()\n\n const getMatchPromise = (\n match: {\n id: string\n _nonReactive: {\n displayPendingPromise?: Promise<void>\n minPendingPromise?: Promise<void>\n loadPromise?: Promise<void>\n }\n },\n key: 'displayPendingPromise' | 'minPendingPromise' | 'loadPromise',\n ) => {\n return (\n router.getMatch(match.id)?._nonReactive[key] ?? match._nonReactive[key]\n )\n }\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n const key = remountDeps ? JSON.stringify(remountDeps) : undefined\n const Comp = route.options.component ?? router.options.defaultComponent\n const out = Comp ? <Comp key={key} /> : <Outlet />\n\n if (match._displayPending) {\n throw getMatchPromise(match, 'displayPendingPromise')\n }\n\n if (match._forcePending) {\n throw getMatchPromise(match, 'minPendingPromise')\n }\n\n if (match.status === 'pending') {\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'error') {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n return out\n }\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const key = React.useMemo(() => {\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n return remountDeps ? JSON.stringify(remountDeps) : undefined\n }, [\n routeId,\n match.loaderDeps,\n match._strictParams,\n match._strictSearch,\n router.options.defaultRemountDeps,\n router.routesById,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const out = React.useMemo(() => {\n const Comp = route.options.component ?? router.options.defaultComponent\n if (Comp) {\n return <Comp key={key} />\n }\n return <Outlet />\n }, [key, route.options.component, router.options.defaultComponent])\n\n if (match._displayPending) {\n throw getMatchPromise(match, 'displayPendingPromise')\n }\n\n if (match._forcePending) {\n throw getMatchPromise(match, 'minPendingPromise')\n }\n\n // see also hydrate() in packages/router-core/src/ssr/ssr-client.ts\n if (match.status === 'pending') {\n // We're pending, and if we have a minPendingMs, we need to wait for it\n const pendingMinMs =\n route.options.pendingMinMs ?? router.options.defaultPendingMinMs\n if (pendingMinMs) {\n const routerMatch = router.getMatch(match.id)\n if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {\n // Create a promise that will resolve after the minPendingMs\n if (!(isServer ?? router.isServer)) {\n const minPendingPromise = createControlledPromise<void>()\n\n routerMatch._nonReactive.minPendingPromise = minPendingPromise\n\n setTimeout(() => {\n minPendingPromise.resolve()\n // We've handled the minPendingPromise, so we can delete it\n routerMatch._nonReactive.minPendingPromise = undefined\n }, pendingMinMs)\n }\n }\n }\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n // A match can be observed as redirected during an in-flight transition,\n // especially when pending UI is already rendering. Suspend on the match's\n // load promise so React can abandon this stale render and continue the\n // redirect transition.\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'error') {\n // If we're on the server, we need to use React's new and super\n // wonky api for throwing errors from a server side render inside\n // of a suspense boundary. This is the only way to get\n // renderToPipeableStream to not hang indefinitely.\n // We'll serialize the error and rethrow it on the client.\n if (isServer ?? router.isServer) {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n throw match.error\n }\n\n return out\n})\n\n/**\n * Render the next child match in the route tree. Typically used inside\n * a route component to render nested routes.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/outletComponent\n */\nexport const Outlet = React.memo(function OutletImpl() {\n const router = useRouter()\n const matchId = React.useContext(matchContext)\n\n let routeId: string | undefined\n let parentGlobalNotFound = false\n let childMatchId: string | undefined\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state\n const parentIndex = matchId\n ? matches.findIndex((match) => match.id === matchId)\n : -1\n const parentMatch = parentIndex >= 0 ? matches[parentIndex] : undefined\n routeId = parentMatch?.routeId as string | undefined\n parentGlobalNotFound = parentMatch?.globalNotFound ?? false\n childMatchId =\n parentIndex >= 0 ? (matches[parentIndex + 1]?.id as string) : undefined\n } else {\n // Subscribe directly to the match store from the pool instead of\n // the two-level byId → matchStore pattern.\n const parentMatchStore = matchId\n ? router.stores.activeMatchStoresById.get(matchId)\n : undefined\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n ;[routeId, parentGlobalNotFound] = useStore(parentMatchStore, (match) => [\n match?.routeId as string | undefined,\n match?.globalNotFound ?? false,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n childMatchId = useStore(router.stores.matchesId, (ids) => {\n const index = ids.findIndex((id) => id === matchId)\n return ids[index + 1]\n })\n }\n\n const route = routeId ? router.routesById[routeId] : undefined\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n if (parentGlobalNotFound) {\n if (!route) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n 'Invariant failed: Could not resolve route for Outlet render',\n )\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, undefined)\n }\n\n if (!childMatchId) {\n return null\n }\n\n const nextMatch = <Match matchId={childMatchId} />\n\n if (routeId === rootRouteId) {\n return (\n <React.Suspense fallback={pendingElement}>{nextMatch}</React.Suspense>\n )\n }\n\n return nextMatch\n})\n"],"mappings":"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"}
|
package/dist/cjs/Matches.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Matches.cjs","names":[],"sources":["../../src/Matches.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { replaceEqualDeep, rootRouteId } from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { Transitioner } from './Transitioner'\nimport { matchContext } from './matchContext'\nimport { Match } from './Match'\nimport { SafeFragment } from './SafeFragment'\nimport type {\n StructuralSharingOption,\n ValidateSelected,\n} from './structuralSharing'\nimport type {\n AnyRoute,\n AnyRouter,\n DeepPartial,\n Expand,\n MakeOptionalPathParams,\n MakeOptionalSearchParams,\n MakeRouteMatchUnion,\n MaskOptions,\n MatchRouteOptions,\n NoInfer,\n RegisteredRouter,\n ResolveRelativePath,\n ResolveRoute,\n RouteByPath,\n ToSubOptionsProps,\n} from '@tanstack/router-core'\n\ndeclare module '@tanstack/router-core' {\n export interface RouteMatchExtensions {\n meta?: Array<React.JSX.IntrinsicElements['meta'] | undefined>\n links?: Array<React.JSX.IntrinsicElements['link'] | undefined>\n scripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n styles?: Array<React.JSX.IntrinsicElements['style'] | undefined>\n headScripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n }\n}\n\n/**\n * Internal component that renders the router's active match tree with\n * suspense, error, and not-found boundaries. Rendered by `RouterProvider`.\n */\nexport function Matches() {\n const router = useRouter()\n const rootRoute: AnyRoute = router.routesById[rootRouteId]\n\n const PendingComponent =\n rootRoute.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n // Do not render a root Suspense during SSR or hydrating from SSR\n const ResolvedSuspense =\n (isServer ?? router.isServer) ||\n (typeof document !== 'undefined' && router.ssr)\n ? SafeFragment\n : React.Suspense\n\n const inner = (\n <ResolvedSuspense fallback={pendingElement}>\n {!(isServer ?? router.isServer) && <Transitioner />}\n <MatchesInner />\n </ResolvedSuspense>\n )\n\n return router.options.InnerWrap ? (\n <router.options.InnerWrap>{inner}</router.options.InnerWrap>\n ) : (\n inner\n )\n}\n\nfunction MatchesInner() {\n const router = useRouter()\n const _isServer = isServer ?? router.isServer\n const matchId = _isServer\n ? router.stores.firstMatchId.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.firstMatchId, (id) => id)\n const resetKey = _isServer\n ? router.stores.loadedAt.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n\n const matchComponent = matchId ? <Match matchId={matchId} /> : null\n\n return (\n <matchContext.Provider value={matchId}>\n {router.options.disableGlobalCatchBoundary ? (\n matchComponent\n ) : (\n <CatchBoundary\n getResetKey={() => resetKey}\n errorComponent={ErrorComponent}\n onCatch={\n process.env.NODE_ENV !== 'production'\n ? (error) => {\n console.warn(\n `Warning: The following error wasn't caught by any route! At the very least, consider setting an 'errorComponent' in your RootRoute!`,\n )\n console.warn(`Warning: ${error.message || error.toString()}`)\n }\n : undefined\n }\n >\n {matchComponent}\n </CatchBoundary>\n )}\n </matchContext.Provider>\n )\n}\n\nexport type UseMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = ToSubOptionsProps<TRouter, TFrom, TTo> &\n DeepPartial<MakeOptionalSearchParams<TRouter, TFrom, TTo>> &\n DeepPartial<MakeOptionalPathParams<TRouter, TFrom, TTo>> &\n MaskOptions<TRouter, TMaskFrom, TMaskTo> &\n MatchRouteOptions\n\n/**\n * Create a matcher function for testing locations against route definitions.\n *\n * The returned function accepts standard navigation options (`to`, `params`,\n * `search`, etc.) and returns either `false` (no match) or the matched params\n * object when the route matches the current or pending location.\n *\n * Useful for conditional rendering and active UI states.\n *\n * @returns A `matchRoute(options)` function that returns `false` or params.\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchRouteHook\n */\nexport function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {\n const router = useRouter()\n\n if (!(isServer ?? router.isServer)) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.matchRouteReactivity, (d) => d)\n }\n\n return React.useCallback(\n <\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n >(\n opts: UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>,\n ):\n | false\n | Expand<ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']> => {\n const { pending, caseSensitive, fuzzy, includeSearch, ...rest } = opts\n\n return router.matchRoute(rest as any, {\n pending,\n caseSensitive,\n fuzzy,\n includeSearch,\n })\n },\n [router],\n )\n}\n\nexport type MakeMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {\n // 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\n children?:\n | ((\n params?: RouteByPath<\n TRouter['routeTree'],\n ResolveRelativePath<TFrom, NoInfer<TTo>>\n >['types']['allParams'],\n ) => React.ReactNode)\n | React.ReactNode\n}\n\n/**\n * Component that conditionally renders its children based on whether a route\n * matches the provided `from`/`to` options. If `children` is a function, it\n * receives the matched params object.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/matchRouteComponent\n */\nexport function MatchRoute<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n>(props: MakeMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): any {\n const matchRoute = useMatchRoute()\n const params = matchRoute(props as any) as boolean\n\n if (typeof props.children === 'function') {\n return (props.children as any)(params)\n }\n\n return params ? props.children : null\n}\n\nexport interface UseMatchesBaseOptions<\n TRouter extends AnyRouter,\n TSelected,\n TStructuralSharing,\n> {\n select?: (\n matches: Array<MakeRouteMatchUnion<TRouter>>,\n ) => ValidateSelected<TRouter, TSelected, TStructuralSharing>\n}\n\nexport type UseMatchesResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected ? Array<MakeRouteMatchUnion<TRouter>> : TSelected\n\nexport function useMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const router = useRouter<TRouter>()\n const previousResult =\n React.useRef<ValidateSelected<TRouter, TSelected, TStructuralSharing>>(\n undefined,\n )\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state as Array<\n MakeRouteMatchUnion<TRouter>\n >\n return (opts?.select ? opts.select(matches) : matches) as UseMatchesResult<\n TRouter,\n TSelected\n >\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useStore(router.stores.activeMatchesSnapshot, (matches) => {\n const selected = opts?.select\n ? opts.select(matches as Array<MakeRouteMatchUnion<TRouter>>)\n : (matches as any)\n\n if (opts?.structuralSharing ?? router.options.defaultStructuralSharing) {\n const shared = replaceEqualDeep(previousResult.current, selected)\n previousResult.current = shared\n return shared\n }\n\n return selected\n }) as UseMatchesResult<TRouter, TSelected>\n}\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @returns The array of matches (or the selected value).\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\nexport function useParentMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n 0,\n matches.findIndex((d) => d.id === contextMatchId),\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n\n/**\n * Read the array of active route matches that are children of the current\n * match (or selected parent) in the match tree.\n */\nexport function useChildMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n matches.findIndex((d) => d.id === contextMatchId) + 1,\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Matches.cjs","names":[],"sources":["../../src/Matches.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { replaceEqualDeep, rootRouteId } from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { Transitioner } from './Transitioner'\nimport { matchContext } from './matchContext'\nimport { Match } from './Match'\nimport { SafeFragment } from './SafeFragment'\nimport type {\n StructuralSharingOption,\n ValidateSelected,\n} from './structuralSharing'\nimport type {\n AnyRoute,\n AnyRouter,\n DeepPartial,\n Expand,\n MakeOptionalPathParams,\n MakeOptionalSearchParams,\n MakeRouteMatchUnion,\n MaskOptions,\n MatchRouteOptions,\n RegisteredRouter,\n ResolveRoute,\n ToSubOptionsProps,\n} from '@tanstack/router-core'\n\ndeclare module '@tanstack/router-core' {\n export interface RouteMatchExtensions {\n meta?: Array<React.JSX.IntrinsicElements['meta'] | undefined>\n links?: Array<React.JSX.IntrinsicElements['link'] | undefined>\n scripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n styles?: Array<React.JSX.IntrinsicElements['style'] | undefined>\n headScripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n }\n}\n\n/**\n * Internal component that renders the router's active match tree with\n * suspense, error, and not-found boundaries. Rendered by `RouterProvider`.\n */\nexport function Matches() {\n const router = useRouter()\n const rootRoute: AnyRoute = router.routesById[rootRouteId]\n\n const PendingComponent =\n rootRoute.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n // Do not render a root Suspense during SSR or hydrating from SSR\n const ResolvedSuspense =\n (isServer ?? router.isServer) ||\n (typeof document !== 'undefined' && router.ssr)\n ? SafeFragment\n : React.Suspense\n\n const inner = (\n <ResolvedSuspense fallback={pendingElement}>\n {!(isServer ?? router.isServer) && <Transitioner />}\n <MatchesInner />\n </ResolvedSuspense>\n )\n\n return router.options.InnerWrap ? (\n <router.options.InnerWrap>{inner}</router.options.InnerWrap>\n ) : (\n inner\n )\n}\n\nfunction MatchesInner() {\n const router = useRouter()\n const _isServer = isServer ?? router.isServer\n const matchId = _isServer\n ? router.stores.firstMatchId.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.firstMatchId, (id) => id)\n const resetKey = _isServer\n ? router.stores.loadedAt.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n\n const matchComponent = matchId ? <Match matchId={matchId} /> : null\n\n return (\n <matchContext.Provider value={matchId}>\n {router.options.disableGlobalCatchBoundary ? (\n matchComponent\n ) : (\n <CatchBoundary\n getResetKey={() => resetKey}\n errorComponent={ErrorComponent}\n onCatch={\n process.env.NODE_ENV !== 'production'\n ? (error) => {\n console.warn(\n `Warning: The following error wasn't caught by any route! At the very least, consider setting an 'errorComponent' in your RootRoute!`,\n )\n console.warn(`Warning: ${error.message || error.toString()}`)\n }\n : undefined\n }\n >\n {matchComponent}\n </CatchBoundary>\n )}\n </matchContext.Provider>\n )\n}\n\nexport type UseMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = ToSubOptionsProps<TRouter, TFrom, TTo> &\n DeepPartial<MakeOptionalSearchParams<TRouter, TFrom, TTo>> &\n DeepPartial<MakeOptionalPathParams<TRouter, TFrom, TTo>> &\n MaskOptions<TRouter, TMaskFrom, TMaskTo> &\n MatchRouteOptions\n\n/**\n * Create a matcher function for testing locations against route definitions.\n *\n * The returned function accepts standard navigation options (`to`, `params`,\n * `search`, etc.) and returns either `false` (no match) or the matched params\n * object when the route matches the current or pending location.\n *\n * Useful for conditional rendering and active UI states.\n *\n * @returns A `matchRoute(options)` function that returns `false` or params.\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchRouteHook\n */\nexport function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {\n const router = useRouter()\n\n if (!(isServer ?? router.isServer)) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.matchRouteReactivity, (d) => d)\n }\n\n return React.useCallback(\n <\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n >(\n opts: UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>,\n ):\n | false\n | Expand<ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']> => {\n const { pending, caseSensitive, fuzzy, includeSearch, ...rest } = opts\n\n return router.matchRoute(rest as any, {\n pending,\n caseSensitive,\n fuzzy,\n includeSearch,\n })\n },\n [router],\n )\n}\n\nexport type MakeMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {\n // 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\n children?:\n | ((\n params?: Expand<\n ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']\n >,\n ) => React.ReactNode)\n | React.ReactNode\n}\n\n/**\n * Component that conditionally renders its children based on whether a route\n * matches the provided `from`/`to` options. If `children` is a function, it\n * receives the matched params object.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/matchRouteComponent\n */\nexport function MatchRoute<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n>(props: MakeMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): any {\n const matchRoute = useMatchRoute()\n const params = matchRoute(props as any) as boolean\n\n if (typeof props.children === 'function') {\n return (props.children as any)(params)\n }\n\n return params ? props.children : null\n}\n\nexport interface UseMatchesBaseOptions<\n TRouter extends AnyRouter,\n TSelected,\n TStructuralSharing,\n> {\n select?: (\n matches: Array<MakeRouteMatchUnion<TRouter>>,\n ) => ValidateSelected<TRouter, TSelected, TStructuralSharing>\n}\n\nexport type UseMatchesResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected ? Array<MakeRouteMatchUnion<TRouter>> : TSelected\n\nexport function useMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const router = useRouter<TRouter>()\n const previousResult =\n React.useRef<ValidateSelected<TRouter, TSelected, TStructuralSharing>>(\n undefined,\n )\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state as Array<\n MakeRouteMatchUnion<TRouter>\n >\n return (opts?.select ? opts.select(matches) : matches) as UseMatchesResult<\n TRouter,\n TSelected\n >\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useStore(router.stores.activeMatchesSnapshot, (matches) => {\n const selected = opts?.select\n ? opts.select(matches as Array<MakeRouteMatchUnion<TRouter>>)\n : (matches as any)\n\n if (opts?.structuralSharing ?? router.options.defaultStructuralSharing) {\n const shared = replaceEqualDeep(previousResult.current, selected)\n previousResult.current = shared\n return shared\n }\n\n return selected\n }) as UseMatchesResult<TRouter, TSelected>\n}\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @returns The array of matches (or the selected value).\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\nexport function useParentMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n 0,\n matches.findIndex((d) => d.id === contextMatchId),\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n\n/**\n * Read the array of active route matches that are children of the current\n * match (or selected parent) in the match tree.\n */\nexport function useChildMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n matches.findIndex((d) => d.id === contextMatchId) + 1,\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n"],"mappings":"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"}
|
package/dist/cjs/Matches.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { StructuralSharingOption, ValidateSelected } from './structuralSharing.cjs';
|
|
2
|
-
import { AnyRouter, DeepPartial, Expand, MakeOptionalPathParams, MakeOptionalSearchParams, MakeRouteMatchUnion, MaskOptions, MatchRouteOptions,
|
|
2
|
+
import { AnyRouter, DeepPartial, Expand, MakeOptionalPathParams, MakeOptionalSearchParams, MakeRouteMatchUnion, MaskOptions, MatchRouteOptions, RegisteredRouter, ResolveRoute, ToSubOptionsProps } from '@tanstack/router-core';
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
declare module '@tanstack/router-core' {
|
|
5
5
|
interface RouteMatchExtensions {
|
|
@@ -30,7 +30,7 @@ export type UseMatchRouteOptions<TRouter extends AnyRouter = RegisteredRouter, T
|
|
|
30
30
|
*/
|
|
31
31
|
export declare function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>(): <const TFrom extends string = string, const TTo extends string | undefined = undefined, const TMaskFrom extends string = TFrom, const TMaskTo extends string = "">(opts: UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>) => false | Expand<ResolveRoute<TRouter, TFrom, TTo>["types"]["allParams"]>;
|
|
32
32
|
export type MakeMatchRouteOptions<TRouter extends AnyRouter = RegisteredRouter, TFrom extends string = string, TTo extends string | undefined = undefined, TMaskFrom extends string = TFrom, TMaskTo extends string = ''> = UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {
|
|
33
|
-
children?: ((params?:
|
|
33
|
+
children?: ((params?: Expand<ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']>) => React.ReactNode) | React.ReactNode;
|
|
34
34
|
};
|
|
35
35
|
/**
|
|
36
36
|
* Component that conditionally renders its children based on whether a route
|
|
@@ -20,8 +20,13 @@ var CatchBoundaryImpl = class extends React$1.Component {
|
|
|
20
20
|
super(..._args);
|
|
21
21
|
this.state = { error: null };
|
|
22
22
|
}
|
|
23
|
-
static getDerivedStateFromProps(props) {
|
|
24
|
-
|
|
23
|
+
static getDerivedStateFromProps(props, state) {
|
|
24
|
+
const resetKey = props.getResetKey();
|
|
25
|
+
if (state.error && state.resetKey !== resetKey) return {
|
|
26
|
+
resetKey,
|
|
27
|
+
error: null
|
|
28
|
+
};
|
|
29
|
+
return { resetKey };
|
|
25
30
|
}
|
|
26
31
|
static getDerivedStateFromError(error) {
|
|
27
32
|
return { error };
|
|
@@ -29,15 +34,12 @@ var CatchBoundaryImpl = class extends React$1.Component {
|
|
|
29
34
|
reset() {
|
|
30
35
|
this.setState({ error: null });
|
|
31
36
|
}
|
|
32
|
-
componentDidUpdate(prevProps, prevState) {
|
|
33
|
-
if (prevState.error && prevState.resetKey !== this.state.resetKey) this.reset();
|
|
34
|
-
}
|
|
35
37
|
componentDidCatch(error, errorInfo) {
|
|
36
38
|
if (this.props.onCatch) this.props.onCatch(error, errorInfo);
|
|
37
39
|
}
|
|
38
40
|
render() {
|
|
39
41
|
return this.props.children({
|
|
40
|
-
error: this.state.
|
|
42
|
+
error: this.state.error,
|
|
41
43
|
reset: () => {
|
|
42
44
|
this.reset();
|
|
43
45
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CatchBoundary.js","names":[],"sources":["../../src/CatchBoundary.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { ErrorRouteComponent } from './route'\nimport type { ErrorInfo } from 'react'\n\nexport function CatchBoundary(props: {\n getResetKey: () => number | string\n children: React.ReactNode\n errorComponent?: ErrorRouteComponent\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}) {\n const errorComponent = props.errorComponent ?? ErrorComponent\n\n return (\n <CatchBoundaryImpl\n getResetKey={props.getResetKey}\n onCatch={props.onCatch}\n children={({ error, reset }) => {\n if (error) {\n return React.createElement(errorComponent, {\n error,\n reset,\n })\n }\n\n return props.children\n }}\n />\n )\n}\n\nclass CatchBoundaryImpl extends React.Component<{\n getResetKey: () => number | string\n children: (props: {\n error: Error | null\n reset: () => void\n }) => React.ReactNode\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}> {\n state = { error: null } as { error: Error | null; resetKey
|
|
1
|
+
{"version":3,"file":"CatchBoundary.js","names":[],"sources":["../../src/CatchBoundary.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { ErrorRouteComponent } from './route'\nimport type { ErrorInfo } from 'react'\n\nexport function CatchBoundary(props: {\n getResetKey: () => number | string\n children: React.ReactNode\n errorComponent?: ErrorRouteComponent\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}) {\n const errorComponent = props.errorComponent ?? ErrorComponent\n\n return (\n <CatchBoundaryImpl\n getResetKey={props.getResetKey}\n onCatch={props.onCatch}\n children={({ error, reset }) => {\n if (error) {\n return React.createElement(errorComponent, {\n error,\n reset,\n })\n }\n\n return props.children\n }}\n />\n )\n}\n\nclass CatchBoundaryImpl extends React.Component<{\n getResetKey: () => number | string\n children: (props: {\n error: Error | null\n reset: () => void\n }) => React.ReactNode\n onCatch?: (error: Error, errorInfo: ErrorInfo) => void\n}> {\n state = { error: null } as { error: Error | null; resetKey?: string | number }\n\n static getDerivedStateFromProps(\n props: { getResetKey: () => string | number },\n state: { resetKey?: string | number; error: Error | null },\n ) {\n const resetKey = props.getResetKey()\n\n if (state.error && state.resetKey !== resetKey) {\n return { resetKey, error: null }\n }\n\n return { resetKey }\n }\n static getDerivedStateFromError(error: Error) {\n return { error }\n }\n reset() {\n this.setState({ error: null })\n }\n componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n if (this.props.onCatch) {\n this.props.onCatch(error, errorInfo)\n }\n }\n render() {\n return this.props.children({\n error: this.state.error,\n reset: () => {\n this.reset()\n },\n })\n }\n}\n\nexport function ErrorComponent({ error }: { error: any }) {\n const [show, setShow] = React.useState(process.env.NODE_ENV !== 'production')\n\n return (\n <div style={{ padding: '.5rem', maxWidth: '100%' }}>\n <div style={{ display: 'flex', alignItems: 'center', gap: '.5rem' }}>\n <strong style={{ fontSize: '1rem' }}>Something went wrong!</strong>\n <button\n style={{\n appearance: 'none',\n fontSize: '.6em',\n border: '1px solid currentColor',\n padding: '.1rem .2rem',\n fontWeight: 'bold',\n borderRadius: '.25rem',\n }}\n onClick={() => setShow((d) => !d)}\n >\n {show ? 'Hide Error' : 'Show Error'}\n </button>\n </div>\n <div style={{ height: '.25rem' }} />\n {show ? (\n <div>\n <pre\n style={{\n fontSize: '.7em',\n border: '1px solid red',\n borderRadius: '.25rem',\n padding: '.3rem',\n color: 'red',\n overflow: 'auto',\n }}\n >\n {error.message ? <code>{error.message}</code> : null}\n </pre>\n </div>\n ) : null}\n </div>\n )\n}\n"],"mappings":";;;AAIA,SAAgB,cAAc,OAK3B;CACD,MAAM,iBAAiB,MAAM,kBAAkB;AAE/C,QACE,oBAAC,mBAAD;EACE,aAAa,MAAM;EACnB,SAAS,MAAM;EACf,WAAW,EAAE,OAAO,YAAY;AAC9B,OAAI,MACF,QAAO,QAAM,cAAc,gBAAgB;IACzC;IACA;IACD,CAAC;AAGJ,UAAO,MAAM;;EAEf,CAAA;;AAIN,IAAM,oBAAN,cAAgC,QAAM,UAOnC;;;eACO,EAAE,OAAO,MAAM;;CAEvB,OAAO,yBACL,OACA,OACA;EACA,MAAM,WAAW,MAAM,aAAa;AAEpC,MAAI,MAAM,SAAS,MAAM,aAAa,SACpC,QAAO;GAAE;GAAU,OAAO;GAAM;AAGlC,SAAO,EAAE,UAAU;;CAErB,OAAO,yBAAyB,OAAc;AAC5C,SAAO,EAAE,OAAO;;CAElB,QAAQ;AACN,OAAK,SAAS,EAAE,OAAO,MAAM,CAAC;;CAEhC,kBAAkB,OAAc,WAAsB;AACpD,MAAI,KAAK,MAAM,QACb,MAAK,MAAM,QAAQ,OAAO,UAAU;;CAGxC,SAAS;AACP,SAAO,KAAK,MAAM,SAAS;GACzB,OAAO,KAAK,MAAM;GAClB,aAAa;AACX,SAAK,OAAO;;GAEf,CAAC;;;AAIN,SAAgB,eAAe,EAAE,SAAyB;CACxD,MAAM,CAAC,MAAM,WAAW,QAAM,SAAA,QAAA,IAAA,aAAkC,aAAa;AAE7E,QACE,qBAAC,OAAD;EAAK,OAAO;GAAE,SAAS;GAAS,UAAU;GAAQ;YAAlD;GACE,qBAAC,OAAD;IAAK,OAAO;KAAE,SAAS;KAAQ,YAAY;KAAU,KAAK;KAAS;cAAnE,CACE,oBAAC,UAAD;KAAQ,OAAO,EAAE,UAAU,QAAQ;eAAE;KAA8B,CAAA,EACnE,oBAAC,UAAD;KACE,OAAO;MACL,YAAY;MACZ,UAAU;MACV,QAAQ;MACR,SAAS;MACT,YAAY;MACZ,cAAc;MACf;KACD,eAAe,SAAS,MAAM,CAAC,EAAE;eAEhC,OAAO,eAAe;KAChB,CAAA,CACL;;GACN,oBAAC,OAAD,EAAK,OAAO,EAAE,QAAQ,UAAU,EAAI,CAAA;GACnC,OACC,oBAAC,OAAD,EAAA,UACE,oBAAC,OAAD;IACE,OAAO;KACL,UAAU;KACV,QAAQ;KACR,cAAc;KACd,SAAS;KACT,OAAO;KACP,UAAU;KACX;cAEA,MAAM,UAAU,oBAAC,QAAD,EAAA,UAAO,MAAM,SAAe,CAAA,GAAG;IAC5C,CAAA,EACF,CAAA,GACJ;GACA"}
|
package/dist/esm/Match.js
CHANGED
|
@@ -126,6 +126,9 @@ function OnRendered({ resetKey }) {
|
|
|
126
126
|
}
|
|
127
127
|
var MatchInner = React$1.memo(function MatchInnerImpl({ matchId }) {
|
|
128
128
|
const router = useRouter();
|
|
129
|
+
const getMatchPromise = (match, key) => {
|
|
130
|
+
return router.getMatch(match.id)?._nonReactive[key] ?? match._nonReactive[key];
|
|
131
|
+
};
|
|
129
132
|
if (isServer ?? router.isServer) {
|
|
130
133
|
const match = router.stores.activeMatchStoresById.get(matchId)?.state;
|
|
131
134
|
if (!match) {
|
|
@@ -143,9 +146,9 @@ var MatchInner = React$1.memo(function MatchInnerImpl({ matchId }) {
|
|
|
143
146
|
const key = remountDeps ? JSON.stringify(remountDeps) : void 0;
|
|
144
147
|
const Comp = route.options.component ?? router.options.defaultComponent;
|
|
145
148
|
const out = Comp ? /* @__PURE__ */ jsx(Comp, {}, key) : /* @__PURE__ */ jsx(Outlet, {});
|
|
146
|
-
if (match._displayPending) throw
|
|
147
|
-
if (match._forcePending) throw
|
|
148
|
-
if (match.status === "pending") throw
|
|
149
|
+
if (match._displayPending) throw getMatchPromise(match, "displayPendingPromise");
|
|
150
|
+
if (match._forcePending) throw getMatchPromise(match, "minPendingPromise");
|
|
151
|
+
if (match.status === "pending") throw getMatchPromise(match, "loadPromise");
|
|
149
152
|
if (match.status === "notFound") {
|
|
150
153
|
if (!isNotFound(match.error)) {
|
|
151
154
|
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a notFound error");
|
|
@@ -158,7 +161,7 @@ var MatchInner = React$1.memo(function MatchInnerImpl({ matchId }) {
|
|
|
158
161
|
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a redirect error");
|
|
159
162
|
invariant();
|
|
160
163
|
}
|
|
161
|
-
throw
|
|
164
|
+
throw getMatchPromise(match, "loadPromise");
|
|
162
165
|
}
|
|
163
166
|
if (match.status === "error") return /* @__PURE__ */ jsx((route.options.errorComponent ?? router.options.defaultErrorComponent) || ErrorComponent, {
|
|
164
167
|
error: match.error,
|
|
@@ -200,8 +203,8 @@ var MatchInner = React$1.memo(function MatchInnerImpl({ matchId }) {
|
|
|
200
203
|
route.options.component,
|
|
201
204
|
router.options.defaultComponent
|
|
202
205
|
]);
|
|
203
|
-
if (match._displayPending) throw
|
|
204
|
-
if (match._forcePending) throw
|
|
206
|
+
if (match._displayPending) throw getMatchPromise(match, "displayPendingPromise");
|
|
207
|
+
if (match._forcePending) throw getMatchPromise(match, "minPendingPromise");
|
|
205
208
|
if (match.status === "pending") {
|
|
206
209
|
const pendingMinMs = route.options.pendingMinMs ?? router.options.defaultPendingMinMs;
|
|
207
210
|
if (pendingMinMs) {
|
|
@@ -217,7 +220,7 @@ var MatchInner = React$1.memo(function MatchInnerImpl({ matchId }) {
|
|
|
217
220
|
}
|
|
218
221
|
}
|
|
219
222
|
}
|
|
220
|
-
throw
|
|
223
|
+
throw getMatchPromise(match, "loadPromise");
|
|
221
224
|
}
|
|
222
225
|
if (match.status === "notFound") {
|
|
223
226
|
if (!isNotFound(match.error)) {
|
|
@@ -231,7 +234,7 @@ var MatchInner = React$1.memo(function MatchInnerImpl({ matchId }) {
|
|
|
231
234
|
if (process.env.NODE_ENV !== "production") throw new Error("Invariant failed: Expected a redirect error");
|
|
232
235
|
invariant();
|
|
233
236
|
}
|
|
234
|
-
throw
|
|
237
|
+
throw getMatchPromise(match, "loadPromise");
|
|
235
238
|
}
|
|
236
239
|
if (match.status === "error") {
|
|
237
240
|
if (isServer ?? router.isServer) return /* @__PURE__ */ jsx((route.options.errorComponent ?? router.options.defaultErrorComponent) || ErrorComponent, {
|
package/dist/esm/Match.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Match.js","names":[],"sources":["../../src/Match.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport {\n createControlledPromise,\n getLocationChangeInfo,\n invariant,\n isNotFound,\n isRedirect,\n rootRouteId,\n} from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { CatchNotFound } from './not-found'\nimport { matchContext } from './matchContext'\nimport { SafeFragment } from './SafeFragment'\nimport { renderRouteNotFound } from './renderRouteNotFound'\nimport { ScrollRestoration } from './scroll-restoration'\nimport { ClientOnly } from './ClientOnly'\nimport { useLayoutEffect } from './utils'\nimport type { AnyRoute, RootRouteOptions } from '@tanstack/router-core'\n\nexport const Match = React.memo(function MatchImpl({\n matchId,\n}: {\n matchId: string\n}) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={router.stores.loadedAt.state}\n matchState={{\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId,\n }}\n />\n )\n }\n\n // Subscribe directly to the match store from the pool.\n // The matchId prop is stable for this component's lifetime (set by Outlet),\n // and reconcileMatchPool reuses stores for the same matchId.\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const resetKey = useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const matchState = React.useMemo(() => {\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return {\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId: parentRouteId as string | undefined,\n } satisfies MatchViewState\n }, [match._displayPending, match.routeId, match.ssr, router.routesById])\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={resetKey}\n matchState={matchState}\n />\n )\n})\n\ntype MatchViewState = {\n routeId: string\n ssr: boolean | 'data-only' | undefined\n _displayPending: boolean | undefined\n parentRouteId: string | undefined\n}\n\nfunction MatchView({\n router,\n matchId,\n resetKey,\n matchState,\n}: {\n router: ReturnType<typeof useRouter>\n matchId: string\n resetKey: number\n matchState: MatchViewState\n}) {\n const route: AnyRoute = router.routesById[matchState.routeId]\n\n const PendingComponent =\n route.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n const routeErrorComponent =\n route.options.errorComponent ?? router.options.defaultErrorComponent\n\n const routeOnCatch = route.options.onCatch ?? router.options.defaultOnCatch\n\n const routeNotFoundComponent = route.isRoot\n ? // If it's the root route, use the globalNotFound option, with fallback to the notFoundRoute's component\n (route.options.notFoundComponent ??\n router.options.notFoundRoute?.options.component)\n : route.options.notFoundComponent\n\n const resolvedNoSsr =\n matchState.ssr === false || matchState.ssr === 'data-only'\n const ResolvedSuspenseBoundary =\n // If we're on the root route, allow forcefully wrapping in suspense\n (!route.isRoot || route.options.wrapInSuspense || resolvedNoSsr) &&\n (route.options.wrapInSuspense ??\n PendingComponent ??\n ((route.options.errorComponent as any)?.preload || resolvedNoSsr))\n ? React.Suspense\n : SafeFragment\n\n const ResolvedCatchBoundary = routeErrorComponent\n ? CatchBoundary\n : SafeFragment\n\n const ResolvedNotFoundBoundary = routeNotFoundComponent\n ? CatchNotFound\n : SafeFragment\n\n const ShellComponent = route.isRoot\n ? ((route.options as RootRouteOptions).shellComponent ?? SafeFragment)\n : SafeFragment\n return (\n <ShellComponent>\n <matchContext.Provider value={matchId}>\n <ResolvedSuspenseBoundary fallback={pendingElement}>\n <ResolvedCatchBoundary\n getResetKey={() => resetKey}\n errorComponent={routeErrorComponent || ErrorComponent}\n onCatch={(error, errorInfo) => {\n // Forward not found errors (we don't want to show the error component for these)\n if (isNotFound(error)) {\n error.routeId ??= matchState.routeId as any\n throw error\n }\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`Warning: Error in route match: ${matchId}`)\n }\n routeOnCatch?.(error, errorInfo)\n }}\n >\n <ResolvedNotFoundBoundary\n fallback={(error) => {\n error.routeId ??= matchState.routeId as any\n\n // If the current not found handler doesn't exist or it has a\n // route ID which doesn't match the current route, rethrow the error\n if (\n !routeNotFoundComponent ||\n (error.routeId && error.routeId !== matchState.routeId) ||\n (!error.routeId && !route.isRoot)\n )\n throw error\n\n return React.createElement(routeNotFoundComponent, error as any)\n }}\n >\n {resolvedNoSsr || matchState._displayPending ? (\n <ClientOnly fallback={pendingElement}>\n <MatchInner matchId={matchId} />\n </ClientOnly>\n ) : (\n <MatchInner matchId={matchId} />\n )}\n </ResolvedNotFoundBoundary>\n </ResolvedCatchBoundary>\n </ResolvedSuspenseBoundary>\n </matchContext.Provider>\n {matchState.parentRouteId === rootRouteId ? (\n <>\n <OnRendered resetKey={resetKey} />\n {router.options.scrollRestoration && (isServer ?? router.isServer) ? (\n <ScrollRestoration />\n ) : null}\n </>\n ) : null}\n </ShellComponent>\n )\n}\n\n// On Rendered can't happen above the root layout because it needs to run after\n// the route subtree has committed below the root layout. Keeping it here lets\n// us fire onRendered even after a hydration mismatch above the root layout\n// (like bad head/link tags, which is common).\nfunction OnRendered({ resetKey }: { resetKey: number }) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n return null\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const prevHrefRef = React.useRef<string | undefined>(undefined)\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useLayoutEffect(() => {\n const currentHref = router.latestLocation.href\n\n if (\n prevHrefRef.current === undefined ||\n prevHrefRef.current !== currentHref\n ) {\n router.emit({\n type: 'onRendered',\n ...getLocationChangeInfo(\n router.stores.location.state,\n router.stores.resolvedLocation.state,\n ),\n })\n prevHrefRef.current = currentHref\n }\n }, [router.latestLocation.state.__TSR_key, resetKey, router])\n\n return null\n}\n\nexport const MatchInner = React.memo(function MatchInnerImpl({\n matchId,\n}: {\n matchId: string\n}): any {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n const key = remountDeps ? JSON.stringify(remountDeps) : undefined\n const Comp = route.options.component ?? router.options.defaultComponent\n const out = Comp ? <Comp key={key} /> : <Outlet />\n\n if (match._displayPending) {\n throw router.getMatch(match.id)?._nonReactive.displayPendingPromise\n }\n\n if (match._forcePending) {\n throw router.getMatch(match.id)?._nonReactive.minPendingPromise\n }\n\n if (match.status === 'pending') {\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'error') {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n return out\n }\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const key = React.useMemo(() => {\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n return remountDeps ? JSON.stringify(remountDeps) : undefined\n }, [\n routeId,\n match.loaderDeps,\n match._strictParams,\n match._strictSearch,\n router.options.defaultRemountDeps,\n router.routesById,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const out = React.useMemo(() => {\n const Comp = route.options.component ?? router.options.defaultComponent\n if (Comp) {\n return <Comp key={key} />\n }\n return <Outlet />\n }, [key, route.options.component, router.options.defaultComponent])\n\n if (match._displayPending) {\n throw router.getMatch(match.id)?._nonReactive.displayPendingPromise\n }\n\n if (match._forcePending) {\n throw router.getMatch(match.id)?._nonReactive.minPendingPromise\n }\n\n // see also hydrate() in packages/router-core/src/ssr/ssr-client.ts\n if (match.status === 'pending') {\n // We're pending, and if we have a minPendingMs, we need to wait for it\n const pendingMinMs =\n route.options.pendingMinMs ?? router.options.defaultPendingMinMs\n if (pendingMinMs) {\n const routerMatch = router.getMatch(match.id)\n if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {\n // Create a promise that will resolve after the minPendingMs\n if (!(isServer ?? router.isServer)) {\n const minPendingPromise = createControlledPromise<void>()\n\n routerMatch._nonReactive.minPendingPromise = minPendingPromise\n\n setTimeout(() => {\n minPendingPromise.resolve()\n // We've handled the minPendingPromise, so we can delete it\n routerMatch._nonReactive.minPendingPromise = undefined\n }, pendingMinMs)\n }\n }\n }\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n // Redirects should be handled by the router transition. If we happen to\n // encounter a redirect here, it's a bug. Let's warn, but render nothing.\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n\n // warning(\n // false,\n // 'Tried to render a redirected route match! This is a weird circumstance, please file an issue!',\n // )\n throw router.getMatch(match.id)?._nonReactive.loadPromise\n }\n\n if (match.status === 'error') {\n // If we're on the server, we need to use React's new and super\n // wonky api for throwing errors from a server side render inside\n // of a suspense boundary. This is the only way to get\n // renderToPipeableStream to not hang indefinitely.\n // We'll serialize the error and rethrow it on the client.\n if (isServer ?? router.isServer) {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n throw match.error\n }\n\n return out\n})\n\n/**\n * Render the next child match in the route tree. Typically used inside\n * a route component to render nested routes.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/outletComponent\n */\nexport const Outlet = React.memo(function OutletImpl() {\n const router = useRouter()\n const matchId = React.useContext(matchContext)\n\n let routeId: string | undefined\n let parentGlobalNotFound = false\n let childMatchId: string | undefined\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state\n const parentIndex = matchId\n ? matches.findIndex((match) => match.id === matchId)\n : -1\n const parentMatch = parentIndex >= 0 ? matches[parentIndex] : undefined\n routeId = parentMatch?.routeId as string | undefined\n parentGlobalNotFound = parentMatch?.globalNotFound ?? false\n childMatchId =\n parentIndex >= 0 ? (matches[parentIndex + 1]?.id as string) : undefined\n } else {\n // Subscribe directly to the match store from the pool instead of\n // the two-level byId → matchStore pattern.\n const parentMatchStore = matchId\n ? router.stores.activeMatchStoresById.get(matchId)\n : undefined\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n ;[routeId, parentGlobalNotFound] = useStore(parentMatchStore, (match) => [\n match?.routeId as string | undefined,\n match?.globalNotFound ?? false,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n childMatchId = useStore(router.stores.matchesId, (ids) => {\n const index = ids.findIndex((id) => id === matchId)\n return ids[index + 1]\n })\n }\n\n const route = routeId ? router.routesById[routeId] : undefined\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n if (parentGlobalNotFound) {\n if (!route) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n 'Invariant failed: Could not resolve route for Outlet render',\n )\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, undefined)\n }\n\n if (!childMatchId) {\n return null\n }\n\n const nextMatch = <Match matchId={childMatchId} />\n\n if (routeId === rootRouteId) {\n return (\n <React.Suspense fallback={pendingElement}>{nextMatch}</React.Suspense>\n )\n }\n\n return nextMatch\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Match.js","names":[],"sources":["../../src/Match.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport {\n createControlledPromise,\n getLocationChangeInfo,\n invariant,\n isNotFound,\n isRedirect,\n rootRouteId,\n} from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { CatchNotFound } from './not-found'\nimport { matchContext } from './matchContext'\nimport { SafeFragment } from './SafeFragment'\nimport { renderRouteNotFound } from './renderRouteNotFound'\nimport { ScrollRestoration } from './scroll-restoration'\nimport { ClientOnly } from './ClientOnly'\nimport { useLayoutEffect } from './utils'\nimport type { AnyRoute, RootRouteOptions } from '@tanstack/router-core'\n\nexport const Match = React.memo(function MatchImpl({\n matchId,\n}: {\n matchId: string\n}) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={router.stores.loadedAt.state}\n matchState={{\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId,\n }}\n />\n )\n }\n\n // Subscribe directly to the match store from the pool.\n // The matchId prop is stable for this component's lifetime (set by Outlet),\n // and reconcileMatchPool reuses stores for the same matchId.\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const resetKey = useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const matchState = React.useMemo(() => {\n const routeId = match.routeId as string\n const parentRouteId = (router.routesById[routeId] as AnyRoute).parentRoute\n ?.id\n\n return {\n routeId,\n ssr: match.ssr,\n _displayPending: match._displayPending,\n parentRouteId: parentRouteId as string | undefined,\n } satisfies MatchViewState\n }, [match._displayPending, match.routeId, match.ssr, router.routesById])\n\n return (\n <MatchView\n router={router}\n matchId={matchId}\n resetKey={resetKey}\n matchState={matchState}\n />\n )\n})\n\ntype MatchViewState = {\n routeId: string\n ssr: boolean | 'data-only' | undefined\n _displayPending: boolean | undefined\n parentRouteId: string | undefined\n}\n\nfunction MatchView({\n router,\n matchId,\n resetKey,\n matchState,\n}: {\n router: ReturnType<typeof useRouter>\n matchId: string\n resetKey: number\n matchState: MatchViewState\n}) {\n const route: AnyRoute = router.routesById[matchState.routeId]\n\n const PendingComponent =\n route.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n const routeErrorComponent =\n route.options.errorComponent ?? router.options.defaultErrorComponent\n\n const routeOnCatch = route.options.onCatch ?? router.options.defaultOnCatch\n\n const routeNotFoundComponent = route.isRoot\n ? // If it's the root route, use the globalNotFound option, with fallback to the notFoundRoute's component\n (route.options.notFoundComponent ??\n router.options.notFoundRoute?.options.component)\n : route.options.notFoundComponent\n\n const resolvedNoSsr =\n matchState.ssr === false || matchState.ssr === 'data-only'\n const ResolvedSuspenseBoundary =\n // If we're on the root route, allow forcefully wrapping in suspense\n (!route.isRoot || route.options.wrapInSuspense || resolvedNoSsr) &&\n (route.options.wrapInSuspense ??\n PendingComponent ??\n ((route.options.errorComponent as any)?.preload || resolvedNoSsr))\n ? React.Suspense\n : SafeFragment\n\n const ResolvedCatchBoundary = routeErrorComponent\n ? CatchBoundary\n : SafeFragment\n\n const ResolvedNotFoundBoundary = routeNotFoundComponent\n ? CatchNotFound\n : SafeFragment\n\n const ShellComponent = route.isRoot\n ? ((route.options as RootRouteOptions).shellComponent ?? SafeFragment)\n : SafeFragment\n return (\n <ShellComponent>\n <matchContext.Provider value={matchId}>\n <ResolvedSuspenseBoundary fallback={pendingElement}>\n <ResolvedCatchBoundary\n getResetKey={() => resetKey}\n errorComponent={routeErrorComponent || ErrorComponent}\n onCatch={(error, errorInfo) => {\n // Forward not found errors (we don't want to show the error component for these)\n if (isNotFound(error)) {\n error.routeId ??= matchState.routeId as any\n throw error\n }\n if (process.env.NODE_ENV !== 'production') {\n console.warn(`Warning: Error in route match: ${matchId}`)\n }\n routeOnCatch?.(error, errorInfo)\n }}\n >\n <ResolvedNotFoundBoundary\n fallback={(error) => {\n error.routeId ??= matchState.routeId as any\n\n // If the current not found handler doesn't exist or it has a\n // route ID which doesn't match the current route, rethrow the error\n if (\n !routeNotFoundComponent ||\n (error.routeId && error.routeId !== matchState.routeId) ||\n (!error.routeId && !route.isRoot)\n )\n throw error\n\n return React.createElement(routeNotFoundComponent, error as any)\n }}\n >\n {resolvedNoSsr || matchState._displayPending ? (\n <ClientOnly fallback={pendingElement}>\n <MatchInner matchId={matchId} />\n </ClientOnly>\n ) : (\n <MatchInner matchId={matchId} />\n )}\n </ResolvedNotFoundBoundary>\n </ResolvedCatchBoundary>\n </ResolvedSuspenseBoundary>\n </matchContext.Provider>\n {matchState.parentRouteId === rootRouteId ? (\n <>\n <OnRendered resetKey={resetKey} />\n {router.options.scrollRestoration && (isServer ?? router.isServer) ? (\n <ScrollRestoration />\n ) : null}\n </>\n ) : null}\n </ShellComponent>\n )\n}\n\n// On Rendered can't happen above the root layout because it needs to run after\n// the route subtree has committed below the root layout. Keeping it here lets\n// us fire onRendered even after a hydration mismatch above the root layout\n// (like bad head/link tags, which is common).\nfunction OnRendered({ resetKey }: { resetKey: number }) {\n const router = useRouter()\n\n if (isServer ?? router.isServer) {\n return null\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const prevHrefRef = React.useRef<string | undefined>(undefined)\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useLayoutEffect(() => {\n const currentHref = router.latestLocation.href\n\n if (\n prevHrefRef.current === undefined ||\n prevHrefRef.current !== currentHref\n ) {\n router.emit({\n type: 'onRendered',\n ...getLocationChangeInfo(\n router.stores.location.state,\n router.stores.resolvedLocation.state,\n ),\n })\n prevHrefRef.current = currentHref\n }\n }, [router.latestLocation.state.__TSR_key, resetKey, router])\n\n return null\n}\n\nexport const MatchInner = React.memo(function MatchInnerImpl({\n matchId,\n}: {\n matchId: string\n}): any {\n const router = useRouter()\n\n const getMatchPromise = (\n match: {\n id: string\n _nonReactive: {\n displayPendingPromise?: Promise<void>\n minPendingPromise?: Promise<void>\n loadPromise?: Promise<void>\n }\n },\n key: 'displayPendingPromise' | 'minPendingPromise' | 'loadPromise',\n ) => {\n return (\n router.getMatch(match.id)?._nonReactive[key] ?? match._nonReactive[key]\n )\n }\n\n if (isServer ?? router.isServer) {\n const match = router.stores.activeMatchStoresById.get(matchId)?.state\n if (!match) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n const key = remountDeps ? JSON.stringify(remountDeps) : undefined\n const Comp = route.options.component ?? router.options.defaultComponent\n const out = Comp ? <Comp key={key} /> : <Outlet />\n\n if (match._displayPending) {\n throw getMatchPromise(match, 'displayPendingPromise')\n }\n\n if (match._forcePending) {\n throw getMatchPromise(match, 'minPendingPromise')\n }\n\n if (match.status === 'pending') {\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'error') {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n return out\n }\n\n const matchStore = router.stores.activeMatchStoresById.get(matchId)\n if (!matchStore) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n `Invariant failed: Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n }\n\n invariant()\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const match = useStore(matchStore, (value) => value)\n const routeId = match.routeId as string\n const route = router.routesById[routeId] as AnyRoute\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const key = React.useMemo(() => {\n const remountFn =\n (router.routesById[routeId] as AnyRoute).options.remountDeps ??\n router.options.defaultRemountDeps\n const remountDeps = remountFn?.({\n routeId,\n loaderDeps: match.loaderDeps,\n params: match._strictParams,\n search: match._strictSearch,\n })\n return remountDeps ? JSON.stringify(remountDeps) : undefined\n }, [\n routeId,\n match.loaderDeps,\n match._strictParams,\n match._strictSearch,\n router.options.defaultRemountDeps,\n router.routesById,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const out = React.useMemo(() => {\n const Comp = route.options.component ?? router.options.defaultComponent\n if (Comp) {\n return <Comp key={key} />\n }\n return <Outlet />\n }, [key, route.options.component, router.options.defaultComponent])\n\n if (match._displayPending) {\n throw getMatchPromise(match, 'displayPendingPromise')\n }\n\n if (match._forcePending) {\n throw getMatchPromise(match, 'minPendingPromise')\n }\n\n // see also hydrate() in packages/router-core/src/ssr/ssr-client.ts\n if (match.status === 'pending') {\n // We're pending, and if we have a minPendingMs, we need to wait for it\n const pendingMinMs =\n route.options.pendingMinMs ?? router.options.defaultPendingMinMs\n if (pendingMinMs) {\n const routerMatch = router.getMatch(match.id)\n if (routerMatch && !routerMatch._nonReactive.minPendingPromise) {\n // Create a promise that will resolve after the minPendingMs\n if (!(isServer ?? router.isServer)) {\n const minPendingPromise = createControlledPromise<void>()\n\n routerMatch._nonReactive.minPendingPromise = minPendingPromise\n\n setTimeout(() => {\n minPendingPromise.resolve()\n // We've handled the minPendingPromise, so we can delete it\n routerMatch._nonReactive.minPendingPromise = undefined\n }, pendingMinMs)\n }\n }\n }\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'notFound') {\n if (!isNotFound(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a notFound error')\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, match.error)\n }\n\n if (match.status === 'redirected') {\n // A match can be observed as redirected during an in-flight transition,\n // especially when pending UI is already rendering. Suspend on the match's\n // load promise so React can abandon this stale render and continue the\n // redirect transition.\n if (!isRedirect(match.error)) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error('Invariant failed: Expected a redirect error')\n }\n\n invariant()\n }\n\n throw getMatchPromise(match, 'loadPromise')\n }\n\n if (match.status === 'error') {\n // If we're on the server, we need to use React's new and super\n // wonky api for throwing errors from a server side render inside\n // of a suspense boundary. This is the only way to get\n // renderToPipeableStream to not hang indefinitely.\n // We'll serialize the error and rethrow it on the client.\n if (isServer ?? router.isServer) {\n const RouteErrorComponent =\n (route.options.errorComponent ??\n router.options.defaultErrorComponent) ||\n ErrorComponent\n return (\n <RouteErrorComponent\n error={match.error as any}\n reset={undefined as any}\n info={{\n componentStack: '',\n }}\n />\n )\n }\n\n throw match.error\n }\n\n return out\n})\n\n/**\n * Render the next child match in the route tree. Typically used inside\n * a route component to render nested routes.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/outletComponent\n */\nexport const Outlet = React.memo(function OutletImpl() {\n const router = useRouter()\n const matchId = React.useContext(matchContext)\n\n let routeId: string | undefined\n let parentGlobalNotFound = false\n let childMatchId: string | undefined\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state\n const parentIndex = matchId\n ? matches.findIndex((match) => match.id === matchId)\n : -1\n const parentMatch = parentIndex >= 0 ? matches[parentIndex] : undefined\n routeId = parentMatch?.routeId as string | undefined\n parentGlobalNotFound = parentMatch?.globalNotFound ?? false\n childMatchId =\n parentIndex >= 0 ? (matches[parentIndex + 1]?.id as string) : undefined\n } else {\n // Subscribe directly to the match store from the pool instead of\n // the two-level byId → matchStore pattern.\n const parentMatchStore = matchId\n ? router.stores.activeMatchStoresById.get(matchId)\n : undefined\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n ;[routeId, parentGlobalNotFound] = useStore(parentMatchStore, (match) => [\n match?.routeId as string | undefined,\n match?.globalNotFound ?? false,\n ])\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n childMatchId = useStore(router.stores.matchesId, (ids) => {\n const index = ids.findIndex((id) => id === matchId)\n return ids[index + 1]\n })\n }\n\n const route = routeId ? router.routesById[routeId] : undefined\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n if (parentGlobalNotFound) {\n if (!route) {\n if (process.env.NODE_ENV !== 'production') {\n throw new Error(\n 'Invariant failed: Could not resolve route for Outlet render',\n )\n }\n\n invariant()\n }\n return renderRouteNotFound(router, route, undefined)\n }\n\n if (!childMatchId) {\n return null\n }\n\n const nextMatch = <Match matchId={childMatchId} />\n\n if (routeId === rootRouteId) {\n return (\n <React.Suspense fallback={pendingElement}>{nextMatch}</React.Suspense>\n )\n }\n\n return nextMatch\n})\n"],"mappings":"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"}
|
package/dist/esm/Matches.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { StructuralSharingOption, ValidateSelected } from './structuralSharing.js';
|
|
2
|
-
import { AnyRouter, DeepPartial, Expand, MakeOptionalPathParams, MakeOptionalSearchParams, MakeRouteMatchUnion, MaskOptions, MatchRouteOptions,
|
|
2
|
+
import { AnyRouter, DeepPartial, Expand, MakeOptionalPathParams, MakeOptionalSearchParams, MakeRouteMatchUnion, MaskOptions, MatchRouteOptions, RegisteredRouter, ResolveRoute, ToSubOptionsProps } from '@tanstack/router-core';
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
declare module '@tanstack/router-core' {
|
|
5
5
|
interface RouteMatchExtensions {
|
|
@@ -30,7 +30,7 @@ export type UseMatchRouteOptions<TRouter extends AnyRouter = RegisteredRouter, T
|
|
|
30
30
|
*/
|
|
31
31
|
export declare function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>(): <const TFrom extends string = string, const TTo extends string | undefined = undefined, const TMaskFrom extends string = TFrom, const TMaskTo extends string = "">(opts: UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>) => false | Expand<ResolveRoute<TRouter, TFrom, TTo>["types"]["allParams"]>;
|
|
32
32
|
export type MakeMatchRouteOptions<TRouter extends AnyRouter = RegisteredRouter, TFrom extends string = string, TTo extends string | undefined = undefined, TMaskFrom extends string = TFrom, TMaskTo extends string = ''> = UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {
|
|
33
|
-
children?: ((params?:
|
|
33
|
+
children?: ((params?: Expand<ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']>) => React.ReactNode) | React.ReactNode;
|
|
34
34
|
};
|
|
35
35
|
/**
|
|
36
36
|
* Component that conditionally renders its children based on whether a route
|
package/dist/esm/Matches.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Matches.js","names":[],"sources":["../../src/Matches.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { replaceEqualDeep, rootRouteId } from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { Transitioner } from './Transitioner'\nimport { matchContext } from './matchContext'\nimport { Match } from './Match'\nimport { SafeFragment } from './SafeFragment'\nimport type {\n StructuralSharingOption,\n ValidateSelected,\n} from './structuralSharing'\nimport type {\n AnyRoute,\n AnyRouter,\n DeepPartial,\n Expand,\n MakeOptionalPathParams,\n MakeOptionalSearchParams,\n MakeRouteMatchUnion,\n MaskOptions,\n MatchRouteOptions,\n NoInfer,\n RegisteredRouter,\n ResolveRelativePath,\n ResolveRoute,\n RouteByPath,\n ToSubOptionsProps,\n} from '@tanstack/router-core'\n\ndeclare module '@tanstack/router-core' {\n export interface RouteMatchExtensions {\n meta?: Array<React.JSX.IntrinsicElements['meta'] | undefined>\n links?: Array<React.JSX.IntrinsicElements['link'] | undefined>\n scripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n styles?: Array<React.JSX.IntrinsicElements['style'] | undefined>\n headScripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n }\n}\n\n/**\n * Internal component that renders the router's active match tree with\n * suspense, error, and not-found boundaries. Rendered by `RouterProvider`.\n */\nexport function Matches() {\n const router = useRouter()\n const rootRoute: AnyRoute = router.routesById[rootRouteId]\n\n const PendingComponent =\n rootRoute.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n // Do not render a root Suspense during SSR or hydrating from SSR\n const ResolvedSuspense =\n (isServer ?? router.isServer) ||\n (typeof document !== 'undefined' && router.ssr)\n ? SafeFragment\n : React.Suspense\n\n const inner = (\n <ResolvedSuspense fallback={pendingElement}>\n {!(isServer ?? router.isServer) && <Transitioner />}\n <MatchesInner />\n </ResolvedSuspense>\n )\n\n return router.options.InnerWrap ? (\n <router.options.InnerWrap>{inner}</router.options.InnerWrap>\n ) : (\n inner\n )\n}\n\nfunction MatchesInner() {\n const router = useRouter()\n const _isServer = isServer ?? router.isServer\n const matchId = _isServer\n ? router.stores.firstMatchId.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.firstMatchId, (id) => id)\n const resetKey = _isServer\n ? router.stores.loadedAt.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n\n const matchComponent = matchId ? <Match matchId={matchId} /> : null\n\n return (\n <matchContext.Provider value={matchId}>\n {router.options.disableGlobalCatchBoundary ? (\n matchComponent\n ) : (\n <CatchBoundary\n getResetKey={() => resetKey}\n errorComponent={ErrorComponent}\n onCatch={\n process.env.NODE_ENV !== 'production'\n ? (error) => {\n console.warn(\n `Warning: The following error wasn't caught by any route! At the very least, consider setting an 'errorComponent' in your RootRoute!`,\n )\n console.warn(`Warning: ${error.message || error.toString()}`)\n }\n : undefined\n }\n >\n {matchComponent}\n </CatchBoundary>\n )}\n </matchContext.Provider>\n )\n}\n\nexport type UseMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = ToSubOptionsProps<TRouter, TFrom, TTo> &\n DeepPartial<MakeOptionalSearchParams<TRouter, TFrom, TTo>> &\n DeepPartial<MakeOptionalPathParams<TRouter, TFrom, TTo>> &\n MaskOptions<TRouter, TMaskFrom, TMaskTo> &\n MatchRouteOptions\n\n/**\n * Create a matcher function for testing locations against route definitions.\n *\n * The returned function accepts standard navigation options (`to`, `params`,\n * `search`, etc.) and returns either `false` (no match) or the matched params\n * object when the route matches the current or pending location.\n *\n * Useful for conditional rendering and active UI states.\n *\n * @returns A `matchRoute(options)` function that returns `false` or params.\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchRouteHook\n */\nexport function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {\n const router = useRouter()\n\n if (!(isServer ?? router.isServer)) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.matchRouteReactivity, (d) => d)\n }\n\n return React.useCallback(\n <\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n >(\n opts: UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>,\n ):\n | false\n | Expand<ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']> => {\n const { pending, caseSensitive, fuzzy, includeSearch, ...rest } = opts\n\n return router.matchRoute(rest as any, {\n pending,\n caseSensitive,\n fuzzy,\n includeSearch,\n })\n },\n [router],\n )\n}\n\nexport type MakeMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {\n // 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\n children?:\n | ((\n params?: RouteByPath<\n TRouter['routeTree'],\n ResolveRelativePath<TFrom, NoInfer<TTo>>\n >['types']['allParams'],\n ) => React.ReactNode)\n | React.ReactNode\n}\n\n/**\n * Component that conditionally renders its children based on whether a route\n * matches the provided `from`/`to` options. If `children` is a function, it\n * receives the matched params object.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/matchRouteComponent\n */\nexport function MatchRoute<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n>(props: MakeMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): any {\n const matchRoute = useMatchRoute()\n const params = matchRoute(props as any) as boolean\n\n if (typeof props.children === 'function') {\n return (props.children as any)(params)\n }\n\n return params ? props.children : null\n}\n\nexport interface UseMatchesBaseOptions<\n TRouter extends AnyRouter,\n TSelected,\n TStructuralSharing,\n> {\n select?: (\n matches: Array<MakeRouteMatchUnion<TRouter>>,\n ) => ValidateSelected<TRouter, TSelected, TStructuralSharing>\n}\n\nexport type UseMatchesResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected ? Array<MakeRouteMatchUnion<TRouter>> : TSelected\n\nexport function useMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const router = useRouter<TRouter>()\n const previousResult =\n React.useRef<ValidateSelected<TRouter, TSelected, TStructuralSharing>>(\n undefined,\n )\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state as Array<\n MakeRouteMatchUnion<TRouter>\n >\n return (opts?.select ? opts.select(matches) : matches) as UseMatchesResult<\n TRouter,\n TSelected\n >\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useStore(router.stores.activeMatchesSnapshot, (matches) => {\n const selected = opts?.select\n ? opts.select(matches as Array<MakeRouteMatchUnion<TRouter>>)\n : (matches as any)\n\n if (opts?.structuralSharing ?? router.options.defaultStructuralSharing) {\n const shared = replaceEqualDeep(previousResult.current, selected)\n previousResult.current = shared\n return shared\n }\n\n return selected\n }) as UseMatchesResult<TRouter, TSelected>\n}\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @returns The array of matches (or the selected value).\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\nexport function useParentMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n 0,\n matches.findIndex((d) => d.id === contextMatchId),\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n\n/**\n * Read the array of active route matches that are children of the current\n * match (or selected parent) in the match tree.\n */\nexport function useChildMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n matches.findIndex((d) => d.id === contextMatchId) + 1,\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Matches.js","names":[],"sources":["../../src/Matches.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useStore } from '@tanstack/react-store'\nimport { replaceEqualDeep, rootRouteId } from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouter } from './useRouter'\nimport { Transitioner } from './Transitioner'\nimport { matchContext } from './matchContext'\nimport { Match } from './Match'\nimport { SafeFragment } from './SafeFragment'\nimport type {\n StructuralSharingOption,\n ValidateSelected,\n} from './structuralSharing'\nimport type {\n AnyRoute,\n AnyRouter,\n DeepPartial,\n Expand,\n MakeOptionalPathParams,\n MakeOptionalSearchParams,\n MakeRouteMatchUnion,\n MaskOptions,\n MatchRouteOptions,\n RegisteredRouter,\n ResolveRoute,\n ToSubOptionsProps,\n} from '@tanstack/router-core'\n\ndeclare module '@tanstack/router-core' {\n export interface RouteMatchExtensions {\n meta?: Array<React.JSX.IntrinsicElements['meta'] | undefined>\n links?: Array<React.JSX.IntrinsicElements['link'] | undefined>\n scripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n styles?: Array<React.JSX.IntrinsicElements['style'] | undefined>\n headScripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n }\n}\n\n/**\n * Internal component that renders the router's active match tree with\n * suspense, error, and not-found boundaries. Rendered by `RouterProvider`.\n */\nexport function Matches() {\n const router = useRouter()\n const rootRoute: AnyRoute = router.routesById[rootRouteId]\n\n const PendingComponent =\n rootRoute.options.pendingComponent ?? router.options.defaultPendingComponent\n\n const pendingElement = PendingComponent ? <PendingComponent /> : null\n\n // Do not render a root Suspense during SSR or hydrating from SSR\n const ResolvedSuspense =\n (isServer ?? router.isServer) ||\n (typeof document !== 'undefined' && router.ssr)\n ? SafeFragment\n : React.Suspense\n\n const inner = (\n <ResolvedSuspense fallback={pendingElement}>\n {!(isServer ?? router.isServer) && <Transitioner />}\n <MatchesInner />\n </ResolvedSuspense>\n )\n\n return router.options.InnerWrap ? (\n <router.options.InnerWrap>{inner}</router.options.InnerWrap>\n ) : (\n inner\n )\n}\n\nfunction MatchesInner() {\n const router = useRouter()\n const _isServer = isServer ?? router.isServer\n const matchId = _isServer\n ? router.stores.firstMatchId.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.firstMatchId, (id) => id)\n const resetKey = _isServer\n ? router.stores.loadedAt.state\n : // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.loadedAt, (loadedAt) => loadedAt)\n\n const matchComponent = matchId ? <Match matchId={matchId} /> : null\n\n return (\n <matchContext.Provider value={matchId}>\n {router.options.disableGlobalCatchBoundary ? (\n matchComponent\n ) : (\n <CatchBoundary\n getResetKey={() => resetKey}\n errorComponent={ErrorComponent}\n onCatch={\n process.env.NODE_ENV !== 'production'\n ? (error) => {\n console.warn(\n `Warning: The following error wasn't caught by any route! At the very least, consider setting an 'errorComponent' in your RootRoute!`,\n )\n console.warn(`Warning: ${error.message || error.toString()}`)\n }\n : undefined\n }\n >\n {matchComponent}\n </CatchBoundary>\n )}\n </matchContext.Provider>\n )\n}\n\nexport type UseMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = ToSubOptionsProps<TRouter, TFrom, TTo> &\n DeepPartial<MakeOptionalSearchParams<TRouter, TFrom, TTo>> &\n DeepPartial<MakeOptionalPathParams<TRouter, TFrom, TTo>> &\n MaskOptions<TRouter, TMaskFrom, TMaskTo> &\n MatchRouteOptions\n\n/**\n * Create a matcher function for testing locations against route definitions.\n *\n * The returned function accepts standard navigation options (`to`, `params`,\n * `search`, etc.) and returns either `false` (no match) or the matched params\n * object when the route matches the current or pending location.\n *\n * Useful for conditional rendering and active UI states.\n *\n * @returns A `matchRoute(options)` function that returns `false` or params.\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchRouteHook\n */\nexport function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {\n const router = useRouter()\n\n if (!(isServer ?? router.isServer)) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useStore(router.stores.matchRouteReactivity, (d) => d)\n }\n\n return React.useCallback(\n <\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n >(\n opts: UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>,\n ):\n | false\n | Expand<ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']> => {\n const { pending, caseSensitive, fuzzy, includeSearch, ...rest } = opts\n\n return router.matchRoute(rest as any, {\n pending,\n caseSensitive,\n fuzzy,\n includeSearch,\n })\n },\n [router],\n )\n}\n\nexport type MakeMatchRouteOptions<\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends string = string,\n TTo extends string | undefined = undefined,\n TMaskFrom extends string = TFrom,\n TMaskTo extends string = '',\n> = UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {\n // 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\n children?:\n | ((\n params?: Expand<\n ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']\n >,\n ) => React.ReactNode)\n | React.ReactNode\n}\n\n/**\n * Component that conditionally renders its children based on whether a route\n * matches the provided `from`/`to` options. If `children` is a function, it\n * receives the matched params object.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/matchRouteComponent\n */\nexport function MatchRoute<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n>(props: MakeMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): any {\n const matchRoute = useMatchRoute()\n const params = matchRoute(props as any) as boolean\n\n if (typeof props.children === 'function') {\n return (props.children as any)(params)\n }\n\n return params ? props.children : null\n}\n\nexport interface UseMatchesBaseOptions<\n TRouter extends AnyRouter,\n TSelected,\n TStructuralSharing,\n> {\n select?: (\n matches: Array<MakeRouteMatchUnion<TRouter>>,\n ) => ValidateSelected<TRouter, TSelected, TStructuralSharing>\n}\n\nexport type UseMatchesResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected ? Array<MakeRouteMatchUnion<TRouter>> : TSelected\n\nexport function useMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const router = useRouter<TRouter>()\n const previousResult =\n React.useRef<ValidateSelected<TRouter, TSelected, TStructuralSharing>>(\n undefined,\n )\n\n if (isServer ?? router.isServer) {\n const matches = router.stores.activeMatchesSnapshot.state as Array<\n MakeRouteMatchUnion<TRouter>\n >\n return (opts?.select ? opts.select(matches) : matches) as UseMatchesResult<\n TRouter,\n TSelected\n >\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useStore(router.stores.activeMatchesSnapshot, (matches) => {\n const selected = opts?.select\n ? opts.select(matches as Array<MakeRouteMatchUnion<TRouter>>)\n : (matches as any)\n\n if (opts?.structuralSharing ?? router.options.defaultStructuralSharing) {\n const shared = replaceEqualDeep(previousResult.current, selected)\n previousResult.current = shared\n return shared\n }\n\n return selected\n }) as UseMatchesResult<TRouter, TSelected>\n}\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @returns The array of matches (or the selected value).\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\n\n/**\n * Read the full array of active route matches or select a derived subset.\n *\n * Useful for debugging, breadcrumbs, or aggregating metadata across matches.\n *\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook\n */\nexport function useParentMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n 0,\n matches.findIndex((d) => d.id === contextMatchId),\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n\n/**\n * Read the array of active route matches that are children of the current\n * match (or selected parent) in the match tree.\n */\nexport function useChildMatches<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseMatchesBaseOptions<TRouter, TSelected, TStructuralSharing> &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n): UseMatchesResult<TRouter, TSelected> {\n const contextMatchId = React.useContext(matchContext)\n\n return useMatches({\n select: (matches: Array<MakeRouteMatchUnion<TRouter>>) => {\n matches = matches.slice(\n matches.findIndex((d) => d.id === contextMatchId) + 1,\n )\n return opts?.select ? opts.select(matches) : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any)\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
package/src/CatchBoundary.tsx
CHANGED
|
@@ -36,9 +36,19 @@ class CatchBoundaryImpl extends React.Component<{
|
|
|
36
36
|
}) => React.ReactNode
|
|
37
37
|
onCatch?: (error: Error, errorInfo: ErrorInfo) => void
|
|
38
38
|
}> {
|
|
39
|
-
state = { error: null } as { error: Error | null; resetKey
|
|
40
|
-
|
|
41
|
-
|
|
39
|
+
state = { error: null } as { error: Error | null; resetKey?: string | number }
|
|
40
|
+
|
|
41
|
+
static getDerivedStateFromProps(
|
|
42
|
+
props: { getResetKey: () => string | number },
|
|
43
|
+
state: { resetKey?: string | number; error: Error | null },
|
|
44
|
+
) {
|
|
45
|
+
const resetKey = props.getResetKey()
|
|
46
|
+
|
|
47
|
+
if (state.error && state.resetKey !== resetKey) {
|
|
48
|
+
return { resetKey, error: null }
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
return { resetKey }
|
|
42
52
|
}
|
|
43
53
|
static getDerivedStateFromError(error: Error) {
|
|
44
54
|
return { error }
|
|
@@ -46,30 +56,14 @@ class CatchBoundaryImpl extends React.Component<{
|
|
|
46
56
|
reset() {
|
|
47
57
|
this.setState({ error: null })
|
|
48
58
|
}
|
|
49
|
-
componentDidUpdate(
|
|
50
|
-
prevProps: Readonly<{
|
|
51
|
-
getResetKey: () => string
|
|
52
|
-
children: (props: { error: any; reset: () => void }) => any
|
|
53
|
-
onCatch?: ((error: any, info: any) => void) | undefined
|
|
54
|
-
}>,
|
|
55
|
-
prevState: any,
|
|
56
|
-
): void {
|
|
57
|
-
if (prevState.error && prevState.resetKey !== this.state.resetKey) {
|
|
58
|
-
this.reset()
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
59
|
componentDidCatch(error: Error, errorInfo: ErrorInfo) {
|
|
62
60
|
if (this.props.onCatch) {
|
|
63
61
|
this.props.onCatch(error, errorInfo)
|
|
64
62
|
}
|
|
65
63
|
}
|
|
66
64
|
render() {
|
|
67
|
-
// If the resetKey has changed, don't render the error
|
|
68
65
|
return this.props.children({
|
|
69
|
-
error:
|
|
70
|
-
this.state.resetKey !== this.props.getResetKey()
|
|
71
|
-
? null
|
|
72
|
-
: this.state.error,
|
|
66
|
+
error: this.state.error,
|
|
73
67
|
reset: () => {
|
|
74
68
|
this.reset()
|
|
75
69
|
},
|
package/src/Match.tsx
CHANGED
|
@@ -259,6 +259,22 @@ export const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
259
259
|
}): any {
|
|
260
260
|
const router = useRouter()
|
|
261
261
|
|
|
262
|
+
const getMatchPromise = (
|
|
263
|
+
match: {
|
|
264
|
+
id: string
|
|
265
|
+
_nonReactive: {
|
|
266
|
+
displayPendingPromise?: Promise<void>
|
|
267
|
+
minPendingPromise?: Promise<void>
|
|
268
|
+
loadPromise?: Promise<void>
|
|
269
|
+
}
|
|
270
|
+
},
|
|
271
|
+
key: 'displayPendingPromise' | 'minPendingPromise' | 'loadPromise',
|
|
272
|
+
) => {
|
|
273
|
+
return (
|
|
274
|
+
router.getMatch(match.id)?._nonReactive[key] ?? match._nonReactive[key]
|
|
275
|
+
)
|
|
276
|
+
}
|
|
277
|
+
|
|
262
278
|
if (isServer ?? router.isServer) {
|
|
263
279
|
const match = router.stores.activeMatchStoresById.get(matchId)?.state
|
|
264
280
|
if (!match) {
|
|
@@ -287,15 +303,15 @@ export const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
287
303
|
const out = Comp ? <Comp key={key} /> : <Outlet />
|
|
288
304
|
|
|
289
305
|
if (match._displayPending) {
|
|
290
|
-
throw
|
|
306
|
+
throw getMatchPromise(match, 'displayPendingPromise')
|
|
291
307
|
}
|
|
292
308
|
|
|
293
309
|
if (match._forcePending) {
|
|
294
|
-
throw
|
|
310
|
+
throw getMatchPromise(match, 'minPendingPromise')
|
|
295
311
|
}
|
|
296
312
|
|
|
297
313
|
if (match.status === 'pending') {
|
|
298
|
-
throw
|
|
314
|
+
throw getMatchPromise(match, 'loadPromise')
|
|
299
315
|
}
|
|
300
316
|
|
|
301
317
|
if (match.status === 'notFound') {
|
|
@@ -317,7 +333,7 @@ export const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
317
333
|
|
|
318
334
|
invariant()
|
|
319
335
|
}
|
|
320
|
-
throw
|
|
336
|
+
throw getMatchPromise(match, 'loadPromise')
|
|
321
337
|
}
|
|
322
338
|
|
|
323
339
|
if (match.status === 'error') {
|
|
@@ -384,11 +400,11 @@ export const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
384
400
|
}, [key, route.options.component, router.options.defaultComponent])
|
|
385
401
|
|
|
386
402
|
if (match._displayPending) {
|
|
387
|
-
throw
|
|
403
|
+
throw getMatchPromise(match, 'displayPendingPromise')
|
|
388
404
|
}
|
|
389
405
|
|
|
390
406
|
if (match._forcePending) {
|
|
391
|
-
throw
|
|
407
|
+
throw getMatchPromise(match, 'minPendingPromise')
|
|
392
408
|
}
|
|
393
409
|
|
|
394
410
|
// see also hydrate() in packages/router-core/src/ssr/ssr-client.ts
|
|
@@ -413,7 +429,7 @@ export const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
413
429
|
}
|
|
414
430
|
}
|
|
415
431
|
}
|
|
416
|
-
throw
|
|
432
|
+
throw getMatchPromise(match, 'loadPromise')
|
|
417
433
|
}
|
|
418
434
|
|
|
419
435
|
if (match.status === 'notFound') {
|
|
@@ -428,8 +444,10 @@ export const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
428
444
|
}
|
|
429
445
|
|
|
430
446
|
if (match.status === 'redirected') {
|
|
431
|
-
//
|
|
432
|
-
//
|
|
447
|
+
// A match can be observed as redirected during an in-flight transition,
|
|
448
|
+
// especially when pending UI is already rendering. Suspend on the match's
|
|
449
|
+
// load promise so React can abandon this stale render and continue the
|
|
450
|
+
// redirect transition.
|
|
433
451
|
if (!isRedirect(match.error)) {
|
|
434
452
|
if (process.env.NODE_ENV !== 'production') {
|
|
435
453
|
throw new Error('Invariant failed: Expected a redirect error')
|
|
@@ -438,11 +456,7 @@ export const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
438
456
|
invariant()
|
|
439
457
|
}
|
|
440
458
|
|
|
441
|
-
|
|
442
|
-
// false,
|
|
443
|
-
// 'Tried to render a redirected route match! This is a weird circumstance, please file an issue!',
|
|
444
|
-
// )
|
|
445
|
-
throw router.getMatch(match.id)?._nonReactive.loadPromise
|
|
459
|
+
throw getMatchPromise(match, 'loadPromise')
|
|
446
460
|
}
|
|
447
461
|
|
|
448
462
|
if (match.status === 'error') {
|
package/src/Matches.tsx
CHANGED
|
@@ -22,11 +22,8 @@ import type {
|
|
|
22
22
|
MakeRouteMatchUnion,
|
|
23
23
|
MaskOptions,
|
|
24
24
|
MatchRouteOptions,
|
|
25
|
-
NoInfer,
|
|
26
25
|
RegisteredRouter,
|
|
27
|
-
ResolveRelativePath,
|
|
28
26
|
ResolveRoute,
|
|
29
|
-
RouteByPath,
|
|
30
27
|
ToSubOptionsProps,
|
|
31
28
|
} from '@tanstack/router-core'
|
|
32
29
|
|
|
@@ -180,10 +177,9 @@ export type MakeMatchRouteOptions<
|
|
|
180
177
|
// 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
|
|
181
178
|
children?:
|
|
182
179
|
| ((
|
|
183
|
-
params?:
|
|
184
|
-
TRouter['
|
|
185
|
-
|
|
186
|
-
>['types']['allParams'],
|
|
180
|
+
params?: Expand<
|
|
181
|
+
ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']
|
|
182
|
+
>,
|
|
187
183
|
) => React.ReactNode)
|
|
188
184
|
| React.ReactNode
|
|
189
185
|
}
|