@tanstack/react-router 1.36.2 → 1.38.1
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/Transitioner.cjs +1 -1
- package/dist/cjs/Transitioner.cjs.map +1 -1
- package/dist/cjs/router.cjs +17 -16
- package/dist/cjs/router.cjs.map +1 -1
- package/dist/esm/Transitioner.js +1 -1
- package/dist/esm/Transitioner.js.map +1 -1
- package/dist/esm/router.js +17 -16
- package/dist/esm/router.js.map +1 -1
- package/package.json +1 -1
- package/src/Transitioner.tsx +1 -1
- package/src/router.ts +27 -20
|
@@ -37,7 +37,7 @@ function Transitioner() {
|
|
|
37
37
|
if (!router.isServer) {
|
|
38
38
|
router.startReactTransition = startReactTransition_;
|
|
39
39
|
}
|
|
40
|
-
|
|
40
|
+
React__namespace.useEffect(() => {
|
|
41
41
|
const unsub = router.history.subscribe(router.load);
|
|
42
42
|
const nextLocation = router.buildLocation({
|
|
43
43
|
to: router.latestLocation.pathname,
|
|
@@ -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
|
|
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 React.useEffect(() => {\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;AAIAH,mBAAM,UAAU,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;AAG3BI,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/router.cjs
CHANGED
|
@@ -694,7 +694,6 @@ class Router {
|
|
|
694
694
|
redirect = err;
|
|
695
695
|
if (!this.isServer) {
|
|
696
696
|
this.navigate({ ...err, replace: true, __isRedirect: true });
|
|
697
|
-
this.load();
|
|
698
697
|
}
|
|
699
698
|
} else if (notFound.isNotFound(err)) {
|
|
700
699
|
notFound$1 = err;
|
|
@@ -765,7 +764,7 @@ class Router {
|
|
|
765
764
|
}
|
|
766
765
|
if (redirects.isRedirect(err)) {
|
|
767
766
|
rendered = true;
|
|
768
|
-
err = this.resolveRedirect(err);
|
|
767
|
+
err = this.resolveRedirect({ ...err, _fromLocation: location });
|
|
769
768
|
throw err;
|
|
770
769
|
} else if (notFound.isNotFound(err)) {
|
|
771
770
|
this.handleNotFound(matches, err);
|
|
@@ -777,7 +776,6 @@ class Router {
|
|
|
777
776
|
await new Promise((resolveAll, rejectAll) => {
|
|
778
777
|
;
|
|
779
778
|
(async () => {
|
|
780
|
-
var _a, _b;
|
|
781
779
|
try {
|
|
782
780
|
for (let [index, match] of matches.entries()) {
|
|
783
781
|
const parentMatch = matches[index - 1];
|
|
@@ -809,7 +807,7 @@ class Router {
|
|
|
809
807
|
loadPromise
|
|
810
808
|
}));
|
|
811
809
|
const handleSerialError = (err, routerCode) => {
|
|
812
|
-
var
|
|
810
|
+
var _a, _b;
|
|
813
811
|
if (err instanceof Promise) {
|
|
814
812
|
throw err;
|
|
815
813
|
}
|
|
@@ -817,7 +815,7 @@ class Router {
|
|
|
817
815
|
firstBadMatchIndex = firstBadMatchIndex ?? index;
|
|
818
816
|
handleRedirectAndNotFound(match, err);
|
|
819
817
|
try {
|
|
820
|
-
(
|
|
818
|
+
(_b = (_a = route.options).onError) == null ? void 0 : _b.call(_a, err);
|
|
821
819
|
} catch (errorHandlerErr) {
|
|
822
820
|
err = errorHandlerErr;
|
|
823
821
|
handleRedirectAndNotFound(match, err);
|
|
@@ -838,25 +836,27 @@ class Router {
|
|
|
838
836
|
}
|
|
839
837
|
try {
|
|
840
838
|
const parentContext = (parentMatch == null ? void 0 : parentMatch.context) ?? this.options.context ?? {};
|
|
841
|
-
matches[index] = match =
|
|
839
|
+
matches[index] = match = {
|
|
842
840
|
...match,
|
|
843
841
|
routeContext: utils.replaceEqualDeep(
|
|
844
842
|
match.routeContext,
|
|
845
843
|
parentContext
|
|
846
844
|
),
|
|
845
|
+
context: utils.replaceEqualDeep(match.context, parentContext),
|
|
847
846
|
abortController
|
|
848
|
-
}
|
|
849
|
-
const
|
|
847
|
+
};
|
|
848
|
+
const beforeLoadFnContext = {
|
|
850
849
|
search: match.search,
|
|
851
850
|
abortController,
|
|
852
851
|
params: match.params,
|
|
853
852
|
preload: !!preload,
|
|
854
|
-
context:
|
|
853
|
+
context: match.routeContext,
|
|
855
854
|
location,
|
|
856
855
|
navigate: (opts) => this.navigate({ ...opts, _fromLocation: location }),
|
|
857
856
|
buildLocation: this.buildLocation,
|
|
858
857
|
cause: preload ? "preload" : match.cause
|
|
859
|
-
}
|
|
858
|
+
};
|
|
859
|
+
const beforeLoadContext = route.options.beforeLoad ? await route.options.beforeLoad(beforeLoadFnContext) ?? {} : {};
|
|
860
860
|
checkLatest();
|
|
861
861
|
if (redirects.isRedirect(beforeLoadContext) || notFound.isNotFound(beforeLoadContext)) {
|
|
862
862
|
handleSerialError(beforeLoadContext, "BEFORE_LOAD");
|
|
@@ -899,8 +899,8 @@ class Router {
|
|
|
899
899
|
cause: preload ? "preload" : match.cause,
|
|
900
900
|
route
|
|
901
901
|
};
|
|
902
|
-
const
|
|
903
|
-
var
|
|
902
|
+
const fetchAndResolveInLoaderLifetime = async () => {
|
|
903
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
904
904
|
const existing = RouterProvider.getRouteMatch(this.state, match.id);
|
|
905
905
|
let lazyPromise = Promise.resolve();
|
|
906
906
|
let componentsPromise = Promise.resolve();
|
|
@@ -926,7 +926,7 @@ class Router {
|
|
|
926
926
|
fetchCount: match.fetchCount + 1
|
|
927
927
|
})
|
|
928
928
|
);
|
|
929
|
-
lazyPromise = ((
|
|
929
|
+
lazyPromise = ((_a = route.lazyFn) == null ? void 0 : _a.call(route).then((lazyRoute) => {
|
|
930
930
|
Object.assign(route.options, lazyRoute.options);
|
|
931
931
|
})) || Promise.resolve();
|
|
932
932
|
componentsPromise = lazyPromise.then(
|
|
@@ -941,7 +941,7 @@ class Router {
|
|
|
941
941
|
);
|
|
942
942
|
await lazyPromise;
|
|
943
943
|
checkLatest();
|
|
944
|
-
loaderPromise = (_c = (
|
|
944
|
+
loaderPromise = (_c = (_b = route.options).loader) == null ? void 0 : _c.call(_b, loaderContext);
|
|
945
945
|
matches[index] = match = updateMatch(
|
|
946
946
|
match.id,
|
|
947
947
|
(prev) => ({
|
|
@@ -1006,7 +1006,7 @@ class Router {
|
|
|
1006
1006
|
};
|
|
1007
1007
|
const fetchWithRedirectAndNotFound = async () => {
|
|
1008
1008
|
try {
|
|
1009
|
-
await
|
|
1009
|
+
await fetchAndResolveInLoaderLifetime();
|
|
1010
1010
|
} catch (err) {
|
|
1011
1011
|
checkLatest();
|
|
1012
1012
|
handleRedirectAndNotFound(match, err);
|
|
@@ -1146,7 +1146,8 @@ class Router {
|
|
|
1146
1146
|
if ((opts == null ? void 0 : opts.pending) && this.state.status !== "pending") {
|
|
1147
1147
|
return false;
|
|
1148
1148
|
}
|
|
1149
|
-
const
|
|
1149
|
+
const pending = (opts == null ? void 0 : opts.pending) === void 0 ? !this.state.isLoading : opts.pending;
|
|
1150
|
+
const baseLocation = pending ? this.latestLocation : this.state.resolvedLocation;
|
|
1150
1151
|
const match = path.matchPathname(this.basepath, baseLocation.pathname, {
|
|
1151
1152
|
...opts,
|
|
1152
1153
|
to: next.pathname
|