@tanstack/react-router 0.0.1-beta.74 → 0.0.1-beta.76

package/build/stats-react.json

@@ -7,7 +7,7 @@
         "name": "index.production.js",
         "children": [
           {
-            "uid": "ef61-109",
+            "uid": "f796-109",
             "name": "\u0000rollupPluginBabelHelpers.js"
           },
           {
@@ -15,11 +15,11 @@
             "children": [
               {
                 "name": "tiny-invariant@1.3.1/node_modules/tiny-invariant/dist/esm/tiny-invariant.js",
-                "uid": "ef61-111"
+                "uid": "f796-111"
               },
               {
                 "name": "tiny-warning@1.0.3/node_modules/tiny-warning/dist/tiny-warning.esm.js",
-                "uid": "ef61-113"
+                "uid": "f796-113"
               }
             ]
           },
@@ -28,19 +28,19 @@
             "children": [
               {
                 "name": "store/build/esm/index.js",
-                "uid": "ef61-115"
+                "uid": "f796-115"
               },
               {
                 "name": "router/build/esm/index.js",
-                "uid": "ef61-117"
+                "uid": "f796-117"
               },
               {
                 "name": "react-store/build/esm/index.js",
-                "uid": "ef61-119"
+                "uid": "f796-119"
               },
               {
                 "name": "react-router/src/index.tsx",
-                "uid": "ef61-121"
+                "uid": "f796-121"
               }
             ]
           }
