@tanstack/react-router 0.0.1-beta.230 → 0.0.1-beta.232

package/build/cjs/scroll-restoration.js.map

@@ -1 +1 @@
-{"version":3,"file":"scroll-restoration.js","sources":["../../src/scroll-restoration.tsx"],"sourcesContent":["import * as React from 'react'\n\nconst useLayoutEffect =\n  typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nimport { ParsedLocation } from './location'\nimport { useRouter } from './RouterProvider'\nimport { NonNullableUpdater, functionalUpdate } from './utils'\n\nconst windowKey = 'window'\nconst delimiter = '___'\n\nlet weakScrolledElements = new WeakSet<any>()\n\ntype CacheValue = Record<string, { scrollX: number; scrollY: number }>\ntype CacheState = {\n  cached: CacheValue\n  next: CacheValue\n}\n\ntype Cache = {\n  state: CacheState\n  set: (updater: NonNullableUpdater<CacheState>) => void\n}\n\nlet cache: Cache\n\nconst sessionsStorage = typeof window !== 'undefined' && window.sessionStorage\n\nexport type ScrollRestorationOptions = {\n  getKey?: (location: ParsedLocation) => string\n}\n\nconst defaultGetKey = (location: ParsedLocation) => location.state.key!\n\nexport function useScrollRestoration(options?: ScrollRestorationOptions) {\n  const router = useRouter()\n\n  useLayoutEffect(() => {\n    const getKey = options?.getKey || defaultGetKey\n\n    if (sessionsStorage) {\n      if (!cache) {\n        cache = (() => {\n          const storageKey = 'tsr-scroll-restoration-v2'\n\n          const state: CacheState = JSON.parse(\n            window.sessionStorage.getItem(storageKey) || 'null',\n          ) || { cached: {}, next: {} }\n\n          return {\n            state,\n            set: (updater) => {\n              cache.state = functionalUpdate(updater, cache.state)\n              window.sessionStorage.setItem(\n                storageKey,\n                JSON.stringify(cache.state),\n              )\n            },\n          }\n        })()\n      }\n    }\n\n    const { history } = window\n    if (history.scrollRestoration) {\n      history.scrollRestoration = 'manual'\n    }\n\n    const onScroll = (event: Event) => {\n      if (weakScrolledElements.has(event.target)) return\n      weakScrolledElements.add(event.target)\n\n      const elementSelector =\n        event.target === document || event.target === window\n          ? windowKey\n          : getCssSelector(event.target)\n\n      if (!cache.state.next[elementSelector]) {\n        cache.set((c) => ({\n          ...c,\n          next: {\n            ...c.next,\n            [elementSelector]: {\n              scrollX: NaN,\n              scrollY: NaN,\n            },\n          },\n        }))\n      }\n    }\n\n    const getCssSelector = (el: any): string => {\n      let path = [],\n        parent\n      while ((parent = el.parentNode)) {\n        path.unshift(\n          `${el.tagName}:nth-child(${\n            ([].indexOf as any).call(parent.children, el) + 1\n          })`,\n        )\n        el = parent\n      }\n      return `${path.join(' > ')}`.toLowerCase()\n    }\n\n    if (typeof document !== 'undefined') {\n      document.addEventListener('scroll', onScroll, true)\n    }\n\n    const unsubOnBeforeLoad = router.subscribe('onBeforeLoad', (event) => {\n      if (event.pathChanged) {\n        const restoreKey = getKey(event.fromLocation)\n        for (const elementSelector in cache.state.next) {\n          const entry = cache.state.next[elementSelector]!\n          if (elementSelector === windowKey) {\n            entry.scrollX = window.scrollX || 0\n            entry.scrollY = window.scrollY || 0\n          } else if (elementSelector) {\n            const element = document.querySelector(elementSelector)\n            entry.scrollX = element?.scrollLeft || 0\n            entry.scrollY = element?.scrollTop || 0\n          }\n\n          cache.set((c) => {\n            const next = { ...c.next }\n            delete next[elementSelector]\n\n            return {\n              ...c,\n              next,\n              cached: {\n                ...c.cached,\n                [[restoreKey, elementSelector].join(delimiter)]: entry,\n              },\n            }\n          })\n        }\n      }\n    })\n\n    const unsubOnResolved = router.subscribe('onResolved', (event) => {\n      if (event.pathChanged) {\n        if (!router.resetNextScroll) {\n          return\n        }\n\n        router.resetNextScroll = true\n\n        const getKey = options?.getKey || defaultGetKey\n\n        const restoreKey = getKey(event.toLocation)\n        let windowRestored = false\n\n        for (const cacheKey in cache.state.cached) {\n          const entry = cache.state.cached[cacheKey]!\n          const [key, elementSelector] = cacheKey.split(delimiter)\n          if (key === restoreKey) {\n            if (elementSelector === windowKey) {\n              windowRestored = true\n              window.scrollTo(entry.scrollX, entry.scrollY)\n            } else if (elementSelector) {\n              const element = document.querySelector(elementSelector)\n              if (element) {\n                element.scrollLeft = entry.scrollX\n                element.scrollTop = entry.scrollY\n              }\n            }\n          }\n        }\n\n        if (!windowRestored) {\n          window.scrollTo(0, 0)\n        }\n\n        cache.set((c) => ({ ...c, next: {} }))\n        weakScrolledElements = new WeakSet<any>()\n      }\n    })\n\n    return () => {\n      document.removeEventListener('scroll', onScroll)\n      unsubOnBeforeLoad()\n      unsubOnResolved()\n    }\n  }, [])\n}\n\nexport function ScrollRestoration(props: ScrollRestorationOptions) {\n  useScrollRestoration(props)\n  return null\n}\n"],"names":["useLayoutEffect","window","React","useEffect","windowKey","delimiter","weakScrolledElements","WeakSet","cache","sessionsStorage","sessionStorage","defaultGetKey","location","state","key","useScrollRestoration","options","router","useRouter","getKey","storageKey","JSON","parse","getItem","cached","next","set","updater","functionalUpdate","setItem","stringify","history","scrollRestoration","onScroll","event","has","target","add","elementSelector","document","getCssSelector","c","scrollX","NaN","scrollY","el","path","parent","parentNode","unshift","tagName","indexOf","call","children","join","toLowerCase","addEventListener","unsubOnBeforeLoad","subscribe","pathChanged","restoreKey","fromLocation","entry","element","querySelector","scrollLeft","scrollTop","unsubOnResolved","resetNextScroll","toLocation","windowRestored","cacheKey","split","scrollTo","removeEventListener","ScrollRestoration","props"],"mappings":"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"}
+{"version":3,"file":"scroll-restoration.js","sources":["../../src/scroll-restoration.tsx"],"sourcesContent":["import * as React from 'react'\n\nconst useLayoutEffect =\n  typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nimport { ParsedLocation } from './location'\nimport { useRouter } from './RouterProvider'\nimport { NonNullableUpdater, functionalUpdate } from './utils'\n\nconst windowKey = 'window'\nconst delimiter = '___'\n\nlet weakScrolledElements = new WeakSet<any>()\n\ntype CacheValue = Record<string, { scrollX: number; scrollY: number }>\ntype CacheState = {\n  cached: CacheValue\n  next: CacheValue\n}\n\ntype Cache = {\n  state: CacheState\n  set: (updater: NonNullableUpdater<CacheState>) => void\n}\n\nconst sessionsStorage = typeof window !== 'undefined' && window.sessionStorage\n\nlet cache: Cache = sessionsStorage\n  ? (() => {\n      const storageKey = 'tsr-scroll-restoration-v2'\n\n      const state: CacheState = JSON.parse(\n        window.sessionStorage.getItem(storageKey) || 'null',\n      ) || { cached: {}, next: {} }\n\n      return {\n        state,\n        set: (updater) => {\n          cache.state = functionalUpdate(updater, cache.state)\n          window.sessionStorage.setItem(storageKey, JSON.stringify(cache.state))\n        },\n      }\n    })()\n  : (undefined as any)\n\nexport type ScrollRestorationOptions = {\n  getKey?: (location: ParsedLocation) => string\n}\n\nconst defaultGetKey = (location: ParsedLocation) => location.state.key!\n\nexport function useScrollRestoration(options?: ScrollRestorationOptions) {\n  const router = useRouter()\n\n  useLayoutEffect(() => {\n    const getKey = options?.getKey || defaultGetKey\n\n    const { history } = window\n    if (history.scrollRestoration) {\n      history.scrollRestoration = 'manual'\n    }\n\n    const onScroll = (event: Event) => {\n      if (weakScrolledElements.has(event.target)) return\n      weakScrolledElements.add(event.target)\n\n      let elementSelector = ''\n\n      if (event.target === document || event.target === window) {\n        elementSelector = windowKey\n      } else {\n        const attrId = (event.target as Element).getAttribute(\n          'data-scroll-restoration-id',\n        )\n\n        if (attrId) {\n          elementSelector = `[data-scroll-restoration-id=\"${attrId}\"]`\n        } else {\n          elementSelector = getCssSelector(event.target)\n        }\n      }\n\n      if (!cache.state.next[elementSelector]) {\n        cache.set((c) => ({\n          ...c,\n          next: {\n            ...c.next,\n            [elementSelector]: {\n              scrollX: NaN,\n              scrollY: NaN,\n            },\n          },\n        }))\n      }\n    }\n\n    if (typeof document !== 'undefined') {\n      document.addEventListener('scroll', onScroll, true)\n    }\n\n    const unsubOnBeforeLoad = router.subscribe('onBeforeLoad', (event) => {\n      if (event.pathChanged) {\n        const restoreKey = getKey(event.fromLocation)\n        for (const elementSelector in cache.state.next) {\n          const entry = cache.state.next[elementSelector]!\n          if (elementSelector === windowKey) {\n            entry.scrollX = window.scrollX || 0\n            entry.scrollY = window.scrollY || 0\n          } else if (elementSelector) {\n            const element = document.querySelector(elementSelector)\n            entry.scrollX = element?.scrollLeft || 0\n            entry.scrollY = element?.scrollTop || 0\n          }\n\n          cache.set((c) => {\n            const next = { ...c.next }\n            delete next[elementSelector]\n\n            return {\n              ...c,\n              next,\n              cached: {\n                ...c.cached,\n                [[restoreKey, elementSelector].join(delimiter)]: entry,\n              },\n            }\n          })\n        }\n      }\n    })\n\n    const unsubOnResolved = router.subscribe('onResolved', (event) => {\n      if (event.pathChanged) {\n        if (!router.resetNextScroll) {\n          return\n        }\n\n        router.resetNextScroll = true\n\n        const getKey = options?.getKey || defaultGetKey\n\n        const restoreKey = getKey(event.toLocation)\n        let windowRestored = false\n\n        for (const cacheKey in cache.state.cached) {\n          const entry = cache.state.cached[cacheKey]!\n          const [key, elementSelector] = cacheKey.split(delimiter)\n          if (key === restoreKey) {\n            if (elementSelector === windowKey) {\n              windowRestored = true\n              window.scrollTo(entry.scrollX, entry.scrollY)\n            } else if (elementSelector) {\n              const element = document.querySelector(elementSelector)\n              if (element) {\n                element.scrollLeft = entry.scrollX\n                element.scrollTop = entry.scrollY\n              }\n            }\n          }\n        }\n\n        if (!windowRestored) {\n          window.scrollTo(0, 0)\n        }\n\n        cache.set((c) => ({ ...c, next: {} }))\n        weakScrolledElements = new WeakSet<any>()\n      }\n    })\n\n    return () => {\n      document.removeEventListener('scroll', onScroll)\n      unsubOnBeforeLoad()\n      unsubOnResolved()\n    }\n  }, [])\n}\n\nexport function ScrollRestoration(props: ScrollRestorationOptions) {\n  useScrollRestoration(props)\n  return null\n}\n\nexport function useElementScrollRestoration(\n  options: (\n    | {\n        id: string\n        getElement?: () => Element | undefined | null\n      }\n    | {\n        id?: string\n        getElement: () => Element | undefined | null\n      }\n  ) & {\n    getKey?: (location: ParsedLocation) => string\n  },\n) {\n  const router = useRouter()\n  const getKey = options?.getKey || defaultGetKey\n\n  let elementSelector = ''\n\n  if (options.id) {\n    elementSelector = `[data-scroll-restoration-id=\"${options.id}\"]`\n  } else {\n    const element = options.getElement?.()\n    if (!element) {\n      return\n    }\n    elementSelector = getCssSelector(element)\n  }\n\n  const restoreKey = getKey(router.latestLocation)\n  const cacheKey = [restoreKey, elementSelector].join(delimiter)\n  return cache.state.cached[cacheKey]\n}\n\nfunction getCssSelector(el: any): string {\n  let path = [],\n    parent\n  while ((parent = el.parentNode)) {\n    path.unshift(\n      `${el.tagName}:nth-child(${\n        ([].indexOf as any).call(parent.children, el) + 1\n      })`,\n    )\n    el = parent\n  }\n  return `${path.join(' > ')}`.toLowerCase()\n}\n"],"names":["useLayoutEffect","window","React","useEffect","windowKey","delimiter","weakScrolledElements","WeakSet","sessionsStorage","sessionStorage","cache","storageKey","state","JSON","parse","getItem","cached","next","set","updater","functionalUpdate","setItem","stringify","undefined","defaultGetKey","location","key","useScrollRestoration","options","router","useRouter","getKey","history","scrollRestoration","onScroll","event","has","target","add","elementSelector","document","attrId","getAttribute","getCssSelector","c","scrollX","NaN","scrollY","addEventListener","unsubOnBeforeLoad","subscribe","pathChanged","restoreKey","fromLocation","entry","element","querySelector","scrollLeft","scrollTop","join","unsubOnResolved","resetNextScroll","toLocation","windowRestored","cacheKey","split","scrollTo","removeEventListener","ScrollRestoration","props","useElementScrollRestoration","id","getElement","latestLocation","el","path","parent","parentNode","unshift","tagName","indexOf","call","children","toLowerCase"],"mappings":"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"}

