@tanstack/react-router 0.0.1-beta.34 → 0.0.1-beta.36

package/build/umd/index.development.js

@@ -1089,10 +1089,10 @@
   }
   function matchByPath(basepath, from, matchLocation) {
     var _matchLocation$to;
-    if (basepath && !from.startsWith(basepath)) {
+    if (!from.startsWith(basepath)) {
       return undefined;
     }
-    from = from.startsWith(basepath) ? from.substring(basepath.length) : from;
+    from = basepath != '/' ? from.substring(basepath.length) : from;
     const baseSegments = parsePathname(from);
     const to = "" + ((_matchLocation$to = matchLocation.to) != null ? _matchLocation$to : '*');
     const routeSegments = parsePathname(to);
@@ -1252,7 +1252,6 @@
             actionState.status = 'success';
             return res;
           } catch (err) {
-            console.log('tanner');
             console.error(err);
             actionState.error = err;
             actionState.status = 'error';
@@ -1406,7 +1405,7 @@
         validate: () => {
           var _routeMatch$parentMat, _routeMatch$parentMat2;
           // Validate the search params and stabilize them
-          const parentSearch = (_routeMatch$parentMat = (_routeMatch$parentMat2 = routeMatch.parentMatch) == null ? void 0 : _routeMatch$parentMat2.search) != null ? _routeMatch$parentMat : router.__location.search;
+          const parentSearch = (_routeMatch$parentMat = (_routeMatch$parentMat2 = routeMatch.parentMatch) == null ? void 0 : _routeMatch$parentMat2.search) != null ? _routeMatch$parentMat : router.state.currentLocation.search;
           try {
             var _validator;
             const prevSearch = routeMatch.routeSearch;
@@ -1458,7 +1457,7 @@
         // If this is a preload, add it to the preload cache
         if (loaderOpts != null && loaderOpts.preload && minMaxAge > 0) {
           // If the match is currently active, don't preload it
-          if (router.state.matches.find(d => d.matchId === routeMatch.matchId)) {
+          if (router.state.currentMatches.find(d => d.matchId === routeMatch.matchId)) {
             return;
           }
           router.matchCache[routeMatch.matchId] = {
@@ -1612,8 +1611,9 @@
   function getInitialRouterState() {
     return {
       status: 'idle',
-      location: null,
-      matches: [],
+      latestLocation: null,
+      currentLocation: null,
+      currentMatches: [],
       actions: {},
       loaders: {},
       lastUpdated: Date.now(),
@@ -1644,7 +1644,6 @@
       basepath: '',
       routeTree: undefined,
       routesById: {},
-      __location: undefined,
       //
       resolveNavigation: () => {},
       matchCache: {},
@@ -1664,65 +1663,53 @@
         return router.routesById[id];
       },
       notify: () => {
-        const isFetching = router.state.status === 'loading' || router.state.matches.some(d => d.isFetching);
-        const isPreloading = Object.values(router.matchCache).some(d => d.match.isFetching && !router.state.matches.find(dd => dd.matchId === d.match.matchId));
+        const isFetching = router.state.status === 'loading' || router.state.currentMatches.some(d => d.isFetching);
+        const isPreloading = Object.values(router.matchCache).some(d => d.match.isFetching && !router.state.currentMatches.find(dd => dd.matchId === d.match.matchId));
         if (router.state.isFetching !== isFetching || router.state.isPreloading !== isPreloading) {
           router.state = _extends({}, router.state, {
             isFetching,
             isPreloading
           });
         }
-        cascadeLoaderData(router.state.matches);
+        cascadeLoaderData(router.state.currentMatches);
         router.listeners.forEach(listener => listener(router));
       },
       dehydrate: () => {
         return {
-          location: router.__location,
-          state: _extends({}, pick(router.state, ['status', 'location', 'lastUpdated', 'location']), {
-            matches: router.state.matches.map(match => pick(match, ['matchId', 'status', 'routeLoaderData', 'loaderData', 'isInvalid', 'invalidAt']))
+          state: _extends({}, pick(router.state, ['latestLocation', 'currentLocation', 'status', 'lastUpdated']), {
+            currentMatches: router.state.currentMatches.map(match => pick(match, ['matchId', 'status', 'routeLoaderData', 'loaderData', 'isInvalid', 'invalidAt']))
           }),
           context: router.options.context
         };
       },
       hydrate: dehydratedState => {
         // Update the location
-        router.__location = dehydratedState.location;
+        router.state.latestLocation = dehydratedState.state.latestLocation;
+        router.state.currentLocation = dehydratedState.state.currentLocation;
 
         // Update the context
         router.options.context = dehydratedState.context;
 
         // Match the routes
-        const matches = router.matchRoutes(router.__location.pathname, {
+        const currentMatches = router.matchRoutes(router.state.latestLocation.pathname, {
           strictParseParams: true
         });
-        matches.forEach((match, index) => {
-          const dehydratedMatch = dehydratedState.state.matches[index];
+        currentMatches.forEach((match, index) => {
+          const dehydratedMatch = dehydratedState.state.currentMatches[index];
           invariant(dehydratedMatch, 'Oh no! Dehydrated route matches did not match the active state of the router 😬');
           Object.assign(match, dehydratedMatch);
         });
-        matches.forEach(match => match.__.validate());
+        currentMatches.forEach(match => match.__.validate());
         router.state = _extends({}, router.state, dehydratedState, {
-          matches
+          currentMatches
         });
       },
       mount: () => {
-        router.__.buildLocation({
-          to: '.',
-          search: true,
-          hash: true
-        });
-
-        // If the current location isn't updated, trigger a navigation
-        // to the current location. Otherwise, load the current location.
-        // if (next.href !== router.__location.href) {
-        //   router.__.commitLocation(next, true)
-        // }
-
-        if (!router.state.matches.length) {
+        if (!router.state.currentMatches.length) {
           router.load();
         }
         const unsub = router.history.listen(event => {
-          router.load(router.__.parseLocation(event.location, router.__location));
+          router.load(router.__.parseLocation(event.location, router.state.latestLocation));
         });
 
         // addEventListener does not exist in React Native, but window does
@@ -1747,12 +1734,12 @@
       update: opts => {
         var _trimPath;
         const newHistory = (opts == null ? void 0 : opts.history) !== router.history;
-        if (!router.__location || newHistory) {
+        if (!router.state.latestLocation || newHistory) {
           if (opts != null && opts.history) {
             router.history = opts.history;
           }
-          router.__location = router.__.parseLocation(router.history.location);
-          router.state.location = router.__location;
+          router.state.latestLocation = router.__.parseLocation(router.history.location);
+          router.state.currentLocation = router.state.latestLocation;
         }
         Object.assign(router.options, opts);
         const {
@@ -1767,8 +1754,8 @@
         return router;
       },
       cancelMatches: () => {
-        var _router$state$pending, _router$state$pending2;
-        [...router.state.matches, ...((_router$state$pending = (_router$state$pending2 = router.state.pending) == null ? void 0 : _router$state$pending2.matches) != null ? _router$state$pending : [])].forEach(match => {
+        var _router$state$pending;
+        [...router.state.currentMatches, ...((_router$state$pending = router.state.pendingMatches) != null ? _router$state$pending : [])].forEach(match => {
           match.cancel();
         });
       },
@@ -1777,53 +1764,43 @@
         router.startedLoadingAt = id;
         if (next) {
           // Ingest the new location
-          router.__location = next;
+          router.state.latestLocation = next;
         }
 
         // Cancel any pending matches
         router.cancelMatches();
 
         // Match the routes
-        const matches = router.matchRoutes(router.__location.pathname, {
+        const matches = router.matchRoutes(router.state.latestLocation.pathname, {
           strictParseParams: true
         });
         if (typeof document !== 'undefined') {
           router.state = _extends({}, router.state, {
-            pending: {
-              matches: matches,
-              location: router.__location
-            },
-            status: 'loading'
+            status: 'loading',
+            pendingMatches: matches,
+            pendingLocation: router.state.latestLocation
           });
         } else {
           router.state = _extends({}, router.state, {
-            matches: matches,
-            location: router.__location,
-            status: 'loading'
+            status: 'loading',
+            currentMatches: matches,
+            currentLocation: router.state.latestLocation
           });
         }
+        router.notify();
 
-        // Check if each match middleware to see if the route can be accessed
+        // Load the matches
         try {
-          await Promise.all(matches.map(match => match.options.beforeLoad == null ? void 0 : match.options.beforeLoad({
-            router: router,
-            match
-          })));
+          await router.loadMatches(matches);
         } catch (err) {
-          if (err != null && err.then) {
-            await new Promise(() => {});
-          }
-          throw err;
+          console.log(err);
+          invariant(false, 'Matches failed to load due to error above ☝️. Navigation cancelled!');
         }
-        router.notify();
-
-        // Load the matches
-        await router.loadMatches(matches);
         if (router.startedLoadingAt !== id) {
           // Ignore side-effects of match loading
           return router.navigationPromise;
         }
-        const previousMatches = router.state.matches;
+        const previousMatches = router.state.currentMatches;
         const exiting = [],
           staying = [];
         previousMatches.forEach(d => {
@@ -1882,10 +1859,11 @@
           }
         });
         router.state = _extends({}, router.state, {
-          location: router.__location,
-          matches,
-          pending: undefined,
-          status: 'idle'
+          status: 'idle',
+          currentLocation: router.state.latestLocation,
+          currentMatches: matches,
+          pendingLocation: undefined,
+          pendingMatches: undefined
         });
         router.notify();
         router.resolveNavigation();
@@ -1911,7 +1889,7 @@
       },
       loadRoute: async function loadRoute(navigateOpts) {
         if (navigateOpts === void 0) {
-          navigateOpts = router.__location;
+          navigateOpts = router.state.latestLocation;
         }
         const next = router.buildNext(navigateOpts);
         const matches = router.matchRoutes(next.pathname, {
@@ -1923,7 +1901,7 @@
       preloadRoute: async function preloadRoute(navigateOpts, loaderOpts) {
         var _ref3, _ref4, _loaderOpts$maxAge, _ref5, _ref6, _loaderOpts$gcMaxAge;
         if (navigateOpts === void 0) {
-          navigateOpts = router.__location;
+          navigateOpts = router.state.latestLocation;
         }
         const next = router.buildNext(navigateOpts);
         const matches = router.matchRoutes(next.pathname, {
@@ -1937,13 +1915,13 @@
         return matches;
       },
       matchRoutes: (pathname, opts) => {
-        var _router$state$pending3, _router$state$pending4;
+        var _router$state$pending2;
         router.cleanMatchCache();
         const matches = [];
         if (!router.routeTree) {
           return matches;
         }
-        const existingMatches = [...router.state.matches, ...((_router$state$pending3 = (_router$state$pending4 = router.state.pending) == null ? void 0 : _router$state$pending4.matches) != null ? _router$state$pending3 : [])];
+        const existingMatches = [...router.state.currentMatches, ...((_router$state$pending2 = router.state.pendingMatches) != null ? _router$state$pending2 : [])];
         const recurse = async routes => {
           var _parentMatch$params, _router$options$filte, _foundRoute$childRout;
           const parentMatch = last(matches);
@@ -1962,6 +1940,15 @@
                 fuzzy,
                 caseSensitive: (_route$options$caseSe = route.options.caseSensitive) != null ? _route$options$caseSe : router.options.caseSensitive
               });
+
+              // console.log(
+              //   router.basepath,
+              //   route.fullPath,
+              //   fuzzy,
+              //   pathname,
+              //   matchParams,
+              // )
+
               if (matchParams) {
                 let parsedParams;
                 try {
@@ -2007,10 +1994,27 @@
         return matches;
       },
       loadMatches: async (resolvedMatches, loaderOpts) => {
-        const matchPromises = resolvedMatches.map(async match => {
-          var _search$__data;
+        resolvedMatches.forEach(async match => {
           // Validate the match (loads search params etc)
           match.__.validate();
+        });
+
+        // Check each match middleware to see if the route can be accessed
+        await Promise.all(resolvedMatches.map(async match => {
+          try {
+            await (match.options.beforeLoad == null ? void 0 : match.options.beforeLoad({
+              router: router,
+              match
+            }));
+          } catch (err) {
+            if (!(loaderOpts != null && loaderOpts.preload)) {
+              match.options.onLoadError == null ? void 0 : match.options.onLoadError(err);
+            }
+            throw err;
+          }
+        }));
+        const matchPromises = resolvedMatches.map(async match => {
+          var _search$__data;
           const search = match.search;
           if ((_search$__data = search.__data) != null && _search$__data.matchId && search.__data.matchId !== match.matchId) {
             return;
@@ -2065,10 +2069,10 @@
         }
       },
       invalidateRoute: opts => {
-        var _router$state$pending5, _router$state$pending6;
+        var _router$state$pending3;
         const next = router.buildNext(opts);
         const unloadedMatchIds = router.matchRoutes(next.pathname).map(d => d.matchId);
-        [...router.state.matches, ...((_router$state$pending5 = (_router$state$pending6 = router.state.pending) == null ? void 0 : _router$state$pending6.matches) != null ? _router$state$pending5 : [])].forEach(match => {
+        [...router.state.currentMatches, ...((_router$state$pending3 = router.state.pendingMatches) != null ? _router$state$pending3 : [])].forEach(match => {
           if (unloadedMatchIds.includes(match.matchId)) {
             match.invalidate();
           }
@@ -2091,15 +2095,14 @@
         });
         const next = router.buildNext(location);
         if (opts != null && opts.pending) {
-          var _router$state$pending7;
-          if (!((_router$state$pending7 = router.state.pending) != null && _router$state$pending7.location)) {
+          if (!router.state.pendingLocation) {
             return false;
           }
-          return !!matchPathname(router.basepath, router.state.pending.location.pathname, _extends({}, opts, {
+          return !!matchPathname(router.basepath, router.state.pendingLocation.pathname, _extends({}, opts, {
             to: next.pathname
           }));
         }
-        return !!matchPathname(router.basepath, router.state.location.pathname, _extends({}, opts, {
+        return !!matchPathname(router.basepath, router.state.currentLocation.pathname, _extends({}, opts, {
           to: next.pathname
         }));
       },
@@ -2177,11 +2180,11 @@
         const preloadDelay = (_ref9 = userPreloadDelay != null ? userPreloadDelay : router.options.defaultPreloadDelay) != null ? _ref9 : 0;
 
         // Compare path/hash for matches
-        const pathIsEqual = router.state.location.pathname === next.pathname;
-        const currentPathSplit = router.state.location.pathname.split('/');
+        const pathIsEqual = router.state.currentLocation.pathname === next.pathname;
+        const currentPathSplit = router.state.currentLocation.pathname.split('/');
         const nextPathSplit = next.pathname.split('/');
         const pathIsFuzzyEqual = nextPathSplit.every((d, i) => d === currentPathSplit[i]);
-        const hashIsEqual = router.state.location.hash === next.hash;
+        const hashIsEqual = router.state.currentLocation.hash === next.hash;
         // Combine the matches based on user options
         const pathTest = activeOptions != null && activeOptions.exact ? pathIsEqual : pathIsFuzzyEqual;
         const hashTest = activeOptions != null && activeOptions.includeHash ? hashIsEqual : true;
@@ -2208,6 +2211,9 @@
             router.preloadRoute(nextOpts, {
               maxAge: userPreloadMaxAge,
               gcMaxAge: userPreloadGcMaxAge
+            }).catch(err => {
+              console.log(err);
+              console.warn('Error preloading route! ☝️');
             });
           }
         };
@@ -2222,6 +2228,9 @@
               router.preloadRoute(nextOpts, {
                 maxAge: userPreloadMaxAge,
                 gcMaxAge: userPreloadGcMaxAge
+              }).catch(err => {
+                console.log(err);
+                console.warn('Error preloading route! ☝️');
               });
             }, preloadDelay);
           }
@@ -2304,9 +2313,9 @@
           if (dest === void 0) {
             dest = {};
           }
-          const fromPathname = dest.fromCurrent ? router.__location.pathname : (_dest$from = dest.from) != null ? _dest$from : router.__location.pathname;
+          const fromPathname = dest.fromCurrent ? router.state.latestLocation.pathname : (_dest$from = dest.from) != null ? _dest$from : router.state.latestLocation.pathname;
           let pathname = resolvePath((_router$basepath = router.basepath) != null ? _router$basepath : '/', fromPathname, "" + ((_dest$to = dest.to) != null ? _dest$to : '.'));
-          const fromMatches = router.matchRoutes(router.__location.pathname, {
+          const fromMatches = router.matchRoutes(router.state.latestLocation.pathname, {
             strictParseParams: true
           });
           const toMatches = router.matchRoutes(pathname);
@@ -2320,7 +2329,7 @@
           pathname = interpolatePath(pathname, nextParams != null ? nextParams : {});
 
           // Pre filters first
-          const preFilteredSearch = (_dest$__preSearchFilt = dest.__preSearchFilters) != null && _dest$__preSearchFilt.length ? dest.__preSearchFilters.reduce((prev, next) => next(prev), router.__location.search) : router.__location.search;
+          const preFilteredSearch = (_dest$__preSearchFilt = dest.__preSearchFilters) != null && _dest$__preSearchFilt.length ? dest.__preSearchFilters.reduce((prev, next) => next(prev), router.state.latestLocation.search) : router.state.latestLocation.search;
 
           // Then the link/navigate function
           const destSearch = dest.search === true ? preFilteredSearch // Preserve resolvedFrom true
@@ -2330,15 +2339,15 @@
 
           // Then post filters
           const postFilteredSearch = (_dest$__postSearchFil = dest.__postSearchFilters) != null && _dest$__postSearchFil.length ? dest.__postSearchFilters.reduce((prev, next) => next(prev), destSearch) : destSearch;
-          const search = replaceEqualDeep(router.__location.search, postFilteredSearch);
+          const search = replaceEqualDeep(router.state.latestLocation.search, postFilteredSearch);
           const searchStr = router.options.stringifySearch(search);
-          let hash = dest.hash === true ? router.__location.hash : functionalUpdate(dest.hash, router.__location.hash);
+          let hash = dest.hash === true ? router.state.latestLocation.hash : functionalUpdate(dest.hash, router.state.latestLocation.hash);
           hash = hash ? "#" + hash : '';
           return {
             pathname,
             search,
             searchStr,
-            state: router.__location.state,
+            state: router.state.latestLocation.state,
             hash,
             href: "" + pathname + searchStr + hash,
             key: dest.key
@@ -2567,7 +2576,7 @@
             useRouterSubscription(router);
             invariant(routeId !== rootRouteId, "\"" + rootRouteId + "\" cannot be used with useMatch! Did you mean to useRoute(\"" + rootRouteId + "\")?");
             const nearestMatch = useNearestMatch();
-            const match = router.state.matches.find(d => d.routeId === routeId);
+            const match = router.state.currentMatches.find(d => d.routeId === routeId);
             if ((_opts$strict = opts == null ? void 0 : opts.strict) != null ? _opts$strict : true) {
               invariant(match, "Could not find an active match for \"" + routeId + "\"!");
               invariant(nearestMatch.routeId == (match == null ? void 0 : match.routeId), "useMatch(\"" + (match == null ? void 0 : match.routeId) + "\") is being called in a component that is meant to render the '" + nearestMatch.routeId + "' route. Did you mean to 'useMatch(\"" + (match == null ? void 0 : match.routeId) + "\", { strict: false })' or 'useRoute(\"" + (match == null ? void 0 : match.routeId) + "\")' instead?");
@@ -2612,7 +2621,7 @@
         router: router
       }
     }, /*#__PURE__*/React__namespace.createElement(MatchesProvider, {
-      value: [undefined, ...router.state.matches]
+      value: [undefined, ...router.state.currentMatches]
     }, /*#__PURE__*/React__namespace.createElement(Outlet, null))));
   }
   function useRouter() {
@@ -2638,7 +2647,7 @@
     return router.useRoute(routeId);
   }
   function useSearch(_routeId) {
-    return useRouter().state.location.search;
+    return useRouter().state.currentLocation.search;
   }
   function linkProps(props) {
     const router = useRouter();
@@ -2712,10 +2721,10 @@
     const errorComponent = (_props$errorComponent = props.errorComponent) != null ? _props$errorComponent : DefaultErrorBoundary;
     React__namespace.useEffect(() => {
       if (activeErrorState) {
-        let prevKey = router.state.location.key;
+        let prevKey = router.state.currentLocation.key;
         return router.subscribe(() => {
-          if (router.state.location.key !== prevKey) {
-            prevKey = router.state.location.key;
+          if (router.state.currentLocation.key !== prevKey) {
+            prevKey = router.state.currentLocation.key;
             setActiveErrorState({});
           }
         });
@@ -2769,11 +2778,11 @@
           unblock();
           transition.retry();
         } else {
-          router.state.location.pathname = window.location.pathname;
+          router.state.currentLocation.pathname = window.location.pathname;
         }
       });
       return unblock;
-    }, [when, location, message]);
+    }, [when, message]);
   }
   function Prompt(_ref7) {
     let {