@@ -50,176 +50,176 @@
     "isRoot": true
   },
   "nodeParts": {
-    "ef61-109": {
+    "f796-109": {
       "renderedLength": 429,
       "gzipLength": 238,
       "brotliLength": 0,
-      "mainUid": "ef61-108"
+      "mainUid": "f796-108"
     },
-    "ef61-111": {
+    "f796-111": {
       "renderedLength": 181,
       "gzipLength": 129,
       "brotliLength": 0,
-      "mainUid": "ef61-110"
+      "mainUid": "f796-110"
     },
-    "ef61-113": {
+    "f796-113": {
       "renderedLength": 44,
       "gzipLength": 62,
       "brotliLength": 0,
-      "mainUid": "ef61-112"
+      "mainUid": "f796-112"
     },
-    "ef61-115": {
+    "f796-115": {
       "renderedLength": 1288,
       "gzipLength": 497,
       "brotliLength": 0,
-      "mainUid": "ef61-114"
+      "mainUid": "f796-114"
     },
-    "ef61-117": {
-      "renderedLength": 46875,
-      "gzipLength": 11092,
+    "f796-117": {
+      "renderedLength": 46874,
+      "gzipLength": 11076,
       "brotliLength": 0,
-      "mainUid": "ef61-116"
+      "mainUid": "f796-116"
     },
-    "ef61-119": {
+    "f796-119": {
       "renderedLength": 1571,
       "gzipLength": 594,
       "brotliLength": 0,
-      "mainUid": "ef61-118"
+      "mainUid": "f796-118"
     },
-    "ef61-121": {
-      "renderedLength": 12514,
-      "gzipLength": 3242,
+    "f796-121": {
+      "renderedLength": 12591,
+      "gzipLength": 3262,
       "brotliLength": 0,
-      "mainUid": "ef61-120"
+      "mainUid": "f796-120"
     }
   },
   "nodeMetas": {
-    "ef61-108": {
+    "f796-108": {
       "id": "\u0000rollupPluginBabelHelpers.js",
       "moduleParts": {
-        "index.production.js": "ef61-109"
+        "index.production.js": "f796-109"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "ef61-120"
+          "uid": "f796-120"
         }
       ]
     },
-    "ef61-110": {
+    "f796-110": {
       "id": "/node_modules/.pnpm/tiny-invariant@1.3.1/node_modules/tiny-invariant/dist/esm/tiny-invariant.js",
       "moduleParts": {
-        "index.production.js": "ef61-111"
+        "index.production.js": "f796-111"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "ef61-116"
+          "uid": "f796-116"
         }
       ]
     },
-    "ef61-112": {
+    "f796-112": {
       "id": "/node_modules/.pnpm/tiny-warning@1.0.3/node_modules/tiny-warning/dist/tiny-warning.esm.js",
       "moduleParts": {
-        "index.production.js": "ef61-113"
+        "index.production.js": "f796-113"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "ef61-116"
+          "uid": "f796-116"
         }
       ]
     },
-    "ef61-114": {
+    "f796-114": {
       "id": "/packages/store/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "ef61-115"
+        "index.production.js": "f796-115"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "ef61-116"
+          "uid": "f796-116"
         }
       ]
     },
-    "ef61-116": {
+    "f796-116": {
       "id": "/packages/router/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "ef61-117"
+        "index.production.js": "f796-117"
       },
       "imported": [
         {
-          "uid": "ef61-110"
+          "uid": "f796-110"
         },
         {
-          "uid": "ef61-112"
+          "uid": "f796-112"
         },
         {
-          "uid": "ef61-114"
+          "uid": "f796-114"
         }
       ],
       "importedBy": [
         {
-          "uid": "ef61-120"
+          "uid": "f796-120"
         }
       ]
     },
-    "ef61-118": {
+    "f796-118": {
       "id": "/packages/react-store/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "ef61-119"
+        "index.production.js": "f796-119"
       },
       "imported": [
         {
-          "uid": "ef61-123"
+          "uid": "f796-123"
         }
       ],
       "importedBy": [
         {
-          "uid": "ef61-120"
+          "uid": "f796-120"
         }
       ]
     },
-    "ef61-120": {
+    "f796-120": {
       "id": "/packages/react-router/src/index.tsx",
       "moduleParts": {
-        "index.production.js": "ef61-121"
+        "index.production.js": "f796-121"
       },
       "imported": [
         {
-          "uid": "ef61-108"
+          "uid": "f796-108"
         },
         {
-          "uid": "ef61-122"
+          "uid": "f796-122"
         },
         {
-          "uid": "ef61-116"
+          "uid": "f796-116"
         },
         {
-          "uid": "ef61-118"
+          "uid": "f796-118"
         }
       ],
       "importedBy": [],
       "isEntry": true
     },
-    "ef61-122": {
+    "f796-122": {
       "id": "react",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "ef61-120"
+          "uid": "f796-120"
         }
       ],
       "isExternal": true
     },
-    "ef61-123": {
+    "f796-123": {
       "id": "use-sync-external-store/shim/with-selector",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "ef61-118"
+          "uid": "f796-118"
         }
       ],
       "isExternal": true

package/build/types/index.d.ts

@@ -79,7 +79,7 @@ type RouterProps<TRouteConfig extends AnyRootRoute = RootRoute, TRoutesInfo exte
 };
 declare function RouterProvider<TRouteConfig extends AnyRootRoute = RootRoute, TRoutesInfo extends AnyRoutesInfo = DefaultRoutesInfo>({ router, ...rest }: RouterProps<TRouteConfig, TRoutesInfo>): JSX.Element;
 declare function useRouterContext(): RegisteredRouter;
-declare function useRouter<T = RouterStore>(track?: (state: Router['store']) => T, shallow?: boolean): RegisteredRouter;
+declare function useRouter<T = RouterStore>(track?: (state: Router['__store']) => T, shallow?: boolean): RegisteredRouter;
 declare function useMatches(): RouteMatch[];
 declare function useMatch<TFrom extends keyof RegisteredRoutesInfo['routesById'], TStrict extends boolean = true, TRouteMatch = RouteMatch<RegisteredRoutesInfo, RegisteredRoutesInfo['routesById'][TFrom]>>(opts?: {
     from: TFrom;

package/build/umd/index.development.js

@@ -783,12 +783,12 @@
         parseSearch: options?.parseSearch ?? defaultParseSearch,
         fetchServerDataFn: options?.fetchServerDataFn ?? defaultFetchServerDataFn
       };
-      this.store = new Store(getInitialRouterState(), {
+      this.__store = new Store(getInitialRouterState(), {
         onUpdate: state => {
           this.state = state;
         }
       });
-      this.state = this.store.state;
+      this.state = this.__store.state;
       this.basepath = '';
       this.update(options);
 
@@ -808,7 +808,7 @@
       }
     }
     reset = () => {
-      this.store.setState(s => Object.assign(s, getInitialRouterState()));
+      this.__store.setState(s => Object.assign(s, getInitialRouterState()));
     };
     mount = () => {
       // Mount only does anything on the client
@@ -828,7 +828,7 @@
         }
         this.history = this.options.history ?? (isServer ? createMemoryHistory() : createBrowserHistory());
         const parsedLocation = this.#parseLocation();
-        this.store.setState(s => ({
+        this.__store.setState(s => ({
           ...s,
           latestLocation: parsedLocation,
           currentLocation: parsedLocation
@@ -877,10 +877,10 @@
       // Cancel any pending matches
       this.cancelMatches();
       let matches;
-      this.store.batch(() => {
+      this.__store.batch(() => {
         if (opts?.next) {
           // Ingest the new location
-          this.store.setState(s => ({
+          this.__store.setState(s => ({
             ...s,
             latestLocation: opts.next
           }));
@@ -890,7 +890,7 @@
         matches = this.matchRoutes(this.state.latestLocation.pathname, {
           strictParseParams: true
         });
-        this.store.setState(s => ({
+        this.__store.setState(s => ({
           ...s,
           status: 'pending',
           pendingMatches: matches,
@@ -929,7 +929,7 @@
 
         // Clear non-loading error states when match leaves
         if (d.state.status === 'error') {
-          this.store.setState(s => ({
+          this.__store.setState(s => ({
             ...s,
             status: 'idle',
             error: undefined
@@ -949,7 +949,7 @@
         });
       });
       const prevLocation = this.state.currentLocation;
-      this.store.setState(s => ({
+      this.__store.setState(s => ({
         ...s,
         status: 'idle',
         currentLocation: this.state.latestLocation,
@@ -1270,7 +1270,7 @@
       };
     };
     hydrate = dehydratedRouter => {
-      this.store.setState(s => {
+      this.__store.setState(s => {
         // Match the routes
         const currentMatches = this.matchRoutes(dehydratedRouter.state.latestLocation.pathname, {
           strictParseParams: true
@@ -1278,7 +1278,7 @@
         currentMatches.forEach((match, index) => {
           const dehydratedMatch = dehydratedRouter.state.currentMatches[index];
           invariant(dehydratedMatch && dehydratedMatch.id === match.id, 'Oh no! There was a hydration mismatch when attempting to hydrate the state of the router! 😬');
-          match.store.setState(s => ({
+          match.__store.setState(s => ({
             ...s,
             ...dehydratedMatch.state
           }));
@@ -1464,7 +1464,6 @@
   const componentTypes = ['component', 'errorComponent', 'pendingComponent'];
   class RouteMatch {
     abortController = new AbortController();
-    onLoaderDataListeners = new Set();
     constructor(router, route, opts) {
       Object.assign(this, {
         route,
@@ -1472,7 +1471,7 @@
         id: opts.id,
         pathname: opts.pathname,
         params: opts.params,
-        store: new Store({
+        __store: new Store({
           updatedAt: 0,
           routeSearch: {},
           search: {},
@@ -1483,7 +1482,7 @@
           }
         })
       });
-      this.state = this.store.state;
+      this.state = this.__store.state;
       componentTypes.map(async type => {
         const component = this.route.options[type];
         if (typeof this[type] !== 'function') {
@@ -1491,7 +1490,7 @@
         }
       });
       if (this.state.status === 'idle' && !this.#hasLoaders()) {
-        this.store.setState(s => ({
+        this.__store.setState(s => ({
           ...s,
           status: 'success'
         }));
@@ -1511,7 +1510,7 @@
       });
       this.context = context;
       this.routeContext = routeContext;
-      this.store.setState(s => ({
+      this.__store.setState(s => ({
         ...s,
         routeSearch: replaceEqualDeep(s.routeSearch, routeSearch),
         search: replaceEqualDeep(s.search, search)
@@ -1582,7 +1581,7 @@
           return;
         }
         this.route.options.onError?.(err);
-        this.store.setState(s => ({
+        this.__store.setState(s => ({
           ...s,
           status: 'error',
           error: err
@@ -1616,7 +1615,7 @@
         // to a loading state again. Otherwise, keep it
         // as loading or resolved
         if (this.state.status === 'idle') {
-          this.store.setState(s => ({
+          this.__store.setState(s => ({
             ...s,
             status: 'pending'
           }));
@@ -1649,7 +1648,7 @@
         try {
           await Promise.all([componentsPromise, dataPromise]);
           if (latestPromise = checkLatest()) return await latestPromise;
-          this.store.setState(s => ({
+          this.__store.setState(s => ({
             ...s,
             error: undefined,
             status: 'success',
@@ -1662,7 +1661,7 @@
           }
           this.route.options.onLoadError?.(err);
           this.route.options.onError?.(err);
-          this.store.setState(s => ({
+          this.__store.setState(s => ({
             ...s,
             error: err,
             status: 'error',
@@ -1881,7 +1880,7 @@
     ...rest
   }) {
     router.update(rest);
-    const currentMatches = useStore(router.store, s => s.currentMatches);
+    const currentMatches = useStore(router.__store, s => s.currentMatches);
     React__namespace.useEffect(router.mount, [router]);
     return /*#__PURE__*/React__namespace.createElement(routerContext.Provider, {
       value: {
@@ -1899,12 +1898,12 @@
   function useRouterContext() {
     const value = React__namespace.useContext(routerContext);
     warning(value, 'useRouter must be used inside a <Router> component!');
-    useStore(value.router.store);
+    useStore(value.router.__store);
     return value.router;
   }
   function useRouter(track, shallow) {
     const router = useRouterContext();
-    useStore(router.store, track, shallow);
+    useStore(router.__store, track, shallow);
     return router;
   }
   function useMatches() {
@@ -1918,7 +1917,7 @@
     if (opts?.strict ?? true) {
       invariant(nearestMatch.route.id == match?.route.id, `useMatch("${match?.route.id}") is being called in a component that is meant to render the '${nearestMatch.route.id}' route. Did you mean to 'useMatch("${match?.route.id}", { strict: false })' or 'useRoute("${match?.route.id}")' instead?`);
     }
-    useStore(match.store, d => opts?.track?.(match) ?? match, opts?.shallow);
+    useStore(match.__store, d => opts?.track?.(match) ?? match, opts?.shallow);
     return match;
   }
   function useRoute(routeId) {
@@ -1928,13 +1927,17 @@
     return resolvedRoute;
   }
   function useSearch(opts) {
-    const match = useMatch(opts);
-    useStore(match.store, d => opts?.track?.(d.search) ?? d.search, true);
+    const {
+      track,
+      ...matchOpts
+    } = opts;
+    const match = useMatch(matchOpts);
+    useStore(match.__store, d => opts?.track?.(d.search) ?? d.search, true);
     return match.state.search;
   }
   function useParams(opts) {
     const router = useRouterContext();
-    useStore(router.store, d => {
+    useStore(router.__store, d => {
       const params = last(d.currentMatches)?.params;
       return opts?.track?.(params) ?? params;
     }, true);
@@ -1990,7 +1993,7 @@
     match
   }) {
     const router = useRouterContext();
-    useStore(match.store, store => [store.status, store.error], true);
+    useStore(match.__store, store => [store.status, store.error], true);
     const defaultPending = React__namespace.useCallback(() => null, []);
     const Inner = React__namespace.useCallback(props => {
       if (props.match.state.status === 'error') {