@tanstack/react-router 0.0.1-alpha.6 → 0.0.1-alpha.7

package/build/esm/index.js

@@ -70,23 +70,6 @@ function _extends$1() {
   return _extends$1.apply(this, arguments);
 }
 
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-
 /**
  * Actions represent the type of change to a location value.
  *
@@ -230,7 +213,7 @@ function createBrowserHistory(options) {
 
   if (index == null) {
     index = 0;
-    globalHistory.replaceState(_extends({}, globalHistory.state, {
+    globalHistory.replaceState(_extends$1({}, globalHistory.state, {
       idx: index
     }), '');
   }
@@ -245,7 +228,7 @@ function createBrowserHistory(options) {
       state = null;
     }
 
-    return readOnly(_extends({
+    return readOnly(_extends$1({
       pathname: location.pathname,
       hash: '',
       search: ''
@@ -479,7 +462,7 @@ function createHashHistory(options) {
 
   if (index == null) {
     index = 0;
-    globalHistory.replaceState(_extends({}, globalHistory.state, {
+    globalHistory.replaceState(_extends$1({}, globalHistory.state, {
       idx: index
     }), '');
   }
@@ -506,7 +489,7 @@ function createHashHistory(options) {
       state = null;
     }
 
-    return readOnly(_extends({
+    return readOnly(_extends$1({
       pathname: location.pathname,
       hash: '',
       search: ''
@@ -658,7 +641,7 @@ function createMemoryHistory(options) {
       initialEntries = _options3$initialEntr === void 0 ? ['/'] : _options3$initialEntr,
       initialIndex = _options3.initialIndex;
   var entries = initialEntries.map(function (entry) {
-    var location = readOnly(_extends({
+    var location = readOnly(_extends$1({
       pathname: '/',
       search: '',
       hash: '',
@@ -683,7 +666,7 @@ function createMemoryHistory(options) {
       state = null;
     }
 
-    return readOnly(_extends({
+    return readOnly(_extends$1({
       pathname: location.pathname,
       search: '',
       hash: ''
@@ -894,1499 +877,1577 @@ function invariant(condition, message) {
     throw new Error(value);
 }
 
-// @ts-nocheck
-// We're inlining qss here for compression's sake, but we've included it as a hard dependency for the MIT license it requires.
-function encode(obj, pfx) {
-  var k,
-      i,
-      tmp,
-      str = '';
+// type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
+//   k: infer I,
+// ) => any
+//   ? I
+//   : never
 
-  for (k in obj) {
-    if ((tmp = obj[k]) !== void 0) {
-      if (Array.isArray(tmp)) {
-        for (i = 0; i < tmp.length; i++) {
-          str && (str += '&');
-          str += encodeURIComponent(k) + '=' + encodeURIComponent(tmp[i]);
-        }
-      } else {
-        str && (str += '&');
-        str += encodeURIComponent(k) + '=' + encodeURIComponent(tmp);
+/**
+ * This function returns `a` if `b` is deeply equal.
+ * If not, it will replace any deeply equal children of `b` with those of `a`.
+ * This can be used for structural sharing between JSON values for example.
+ */
+function replaceEqualDeep(prev, next) {
+  if (prev === next) {
+    return prev;
+  }
+
+  const array = Array.isArray(prev) && Array.isArray(next);
+
+  if (array || isPlainObject(prev) && isPlainObject(next)) {
+    const aSize = array ? prev.length : Object.keys(prev).length;
+    const bItems = array ? next : Object.keys(next);
+    const bSize = bItems.length;
+    const copy = array ? [] : {};
+    let equalItems = 0;
+
+    for (let i = 0; i < bSize; i++) {
+      const key = array ? i : bItems[i];
+      copy[key] = replaceEqualDeep(prev[key], next[key]);
+
+      if (copy[key] === prev[key]) {
+        equalItems++;
       }
     }
+
+    return aSize === bSize && equalItems === aSize ? prev : copy;
   }
 
-  return (pfx || '') + str;
-}
+  return next;
+} // Copied from: https://github.com/jonschlinkert/is-plain-object
 
