@tanstack/react-router 1.48.4 → 1.49.1

package/dist/cjs/router.cjs

@@ -10,6 +10,7 @@ const utils = require("./utils.cjs");
 const path = require("./path.cjs");
 const redirects = require("./redirects.cjs");
 const notFound = require("./not-found.cjs");
+const transformer = require("./transformer.cjs");
 const componentTypes = [
   "component",
   "errorComponent",
@@ -210,12 +211,12 @@ class Router {
       });
       return resolvedPath;
     };
-    this.matchRoutes = (pathname, locationSearch, opts) => {
+    this.matchRoutes = (next, opts) => {
       let routeParams = {};
       const foundRoute = this.flatRoutes.find((route) => {
         const matchedParams = path.matchPathname(
           this.basepath,
-          path.trimPathRight(pathname),
+          path.trimPathRight(next.pathname),
           {
             to: route.fullPath,
             caseSensitive: route.options.caseSensitive ?? this.options.caseSensitive,
@@ -235,7 +236,7 @@ class Router {
         // If we found a route, and it's not an index route and we have left over path
         foundRoute ? foundRoute.path !== "/" && routeParams["**"] : (
           // Or if we didn't find a route and we have left over path
-          path.trimPathRight(pathname)
+          path.trimPathRight(next.pathname)
         )
       ) {
         if (this.options.notFoundRoute) {
@@ -284,10 +285,10 @@ class Router {
       });
       const matches = [];
       matchedRoutes.forEach((route, index) => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
         const parentMatch = matches[index - 1];
         const [preMatchSearch, searchError] = (() => {
-          const parentSearch = (parentMatch == null ? void 0 : parentMatch.search) ?? locationSearch;
+          const parentSearch = (parentMatch == null ? void 0 : parentMatch.search) ?? next.search;
           try {
             const validator = typeof route.options.validateSearch === "object" ? route.options.validateSearch.parse : route.options.validateSearch;
             const search = (validator == null ? void 0 : validator(parentSearch)) ?? {};
@@ -345,8 +346,9 @@ class Router {
             isFetching: false,
             error: void 0,
             paramsError: parseErrors[index],
-            routeContext: void 0,
-            context: void 0,
+            __routeContext: {},
+            __beforeLoadContext: {},
+            context: {},
             abortController: new AbortController(),
             fetchCount: 0,
             cause,
@@ -375,6 +377,30 @@ class Router {
         }
         match.search = utils.replaceEqualDeep(match.search, preMatchSearch);
         match.searchError = searchError;
+        const parentMatchId = parentMatch == null ? void 0 : parentMatch.id;
+        const parentContext = !parentMatchId ? this.options.context ?? {} : parentMatch.context ?? this.options.context ?? {};
+        match.context = {
+          ...parentContext,
+          ...match.__routeContext,
+          ...match.__beforeLoadContext
+        };
+        const contextFnContext = {
+          search: match.search,
+          params: match.params,
+          context: match.context,
+          location: next,
+          navigate: (opts2) => this.navigate({ ...opts2, _fromLocation: next }),
+          buildLocation: this.buildLocation,
+          cause: match.cause,
+          abortController: match.abortController,
+          preload: !!match.preload
+        };
+        match.__routeContext = ((_l = (_k = route.options).context) == null ? void 0 : _l.call(_k, contextFnContext)) ?? {};
+        match.context = {
+          ...parentContext,
+          ...match.__routeContext,
+          ...match.__beforeLoadContext
+        };
         matches.push(match);
       });
       return matches;
@@ -394,10 +420,10 @@ class Router {
     this.buildLocation = (opts) => {
       const build = (dest = {}, matches) => {
         var _a, _b, _c;
-        const fromMatches = dest._fromLocation != null ? this.matchRoutes(
-          dest._fromLocation.pathname,
-          dest.fromSearch || dest._fromLocation.search
-        ) : this.state.matches;
+        const fromMatches = dest._fromLocation != null ? this.matchRoutes({
+          ...dest._fromLocation,
+          search: dest.fromSearch || dest._fromLocation.search
+        }) : this.state.matches;
         const fromMatch = dest.from != null ? fromMatches.find(
           (d) => path.matchPathname(this.basepath, path.trimPathRight(d.pathname), {
             to: dest.from,
@@ -489,8 +515,8 @@ class Router {
             maskedNext = build(maskedDest);
           }
         }
-        const nextMatches = this.matchRoutes(next.pathname, next.search);
-        const maskedMatches = maskedNext ? this.matchRoutes(maskedNext.pathname, maskedNext.search) : void 0;
+        const nextMatches = this.matchRoutes(next);
+        const maskedMatches = maskedNext ? this.matchRoutes(maskedNext) : void 0;
         const maskedFinal = maskedNext ? build(maskedDest, maskedMatches) : void 0;
         const final = build(dest, nextMatches);
         if (maskedFinal) {
@@ -568,6 +594,13 @@ class Router {
       ignoreBlocker,
       ...rest
     } = {}) => {
+      const href = rest.href;
+      if (href) {
+        const parsed = history.parseHref(href, {});
+        rest.to = parsed.pathname;
+        rest.search = this.options.parseSearch(parsed.search);
+        rest.hash = parsed.hash;
+      }
       const location = this.buildLocation(rest);
       return this.commitLocation({
         ...location,
@@ -577,7 +610,7 @@ class Router {
         ignoreBlocker
       });
     };
-    this.navigate = ({ from, to, __isRedirect, ...rest }) => {
+    this.navigate = ({ to, __isRedirect, ...rest }) => {
       const toString = String(to);
       let isExternal;
       try {
@@ -591,7 +624,6 @@ class Router {
       );
       return this.buildAndCommitLocation({
         ...rest,
-        from,
         to
         // to: toString,
       });
@@ -604,7 +636,8 @@ class Router {
       }));
       let redirect;
       let notFound$1;
-      const loadPromise = new Promise((resolve) => {
+      let loadPromise;
+      loadPromise = new Promise((resolve) => {
         this.startReactTransition(async () => {
           var _a;
           try {
@@ -614,7 +647,7 @@ class Router {
             this.cancelMatches();
             let pendingMatches;
             this.__store.batch(() => {
-              pendingMatches = this.matchRoutes(next.pathname, next.search);
+              pendingMatches = this.matchRoutes(next);
               this.__store.setState((s) => ({
                 ...s,
                 status: "pending",
@@ -834,6 +867,7 @@ class Router {
               };
               for (const [index, { id: matchId, routeId }] of matches.entries()) {
                 const existingMatch = this.getMatch(matchId);
+                const parentMatchId = (_a = matches[index - 1]) == null ? void 0 : _a.id;
                 if (
                   // If we are in the middle of a load, either of these will be present
                   // (not to be confused with `loadPromise`, which is always defined)
@@ -852,13 +886,6 @@ class Router {
                     }));
                     const route = this.looseRoutesById[routeId];
                     const abortController = new AbortController();
-                    const parentMatchId = (_a = matches[index - 1]) == null ? void 0 : _a.id;
-                    const getParentContext = () => {
-                      if (!parentMatchId) {
-                        return this.options.context ?? {};
-                      }
-                      return this.getMatch(parentMatchId).context ?? this.options.context ?? {};
-                    };
                     const pendingMs = route.options.pendingMs ?? this.options.defaultPendingMs;
                     const shouldPending = !!(onReady && !this.isServer && !preload && (route.options.loader || route.options.beforeLoad) && typeof pendingMs === "number" && pendingMs !== Infinity && (route.options.pendingComponent ?? this.options.defaultPendingComponent));
                     let pendingTimeout;
@@ -877,47 +904,54 @@ class Router {
                     if (searchError) {
                       handleSerialError(index, searchError, "VALIDATE_SEARCH");
                     }
-                    const parentContext = getParentContext();
+                    const getParentMatchContext = () => parentMatchId ? this.getMatch(parentMatchId).context : this.options.context ?? {};
                     updateMatch(matchId, (prev) => ({
                       ...prev,
                       isFetching: "beforeLoad",
                       fetchCount: prev.fetchCount + 1,
-                      routeContext: utils.replaceEqualDeep(
-                        prev.routeContext,
-                        parentContext
-                      ),
-                      context: utils.replaceEqualDeep(prev.context, parentContext),
                       abortController,
-                      pendingTimeout
+                      pendingTimeout,
+                      context: {
+                        ...getParentMatchContext(),
+                        ...prev.__routeContext,
+                        ...prev.__beforeLoadContext
+                      }
                     }));
-                    const { search, params, routeContext, cause } = this.getMatch(matchId);
+                    const { search, params, context, cause } = this.getMatch(matchId);
                     const beforeLoadFnContext = {
                       search,
                       abortController,
                       params,
                       preload: !!preload,
-                      context: routeContext,
+                      context,
                       location,
                       navigate: (opts) => this.navigate({ ...opts, _fromLocation: location }),
                       buildLocation: this.buildLocation,
                       cause: preload ? "preload" : cause
                     };
-                    const beforeLoadContext = await ((_c = (_b = route.options).beforeLoad) == null ? void 0 : _c.call(_b, beforeLoadFnContext)) ?? {};
+                    let beforeLoadContext = await ((_c = (_b = route.options).beforeLoad) == null ? void 0 : _c.call(_b, beforeLoadFnContext)) ?? {};
+                    if (this.serializeLoaderData) {
+                      beforeLoadContext = this.serializeLoaderData(
+                        "__beforeLoadContext",
+                        beforeLoadContext,
+                        {
+                          router: this,
+                          match: this.getMatch(matchId)
+                        }
+                      );
+                    }
                     if (redirects.isRedirect(beforeLoadContext) || notFound.isNotFound(beforeLoadContext)) {
                       handleSerialError(index, beforeLoadContext, "BEFORE_LOAD");
                     }
                     updateMatch(matchId, (prev) => {
-                      const routeContext2 = {
-                        ...prev.routeContext,
-                        ...beforeLoadContext
-                      };
                       return {
                         ...prev,
-                        routeContext: utils.replaceEqualDeep(
-                          prev.routeContext,
-                          routeContext2
-                        ),
-                        context: utils.replaceEqualDeep(prev.context, routeContext2),
+                        __beforeLoadContext: beforeLoadContext,
+                        context: {
+                          ...getParentMatchContext(),
+                          ...prev.__routeContext,
+                          ...beforeLoadContext
+                        },
                         abortController
                       };
                     });
@@ -1010,10 +1044,14 @@ class Router {
                             await route._lazyPromise;
                             let loaderData = await ((_b2 = (_a2 = route.options).loader) == null ? void 0 : _b2.call(_a2, getLoaderContext()));
                             if (this.serializeLoaderData) {
-                              loaderData = this.serializeLoaderData(loaderData, {
-                                router: this,
-                                match: this.getMatch(matchId)
-                              });
+                              loaderData = this.serializeLoaderData(
+                                "loaderData",
+                                loaderData,
+                                {
+                                  router: this,
+                                  match: this.getMatch(matchId)
+                                }
+                              );
                             }
                             handleRedirectAndNotFound(
                               this.getMatch(matchId),
@@ -1065,7 +1103,8 @@ class Router {
                         }
                       };
                       const { status, invalid } = this.getMatch(matchId);
-                      if (status === "success" && (invalid || (shouldReload ?? age > staleAge))) {
+                      if (preload && route.options.preload === false) {
+                      } else if (status === "success" && (invalid || (shouldReload ?? age > staleAge))) {
                         ;
                         (async () => {
                           try {
@@ -1147,7 +1186,7 @@ class Router {
     };
     this.preloadRoute = async (opts) => {
       const next = this.buildLocation(opts);
-      let matches = this.matchRoutes(next.pathname, next.search, {
+      let matches = this.matchRoutes(next, {
         throwOnError: true,
         preload: true
       });
@@ -1265,10 +1304,7 @@ class Router {
       this.dehydratedData = ctx.payload;
       (_c = (_b = this.options).hydrate) == null ? void 0 : _c.call(_b, ctx.payload);
       const dehydratedState = ctx.router.state;
-      const matches = this.matchRoutes(
-        this.state.location.pathname,
-        this.state.location.search
-      ).map((match) => {
+      const matches = this.matchRoutes(this.state.location).map((match) => {
         const dehydratedMatch = dehydratedState.dehydratedMatches.find(
           (d) => d.id === match.id
         );
@@ -1368,10 +1404,7 @@ class Router {
       notFoundMode: options.notFoundMode ?? "fuzzy",
       stringifySearch: options.stringifySearch ?? searchParams.defaultStringifySearch,
       parseSearch: options.parseSearch ?? searchParams.defaultParseSearch,
-      transformer: options.transformer ?? {
-        parse: JSON.parse,
-        stringify: JSON.stringify
-      }
+      transformer: options.transformer ?? transformer.defaultTransformer
     });
     if (typeof document !== "undefined") {
       window.__TSR__ROUTER__ = this;