@tanstack/react-router 1.33.7 → 1.34.0

package/dist/cjs/router.d.cts

@@ -1,4 +1,5 @@
 import { Store, NoInfer } from '@tanstack/react-store';
+import { Manifest } from './manifest.cjs';
 import { HistoryState, RouterHistory } from '@tanstack/history';
 import { AnyContext, AnyRoute, AnySearchSchema, ErrorRouteComponent, NotFoundRouteComponent, RouteMask, RouteComponent } from './route.cjs';
 import { FullSearchSchema, RouteById, RoutePaths, RoutesById, RoutesByPath } from './routeInfo.cjs';
@@ -297,6 +298,7 @@ export interface DehydratedRouterState {
 export type DehydratedRouteMatch = Pick<MakeRouteMatch, 'id' | 'status' | 'updatedAt' | 'loaderData'>;
 export interface DehydratedRouter {
     state: DehydratedRouterState;
+    manifest?: Manifest;
 }
 export type RouterConstructorOptions<TRouteTree extends AnyRoute, TTrailingSlashOption extends TrailingSlashOption, TDehydrated extends Record<string, any>, TSerializedError extends Record<string, any>> = Omit<RouterOptions<TRouteTree, TTrailingSlashOption, TDehydrated, TSerializedError>, 'context'> & RouterContextOptions<TRouteTree>;
 export declare const componentTypes: readonly ["component", "errorComponent", "pendingComponent", "notFoundComponent"];
@@ -335,6 +337,7 @@ export declare class Router<in out TRouteTree extends AnyRoute, in out TTrailing
     injectedHtml: Array<InjectedHtmlEntry>;
     dehydratedData?: TDehydrated;
     viewTransitionPromise?: ControlledPromise<true>;
+    manifest?: Manifest;
     __store: Store<RouterState<TRouteTree>>;
     options: PickAsRequired<Omit<RouterOptions<TRouteTree, TTrailingSlashOption, TDehydrated, TSerializedError>, 'transformer'> & {
         transformer: RouterTransformer;

package/dist/cjs/useBlocker.cjs

@@ -19,17 +19,47 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-function useBlocker(blockerFn, condition = true) {
+function useBlocker(blockerFnOrOpts, condition) {
+  const { blockerFn, blockerCondition } = blockerFnOrOpts ? typeof blockerFnOrOpts === "function" ? { blockerFn: blockerFnOrOpts, blockerCondition: condition ?? true } : {
+    blockerFn: blockerFnOrOpts.blockerFn,
+    blockerCondition: blockerFnOrOpts.condition ?? true
+  } : { blockerFn: void 0, blockerCondition: condition ?? true };
   const { history } = useRouter.useRouter();
-  React__namespace.useEffect(() => {
-    if (!condition)
-      return;
-    return history.block(blockerFn);
+  const [resolver, setResolver] = React__namespace.useState({
+    status: "idle",
+    proceed: () => {
+    },
+    reset: () => {
+    }
+  });
+  const createPromise = () => new Promise((resolve) => {
+    setResolver({
+      status: "idle",
+      proceed: () => resolve(true),
+      reset: () => resolve(false)
+    });
   });
+  const [promise, setPromise] = React__namespace.useState(createPromise);
+  React__namespace.useEffect(() => {
+    const blockerFnComposed = async () => {
+      if (blockerFn) {
+        return await blockerFn();
+      }
+      setResolver((prev) => ({
+        ...prev,
+        status: "blocked"
+      }));
+      const canNavigateAsync = await promise;
+      setPromise(createPromise);
+      return canNavigateAsync;
+    };
+    return !blockerCondition ? void 0 : history.block(blockerFnComposed);
+  }, [blockerFn, blockerCondition, history, promise]);
+  return resolver;
 }
-function Block({ blocker, condition, children }) {
-  useBlocker(blocker, condition);
-  return children ?? null;
+function Block({ blockerFn, condition, children }) {
+  const resolver = useBlocker({ blockerFn, condition });
+  return children ? typeof children === "function" ? children(resolver) : children : null;
 }
 exports.Block = Block;
 exports.useBlocker = useBlocker;

package/dist/cjs/useBlocker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useBlocker.cjs","sources":["../../src/useBlocker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useRouter } from './useRouter'\nimport type { BlockerFn } from '@tanstack/history'\nimport type { ReactNode } from './route'\n\nexport function useBlocker(\n  blockerFn: BlockerFn,\n  condition: boolean | any = true,\n): void {\n  const { history } = useRouter()\n\n  React.useEffect(() => {\n    if (!condition) return\n    return history.block(blockerFn)\n  })\n}\n\nexport function Block({ blocker, condition, children }: PromptProps) {\n  useBlocker(blocker, condition)\n  return children ?? null\n}\n\nexport type PromptProps = {\n  blocker: BlockerFn\n  condition?: boolean | any\n  children?: ReactNode\n}\n"],"names":["useRouter","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAKgB,SAAA,WACd,WACA,YAA2B,MACrB;AACA,QAAA,EAAE,YAAYA,UAAAA;AAEpBC,mBAAM,UAAU,MAAM;AACpB,QAAI,CAAC;AAAW;AACT,WAAA,QAAQ,MAAM,SAAS;AAAA,EAAA,CAC/B;AACH;AAEO,SAAS,MAAM,EAAE,SAAS,WAAW,YAAyB;AACnE,aAAW,SAAS,SAAS;AAC7B,SAAO,YAAY;AACrB;;;"}
+{"version":3,"file":"useBlocker.cjs","sources":["../../src/useBlocker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useRouter } from './useRouter'\nimport type { BlockerFn } from '@tanstack/history'\nimport type { ReactNode } from './route'\n\ntype BlockerResolver = {\n  status: 'idle' | 'blocked'\n  proceed: () => void\n  reset: () => void\n}\n\ntype BlockerOpts = {\n  blockerFn?: BlockerFn\n  condition?: boolean | any\n}\n\nexport function useBlocker(blockerFnOrOpts?: BlockerOpts): BlockerResolver\n\n/**\n * @deprecated Use the BlockerOpts object syntax instead\n */\nexport function useBlocker(\n  blockerFn?: BlockerFn,\n  condition?: boolean | any,\n): BlockerResolver\n\nexport function useBlocker(\n  blockerFnOrOpts?: BlockerFn | BlockerOpts,\n  condition?: boolean | any,\n): BlockerResolver {\n  const { blockerFn, blockerCondition } = blockerFnOrOpts\n    ? typeof blockerFnOrOpts === 'function'\n      ? { blockerFn: blockerFnOrOpts, blockerCondition: condition ?? true }\n      : {\n          blockerFn: blockerFnOrOpts.blockerFn,\n          blockerCondition: blockerFnOrOpts.condition ?? true,\n        }\n    : { blockerFn: undefined, blockerCondition: condition ?? true }\n  const { history } = useRouter()\n\n  const [resolver, setResolver] = React.useState<BlockerResolver>({\n    status: 'idle',\n    proceed: () => {},\n    reset: () => {},\n  })\n\n  const createPromise = () =>\n    new Promise<boolean>((resolve) => {\n      setResolver({\n        status: 'idle',\n        proceed: () => resolve(true),\n        reset: () => resolve(false),\n      })\n    })\n\n  const [promise, setPromise] = React.useState(createPromise)\n\n  React.useEffect(() => {\n    const blockerFnComposed = async () => {\n      // If a function is provided, it takes precedence over the promise blocker\n      if (blockerFn) {\n        return await blockerFn()\n      }\n\n      setResolver((prev) => ({\n        ...prev,\n        status: 'blocked',\n      }))\n      const canNavigateAsync = await promise\n\n      setPromise(createPromise)\n\n      return canNavigateAsync\n    }\n\n    return !blockerCondition ? undefined : history.block(blockerFnComposed)\n  }, [blockerFn, blockerCondition, history, promise])\n\n  return resolver\n}\n\nexport function Block({ blockerFn, condition, children }: PromptProps) {\n  const resolver = useBlocker({ blockerFn, condition })\n  return children\n    ? typeof children === 'function'\n      ? children(resolver)\n      : children\n    : null\n}\n\nexport type PromptProps = {\n  blockerFn?: BlockerFn\n  condition?: boolean | any\n  children?: ReactNode | (({ proceed, reset }: BlockerResolver) => ReactNode)\n}\n"],"names":["useRouter","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA0BgB,SAAA,WACd,iBACA,WACiB;AACjB,QAAM,EAAE,WAAW,qBAAqB,kBACpC,OAAO,oBAAoB,aACzB,EAAE,WAAW,iBAAiB,kBAAkB,aAAa,SAC7D;AAAA,IACE,WAAW,gBAAgB;AAAA,IAC3B,kBAAkB,gBAAgB,aAAa;AAAA,EAAA,IAEnD,EAAE,WAAW,QAAW,kBAAkB,aAAa;AACrD,QAAA,EAAE,YAAYA,UAAAA;AAEpB,QAAM,CAAC,UAAU,WAAW,IAAIC,iBAAM,SAA0B;AAAA,IAC9D,QAAQ;AAAA,IACR,SAAS,MAAM;AAAA,IAAC;AAAA,IAChB,OAAO,MAAM;AAAA,IAAC;AAAA,EAAA,CACf;AAED,QAAM,gBAAgB,MACpB,IAAI,QAAiB,CAAC,YAAY;AACpB,gBAAA;AAAA,MACV,QAAQ;AAAA,MACR,SAAS,MAAM,QAAQ,IAAI;AAAA,MAC3B,OAAO,MAAM,QAAQ,KAAK;AAAA,IAAA,CAC3B;AAAA,EAAA,CACF;AAEH,QAAM,CAAC,SAAS,UAAU,IAAIA,iBAAM,SAAS,aAAa;AAE1DA,mBAAM,UAAU,MAAM;AACpB,UAAM,oBAAoB,YAAY;AAEpC,UAAI,WAAW;AACb,eAAO,MAAM,UAAU;AAAA,MACzB;AAEA,kBAAY,CAAC,UAAU;AAAA,QACrB,GAAG;AAAA,QACH,QAAQ;AAAA,MACR,EAAA;AACF,YAAM,mBAAmB,MAAM;AAE/B,iBAAW,aAAa;AAEjB,aAAA;AAAA,IAAA;AAGT,WAAO,CAAC,mBAAmB,SAAY,QAAQ,MAAM,iBAAiB;AAAA,KACrE,CAAC,WAAW,kBAAkB,SAAS,OAAO,CAAC;AAE3C,SAAA;AACT;AAEO,SAAS,MAAM,EAAE,WAAW,WAAW,YAAyB;AACrE,QAAM,WAAW,WAAW,EAAE,WAAW,UAAW,CAAA;AACpD,SAAO,WACH,OAAO,aAAa,aAClB,SAAS,QAAQ,IACjB,WACF;AACN;;;"}

package/dist/cjs/useBlocker.d.cts

@@ -1,10 +1,24 @@
 import { BlockerFn } from '@tanstack/history';
 import { ReactNode } from './route.cjs';
 
-export declare function useBlocker(blockerFn: BlockerFn, condition?: boolean | any): void;
-export declare function Block({ blocker, condition, children }: PromptProps): any;
+type BlockerResolver = {
+    status: 'idle' | 'blocked';
+    proceed: () => void;
+    reset: () => void;
+};
+type BlockerOpts = {
+    blockerFn?: BlockerFn;
+    condition?: boolean | any;
+};
+export declare function useBlocker(blockerFnOrOpts?: BlockerOpts): BlockerResolver;
+/**
+ * @deprecated Use the BlockerOpts object syntax instead
+ */
+export declare function useBlocker(blockerFn?: BlockerFn, condition?: boolean | any): BlockerResolver;
+export declare function Block({ blockerFn, condition, children }: PromptProps): any;
 export type PromptProps = {
-    blocker: BlockerFn;
+    blockerFn?: BlockerFn;
     condition?: boolean | any;
-    children?: ReactNode;
+    children?: ReactNode | (({ proceed, reset }: BlockerResolver) => ReactNode);
 };
+export {};

package/dist/esm/index.d.ts

@@ -36,3 +36,4 @@ export { escapeJSON, // SSR
 useLayoutEffect, // SSR
 pick, functionalUpdate, replaceEqualDeep, isPlainObject, isPlainArray, deepEqual, useStableCallback, shallow, } from './utils';
 export { notFound, isNotFound, CatchNotFound, DefaultGlobalNotFound, type NotFoundError, } from './not-found.js';
+export { type Manifest, type RouterManagedTag } from './manifest.js';

package/dist/esm/manifest.d.ts

@@ -0,0 +1,23 @@
+export type Manifest = {
+    routes: Record<string, {
+        preloads?: Array<string>;
+        assets?: Array<RouterManagedTag>;
+    }>;
+};
+export type RouterManagedTag = {
+    tag: 'title';
+    attrs?: Record<string, any>;
+    children: string;
+} | {
+    tag: 'meta' | 'link';
+    attrs?: Record<string, any>;
+    children?: never;
+} | {
+    tag: 'script';
+    attrs?: Record<string, any>;
+    children?: string;
+} | {
+    tag: 'style';
+    attrs?: Record<string, any>;
+    children?: string;
+};

package/dist/esm/router.d.ts

@@ -1,4 +1,5 @@
 import { Store, NoInfer } from '@tanstack/react-store';
+import { Manifest } from './manifest.js';
 import { HistoryState, RouterHistory } from '@tanstack/history';
 import { AnyContext, AnyRoute, AnySearchSchema, ErrorRouteComponent, NotFoundRouteComponent, RouteMask, RouteComponent } from './route.js';
 import { FullSearchSchema, RouteById, RoutePaths, RoutesById, RoutesByPath } from './routeInfo.js';
@@ -297,6 +298,7 @@ export interface DehydratedRouterState {
 export type DehydratedRouteMatch = Pick<MakeRouteMatch, 'id' | 'status' | 'updatedAt' | 'loaderData'>;
 export interface DehydratedRouter {
     state: DehydratedRouterState;
+    manifest?: Manifest;
 }
 export type RouterConstructorOptions<TRouteTree extends AnyRoute, TTrailingSlashOption extends TrailingSlashOption, TDehydrated extends Record<string, any>, TSerializedError extends Record<string, any>> = Omit<RouterOptions<TRouteTree, TTrailingSlashOption, TDehydrated, TSerializedError>, 'context'> & RouterContextOptions<TRouteTree>;
 export declare const componentTypes: readonly ["component", "errorComponent", "pendingComponent", "notFoundComponent"];
@@ -335,6 +337,7 @@ export declare class Router<in out TRouteTree extends AnyRoute, in out TTrailing
     injectedHtml: Array<InjectedHtmlEntry>;
     dehydratedData?: TDehydrated;
     viewTransitionPromise?: ControlledPromise<true>;
+    manifest?: Manifest;
     __store: Store<RouterState<TRouteTree>>;
     options: PickAsRequired<Omit<RouterOptions<TRouteTree, TTrailingSlashOption, TDehydrated, TSerializedError>, 'transformer'> & {
         transformer: RouterTransformer;

package/dist/esm/router.js

@@ -1205,7 +1205,8 @@ class Router {
               __isServerError: true
             } : void 0
           }))
-        }
+        },
+        manifest: this.manifest
       };
     };
     this.hydrate = async (__do_not_use_server_ctx) => {
@@ -1256,6 +1257,7 @@ class Router {
           matches
         };
       });
+      this.manifest = ctx.router.manifest;
     };
     this.handleNotFound = (matches, err) => {
       const matchesByRouteId = Object.fromEntries(