package/build/esm/index.js

@@ -8,7 +8,7 @@
  *
  * @license MIT
  */
-import { createBrowserHistory } from '@tanstack/history';
+import { createBrowserHistory, createMemoryHistory } from '@tanstack/history';
 export * from '@tanstack/history';
 import invariant from 'tiny-invariant';
 export { default as invariant } from 'tiny-invariant';
@@ -650,7 +650,10 @@ function Match({
   const match = matches[0];
   const routeId = match?.routeId;
   const route = routesById[routeId];
-  const locationKey = useRouterState().location.state?.key;
+  const router = useRouter();
+  const locationKey = router.latestLocation.state?.key;
+  // const locationKey = useRouterState().location.state?.key
+
   const PendingComponent = route.options.pendingComponent ?? options.defaultPendingComponent;
   const pendingElement = PendingComponent ? /*#__PURE__*/React.createElement(PendingComponent, {
     useMatch: route.useMatch,
@@ -794,24 +797,12 @@ const routerContext = /*#__PURE__*/React.createContext(null);
 if (typeof document !== 'undefined') {
   window.__TSR_ROUTER_CONTEXT__ = routerContext;
 }
-class SearchParamError extends Error {}
-class PathParamError extends Error {}
-function getInitialRouterState(location) {
-  return {
-    status: 'idle',
-    resolvedLocation: location,
-    location,
-    matches: [],
-    pendingMatches: [],
-    lastUpdated: Date.now()
-  };
-}
 function RouterProvider({
   router,
   ...rest
 }) {
   // Allow the router to update options on the router instance
-  router.updateOptions({
+  router.update({
     ...router.options,
     ...rest,
     context: {
@@ -819,29 +810,44 @@ function RouterProvider({
       ...rest?.context
     }
   });
+  const inner = /*#__PURE__*/React.createElement(RouterProviderInner, {
+    router: router
+  });
+  if (router.options.Wrap) {
+    return /*#__PURE__*/React.createElement(router.options.Wrap, null, inner);
+  }
+  return inner;
+}
+function RouterProviderInner({
+  router
+}) {
   const [preState, setState] = React.useState(() => router.state);
   const [isTransitioning, startReactTransition] = React.useTransition();
+  const isAnyTransitioning = isTransitioning || preState.matches.some(d => d.status === 'pending');
   const state = React.useMemo(() => ({
     ...preState,
-    status: isTransitioning ? 'pending' : 'idle',
+    status: isAnyTransitioning ? 'pending' : 'idle',
     location: isTransitioning ? router.latestLocation : preState.location,
     pendingMatches: router.pendingMatches
   }), [preState, isTransitioning]);
   router.setState = setState;
   router.state = state;
   router.startReactTransition = startReactTransition;
-  React.useLayoutEffect(() => {
+  const tryLoad = () => {
+    if (state.location !== router.latestLocation) {
+      startReactTransition(() => {
+        try {
+          router.load();
+        } catch (err) {
+          console.error(err);
+        }
+      });
+    }
+  };
+  useLayoutEffect$1(() => {
     const unsub = router.history.subscribe(() => {
       router.latestLocation = router.parseLocation(router.latestLocation);
-      if (state.location !== router.latestLocation) {
-        startReactTransition(() => {
-          try {
-            router.load();
-          } catch (err) {
-            console.error(err);
-          }
-        });
-      }
+      tryLoad();
     });
     const nextLocation = router.buildLocation({
       search: true,
@@ -859,7 +865,7 @@ function RouterProvider({
       unsub();
     };
   }, [router.history]);
-  React.useLayoutEffect(() => {
+  useLayoutEffect$1(() => {
     if (!isTransitioning && state.resolvedLocation !== state.location) {
       router.emit({
         type: 'onResolved',
@@ -874,14 +880,10 @@ function RouterProvider({
       }));
     }
   });
-  React.useLayoutEffect(() => {
-    startReactTransition(() => {
-      try {
-        router.load();
-      } catch (err) {
-        console.error(err);
-      }
-    });
+  useLayoutEffect$1(() => {
+    if (!window.__TSR_DEHYDRATED__) {
+      tryLoad();
+    }
   }, []);
   return /*#__PURE__*/React.createElement(routerContext.Provider, {
     value: router
@@ -898,7 +900,7 @@ function useRouterState(opts) {
   return opts?.select ? opts.select(state) : state;
 }
 function useRouter() {
-  const resolvedContext = window.__TSR_ROUTER_CONTEXT__ || routerContext;
+  const resolvedContext = typeof document !== 'undefined' ? window.__TSR_ROUTER_CONTEXT__ || routerContext : routerContext;
   const value = React.useContext(resolvedContext);
   warning(value, 'useRouter must be used inside a <RouterProvider> component!');
   return value;
@@ -938,7 +940,7 @@ function useAwaited({
     promise.__deferredState = state;
   }
   if (state.status === 'pending') {
-    throw promise;
+    throw new Promise(r => setTimeout(r, 1)).then(() => promise);
   }
   if (state.status === 'error') {
     throw state.error;
@@ -1224,6 +1226,8 @@ function stringifySearchWith(stringify, parser) {
   };
 }
 
+// import warning from 'tiny-warning'
+
 //
 
 const componentTypes = ['component', 'errorComponent', 'pendingComponent'];
@@ -1241,7 +1245,7 @@ class Router {
   // Must build in constructor
 
   constructor(options) {
-    this.updateOptions({
+    this.update({
       defaultPreloadDelay: 50,
       defaultPendingMs: 1000,
       defaultPendingMinMs: 500,
@@ -1251,20 +1255,22 @@ class Router {
       parseSearch: options?.parseSearch ?? defaultParseSearch
     });
   }
-  startReactTransition = () => {
-    warning(false, 'startReactTransition implementation is missing. If you see this, please file an issue.');
-  };
-  setState = () => {
-    warning(false, 'setState implementation is missing. If you see this, please file an issue.');
+
+  // These are default implementations that can optionally be overridden
+  // by the router provider once rendered. We provide these so that the
+  // router can be used in a non-react environment if necessary
+  startReactTransition = fn => fn();
+  setState = updater => {
+    this.state = functionalUpdate(updater, this.state);
   };
-  updateOptions = newOptions => {
+  update = newOptions => {
     this.options = {
       ...this.options,
       ...newOptions
     };
     this.basepath = `/${trimPath(newOptions.basepath ?? '') ?? ''}`;
     if (!this.history || this.options.history && this.options.history !== this.history) {
-      this.history = this.options.history ?? createBrowserHistory();
+      this.history = this.options.history ?? (typeof document !== 'undefined' ? createBrowserHistory() : createMemoryHistory());
       this.latestLocation = this.parseLocation();
     }
     if (this.options.routeTree !== this.routeTree) {
@@ -1904,6 +1910,7 @@ class Router {
           // forcefully show the pending component
           if (pendingPromise) {
             pendingPromise.then(() => {
+              if (latestPromise = checkLatest()) return;
               didShowPending = true;
               matches[index] = match = {
                 ...match,
@@ -1923,6 +1930,7 @@ class Router {
             if (didShowPending && pendingMinMs) {
               await new Promise(r => setTimeout(r, pendingMinMs));
             }
+            if (latestPromise = checkLatest()) return await latestPromise;
             matches[index] = match = {
               ...match,
               error: undefined,
@@ -1991,7 +1999,7 @@ class Router {
       // Ingest the new matches
       this.setState(s => ({
         ...s,
-        status: 'pending',
+        // status: 'pending',
         location: next,
         matches
       }));
@@ -2020,6 +2028,7 @@ class Router {
         //   ...s,
         //   status: 'idle',
         //   resolvedLocation: s.location,
+        //   matches,
         // }))
 
         //
@@ -2220,63 +2229,42 @@ class Router {
     }
     return undefined;
   };
-
-  // dehydrate = (): DehydratedRouter => {
-  //   return {
-  //     state: {
-  //       dehydratedMatches: this.state.matches.map((d) =>
-  //         pick(d, ['fetchedAt', 'invalid', 'id', 'status', 'updatedAt']),
-  //       ),
-  //     },
-  //   }
-  // }
-
-  // hydrate = async (__do_not_use_server_ctx?: HydrationCtx) => {
-  //   let _ctx = __do_not_use_server_ctx
-  //   // Client hydrates from window
-  //   if (typeof document !== 'undefined') {
-  //     _ctx = window.__TSR_DEHYDRATED__
-  //   }
-
-  //   invariant(
-  //     _ctx,
-  //     'Expected to find a __TSR_DEHYDRATED__ property on window... but we did not. Did you forget to render <DehydrateRouter /> in your app?',
-  //   )
-
-  //   const ctx = _ctx
-  //   this.dehydratedData = ctx.payload as any
-  //   this.options.hydrate?.(ctx.payload as any)
-  //   const dehydratedState = ctx.router.state
-
-  //   let matches = this.matchRoutes(
-  //     this.state.location.pathname,
-  //     this.state.location.search,
-  //   ).map((match) => {
-  //     const dehydratedMatch = dehydratedState.dehydratedMatches.find(
-  //       (d) => d.id === match.id,
-  //     )
-
-  //     invariant(
-  //       dehydratedMatch,
-  //       `Could not find a client-side match for dehydrated match with id: ${match.id}!`,
-  //     )
-
-  //     if (dehydratedMatch) {
-  //       return {
-  //         ...match,
-  //         ...dehydratedMatch,
-  //       }
-  //     }
-  //     return match
-  //   })
-
-  //   this.setState((s) => {
-  //     return {
-  //       ...s,
-  //       matches: dehydratedState.dehydratedMatches as any,
-  //     }
-  //   })
-  // }
+  dehydrate = () => {
+    return {
+      state: {
+        dehydratedMatches: this.state.matches.map(d => pick(d, ['fetchedAt', 'invalid', 'id', 'status', 'updatedAt', 'loaderData']))
+      }
+    };
+  };
+  hydrate = async __do_not_use_server_ctx => {
+    let _ctx = __do_not_use_server_ctx;
+    // Client hydrates from window
+    if (typeof document !== 'undefined') {
+      _ctx = window.__TSR_DEHYDRATED__;
+    }
+    invariant(_ctx, 'Expected to find a __TSR_DEHYDRATED__ property on window... but we did not. Did you forget to render <DehydrateRouter /> in your app?');
+    const ctx = _ctx;
+    this.dehydratedData = ctx.payload;
+    this.options.hydrate?.(ctx.payload);
+    const dehydratedState = ctx.router.state;
+    let matches = this.matchRoutes(this.state.location.pathname, this.state.location.search).map(match => {
+      const dehydratedMatch = dehydratedState.dehydratedMatches.find(d => d.id === match.id);
+      invariant(dehydratedMatch, `Could not find a client-side match for dehydrated match with id: ${match.id}!`);
+      if (dehydratedMatch) {
+        return {
+          ...match,
+          ...dehydratedMatch
+        };
+      }
+      return match;
+    });
+    this.setState(s => {
+      return {
+        ...s,
+        matches: matches
+      };
+    });
+  };
 
   // resolveMatchPromise = (matchId: string, key: string, value: any) => {
   //   state.matches
@@ -2297,36 +2285,43 @@ function lazyFn(fn, key) {
 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: location,
+    location,
+    matches: [],
+    pendingMatches: [],
+    lastUpdated: Date.now()
+  };
+}
 
 const useLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
 const windowKey = 'window';
 const delimiter = '___';
 let weakScrolledElements = new WeakSet();
-let cache;
 const sessionsStorage = typeof window !== 'undefined' && window.sessionStorage;
+let cache = sessionsStorage ? (() => {
+  const storageKey = 'tsr-scroll-restoration-v2';
+  const state = JSON.parse(window.sessionStorage.getItem(storageKey) || 'null') || {
+    cached: {},
+    next: {}
+  };
+  return {
+    state,
+    set: updater => {
+      cache.state = functionalUpdate(updater, cache.state);
+      window.sessionStorage.setItem(storageKey, JSON.stringify(cache.state));
+    }
+  };
+})() : undefined;
 const defaultGetKey = location => location.state.key;
 function useScrollRestoration(options) {
   const router = useRouter();
   useLayoutEffect(() => {
     const getKey = options?.getKey || defaultGetKey;
-    if (sessionsStorage) {
-      if (!cache) {
-        cache = (() => {
-          const storageKey = 'tsr-scroll-restoration-v2';
-          const state = JSON.parse(window.sessionStorage.getItem(storageKey) || 'null') || {
-            cached: {},
-            next: {}
-          };
-          return {
-            state,
-            set: updater => {
-              cache.state = functionalUpdate(updater, cache.state);
-              window.sessionStorage.setItem(storageKey, JSON.stringify(cache.state));
-            }
-          };
-        })();
-      }
-    }
     const {
       history
     } = window;
@@ -2336,7 +2331,17 @@ function useScrollRestoration(options) {
     const onScroll = event => {
       if (weakScrolledElements.has(event.target)) return;
       weakScrolledElements.add(event.target);
-      const elementSelector = event.target === document || event.target === window ? windowKey : getCssSelector(event.target);
+      let elementSelector = '';
+      if (event.target === document || event.target === window) {
+        elementSelector = windowKey;
+      } else {
+        const attrId = event.target.getAttribute('data-scroll-restoration-id');
+        if (attrId) {
+          elementSelector = `[data-scroll-restoration-id="${attrId}"]`;
+        } else {
+          elementSelector = getCssSelector(event.target);
+        }
+      }
       if (!cache.state.next[elementSelector]) {
         cache.set(c => ({
           ...c,
@@ -2350,15 +2355,6 @@ function useScrollRestoration(options) {
         }));
       }
     };
-    const getCssSelector = el => {
-      let path = [],
-        parent;
-      while (parent = el.parentNode) {
-        path.unshift(`${el.tagName}:nth-child(${[].indexOf.call(parent.children, el) + 1})`);
-        el = parent;
-      }
-      return `${path.join(' > ')}`.toLowerCase();
-    };
     if (typeof document !== 'undefined') {
       document.addEventListener('scroll', onScroll, true);
     }
@@ -2438,6 +2434,32 @@ function ScrollRestoration(props) {
   useScrollRestoration(props);
   return null;
 }
+function useElementScrollRestoration(options) {
+  const router = useRouter();
+  const getKey = options?.getKey || defaultGetKey;
+  let elementSelector = '';
+  if (options.id) {
+    elementSelector = `[data-scroll-restoration-id="${options.id}"]`;
+  } else {
+    const element = options.getElement?.();
+    if (!element) {
+      return;
+    }
+    elementSelector = getCssSelector(element);
+  }
+  const restoreKey = getKey(router.latestLocation);
+  const cacheKey = [restoreKey, elementSelector].join(delimiter);
+  return cache.state.cached[cacheKey];
+}
+function getCssSelector(el) {
+  let path = [],
+    parent;
+  while (parent = el.parentNode) {
+    path.unshift(`${el.tagName}:nth-child(${[].indexOf.call(parent.children, el) + 1})`);
+    el = parent;
+  }
+  return `${path.join(' > ')}`.toLowerCase();
+}
 
 function useBlocker(message, condition = true) {
   const {
@@ -2498,5 +2520,5 @@ function Navigate(props) {
   return null;
 }
 
-export { Await, Block, CatchBoundary, CatchBoundaryImpl, ErrorComponent, FileRoute, Link, Match, MatchRoute, Matches, Navigate, Outlet, PathParamError, RootRoute, Route, Router, RouterProvider, ScrollRestoration, SearchParamError, cleanPath, componentTypes, createRouteMask, decode, deepEqual, defaultParseSearch, defaultStringifySearch, defer, encode, escapeJSON, functionalUpdate, getInitialRouterState, getRouteMatch, interpolatePath, isDehydratedDeferred, isPlainObject, isRedirect, isServer, joinPaths, last, lazyFn, lazyRouteComponent, matchByPath, matchPathname, matchesContext, parsePathname, parseSearchWith, pick, redirect, replaceEqualDeep, resolvePath, rootRouteId, rootRouteWithContext, routerContext, shallow, stringifySearchWith, trimPath, trimPathLeft, trimPathRight, typedNavigate, useAwaited, useBlocker, useLayoutEffect$1 as useLayoutEffect, useLinkProps, useLoaderData, useMatch, useMatchRoute, useMatches, useNavigate, useParams, useRouteContext, useRouter, useRouterState, useScrollRestoration, useSearch, useStableCallback };
+export { Await, Block, CatchBoundary, CatchBoundaryImpl, ErrorComponent, FileRoute, Link, Match, MatchRoute, Matches, Navigate, Outlet, PathParamError, RootRoute, Route, Router, RouterProvider, ScrollRestoration, SearchParamError, cleanPath, componentTypes, createRouteMask, decode, deepEqual, defaultParseSearch, defaultStringifySearch, defer, encode, escapeJSON, functionalUpdate, getInitialRouterState, getRouteMatch, interpolatePath, isDehydratedDeferred, isPlainObject, isRedirect, isServer, joinPaths, last, lazyFn, lazyRouteComponent, matchByPath, matchPathname, matchesContext, parsePathname, parseSearchWith, pick, redirect, replaceEqualDeep, resolvePath, rootRouteId, rootRouteWithContext, routerContext, shallow, stringifySearchWith, trimPath, trimPathLeft, trimPathRight, typedNavigate, useAwaited, useBlocker, useElementScrollRestoration, useLayoutEffect$1 as useLayoutEffect, useLinkProps, useLoaderData, useMatch, useMatchRoute, useMatches, useNavigate, useParams, useRouteContext, useRouter, useRouterState, useScrollRestoration, useSearch, useStableCallback };
 //# sourceMappingURL=index.js.map