@tanstack/react-router 1.34.2 → 1.34.5
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/RouterProvider.cjs.map +1 -1
- package/dist/cjs/RouterProvider.d.cts +3 -1
- package/dist/cjs/Transitioner.cjs +1 -0
- package/dist/cjs/Transitioner.cjs.map +1 -1
- package/dist/cjs/awaited.cjs +6 -3
- package/dist/cjs/awaited.cjs.map +1 -1
- package/dist/cjs/awaited.d.cts +3 -0
- package/dist/cjs/index.cjs +1 -0
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.d.cts +1 -1
- package/dist/cjs/router.cjs +16 -10
- package/dist/cjs/router.cjs.map +1 -1
- package/dist/cjs/router.d.cts +6 -4
- package/dist/esm/RouterProvider.d.ts +3 -1
- package/dist/esm/RouterProvider.js.map +1 -1
- package/dist/esm/Transitioner.js +1 -0
- package/dist/esm/Transitioner.js.map +1 -1
- package/dist/esm/awaited.d.ts +3 -0
- package/dist/esm/awaited.js +6 -3
- package/dist/esm/awaited.js.map +1 -1
- package/dist/esm/index.d.ts +1 -1
- package/dist/esm/index.js +2 -1
- package/dist/esm/router.d.ts +6 -4
- package/dist/esm/router.js +16 -10
- package/dist/esm/router.js.map +1 -1
- package/package.json +1 -1
- package/src/RouterProvider.tsx +3 -1
- package/src/Transitioner.tsx +1 -6
- package/src/awaited.tsx +6 -4
- package/src/index.tsx +1 -1
- package/src/router.ts +24 -15
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RouterProvider.cjs","sources":["../../src/RouterProvider.tsx"],"sourcesContent":["// eslint-disable-next-line @typescript-eslint/consistent-type-imports\nimport * as React from 'react'\nimport { Matches } from './Matches'\nimport { getRouterContext } from './routerContext'\nimport type { NavigateOptions, ToOptions } from './link'\nimport type { ParsedLocation } from './location'\nimport type { AnyRoute } from './route'\nimport type { RoutePaths } from './routeInfo'\nimport type {\n AnyRouter,\n RegisteredRouter,\n Router,\n RouterOptions,\n RouterState,\n} from './router'\n\nimport type { MakeRouteMatch } from './Matches'\n\nexport interface CommitLocationOptions {\n replace?: boolean\n resetScroll?: boolean\n viewTransition?: boolean\n /**\n * @deprecated All navigations use React transitions under the hood now\n **/\n startTransition?: boolean\n}\n\nexport interface MatchLocation {\n to?: string | number | null\n fuzzy?: boolean\n caseSensitive?: boolean\n from?: string\n}\n\nexport type NavigateFn = <\n TTo extends string,\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends RoutePaths<TRouter['routeTree']> | string = string,\n TMaskFrom extends RoutePaths<TRouter['routeTree']> | string = TFrom,\n TMaskTo extends string = '',\n>(\n opts: NavigateOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo
|
|
1
|
+
{"version":3,"file":"RouterProvider.cjs","sources":["../../src/RouterProvider.tsx"],"sourcesContent":["// eslint-disable-next-line @typescript-eslint/consistent-type-imports\nimport * as React from 'react'\nimport { Matches } from './Matches'\nimport { getRouterContext } from './routerContext'\nimport type { NavigateOptions, ToOptions } from './link'\nimport type { ParsedLocation } from './location'\nimport type { AnyRoute } from './route'\nimport type { RoutePaths } from './routeInfo'\nimport type {\n AnyRouter,\n RegisteredRouter,\n Router,\n RouterOptions,\n RouterState,\n} from './router'\n\nimport type { MakeRouteMatch } from './Matches'\n\nexport interface CommitLocationOptions {\n replace?: boolean\n resetScroll?: boolean\n viewTransition?: boolean\n /**\n * @deprecated All navigations use React transitions under the hood now\n **/\n startTransition?: boolean\n}\n\nexport interface MatchLocation {\n to?: string | number | null\n fuzzy?: boolean\n caseSensitive?: boolean\n from?: string\n}\n\nexport type NavigateFn = <\n TTo extends string,\n TRouter extends AnyRouter = RegisteredRouter,\n TFrom extends RoutePaths<TRouter['routeTree']> | string = string,\n TMaskFrom extends RoutePaths<TRouter['routeTree']> | string = TFrom,\n TMaskTo extends string = '',\n>(\n opts: NavigateOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {\n __isRedirect?: boolean\n },\n) => Promise<void>\n\nexport type BuildLocationFn<TRouteTree extends AnyRoute> = <\n TTo extends string,\n TFrom extends RoutePaths<TRouteTree> | string = string,\n TMaskFrom extends RoutePaths<TRouteTree> | string = TFrom,\n TMaskTo extends string = '',\n>(\n opts: ToOptions<\n Router<TRouteTree, 'never'>,\n TFrom,\n TTo,\n TMaskFrom,\n TMaskTo\n > & {\n leaveParams?: boolean\n },\n) => ParsedLocation\n\nexport type InjectedHtmlEntry = string | (() => Promise<string> | string)\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 // 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 const routerContext = getRouterContext()\n\n const provider = (\n <routerContext.Provider value={router}>{children}</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 function getRouteMatch<TRouteTree extends AnyRoute>(\n state: RouterState<TRouteTree>,\n id: string,\n): undefined | MakeRouteMatch<TRouteTree> {\n return [\n ...state.cachedMatches,\n ...(state.pendingMatches ?? []),\n ...state.matches,\n ].find((d) => d.id === id)\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 TDehydrated\n >,\n 'context'\n> & {\n router: Router<\n TRouter['routeTree'],\n NonNullable<TRouter['options']['trailingSlash']>\n >\n context?: Partial<\n RouterOptions<\n TRouter['routeTree'],\n NonNullable<TRouter['options']['trailingSlash']>,\n TDehydrated\n >['context']\n >\n}\n"],"names":["routerContext","getRouterContext","jsx","Matches"],"mappings":";;;;;AAkEO,SAAS,sBAGd;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAEG;AAED,SAAO,OAAO;AAAA,IACZ,GAAG,OAAO;AAAA,IACV,GAAG;AAAA,IACH,SAAS;AAAA,MACP,GAAG,OAAO,QAAQ;AAAA,MAClB,GAAG,KAAK;AAAA,IACV;AAAA,EAAA,CACM;AAER,QAAMA,kBAAgBC,cAAAA;AAEtB,QAAM,WACHC,2BAAA,IAAAF,gBAAc,UAAd,EAAuB,OAAO,QAAS,SAAS,CAAA;AAG/C,MAAA,OAAO,QAAQ,MAAM;AACvB,WAAQE,2BAAAA,IAAA,OAAO,QAAQ,MAAf,EAAqB,UAAS,SAAA,CAAA;AAAA,EACxC;AAEO,SAAA;AACT;AAEO,SAAS,eAGd,EAAE,QAAQ,GAAG,QAA2C;AACxD,wCACG,uBAAsB,EAAA,QAAiB,GAAG,MACzC,UAAAA,+BAACC,QAAAA,UAAQ,CAAA,EACX,CAAA;AAEJ;AAEgB,SAAA,cACd,OACA,IACwC;AACjC,SAAA;AAAA,IACL,GAAG,MAAM;AAAA,IACT,GAAI,MAAM,kBAAkB,CAAC;AAAA,IAC7B,GAAG,MAAM;AAAA,EAAA,EACT,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE;AAC3B;;;;"}
|
|
@@ -20,7 +20,9 @@ export interface MatchLocation {
|
|
|
20
20
|
caseSensitive?: boolean;
|
|
21
21
|
from?: string;
|
|
22
22
|
}
|
|
23
|
-
export type NavigateFn = <TTo extends string, TRouter extends AnyRouter = RegisteredRouter, TFrom extends RoutePaths<TRouter['routeTree']> | string = string, TMaskFrom extends RoutePaths<TRouter['routeTree']> | string = TFrom, TMaskTo extends string = ''>(opts: NavigateOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>
|
|
23
|
+
export type NavigateFn = <TTo extends string, TRouter extends AnyRouter = RegisteredRouter, TFrom extends RoutePaths<TRouter['routeTree']> | string = string, TMaskFrom extends RoutePaths<TRouter['routeTree']> | string = TFrom, TMaskTo extends string = ''>(opts: NavigateOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo> & {
|
|
24
|
+
__isRedirect?: boolean;
|
|
25
|
+
}) => Promise<void>;
|
|
24
26
|
export type BuildLocationFn<TRouteTree extends AnyRoute> = <TTo extends string, TFrom extends RoutePaths<TRouteTree> | string = string, TMaskFrom extends RoutePaths<TRouteTree> | string = TFrom, TMaskTo extends string = ''>(opts: ToOptions<Router<TRouteTree, 'never'>, TFrom, TTo, TMaskFrom, TMaskTo> & {
|
|
25
27
|
leaveParams?: boolean;
|
|
26
28
|
}) => ParsedLocation;
|
|
@@ -74,6 +74,7 @@ function Transitioner() {
|
|
|
74
74
|
const pathChanged = fromLocation.href !== toLocation.href;
|
|
75
75
|
router.emit({
|
|
76
76
|
type: "onLoad",
|
|
77
|
+
// When the new URL has committed, when the new matches have been loaded into state.matches
|
|
77
78
|
fromLocation,
|
|
78
79
|
toLocation,
|
|
79
80
|
pathChanged
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Transitioner.cjs","sources":["../../src/Transitioner.tsx"],"sourcesContent":["import * as React from 'react'\nimport { pick, useLayoutEffect, usePrevious } from './utils'\nimport { useRouter } from './useRouter'\nimport { useRouterState } from './useRouterState'\n\nexport function Transitioner() {\n const router = useRouter()\n const mountLoadForRouter = React.useRef({ router, mounted: false })\n const routerState = useRouterState({\n select: (s) =>\n pick(s, ['isLoading', 'location', 'resolvedLocation', 'isTransitioning']),\n })\n\n const [isTransitioning, startReactTransition_] = React.useTransition()\n // Track pending state changes\n const hasPendingMatches = useRouterState({\n select: (s) => s.matches.some((d) => d.status === 'pending'),\n })\n\n const previousIsLoading = usePrevious(routerState.isLoading)\n\n const isAnyPending =\n routerState.isLoading || isTransitioning || hasPendingMatches\n const previousIsAnyPending = usePrevious(isAnyPending)\n\n if (!router.isServer) {\n router.startReactTransition = startReactTransition_\n }\n\n // Subscribe to location changes\n // and try to load the new location\n useLayoutEffect(() => {\n const unsub = router.history.subscribe(router.load)\n\n const nextLocation = router.buildLocation({\n to: router.latestLocation.pathname,\n search: true,\n params: true,\n hash: true,\n state: true,\n })\n\n if (router.state.location.href !== nextLocation.href) {\n router.commitLocation({ ...nextLocation, replace: true })\n }\n\n return () => {\n unsub()\n }\n }, [router, router.history])\n\n // Try to load the initial location\n useLayoutEffect(() => {\n if (\n window.__TSR_DEHYDRATED__ ||\n (mountLoadForRouter.current.router === router &&\n mountLoadForRouter.current.mounted)\n ) {\n return\n }\n mountLoadForRouter.current = { router, mounted: true }\n\n const tryLoad = async () => {\n try {\n await router.load()\n } catch (err) {\n console.error(err)\n }\n }\n\n tryLoad()\n }, [router])\n\n useLayoutEffect(() => {\n // The router was loading and now it's not\n if (previousIsLoading && !routerState.isLoading) {\n const toLocation = router.state.location\n const fromLocation = router.state.resolvedLocation\n const pathChanged = fromLocation.href !== toLocation.href\n\n router.emit({\n type: 'onLoad'
|
|
1
|
+
{"version":3,"file":"Transitioner.cjs","sources":["../../src/Transitioner.tsx"],"sourcesContent":["import * as React from 'react'\nimport { pick, useLayoutEffect, usePrevious } from './utils'\nimport { useRouter } from './useRouter'\nimport { useRouterState } from './useRouterState'\n\nexport function Transitioner() {\n const router = useRouter()\n const mountLoadForRouter = React.useRef({ router, mounted: false })\n const routerState = useRouterState({\n select: (s) =>\n pick(s, ['isLoading', 'location', 'resolvedLocation', 'isTransitioning']),\n })\n\n const [isTransitioning, startReactTransition_] = React.useTransition()\n // Track pending state changes\n const hasPendingMatches = useRouterState({\n select: (s) => s.matches.some((d) => d.status === 'pending'),\n })\n\n const previousIsLoading = usePrevious(routerState.isLoading)\n\n const isAnyPending =\n routerState.isLoading || isTransitioning || hasPendingMatches\n const previousIsAnyPending = usePrevious(isAnyPending)\n\n if (!router.isServer) {\n router.startReactTransition = startReactTransition_\n }\n\n // Subscribe to location changes\n // and try to load the new location\n useLayoutEffect(() => {\n const unsub = router.history.subscribe(router.load)\n\n const nextLocation = router.buildLocation({\n to: router.latestLocation.pathname,\n search: true,\n params: true,\n hash: true,\n state: true,\n })\n\n if (router.state.location.href !== nextLocation.href) {\n router.commitLocation({ ...nextLocation, replace: true })\n }\n\n return () => {\n unsub()\n }\n }, [router, router.history])\n\n // Try to load the initial location\n useLayoutEffect(() => {\n if (\n window.__TSR_DEHYDRATED__ ||\n (mountLoadForRouter.current.router === router &&\n mountLoadForRouter.current.mounted)\n ) {\n return\n }\n mountLoadForRouter.current = { router, mounted: true }\n\n const tryLoad = async () => {\n try {\n await router.load()\n } catch (err) {\n console.error(err)\n }\n }\n\n tryLoad()\n }, [router])\n\n useLayoutEffect(() => {\n // The router was loading and now it's not\n if (previousIsLoading && !routerState.isLoading) {\n const toLocation = router.state.location\n const fromLocation = router.state.resolvedLocation\n const pathChanged = fromLocation.href !== toLocation.href\n\n router.emit({\n type: 'onLoad', // When the new URL has committed, when the new matches have been loaded into state.matches\n fromLocation,\n toLocation,\n pathChanged,\n })\n }\n }, [previousIsLoading, router, routerState.isLoading])\n\n useLayoutEffect(() => {\n // The router was pending and now it's not\n if (previousIsAnyPending && !isAnyPending) {\n const toLocation = router.state.location\n const fromLocation = router.state.resolvedLocation\n const pathChanged = fromLocation.href !== toLocation.href\n\n router.emit({\n type: 'onResolved',\n fromLocation,\n toLocation,\n pathChanged,\n })\n\n router.__store.setState((s) => ({\n ...s,\n status: 'idle',\n resolvedLocation: s.location,\n }))\n\n if ((document as any).querySelector) {\n if (router.state.location.hash !== '') {\n const el = document.getElementById(router.state.location.hash)\n if (el) {\n el.scrollIntoView()\n }\n }\n }\n }\n }, [isAnyPending, previousIsAnyPending, router])\n\n return null\n}\n"],"names":["useRouter","React","useRouterState","pick","usePrevious","useLayoutEffect"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAKO,SAAS,eAAe;AAC7B,QAAM,SAASA,UAAAA;AACf,QAAM,qBAAqBC,iBAAM,OAAO,EAAE,QAAQ,SAAS,OAAO;AAClE,QAAM,cAAcC,eAAAA,eAAe;AAAA,IACjC,QAAQ,CAAC,MACPC,MAAAA,KAAK,GAAG,CAAC,aAAa,YAAY,oBAAoB,iBAAiB,CAAC;AAAA,EAAA,CAC3E;AAED,QAAM,CAAC,iBAAiB,qBAAqB,IAAIF,iBAAM,cAAc;AAErE,QAAM,oBAAoBC,eAAAA,eAAe;AAAA,IACvC,QAAQ,CAAC,MAAM,EAAE,QAAQ,KAAK,CAAC,MAAM,EAAE,WAAW,SAAS;AAAA,EAAA,CAC5D;AAEK,QAAA,oBAAoBE,MAAAA,YAAY,YAAY,SAAS;AAErD,QAAA,eACJ,YAAY,aAAa,mBAAmB;AACxC,QAAA,uBAAuBA,kBAAY,YAAY;AAEjD,MAAA,CAAC,OAAO,UAAU;AACpB,WAAO,uBAAuB;AAAA,EAChC;AAIAC,QAAAA,gBAAgB,MAAM;AACpB,UAAM,QAAQ,OAAO,QAAQ,UAAU,OAAO,IAAI;AAE5C,UAAA,eAAe,OAAO,cAAc;AAAA,MACxC,IAAI,OAAO,eAAe;AAAA,MAC1B,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,IAAA,CACR;AAED,QAAI,OAAO,MAAM,SAAS,SAAS,aAAa,MAAM;AACpD,aAAO,eAAe,EAAE,GAAG,cAAc,SAAS,MAAM;AAAA,IAC1D;AAEA,WAAO,MAAM;AACL;IAAA;AAAA,EAEP,GAAA,CAAC,QAAQ,OAAO,OAAO,CAAC;AAG3BA,QAAAA,gBAAgB,MAAM;AAElB,QAAA,OAAO,sBACN,mBAAmB,QAAQ,WAAW,UACrC,mBAAmB,QAAQ,SAC7B;AACA;AAAA,IACF;AACA,uBAAmB,UAAU,EAAE,QAAQ,SAAS,KAAK;AAErD,UAAM,UAAU,YAAY;AACtB,UAAA;AACF,cAAM,OAAO;eACN,KAAK;AACZ,gBAAQ,MAAM,GAAG;AAAA,MACnB;AAAA,IAAA;AAGM;EAAA,GACP,CAAC,MAAM,CAAC;AAEXA,QAAAA,gBAAgB,MAAM;AAEhB,QAAA,qBAAqB,CAAC,YAAY,WAAW;AACzC,YAAA,aAAa,OAAO,MAAM;AAC1B,YAAA,eAAe,OAAO,MAAM;AAC5B,YAAA,cAAc,aAAa,SAAS,WAAW;AAErD,aAAO,KAAK;AAAA,QACV,MAAM;AAAA;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MAAA,CACD;AAAA,IACH;AAAA,KACC,CAAC,mBAAmB,QAAQ,YAAY,SAAS,CAAC;AAErDA,QAAAA,gBAAgB,MAAM;AAEhB,QAAA,wBAAwB,CAAC,cAAc;AACnC,YAAA,aAAa,OAAO,MAAM;AAC1B,YAAA,eAAe,OAAO,MAAM;AAC5B,YAAA,cAAc,aAAa,SAAS,WAAW;AAErD,aAAO,KAAK;AAAA,QACV,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,MAAA,CACD;AAEM,aAAA,QAAQ,SAAS,CAAC,OAAO;AAAA,QAC9B,GAAG;AAAA,QACH,QAAQ;AAAA,QACR,kBAAkB,EAAE;AAAA,MACpB,EAAA;AAEF,UAAK,SAAiB,eAAe;AACnC,YAAI,OAAO,MAAM,SAAS,SAAS,IAAI;AACrC,gBAAM,KAAK,SAAS,eAAe,OAAO,MAAM,SAAS,IAAI;AAC7D,cAAI,IAAI;AACN,eAAG,eAAe;AAAA,UACpB;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACC,GAAA,CAAC,cAAc,sBAAsB,MAAM,CAAC;AAExC,SAAA;AACT;;"}
|
package/dist/cjs/awaited.cjs
CHANGED
|
@@ -96,8 +96,7 @@ function AwaitInner(props) {
|
|
|
96
96
|
if (window.__TSR__ROUTER__) {
|
|
97
97
|
let deferred = window.__TSR__ROUTER__.getDeferred('${state.uid}');
|
|
98
98
|
if (deferred) deferred.resolve(window.__TSR__DEFERRED__${state.uid});
|
|
99
|
-
}
|
|
100
|
-
document.querySelectorAll('.tsr-script-once').forEach((el) => el.parentElement.removeChild(el));`
|
|
99
|
+
}`
|
|
101
100
|
}
|
|
102
101
|
) : null,
|
|
103
102
|
props.children(data)
|
|
@@ -114,11 +113,15 @@ function ScriptOnce({
|
|
|
114
113
|
...rest,
|
|
115
114
|
className: `tsr-script-once ${className || ""}`,
|
|
116
115
|
dangerouslySetInnerHTML: {
|
|
117
|
-
__html:
|
|
116
|
+
__html: [
|
|
117
|
+
children,
|
|
118
|
+
`document.querySelectorAll('.tsr-script-once').forEach((el) => el.parentElement.removeChild(el));`
|
|
119
|
+
].join("\n")
|
|
118
120
|
}
|
|
119
121
|
}
|
|
120
122
|
);
|
|
121
123
|
}
|
|
122
124
|
exports.Await = Await;
|
|
125
|
+
exports.ScriptOnce = ScriptOnce;
|
|
123
126
|
exports.useAwaited = useAwaited;
|
|
124
127
|
//# sourceMappingURL=awaited.cjs.map
|
package/dist/cjs/awaited.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"awaited.cjs","sources":["../../src/awaited.tsx"],"sourcesContent":["import * as React from 'react'\nimport warning from 'tiny-warning'\nimport { useRouter } from './useRouter'\nimport { defaultSerializeError } from './router'\nimport { isDehydratedDeferred } from './defer'\nimport { defaultDeserializeError, isServerSideError } from './Matches'\nimport type { DeferredPromise } from './defer'\n\nexport type AwaitOptions<T> = {\n promise: DeferredPromise<T>\n}\n\nexport function useAwaited<T>({\n promise,\n}: AwaitOptions<T>): [T, DeferredPromise<T>] {\n const router = useRouter()\n // const rerender = React.useReducer((x) => x + 1, 0)[1]\n\n const state = promise.__deferredState\n\n // Dehydrated promises only\n // Successful or errored deferred promises mean they\n // were resolved on the server and no further action is needed\n if (isDehydratedDeferred(promise) && state.status === 'pending') {\n const streamedData = (window as any)[`__TSR__DEFERRED__${state.uid}`]\n\n if (streamedData) {\n Object.assign(state, router.options.transformer.parse(streamedData))\n } else {\n let token = router.registeredDeferredsIds.get(state.uid)\n\n // If we haven't yet, create a promise and resolver that our streamed HTML can use\n // when the client-side data is streamed in and ready.\n if (!token) {\n token = {}\n router.registeredDeferredsIds.set(state.uid, token)\n router.registeredDeferreds.set(token, state)\n\n Object.assign(state, {\n resolve: () => {\n state.__resolvePromise?.()\n // rerender()\n },\n promise: new Promise((r) => {\n state.__resolvePromise = r as any\n }),\n __resolvePromise: () => {},\n })\n }\n }\n }\n\n // If the promise is pending, always throw the state.promise\n // For originating promises, this will be the original promise\n // For dehydrated promises, this will be the placeholder promise\n // that will be resolved when the server sends the real data\n if (state.status === 'pending') {\n throw isDehydratedDeferred(promise) ? state.promise : promise\n }\n\n if (state.status === 'error') {\n if (typeof document !== 'undefined') {\n if (isServerSideError(state.error)) {\n throw (\n router.options.errorSerializer?.deserialize ?? defaultDeserializeError\n )(state.error.data as any)\n } else {\n warning(\n false,\n \"Encountered a server-side error that doesn't fit the expected shape\",\n )\n throw state.error\n }\n } else {\n throw {\n data: (\n router.options.errorSerializer?.serialize ?? defaultSerializeError\n )(state.error),\n __isServerError: true,\n }\n }\n }\n\n return [promise.__deferredState.data as any, promise]\n}\n\nexport function Await<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const inner = <AwaitInner {...props} />\n if (props.fallback) {\n return <React.Suspense fallback={props.fallback}>{inner}</React.Suspense>\n }\n return inner\n}\n\nfunction AwaitInner<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const router = useRouter()\n const [data, promise] = useAwaited(props)\n const state = promise.__deferredState\n // If we are the originator of the promise,\n // inject the state into the HTML stream\n return (\n <>\n {!isDehydratedDeferred(promise) ? (\n <ScriptOnce\n children={`window.__TSR__DEFERRED__${state.uid} = ${JSON.stringify(router.options.transformer.stringify(state))}\n if (window.__TSR__ROUTER__) {\n let deferred = window.__TSR__ROUTER__.getDeferred('${state.uid}');\n if (deferred) deferred.resolve(window.__TSR__DEFERRED__${state.uid});\n }
|
|
1
|
+
{"version":3,"file":"awaited.cjs","sources":["../../src/awaited.tsx"],"sourcesContent":["import * as React from 'react'\nimport warning from 'tiny-warning'\nimport { useRouter } from './useRouter'\nimport { defaultSerializeError } from './router'\nimport { isDehydratedDeferred } from './defer'\nimport { defaultDeserializeError, isServerSideError } from './Matches'\nimport type { DeferredPromise } from './defer'\n\nexport type AwaitOptions<T> = {\n promise: DeferredPromise<T>\n}\n\nexport function useAwaited<T>({\n promise,\n}: AwaitOptions<T>): [T, DeferredPromise<T>] {\n const router = useRouter()\n // const rerender = React.useReducer((x) => x + 1, 0)[1]\n\n const state = promise.__deferredState\n\n // Dehydrated promises only\n // Successful or errored deferred promises mean they\n // were resolved on the server and no further action is needed\n if (isDehydratedDeferred(promise) && state.status === 'pending') {\n const streamedData = (window as any)[`__TSR__DEFERRED__${state.uid}`]\n\n if (streamedData) {\n Object.assign(state, router.options.transformer.parse(streamedData))\n } else {\n let token = router.registeredDeferredsIds.get(state.uid)\n\n // If we haven't yet, create a promise and resolver that our streamed HTML can use\n // when the client-side data is streamed in and ready.\n if (!token) {\n token = {}\n router.registeredDeferredsIds.set(state.uid, token)\n router.registeredDeferreds.set(token, state)\n\n Object.assign(state, {\n resolve: () => {\n state.__resolvePromise?.()\n // rerender()\n },\n promise: new Promise((r) => {\n state.__resolvePromise = r as any\n }),\n __resolvePromise: () => {},\n })\n }\n }\n }\n\n // If the promise is pending, always throw the state.promise\n // For originating promises, this will be the original promise\n // For dehydrated promises, this will be the placeholder promise\n // that will be resolved when the server sends the real data\n if (state.status === 'pending') {\n throw isDehydratedDeferred(promise) ? state.promise : promise\n }\n\n if (state.status === 'error') {\n if (typeof document !== 'undefined') {\n if (isServerSideError(state.error)) {\n throw (\n router.options.errorSerializer?.deserialize ?? defaultDeserializeError\n )(state.error.data as any)\n } else {\n warning(\n false,\n \"Encountered a server-side error that doesn't fit the expected shape\",\n )\n throw state.error\n }\n } else {\n throw {\n data: (\n router.options.errorSerializer?.serialize ?? defaultSerializeError\n )(state.error),\n __isServerError: true,\n }\n }\n }\n\n return [promise.__deferredState.data as any, promise]\n}\n\nexport function Await<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const inner = <AwaitInner {...props} />\n if (props.fallback) {\n return <React.Suspense fallback={props.fallback}>{inner}</React.Suspense>\n }\n return inner\n}\n\nfunction AwaitInner<T>(\n props: AwaitOptions<T> & {\n fallback?: React.ReactNode\n children: (result: T) => React.ReactNode\n },\n) {\n const router = useRouter()\n const [data, promise] = useAwaited(props)\n const state = promise.__deferredState\n // If we are the originator of the promise,\n // inject the state into the HTML stream\n return (\n <>\n {!isDehydratedDeferred(promise) ? (\n <ScriptOnce\n children={`window.__TSR__DEFERRED__${state.uid} = ${JSON.stringify(router.options.transformer.stringify(state))}\n if (window.__TSR__ROUTER__) {\n let deferred = window.__TSR__ROUTER__.getDeferred('${state.uid}');\n if (deferred) deferred.resolve(window.__TSR__DEFERRED__${state.uid});\n }`}\n />\n ) : null}\n {props.children(data)}\n </>\n )\n}\n\nexport function ScriptOnce({\n className,\n children,\n ...rest\n}: { children: string } & React.HTMLProps<HTMLScriptElement>) {\n return (\n <script\n {...rest}\n className={`tsr-script-once ${className || ''}`}\n dangerouslySetInnerHTML={{\n __html: [\n children,\n `document.querySelectorAll('.tsr-script-once').forEach((el) => el.parentElement.removeChild(el));`,\n ].join('\\n'),\n }}\n />\n )\n}\n"],"names":["router","useRouter","isDehydratedDeferred","_a","isServerSideError","defaultDeserializeError","defaultSerializeError","jsx","React","jsxs","Fragment"],"mappings":"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"}
|
package/dist/cjs/awaited.d.cts
CHANGED
|
@@ -8,3 +8,6 @@ export declare function Await<T>(props: AwaitOptions<T> & {
|
|
|
8
8
|
fallback?: React.ReactNode;
|
|
9
9
|
children: (result: T) => React.ReactNode;
|
|
10
10
|
}): React.JSX.Element;
|
|
11
|
+
export declare function ScriptOnce({ className, children, ...rest }: {
|
|
12
|
+
children: string;
|
|
13
|
+
} & React.HTMLProps<HTMLScriptElement>): React.JSX.Element;
|
package/dist/cjs/index.cjs
CHANGED
|
@@ -52,6 +52,7 @@ Object.defineProperty(exports, "createMemoryHistory", {
|
|
|
52
52
|
exports.invariant = invariant;
|
|
53
53
|
exports.warning = warning;
|
|
54
54
|
exports.Await = awaited.Await;
|
|
55
|
+
exports.ScriptOnce = awaited.ScriptOnce;
|
|
55
56
|
exports.useAwaited = awaited.useAwaited;
|
|
56
57
|
exports.defer = defer.defer;
|
|
57
58
|
exports.isDehydratedDeferred = defer.isDehydratedDeferred;
|
package/dist/cjs/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/cjs/index.d.cts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export { createHistory, createBrowserHistory, createHashHistory, createMemoryHistory, type BlockerFn, type HistoryLocation, type RouterHistory, type ParsedPath, type HistoryState, } from '@tanstack/history';
|
|
2
2
|
export { default as invariant } from 'tiny-invariant';
|
|
3
3
|
export { default as warning } from 'tiny-warning';
|
|
4
|
-
export { useAwaited, Await, type AwaitOptions } from './awaited.cjs';
|
|
4
|
+
export { useAwaited, Await, type AwaitOptions, ScriptOnce } from './awaited.cjs';
|
|
5
5
|
export { defer, isDehydratedDeferred, type DeferredPromiseState, type DeferredPromise, } from './defer.cjs';
|
|
6
6
|
export { CatchBoundary, ErrorComponent } from './CatchBoundary.cjs';
|
|
7
7
|
export { FileRoute, createFileRoute, FileRouteLoader, LazyRoute, createLazyRoute, createLazyFileRoute, type FileRoutesByPath, type LazyRouteOptions, } from './fileRoute.cjs';
|
package/dist/cjs/router.cjs
CHANGED
|
@@ -567,7 +567,7 @@ class Router {
|
|
|
567
567
|
resetScroll
|
|
568
568
|
});
|
|
569
569
|
};
|
|
570
|
-
this.navigate = ({ from, to, ...rest }) => {
|
|
570
|
+
this.navigate = ({ from, to, __isRedirect, ...rest }) => {
|
|
571
571
|
const toString = String(to);
|
|
572
572
|
let isExternal;
|
|
573
573
|
try {
|
|
@@ -601,12 +601,6 @@ class Router {
|
|
|
601
601
|
const prevLocation = this.state.resolvedLocation;
|
|
602
602
|
const pathDidChange = prevLocation.href !== next.href;
|
|
603
603
|
this.cancelMatches();
|
|
604
|
-
this.emit({
|
|
605
|
-
type: "onBeforeLoad",
|
|
606
|
-
fromLocation: prevLocation,
|
|
607
|
-
toLocation: next,
|
|
608
|
-
pathChanged: pathDidChange
|
|
609
|
-
});
|
|
610
604
|
let pendingMatches;
|
|
611
605
|
this.__store.batch(() => {
|
|
612
606
|
pendingMatches = this.matchRoutes(next.pathname, next.search);
|
|
@@ -622,6 +616,20 @@ class Router {
|
|
|
622
616
|
})
|
|
623
617
|
}));
|
|
624
618
|
});
|
|
619
|
+
if (!this.state.redirect) {
|
|
620
|
+
this.emit({
|
|
621
|
+
type: "onBeforeNavigate",
|
|
622
|
+
fromLocation: prevLocation,
|
|
623
|
+
toLocation: next,
|
|
624
|
+
pathChanged: pathDidChange
|
|
625
|
+
});
|
|
626
|
+
}
|
|
627
|
+
this.emit({
|
|
628
|
+
type: "onBeforeLoad",
|
|
629
|
+
fromLocation: prevLocation,
|
|
630
|
+
toLocation: next,
|
|
631
|
+
pathChanged: pathDidChange
|
|
632
|
+
});
|
|
625
633
|
await this.loadMatches({
|
|
626
634
|
matches: pendingMatches,
|
|
627
635
|
location: next,
|
|
@@ -674,7 +682,7 @@ class Router {
|
|
|
674
682
|
if (redirects.isResolvedRedirect(err)) {
|
|
675
683
|
redirect = err;
|
|
676
684
|
if (!this.isServer) {
|
|
677
|
-
this.navigate({ ...err, replace: true });
|
|
685
|
+
this.navigate({ ...err, replace: true, __isRedirect: true });
|
|
678
686
|
this.load();
|
|
679
687
|
}
|
|
680
688
|
} else if (notFound.isNotFound(err)) {
|
|
@@ -1146,8 +1154,6 @@ class Router {
|
|
|
1146
1154
|
}
|
|
1147
1155
|
return match;
|
|
1148
1156
|
};
|
|
1149
|
-
this.injectHtml = async (html) => {
|
|
1150
|
-
};
|
|
1151
1157
|
this.registeredDeferredsIds = /* @__PURE__ */ new Map();
|
|
1152
1158
|
this.registeredDeferreds = /* @__PURE__ */ new WeakMap();
|
|
1153
1159
|
this.getDeferred = (uid) => {
|