-function toValue(mix) {
-  if (!mix) return '';
-  var str = decodeURIComponent(mix);
-  if (str === 'false') return false;
-  if (str === 'true') return true;
-  return +str * 0 === 0 ? +str : str;
-}
+function isPlainObject(o) {
+  if (!hasObjectPrototype(o)) {
+    return false;
+  } // If has modified constructor
 
-function decode(str) {
-  var tmp,
-      k,
-      out = {},
-      arr = str.split('&');
 
-  while (tmp = arr.shift()) {
-    tmp = tmp.split('=');
-    k = tmp.shift();
+  const ctor = o.constructor;
 
-    if (out[k] !== void 0) {
-      out[k] = [].concat(out[k], toValue(tmp.shift()));
-    } else {
-      out[k] = toValue(tmp.shift());
-    }
-  }
+  if (typeof ctor === 'undefined') {
+    return true;
+  } // If has modified prototype
 
-  return out;
+
+  const prot = ctor.prototype;
+
+  if (!hasObjectPrototype(prot)) {
+    return false;
+  } // If constructor does not have an Object-specific method
+
+
+  if (!prot.hasOwnProperty('isPrototypeOf')) {
+    return false;
+  } // Most likely a plain Object
+
+
+  return true;
 }
 
-const createRouteConfig = function createRouteConfig(options, children, isRoot, parentId, parentPath) {
-  if (options === void 0) {
-    options = {};
-  }
+function hasObjectPrototype(o) {
+  return Object.prototype.toString.call(o) === '[object Object]';
+}
 
-  if (isRoot === void 0) {
-    isRoot = true;
+function last(arr) {
+  return arr[arr.length - 1];
+}
+function warning(cond, message) {
+  if (cond) {
+    if (typeof console !== 'undefined') console.warn(message);
+
+    try {
+      throw new Error(message);
+    } catch (_unused) {}
   }
 
-  if (isRoot) {
-    options.path = rootRouteId;
-  } // Strip the root from parentIds
+  return true;
+}
 
+function isFunction(d) {
+  return typeof d === 'function';
+}
 
-  if (parentId === rootRouteId) {
-    parentId = '';
+function functionalUpdate(updater, previous) {
+  if (isFunction(updater)) {
+    return updater(previous);
   }
 
-  let path = isRoot ? rootRouteId : options.path; // If the path is anything other than an index path, trim it up
+  return updater;
+}
 
-  if (path && path !== '/') {
-    path = trimPath(path);
-  }
+function joinPaths(paths) {
+  return cleanPath(paths.filter(Boolean).join('/'));
+}
+function cleanPath(path) {
+  // remove double slashes
+  return path.replace(/\/{2,}/g, '/');
+}
+function trimPathLeft(path) {
+  return path === '/' ? path : path.replace(/^\/{1,}/, '');
+}
+function trimPathRight(path) {
+  return path === '/' ? path : path.replace(/\/{1,}$/, '');
+}
+function trimPath(path) {
+  return trimPathRight(trimPathLeft(path));
+}
+function resolvePath(basepath, base, to) {
+  base = base.replace(new RegExp("^" + basepath), '/');
+  to = to.replace(new RegExp("^" + basepath), '/');
+  let baseSegments = parsePathname(base);
+  const toSegments = parsePathname(to);
+  toSegments.forEach((toSegment, index) => {
+    if (toSegment.value === '/') {
+      if (!index) {
+        // Leading slash
+        baseSegments = [toSegment];
+      } else if (index === toSegments.length - 1) {
+        // Trailing Slash
+        baseSegments.push(toSegment);
+      } else ;
+    } else if (toSegment.value === '..') {
+      var _last;
 
-  const routeId = path || options.id;
-  let id = joinPaths([parentId, routeId]);
+      // Extra trailing slash? pop it off
+      if (baseSegments.length > 1 && ((_last = last(baseSegments)) == null ? void 0 : _last.value) === '/') {
+        baseSegments.pop();
+      }
 
-  if (path === rootRouteId) {
-    path = '/';
+      baseSegments.pop();
+    } else if (toSegment.value === '.') {
+      return;
+    } else {
+      baseSegments.push(toSegment);
+    }
+  });
+  const joined = joinPaths([basepath, ...baseSegments.map(d => d.value)]);
+  return cleanPath(joined);
+}
+function parsePathname(pathname) {
+  if (!pathname) {
+    return [];
   }
 
-  if (id !== rootRouteId) {
-    id = joinPaths(['/', id]);
+  pathname = cleanPath(pathname);
+  const segments = [];
+
+  if (pathname.slice(0, 1) === '/') {
+    pathname = pathname.substring(1);
+    segments.push({
+      type: 'pathname',
+      value: '/'
+    });
   }
 
-  const fullPath = id === rootRouteId ? '/' : trimPathRight(joinPaths([parentPath, path]));
-  return {
-    id: id,
-    routeId: routeId,
-    path: path,
-    fullPath: fullPath,
-    options: options,
-    children,
-    addChildren: cb => createRouteConfig(options, cb(childOptions => createRouteConfig(childOptions, undefined, false, id, fullPath)), false, parentId, parentPath)
-  };
-};
-const rootRouteId = '__root__';
-// Source
-// Detect if we're in the DOM
-const isDOM$1 = Boolean(typeof window !== 'undefined' && window.document && window.document.createElement); // This is the default history object if none is defined
+  if (!pathname) {
+    return segments;
+  } // Remove empty segments and '.' segments
 
-const createDefaultHistory = () => isDOM$1 ? createBrowserHistory() : createMemoryHistory();
 
-function createRouter(userOptions) {
-  var _userOptions$stringif, _userOptions$parseSea;
+  const split = pathname.split('/').filter(Boolean);
+  segments.push(...split.map(part => {
+    if (part.startsWith('*')) {
+      return {
+        type: 'wildcard',
+        value: part
+      };
+    }
 
-  const history = (userOptions == null ? void 0 : userOptions.history) || createDefaultHistory();
+    if (part.charAt(0) === ':') {
+      return {
+        type: 'param',
+        value: part
+      };
+    }
 
-  const originalOptions = _extends$1({}, userOptions, {
-    stringifySearch: (_userOptions$stringif = userOptions == null ? void 0 : userOptions.stringifySearch) != null ? _userOptions$stringif : defaultStringifySearch,
-    parseSearch: (_userOptions$parseSea = userOptions == null ? void 0 : userOptions.parseSearch) != null ? _userOptions$parseSea : defaultParseSearch
-  });
+    return {
+      type: 'pathname',
+      value: part
+    };
+  }));
 
-  let router = {
-    options: originalOptions,
-    listeners: [],
-    removeActionQueue: [],
-    // Resolved after construction
-    basepath: '',
-    routeTree: undefined,
-    routesById: {},
-    location: undefined,
-    allRouteInfo: undefined,
-    //
-    navigationPromise: Promise.resolve(),
-    resolveNavigation: () => {},
-    preloadCache: {},
-    state: {
-      status: 'idle',
-      location: null,
-      matches: [],
-      actions: {},
-      loaderData: {},
-      lastUpdated: Date.now()
-    },
-    startedLoadingAt: Date.now(),
-    subscribe: listener => {
-      router.listeners.push(listener);
-      return () => {
-        router.listeners = router.listeners.filter(x => x !== listener);
-      };
-    },
-    getRoute: id => {
-      return router.routesById[id];
-    },
-    notify: () => {
-      router.state = _extends$1({}, router.state);
-      router.listeners.forEach(listener => listener());
-    },
-    mount: () => {
-      const next = 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) {
-        return router.commitLocation(next, true);
-      } else {
-        return router.loadLocation();
-      }
-    },
-    update: opts => {
-      Object.assign(router.options, opts);
-      const {
-        basepath,
-        routeConfig
-      } = router.options;
-      router.basepath = cleanPath("/" + (basepath != null ? basepath : ''));
-
-      if (routeConfig) {
-        router.routesById = {};
-        router.routeTree = router.buildRouteTree(routeConfig);
-      }
-
-      return router;
-    },
-    destroy: history.listen(event => {
-      router.loadLocation(router.parseLocation(event.location, router.location));
-    }),
-    buildRouteTree: rootRouteConfig => {
-      const recurseRoutes = (routeConfigs, parent) => {
-        return routeConfigs.map(routeConfig => {
-          const routeOptions = routeConfig.options;
-          const route = createRoute(routeConfig, routeOptions, parent, router); // {
-          //   pendingMs: routeOptions.pendingMs ?? router.defaultPendingMs,
-          //   pendingMinMs: routeOptions.pendingMinMs ?? router.defaultPendingMinMs,
-          // }
-
-          const existingRoute = router.routesById[route.routeId];
-
-          if (existingRoute) {
-            if (process.env.NODE_ENV !== 'production') {
-              console.warn("Duplicate routes found with id: " + String(route.routeId), router.routesById, route);
-            }
-
-            throw new Error();
-          }
-          router.routesById[route.routeId] = route;
-          const children = routeConfig.children;
-          route.childRoutes = children != null && children.length ? recurseRoutes(children, route) : undefined;
-          return route;
-        });
-      };
-
-      const routes = recurseRoutes([rootRouteConfig]);
-      return routes[0];
-    },
-    parseLocation: (location, previousLocation) => {
-      var _location$hash$split$;
-
-      const parsedSearch = router.options.parseSearch(location.search);
-      return {
-        pathname: location.pathname,
-        searchStr: location.search,
-        search: replaceEqualDeep(previousLocation == null ? void 0 : previousLocation.search, parsedSearch),
-        hash: (_location$hash$split$ = location.hash.split('#').reverse()[0]) != null ? _location$hash$split$ : '',
-        href: "" + location.pathname + location.search + location.hash,
-        state: location.state,
-        key: location.key
-      };
-    },
-    buildLocation: function buildLocation(dest) {
-      var _dest$from, _router$basepath, _dest$to, _last, _dest$params, _dest$__preSearchFilt, _functionalUpdate, _dest$__preSearchFilt2, _dest$__postSearchFil;
-
-      if (dest === void 0) {
-        dest = {};
-      }
-
-      // const resolvedFrom: Location = {
-      //   ...router.location,
-      const fromPathname = dest.fromCurrent ? router.location.pathname : (_dest$from = dest.from) != null ? _dest$from : router.location.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, {
-        strictParseParams: true
-      });
-      const toMatches = router.matchRoutes(pathname);
-
-      const prevParams = _extends$1({}, (_last = last(fromMatches)) == null ? void 0 : _last.params);
-
-      let nextParams = ((_dest$params = dest.params) != null ? _dest$params : true) === true ? prevParams : functionalUpdate(dest.params, prevParams);
-
-      if (nextParams) {
-        toMatches.map(d => d.options.stringifyParams).filter(Boolean).forEach(fn => {
-          Object.assign({}, nextParams, fn(nextParams));
-        });
-      }
-
-      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; // Then the link/navigate function
-
-      const destSearch = dest.search === true ? preFilteredSearch // Preserve resolvedFrom true
-      : dest.search ? (_functionalUpdate = functionalUpdate(dest.search, preFilteredSearch)) != null ? _functionalUpdate : {} // Updater
-      : (_dest$__preSearchFilt2 = dest.__preSearchFilters) != null && _dest$__preSearchFilt2.length ? preFilteredSearch // Preserve resolvedFrom filters
-      : {}; // 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 searchStr = router.options.stringifySearch(search);
-      let hash = dest.hash === true ? router.location.hash : functionalUpdate(dest.hash, router.location.hash);
-      hash = hash ? "#" + hash : '';
-      return {
-        pathname,
-        search,
-        searchStr,
-        state: router.location.state,
-        hash,
-        href: "" + pathname + searchStr + hash,
-        key: dest.key
-      };
-    },
-    commitLocation: (next, replace) => {
-      const id = '' + Date.now() + Math.random();
-      if (router.navigateTimeout) clearTimeout(router.navigateTimeout);
-      let nextAction = 'replace';
-
-      if (!replace) {
-        nextAction = 'push';
-      }
-
-      const isSameUrl = router.parseLocation(history.location).href === next.href;
+  if (pathname.slice(-1) === '/') {
+    pathname = pathname.substring(1);
+    segments.push({
+      type: 'pathname',
+      value: '/'
+    });
+  }
 
-      if (isSameUrl && !next.key) {
-        nextAction = 'replace';
-      }
+  return segments;
+}
+function interpolatePath(path, params, leaveWildcard) {
+  const interpolatedPathSegments = parsePathname(path);
+  return joinPaths(interpolatedPathSegments.map(segment => {
+    if (segment.value === '*' && !leaveWildcard) {
+      return '';
+    }
 
-      if (nextAction === 'replace') {
-        history.replace({
-          pathname: next.pathname,
-          hash: next.hash,
-          search: next.searchStr
-        }, {
-          id
-        });
-      } else {
-        history.push({
-          pathname: next.pathname,
-          hash: next.hash,
-          search: next.searchStr
-        }, {
-          id
-        });
-      }
+    if (segment.type === 'param') {
+      var _segment$value$substr;
 
-      router.navigationPromise = new Promise(resolve => {
-        const previousNavigationResolve = router.resolveNavigation;
+      return (_segment$value$substr = params[segment.value.substring(1)]) != null ? _segment$value$substr : '';
+    }
 
-        router.resolveNavigation = () => {
-          previousNavigationResolve();
-          resolve();
-        };
-      });
-      return router.navigationPromise;
-    },
-    buildNext: opts => {
-      const next = router.buildLocation(opts);
-      const matches = router.matchRoutes(next.pathname);
+    return segment.value;
+  }));
+}
+function matchPathname(currentPathname, matchLocation) {
+  const pathParams = matchByPath(currentPathname, matchLocation); // const searchMatched = matchBySearch(currentLocation.search, matchLocation)
 
-      const __preSearchFilters = matches.map(match => {
-        var _match$options$preSea;
+  if (matchLocation.to && !pathParams) {
+    return;
+  } // if (matchLocation.search && !searchMatched) {
+  //   return
+  // }
 
-        return (_match$options$preSea = match.options.preSearchFilters) != null ? _match$options$preSea : [];
-      }).flat().filter(Boolean);
 
-      const __postSearchFilters = matches.map(match => {
-        var _match$options$postSe;
+  return pathParams != null ? pathParams : {};
+}
+function matchByPath(from, matchLocation) {
+  var _matchLocation$to;
 
-        return (_match$options$postSe = match.options.postSearchFilters) != null ? _match$options$postSe : [];
-      }).flat().filter(Boolean);
+  const baseSegments = parsePathname(from);
+  const routeSegments = parsePathname("" + ((_matchLocation$to = matchLocation.to) != null ? _matchLocation$to : '*'));
+  const params = {};
 
-      return router.buildLocation(_extends$1({}, opts, {
-        __preSearchFilters,
-        __postSearchFilters
-      }));
-    },
-    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 => {
-        match.cancel();
-      });
-    },
-    loadLocation: async next => {
-      const id = Math.random();
-      router.startedLoadingAt = id;
+  let isMatch = (() => {
+    for (let i = 0; i < Math.max(baseSegments.length, routeSegments.length); i++) {
+      const baseSegment = baseSegments[i];
+      const routeSegment = routeSegments[i];
+      const isLastRouteSegment = i === routeSegments.length - 1;
+      const isLastBaseSegment = i === baseSegments.length - 1;
 
-      if (next) {
-        // Ingest the new location
-        router.location = next;
-      } // Clear out old actions
+      if (routeSegment) {
+        if (routeSegment.type === 'wildcard') {
+          if (baseSegment != null && baseSegment.value) {
+            params['*'] = joinPaths(baseSegments.slice(i).map(d => d.value));
+            return true;
+          }
 
+          return false;
+        }
 
-      router.removeActionQueue.forEach(_ref => {
-        let {
-          action,
-          actionState
-        } = _ref;
+        if (routeSegment.type === 'pathname') {
+          if (routeSegment.value === '/' && !(baseSegment != null && baseSegment.value)) {
+            return true;
+          }
 
-        if (router.state.currentAction === actionState) {
-          router.state.currentAction = undefined;
+          if (baseSegment) {
+            if (matchLocation.caseSensitive) {
+              if (routeSegment.value !== baseSegment.value) {
+                return false;
+              }
+            } else if (routeSegment.value.toLowerCase() !== baseSegment.value.toLowerCase()) {
+              return false;
+            }
+          }
         }
 
-        if (action.current === actionState) {
-          action.current = undefined;
+        if (!baseSegment) {
+          return false;
         }
-      });
-      router.removeActionQueue = []; // Cancel any pending matches
 
-      router.cancelMatches(); // Match the routes
+        if (routeSegment.type === 'param') {
+          if ((baseSegment == null ? void 0 : baseSegment.value) === '/') {
+            return false;
+          }
 
-      const unloadedMatches = router.matchRoutes(location.pathname, {
-        strictParseParams: true
-      });
-      router.state = _extends$1({}, router.state, {
-        pending: {
-          matches: unloadedMatches,
-          location: router.location
+          if (!baseSegment.value.startsWith(':')) {
+            params[routeSegment.value.substring(1)] = baseSegment.value;
+          }
         }
-      });
-      router.notify(); // Load the matches
-
-      const matches = await router.loadMatches(unloadedMatches, {
-        withPending: true
-      });
+      }
 
-      if (router.startedLoadingAt !== id) {
-        // Ignore side-effects of match loading
-        return router.navigationPromise;
+      if (isLastRouteSegment && !isLastBaseSegment) {
+        return !!matchLocation.fuzzy;
       }
+    }
 
-      const previousMatches = router.state.matches;
-      previousMatches.filter(d => {
-        return !matches.find(dd => dd.matchId === d.matchId);
-      }).forEach(d => {
-        d.__.onExit == null ? void 0 : d.__.onExit({
-          params: d.params,
-          search: d.routeSearch
-        });
-      });
-      previousMatches.filter(d => {
-        return matches.find(dd => dd.matchId === d.matchId);
-      }).forEach(d => {
-        d.options.onTransition == null ? void 0 : d.options.onTransition({
-          params: d.params,
-          search: d.routeSearch
-        });
-      });
-      matches.filter(d => {
-        return !previousMatches.find(dd => dd.matchId === d.matchId);
-      }).forEach(d => {
-        d.__.onExit = d.options.onMatch == null ? void 0 : d.options.onMatch({
-          params: d.params,
-          search: d.search
-        });
-      });
-      router.state = _extends$1({}, router.state, {
-        location: router.location,
-        matches,
-        pending: undefined
-      });
+    return true;
+  })();
 
-      if (matches.some(d => d.status === 'loading')) {
-        router.notify();
-        await Promise.all(matches.map(d => d.__.loaderPromise || Promise.resolve()));
-      }
+  return isMatch ? params : undefined;
+}
 
-      if (router.startedLoadingAt !== id) {
-        // Ignore side-effects of match loading
-        return;
-      }
+// @ts-nocheck
+// qss has been slightly modified and inlined here for our use cases (and compression's sake). We've included it as a hard dependency for MIT license attribution.
+function encode(obj, pfx) {
+  var k,
+      i,
+      tmp,
+      str = '';
 
-      router.notify();
-      router.resolveNavigation();
-    },
-    cleanPreloadCache: () => {
-      const now = Date.now();
-      Object.keys(router.preloadCache).forEach(matchId => {
-        const entry = router.preloadCache[matchId]; // Don't remove loading matches
+  for (k in obj) {
+    if ((tmp = obj[k]) !== void 0) {
+      if (Array.isArray(tmp)) {
+        for (i = 0; i < tmp.length; i++) {
+          str && (str += '&');
+          str += encodeURIComponent(k) + '=' + encodeURIComponent(tmp[i]);
+        }
+      } else {
+        str && (str += '&');
+        str += encodeURIComponent(k) + '=' + encodeURIComponent(tmp);
+      }
+    }
+  }
 
-        if (entry.match.status === 'loading') {
-          return;
-        } // Do not remove successful matches that are still valid
+  return (pfx || '') + str;
+}
 
+function toValue(mix) {
+  if (!mix) return '';
+  var str = decodeURIComponent(mix);
+  if (str === 'false') return false;
+  if (str === 'true') return true;
+  return +str * 0 === 0 ? +str : str;
+}
 
-        if (entry.match.updatedAt && entry.match.updatedAt + entry.maxAge > now) {
-          return;
-        } // Everything else gets removed
+function decode(str) {
+  var tmp,
+      k,
+      out = {},
+      arr = str.split('&');
 
+  while (tmp = arr.shift()) {
+    tmp = tmp.split('=');
+    k = tmp.shift();
 
-        delete router.preloadCache[matchId];
-      });
-    },
-    loadRoute: async function loadRoute(navigateOpts, loaderOpts) {
-      if (navigateOpts === void 0) {
-        navigateOpts = router.location;
-      }
+    if (out[k] !== void 0) {
+      out[k] = [].concat(out[k], toValue(tmp.shift()));
+    } else {
+      out[k] = toValue(tmp.shift());
+    }
+  }
 
-      const next = router.buildNext(navigateOpts);
-      const matches = router.matchRoutes(next.pathname, {
-        strictParseParams: true
-      });
-      await router.loadMatches(matches, {
-        preload: true,
-        maxAge: loaderOpts.maxAge
-      });
-      return matches;
-    },
-    matchRoutes: (pathname, opts) => {
-      var _router$state$pending3, _router$state$pending4;
+  return out;
+}
 
-      router.cleanPreloadCache();
-      const matches = [];
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
 
-      if (!router.routeTree) {
-        return matches;
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
       }
+    }
 
-      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 : [])];
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
 
-      const recurse = async routes => {
-        var _parentMatch$params, _router$options$filte, _foundRoute$childRout;
+function createRoute(routeConfig, options, parent, router) {
+  const {
+    id,
+    routeId,
+    path: routePath,
+    fullPath
+  } = routeConfig;
 
-        const parentMatch = last(matches);
-        let params = (_parentMatch$params = parentMatch == null ? void 0 : parentMatch.params) != null ? _parentMatch$params : {};
-        const filteredRoutes = (_router$options$filte = router.options.filterRoutes == null ? void 0 : router.options.filterRoutes(routes)) != null ? _router$options$filte : routes;
-        let foundRoutes = [];
+  const action = router.state.actions[id] || (() => {
+    router.state.actions[id] = {
+      pending: [],
+      submit: async (submission, actionOpts) => {
+        var _actionOpts$invalidat;
 
-        const findMatchInRoutes = (parentRoutes, routes) => {
-          routes.some(route => {
-            var _route$childRoutes, _route$childRoutes2, _route$options$caseSe;
+        if (!route) {
+          return;
+        }
 
-            if (!route.routePath && (_route$childRoutes = route.childRoutes) != null && _route$childRoutes.length) {
-              return findMatchInRoutes([...foundRoutes, route], route.childRoutes);
-            }
+        const invalidate = (_actionOpts$invalidat = actionOpts == null ? void 0 : actionOpts.invalidate) != null ? _actionOpts$invalidat : true;
+        const actionState = {
+          submittedAt: Date.now(),
+          status: 'pending',
+          submission
+        };
+        action.current = actionState;
+        action.latest = actionState;
+        action.pending.push(actionState);
+        router.state = _extends({}, router.state, {
+          currentAction: actionState,
+          latestAction: actionState
+        });
+        router.notify();
 
-            const fuzzy = !!(route.routePath !== '/' || (_route$childRoutes2 = route.childRoutes) != null && _route$childRoutes2.length);
-            const matchParams = matchPathname(pathname, {
-              to: route.fullPath,
-              fuzzy,
-              caseSensitive: (_route$options$caseSe = route.options.caseSensitive) != null ? _route$options$caseSe : router.options.caseSensitive
-            });
+        try {
+          const res = await (route.options.action == null ? void 0 : route.options.action(submission));
+          actionState.data = res;
 
-            if (matchParams) {
-              let parsedParams;
+          if (invalidate) {
+            router.invalidateRoute({
+              to: '.',
+              fromCurrent: true
+            });
+            await router.reload();
+          }
 
-              try {
-                var _route$options$parseP;
+          actionState.status = 'success';
+          return res;
+        } catch (err) {
+          console.error(err);
+          actionState.error = err;
+          actionState.status = 'error';
+        } finally {
+          action.pending = action.pending.filter(d => d !== actionState);
+          router.removeActionQueue.push({
+            action,
+            actionState
+          });
+          router.notify();
+        }
+      }
+    };
+    return router.state.actions[id];
+  })();
 
-                parsedParams = (_route$options$parseP = route.options.parseParams == null ? void 0 : route.options.parseParams(matchParams)) != null ? _route$options$parseP : matchParams;
-              } catch (err) {
-                if (opts != null && opts.strictParseParams) {
-                  throw err;
-                }
-              }
+  let route = {
+    routeId: id,
+    routeRouteId: routeId,
+    routePath,
+    fullPath,
+    options,
+    router,
+    childRoutes: undefined,
+    parentRoute: parent,
+    action,
+    buildLink: options => {
+      return router.buildLink(_extends({}, options, {
+        from: fullPath
+      }));
+    },
+    navigate: options => {
+      return router.navigate(_extends({}, options, {
+        from: fullPath
+      }));
+    },
+    matchRoute: (matchLocation, opts) => {
+      return router.matchRoute(_extends({}, matchLocation, {
+        from: fullPath
+      }), opts);
+    }
+  };
+  router.options.createRoute == null ? void 0 : router.options.createRoute({
+    router,
+    route
+  });
+  return route;
+}
+function cascadeLoaderData(matches) {
+  matches.forEach((match, index) => {
+    const parent = matches[index - 1];
 
-              params = _extends$1({}, params, parsedParams);
-            }
+    if (parent) {
+      match.loaderData = replaceEqualDeep(match.loaderData, _extends({}, parent.loaderData, match.routeLoaderData));
+    }
+  });
+}
 
-            if (!!matchParams) {
-              foundRoutes = [...parentRoutes, route];
-            }
+const rootRouteId = '__root__';
+const createRouteConfig = function createRouteConfig(options, children, isRoot, parentId, parentPath) {
+  if (options === void 0) {
+    options = {};
+  }
 
-            return !!foundRoutes.length;
-          });
-          return !!foundRoutes.length;
-        };
+  if (isRoot === void 0) {
+    isRoot = true;
+  }
 
-        findMatchInRoutes([], filteredRoutes);
+  if (isRoot) {
+    options.path = rootRouteId;
+  } // Strip the root from parentIds
 
-        if (!foundRoutes.length) {
-          return;
-        }
 
-        foundRoutes.forEach(foundRoute => {
-          var _router$preloadCache$;
+  if (parentId === rootRouteId) {
+    parentId = '';
+  }
 
-          const interpolatedPath = interpolatePath(foundRoute.routePath, params);
-          const matchId = interpolatePath(foundRoute.routeId, params, true);
-          const match = existingMatches.find(d => d.matchId === matchId) || ((_router$preloadCache$ = router.preloadCache[matchId]) == null ? void 0 : _router$preloadCache$.match) || createRouteMatch(router, foundRoute, {
-            matchId,
-            params,
-            pathname: joinPaths([pathname, interpolatedPath])
-          });
-          matches.push(match);
-        });
-        const foundRoute = last(foundRoutes);
+  let path = isRoot ? rootRouteId : options.path; // If the path is anything other than an index path, trim it up
 
-        if ((_foundRoute$childRout = foundRoute.childRoutes) != null && _foundRoute$childRout.length) {
-          recurse(foundRoute.childRoutes);
-        }
-      };
+  if (path && path !== '/') {
+    path = trimPath(path);
+  }
 
-      recurse([router.routeTree]);
-      cascadeLoaderData(matches);
-      return matches;
-    },
-    loadMatches: async (resolvedMatches, loaderOpts) => {
-      const matchPromises = resolvedMatches.map(async match => {
-        // Validate the match (loads search params etc)
-        match.__.validate(); // If this is a preload, add it to the preload cache
+  const routeId = path || options.id;
+  let id = joinPaths([parentId, routeId]);
 
+  if (path === rootRouteId) {
+    path = '/';
+  }
 
-        if (loaderOpts != null && loaderOpts.preload) {
-          router.preloadCache[match.matchId] = {
-            maxAge: loaderOpts == null ? void 0 : loaderOpts.maxAge,
-            match
-          };
-        } // If the match is invalid, errored or idle, trigger it to load
+  if (id !== rootRouteId) {
+    id = joinPaths(['/', id]);
+  }
 
+  const fullPath = id === rootRouteId ? '/' : trimPathRight(joinPaths([parentPath, path]));
+  return {
+    id: id,
+    routeId: routeId,
+    path: path,
+    fullPath: fullPath,
+    options: options,
+    children,
+    createChildren: cb => createRouteConfig(options, cb(childOptions => createRouteConfig(childOptions, undefined, false, id, fullPath)), false, parentId, parentPath),
+    addChildren: children => createRouteConfig(options, children, false, parentId, parentPath),
+    createRoute: childOptions => createRouteConfig(childOptions, undefined, false, id, fullPath)
+  };
+};
 
-        if (match.status === 'success' && match.isInvalid || match.status === 'error' || match.status === 'idle') {
-          match.load();
-        } // If requested, start the pending timers
+const elementTypes = ['element', 'errorElement', 'catchElement', 'pendingElement'];
+function createRouteMatch(router, route, opts) {
+  const routeMatch = _extends({}, route, opts, {
+    router,
+    routeSearch: {},
+    search: {},
+    childMatches: [],
+    status: 'idle',
+    routeLoaderData: {},
+    loaderData: {},
+    isPending: false,
+    isFetching: false,
+    isInvalid: false,
+    getIsInvalid: () => {
+      var _ref, _routeMatch$options$l;
 
+      const now = Date.now();
+      const maxAge = (_ref = (_routeMatch$options$l = routeMatch.options.loaderMaxAge) != null ? _routeMatch$options$l : router.options.defaultLoaderMaxAge) != null ? _ref : 0;
+      return routeMatch.isInvalid || routeMatch.updatedAt + maxAge < now;
+    },
+    __: {
+      abortController: new AbortController(),
+      latestId: '',
+      resolve: () => {},
+      notify: () => {
+        routeMatch.__.resolve();
 
-        if (loaderOpts != null && loaderOpts.withPending) match.__.startPending(); // Wait for the first sign of activity from the match
-        // This might be completion, error, or a pending state
+        routeMatch.router.notify();
+      },
+      startPending: () => {
+        var _routeMatch$options$p, _routeMatch$options$p2;
 
-        await match.__.loadPromise;
-      });
-      router.notify();
-      await Promise.all(matchPromises);
-      return resolvedMatches;
-    },
-    invalidateRoute: opts => {
-      var _router$state$pending5, _router$state$pending6;
+        const pendingMs = (_routeMatch$options$p = routeMatch.options.pendingMs) != null ? _routeMatch$options$p : router.options.defaultPendingMs;
+        const pendingMinMs = (_routeMatch$options$p2 = routeMatch.options.pendingMinMs) != null ? _routeMatch$options$p2 : router.options.defaultPendingMinMs;
 
-      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 => {
-        if (unloadedMatchIds.includes(match.matchId)) {
-          match.invalidate();
+        if (routeMatch.__.pendingTimeout || routeMatch.status !== 'loading' || typeof pendingMs === 'undefined') {
+          return;
         }
-      });
-    },
-    reload: () => router._navigate({
-      fromCurrent: true,
-      replace: true,
-      search: true
-    }),
-    resolvePath: (from, path) => {
-      return _resolvePath(router.basepath, from, cleanPath(path));
-    },
-    matchRoute: (location, opts) => {
-      var _location$from;
-
-      // const location = router.buildNext(opts)
-      location = _extends$1({}, location, {
-        to: location.to ? router.resolvePath((_location$from = location.from) != null ? _location$from : '', location.to) : undefined
-      });
-      const next = router.buildNext(location);
 
-      if (opts != null && opts.pending) {
-        var _router$state$pending7;
+        routeMatch.__.pendingTimeout = setTimeout(() => {
+          routeMatch.isPending = true;
 
-        if (!((_router$state$pending7 = router.state.pending) != null && _router$state$pending7.location)) {
-          return false;
-        }
+          routeMatch.__.resolve();
 
-        return !!matchPathname(router.state.pending.location.pathname, _extends$1({}, opts, {
-          to: next.pathname
-        }));
-      }
+          if (typeof pendingMinMs !== 'undefined') {
+            routeMatch.__.pendingMinPromise = new Promise(r => routeMatch.__.pendingMinTimeout = setTimeout(r, pendingMinMs));
+          }
+        }, pendingMs);
+      },
+      cancelPending: () => {
+        routeMatch.isPending = false;
+        clearTimeout(routeMatch.__.pendingTimeout);
+        clearTimeout(routeMatch.__.pendingMinTimeout);
+        delete routeMatch.__.pendingMinPromise;
+      },
+      // setParentMatch: (parentMatch?: RouteMatch) => {
+      //   routeMatch.parentMatch = parentMatch
+      // },
+      // addChildMatch: (childMatch: RouteMatch) => {
+      //   if (
+      //     routeMatch.childMatches.find((d) => d.matchId === childMatch.matchId)
+      //   ) {
+      //     return
+      //   }
+      //   routeMatch.childMatches.push(childMatch)
+      // },
+      validate: () => {
+        var _routeMatch$parentMat, _routeMatch$parentMat2;
 
-      return !!matchPathname(router.state.location.pathname, _extends$1({}, opts, {
-        to: next.pathname
-      }));
-    },
-    _navigate: location => {
-      const next = router.buildNext(location);
-      return router.commitLocation(next, location.replace);
-    },
-    navigate: async _ref2 => {
-      let {
-        from,
-        to = '.',
-        search,
-        hash,
-        replace,
-        params
-      } = _ref2;
-      // If this link simply reloads the current route,
-      // make sure it has a new key so it will trigger a data refresh
-      // If this `to` is a valid external URL, return
-      // null for LinkUtils
-      const toString = String(to);
-      const fromString = String(from);
-      let isExternal;
+        // 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;
 
-      try {
-        new URL("" + toString);
-        isExternal = true;
-      } catch (e) {}
+        try {
+          const prevSearch = routeMatch.routeSearch;
+          const validator = typeof routeMatch.options.validateSearch === 'object' ? routeMatch.options.validateSearch.parse : routeMatch.options.validateSearch;
+          let nextSearch = replaceEqualDeep(prevSearch, validator == null ? void 0 : validator(parentSearch)); // Invalidate route matches when search param stability changes
 
-      invariant(!isExternal, 'Attempting to navigate to external url with router.navigate!');
-      return router._navigate({
-        from: fromString,
-        to: toString,
-        search,
-        hash,
-        replace,
-        params
-      });
-    },
-    buildLink: _ref3 => {
-      var _preload, _ref4, _ref5;
+          if (prevSearch !== nextSearch) {
+            routeMatch.isInvalid = true;
+          }
 
-      let {
-        from,
-        to = '.',
-        search,
-        params,
-        hash,
-        target,
-        replace,
-        activeOptions,
-        preload,
-        preloadMaxAge: userPreloadMaxAge,
-        preloadDelay: userPreloadDelay,
-        disabled
-      } = _ref3;
+          routeMatch.routeSearch = nextSearch;
+          routeMatch.search = replaceEqualDeep(parentSearch, _extends({}, parentSearch, nextSearch));
+        } catch (err) {
+          console.error(err);
+          const error = new Error('Invalid search params found', {
+            cause: err
+          });
+          error.code = 'INVALID_SEARCH_PARAMS';
+          routeMatch.status = 'error';
+          routeMatch.error = error; // Do not proceed with loading the route
 
-      // If this link simply reloads the current route,
-      // make sure it has a new key so it will trigger a data refresh
-      // If this `to` is a valid external URL, return
-      // null for LinkUtils
-      try {
-        new URL("" + to);
-        return {
-          type: 'external',
-          href: to
-        };
-      } catch (e) {}
+          return;
+        }
+      }
+    },
+    cancel: () => {
+      var _routeMatch$__$abortC;
 
-      const nextOpts = {
-        from,
-        to,
-        search,
-        params,
-        hash,
-        replace
-      };
-      const next = router.buildNext(nextOpts);
-      preload = (_preload = preload) != null ? _preload : router.options.defaultLinkPreload;
-      const preloadMaxAge = (_ref4 = userPreloadMaxAge != null ? userPreloadMaxAge : router.options.defaultLinkPreloadMaxAge) != null ? _ref4 : 2000;
-      const preloadDelay = (_ref5 = userPreloadDelay != null ? userPreloadDelay : router.options.defaultLinkPreloadDelay) != null ? _ref5 : 50; // Compare path/hash for matches
+      (_routeMatch$__$abortC = routeMatch.__.abortController) == null ? void 0 : _routeMatch$__$abortC.abort();
 
-      const pathIsEqual = router.state.location.pathname === next.pathname;
-      const currentPathSplit = router.state.location.pathname.split('/');
-      const nextPathSplit = next.pathname.split('/');
-      const pathIsFuzzyEqual = nextPathSplit.every((d, i) => d === currentPathSplit[i]);
-      const hashIsEqual = router.state.location.hash === next.hash; // Combine the matches based on user options
+      routeMatch.__.cancelPending();
+    },
+    invalidate: () => {
+      routeMatch.isInvalid = true;
+    },
+    hasLoaders: () => {
+      return !!(route.options.loader || route.options.import || elementTypes.some(d => typeof route.options[d] === 'function'));
+    },
+    load: async () => {
+      const id = '' + Date.now() + Math.random();
+      routeMatch.__.latestId = id; // If the match was in an error state, set it
+      // to a loading state again. Otherwise, keep it
+      // as loading or resolved
 
-      const pathTest = activeOptions != null && activeOptions.exact ? pathIsEqual : pathIsFuzzyEqual;
-      const hashTest = activeOptions != null && activeOptions.includeHash ? hashIsEqual : true; // The final "active" test
+      if (routeMatch.status === 'idle') {
+        routeMatch.status = 'loading';
+      } // We started loading the route, so it's no longer invalid
 
-      const isActive = pathTest && hashTest; // The click handler
 
-      const handleClick = e => {
-        if (!disabled && !isCtrlEvent(e) && !e.defaultPrevented && (!target || target === '_self') && e.button === 0) {
-          e.preventDefault();
+      routeMatch.isInvalid = false;
+      routeMatch.__.loadPromise = new Promise(async resolve => {
+        // We are now fetching, even if it's in the background of a
+        // resolved state
+        routeMatch.isFetching = true;
+        routeMatch.__.resolve = resolve;
 
-          if (pathIsEqual && !search && !hash) {
-            router.invalidateRoute(nextOpts);
-          } // All is well? Navigate!)
+        const loaderPromise = (async () => {
+          const importer = routeMatch.options.import; // First, run any importers
 
+          if (importer) {
+            routeMatch.__.importPromise = importer({
+              params: routeMatch.params // search: routeMatch.search,
 
-          router._navigate(nextOpts);
-        }
-      }; // The click handler
+            }).then(imported => {
+              routeMatch.__ = _extends({}, routeMatch.__, imported);
+            });
+          } // Wait for the importer to finish before
+          // attempting to load elements and data
 
 
-      const handleFocus = e => {
-        if (preload && preloadMaxAge > 0) {
-          router.loadRoute(nextOpts, {
-            maxAge: preloadMaxAge
-          });
-        }
-      };
+          await routeMatch.__.importPromise; // Next, load the elements and data in parallel
 
-      const handleEnter = e => {
-        const target = e.target || {};
+          routeMatch.__.elementsPromise = (async () => {
+            // then run all element and data loaders in parallel
+            // For each element type, potentially load it asynchronously
+            await Promise.all(elementTypes.map(async type => {
+              const routeElement = routeMatch.options[type];
 
-        if (preload && preloadMaxAge > 0) {
-          if (target.preloadTimeout) {
-            return;
-          }
+              if (routeMatch.__[type]) {
+                return;
+              }
 
-          target.preloadTimeout = setTimeout(() => {
-            target.preloadTimeout = null;
-            router.loadRoute(nextOpts, {
-              maxAge: preloadMaxAge
-            });
-          }, preloadDelay);
-        }
-      };
+              if (typeof routeElement === 'function') {
+                const res = await routeElement(routeMatch);
+                routeMatch.__[type] = res;
+              } else {
+                routeMatch.__[type] = routeMatch.options[type];
+              }
+            }));
+          })();
 
-      const handleLeave = e => {
-        const target = e.target || {};
+          routeMatch.__.dataPromise = Promise.resolve().then(async () => {
+            try {
+              if (routeMatch.options.loader) {
+                const data = await routeMatch.options.loader({
+                  params: routeMatch.params,
+                  search: routeMatch.routeSearch,
+                  signal: routeMatch.__.abortController.signal
+                });
+
+                if (id !== routeMatch.__.latestId) {
+                  return routeMatch.__.loaderPromise;
+                }
 
-        if (target.preloadTimeout) {
-          clearTimeout(target.preloadTimeout);
-          target.preloadTimeout = null;
-        }
-      };
+                routeMatch.routeLoaderData = replaceEqualDeep(routeMatch.routeLoaderData, data);
+              }
 
-      return {
-        type: 'internal',
-        next,
-        handleFocus,
-        handleClick,
-        handleEnter,
-        handleLeave,
-        isActive,
-        disabled
-      };
-    },
-    __experimental__createSnapshot: () => {
-      return _extends$1({}, router.state, {
-        matches: router.state.matches.map(_ref6 => {
-          let {
-            routeLoaderData: loaderData,
-            matchId
-          } = _ref6;
-          return {
-            matchId,
-            loaderData
-          };
-        })
-      });
-    }
-  };
-  router.location = router.parseLocation(history.location); // router.state.location = __experimental__snapshot?.location ?? router.location
+              routeMatch.error = undefined;
+              routeMatch.status = 'success';
+              routeMatch.updatedAt = Date.now();
+            } catch (err) {
+              if (id !== routeMatch.__.latestId) {
+                return routeMatch.__.loaderPromise;
+              }
 
-  router.state.location = router.location;
-  router.update(userOptions); // Allow frameworks to hook into the router creation
+              if (process.env.NODE_ENV !== 'production') {
+                console.error(err);
+              }
 
-  router.options.createRouter == null ? void 0 : router.options.createRouter(router); // router.mount()
+              routeMatch.error = err;
+              routeMatch.status = 'error';
+              routeMatch.updatedAt = Date.now();
+            }
+          });
 
-  return router;
-}
-function createRoute(routeConfig, options, parent, router) {
-  // const id = (
-  //   options.path === rootRouteId
-  //     ? rootRouteId
-  //     : joinPaths([
-  //         parent!.id,
-  //         `${options.path?.replace(/(.)\/$/, '$1')}`,
-  //       ]).replace(new RegExp(`^${rootRouteId}`), '')
-  // ) as TRouteInfo['id']
-  const {
-    id,
-    routeId,
-    path: routePath,
-    fullPath
-  } = routeConfig;
+          try {
+            await Promise.all([routeMatch.__.elementsPromise, routeMatch.__.dataPromise]);
 
-  const action = router.state.actions[id] || (() => {
-    router.state.actions[id] = {
-      pending: [],
-      submit: async (submission, actionOpts) => {
-        var _actionOpts$invalidat;
+            if (id !== routeMatch.__.latestId) {
+              return routeMatch.__.loaderPromise;
+            }
 
-        if (!route) {
-          return;
-        }
+            if (routeMatch.__.pendingMinPromise) {
+              await routeMatch.__.pendingMinPromise;
+              delete routeMatch.__.pendingMinPromise;
+            }
+          } finally {
+            if (id !== routeMatch.__.latestId) {
+              return routeMatch.__.loaderPromise;
+            }
 
-        const invalidate = (_actionOpts$invalidat = actionOpts == null ? void 0 : actionOpts.invalidate) != null ? _actionOpts$invalidat : true;
-        const actionState = {
-          submittedAt: Date.now(),
-          status: 'pending',
-          submission
-        };
-        action.current = actionState;
-        action.latest = actionState;
-        action.pending.push(actionState);
-        router.state = _extends$1({}, router.state, {
-          currentAction: actionState,
-          latestAction: actionState
-        });
-        router.notify();
+            routeMatch.__.cancelPending();
 
-        try {
-          const res = await (route.options.action == null ? void 0 : route.options.action(submission));
-          actionState.data = res;
+            routeMatch.isPending = false;
+            routeMatch.isFetching = false;
 
-          if (invalidate) {
-            router.invalidateRoute({
-              to: '.',
-              fromCurrent: true
-            });
-            await router.reload();
+            routeMatch.__.notify();
           }
+        })();
 
-          actionState.status = 'success';
-          return res;
-        } catch (err) {
-          console.error(err);
-          actionState.error = err;
-          actionState.status = 'error';
-        } finally {
-          action.pending = action.pending.filter(d => d !== actionState);
-          router.removeActionQueue.push({
-            action,
-            actionState
-          });
-          router.notify();
+        routeMatch.__.loaderPromise = loaderPromise;
+        await loaderPromise;
+
+        if (id !== routeMatch.__.latestId) {
+          return routeMatch.__.loaderPromise;
         }
-      }
-    };
-    return router.state.actions[id];
-  })();
 
-  let route = {
-    routeId: id,
-    routeRouteId: routeId,
-    routePath,
-    fullPath,
-    options,
-    router,
-    childRoutes: undefined,
-    parentRoute: parent,
-    action,
-    buildLink: options => {
-      return router.buildLink(_extends$1({}, options, {
-        from: fullPath
-      }));
-    },
-    navigate: options => {
-      return router.navigate(_extends$1({}, options, {
-        from: fullPath
-      }));
-    },
-    matchRoute: (matchLocation, opts) => {
-      return router.matchRoute(_extends$1({}, matchLocation, {
-        from: fullPath
-      }), opts);
+        delete routeMatch.__.loaderPromise;
+      });
+      return await routeMatch.__.loadPromise;
     }
-  };
-  router.options.createRoute == null ? void 0 : router.options.createRoute({
-    router,
-    route
   });
-  return route;
+
+  if (!routeMatch.hasLoaders()) {
+    routeMatch.status = 'success';
+  }
+
+  return routeMatch;
 }
-function createRouteMatch(router, route, opts) {
-  const routeMatch = _extends$1({}, route, opts, {
-    router,
-    routeSearch: {},
-    search: {},
-    childMatches: [],
-    status: 'idle',
-    routeLoaderData: {},
-    loaderData: {},
-    isPending: false,
-    isFetching: false,
-    isInvalid: false,
-    __: {
-      abortController: new AbortController(),
-      latestId: '',
-      resolve: () => {},
-      notify: () => {
-        routeMatch.__.resolve();
 
-        routeMatch.router.notify();
-      },
-      startPending: () => {
-        var _routeMatch$options$p, _routeMatch$options$p2;
+const defaultParseSearch = parseSearchWith(JSON.parse);
+const defaultStringifySearch = stringifySearchWith(JSON.stringify);
+function parseSearchWith(parser) {
+  return searchStr => {
+    if (searchStr.substring(0, 1) === '?') {
+      searchStr = searchStr.substring(1);
+    }
 
-        const pendingMs = (_routeMatch$options$p = routeMatch.options.pendingMs) != null ? _routeMatch$options$p : router.options.defaultPendingMs;
-        const pendingMinMs = (_routeMatch$options$p2 = routeMatch.options.pendingMinMs) != null ? _routeMatch$options$p2 : router.options.defaultPendingMinMs;
+    let query = decode(searchStr); // Try to parse any query params that might be json
 
-        if (routeMatch.__.pendingTimeout || routeMatch.status !== 'loading' || typeof pendingMs === 'undefined') {
-          return;
+    for (let key in query) {
+      const value = query[key];
+
+      if (typeof value === 'string') {
+        try {
+          query[key] = parser(value);
+        } catch (err) {//
         }
+      }
+    }
 
-        routeMatch.__.pendingTimeout = setTimeout(() => {
-          routeMatch.isPending = true;
+    return query;
+  };
+}
+function stringifySearchWith(stringify) {
+  return search => {
+    search = _extends({}, search);
 
-          routeMatch.__.resolve();
+    if (search) {
+      Object.keys(search).forEach(key => {
+        const val = search[key];
 
-          if (typeof pendingMinMs !== 'undefined') {
-            routeMatch.__.pendingMinPromise = new Promise(r => routeMatch.__.pendingMinTimeout = setTimeout(r, pendingMinMs));
+        if (typeof val === 'undefined' || val === undefined) {
+          delete search[key];
+        } else if (val && typeof val === 'object' && val !== null) {
+          try {
+            search[key] = stringify(val);
+          } catch (err) {// silent
           }
-        }, pendingMs);
-      },
-      cancelPending: () => {
-        routeMatch.isPending = false;
-        clearTimeout(routeMatch.__.pendingTimeout);
-        clearTimeout(routeMatch.__.pendingMinTimeout);
-        delete routeMatch.__.pendingMinPromise;
-      },
-      // setParentMatch: (parentMatch?: RouteMatch) => {
-      //   routeMatch.parentMatch = parentMatch
-      // },
-      // addChildMatch: (childMatch: RouteMatch) => {
-      //   if (
-      //     routeMatch.childMatches.find((d) => d.matchId === childMatch.matchId)
-      //   ) {
-      //     return
-      //   }
-      //   routeMatch.childMatches.push(childMatch)
-      // },
-      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 searchStr = encode(search).toString();
+    return searchStr ? "?" + searchStr : '';
+  };
+}
 
-        try {
-          const prevSearch = routeMatch.routeSearch;
-          let nextSearch = replaceEqualDeep(prevSearch, routeMatch.options.validateSearch == null ? void 0 : routeMatch.options.validateSearch(parentSearch)); // Invalidate route matches when search param stability changes
+var _window$document;
+// Detect if we're in the DOM
+const isServer = Boolean(typeof window === 'undefined' || !((_window$document = window.document) != null && _window$document.createElement)); // This is the default history object if none is defined
 
-          if (prevSearch !== nextSearch) {
-            routeMatch.isInvalid = true;
-          }
+const createDefaultHistory = () => !isServer ? createBrowserHistory() : createMemoryHistory();
 
-          routeMatch.routeSearch = nextSearch;
-          routeMatch.search = replaceEqualDeep(parentSearch, _extends$1({}, parentSearch, nextSearch));
-        } catch (err) {
-          console.error(err);
-          const error = new Error('Invalid search params found', {
-            cause: err
-          });
-          error.code = 'INVALID_SEARCH_PARAMS';
-          routeMatch.status = 'error';
-          routeMatch.error = error; // Do not proceed with loading the route
+function createRouter(userOptions) {
+  var _userOptions$stringif, _userOptions$parseSea;
 
-          return;
-        }
-      }
+  const history = (userOptions == null ? void 0 : userOptions.history) || createDefaultHistory();
+
+  const originalOptions = _extends({
+    defaultLoaderGcMaxAge: 5 * 60 * 1000,
+    defaultLoaderMaxAge: 0,
+    defaultLinkPreloadDelay: 50
+  }, userOptions, {
+    stringifySearch: (_userOptions$stringif = userOptions == null ? void 0 : userOptions.stringifySearch) != null ? _userOptions$stringif : defaultStringifySearch,
+    parseSearch: (_userOptions$parseSea = userOptions == null ? void 0 : userOptions.parseSearch) != null ? _userOptions$parseSea : defaultParseSearch
+  });
+
+  let router = {
+    options: originalOptions,
+    listeners: [],
+    removeActionQueue: [],
+    // Resolved after construction
+    basepath: '',
+    routeTree: undefined,
+    routesById: {},
+    location: undefined,
+    allRouteInfo: undefined,
+    //
+    navigationPromise: Promise.resolve(),
+    resolveNavigation: () => {},
+    matchCache: {},
+    state: {
+      status: 'idle',
+      location: null,
+      matches: [],
+      actions: {},
+      loaderData: {},
+      lastUpdated: Date.now(),
+      isFetching: false,
+      isPreloading: false
     },
-    cancel: () => {
-      var _routeMatch$__$abortC;
+    startedLoadingAt: Date.now(),
+    subscribe: listener => {
+      router.listeners.push(listener);
+      return () => {
+        router.listeners = router.listeners.filter(x => x !== listener);
+      };
+    },
+    getRoute: id => {
+      return router.routesById[id];
+    },
+    notify: () => {
+      router.state = _extends({}, router.state, {
+        isFetching: router.state.status === 'loading' || router.state.matches.some(d => d.isFetching),
+        isPreloading: Object.values(router.matchCache).some(d => d.match.isFetching && !router.state.matches.find(dd => dd.matchId === d.match.matchId))
+      });
+      cascadeLoaderData(router.state.matches);
+      router.listeners.forEach(listener => listener());
+    },
+    mount: () => {
+      const next = 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.
 
-      (_routeMatch$__$abortC = routeMatch.__.abortController) == null ? void 0 : _routeMatch$__$abortC.abort();
+      if (next.href !== router.location.href) {
+        router.commitLocation(next, true);
+      } else {
+        router.loadLocation();
+      }
 
-      routeMatch.__.cancelPending();
+      const unsub = history.listen(event => {
+        router.loadLocation(router.parseLocation(event.location, router.location));
+      }); // addEventListener does not exist in React Native, but window does
+      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+
+      if (!isServer && window.addEventListener) {
+        // Listen to visibillitychange and focus
+        window.addEventListener('visibilitychange', router.onFocus, false);
+        window.addEventListener('focus', router.onFocus, false);
+      }
+
+      return () => {
+        unsub(); // Be sure to unsubscribe if a new handler is set
+
+        window.removeEventListener('visibilitychange', router.onFocus);
+        window.removeEventListener('focus', router.onFocus);
+      };
     },
-    invalidate: () => {
-      routeMatch.isInvalid = true;
+    onFocus: () => {
+      router.loadLocation();
     },
-    load: async () => {
-      const id = '' + Date.now() + Math.random();
-      routeMatch.__.latestId = id; // If the match was in an error state, set it
-      // to a loading state again. Otherwise, keep it
-      // as loading or resolved
+    update: opts => {
+      Object.assign(router.options, opts);
+      const {
+        basepath,
+        routeConfig
+      } = router.options;
+      router.basepath = cleanPath("/" + (basepath != null ? basepath : ''));
 
-      if (routeMatch.status === 'error' || routeMatch.status === 'idle') {
-        routeMatch.status = 'loading';
-      } // We started loading the route, so it's no longer invalid
+      if (routeConfig) {
+        router.routesById = {};
+        router.routeTree = router.buildRouteTree(routeConfig);
+      }
+
+      return router;
+    },
+    buildRouteTree: rootRouteConfig => {
+      const recurseRoutes = (routeConfigs, parent) => {
+        return routeConfigs.map(routeConfig => {
+          const routeOptions = routeConfig.options;
+          const route = createRoute(routeConfig, routeOptions, parent, router); // {
+          //   pendingMs: routeOptions.pendingMs ?? router.defaultPendingMs,
+          //   pendingMinMs: routeOptions.pendingMinMs ?? router.defaultPendingMinMs,
+          // }
 
+          const existingRoute = router.routesById[route.routeId];
 
-      routeMatch.isInvalid = false;
-      routeMatch.__.loadPromise = new Promise(async resolve => {
-        // We are now fetching, even if it's in the background of a
-        // resolved state
-        routeMatch.isFetching = true;
-        routeMatch.__.resolve = resolve;
+          if (existingRoute) {
+            if (process.env.NODE_ENV !== 'production') {
+              console.warn("Duplicate routes found with id: " + String(route.routeId), router.routesById, route);
+            }
 
-        const loaderPromise = (async () => {
-          const importer = routeMatch.options.import; // First, run any importers
+            throw new Error();
+          }
+          router.routesById[route.routeId] = route;
+          const children = routeConfig.children;
+          route.childRoutes = children != null && children.length ? recurseRoutes(children, route) : undefined;
+          return route;
+        });
+      };
 
-          if (importer) {
-            routeMatch.__.importPromise = importer({
-              params: routeMatch.params // search: routeMatch.search,
+      const routes = recurseRoutes([rootRouteConfig]);
+      return routes[0];
+    },
+    parseLocation: (location, previousLocation) => {
+      var _location$hash$split$;
 
-            }).then(imported => {
-              routeMatch.__ = _extends$1({}, routeMatch.__, imported);
-            });
-          } // Wait for the importer to finish before
-          // attempting to load elements and data
+      const parsedSearch = router.options.parseSearch(location.search);
+      return {
+        pathname: location.pathname,
+        searchStr: location.search,
+        search: replaceEqualDeep(previousLocation == null ? void 0 : previousLocation.search, parsedSearch),
+        hash: (_location$hash$split$ = location.hash.split('#').reverse()[0]) != null ? _location$hash$split$ : '',
+        href: "" + location.pathname + location.search + location.hash,
+        state: location.state,
+        key: location.key
+      };
+    },
+    buildLocation: function buildLocation(dest) {
+      var _dest$from, _router$basepath, _dest$to, _last, _dest$params, _dest$__preSearchFilt, _functionalUpdate, _dest$__preSearchFilt2, _dest$__postSearchFil;
+
+      if (dest === void 0) {
+        dest = {};
+      }
+
+      // const resolvedFrom: Location = {
+      //   ...router.location,
+      const fromPathname = dest.fromCurrent ? router.location.pathname : (_dest$from = dest.from) != null ? _dest$from : router.location.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, {
+        strictParseParams: true
+      });
+      const toMatches = router.matchRoutes(pathname);
 
-          await routeMatch.__.importPromise; // Next, load the elements and data in parallel
+      const prevParams = _extends({}, (_last = last(fromMatches)) == null ? void 0 : _last.params);
 
-          routeMatch.__.elementsPromise = (async () => {
-            // then run all element and data loaders in parallel
-            // For each element type, potentially load it asynchronously
-            const elementTypes = ['element', 'errorElement', 'catchElement', 'pendingElement'];
-            await Promise.all(elementTypes.map(async type => {
-              const routeElement = routeMatch.options[type];
+      let nextParams = ((_dest$params = dest.params) != null ? _dest$params : true) === true ? prevParams : functionalUpdate(dest.params, prevParams);
 
-              if (routeMatch.__[type]) {
-                return;
-              }
+      if (nextParams) {
+        toMatches.map(d => d.options.stringifyParams).filter(Boolean).forEach(fn => {
+          Object.assign({}, nextParams, fn(nextParams));
+        });
+      }
 
-              if (typeof routeElement === 'function') {
-                const res = await routeElement(routeMatch);
-                routeMatch.__[type] = res;
-              } else {
-                routeMatch.__[type] = routeMatch.options[type];
-              }
-            }));
-          })();
+      pathname = interpolatePath(pathname, nextParams != null ? nextParams : {}); // Pre filters first
 
-          routeMatch.__.dataPromise = Promise.resolve().then(async () => {
-            try {
-              const data = await (routeMatch.options.loader == null ? void 0 : routeMatch.options.loader({
-                params: routeMatch.params,
-                search: routeMatch.routeSearch,
-                signal: routeMatch.__.abortController.signal
-              }));
+      const preFilteredSearch = (_dest$__preSearchFilt = dest.__preSearchFilters) != null && _dest$__preSearchFilt.length ? dest.__preSearchFilters.reduce((prev, next) => next(prev), router.location.search) : router.location.search; // Then the link/navigate function
 
-              if (id !== routeMatch.__.latestId) {
-                return routeMatch.__.loaderPromise;
-              }
+      const destSearch = dest.search === true ? preFilteredSearch // Preserve resolvedFrom true
+      : dest.search ? (_functionalUpdate = functionalUpdate(dest.search, preFilteredSearch)) != null ? _functionalUpdate : {} // Updater
+      : (_dest$__preSearchFilt2 = dest.__preSearchFilters) != null && _dest$__preSearchFilt2.length ? preFilteredSearch // Preserve resolvedFrom filters
+      : {}; // Then post filters
 
-              routeMatch.routeLoaderData = replaceEqualDeep(routeMatch.routeLoaderData, data);
-              routeMatch.error = undefined;
-              routeMatch.status = 'success';
-              routeMatch.updatedAt = Date.now();
-            } catch (err) {
-              if (id !== routeMatch.__.latestId) {
-                return routeMatch.__.loaderPromise;
-              }
+      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 searchStr = router.options.stringifySearch(search);
+      let hash = dest.hash === true ? router.location.hash : functionalUpdate(dest.hash, router.location.hash);
+      hash = hash ? "#" + hash : '';
+      return {
+        pathname,
+        search,
+        searchStr,
+        state: router.location.state,
+        hash,
+        href: "" + pathname + searchStr + hash,
+        key: dest.key
+      };
+    },
+    commitLocation: (next, replace) => {
+      const id = '' + Date.now() + Math.random();
+      if (router.navigateTimeout) clearTimeout(router.navigateTimeout);
+      let nextAction = 'replace';
 
-              if (process.env.NODE_ENV !== 'production') {
-                console.error(err);
-              }
+      if (!replace) {
+        nextAction = 'push';
+      }
 
-              routeMatch.error = err;
-              routeMatch.status = 'error';
-              routeMatch.updatedAt = Date.now();
-            }
-          });
+      const isSameUrl = router.parseLocation(history.location).href === next.href;
 
-          try {
-            await Promise.all([routeMatch.__.elementsPromise, routeMatch.__.dataPromise]);
+      if (isSameUrl && !next.key) {
+        nextAction = 'replace';
+      }
 
-            if (id !== routeMatch.__.latestId) {
-              return routeMatch.__.loaderPromise;
-            }
+      if (nextAction === 'replace') {
+        history.replace({
+          pathname: next.pathname,
+          hash: next.hash,
+          search: next.searchStr
+        }, {
+          id
+        });
+      } else {
+        history.push({
+          pathname: next.pathname,
+          hash: next.hash,
+          search: next.searchStr
+        }, {
+          id
+        });
+      }
 
-            if (routeMatch.__.pendingMinPromise) {
-              await routeMatch.__.pendingMinPromise;
-              delete routeMatch.__.pendingMinPromise;
-            }
-          } finally {
-            if (id !== routeMatch.__.latestId) {
-              return routeMatch.__.loaderPromise;
-            }
+      router.navigationPromise = new Promise(resolve => {
+        const previousNavigationResolve = router.resolveNavigation;
 
-            routeMatch.__.cancelPending();
+        router.resolveNavigation = () => {
+          previousNavigationResolve();
+          resolve();
+        };
+      });
+      return router.navigationPromise;
+    },
+    buildNext: opts => {
+      const next = router.buildLocation(opts);
+      const matches = router.matchRoutes(next.pathname);
 
-            routeMatch.isPending = false;
-            routeMatch.isFetching = false;
+      const __preSearchFilters = matches.map(match => {
+        var _match$options$preSea;
 
-            routeMatch.__.notify();
-          }
-        })();
+        return (_match$options$preSea = match.options.preSearchFilters) != null ? _match$options$preSea : [];
+      }).flat().filter(Boolean);
 
-        routeMatch.__.loaderPromise = loaderPromise;
-        await loaderPromise;
+      const __postSearchFilters = matches.map(match => {
+        var _match$options$postSe;
 
-        if (id !== routeMatch.__.latestId) {
-          return routeMatch.__.loaderPromise;
-        }
+        return (_match$options$postSe = match.options.postSearchFilters) != null ? _match$options$postSe : [];
+      }).flat().filter(Boolean);
 
-        delete routeMatch.__.loaderPromise;
+      return router.buildLocation(_extends({}, opts, {
+        __preSearchFilters,
+        __postSearchFilters
+      }));
+    },
+    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 => {
+        match.cancel();
       });
-      return await routeMatch.__.loadPromise;
-    }
-  });
+    },
+    loadLocation: async next => {
+      const id = Math.random();
+      router.startedLoadingAt = id;
 
-  return routeMatch;
-}
+      if (next) {
+        // Ingest the new location
+        router.location = next;
+      } // Clear out old actions
 
-function cascadeLoaderData(matches) {
-  matches.forEach((match, index) => {
-    const parent = matches[index - 1];
 
-    if (parent) {
-      match.loaderData = replaceEqualDeep(match.loaderData, _extends$1({}, parent.loaderData, match.routeLoaderData));
-    }
-  });
-}
+      router.removeActionQueue.forEach(_ref => {
+        let {
+          action,
+          actionState
+        } = _ref;
 
-function matchPathname(currentPathname, matchLocation) {
-  const pathParams = matchByPath(currentPathname, matchLocation); // const searchMatched = matchBySearch(currentLocation.search, matchLocation)
+        if (router.state.currentAction === actionState) {
+          router.state.currentAction = undefined;
+        }
 
-  if (matchLocation.to && !pathParams) {
-    return;
-  } // if (matchLocation.search && !searchMatched) {
-  //   return
-  // }
+        if (action.current === actionState) {
+          action.current = undefined;
+        }
+      });
+      router.removeActionQueue = []; // Cancel any pending matches
 
+      router.cancelMatches(); // Match the routes
 
-  return pathParams != null ? pathParams : {};
-}
+      const matches = router.matchRoutes(location.pathname, {
+        strictParseParams: true
+      });
+      router.state = _extends({}, router.state, {
+        pending: {
+          matches: matches,
+          location: router.location
+        },
+        status: 'loading'
+      });
+      router.notify(); // Load the matches
 
-function interpolatePath(path, params, leaveWildcard) {
-  const interpolatedPathSegments = parsePathname(path);
-  return joinPaths(interpolatedPathSegments.map(segment => {
-    if (segment.value === '*' && !leaveWildcard) {
-      return '';
-    }
+      await router.loadMatches(matches, {
+        withPending: true
+      });
 
-    if (segment.type === 'param') {
-      var _segment$value$substr;
+      if (router.startedLoadingAt !== id) {
+        // Ignore side-effects of match loading
+        return router.navigationPromise;
+      }
 
-      return (_segment$value$substr = params[segment.value.substring(1)]) != null ? _segment$value$substr : '';
-    }
+      const previousMatches = router.state.matches;
+      const exiting = [],
+            staying = [];
+      previousMatches.forEach(d => {
+        if (matches.find(dd => dd.matchId === d.matchId)) {
+          staying.push(d);
+        } else {
+          exiting.push(d);
+        }
+      });
+      const now = Date.now();
+      exiting.forEach(d => {
+        var _ref2, _d$options$loaderGcMa, _ref3, _d$options$loaderMaxA;
 
-    return segment.value;
-  }));
-}
+        d.__.onExit == null ? void 0 : d.__.onExit({
+          params: d.params,
+          search: d.routeSearch
+        }); // Clear idle error states when match leaves
 
-function warning(cond, message) {
-  if (cond) {
-    if (typeof console !== 'undefined') console.warn(message);
+        if (d.status === 'error' && !d.isFetching) {
+          d.status = 'idle';
+          d.error = undefined;
+        }
 
-    try {
-      throw new Error(message);
-    } catch (_unused) {}
-  }
+        const gc = Math.max((_ref2 = (_d$options$loaderGcMa = d.options.loaderGcMaxAge) != null ? _d$options$loaderGcMa : router.options.defaultLoaderGcMaxAge) != null ? _ref2 : 0, (_ref3 = (_d$options$loaderMaxA = d.options.loaderMaxAge) != null ? _d$options$loaderMaxA : router.options.defaultLoaderMaxAge) != null ? _ref3 : 0);
 
-  return true;
-}
+        if (gc > 0) {
+          router.matchCache[d.matchId] = {
+            gc: gc == Infinity ? Number.MAX_SAFE_INTEGER : now + gc,
+            match: d
+          };
+        }
+      });
+      staying.forEach(d => {
+        d.options.onTransition == null ? void 0 : d.options.onTransition({
+          params: d.params,
+          search: d.routeSearch
+        });
+      });
+      const entering = matches.filter(d => {
+        return !previousMatches.find(dd => dd.matchId === d.matchId);
+      });
+      entering.forEach(d => {
+        d.__.onExit = d.options.onMatch == null ? void 0 : d.options.onMatch({
+          params: d.params,
+          search: d.search
+        });
+      });
+
+      if (matches.some(d => d.status === 'loading')) {
+        router.notify();
+        await Promise.all(matches.map(d => d.__.loaderPromise || Promise.resolve()));
+      }
 
-function isFunction(d) {
-  return typeof d === 'function';
-}
+      if (router.startedLoadingAt !== id) {
+        // Ignore side-effects of match loading
+        return;
+      }
 
-function functionalUpdate(updater, previous) {
-  if (isFunction(updater)) {
-    return updater(previous);
-  }
+      router.state = _extends({}, router.state, {
+        location: router.location,
+        matches,
+        pending: undefined,
+        status: 'idle'
+      });
+      router.notify();
+      router.resolveNavigation();
+    },
+    cleanMatchCache: () => {
+      const now = Date.now();
+      Object.keys(router.matchCache).forEach(matchId => {
+        const entry = router.matchCache[matchId]; // Don't remove loading matches
 
-  return updater;
-}
+        if (entry.match.status === 'loading') {
+          return;
+        } // Do not remove successful matches that are still valid
 
-function joinPaths(paths) {
-  return cleanPath(paths.filter(Boolean).join('/'));
-}
 
-function cleanPath(path) {
-  // remove double slashes
-  return path.replace(/\/{2,}/g, '/');
-}
+        if (entry.gc > 0 && entry.gc > now) {
+          return;
+        } // Everything else gets removed
 
-function trimPathLeft(path) {
-  return path === '/' ? path : path.replace(/^\/{1,}/, '');
-}
 
-function trimPathRight(path) {
-  return path === '/' ? path : path.replace(/\/{1,}$/, '');
-}
+        delete router.matchCache[matchId];
+      });
+    },
+    loadRoute: async function loadRoute(navigateOpts, loaderOpts) {
+      if (navigateOpts === void 0) {
+        navigateOpts = router.location;
+      }
 
-function trimPath(path) {
-  return trimPathRight(trimPathLeft(path));
-}
+      const next = router.buildNext(navigateOpts);
+      const matches = router.matchRoutes(next.pathname, {
+        strictParseParams: true
+      });
+      await router.loadMatches(matches, {
+        preload: true,
+        maxAge: loaderOpts.maxAge
+      });
+      return matches;
+    },
+    matchRoutes: (pathname, opts) => {
+      var _router$state$pending3, _router$state$pending4;
 
-function matchByPath(from, matchLocation) {
-  var _matchLocation$to;
+      router.cleanMatchCache();
+      const matches = [];
 
-  const baseSegments = parsePathname(from);
-  const routeSegments = parsePathname("" + ((_matchLocation$to = matchLocation.to) != null ? _matchLocation$to : '*'));
-  const params = {};
+      if (!router.routeTree) {
+        return matches;
+      }
 
-  let isMatch = (() => {
-    for (let i = 0; i < Math.max(baseSegments.length, routeSegments.length); i++) {
-      const baseSegment = baseSegments[i];
-      const routeSegment = routeSegments[i];
-      const isLastRouteSegment = i === routeSegments.length - 1;
-      const isLastBaseSegment = i === baseSegments.length - 1;
+      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 : [])];
 
-      if (routeSegment) {
-        if (routeSegment.type === 'wildcard') {
-          if (baseSegment != null && baseSegment.value) {
-            params['*'] = joinPaths(baseSegments.slice(i).map(d => d.value));
-            return true;
-          }
+      const recurse = async routes => {
+        var _parentMatch$params, _router$options$filte, _foundRoute$childRout;
 
-          return false;
-        }
+        const parentMatch = last(matches);
+        let params = (_parentMatch$params = parentMatch == null ? void 0 : parentMatch.params) != null ? _parentMatch$params : {};
+        const filteredRoutes = (_router$options$filte = router.options.filterRoutes == null ? void 0 : router.options.filterRoutes(routes)) != null ? _router$options$filte : routes;
+        let foundRoutes = [];
 
-        if (routeSegment.type === 'pathname') {
-          if (routeSegment.value === '/' && !(baseSegment != null && baseSegment.value)) {
-            return true;
-          }
+        const findMatchInRoutes = (parentRoutes, routes) => {
+          routes.some(route => {
+            var _route$childRoutes, _route$childRoutes2, _route$options$caseSe;
 
-          if (baseSegment) {
-            if (matchLocation.caseSensitive) {
-              if (routeSegment.value !== baseSegment.value) {
-                return false;
-              }
-            } else if (routeSegment.value.toLowerCase() !== baseSegment.value.toLowerCase()) {
-              return false;
+            if (!route.routePath && (_route$childRoutes = route.childRoutes) != null && _route$childRoutes.length) {
+              return findMatchInRoutes([...foundRoutes, route], route.childRoutes);
             }
-          }
-        }
-
-        if (!baseSegment) {
-          return false;
-        }
 
-        if (routeSegment.type === 'param') {
-          if ((baseSegment == null ? void 0 : baseSegment.value) === '/') {
-            return false;
-          }
+            const fuzzy = !!(route.routePath !== '/' || (_route$childRoutes2 = route.childRoutes) != null && _route$childRoutes2.length);
+            const matchParams = matchPathname(pathname, {
+              to: route.fullPath,
+              fuzzy,
+              caseSensitive: (_route$options$caseSe = route.options.caseSensitive) != null ? _route$options$caseSe : router.options.caseSensitive
+            });
 
-          if (!baseSegment.value.startsWith(':')) {
-            params[routeSegment.value.substring(1)] = baseSegment.value;
-          }
-        }
-      }
+            if (matchParams) {
+              let parsedParams;
 
-      if (isLastRouteSegment && !isLastBaseSegment) {
-        return !!matchLocation.fuzzy;
-      }
-    }
+              try {
+                var _route$options$parseP;
 
-    return true;
-  })();
+                parsedParams = (_route$options$parseP = route.options.parseParams == null ? void 0 : route.options.parseParams(matchParams)) != null ? _route$options$parseP : matchParams;
+              } catch (err) {
+                if (opts != null && opts.strictParseParams) {
+                  throw err;
+                }
+              }
 
-  return isMatch ? params : undefined;
-} // function matchBySearch(
-//   search: SearchSchema,
-//   matchLocation: MatchLocation,
-// ) {
-//   return !!(matchLocation.search && matchLocation.search(search))
-// }
+              params = _extends({}, params, parsedParams);
+            }
 
-function parsePathname(pathname) {
-  if (!pathname) {
-    return [];
-  }
+            if (!!matchParams) {
+              foundRoutes = [...parentRoutes, route];
+            }
 
-  pathname = cleanPath(pathname);
-  const segments = [];
+            return !!foundRoutes.length;
+          });
+          return !!foundRoutes.length;
+        };
 
-  if (pathname.slice(0, 1) === '/') {
-    pathname = pathname.substring(1);
-    segments.push({
-      type: 'pathname',
-      value: '/'
-    });
-  }
+        findMatchInRoutes([], filteredRoutes);
 
-  if (!pathname) {
-    return segments;
-  } // Remove empty segments and '.' segments
+        if (!foundRoutes.length) {
+          return;
+        }
 
+        foundRoutes.forEach(foundRoute => {
+          var _router$matchCache$ma;
 
-  const split = pathname.split('/').filter(Boolean);
-  segments.push(...split.map(part => {
-    if (part.startsWith('*')) {
-      return {
-        type: 'wildcard',
-        value: part
-      };
-    }
+          const interpolatedPath = interpolatePath(foundRoute.routePath, params);
+          const matchId = interpolatePath(foundRoute.routeId, params, true);
+          const match = existingMatches.find(d => d.matchId === matchId) || ((_router$matchCache$ma = router.matchCache[matchId]) == null ? void 0 : _router$matchCache$ma.match) || createRouteMatch(router, foundRoute, {
+            matchId,
+            params,
+            pathname: joinPaths([pathname, interpolatedPath])
+          });
+          matches.push(match);
+        });
+        const foundRoute = last(foundRoutes);
 
-    if (part.charAt(0) === ':') {
-      return {
-        type: 'param',
-        value: part
+        if ((_foundRoute$childRout = foundRoute.childRoutes) != null && _foundRoute$childRout.length) {
+          recurse(foundRoute.childRoutes);
+        }
       };
-    }
 
-    return {
-      type: 'pathname',
-      value: part
-    };
-  }));
+      recurse([router.routeTree]);
+      cascadeLoaderData(matches);
+      return matches;
+    },
+    loadMatches: async (resolvedMatches, loaderOpts) => {
+      const now = Date.now();
+      const matchPromises = resolvedMatches.map(async match => {
+        // Validate the match (loads search params etc)
+        match.__.validate(); // If the match doesn't have a loader, don't attempt to load it
 
-  if (pathname.slice(-1) === '/') {
-    pathname = pathname.substring(1);
-    segments.push({
-      type: 'pathname',
-      value: '/'
-    });
-  }
 
-  return segments;
-}
+        if (!match.hasLoaders()) {
+          return;
+        } // If this is a preload, add it to the preload cache
 
-function _resolvePath(basepath, base, to) {
-  base = base.replace(new RegExp("^" + basepath), '/');
-  to = to.replace(new RegExp("^" + basepath), '/');
-  let baseSegments = parsePathname(base);
-  const toSegments = parsePathname(to);
-  toSegments.forEach((toSegment, index) => {
-    if (toSegment.value === '/') {
-      if (!index) {
-        // Leading slash
-        baseSegments = [toSegment];
-      } else if (index === toSegments.length - 1) {
-        // Trailing Slash
-        baseSegments.push(toSegment);
-      } else ;
-    } else if (toSegment.value === '..') {
-      var _last2;
 
-      // Extra trailing slash? pop it off
-      if (baseSegments.length > 1 && ((_last2 = last(baseSegments)) == null ? void 0 : _last2.value) === '/') {
-        baseSegments.pop();
-      }
+        if (loaderOpts != null && loaderOpts.preload && (loaderOpts == null ? void 0 : loaderOpts.maxAge) > 0) {
+          // If the match is currently active, don't preload it
+          if (router.state.matches.find(d => d.matchId === match.matchId)) {
+            return;
+          }
 
-      baseSegments.pop();
-    } else if (toSegment.value === '.') {
-      return;
-    } else {
-      baseSegments.push(toSegment);
-    }
-  });
-  const joined = joinPaths([basepath, ...baseSegments.map(d => d.value)]);
-  return cleanPath(joined);
-}
-function replaceEqualDeep(prev, next) {
-  if (prev === next) {
-    return prev;
-  }
+          router.matchCache[match.matchId] = {
+            gc: now + loaderOpts.maxAge,
+            // TODO: Should this use the route's maxAge?
+            match
+          };
+        } // If the match is invalid, errored or idle, trigger it to load
 
-  const array = Array.isArray(prev) && Array.isArray(next);
 
-  if (array || isPlainObject(prev) && isPlainObject(next)) {
-    const aSize = array ? prev.length : Object.keys(prev).length;
-    const bItems = array ? next : Object.keys(next);
-    const bSize = bItems.length;
-    const copy = array ? [] : {};
-    let equalItems = 0;
+        if (match.status === 'success' && match.getIsInvalid() || match.status === 'error' || match.status === 'idle') {
+          match.load();
+        }
 
-    for (let i = 0; i < bSize; i++) {
-      const key = array ? i : bItems[i];
-      copy[key] = replaceEqualDeep(prev[key], next[key]);
+        if (match.status === 'loading') {
+          // If requested, start the pending timers
+          if (loaderOpts != null && loaderOpts.withPending) match.__.startPending(); // Wait for the first sign of activity from the match
+          // This might be completion, error, or a pending state
 
-      if (copy[key] === prev[key]) {
-        equalItems++;
-      }
-    }
+          await match.__.loadPromise;
+        }
+      });
+      router.notify();
+      await Promise.all(matchPromises);
+    },
+    invalidateRoute: opts => {
+      var _router$state$pending5, _router$state$pending6;
 
-    return aSize === bSize && equalItems === aSize ? prev : copy;
-  }
+      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 => {
+        if (unloadedMatchIds.includes(match.matchId)) {
+          match.invalidate();
+        }
+      });
+    },
+    reload: () => router._navigate({
+      fromCurrent: true,
+      replace: true,
+      search: true
+    }),
+    resolvePath: (from, path) => {
+      return resolvePath(router.basepath, from, cleanPath(path));
+    },
+    matchRoute: (location, opts) => {
+      var _location$from;
 
-  return next;
-} // Copied from: https://github.com/jonschlinkert/is-plain-object
+      // const location = router.buildNext(opts)
+      location = _extends({}, location, {
+        to: location.to ? router.resolvePath((_location$from = location.from) != null ? _location$from : '', location.to) : undefined
+      });
+      const next = router.buildNext(location);
 
-function isPlainObject(o) {
-  if (!hasObjectPrototype(o)) {
-    return false;
-  } // If has modified constructor
+      if (opts != null && opts.pending) {
+        var _router$state$pending7;
 
+        if (!((_router$state$pending7 = router.state.pending) != null && _router$state$pending7.location)) {
+          return false;
+        }
 
-  const ctor = o.constructor;
+        return !!matchPathname(router.state.pending.location.pathname, _extends({}, opts, {
+          to: next.pathname
+        }));
+      }
 
-  if (typeof ctor === 'undefined') {
-    return true;
-  } // If has modified prototype
+      return !!matchPathname(router.state.location.pathname, _extends({}, opts, {
+        to: next.pathname
+      }));
+    },
+    _navigate: location => {
+      const next = router.buildNext(location);
+      return router.commitLocation(next, location.replace);
+    },
+    navigate: async _ref4 => {
+      let {
+        from,
+        to = '.',
+        search,
+        hash,
+        replace,
+        params
+      } = _ref4;
+      // If this link simply reloads the current route,
+      // make sure it has a new key so it will trigger a data refresh
+      // If this `to` is a valid external URL, return
+      // null for LinkUtils
+      const toString = String(to);
+      const fromString = String(from);
+      let isExternal;
 
+      try {
+        new URL("" + toString);
+        isExternal = true;
+      } catch (e) {}
 
-  const prot = ctor.prototype;
+      invariant(!isExternal, 'Attempting to navigate to external url with router.navigate!');
+      return router._navigate({
+        from: fromString,
+        to: toString,
+        search,
+        hash,
+        replace,
+        params
+      });
+    },
+    buildLink: _ref5 => {
+      var _preload, _ref6, _ref7, _ref8;
 
-  if (!hasObjectPrototype(prot)) {
-    return false;
-  } // If constructor does not have an Object-specific method
+      let {
+        from,
+        to = '.',
+        search,
+        params,
+        hash,
+        target,
+        replace,
+        activeOptions,
+        preload,
+        preloadMaxAge: userPreloadMaxAge,
+        preloadDelay: userPreloadDelay,
+        disabled
+      } = _ref5;
 
+      // If this link simply reloads the current route,
+      // make sure it has a new key so it will trigger a data refresh
+      // If this `to` is a valid external URL, return
+      // null for LinkUtils
+      try {
+        new URL("" + to);
+        return {
+          type: 'external',
+          href: to
+        };
+      } catch (e) {}
 
-  if (!prot.hasOwnProperty('isPrototypeOf')) {
-    return false;
-  } // Most likely a plain Object
+      const nextOpts = {
+        from,
+        to,
+        search,
+        params,
+        hash,
+        replace
+      };
+      const next = router.buildNext(nextOpts);
+      preload = (_preload = preload) != null ? _preload : router.options.defaultLinkPreload;
+      const preloadMaxAge = (_ref6 = (_ref7 = userPreloadMaxAge != null ? userPreloadMaxAge : router.options.defaultLinkPreloadMaxAge) != null ? _ref7 : router.options.defaultLoaderGcMaxAge) != null ? _ref6 : 0;
+      const preloadDelay = (_ref8 = userPreloadDelay != null ? userPreloadDelay : router.options.defaultLinkPreloadDelay) != null ? _ref8 : 0; // Compare path/hash for matches
 
+      const pathIsEqual = router.state.location.pathname === next.pathname;
+      const currentPathSplit = router.state.location.pathname.split('/');
+      const nextPathSplit = next.pathname.split('/');
+      const pathIsFuzzyEqual = nextPathSplit.every((d, i) => d === currentPathSplit[i]);
+      const hashIsEqual = router.state.location.hash === next.hash; // Combine the matches based on user options
 
-  return true;
-}
+      const pathTest = activeOptions != null && activeOptions.exact ? pathIsEqual : pathIsFuzzyEqual;
+      const hashTest = activeOptions != null && activeOptions.includeHash ? hashIsEqual : true; // The final "active" test
 
-function hasObjectPrototype(o) {
-  return Object.prototype.toString.call(o) === '[object Object]';
-}
+      const isActive = pathTest && hashTest; // The click handler
 
-const defaultParseSearch = parseSearchWith(JSON.parse);
-const defaultStringifySearch = stringifySearchWith(JSON.stringify);
-function parseSearchWith(parser) {
-  return searchStr => {
-    if (searchStr.substring(0, 1) === '?') {
-      searchStr = searchStr.substring(1);
-    }
+      const handleClick = e => {
+        if (!disabled && !isCtrlEvent(e) && !e.defaultPrevented && (!target || target === '_self') && e.button === 0) {
+          e.preventDefault();
 
-    let query = decode(searchStr); // Try to parse any query params that might be json
+          if (pathIsEqual && !search && !hash) {
+            router.invalidateRoute(nextOpts);
+          } // All is well? Navigate!)
 
-    for (let key in query) {
-      const value = query[key];
 
-      if (typeof value === 'string') {
-        try {
-          query[key] = parser(value);
-        } catch (err) {//
+          router._navigate(nextOpts);
         }
-      }
-    }
+      }; // The click handler
 
-    return query;
-  };
-}
-function stringifySearchWith(stringify) {
-  return search => {
-    search = _extends$1({}, search);
 
-    if (search) {
-      Object.keys(search).forEach(key => {
-        const val = search[key];
+      const handleFocus = e => {
+        if (preload && preloadMaxAge > 0) {
+          router.loadRoute(nextOpts, {
+            maxAge: preloadMaxAge
+          });
+        }
+      };
 
-        if (typeof val === 'undefined' || val === undefined) {
-          delete search[key];
-        } else if (val && typeof val === 'object' && val !== null) {
-          try {
-            search[key] = stringify(val);
-          } catch (err) {// silent
+      const handleEnter = e => {
+        const target = e.target || {};
+
+        if (preload && preloadMaxAge > 0) {
+          if (target.preloadTimeout) {
+            return;
           }
+
+          target.preloadTimeout = setTimeout(() => {
+            target.preloadTimeout = null;
+            router.loadRoute(nextOpts, {
+              maxAge: preloadMaxAge
+            });
+          }, preloadDelay);
         }
-      });
-    }
+      };
 
-    const searchStr = encode(search).toString();
-    return searchStr ? "?" + searchStr : '';
+      const handleLeave = e => {
+        const target = e.target || {};
+
+        if (target.preloadTimeout) {
+          clearTimeout(target.preloadTimeout);
+          target.preloadTimeout = null;
+        }
+      };
+
+      return {
+        type: 'internal',
+        next,
+        handleFocus,
+        handleClick,
+        handleEnter,
+        handleLeave,
+        isActive,
+        disabled
+      };
+    }
   };
+  router.location = router.parseLocation(history.location);
+  router.state.location = router.location;
+  router.update(userOptions); // Allow frameworks to hook into the router creation
+
+  router.options.createRouter == null ? void 0 : router.options.createRouter(router);
+  return router;
 }
 
 function isCtrlEvent(e) {
   return !!(e.metaKey || e.altKey || e.ctrlKey || e.shiftKey);
 }
 
-function last(arr) {
-  return arr[arr.length - 1];
-}
-
 const _excluded = ["type", "children", "target", "activeProps", "inactiveProps", "activeOptions", "disabled", "hash", "search", "params", "to", "preload", "preloadDelay", "preloadMaxAge", "replace", "style", "className", "onClick", "onFocus", "onMouseEnter", "onMouseLeave", "onTouchStart", "onTouchEnd"],
       _excluded2 = ["pending", "caseSensitive", "children"],
       _excluded3 = ["children", "router"];
@@ -2456,9 +2517,9 @@ function createReactRouter(opts) {
         }; // Get the active props
 
 
-        const resolvedActiveProps = isActive ? (_functionalUpdate = functionalUpdate(activeProps)) != null ? _functionalUpdate : {} : {}; // Get the inactive props
+        const resolvedActiveProps = isActive ? (_functionalUpdate = functionalUpdate(activeProps, {})) != null ? _functionalUpdate : {} : {}; // Get the inactive props
 
-        const resolvedInactiveProps = isActive ? {} : (_functionalUpdate2 = functionalUpdate(inactiveProps)) != null ? _functionalUpdate2 : {};
+        const resolvedInactiveProps = isActive ? {} : (_functionalUpdate2 = functionalUpdate(inactiveProps, {})) != null ? _functionalUpdate2 : {};
         return _extends$2({}, resolvedActiveProps, resolvedInactiveProps, rest, {
           href: disabled ? undefined : next.href,
           onClick: composeHandlers([handleClick, onClick]),
@@ -2496,7 +2557,7 @@ function createReactRouter(opts) {
         const params = route.matchRoute(rest, {
           pending,
           caseSensitive
-        }); // useRouterSubscription(router)
+        });
 
         if (!params) {
           return null;
@@ -2510,6 +2571,10 @@ function createReactRouter(opts) {
   const coreRouter = createRouter(_extends$2({}, opts, {
     createRouter: router => {
       const routerExt = {
+        useState: () => {
+          useRouterSubscription(router);
+          return router.state;
+        },
         useRoute: routeId => {
           const route = router.getRoute(routeId);
           useRouterSubscription(router);
@@ -2517,6 +2582,7 @@ function createReactRouter(opts) {
           return route;
         },
         useMatch: routeId => {
+          useRouterSubscription(router);
           invariant(routeId !== rootRouteId, "\"" + rootRouteId + "\" cannot be used with useMatch! Did you mean to useRoute(\"" + rootRouteId + "\")?");
 
           const runtimeMatch = _useMatch();
@@ -2524,7 +2590,6 @@ function createReactRouter(opts) {
           const match = router.state.matches.find(d => d.routeId === routeId);
           invariant(match, "Could not find a match for route \"" + routeId + "\" being rendered in this component!");
           invariant(runtimeMatch.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 '" + runtimeMatch.routeId + "' route. Did you mean to 'useRoute(" + (match == null ? void 0 : match.routeId) + ")' instead?");
-          useRouterSubscription(router);
 
           if (!match) {
             invariant('Match not found!');
@@ -2555,10 +2620,10 @@ function RouterProvider(_ref2) {
       rest = _objectWithoutPropertiesLoose(_ref2, _excluded3);
 
   router.update(rest);
-  useSyncExternalStore(cb => router.subscribe(() => cb()), () => router.state);
+  useRouterSubscription(router);
   useLayoutEffect(() => {
-    router.mount();
-  }, []);
+    return router.mount();
+  }, [router]);
   return /*#__PURE__*/React.createElement(routerContext.Provider, {
     value: {
       router
@@ -2595,14 +2660,15 @@ function _useMatch() {
 }
 
 function Outlet() {
-  var _ref3, _childMatch$options$c;
+  var _childMatch$options$c;
 
   const router = useRouter();
   const [, ...matches] = useMatches();
   const childMatch = matches[0];
   if (!childMatch) return null;
-  const element = (_ref3 = (() => {
-    var _childMatch$__$errorE, _ref5;
+
+  const element = (() => {
+    var _childMatch$__$errorE, _ref4;
 
     if (!childMatch) {
       return null;
@@ -2619,7 +2685,7 @@ function Outlet() {
         throw childMatch.error;
       }
 
-      return /*#__PURE__*/React.createElement(DefaultCatchBoundary, {
+      return /*#__PURE__*/React.createElement(DefaultErrorBoundary, {
         error: childMatch.error
       });
     }
@@ -2631,17 +2697,18 @@ function Outlet() {
         const pendingElement = (_childMatch$__$pendin = childMatch.__.pendingElement) != null ? _childMatch$__$pendin : router.options.defaultPendingElement;
 
         if (childMatch.options.pendingMs || pendingElement) {
-          var _ref4;
+          var _ref3;
 
-          return (_ref4 = pendingElement) != null ? _ref4 : null;
+          return (_ref3 = pendingElement) != null ? _ref3 : null;
         }
       }
 
       return null;
     }
 
-    return (_ref5 = childMatch.__.element) != null ? _ref5 : router.options.defaultElement;
-  })()) != null ? _ref3 : /*#__PURE__*/React.createElement(Outlet, null);
+    return (_ref4 = childMatch.__.element) != null ? _ref4 : router.options.defaultElement;
+  })();
+
   const catchElement = (_childMatch$options$c = childMatch == null ? void 0 : childMatch.options.catchElement) != null ? _childMatch$options$c : router.options.defaultCatchElement;
   return /*#__PURE__*/React.createElement(MatchesProvider, {
     value: matches,
@@ -2677,7 +2744,7 @@ class CatchBoundary extends React.Component {
   render() {
     var _this$props$catchElem;
 
-    const catchElement = (_this$props$catchElem = this.props.catchElement) != null ? _this$props$catchElem : DefaultCatchBoundary;
+    const catchElement = (_this$props$catchElem = this.props.catchElement) != null ? _this$props$catchElem : DefaultErrorBoundary;
 
     if (this.state.error) {
       return typeof catchElement === 'function' ? catchElement(this.state) : catchElement;
@@ -2688,10 +2755,10 @@ class CatchBoundary extends React.Component {
 
 }
 
-function DefaultCatchBoundary(_ref6) {
+function DefaultErrorBoundary(_ref5) {
   let {
     error
-  } = _ref6;
+  } = _ref5;
   return /*#__PURE__*/React.createElement("div", {
     style: {
       padding: '.5rem',
@@ -2725,7 +2792,7 @@ function DefaultCatchBoundary(_ref6) {
       opacity: 0.5
     }
   }, "If you are the owner of this website, it's highly recommended that you configure your own custom Catch/Error boundaries for the router. You can optionally configure a boundary for each route."));
-}
+} // TODO: Add prompt
 
-export { DefaultCatchBoundary, MatchesProvider, Outlet, RouterProvider, createBrowserHistory, createHashHistory, createMemoryHistory, createReactRouter, createRoute, createRouteConfig, createRouteMatch, createRouter, defaultParseSearch, defaultStringifySearch, functionalUpdate, invariant, last, matchByPath, matchPathname, parsePathname, parseSearchWith, replaceEqualDeep, _resolvePath as resolvePath, rootRouteId, stringifySearchWith, warning };
+export { DefaultErrorBoundary, MatchesProvider, Outlet, RouterProvider, cascadeLoaderData, cleanPath, createBrowserHistory, createHashHistory, createMemoryHistory, createReactRouter, createRoute, createRouteConfig, createRouteMatch, createRouter, decode, defaultParseSearch, defaultStringifySearch, encode, functionalUpdate, interpolatePath, invariant, joinPaths, last, matchByPath, matchPathname, parsePathname, parseSearchWith, replaceEqualDeep, resolvePath, rootRouteId, stringifySearchWith, trimPath, trimPathLeft, trimPathRight, warning };
 //# sourceMappingURL=index.js.map