@tanstack/react-router 1.121.0-alpha.22 → 1.121.0-alpha.28
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/Asset.cjs +83 -16
- package/dist/cjs/Asset.cjs.map +1 -1
- package/dist/cjs/Asset.d.cts +2 -1
- package/dist/cjs/CatchBoundary.cjs.map +1 -1
- package/dist/cjs/ClientOnly.cjs.map +1 -1
- package/dist/cjs/ClientOnly.d.cts +1 -1
- package/dist/cjs/HeadContent.cjs +19 -17
- package/dist/cjs/HeadContent.cjs.map +1 -1
- package/dist/cjs/Match.cjs +61 -57
- package/dist/cjs/Match.cjs.map +1 -1
- package/dist/cjs/Matches.cjs +14 -16
- package/dist/cjs/Matches.cjs.map +1 -1
- package/dist/cjs/Matches.d.cts +2 -2
- package/dist/cjs/RouterProvider.cjs.map +1 -1
- package/dist/cjs/SafeFragment.cjs.map +1 -1
- package/dist/cjs/ScriptOnce.cjs +3 -10
- package/dist/cjs/ScriptOnce.cjs.map +1 -1
- package/dist/cjs/ScriptOnce.d.cts +1 -1
- package/dist/cjs/Scripts.cjs +7 -11
- package/dist/cjs/Scripts.cjs.map +1 -1
- package/dist/cjs/ScrollRestoration.cjs +3 -4
- package/dist/cjs/ScrollRestoration.cjs.map +1 -1
- package/dist/cjs/Transitioner.cjs +16 -15
- package/dist/cjs/Transitioner.cjs.map +1 -1
- package/dist/cjs/awaited.cjs.map +1 -1
- package/dist/cjs/fileRoute.cjs +8 -8
- package/dist/cjs/fileRoute.cjs.map +1 -1
- package/dist/cjs/index.cjs +0 -12
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.d.cts +4 -8
- package/dist/cjs/lazyRouteComponent.cjs +3 -16
- package/dist/cjs/lazyRouteComponent.cjs.map +1 -1
- package/dist/cjs/lazyRouteComponent.d.cts +1 -1
- package/dist/cjs/link.cjs +106 -74
- package/dist/cjs/link.cjs.map +1 -1
- package/dist/cjs/link.d.cts +1 -5
- package/dist/cjs/matchContext.cjs.map +1 -1
- package/dist/cjs/not-found.cjs +2 -4
- package/dist/cjs/not-found.cjs.map +1 -1
- package/dist/cjs/renderRouteNotFound.cjs.map +1 -1
- package/dist/cjs/route.cjs +21 -21
- package/dist/cjs/route.cjs.map +1 -1
- package/dist/cjs/route.d.cts +14 -6
- package/dist/cjs/router.cjs.map +1 -1
- package/dist/cjs/routerContext.cjs.map +1 -1
- package/dist/cjs/scroll-restoration.cjs +9 -3
- package/dist/cjs/scroll-restoration.cjs.map +1 -1
- package/dist/cjs/ssr/RouterClient.cjs +25 -0
- package/dist/cjs/ssr/RouterClient.cjs.map +1 -0
- package/dist/cjs/ssr/RouterClient.d.cts +4 -0
- package/dist/cjs/ssr/RouterServer.cjs +9 -0
- package/dist/cjs/ssr/RouterServer.cjs.map +1 -0
- package/dist/cjs/ssr/RouterServer.d.cts +4 -0
- package/dist/cjs/ssr/client.cjs +12 -0
- package/dist/cjs/ssr/client.cjs.map +1 -0
- package/dist/cjs/ssr/client.d.cts +2 -0
- package/dist/cjs/ssr/defaultRenderHandler.cjs +15 -0
- package/dist/cjs/ssr/defaultRenderHandler.cjs.map +1 -0
- package/dist/cjs/ssr/defaultRenderHandler.d.cts +1 -0
- package/dist/cjs/ssr/defaultStreamHandler.cjs +16 -0
- package/dist/cjs/ssr/defaultStreamHandler.cjs.map +1 -0
- package/dist/cjs/ssr/defaultStreamHandler.d.cts +1 -0
- package/dist/cjs/ssr/renderRouterToStream.cjs +63 -0
- package/dist/cjs/ssr/renderRouterToStream.cjs.map +1 -0
- package/dist/cjs/ssr/renderRouterToStream.d.cts +8 -0
- package/dist/cjs/ssr/renderRouterToString.cjs +28 -0
- package/dist/cjs/ssr/renderRouterToString.cjs.map +1 -0
- package/dist/cjs/ssr/renderRouterToString.d.cts +7 -0
- package/dist/cjs/ssr/server.cjs +20 -0
- package/dist/cjs/ssr/server.cjs.map +1 -0
- package/dist/cjs/ssr/server.d.cts +6 -0
- package/dist/cjs/useBlocker.cjs.map +1 -1
- package/dist/cjs/useCanGoBack.cjs.map +1 -1
- package/dist/cjs/useLoaderData.cjs.map +1 -1
- package/dist/cjs/useLoaderDeps.cjs.map +1 -1
- package/dist/cjs/useLocation.cjs +1 -1
- package/dist/cjs/useLocation.cjs.map +1 -1
- package/dist/cjs/useMatch.cjs.map +1 -1
- package/dist/cjs/useNavigate.cjs +2 -2
- package/dist/cjs/useNavigate.cjs.map +1 -1
- package/dist/cjs/useParams.cjs.map +1 -1
- package/dist/cjs/useRouter.cjs +1 -1
- package/dist/cjs/useRouter.cjs.map +1 -1
- package/dist/cjs/useRouterState.cjs +3 -3
- package/dist/cjs/useRouterState.cjs.map +1 -1
- package/dist/cjs/useSearch.cjs.map +1 -1
- package/dist/cjs/utils.cjs +4 -10
- package/dist/cjs/utils.cjs.map +1 -1
- package/dist/cjs/utils.d.cts +1 -1
- package/dist/esm/Asset.d.ts +2 -1
- package/dist/esm/Asset.js +66 -16
- package/dist/esm/Asset.js.map +1 -1
- package/dist/esm/CatchBoundary.js.map +1 -1
- package/dist/esm/ClientOnly.d.ts +1 -1
- package/dist/esm/ClientOnly.js.map +1 -1
- package/dist/esm/HeadContent.js +19 -17
- package/dist/esm/HeadContent.js.map +1 -1
- package/dist/esm/Match.js +63 -59
- package/dist/esm/Match.js.map +1 -1
- package/dist/esm/Matches.d.ts +2 -2
- package/dist/esm/Matches.js +14 -16
- package/dist/esm/Matches.js.map +1 -1
- package/dist/esm/RouterProvider.js.map +1 -1
- package/dist/esm/SafeFragment.js.map +1 -1
- package/dist/esm/ScriptOnce.d.ts +1 -1
- package/dist/esm/ScriptOnce.js +3 -10
- package/dist/esm/ScriptOnce.js.map +1 -1
- package/dist/esm/Scripts.js +7 -11
- package/dist/esm/Scripts.js.map +1 -1
- package/dist/esm/ScrollRestoration.js +3 -4
- package/dist/esm/ScrollRestoration.js.map +1 -1
- package/dist/esm/Transitioner.js +16 -15
- package/dist/esm/Transitioner.js.map +1 -1
- package/dist/esm/awaited.js.map +1 -1
- package/dist/esm/fileRoute.js +8 -8
- package/dist/esm/fileRoute.js.map +1 -1
- package/dist/esm/index.d.ts +4 -8
- package/dist/esm/index.js +2 -8
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/lazyRouteComponent.d.ts +1 -1
- package/dist/esm/lazyRouteComponent.js +2 -15
- package/dist/esm/lazyRouteComponent.js.map +1 -1
- package/dist/esm/link.d.ts +1 -5
- package/dist/esm/link.js +107 -75
- package/dist/esm/link.js.map +1 -1
- package/dist/esm/matchContext.js.map +1 -1
- package/dist/esm/not-found.js +2 -4
- package/dist/esm/not-found.js.map +1 -1
- package/dist/esm/renderRouteNotFound.js.map +1 -1
- package/dist/esm/route.d.ts +14 -6
- package/dist/esm/route.js +21 -21
- package/dist/esm/route.js.map +1 -1
- package/dist/esm/router.js.map +1 -1
- package/dist/esm/routerContext.js.map +1 -1
- package/dist/esm/scroll-restoration.js +9 -3
- package/dist/esm/scroll-restoration.js.map +1 -1
- package/dist/esm/ssr/RouterClient.d.ts +4 -0
- package/dist/esm/ssr/RouterClient.js +25 -0
- package/dist/esm/ssr/RouterClient.js.map +1 -0
- package/dist/esm/ssr/RouterServer.d.ts +4 -0
- package/dist/esm/ssr/RouterServer.js +9 -0
- package/dist/esm/ssr/RouterServer.js.map +1 -0
- package/dist/esm/ssr/client.d.ts +2 -0
- package/dist/esm/ssr/client.js +6 -0
- package/dist/esm/ssr/client.js.map +1 -0
- package/dist/esm/ssr/defaultRenderHandler.d.ts +1 -0
- package/dist/esm/ssr/defaultRenderHandler.js +15 -0
- package/dist/esm/ssr/defaultRenderHandler.js.map +1 -0
- package/dist/esm/ssr/defaultStreamHandler.d.ts +1 -0
- package/dist/esm/ssr/defaultStreamHandler.js +16 -0
- package/dist/esm/ssr/defaultStreamHandler.js.map +1 -0
- package/dist/esm/ssr/renderRouterToStream.d.ts +8 -0
- package/dist/esm/ssr/renderRouterToStream.js +63 -0
- package/dist/esm/ssr/renderRouterToStream.js.map +1 -0
- package/dist/esm/ssr/renderRouterToString.d.ts +7 -0
- package/dist/esm/ssr/renderRouterToString.js +28 -0
- package/dist/esm/ssr/renderRouterToString.js.map +1 -0
- package/dist/esm/ssr/server.d.ts +6 -0
- package/dist/esm/ssr/server.js +14 -0
- package/dist/esm/ssr/server.js.map +1 -0
- package/dist/esm/useBlocker.js.map +1 -1
- package/dist/esm/useCanGoBack.js.map +1 -1
- package/dist/esm/useLoaderData.js.map +1 -1
- package/dist/esm/useLoaderDeps.js.map +1 -1
- package/dist/esm/useLocation.js +1 -1
- package/dist/esm/useLocation.js.map +1 -1
- package/dist/esm/useMatch.js.map +1 -1
- package/dist/esm/useNavigate.js +2 -2
- package/dist/esm/useNavigate.js.map +1 -1
- package/dist/esm/useParams.js.map +1 -1
- package/dist/esm/useRouter.js +1 -1
- package/dist/esm/useRouter.js.map +1 -1
- package/dist/esm/useRouterState.js +3 -3
- package/dist/esm/useRouterState.js.map +1 -1
- package/dist/esm/useSearch.js.map +1 -1
- package/dist/esm/utils.d.ts +1 -1
- package/dist/esm/utils.js +4 -10
- package/dist/esm/utils.js.map +1 -1
- package/dist/llms/index.d.ts +3 -0
- package/dist/llms/index.js +35 -0
- package/dist/llms/rules/api.d.ts +2 -0
- package/dist/llms/rules/api.js +4326 -0
- package/dist/llms/rules/guide.d.ts +2 -0
- package/dist/llms/rules/guide.js +7096 -0
- package/dist/llms/rules/routing.d.ts +2 -0
- package/dist/llms/rules/routing.js +1981 -0
- package/dist/llms/rules/setup-and-architecture.d.ts +2 -0
- package/dist/llms/rules/setup-and-architecture.js +945 -0
- package/package.json +32 -6
- package/src/Asset.tsx +95 -16
- package/src/ClientOnly.tsx +1 -1
- package/src/HeadContent.tsx +16 -0
- package/src/Match.tsx +86 -63
- package/src/Matches.tsx +24 -17
- package/src/ScriptOnce.tsx +2 -14
- package/src/Transitioner.tsx +13 -14
- package/src/index.tsx +3 -21
- package/src/lazyRouteComponent.tsx +6 -31
- package/src/link.tsx +130 -99
- package/src/not-found.tsx +1 -1
- package/src/route.tsx +18 -9
- package/src/scroll-restoration.tsx +10 -3
- package/src/ssr/RouterClient.tsx +22 -0
- package/src/ssr/RouterServer.tsx +9 -0
- package/src/ssr/client.ts +2 -0
- package/src/ssr/defaultRenderHandler.tsx +12 -0
- package/src/ssr/defaultStreamHandler.tsx +13 -0
- package/src/ssr/renderRouterToStream.tsx +79 -0
- package/src/ssr/renderRouterToString.tsx +31 -0
- package/src/ssr/server.ts +6 -0
- package/src/utils.ts +6 -14
- package/dist/cjs/serializer.d.cts +0 -6
- package/dist/esm/serializer.d.ts +0 -6
- package/src/serializer.ts +0 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeadContent.js","sources":["../../src/HeadContent.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Asset } from './Asset'\nimport { useRouter } from './useRouter'\nimport { useRouterState } from './useRouterState'\nimport type { RouterManagedTag } from '@tanstack/router-core'\n\nexport const useTags = () => {\n const router = useRouter()\n\n const routeMeta = useRouterState({\n select: (state) => {\n return state.matches.map((match) => match.meta!).filter(Boolean)\n },\n })\n\n const meta: Array<RouterManagedTag> = React.useMemo(() => {\n const resultMeta: Array<RouterManagedTag> = []\n const metaByAttribute: Record<string, true> = {}\n let title: RouterManagedTag | undefined\n ;[...routeMeta].reverse().forEach((metas) => {\n ;[...metas].reverse().forEach((m) => {\n if (!m) return\n\n if (m.title) {\n if (!title) {\n title = {\n tag: 'title',\n children: m.title,\n }\n }\n } else {\n const attribute = m.name ?? m.property\n if (attribute) {\n if (metaByAttribute[attribute]) {\n return\n } else {\n metaByAttribute[attribute] = true\n }\n }\n\n resultMeta.push({\n tag: 'meta',\n attrs: {\n ...m,\n },\n })\n }\n })\n })\n\n if (title) {\n resultMeta.push(title)\n }\n\n resultMeta.reverse()\n\n return resultMeta\n }, [routeMeta])\n\n const links = useRouterState({\n select: (state) => {\n const constructed = state.matches\n .map((match) => match.links!)\n .filter(Boolean)\n .flat(1)\n .map((link) => ({\n tag: 'link',\n attrs: {\n ...link,\n },\n })) satisfies Array<RouterManagedTag>\n\n const manifest = router.ssr?.manifest\n\n // These are the assets extracted from the ViteManifest\n // using the `startManifestPlugin`\n const assets = state.matches\n .map((match) => manifest?.routes[match.routeId]?.assets ?? [])\n .filter(Boolean)\n .flat(1)\n .filter((asset) => asset.tag === 'link')\n .map(\n (asset) =>\n ({\n tag: 'link',\n attrs: {\n ...asset.attrs,\n suppressHydrationWarning: true,\n },\n }) satisfies RouterManagedTag,\n )\n\n return [...constructed, ...assets]\n },\n structuralSharing: true as any,\n })\n\n const preloadMeta = useRouterState({\n select: (state) => {\n const preloadMeta: Array<RouterManagedTag> = []\n\n state.matches\n .map((match) => router.looseRoutesById[match.routeId]!)\n .forEach((route) =>\n router.ssr?.manifest?.routes[route.id]?.preloads\n ?.filter(Boolean)\n .forEach((preload) => {\n preloadMeta.push({\n tag: 'link',\n attrs: {\n rel: 'modulepreload',\n href: preload,\n },\n })\n }),\n )\n\n return preloadMeta\n },\n structuralSharing: true as any,\n })\n\n const headScripts = useRouterState({\n select: (state) =>\n (\n state.matches\n .map((match) => match.headScripts!)\n .flat(1)\n .filter(Boolean) as Array<RouterManagedTag>\n ).map(({ children, ...script }) => ({\n tag: 'script',\n attrs: {\n ...script,\n },\n children,\n })),\n structuralSharing: true as any,\n })\n\n return uniqBy(\n [\n ...meta,\n ...preloadMeta,\n ...links,\n ...headScripts,\n ] as Array<RouterManagedTag>,\n (d) => {\n return JSON.stringify(d)\n },\n )\n}\n\n/**\n * @description The `HeadContent` component is used to render meta tags, links, and scripts for the current route.\n * It should be rendered in the `<head>` of your document.\n */\nexport function HeadContent() {\n const tags = useTags()\n return tags.map((tag) => (\n <Asset {...tag} key={`tsr-meta-${JSON.stringify(tag)}`} />\n ))\n}\n\nfunction uniqBy<T>(arr: Array<T>, fn: (item: T) => string) {\n const seen = new Set<string>()\n return arr.filter((item) => {\n const key = fn(item)\n if (seen.has(key)) {\n return false\n }\n seen.add(key)\n return true\n })\n}\n"],"names":["
|
|
1
|
+
{"version":3,"file":"HeadContent.js","sources":["../../src/HeadContent.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Asset } from './Asset'\nimport { useRouter } from './useRouter'\nimport { useRouterState } from './useRouterState'\nimport type { RouterManagedTag } from '@tanstack/router-core'\n\nexport const useTags = () => {\n const router = useRouter()\n\n const routeMeta = useRouterState({\n select: (state) => {\n return state.matches.map((match) => match.meta!).filter(Boolean)\n },\n })\n\n const meta: Array<RouterManagedTag> = React.useMemo(() => {\n const resultMeta: Array<RouterManagedTag> = []\n const metaByAttribute: Record<string, true> = {}\n let title: RouterManagedTag | undefined\n ;[...routeMeta].reverse().forEach((metas) => {\n ;[...metas].reverse().forEach((m) => {\n if (!m) return\n\n if (m.title) {\n if (!title) {\n title = {\n tag: 'title',\n children: m.title,\n }\n }\n } else {\n const attribute = m.name ?? m.property\n if (attribute) {\n if (metaByAttribute[attribute]) {\n return\n } else {\n metaByAttribute[attribute] = true\n }\n }\n\n resultMeta.push({\n tag: 'meta',\n attrs: {\n ...m,\n },\n })\n }\n })\n })\n\n if (title) {\n resultMeta.push(title)\n }\n\n resultMeta.reverse()\n\n return resultMeta\n }, [routeMeta])\n\n const links = useRouterState({\n select: (state) => {\n const constructed = state.matches\n .map((match) => match.links!)\n .filter(Boolean)\n .flat(1)\n .map((link) => ({\n tag: 'link',\n attrs: {\n ...link,\n },\n })) satisfies Array<RouterManagedTag>\n\n const manifest = router.ssr?.manifest\n\n // These are the assets extracted from the ViteManifest\n // using the `startManifestPlugin`\n const assets = state.matches\n .map((match) => manifest?.routes[match.routeId]?.assets ?? [])\n .filter(Boolean)\n .flat(1)\n .filter((asset) => asset.tag === 'link')\n .map(\n (asset) =>\n ({\n tag: 'link',\n attrs: {\n ...asset.attrs,\n suppressHydrationWarning: true,\n },\n }) satisfies RouterManagedTag,\n )\n\n return [...constructed, ...assets]\n },\n structuralSharing: true as any,\n })\n\n const preloadMeta = useRouterState({\n select: (state) => {\n const preloadMeta: Array<RouterManagedTag> = []\n\n state.matches\n .map((match) => router.looseRoutesById[match.routeId]!)\n .forEach((route) =>\n router.ssr?.manifest?.routes[route.id]?.preloads\n ?.filter(Boolean)\n .forEach((preload) => {\n preloadMeta.push({\n tag: 'link',\n attrs: {\n rel: 'modulepreload',\n href: preload,\n },\n })\n }),\n )\n\n return preloadMeta\n },\n structuralSharing: true as any,\n })\n\n const styles = useRouterState({\n select: (state) =>\n (\n state.matches\n .map((match) => match.styles!)\n .flat(1)\n .filter(Boolean) as Array<RouterManagedTag>\n ).map(({ children, ...attrs }) => ({\n tag: 'style',\n attrs,\n children,\n })),\n structuralSharing: true as any,\n })\n\n const headScripts = useRouterState({\n select: (state) =>\n (\n state.matches\n .map((match) => match.headScripts!)\n .flat(1)\n .filter(Boolean) as Array<RouterManagedTag>\n ).map(({ children, ...script }) => ({\n tag: 'script',\n attrs: {\n ...script,\n },\n children,\n })),\n structuralSharing: true as any,\n })\n\n return uniqBy(\n [\n ...meta,\n ...preloadMeta,\n ...links,\n ...styles,\n ...headScripts,\n ] as Array<RouterManagedTag>,\n (d) => {\n return JSON.stringify(d)\n },\n )\n}\n\n/**\n * @description The `HeadContent` component is used to render meta tags, links, and scripts for the current route.\n * It should be rendered in the `<head>` of your document.\n */\nexport function HeadContent() {\n const tags = useTags()\n return tags.map((tag) => (\n <Asset {...tag} key={`tsr-meta-${JSON.stringify(tag)}`} />\n ))\n}\n\nfunction uniqBy<T>(arr: Array<T>, fn: (item: T) => string) {\n const seen = new Set<string>()\n return arr.filter((item) => {\n const key = fn(item)\n if (seen.has(key)) {\n return false\n }\n seen.add(key)\n return true\n })\n}\n"],"names":["preloadMeta"],"mappings":"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"}
|
package/dist/esm/Match.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { jsxs,
|
|
1
|
+
import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import invariant from "tiny-invariant";
|
|
4
4
|
import warning from "tiny-warning";
|
|
5
|
-
import { isNotFound, rootRouteId, pick,
|
|
5
|
+
import { isNotFound, rootRouteId, pick, createControlledPromise, isRedirect, getLocationChangeInfo } from "@tanstack/router-core";
|
|
6
6
|
import { CatchBoundary, ErrorComponent } from "./CatchBoundary.js";
|
|
7
7
|
import { useRouterState } from "./useRouterState.js";
|
|
8
8
|
import { useRouter } from "./useRouter.js";
|
|
@@ -11,33 +11,35 @@ import { matchContext } from "./matchContext.js";
|
|
|
11
11
|
import { SafeFragment } from "./SafeFragment.js";
|
|
12
12
|
import { renderRouteNotFound } from "./renderRouteNotFound.js";
|
|
13
13
|
import { ScrollRestoration } from "./scroll-restoration.js";
|
|
14
|
+
import { ClientOnly } from "./ClientOnly.js";
|
|
14
15
|
const Match = React.memo(function MatchImpl({
|
|
15
16
|
matchId
|
|
16
17
|
}) {
|
|
17
|
-
var _a, _b;
|
|
18
18
|
const router = useRouter();
|
|
19
|
-
const
|
|
19
|
+
const matchState = useRouterState({
|
|
20
20
|
select: (s) => {
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
21
|
+
const match = s.matches.find((d) => d.id === matchId);
|
|
22
|
+
invariant(
|
|
23
|
+
match,
|
|
24
|
+
`Could not find match for matchId "${matchId}". Please file an issue!`
|
|
25
|
+
);
|
|
26
|
+
return pick(match, ["routeId", "ssr", "_displayPending"]);
|
|
27
|
+
},
|
|
28
|
+
structuralSharing: true
|
|
24
29
|
});
|
|
25
|
-
|
|
26
|
-
routeId,
|
|
27
|
-
`Could not find routeId for matchId "${matchId}". Please file an issue!`
|
|
28
|
-
);
|
|
29
|
-
const route = router.routesById[routeId];
|
|
30
|
+
const route = router.routesById[matchState.routeId];
|
|
30
31
|
const PendingComponent = route.options.pendingComponent ?? router.options.defaultPendingComponent;
|
|
31
32
|
const pendingElement = PendingComponent ? /* @__PURE__ */ jsx(PendingComponent, {}) : null;
|
|
32
33
|
const routeErrorComponent = route.options.errorComponent ?? router.options.defaultErrorComponent;
|
|
33
34
|
const routeOnCatch = route.options.onCatch ?? router.options.defaultOnCatch;
|
|
34
35
|
const routeNotFoundComponent = route.isRoot ? (
|
|
35
36
|
// If it's the root route, use the globalNotFound option, with fallback to the notFoundRoute's component
|
|
36
|
-
route.options.notFoundComponent ??
|
|
37
|
+
route.options.notFoundComponent ?? router.options.notFoundRoute?.options.component
|
|
37
38
|
) : route.options.notFoundComponent;
|
|
39
|
+
const resolvedNoSsr = matchState.ssr === false || matchState.ssr === "data-only";
|
|
38
40
|
const ResolvedSuspenseBoundary = (
|
|
39
41
|
// If we're on the root route, allow forcefully wrapping in suspense
|
|
40
|
-
(!route.isRoot || route.options.wrapInSuspense) && (route.options.wrapInSuspense ?? PendingComponent ?? (
|
|
42
|
+
(!route.isRoot || route.options.wrapInSuspense || resolvedNoSsr) && (route.options.wrapInSuspense ?? PendingComponent ?? (route.options.errorComponent?.preload || resolvedNoSsr)) ? React.Suspense : SafeFragment
|
|
41
43
|
);
|
|
42
44
|
const ResolvedCatchBoundary = routeErrorComponent ? CatchBoundary : SafeFragment;
|
|
43
45
|
const ResolvedNotFoundBoundary = routeNotFoundComponent ? CatchNotFound : SafeFragment;
|
|
@@ -46,12 +48,12 @@ const Match = React.memo(function MatchImpl({
|
|
|
46
48
|
});
|
|
47
49
|
const parentRouteId = useRouterState({
|
|
48
50
|
select: (s) => {
|
|
49
|
-
var _a2;
|
|
50
51
|
const index = s.matches.findIndex((d) => d.id === matchId);
|
|
51
|
-
return
|
|
52
|
+
return s.matches[index - 1]?.routeId;
|
|
52
53
|
}
|
|
53
54
|
});
|
|
54
|
-
|
|
55
|
+
const ShellComponent = route.isRoot ? route.options.shellComponent ?? SafeFragment : SafeFragment;
|
|
56
|
+
return /* @__PURE__ */ jsxs(ShellComponent, { children: [
|
|
55
57
|
/* @__PURE__ */ jsx(matchContext.Provider, { value: matchId, children: /* @__PURE__ */ jsx(ResolvedSuspenseBoundary, { fallback: pendingElement, children: /* @__PURE__ */ jsx(
|
|
56
58
|
ResolvedCatchBoundary,
|
|
57
59
|
{
|
|
@@ -60,17 +62,17 @@ const Match = React.memo(function MatchImpl({
|
|
|
60
62
|
onCatch: (error, errorInfo) => {
|
|
61
63
|
if (isNotFound(error)) throw error;
|
|
62
64
|
warning(false, `Error in route match: ${matchId}`);
|
|
63
|
-
routeOnCatch
|
|
65
|
+
routeOnCatch?.(error, errorInfo);
|
|
64
66
|
},
|
|
65
67
|
children: /* @__PURE__ */ jsx(
|
|
66
68
|
ResolvedNotFoundBoundary,
|
|
67
69
|
{
|
|
68
70
|
fallback: (error) => {
|
|
69
|
-
if (!routeNotFoundComponent || error.routeId && error.routeId !== routeId || !error.routeId && !route.isRoot)
|
|
71
|
+
if (!routeNotFoundComponent || error.routeId && error.routeId !== matchState.routeId || !error.routeId && !route.isRoot)
|
|
70
72
|
throw error;
|
|
71
73
|
return React.createElement(routeNotFoundComponent, error);
|
|
72
74
|
},
|
|
73
|
-
children: /* @__PURE__ */ jsx(MatchInner, { matchId })
|
|
75
|
+
children: resolvedNoSsr || matchState._displayPending ? /* @__PURE__ */ jsx(ClientOnly, { fallback: pendingElement, children: /* @__PURE__ */ jsx(MatchInner, { matchId }) }) : /* @__PURE__ */ jsx(MatchInner, { matchId })
|
|
74
76
|
}
|
|
75
77
|
)
|
|
76
78
|
}
|
|
@@ -100,13 +102,12 @@ function OnRendered() {
|
|
|
100
102
|
}
|
|
101
103
|
}
|
|
102
104
|
},
|
|
103
|
-
router.latestLocation.state.
|
|
105
|
+
router.latestLocation.state.__TSR_key
|
|
104
106
|
);
|
|
105
107
|
}
|
|
106
108
|
const MatchInner = React.memo(function MatchInnerImpl({
|
|
107
109
|
matchId
|
|
108
110
|
}) {
|
|
109
|
-
var _a, _b, _c;
|
|
110
111
|
const router = useRouter();
|
|
111
112
|
const { match, key, routeId } = useRouterState({
|
|
112
113
|
select: (s) => {
|
|
@@ -114,7 +115,7 @@ const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
114
115
|
const match2 = s.matches[matchIndex];
|
|
115
116
|
const routeId2 = match2.routeId;
|
|
116
117
|
const remountFn = router.routesById[routeId2].options.remountDeps ?? router.options.defaultRemountDeps;
|
|
117
|
-
const remountDeps = remountFn
|
|
118
|
+
const remountDeps = remountFn?.({
|
|
118
119
|
routeId: routeId2,
|
|
119
120
|
loaderDeps: match2.loaderDeps,
|
|
120
121
|
params: match2._strictParams,
|
|
@@ -124,7 +125,13 @@ const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
124
125
|
return {
|
|
125
126
|
key: key2,
|
|
126
127
|
routeId: routeId2,
|
|
127
|
-
match: pick(match2, [
|
|
128
|
+
match: pick(match2, [
|
|
129
|
+
"id",
|
|
130
|
+
"status",
|
|
131
|
+
"error",
|
|
132
|
+
"_forcePending",
|
|
133
|
+
"_displayPending"
|
|
134
|
+
])
|
|
128
135
|
};
|
|
129
136
|
},
|
|
130
137
|
structuralSharing: true
|
|
@@ -137,33 +144,15 @@ const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
137
144
|
}
|
|
138
145
|
return /* @__PURE__ */ jsx(Outlet, {});
|
|
139
146
|
}, [key, route.options.component, router.options.defaultComponent]);
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
invariant(isNotFound(match.error), "Expected a notFound error");
|
|
143
|
-
return renderRouteNotFound(router, route, match.error);
|
|
147
|
+
if (match._displayPending) {
|
|
148
|
+
throw router.getMatch(match.id)?.displayPendingPromise;
|
|
144
149
|
}
|
|
145
|
-
if (match.
|
|
146
|
-
|
|
147
|
-
throw (_a = router.getMatch(match.id)) == null ? void 0 : _a.loadPromise;
|
|
148
|
-
}
|
|
149
|
-
if (match.status === "error") {
|
|
150
|
-
if (router.isServer) {
|
|
151
|
-
return /* @__PURE__ */ jsx(
|
|
152
|
-
RouteErrorComponent,
|
|
153
|
-
{
|
|
154
|
-
error: match.error,
|
|
155
|
-
reset: void 0,
|
|
156
|
-
info: {
|
|
157
|
-
componentStack: ""
|
|
158
|
-
}
|
|
159
|
-
}
|
|
160
|
-
);
|
|
161
|
-
}
|
|
162
|
-
throw match.error;
|
|
150
|
+
if (match._forcePending) {
|
|
151
|
+
throw router.getMatch(match.id)?.minPendingPromise;
|
|
163
152
|
}
|
|
164
153
|
if (match.status === "pending") {
|
|
165
154
|
const pendingMinMs = route.options.pendingMinMs ?? router.options.defaultPendingMinMs;
|
|
166
|
-
if (pendingMinMs && !
|
|
155
|
+
if (pendingMinMs && !router.getMatch(match.id)?.minPendingPromise) {
|
|
167
156
|
if (!router.isServer) {
|
|
168
157
|
const minPendingPromise = createControlledPromise();
|
|
169
158
|
Promise.resolve().then(() => {
|
|
@@ -181,7 +170,31 @@ const MatchInner = React.memo(function MatchInnerImpl({
|
|
|
181
170
|
}, pendingMinMs);
|
|
182
171
|
}
|
|
183
172
|
}
|
|
184
|
-
throw
|
|
173
|
+
throw router.getMatch(match.id)?.loadPromise;
|
|
174
|
+
}
|
|
175
|
+
if (match.status === "notFound") {
|
|
176
|
+
invariant(isNotFound(match.error), "Expected a notFound error");
|
|
177
|
+
return renderRouteNotFound(router, route, match.error);
|
|
178
|
+
}
|
|
179
|
+
if (match.status === "redirected") {
|
|
180
|
+
invariant(isRedirect(match.error), "Expected a redirect error");
|
|
181
|
+
throw router.getMatch(match.id)?.loadPromise;
|
|
182
|
+
}
|
|
183
|
+
if (match.status === "error") {
|
|
184
|
+
if (router.isServer) {
|
|
185
|
+
const RouteErrorComponent = (route.options.errorComponent ?? router.options.defaultErrorComponent) || ErrorComponent;
|
|
186
|
+
return /* @__PURE__ */ jsx(
|
|
187
|
+
RouteErrorComponent,
|
|
188
|
+
{
|
|
189
|
+
error: match.error,
|
|
190
|
+
reset: void 0,
|
|
191
|
+
info: {
|
|
192
|
+
componentStack: ""
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
);
|
|
196
|
+
}
|
|
197
|
+
throw match.error;
|
|
185
198
|
}
|
|
186
199
|
return out;
|
|
187
200
|
});
|
|
@@ -189,10 +202,7 @@ const Outlet = React.memo(function OutletImpl() {
|
|
|
189
202
|
const router = useRouter();
|
|
190
203
|
const matchId = React.useContext(matchContext);
|
|
191
204
|
const routeId = useRouterState({
|
|
192
|
-
select: (s) =>
|
|
193
|
-
var _a;
|
|
194
|
-
return (_a = s.matches.find((d) => d.id === matchId)) == null ? void 0 : _a.routeId;
|
|
195
|
-
}
|
|
205
|
+
select: (s) => s.matches.find((d) => d.id === matchId)?.routeId
|
|
196
206
|
});
|
|
197
207
|
const route = router.routesById[routeId];
|
|
198
208
|
const parentGlobalNotFound = useRouterState({
|
|
@@ -208,15 +218,12 @@ const Outlet = React.memo(function OutletImpl() {
|
|
|
208
218
|
});
|
|
209
219
|
const childMatchId = useRouterState({
|
|
210
220
|
select: (s) => {
|
|
211
|
-
var _a;
|
|
212
221
|
const matches = s.matches;
|
|
213
222
|
const index = matches.findIndex((d) => d.id === matchId);
|
|
214
|
-
return
|
|
223
|
+
return matches[index + 1]?.id;
|
|
215
224
|
}
|
|
216
225
|
});
|
|
217
226
|
const pendingElement = router.options.defaultPendingComponent ? /* @__PURE__ */ jsx(router.options.defaultPendingComponent, {}) : null;
|
|
218
|
-
if (router.isShell)
|
|
219
|
-
return /* @__PURE__ */ jsx(React.Suspense, { fallback: pendingElement, children: /* @__PURE__ */ jsx(ShellInner, {}) });
|
|
220
227
|
if (parentGlobalNotFound) {
|
|
221
228
|
return renderRouteNotFound(router, route, void 0);
|
|
222
229
|
}
|
|
@@ -229,9 +236,6 @@ const Outlet = React.memo(function OutletImpl() {
|
|
|
229
236
|
}
|
|
230
237
|
return nextMatch;
|
|
231
238
|
});
|
|
232
|
-
function ShellInner() {
|
|
233
|
-
throw new Error("ShellBoundaryError");
|
|
234
|
-
}
|
|
235
239
|
export {
|
|
236
240
|
Match,
|
|
237
241
|
MatchInner,
|
package/dist/esm/Match.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Match.js","sources":["../../src/Match.tsx"],"sourcesContent":["import * as React from 'react'\nimport invariant from 'tiny-invariant'\nimport warning from 'tiny-warning'\nimport {\n createControlledPromise,\n getLocationChangeInfo,\n isNotFound,\n isRedirect,\n pick,\n rootRouteId,\n} from '@tanstack/router-core'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouterState } from './useRouterState'\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 type { AnyRoute, ParsedLocation } from '@tanstack/router-core'\n\nexport const Match = React.memo(function MatchImpl({\n matchId,\n}: {\n matchId: string\n}) {\n const router = useRouter()\n const routeId = useRouterState({\n select: (s) => s.matches.find((d) => d.id === matchId)?.routeId as string,\n })\n\n invariant(\n routeId,\n `Could not find routeId for matchId \"${matchId}\". Please file an issue!`,\n )\n\n const route: AnyRoute = router.routesById[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 ResolvedSuspenseBoundary =\n // If we're on the root route, allow forcefully wrapping in suspense\n (!route.isRoot || route.options.wrapInSuspense) &&\n (route.options.wrapInSuspense ??\n PendingComponent ??\n (route.options.errorComponent as any)?.preload)\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 resetKey = useRouterState({\n select: (s) => s.loadedAt,\n })\n\n const parentRouteId = useRouterState({\n select: (s) => {\n const index = s.matches.findIndex((d) => d.id === matchId)\n return s.matches[index - 1]?.routeId as string\n },\n })\n\n return (\n <>\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)) throw error\n warning(false, `Error in route match: ${matchId}`)\n routeOnCatch?.(error, errorInfo)\n }}\n >\n <ResolvedNotFoundBoundary\n fallback={(error) => {\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 !== routeId) ||\n (!error.routeId && !route.isRoot)\n )\n throw error\n\n return React.createElement(routeNotFoundComponent, error as any)\n }}\n >\n <MatchInner matchId={matchId} />\n </ResolvedNotFoundBoundary>\n </ResolvedCatchBoundary>\n </ResolvedSuspenseBoundary>\n </matchContext.Provider>\n {parentRouteId === rootRouteId && router.options.scrollRestoration ? (\n <>\n <OnRendered />\n <ScrollRestoration />\n </>\n ) : null}\n </>\n )\n})\n\n// On Rendered can't happen above the root layout because it actually\n// renders a dummy dom element to track the rendered state of the app.\n// We render a script tag with a key that changes based on the current\n// location state.key. Also, because it's below the root layout, it\n// allows us to fire onRendered events even after a hydration mismatch\n// error that occurred above the root layout (like bad head/link tags,\n// which is common).\nfunction OnRendered() {\n const router = useRouter()\n\n const prevLocationRef = React.useRef<undefined | ParsedLocation<{}>>(\n undefined,\n )\n\n return (\n <script\n key={router.latestLocation.state.key}\n suppressHydrationWarning\n ref={(el) => {\n if (\n el &&\n (prevLocationRef.current === undefined ||\n prevLocationRef.current.href !== router.latestLocation.href)\n ) {\n router.emit({\n type: 'onRendered',\n ...getLocationChangeInfo(router.state),\n })\n prevLocationRef.current = router.latestLocation\n }\n }}\n />\n )\n}\n\nexport const MatchInner = React.memo(function MatchInnerImpl({\n matchId,\n}: {\n matchId: string\n}): any {\n const router = useRouter()\n\n const { match, key, routeId } = useRouterState({\n select: (s) => {\n const matchIndex = s.matches.findIndex((d) => d.id === matchId)\n const match = s.matches[matchIndex]!\n const routeId = match.routeId as string\n\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\n return {\n key,\n routeId,\n match: pick(match, ['id', 'status', 'error']),\n }\n },\n structuralSharing: true as any,\n })\n\n const route = router.routesById[routeId] as AnyRoute\n\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 const RouteErrorComponent =\n (route.options.errorComponent ?? router.options.defaultErrorComponent) ||\n ErrorComponent\n\n if (match.status === 'notFound') {\n invariant(isNotFound(match.error), 'Expected a notFound error')\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 invariant(isRedirect(match.error), 'Expected a redirect error')\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)?.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 (router.isServer) {\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 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\n if (pendingMinMs && !router.getMatch(match.id)?.minPendingPromise) {\n // Create a promise that will resolve after the minPendingMs\n if (!router.isServer) {\n const minPendingPromise = createControlledPromise<void>()\n\n Promise.resolve().then(() => {\n router.updateMatch(match.id, (prev) => ({\n ...prev,\n minPendingPromise,\n }))\n })\n\n setTimeout(() => {\n minPendingPromise.resolve()\n\n // We've handled the minPendingPromise, so we can delete it\n router.updateMatch(match.id, (prev) => ({\n ...prev,\n minPendingPromise: undefined,\n }))\n }, pendingMinMs)\n }\n }\n throw router.getMatch(match.id)?.loadPromise\n }\n\n return out\n})\n\nexport const Outlet = React.memo(function OutletImpl() {\n const router = useRouter()\n const matchId = React.useContext(matchContext)\n const routeId = useRouterState({\n select: (s) => s.matches.find((d) => d.id === matchId)?.routeId as string,\n })\n\n const route = router.routesById[routeId]!\n\n const parentGlobalNotFound = useRouterState({\n select: (s) => {\n const matches = s.matches\n const parentMatch = matches.find((d) => d.id === matchId)\n invariant(\n parentMatch,\n `Could not find parent match for matchId \"${matchId}\"`,\n )\n return parentMatch.globalNotFound\n },\n })\n\n const childMatchId = useRouterState({\n select: (s) => {\n const matches = s.matches\n const index = matches.findIndex((d) => d.id === matchId)\n return matches[index + 1]?.id\n },\n })\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n if (router.isShell)\n return (\n <React.Suspense fallback={pendingElement}>\n <ShellInner />\n </React.Suspense>\n )\n\n if (parentGlobalNotFound) {\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 (matchId === rootRouteId) {\n return (\n <React.Suspense fallback={pendingElement}>{nextMatch}</React.Suspense>\n )\n }\n\n return nextMatch\n})\n\nfunction ShellInner(): React.ReactElement {\n throw new Error('ShellBoundaryError')\n}\n"],"names":["_a","match","routeId","key"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Match.js","sources":["../../src/Match.tsx"],"sourcesContent":["import * as React from 'react'\nimport invariant from 'tiny-invariant'\nimport warning from 'tiny-warning'\nimport {\n createControlledPromise,\n getLocationChangeInfo,\n isNotFound,\n isRedirect,\n pick,\n rootRouteId,\n} from '@tanstack/router-core'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouterState } from './useRouterState'\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 type {\n AnyRoute,\n ParsedLocation,\n RootRouteOptions,\n} from '@tanstack/router-core'\n\nexport const Match = React.memo(function MatchImpl({\n matchId,\n}: {\n matchId: string\n}) {\n const router = useRouter()\n const matchState = useRouterState({\n select: (s) => {\n const match = s.matches.find((d) => d.id === matchId)\n invariant(\n match,\n `Could not find match for matchId \"${matchId}\". Please file an issue!`,\n )\n return pick(match, ['routeId', 'ssr', '_displayPending'])\n },\n structuralSharing: true as any,\n })\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 resetKey = useRouterState({\n select: (s) => s.loadedAt,\n })\n\n const parentRouteId = useRouterState({\n select: (s) => {\n const index = s.matches.findIndex((d) => d.id === matchId)\n return s.matches[index - 1]?.routeId as string\n },\n })\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)) throw error\n warning(false, `Error in route match: ${matchId}`)\n routeOnCatch?.(error, errorInfo)\n }}\n >\n <ResolvedNotFoundBoundary\n fallback={(error) => {\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 {parentRouteId === rootRouteId && router.options.scrollRestoration ? (\n <>\n <OnRendered />\n <ScrollRestoration />\n </>\n ) : null}\n </ShellComponent>\n )\n})\n\n// On Rendered can't happen above the root layout because it actually\n// renders a dummy dom element to track the rendered state of the app.\n// We render a script tag with a key that changes based on the current\n// location state.__TSR_key. Also, because it's below the root layout, it\n// allows us to fire onRendered events even after a hydration mismatch\n// error that occurred above the root layout (like bad head/link tags,\n// which is common).\nfunction OnRendered() {\n const router = useRouter()\n\n const prevLocationRef = React.useRef<undefined | ParsedLocation<{}>>(\n undefined,\n )\n\n return (\n <script\n key={router.latestLocation.state.__TSR_key}\n suppressHydrationWarning\n ref={(el) => {\n if (\n el &&\n (prevLocationRef.current === undefined ||\n prevLocationRef.current.href !== router.latestLocation.href)\n ) {\n router.emit({\n type: 'onRendered',\n ...getLocationChangeInfo(router.state),\n })\n prevLocationRef.current = router.latestLocation\n }\n }}\n />\n )\n}\n\nexport const MatchInner = React.memo(function MatchInnerImpl({\n matchId,\n}: {\n matchId: string\n}): any {\n const router = useRouter()\n\n const { match, key, routeId } = useRouterState({\n select: (s) => {\n const matchIndex = s.matches.findIndex((d) => d.id === matchId)\n const match = s.matches[matchIndex]!\n const routeId = match.routeId as string\n\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\n return {\n key,\n routeId,\n match: pick(match, [\n 'id',\n 'status',\n 'error',\n '_forcePending',\n '_displayPending',\n ]),\n }\n },\n structuralSharing: true as any,\n })\n\n const route = router.routesById[routeId] as AnyRoute\n\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)?.displayPendingPromise\n }\n\n if (match._forcePending) {\n throw router.getMatch(match.id)?.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\n if (pendingMinMs && !router.getMatch(match.id)?.minPendingPromise) {\n // Create a promise that will resolve after the minPendingMs\n if (!router.isServer) {\n const minPendingPromise = createControlledPromise<void>()\n\n Promise.resolve().then(() => {\n router.updateMatch(match.id, (prev) => ({\n ...prev,\n minPendingPromise,\n }))\n })\n\n setTimeout(() => {\n minPendingPromise.resolve()\n\n // We've handled the minPendingPromise, so we can delete it\n router.updateMatch(match.id, (prev) => ({\n ...prev,\n minPendingPromise: undefined,\n }))\n }, pendingMinMs)\n }\n }\n throw router.getMatch(match.id)?.loadPromise\n }\n\n if (match.status === 'notFound') {\n invariant(isNotFound(match.error), 'Expected a notFound error')\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 invariant(isRedirect(match.error), 'Expected a redirect error')\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)?.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 (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\nexport const Outlet = React.memo(function OutletImpl() {\n const router = useRouter()\n const matchId = React.useContext(matchContext)\n const routeId = useRouterState({\n select: (s) => s.matches.find((d) => d.id === matchId)?.routeId as string,\n })\n\n const route = router.routesById[routeId]!\n\n const parentGlobalNotFound = useRouterState({\n select: (s) => {\n const matches = s.matches\n const parentMatch = matches.find((d) => d.id === matchId)\n invariant(\n parentMatch,\n `Could not find parent match for matchId \"${matchId}\"`,\n )\n return parentMatch.globalNotFound\n },\n })\n\n const childMatchId = useRouterState({\n select: (s) => {\n const matches = s.matches\n const index = matches.findIndex((d) => d.id === matchId)\n return matches[index + 1]?.id\n },\n })\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n if (parentGlobalNotFound) {\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 (matchId === rootRouteId) {\n return (\n <React.Suspense fallback={pendingElement}>{nextMatch}</React.Suspense>\n )\n }\n\n return nextMatch\n})\n"],"names":["match","routeId","key"],"mappings":"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"}
|
package/dist/esm/Matches.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { StructuralSharingOption, ValidateSelected } from './structuralSharing.js';
|
|
2
|
-
import { ReactNode } from './route.js';
|
|
3
2
|
import { AnyRouter, DeepPartial, Expand, MakeOptionalPathParams, MakeOptionalSearchParams, MakeRouteMatchUnion, MaskOptions, MatchRouteOptions, NoInfer, RegisteredRouter, ResolveRelativePath, ResolveRoute, RouteByPath, ToSubOptionsProps } from '@tanstack/router-core';
|
|
4
3
|
import * as React from 'react';
|
|
5
4
|
declare module '@tanstack/router-core' {
|
|
@@ -7,6 +6,7 @@ declare module '@tanstack/router-core' {
|
|
|
7
6
|
meta?: Array<React.JSX.IntrinsicElements['meta'] | undefined>;
|
|
8
7
|
links?: Array<React.JSX.IntrinsicElements['link'] | undefined>;
|
|
9
8
|
scripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>;
|
|
9
|
+
styles?: Array<React.JSX.IntrinsicElements['style'] | undefined>;
|
|
10
10
|
headScripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>;
|
|
11
11
|
}
|
|
12
12
|
}
|
|
@@ -14,7 +14,7 @@ export declare function Matches(): import("react/jsx-runtime").JSX.Element;
|
|
|
14
14
|
export type UseMatchRouteOptions<TRouter extends AnyRouter = RegisteredRouter, TFrom extends string = string, TTo extends string | undefined = undefined, TMaskFrom extends string = TFrom, TMaskTo extends string = ''> = ToSubOptionsProps<TRouter, TFrom, TTo> & DeepPartial<MakeOptionalSearchParams<TRouter, TFrom, TTo>> & DeepPartial<MakeOptionalPathParams<TRouter, TFrom, TTo>> & MaskOptions<TRouter, TMaskFrom, TMaskTo> & MatchRouteOptions;
|
|
15
15
|
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"]>;
|
|
16
16
|
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> & {
|
|
17
|
-
children?: ((params?: RouteByPath<TRouter['routeTree'], ResolveRelativePath<TFrom, NoInfer<TTo>>>['types']['allParams']) => ReactNode) | React.ReactNode;
|
|
17
|
+
children?: ((params?: RouteByPath<TRouter['routeTree'], ResolveRelativePath<TFrom, NoInfer<TTo>>>['types']['allParams']) => React.ReactNode) | React.ReactNode;
|
|
18
18
|
};
|
|
19
19
|
export declare function MatchRoute<TRouter extends AnyRouter = RegisteredRouter, const TFrom extends string = string, const TTo extends string | undefined = undefined, const TMaskFrom extends string = TFrom, const TMaskTo extends string = ''>(props: MakeMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): any;
|
|
20
20
|
export interface UseMatchesBaseOptions<TRouter extends AnyRouter, TSelected, TStructuralSharing> {
|
package/dist/esm/Matches.js
CHANGED
|
@@ -11,24 +11,25 @@ import { SafeFragment } from "./SafeFragment.js";
|
|
|
11
11
|
function Matches() {
|
|
12
12
|
const router = useRouter();
|
|
13
13
|
const pendingElement = router.options.defaultPendingComponent ? /* @__PURE__ */ jsx(router.options.defaultPendingComponent, {}) : null;
|
|
14
|
-
const ResolvedSuspense = router.isServer || typeof document !== "undefined" && router.
|
|
14
|
+
const ResolvedSuspense = router.isServer || typeof document !== "undefined" && router.ssr ? SafeFragment : React.Suspense;
|
|
15
15
|
const inner = /* @__PURE__ */ jsxs(ResolvedSuspense, { fallback: pendingElement, children: [
|
|
16
|
-
/* @__PURE__ */ jsx(Transitioner, {}),
|
|
16
|
+
!router.isServer && /* @__PURE__ */ jsx(Transitioner, {}),
|
|
17
17
|
/* @__PURE__ */ jsx(MatchesInner, {})
|
|
18
18
|
] });
|
|
19
19
|
return router.options.InnerWrap ? /* @__PURE__ */ jsx(router.options.InnerWrap, { children: inner }) : inner;
|
|
20
20
|
}
|
|
21
21
|
function MatchesInner() {
|
|
22
|
+
const router = useRouter();
|
|
22
23
|
const matchId = useRouterState({
|
|
23
24
|
select: (s) => {
|
|
24
|
-
|
|
25
|
-
return (_a = s.matches[0]) == null ? void 0 : _a.id;
|
|
25
|
+
return s.matches[0]?.id;
|
|
26
26
|
}
|
|
27
27
|
});
|
|
28
28
|
const resetKey = useRouterState({
|
|
29
29
|
select: (s) => s.loadedAt
|
|
30
30
|
});
|
|
31
|
-
|
|
31
|
+
const matchComponent = matchId ? /* @__PURE__ */ jsx(Match, { matchId }) : null;
|
|
32
|
+
return /* @__PURE__ */ jsx(matchContext.Provider, { value: matchId, children: router.options.disableGlobalCatchBoundary ? matchComponent : /* @__PURE__ */ jsx(
|
|
32
33
|
CatchBoundary,
|
|
33
34
|
{
|
|
34
35
|
getResetKey: () => resetKey,
|
|
@@ -40,17 +41,14 @@ function MatchesInner() {
|
|
|
40
41
|
);
|
|
41
42
|
warning(false, error.message || error.toString());
|
|
42
43
|
},
|
|
43
|
-
children:
|
|
44
|
+
children: matchComponent
|
|
44
45
|
}
|
|
45
46
|
) });
|
|
46
47
|
}
|
|
47
48
|
function useMatchRoute() {
|
|
48
49
|
const router = useRouter();
|
|
49
50
|
useRouterState({
|
|
50
|
-
select: (s) =>
|
|
51
|
-
var _a;
|
|
52
|
-
return [s.location.href, (_a = s.resolvedLocation) == null ? void 0 : _a.href, s.status];
|
|
53
|
-
},
|
|
51
|
+
select: (s) => [s.location.href, s.resolvedLocation?.href, s.status],
|
|
54
52
|
structuralSharing: true
|
|
55
53
|
});
|
|
56
54
|
return React.useCallback(
|
|
@@ -78,9 +76,9 @@ function useMatches(opts) {
|
|
|
78
76
|
return useRouterState({
|
|
79
77
|
select: (state) => {
|
|
80
78
|
const matches = state.matches;
|
|
81
|
-
return
|
|
79
|
+
return opts?.select ? opts.select(matches) : matches;
|
|
82
80
|
},
|
|
83
|
-
structuralSharing: opts
|
|
81
|
+
structuralSharing: opts?.structuralSharing
|
|
84
82
|
});
|
|
85
83
|
}
|
|
86
84
|
function useParentMatches(opts) {
|
|
@@ -91,9 +89,9 @@ function useParentMatches(opts) {
|
|
|
91
89
|
0,
|
|
92
90
|
matches.findIndex((d) => d.id === contextMatchId)
|
|
93
91
|
);
|
|
94
|
-
return
|
|
92
|
+
return opts?.select ? opts.select(matches) : matches;
|
|
95
93
|
},
|
|
96
|
-
structuralSharing: opts
|
|
94
|
+
structuralSharing: opts?.structuralSharing
|
|
97
95
|
});
|
|
98
96
|
}
|
|
99
97
|
function useChildMatches(opts) {
|
|
@@ -103,9 +101,9 @@ function useChildMatches(opts) {
|
|
|
103
101
|
matches = matches.slice(
|
|
104
102
|
matches.findIndex((d) => d.id === contextMatchId) + 1
|
|
105
103
|
);
|
|
106
|
-
return
|
|
104
|
+
return opts?.select ? opts.select(matches) : matches;
|
|
107
105
|
},
|
|
108
|
-
structuralSharing: opts
|
|
106
|
+
structuralSharing: opts?.structuralSharing
|
|
109
107
|
});
|
|
110
108
|
}
|
|
111
109
|
export {
|
package/dist/esm/Matches.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Matches.js","sources":["../../src/Matches.tsx"],"sourcesContent":["import * as React from 'react'\nimport warning from 'tiny-warning'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouterState } from './useRouterState'\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 { ReactNode } from './route'\nimport type {\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 RouterState,\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 headScripts?: Array<React.JSX.IntrinsicElements['script'] | undefined>\n }\n}\n\nexport function Matches() {\n const router = useRouter()\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n // Do not render a root Suspense during SSR or hydrating from SSR\n const ResolvedSuspense =\n router.isServer || (typeof document !== 'undefined' && router.clientSsr)\n ? SafeFragment\n : React.Suspense\n\n const inner = (\n <ResolvedSuspense fallback={pendingElement}>\n <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 matchId = useRouterState({\n select: (s) => {\n return s.matches[0]?.id\n },\n })\n\n const resetKey = useRouterState({\n select: (s) => s.loadedAt,\n })\n\n return (\n <matchContext.Provider value={matchId}>\n <CatchBoundary\n getResetKey={() => resetKey}\n errorComponent={ErrorComponent}\n onCatch={(error) => {\n warning(\n false,\n `The following error wasn't caught by any route! At the very least, consider setting an 'errorComponent' in your RootRoute!`,\n )\n warning(false, error.message || error.toString())\n }}\n >\n {matchId ? <Match matchId={matchId} /> : null}\n </CatchBoundary>\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\nexport function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {\n const router = useRouter()\n\n useRouterState({\n select: (s) => [s.location.href, s.resolvedLocation?.href, s.status],\n structuralSharing: true as any,\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 ) => ReactNode)\n | React.ReactNode\n}\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 return useRouterState({\n select: (state: RouterState<TRouter['routeTree']>) => {\n const matches = state.matches\n return opts?.select\n ? opts.select(matches as Array<MakeRouteMatchUnion<TRouter>>)\n : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any) as UseMatchesResult<TRouter, TSelected>\n}\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\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"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Matches.js","sources":["../../src/Matches.tsx"],"sourcesContent":["import * as React from 'react'\nimport warning from 'tiny-warning'\nimport { CatchBoundary, ErrorComponent } from './CatchBoundary'\nimport { useRouterState } from './useRouterState'\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 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 RouterState,\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\nexport function Matches() {\n const router = useRouter()\n\n const pendingElement = router.options.defaultPendingComponent ? (\n <router.options.defaultPendingComponent />\n ) : null\n\n // Do not render a root Suspense during SSR or hydrating from SSR\n const ResolvedSuspense =\n router.isServer || (typeof document !== 'undefined' && router.ssr)\n ? SafeFragment\n : React.Suspense\n\n const inner = (\n <ResolvedSuspense fallback={pendingElement}>\n {!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 matchId = useRouterState({\n select: (s) => {\n return s.matches[0]?.id\n },\n })\n\n const resetKey = useRouterState({\n select: (s) => s.loadedAt,\n })\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={(error) => {\n warning(\n false,\n `The following error wasn't caught by any route! At the very least, consider setting an 'errorComponent' in your RootRoute!`,\n )\n warning(false, error.message || error.toString())\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\nexport function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {\n const router = useRouter()\n\n useRouterState({\n select: (s) => [s.location.href, s.resolvedLocation?.href, s.status],\n structuralSharing: true as any,\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\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 return useRouterState({\n select: (state: RouterState<TRouter['routeTree']>) => {\n const matches = state.matches\n return opts?.select\n ? opts.select(matches as Array<MakeRouteMatchUnion<TRouter>>)\n : matches\n },\n structuralSharing: opts?.structuralSharing,\n } as any) as UseMatchesResult<TRouter, TSelected>\n}\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\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"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RouterProvider.js","sources":["../../src/RouterProvider.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Matches } from './Matches'\nimport { getRouterContext } from './routerContext'\nimport type {\n AnyRouter,\n RegisteredRouter,\n RouterOptions,\n} from '@tanstack/router-core'\n\nexport function RouterContextProvider<\n TRouter extends AnyRouter = RegisteredRouter,\n TDehydrated extends Record<string, any> = Record<string, any>,\n>({\n router,\n children,\n ...rest\n}: RouterProps<TRouter, TDehydrated> & {\n children: React.ReactNode\n}) {\n if (Object.keys(rest).length > 0) {\n // Allow the router to update options on the router instance\n router.update({\n ...router.options,\n ...rest,\n context: {\n ...router.options.context,\n ...rest.context,\n },\n } as any)\n }\n\n const routerContext = getRouterContext()\n\n const provider = (\n <routerContext.Provider value={router as AnyRouter}>\n {children}\n </routerContext.Provider>\n )\n\n if (router.options.Wrap) {\n return <router.options.Wrap>{provider}</router.options.Wrap>\n }\n\n return provider\n}\n\nexport function RouterProvider<\n TRouter extends AnyRouter = RegisteredRouter,\n TDehydrated extends Record<string, any> = Record<string, any>,\n>({ router, ...rest }: RouterProps<TRouter, TDehydrated>) {\n return (\n <RouterContextProvider router={router} {...rest}>\n <Matches />\n </RouterContextProvider>\n )\n}\n\nexport type RouterProps<\n TRouter extends AnyRouter = RegisteredRouter,\n TDehydrated extends Record<string, any> = Record<string, any>,\n> = Omit<\n RouterOptions<\n TRouter['routeTree'],\n NonNullable<TRouter['options']['trailingSlash']>,\n NonNullable<TRouter['options']['defaultStructuralSharing']>,\n TRouter['history'],\n TDehydrated\n >,\n 'context'\n> & {\n router: TRouter\n context?: Partial<\n RouterOptions<\n TRouter['routeTree'],\n NonNullable<TRouter['options']['trailingSlash']>,\n NonNullable<TRouter['options']['defaultStructuralSharing']>,\n TRouter['history'],\n TDehydrated\n >['context']\n >\n}\n"],"names":[],"mappings":";;;AASO,SAAS,sBAGd;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAEG;AACD,MAAI,OAAO,KAAK,IAAI,EAAE,SAAS,GAAG;AAEhC,WAAO,OAAO;AAAA,MACZ,GAAG,OAAO;AAAA,MACV,GAAG;AAAA,MACH,SAAS;AAAA,QACP,GAAG,OAAO,QAAQ;AAAA,QAClB,GAAG,KAAK;AAAA,MAAA;AAAA,IACV,CACM;AAAA,
|
|
1
|
+
{"version":3,"file":"RouterProvider.js","sources":["../../src/RouterProvider.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Matches } from './Matches'\nimport { getRouterContext } from './routerContext'\nimport type {\n AnyRouter,\n RegisteredRouter,\n RouterOptions,\n} from '@tanstack/router-core'\n\nexport function RouterContextProvider<\n TRouter extends AnyRouter = RegisteredRouter,\n TDehydrated extends Record<string, any> = Record<string, any>,\n>({\n router,\n children,\n ...rest\n}: RouterProps<TRouter, TDehydrated> & {\n children: React.ReactNode\n}) {\n if (Object.keys(rest).length > 0) {\n // Allow the router to update options on the router instance\n router.update({\n ...router.options,\n ...rest,\n context: {\n ...router.options.context,\n ...rest.context,\n },\n } as any)\n }\n\n const routerContext = getRouterContext()\n\n const provider = (\n <routerContext.Provider value={router as AnyRouter}>\n {children}\n </routerContext.Provider>\n )\n\n if (router.options.Wrap) {\n return <router.options.Wrap>{provider}</router.options.Wrap>\n }\n\n return provider\n}\n\nexport function RouterProvider<\n TRouter extends AnyRouter = RegisteredRouter,\n TDehydrated extends Record<string, any> = Record<string, any>,\n>({ router, ...rest }: RouterProps<TRouter, TDehydrated>) {\n return (\n <RouterContextProvider router={router} {...rest}>\n <Matches />\n </RouterContextProvider>\n )\n}\n\nexport type RouterProps<\n TRouter extends AnyRouter = RegisteredRouter,\n TDehydrated extends Record<string, any> = Record<string, any>,\n> = Omit<\n RouterOptions<\n TRouter['routeTree'],\n NonNullable<TRouter['options']['trailingSlash']>,\n NonNullable<TRouter['options']['defaultStructuralSharing']>,\n TRouter['history'],\n TDehydrated\n >,\n 'context'\n> & {\n router: TRouter\n context?: Partial<\n RouterOptions<\n TRouter['routeTree'],\n NonNullable<TRouter['options']['trailingSlash']>,\n NonNullable<TRouter['options']['defaultStructuralSharing']>,\n TRouter['history'],\n TDehydrated\n >['context']\n >\n}\n"],"names":[],"mappings":";;;AASO,SAAS,sBAGd;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAEG;AACD,MAAI,OAAO,KAAK,IAAI,EAAE,SAAS,GAAG;AAEhC,WAAO,OAAO;AAAA,MACZ,GAAG,OAAO;AAAA,MACV,GAAG;AAAA,MACH,SAAS;AAAA,QACP,GAAG,OAAO,QAAQ;AAAA,QAClB,GAAG,KAAK;AAAA,MAAA;AAAA,IACV,CACM;AAAA,EACV;AAEA,QAAM,gBAAgB,iBAAA;AAEtB,QAAM,WACJ,oBAAC,cAAc,UAAd,EAAuB,OAAO,QAC5B,UACH;AAGF,MAAI,OAAO,QAAQ,MAAM;AACvB,WAAO,oBAAC,OAAO,QAAQ,MAAf,EAAqB,UAAA,UAAS;AAAA,EACxC;AAEA,SAAO;AACT;AAEO,SAAS,eAGd,EAAE,QAAQ,GAAG,QAA2C;AACxD,6BACG,uBAAA,EAAsB,QAAiB,GAAG,MACzC,UAAA,oBAAC,WAAQ,GACX;AAEJ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SafeFragment.js","sources":["../../src/SafeFragment.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport function SafeFragment(props: any) {\n return <>{props.children}</>\n}\n"],"names":[],"mappings":";AAEO,SAAS,aAAa,OAAY;
|
|
1
|
+
{"version":3,"file":"SafeFragment.js","sources":["../../src/SafeFragment.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport function SafeFragment(props: any) {\n return <>{props.children}</>\n}\n"],"names":[],"mappings":";AAEO,SAAS,aAAa,OAAY;AACvC,SAAO,oBAAA,UAAA,EAAG,gBAAM,SAAA,CAAS;AAC3B;"}
|
package/dist/esm/ScriptOnce.d.ts
CHANGED
package/dist/esm/ScriptOnce.js
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import jsesc from "jsesc";
|
|
3
2
|
function ScriptOnce({
|
|
4
|
-
children
|
|
5
|
-
log
|
|
3
|
+
children
|
|
6
4
|
}) {
|
|
7
5
|
if (typeof document !== "undefined") {
|
|
8
6
|
return null;
|
|
@@ -10,14 +8,9 @@ function ScriptOnce({
|
|
|
10
8
|
return /* @__PURE__ */ jsx(
|
|
11
9
|
"script",
|
|
12
10
|
{
|
|
13
|
-
className: "tsr
|
|
11
|
+
className: "$tsr",
|
|
14
12
|
dangerouslySetInnerHTML: {
|
|
15
|
-
__html: [
|
|
16
|
-
children,
|
|
17
|
-
(log ?? true) && process.env.NODE_ENV === "development" ? `console.info(\`Injected From Server:
|
|
18
|
-
${jsesc(children.toString(), { quotes: "backtick" })}\`)` : "",
|
|
19
|
-
'if (typeof __TSR_SSR__ !== "undefined") __TSR_SSR__.cleanScripts()'
|
|
20
|
-
].filter(Boolean).join("\n")
|
|
13
|
+
__html: [children].filter(Boolean).join("\n")
|
|
21
14
|
}
|
|
22
15
|
}
|
|
23
16
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScriptOnce.js","sources":["../../src/ScriptOnce.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"ScriptOnce.js","sources":["../../src/ScriptOnce.tsx"],"sourcesContent":["export function ScriptOnce({\n children,\n}: {\n children: string\n log?: boolean\n sync?: boolean\n}) {\n if (typeof document !== 'undefined') {\n return null\n }\n\n return (\n <script\n className=\"$tsr\"\n dangerouslySetInnerHTML={{\n __html: [children].filter(Boolean).join('\\n'),\n }}\n />\n )\n}\n"],"names":[],"mappings":";AAAO,SAAS,WAAW;AAAA,EACzB;AACF,GAIG;AACD,MAAI,OAAO,aAAa,aAAa;AACnC,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,yBAAyB;AAAA,QACvB,QAAQ,CAAC,QAAQ,EAAE,OAAO,OAAO,EAAE,KAAK,IAAI;AAAA,MAAA;AAAA,IAC9C;AAAA,EAAA;AAGN;"}
|