@tanstack/react-router 0.0.1-beta.21 → 0.0.1-beta.210

package/build/cjs/RouterProvider.js

@@ -0,0 +1,1021 @@
+/**
+ * @tanstack/react-router/src/index.tsx
+ *
+ * Copyright (c) TanStack
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var history = require('@tanstack/history');
+var React = require('react');
+var invariant = require('tiny-invariant');
+var warning = require('tiny-warning');
+var Matches = require('./Matches.js');
+var path = require('./path.js');
+var redirects = require('./redirects.js');
+var router = require('./router.js');
+var utils = require('./utils.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var invariant__default = /*#__PURE__*/_interopDefaultLegacy(invariant);
+var warning__default = /*#__PURE__*/_interopDefaultLegacy(warning);
+
+const routerContext = /*#__PURE__*/React__namespace.createContext(null);
+if (typeof document !== 'undefined') {
+  window.__TSR_ROUTER_CONTEXT__ = routerContext;
+}
+const preloadWarning = 'Error preloading route! ☝️';
+function isCtrlEvent(e) {
+  return !!(e.metaKey || e.altKey || e.ctrlKey || e.shiftKey);
+}
+class SearchParamError extends Error {}
+class PathParamError extends Error {}
+function getInitialRouterState(location) {
+  return {
+    status: 'idle',
+    resolvedLocation: undefined,
+    location: location,
+    matches: [],
+    pendingMatches: [],
+    lastUpdated: Date.now()
+  };
+}
+function RouterProvider({
+  router: router$1,
+  ...rest
+}) {
+  const options = {
+    ...router$1.options,
+    ...rest,
+    context: {
+      ...router$1.options.context,
+      ...rest?.context
+    }
+  };
+  const history$1 = React__namespace.useState(() => options.history ?? history.createBrowserHistory())[0];
+  const tempLocationKeyRef = React__namespace.useRef(`${Math.round(Math.random() * 10000000)}`);
+  const resetNextScrollRef = React__namespace.useRef(false);
+  const navigateTimeoutRef = React__namespace.useRef(null);
+  const latestLoadPromiseRef = React__namespace.useRef(Promise.resolve());
+  const checkLatest = promise => {
+    return latestLoadPromiseRef.current !== promise ? latestLoadPromiseRef.current : undefined;
+  };
+  const parseLocation = utils.useStableCallback(previousLocation => {
+    const parse = ({
+      pathname,
+      search,
+      hash,
+      state
+    }) => {
+      const parsedSearch = options.parseSearch(search);
+      return {
+        pathname: pathname,
+        searchStr: search,
+        search: utils.replaceEqualDeep(previousLocation?.search, parsedSearch),
+        hash: hash.split('#').reverse()[0] ?? '',
+        href: `${pathname}${search}${hash}`,
+        state: utils.replaceEqualDeep(previousLocation?.state, state)
+      };
+    };
+    const location = parse(history$1.location);
+    let {
+      __tempLocation,
+      __tempKey
+    } = location.state;
+    if (__tempLocation && (!__tempKey || __tempKey === tempLocationKeyRef.current)) {
+      // Sync up the location keys
+      const parsedTempLocation = parse(__tempLocation);
+      parsedTempLocation.state.key = location.state.key;
+      delete parsedTempLocation.state.__tempLocation;
+      return {
+        ...parsedTempLocation,
+        maskedLocation: location
+      };
+    }
+    return location;
+  });
+  const [preState, setState] = React__namespace.useState(() => getInitialRouterState(parseLocation()));
+  const [isTransitioning, startReactTransition] = React__namespace.useTransition();
+  const state = React__namespace.useMemo(() => ({
+    ...preState,
+    status: isTransitioning ? 'pending' : 'idle'
+  }), [preState, isTransitioning]);
+  React__namespace.useLayoutEffect(() => {
+    if (!isTransitioning && state.resolvedLocation !== state.location) {
+      setState(s => ({
+        ...s,
+        resolvedLocation: s.location
+      }));
+    }
+  });
+  const basepath = `/${path.trimPath(options.basepath ?? '') ?? ''}`;
+  const resolvePathWithBase = utils.useStableCallback((from, path$1) => {
+    return path.resolvePath(basepath, from, path.cleanPath(path$1));
+  });
+  const [routesById, routesByPath] = React__namespace.useMemo(() => {
+    const routesById = {};
+    const routesByPath = {};
+    const recurseRoutes = routes => {
+      routes.forEach((route, i) => {
+        route.init({
+          originalIndex: i
+        });
+        const existingRoute = routesById[route.id];
+        invariant__default["default"](!existingRoute, `Duplicate routes found with id: ${String(route.id)}`);
+        routesById[route.id] = route;
+        if (!route.isRoot && route.path) {
+          const trimmedFullPath = path.trimPathRight(route.fullPath);
+          if (!routesByPath[trimmedFullPath] || route.fullPath.endsWith('/')) {
+            routesByPath[trimmedFullPath] = route;
+          }
+        }
+        const children = route.children;
+        if (children?.length) {
+          recurseRoutes(children);
+        }
+      });
+    };
+    recurseRoutes([router$1.routeTree]);
+    return [routesById, routesByPath];
+  }, []);
+  const looseRoutesById = routesById;
+  const flatRoutes = React__namespace.useMemo(() => Object.values(routesByPath).map((d, i) => {
+    const trimmed = path.trimPath(d.fullPath);
+    const parsed = path.parsePathname(trimmed);
+    while (parsed.length > 1 && parsed[0]?.value === '/') {
+      parsed.shift();
+    }
+    const score = parsed.map(d => {
+      if (d.type === 'param') {
+        return 0.5;
+      }
+      if (d.type === 'wildcard') {
+        return 0.25;
+      }
+      return 1;
+    });
+    return {
+      child: d,
+      trimmed,
+      parsed,
+      index: i,
+      score
+    };
+  }).sort((a, b) => {
+    let isIndex = a.trimmed === '/' ? 1 : b.trimmed === '/' ? -1 : 0;
+    if (isIndex !== 0) return isIndex;
+    const length = Math.min(a.score.length, b.score.length);
+
+    // Sort by length of score
+    if (a.score.length !== b.score.length) {
+      return b.score.length - a.score.length;
+    }
+
+    // Sort by min available score
+    for (let i = 0; i < length; i++) {
+      if (a.score[i] !== b.score[i]) {
+        return b.score[i] - a.score[i];
+      }
+    }
+
+    // Sort by min available parsed value
+    for (let i = 0; i < length; i++) {
+      if (a.parsed[i].value !== b.parsed[i].value) {
+        return a.parsed[i].value > b.parsed[i].value ? 1 : -1;
+      }
+    }
+
+    // Sort by length of trimmed full path
+    if (a.trimmed !== b.trimmed) {
+      return a.trimmed > b.trimmed ? 1 : -1;
+    }
+
+    // Sort by original index
+    return a.index - b.index;
+  }).map((d, i) => {
+    d.child.rank = i;
+    return d.child;
+  }), [routesByPath]);
+  const matchRoutes = utils.useStableCallback((pathname, locationSearch, opts) => {
+    let routeParams = {};
+    let foundRoute = flatRoutes.find(route => {
+      const matchedParams = path.matchPathname(basepath, path.trimPathRight(pathname), {
+        to: route.fullPath,
+        caseSensitive: route.options.caseSensitive ?? options.caseSensitive,
+        fuzzy: false
+      });
+      if (matchedParams) {
+        routeParams = matchedParams;
+        return true;
+      }
+      return false;
+    });
+    let routeCursor = foundRoute || routesById['__root__'];
+    let matchedRoutes = [routeCursor];
+    // let includingLayouts = true
+    while (routeCursor?.parentRoute) {
+      routeCursor = routeCursor.parentRoute;
+      if (routeCursor) matchedRoutes.unshift(routeCursor);
+    }
+
+    // Existing matches are matches that are already loaded along with
+    // pending matches that are still loading
+
+    const parseErrors = matchedRoutes.map(route => {
+      let parsedParamsError;
+      if (route.options.parseParams) {
+        try {
+          const parsedParams = route.options.parseParams(routeParams);
+          // Add the parsed params to the accumulated params bag
+          Object.assign(routeParams, parsedParams);
+        } catch (err) {
+          parsedParamsError = new PathParamError(err.message, {
+            cause: err
+          });
+          if (opts?.throwOnError) {
+            throw parsedParamsError;
+          }
+          return parsedParamsError;
+        }
+      }
+      return;
+    });
+    const matches = matchedRoutes.map((route, index) => {
+      const interpolatedPath = path.interpolatePath(route.path, routeParams);
+      const matchId = path.interpolatePath(route.id, routeParams, true);
+
+      // Waste not, want not. If we already have a match for this route,
+      // reuse it. This is important for layout routes, which might stick
+      // around between navigation actions that only change leaf routes.
+      const existingMatch = getRouteMatch(state, matchId);
+      if (existingMatch) {
+        return {
+          ...existingMatch
+        };
+      }
+
+      // Create a fresh route match
+      const hasLoaders = !!(route.options.load || router.componentTypes.some(d => route.options[d]?.preload));
+      const routeMatch = {
+        id: matchId,
+        routeId: route.id,
+        params: routeParams,
+        pathname: path.joinPaths([basepath, interpolatedPath]),
+        updatedAt: Date.now(),
+        routeSearch: {},
+        search: {},
+        status: hasLoaders ? 'pending' : 'success',
+        isFetching: false,
+        invalid: false,
+        error: undefined,
+        paramsError: parseErrors[index],
+        searchError: undefined,
+        loadPromise: Promise.resolve(),
+        context: undefined,
+        abortController: new AbortController(),
+        fetchedAt: 0
+      };
+      return routeMatch;
+    });
+
+    // Take each match and resolve its search params and context
+    // This has to happen after the matches are created or found
+    // so that we can use the parent match's search params and context
+    matches.forEach((match, i) => {
+      const parentMatch = matches[i - 1];
+      const route = looseRoutesById[match.routeId];
+      const searchInfo = (() => {
+        // Validate the search params and stabilize them
+        const parentSearchInfo = {
+          search: parentMatch?.search ?? locationSearch,
+          routeSearch: parentMatch?.routeSearch ?? locationSearch
+        };
+        try {
+          const validator = typeof route.options.validateSearch === 'object' ? route.options.validateSearch.parse : route.options.validateSearch;
+          let routeSearch = validator?.(parentSearchInfo.search) ?? {};
+          let search = {
+            ...parentSearchInfo.search,
+            ...routeSearch
+          };
+          routeSearch = utils.replaceEqualDeep(match.routeSearch, routeSearch);
+          search = utils.replaceEqualDeep(match.search, search);
+          return {
+            routeSearch,
+            search,
+            searchDidChange: match.routeSearch !== routeSearch
+          };
+        } catch (err) {
+          match.searchError = new SearchParamError(err.message, {
+            cause: err
+          });
+          if (opts?.throwOnError) {
+            throw match.searchError;
+          }
+          return parentSearchInfo;
+        }
+      })();
+      Object.assign(match, searchInfo);
+    });
+    return matches;
+  });
+  const cancelMatch = utils.useStableCallback(id => {
+    getRouteMatch(state, id)?.abortController?.abort();
+  });
+  const cancelMatches = utils.useStableCallback(state => {
+    state.matches.forEach(match => {
+      cancelMatch(match.id);
+    });
+  });
+  const buildLocation = utils.useStableCallback(opts => {
+    const build = (dest = {}, matches) => {
+      const from = latestLocationRef.current;
+      const fromPathname = dest.from ?? from.pathname;
+      let pathname = resolvePathWithBase(fromPathname, `${dest.to ?? ''}`);
+      const fromMatches = matchRoutes(fromPathname, from.search);
+      const stayingMatches = matches?.filter(d => fromMatches?.find(e => e.routeId === d.routeId));
+      const prevParams = {
+        ...utils.last(fromMatches)?.params
+      };
+      let nextParams = (dest.params ?? true) === true ? prevParams : utils.functionalUpdate(dest.params, prevParams);
+      if (nextParams) {
+        matches?.map(d => looseRoutesById[d.routeId].options.stringifyParams).filter(Boolean).forEach(fn => {
+          nextParams = {
+            ...nextParams,
+            ...fn(nextParams)
+          };
+        });
+      }
+      pathname = path.interpolatePath(pathname, nextParams ?? {});
+      const preSearchFilters = stayingMatches?.map(match => looseRoutesById[match.routeId].options.preSearchFilters ?? []).flat().filter(Boolean) ?? [];
+      const postSearchFilters = stayingMatches?.map(match => looseRoutesById[match.routeId].options.postSearchFilters ?? []).flat().filter(Boolean) ?? [];
+
+      // Pre filters first
+      const preFilteredSearch = preSearchFilters?.length ? preSearchFilters?.reduce((prev, next) => next(prev), from.search) : from.search;
+
+      // Then the link/navigate function
+      const destSearch = dest.search === true ? preFilteredSearch // Preserve resolvedFrom true
+      : dest.search ? utils.functionalUpdate(dest.search, preFilteredSearch) ?? {} // Updater
+      : preSearchFilters?.length ? preFilteredSearch // Preserve resolvedFrom filters
+      : {};
+
+      // Then post filters
+      const postFilteredSearch = postSearchFilters?.length ? postSearchFilters.reduce((prev, next) => next(prev), destSearch) : destSearch;
+      const search = utils.replaceEqualDeep(from.search, postFilteredSearch);
+      const searchStr = options.stringifySearch(search);
+      const hash = dest.hash === true ? from.hash : dest.hash ? utils.functionalUpdate(dest.hash, from.hash) : from.hash;
+      const hashStr = hash ? `#${hash}` : '';
+      let nextState = dest.state === true ? from.state : dest.state ? utils.functionalUpdate(dest.state, from.state) : from.state;
+      nextState = utils.replaceEqualDeep(from.state, nextState);
+      return {
+        pathname,
+        search,
+        searchStr,
+        state: nextState,
+        hash,
+        href: history$1.createHref(`${pathname}${searchStr}${hashStr}`),
+        unmaskOnReload: dest.unmaskOnReload
+      };
+    };
+    const buildWithMatches = (dest = {}, maskedDest) => {
+      let next = build(dest);
+      let maskedNext = maskedDest ? build(maskedDest) : undefined;
+      if (!maskedNext) {
+        let params = {};
+        let foundMask = options.routeMasks?.find(d => {
+          const match = path.matchPathname(basepath, next.pathname, {
+            to: d.from,
+            caseSensitive: false,
+            fuzzy: false
+          });
+          if (match) {
+            params = match;
+            return true;
+          }
+          return false;
+        });
+        if (foundMask) {
+          foundMask = {
+            ...foundMask,
+            from: path.interpolatePath(foundMask.from, params)
+          };
+          maskedDest = foundMask;
+          maskedNext = build(maskedDest);
+        }
+      }
+      const nextMatches = matchRoutes(next.pathname, next.search);
+      const maskedMatches = maskedNext ? matchRoutes(maskedNext.pathname, maskedNext.search) : undefined;
+      const maskedFinal = maskedNext ? build(maskedDest, maskedMatches) : undefined;
+      const final = build(dest, nextMatches);
+      if (maskedFinal) {
+        final.maskedLocation = maskedFinal;
+      }
+      return final;
+    };
+    if (opts.mask) {
+      return buildWithMatches(opts, {
+        ...utils.pick(opts, ['from']),
+        ...opts.mask
+      });
+    }
+    return buildWithMatches(opts);
+  });
+  const commitLocation = utils.useStableCallback(async ({
+    startTransition,
+    ...next
+  }) => {
+    if (navigateTimeoutRef.current) clearTimeout(navigateTimeoutRef.current);
+    const isSameUrl = latestLocationRef.current.href === next.href;
+
+    // If the next urls are the same and we're not replacing,
+    // do nothing
+    if (!isSameUrl || !next.replace) {
+      let {
+        maskedLocation,
+        ...nextHistory
+      } = next;
+      if (maskedLocation) {
+        nextHistory = {
+          ...maskedLocation,
+          state: {
+            ...maskedLocation.state,
+            __tempKey: undefined,
+            __tempLocation: {
+              ...nextHistory,
+              search: nextHistory.searchStr,
+              state: {
+                ...nextHistory.state,
+                __tempKey: undefined,
+                __tempLocation: undefined,
+                key: undefined
+              }
+            }
+          }
+        };
+        if (nextHistory.unmaskOnReload ?? options.unmaskOnReload ?? false) {
+          nextHistory.state.__tempKey = tempLocationKeyRef.current;
+        }
+      }
+      const apply = () => {
+        history$1[next.replace ? 'replace' : 'push'](nextHistory.href, nextHistory.state);
+      };
+      if (startTransition ?? true) {
+        startReactTransition(apply);
+      } else {
+        apply();
+      }
+    }
+    resetNextScrollRef.current = next.resetScroll ?? true;
+    return latestLoadPromiseRef.current;
+  });
+  const buildAndCommitLocation = utils.useStableCallback(({
+    replace,
+    resetScroll,
+    startTransition,
+    ...rest
+  } = {}) => {
+    const location = buildLocation(rest);
+    return commitLocation({
+      ...location,
+      startTransition,
+      replace,
+      resetScroll
+    });
+  });
+  const navigate = utils.useStableCallback(({
+    from,
+    to = '',
+    ...rest
+  }) => {
+    // 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 = typeof from === 'undefined' ? from : String(from);
+    let isExternal;
+    try {
+      new URL(`${toString}`);
+      isExternal = true;
+    } catch (e) {}
+    invariant__default["default"](!isExternal, 'Attempting to navigate to external url with this.navigate!');
+    return buildAndCommitLocation({
+      ...rest,
+      from: fromString,
+      to: toString
+    });
+  });
+  const loadMatches = utils.useStableCallback(async ({
+    checkLatest,
+    matches,
+    preload
+  }) => {
+    let latestPromise;
+    let firstBadMatchIndex;
+
+    // Check each match middleware to see if the route can be accessed
+    try {
+      for (let [index, match] of matches.entries()) {
+        const parentMatch = matches[index - 1];
+        const route = looseRoutesById[match.routeId];
+        const handleError = (err, code) => {
+          err.routerCode = code;
+          firstBadMatchIndex = firstBadMatchIndex ?? index;
+          if (redirects.isRedirect(err)) {
+            throw err;
+          }
+          try {
+            route.options.onError?.(err);
+          } catch (errorHandlerErr) {
+            err = errorHandlerErr;
+            if (redirects.isRedirect(errorHandlerErr)) {
+              throw errorHandlerErr;
+            }
+          }
+          matches[index] = match = {
+            ...match,
+            error: err,
+            status: 'error',
+            updatedAt: Date.now()
+          };
+        };
+        try {
+          if (match.paramsError) {
+            handleError(match.paramsError, 'PARSE_PARAMS');
+          }
+          if (match.searchError) {
+            handleError(match.searchError, 'VALIDATE_SEARCH');
+          }
+          const parentContext = parentMatch?.context ?? options.context ?? {};
+          const beforeLoadContext = (await route.options.beforeLoad?.({
+            search: match.search,
+            abortController: match.abortController,
+            params: match.params,
+            preload: !!preload,
+            context: parentContext,
+            location: state.location,
+            // TODO: This might need to be latestLocationRef.current...?
+            navigate: opts => navigate({
+              ...opts,
+              from: match.pathname
+            }),
+            buildLocation
+          })) ?? {};
+          const context = {
+            ...parentContext,
+            ...beforeLoadContext
+          };
+          matches[index] = match = {
+            ...match,
+            context: utils.replaceEqualDeep(match.context, context)
+          };
+        } catch (err) {
+          handleError(err, 'BEFORE_LOAD');
+          break;
+        }
+      }
+    } catch (err) {
+      if (redirects.isRedirect(err)) {
+        if (!preload) navigate(err);
+        return matches;
+      }
+      throw err;
+    }
+    const validResolvedMatches = matches.slice(0, firstBadMatchIndex);
+    const matchPromises = [];
+    validResolvedMatches.forEach((match, index) => {
+      matchPromises.push((async () => {
+        const parentMatchPromise = matchPromises[index - 1];
+        const route = looseRoutesById[match.routeId];
+        if (match.isFetching) {
+          return getRouteMatch(state, match.id)?.loadPromise;
+        }
+        const handleIfRedirect = err => {
+          if (redirects.isRedirect(err)) {
+            if (!preload) {
+              navigate(err);
+            }
+            return true;
+          }
+          return false;
+        };
+        const load = async () => {
+          try {
+            const componentsPromise = Promise.all(router.componentTypes.map(async type => {
+              const component = route.options[type];
+              if (component?.preload) {
+                await component.preload();
+              }
+            }));
+            const loaderPromise = route.options.load?.({
+              params: match.params,
+              search: match.search,
+              preload: !!preload,
+              parentMatchPromise,
+              abortController: match.abortController,
+              context: match.context,
+              location: state.location,
+              navigate: opts => navigate({
+                ...opts,
+                from: match.pathname
+              })
+            });
+            const [_, loaderContext] = await Promise.all([componentsPromise, loaderPromise]);
+            if (latestPromise = checkLatest()) return await latestPromise;
+            matches[index] = match = {
+              ...match,
+              error: undefined,
+              status: 'success',
+              isFetching: false,
+              updatedAt: Date.now()
+            };
+          } catch (error) {
+            if (latestPromise = checkLatest()) return await latestPromise;
+            if (handleIfRedirect(error)) return;
+            try {
+              route.options.onError?.(error);
+            } catch (onErrorError) {
+              error = onErrorError;
+              if (handleIfRedirect(onErrorError)) return;
+            }
+            matches[index] = match = {
+              ...match,
+              error,
+              status: 'error',
+              isFetching: false,
+              updatedAt: Date.now()
+            };
+          }
+          if (!preload) {
+            setState(s => ({
+              ...s,
+              matches: s.matches.map(d => d.id === match.id ? match : d)
+            }));
+          }
+        };
+        let loadPromise;
+        matches[index] = match = {
+          ...match,
+          isFetching: true,
+          fetchedAt: Date.now(),
+          invalid: false
+        };
+        loadPromise = load();
+        matches[index] = match = {
+          ...match,
+          loadPromise
+        };
+        await loadPromise;
+      })());
+    });
+    await Promise.all(matchPromises);
+    return matches;
+  });
+  const load = utils.useStableCallback(async () => {
+    const promise = new Promise(async (resolve, reject) => {
+      const next = latestLocationRef.current;
+      const prevLocation = state.resolvedLocation || state.location;
+      const pathDidChange = !!(next && prevLocation.href !== next.href);
+      let latestPromise;
+
+      // Cancel any pending matches
+      cancelMatches(state);
+      router$1.emit({
+        type: 'onBeforeLoad',
+        from: prevLocation,
+        to: next ?? state.location,
+        pathChanged: pathDidChange
+      });
+
+      // Match the routes
+      let matches = matchRoutes(next.pathname, next.search, {
+        debug: true
+      });
+
+      // Ingest the new matches
+      setState(s => ({
+        ...s,
+        matches
+      }));
+      try {
+        try {
+          // Load the matches
+          await loadMatches({
+            matches,
+            checkLatest: () => checkLatest(promise)
+          });
+        } catch (err) {
+          // swallow this error, since we'll display the
+          // errors on the route components
+        }
+
+        // Only apply the latest transition
+        if (latestPromise = checkLatest(promise)) {
+          return latestPromise;
+        }
+
+        // TODO:
+        // const exitingMatchIds = previousMatches.filter(
+        //   (id) => !state.pendingMatches.includes(id),
+        // )
+        // const enteringMatchIds = state.pendingMatches.filter(
+        //   (id) => !previousMatches.includes(id),
+        // )
+        // const stayingMatchIds = previousMatches.filter((id) =>
+        //   state.pendingMatches.includes(id),
+        // )
+
+        // setState((s) => ({
+        //   ...s,
+        //   status: 'idle',
+        //   resolvedLocation: s.location,
+        // }))
+
+        // TODO:
+        // ;(
+        //   [
+        //     [exitingMatchIds, 'onLeave'],
+        //     [enteringMatchIds, 'onEnter'],
+        //     [stayingMatchIds, 'onTransition'],
+        //   ] as const
+        // ).forEach(([matches, hook]) => {
+        //   matches.forEach((match) => {
+        //     const route = this.getRoute(match.routeId)
+        //     route.options[hook]?.(match)
+        //   })
+        // })
+        router$1.emit({
+          type: 'onLoad',
+          from: prevLocation,
+          to: next,
+          pathChanged: pathDidChange
+        });
+        resolve();
+      } catch (err) {
+        // Only apply the latest transition
+        if (latestPromise = checkLatest(promise)) {
+          return latestPromise;
+        }
+        reject(err);
+      }
+    });
+    latestLoadPromiseRef.current = promise;
+    return latestLoadPromiseRef.current;
+  });
+  const preloadRoute = utils.useStableCallback(async (navigateOpts = state.location) => {
+    let next = buildLocation(navigateOpts);
+    let matches = matchRoutes(next.pathname, next.search, {
+      throwOnError: true
+    });
+    await loadMatches({
+      matches,
+      preload: true,
+      checkLatest: () => undefined
+    });
+    return [utils.last(matches), matches];
+  });
+  const buildLink = utils.useStableCallback(dest => {
+    // 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 {
+      to,
+      preload: userPreload,
+      preloadDelay: userPreloadDelay,
+      activeOptions,
+      disabled,
+      target,
+      replace,
+      resetScroll,
+      startTransition
+    } = dest;
+    try {
+      new URL(`${to}`);
+      return {
+        type: 'external',
+        href: to
+      };
+    } catch (e) {}
+    const nextOpts = dest;
+    const next = buildLocation(nextOpts);
+    const preload = userPreload ?? options.defaultPreload;
+    const preloadDelay = userPreloadDelay ?? options.defaultPreloadDelay ?? 0;
+
+    // Compare path/hash for matches
+    const currentPathSplit = latestLocationRef.current.pathname.split('/');
+    const nextPathSplit = next.pathname.split('/');
+    const pathIsFuzzyEqual = nextPathSplit.every((d, i) => d === currentPathSplit[i]);
+    // Combine the matches based on user options
+    const pathTest = activeOptions?.exact ? latestLocationRef.current.pathname === next.pathname : pathIsFuzzyEqual;
+    const hashTest = activeOptions?.includeHash ? latestLocationRef.current.hash === next.hash : true;
+    const searchTest = activeOptions?.includeSearch ?? true ? utils.partialDeepEqual(latestLocationRef.current.search, next.search) : true;
+
+    // The final "active" test
+    const isActive = pathTest && hashTest && searchTest;
+
+    // The click handler
+    const handleClick = e => {
+      if (!disabled && !isCtrlEvent(e) && !e.defaultPrevented && (!target || target === '_self') && e.button === 0) {
+        e.preventDefault();
+
+        // All is well? Navigate!
+        commitLocation({
+          ...next,
+          replace,
+          resetScroll,
+          startTransition
+        });
+      }
+    };
+
+    // The click handler
+    const handleFocus = e => {
+      if (preload) {
+        preloadRoute(nextOpts).catch(err => {
+          console.warn(err);
+          console.warn(preloadWarning);
+        });
+      }
+    };
+    const handleTouchStart = e => {
+      preloadRoute(nextOpts).catch(err => {
+        console.warn(err);
+        console.warn(preloadWarning);
+      });
+    };
+    const handleEnter = e => {
+      const target = e.target || {};
+      if (preload) {
+        if (target.preloadTimeout) {
+          return;
+        }
+        target.preloadTimeout = setTimeout(() => {
+          target.preloadTimeout = null;
+          preloadRoute(nextOpts).catch(err => {
+            console.warn(err);
+            console.warn(preloadWarning);
+          });
+        }, preloadDelay);
+      }
+    };
+    const handleLeave = e => {
+      const target = e.target || {};
+      if (target.preloadTimeout) {
+        clearTimeout(target.preloadTimeout);
+        target.preloadTimeout = null;
+      }
+    };
+    return {
+      type: 'internal',
+      next,
+      handleFocus,
+      handleClick,
+      handleEnter,
+      handleLeave,
+      handleTouchStart,
+      isActive,
+      disabled
+    };
+  });
+  const latestLocationRef = React__namespace.useRef(state.location);
+  React__namespace.useLayoutEffect(() => {
+    const unsub = history$1.subscribe(() => {
+      latestLocationRef.current = parseLocation(latestLocationRef.current);
+      setState(s => ({
+        ...s,
+        status: 'pending'
+      }));
+      if (state.location !== latestLocationRef.current) {
+        try {
+          load();
+        } catch (err) {
+          console.error(err);
+        }
+      }
+    });
+    const nextLocation = buildLocation({
+      search: true,
+      params: true,
+      hash: true,
+      state: true
+    });
+    if (state.location.href !== nextLocation.href) {
+      commitLocation({
+        ...nextLocation,
+        replace: true
+      });
+    }
+    return () => {
+      unsub();
+    };
+  }, [history$1]);
+  const initialLoad = React__namespace.useRef(true);
+  if (initialLoad.current) {
+    initialLoad.current = false;
+    startReactTransition(() => {
+      try {
+        load();
+      } catch (err) {
+        console.error(err);
+      }
+    });
+  }
+  const matchRoute = utils.useStableCallback((location, opts) => {
+    location = {
+      ...location,
+      to: location.to ? resolvePathWithBase(location.from || '', location.to) : undefined
+    };
+    const next = buildLocation(location);
+    if (opts?.pending && state.status !== 'pending') {
+      return false;
+    }
+    const baseLocation = opts?.pending ? latestLocationRef.current : state.resolvedLocation;
+
+    // const baseLocation = state.resolvedLocation
+
+    if (!baseLocation) {
+      return false;
+    }
+    const match = path.matchPathname(basepath, baseLocation.pathname, {
+      ...opts,
+      to: next.pathname
+    });
+    if (!match) {
+      return false;
+    }
+    if (match && (opts?.includeSearch ?? true)) {
+      return utils.partialDeepEqual(baseLocation.search, next.search) ? match : false;
+    }
+    return match;
+  });
+  const routerContextValue = {
+    routeTree: router$1.routeTree,
+    navigate,
+    buildLink,
+    state,
+    matchRoute,
+    routesById,
+    options,
+    history: history$1,
+    load,
+    buildLocation
+  };
+  return /*#__PURE__*/React__namespace.createElement(routerContext.Provider, {
+    value: routerContextValue
+  }, /*#__PURE__*/React__namespace.createElement(Matches.Matches, null));
+}
+function getRouteMatch(state, id) {
+  return [...state.pendingMatches, ...state.matches].find(d => d.id === id);
+}
+function useRouterState(opts) {
+  const {
+    state
+  } = useRouter();
+  // return useStore(router.__store, opts?.select as any)
+  return opts?.select ? opts.select(state) : state;
+}
+function useRouter() {
+  const resolvedContext = window.__TSR_ROUTER_CONTEXT__ || routerContext;
+  const value = React__namespace.useContext(resolvedContext);
+  warning__default["default"](value, 'useRouter must be used inside a <RouterProvider> component!');
+  return value;
+}
+
+exports.PathParamError = PathParamError;
+exports.RouterProvider = RouterProvider;
+exports.SearchParamError = SearchParamError;
+exports.getInitialRouterState = getInitialRouterState;
+exports.getRouteMatch = getRouteMatch;
+exports.routerContext = routerContext;
+exports.useRouter = useRouter;
+exports.useRouterState = useRouterState;
+//# sourceMappingURL=RouterProvider.js.map