@raf-query/react 0.11.1 → 0.13.0

package/dist/hydration-boundary/hydration-boundary-react-server.mjs

@@ -1,27 +1,38 @@
 import { Hydrate } from "./hydrate.mjs";
-import { sentHashes } from "./sent.mjs";
 import { dehydrate } from "@raf-query/core";
 import { jsx } from "react/jsx-runtime";
 //#region src/hydration-boundary/hydration-boundary-react-server.tsx
+const sentByClient = /* @__PURE__ */ new WeakMap();
+/**
+* Hashes of the request client's entries an earlier `HydrationBoundary`
+* already sent, so each entry crosses once per request.
+*/
+function sentHashes(client) {
+	const sent = sentByClient.get(client) ?? /* @__PURE__ */ new Set();
+	sentByClient.set(client, sent);
+	return sent;
+}
 /**
 * `HydrationBoundary` in server components (the `react-server` export
 * condition). With `client`, sends the request client's entries to the
 * browser cache: pending entries cross as promises and stream in as they
 * settle, and entries an earlier boundary already sent in this request are
 * skipped. With `state`, writes that state, as the browser version does.
+*
+* It also marks the client components' server render: from there on, a read
+* of a query nothing sent renders its Suspense fallback on the server and
+* loads in the browser, instead of fetching where nothing would send it.
+*
+* @see https://raf-query.katt.dev/docs/react-server-components#setup
 */
 function HydrationBoundary(props) {
-	if (props.client === void 0) return /* @__PURE__ */ jsx(Hydrate, {
-		options: props.options,
-		state: props.state,
-		children: props.children
-	});
 	const client = props.client;
-	const state = dehydrate(client, {
-		sent: sentHashes(client),
-		...props.options
+	const state = client === void 0 ? props.state : dehydrate(client, {
+		...props.options,
+		sent: sentHashes(client)
 	});
 	return /* @__PURE__ */ jsx(Hydrate, {
+		fromServerComponents: true,
 		state,
 		children: props.children
 	});

package/dist/hydration-boundary/hydration-boundary.d.mts

@@ -1,6 +1,11 @@
-import { DehydrateOptions, DehydratedState, HydrateOptions, QueryClient } from "@raf-query/core";
+import { DehydrateOptions, DehydratedState, QueryClient } from "@raf-query/core";
 import { ReactNode } from "react";
 //#region src/hydration-boundary/hydration-boundary.d.ts
+/**
+ * Props of {@link HydrationBoundary}: a dehydrated `state`, or in server components the request's `client`.
+ *
+ * @see https://raf-query.katt.dev/docs/react-router#server-loaders
+ */
 export type HydrationBoundaryProps = {
   readonly children?: ReactNode;
   /**
@@ -13,8 +18,8 @@ export type HydrationBoundaryProps = {
 } | {
   readonly children?: ReactNode;
   readonly client?: never;
-  readonly options?: HydrateOptions;
-  /** A loader's `dehydrate(qc)`. */
+  readonly options?: never;
+  /** A loader's `dehydrate(client)`. */
   readonly state: DehydratedState;
 };
 /**
@@ -27,38 +32,20 @@ export type HydrationBoundaryProps = {
  * through the package's `react-server` export condition.
  *
  * ```tsx
- * const qc = getQueryClient();
- * const comments = qc.prefetch(commentsQuery, { slug });
+ * const client = getQueryClient();
+ * const [handles] = await load(client, { comments: prefetch(commentsQuery, { slug }) });
  * return (
- *   <HydrationBoundary client={qc}>
- *     <Comments handle={comments} />
+ *   <HydrationBoundary client={client}>
+ *     <Comments handle={handles.comments} />
  *   </HydrationBoundary>
  * );
  * ```
  *
  * With loaders, such as React Router Framework Mode, pass the `state` the
- * loader dehydrated:
- *
- * ```tsx
- * export async function loader(args: Route.LoaderArgs) {
- *   const qc = new QueryClient();
- *   const post = await qc.ensure(postQuery, { slug: args.params.slug });
- *   return { dehydratedState: dehydrate(qc), post };
- * }
- *
- * export default function Page(props: Route.ComponentProps) {
- *   const { dehydratedState, post } = props.loaderData;
- *   return (
- *     <HydrationBoundary state={dehydratedState}>
- *       <Post handle={post} />
- *     </HydrationBoundary>
- *   );
- * }
- * ```
+ * loader dehydrated. Pending entries cross as promises when the framework's
+ * serializer supports them (React Router's Single Fetch does).
  *
- * Pending entries cross as promises when the framework's serializer
- * supports them (React Router's Single Fetch does). Nested boundaries
- * are fine: each only writes what its `state` holds.
+ * @see https://raf-query.katt.dev/docs/react-router#server-loaders
  */
 export declare function HydrationBoundary(props: HydrationBoundaryProps): import("react").JSX.Element;
 //#endregion

package/dist/hydration-boundary/hydration-boundary.mjs

@@ -12,43 +12,24 @@ import { jsx } from "react/jsx-runtime";
 * through the package's `react-server` export condition.
 *
 * ```tsx
-* const qc = getQueryClient();
-* const comments = qc.prefetch(commentsQuery, { slug });
+* const client = getQueryClient();
+* const [handles] = await load(client, { comments: prefetch(commentsQuery, { slug }) });
 * return (
-*   <HydrationBoundary client={qc}>
-*     <Comments handle={comments} />
+*   <HydrationBoundary client={client}>
+*     <Comments handle={handles.comments} />
 *   </HydrationBoundary>
 * );
 * ```
 *
 * With loaders, such as React Router Framework Mode, pass the `state` the
-* loader dehydrated:
+* loader dehydrated. Pending entries cross as promises when the framework's
+* serializer supports them (React Router's Single Fetch does).
 *
-* ```tsx
-* export async function loader(args: Route.LoaderArgs) {
-*   const qc = new QueryClient();
-*   const post = await qc.ensure(postQuery, { slug: args.params.slug });
-*   return { dehydratedState: dehydrate(qc), post };
-* }
-*
-* export default function Page(props: Route.ComponentProps) {
-*   const { dehydratedState, post } = props.loaderData;
-*   return (
-*     <HydrationBoundary state={dehydratedState}>
-*       <Post handle={post} />
-*     </HydrationBoundary>
-*   );
-* }
-* ```
-*
-* Pending entries cross as promises when the framework's serializer
-* supports them (React Router's Single Fetch does). Nested boundaries
-* are fine: each only writes what its `state` holds.
+* @see https://raf-query.katt.dev/docs/react-router#server-loaders
 */
 function HydrationBoundary(props) {
 	if (props.state === void 0) throw new Error("HydrationBoundary needs `state` here. `client` works only in server components.");
 	return /* @__PURE__ */ jsx(Hydrate, {
-		options: props.options,
 		state: props.state,
 		children: props.children
 	});

package/dist/index-react-server.d.mts

@@ -1,9 +1,10 @@
-import { QueryClientProvider, useQueryClient } from "./provider.mjs";
-import { QueryProvider } from "./query-provider/query-provider.mjs";
-import { useIsFetching } from "./use-is-fetching.mjs";
-import { UseQueryResult, UseQueryResultWithData, useQuery } from "./use-query.mjs";
-import { useWaterfall } from "./use-waterfall.mjs";
+import { QueryDevtools, QueryDevtoolsPanel, QueryDevtoolsPanelProps, QueryDevtoolsProps } from "./devtools.mjs";
+import { QueryClientProvider } from "./provider.mjs";
+import { QueryState, QueryValue, UseQueryOptions } from "./use-query.mjs";
+import { InfiniteQueryState } from "./use-infinite-query.mjs";
 import "./index-shared.mjs";
+import { HydrationBoundaryProps } from "./hydration-boundary/hydration-boundary.mjs";
 import { HydrationBoundary } from "./hydration-boundary/hydration-boundary-react-server.mjs";
+import { bindUseQueryClient, useInfiniteQuery, useIsFetching, useQuery, useQueryClient } from "./react-server-hooks.mjs";
 export * from "@raf-query/core";
-export { HydrationBoundary, QueryClientProvider, QueryProvider, type UseQueryResult, type UseQueryResultWithData, useIsFetching, useQuery, useQueryClient, useWaterfall };
+export { HydrationBoundary, type HydrationBoundaryProps, type InfiniteQueryState, QueryClientProvider, QueryDevtools, QueryDevtoolsPanel, type QueryDevtoolsPanelProps, type QueryDevtoolsProps, type QueryState, type QueryValue, type UseQueryOptions, bindUseQueryClient, useInfiniteQuery, useIsFetching, useQuery, useQueryClient };

package/dist/index-react-server.mjs

@@ -1,8 +1,6 @@
-import { QueryClientProvider, useQueryClient } from "./provider.mjs";
-import { QueryProvider } from "./query-provider/query-provider.mjs";
-import { useIsFetching } from "./use-is-fetching.mjs";
-import { useQuery } from "./use-query.mjs";
-import { useWaterfall } from "./use-waterfall.mjs";
+import { QueryClientProvider } from "./provider.mjs";
+import { QueryDevtools, QueryDevtoolsPanel } from "./devtools.mjs";
 import { HydrationBoundary } from "./hydration-boundary/hydration-boundary-react-server.mjs";
+import { bindUseQueryClient, useInfiniteQuery, useIsFetching, useQuery, useQueryClient } from "./react-server-hooks.mjs";
 export * from "@raf-query/core";
-export { HydrationBoundary, QueryClientProvider, QueryProvider, useIsFetching, useQuery, useQueryClient, useWaterfall };
+export { HydrationBoundary, QueryClientProvider, QueryDevtools, QueryDevtoolsPanel, bindUseQueryClient, useInfiniteQuery, useIsFetching, useQuery, useQueryClient };

package/dist/index-shared.d.mts

@@ -1,7 +1,6 @@
-import { QueryClientProvider, useQueryClient } from "./provider.mjs";
-import { QueryProvider } from "./query-provider/query-provider.mjs";
-import { useIsFetching } from "./use-is-fetching.mjs";
-import { UseQueryResult, UseQueryResultWithData, useQuery } from "./use-query.mjs";
-import { useWaterfall } from "./use-waterfall.mjs";
+import { QueryDevtools, QueryDevtoolsPanel, QueryDevtoolsPanelProps, QueryDevtoolsProps } from "./devtools.mjs";
+import { QueryClientProvider } from "./provider.mjs";
+import { QueryState, QueryValue, UseQueryOptions } from "./use-query.mjs";
+import { InfiniteQueryState } from "./use-infinite-query.mjs";
 export * from "@raf-query/core";
-export { QueryClientProvider, QueryProvider, type UseQueryResult, type UseQueryResultWithData, useIsFetching, useQuery, useQueryClient, useWaterfall };
+export { type InfiniteQueryState, QueryClientProvider, QueryDevtools, QueryDevtoolsPanel, type QueryDevtoolsPanelProps, type QueryDevtoolsProps, type QueryState, type QueryValue, type UseQueryOptions };

package/dist/index-shared.mjs

@@ -1,7 +1,4 @@
-import { QueryClientProvider, useQueryClient } from "./provider.mjs";
-import { QueryProvider } from "./query-provider/query-provider.mjs";
-import { useIsFetching } from "./use-is-fetching.mjs";
-import { useQuery } from "./use-query.mjs";
-import { useWaterfall } from "./use-waterfall.mjs";
+import { QueryClientProvider } from "./provider.mjs";
+import { QueryDevtools, QueryDevtoolsPanel } from "./devtools.mjs";
 export * from "@raf-query/core";
-export { QueryClientProvider, QueryProvider, useIsFetching, useQuery, useQueryClient, useWaterfall };
+export { QueryClientProvider, QueryDevtools, QueryDevtoolsPanel };

package/dist/index.d.mts

@@ -1,9 +1,10 @@
+import { QueryDevtools, QueryDevtoolsPanel, QueryDevtoolsPanelProps, QueryDevtoolsProps } from "./devtools.mjs";
 import { QueryClientProvider, useQueryClient } from "./provider.mjs";
-import { QueryProvider } from "./query-provider/query-provider.mjs";
-import { useIsFetching } from "./use-is-fetching.mjs";
-import { UseQueryResult, UseQueryResultWithData, useQuery } from "./use-query.mjs";
-import { useWaterfall } from "./use-waterfall.mjs";
+import { QueryState, QueryValue, UseQueryOptions, useQuery } from "./use-query.mjs";
+import { InfiniteQueryState, useInfiniteQuery } from "./use-infinite-query.mjs";
 import "./index-shared.mjs";
-import { HydrationBoundary } from "./hydration-boundary/hydration-boundary.mjs";
+import { HydrationBoundary, HydrationBoundaryProps } from "./hydration-boundary/hydration-boundary.mjs";
+import { useIsFetching } from "./use-is-fetching.mjs";
+import { bindUseQueryClient } from "./bind.mjs";
 export * from "@raf-query/core";
-export { HydrationBoundary, QueryClientProvider, QueryProvider, type UseQueryResult, type UseQueryResultWithData, useIsFetching, useQuery, useQueryClient, useWaterfall };
+export { HydrationBoundary, type HydrationBoundaryProps, type InfiniteQueryState, QueryClientProvider, QueryDevtools, QueryDevtoolsPanel, type QueryDevtoolsPanelProps, type QueryDevtoolsProps, type QueryState, type QueryValue, type UseQueryOptions, bindUseQueryClient, useInfiniteQuery, useIsFetching, useQuery, useQueryClient };

package/dist/index.mjs

@@ -1,8 +1,9 @@
 import { QueryClientProvider, useQueryClient } from "./provider.mjs";
-import { QueryProvider } from "./query-provider/query-provider.mjs";
+import { QueryDevtools, QueryDevtoolsPanel } from "./devtools.mjs";
+import { bindUseQueryClient } from "./bind.mjs";
+import { HydrationBoundary } from "./hydration-boundary/hydration-boundary.mjs";
 import { useIsFetching } from "./use-is-fetching.mjs";
 import { useQuery } from "./use-query.mjs";
-import { useWaterfall } from "./use-waterfall.mjs";
-import { HydrationBoundary } from "./hydration-boundary/hydration-boundary.mjs";
+import { useInfiniteQuery } from "./use-infinite-query.mjs";
 export * from "@raf-query/core";
-export { HydrationBoundary, QueryClientProvider, QueryProvider, useIsFetching, useQuery, useQueryClient, useWaterfall };
+export { HydrationBoundary, QueryClientProvider, QueryDevtools, QueryDevtoolsPanel, bindUseQueryClient, useInfiniteQuery, useIsFetching, useQuery, useQueryClient };

package/dist/provider.d.mts

@@ -2,13 +2,19 @@ import { QueryClient } from "@raf-query/core";
 import { ReactNode } from "react";
 //#region src/provider.d.ts
 /**
- * Provides a client to the tree, and refetches its read, stale queries on
- * window focus and reconnect while mounted.
+ * Provides a client to the tree, and runs its features (focus and
+ * reconnect refetching, polling, …) while mounted.
+ *
+ * @see https://raf-query.katt.dev/docs/ssr-and-hydration#the-provider
  */
 export declare function QueryClientProvider(props: {
   readonly children?: ReactNode;
-  readonly client: QueryClient<unknown>;
+  readonly client: QueryClient;
 }): import("react").JSX.Element;
-/** The client from the nearest {@link QueryClientProvider}. */
-export declare function useQueryClient(): QueryClient<unknown>;
+/**
+ * The client from the nearest {@link QueryClientProvider}.
+ *
+ * @see https://raf-query.katt.dev/docs/api-reference#providers
+ */
+export declare function useQueryClient(): QueryClient;
 //#endregion

package/dist/provider.mjs

@@ -1,19 +1,18 @@
 "use client";
+import { mount } from "@raf-query/core/internal";
 import { createContext, use, useEffect } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/provider.tsx
-/**
-* A hook can't know which services the provider's client has, so its verbs
-* take any factory here.
-*/
 const QueryClientContext = createContext(null);
 /**
-* Provides a client to the tree, and refetches its read, stale queries on
-* window focus and reconnect while mounted.
+* Provides a client to the tree, and runs its features (focus and
+* reconnect refetching, polling, …) while mounted.
+*
+* @see https://raf-query.katt.dev/docs/ssr-and-hydration#the-provider
 */
 function QueryClientProvider(props) {
 	const client = props.client;
-	useEffect(() => client.mount(), [client]);
+	useEffect(() => mount(client), [client]);
 	return /* @__PURE__ */ jsx(QueryClientContext, {
 		value: client,
 		children: props.children
@@ -23,9 +22,13 @@ function QueryClientProvider(props) {
 function useOptionalQueryClient() {
 	return use(QueryClientContext);
 }
-/** The client from the nearest {@link QueryClientProvider}. */
+/**
+* The client from the nearest {@link QueryClientProvider}.
+*
+* @see https://raf-query.katt.dev/docs/api-reference#providers
+*/
 function useQueryClient() {
-	const client = use(QueryClientContext);
+	const client = useOptionalQueryClient();
 	if (!client) throw new Error("useQueryClient: no QueryClientProvider above this component");
 	return client;
 }

package/dist/react-server-hooks.d.mts

@@ -0,0 +1,43 @@
+import { useQueryClient as useQueryClient$1 } from "./provider.mjs";
+import { useQuery as useQuery$1 } from "./use-query.mjs";
+import { useInfiniteQuery as useInfiniteQuery$1 } from "./use-infinite-query.mjs";
+import { useIsFetching as useIsFetching$1 } from "./use-is-fetching.mjs";
+import { QueryClient } from "@raf-query/core";
+import { RootOf } from "@raf-query/core/internal";
+//#region src/react-server-hooks.d.ts
+/**
+ * `useQuery` in a server component: throws, since hooks belong in client
+ * components.
+ *
+ * @see https://raf-query.katt.dev/docs/react-server-components
+ */
+export declare const useQuery: typeof useQuery$1;
+/**
+ * `useInfiniteQuery` in a server component: throws, since hooks belong in client
+ * components.
+ *
+ * @see https://raf-query.katt.dev/docs/react-server-components
+ */
+export declare const useInfiniteQuery: typeof useInfiniteQuery$1;
+/**
+ * `useIsFetching` in a server component: throws, since hooks belong in client
+ * components.
+ *
+ * @see https://raf-query.katt.dev/docs/react-server-components
+ */
+export declare const useIsFetching: typeof useIsFetching$1;
+/**
+ * `useQueryClient` in a server component: throws, since hooks belong in client
+ * components.
+ *
+ * @see https://raf-query.katt.dev/docs/react-server-components
+ */
+export declare const useQueryClient: typeof useQueryClient$1;
+/**
+ * `bindUseQueryClient` runs at module level in a file server modules may
+ * import too, so it works here and returns the throwing `useQueryClient`.
+ *
+ * @see https://raf-query.katt.dev/docs/links-and-features#typing-meta-by-its-root
+ */
+export declare function bindUseQueryClient<T>(): () => QueryClient<RootOf<T>>;
+//#endregion

package/dist/react-server-hooks.mjs

@@ -0,0 +1,45 @@
+//#region src/react-server-hooks.ts
+function clientOnly(name) {
+	return () => {
+		throw new Error(`${name} reads in client components: move this into a file with "use client". Server components start queries with load() and send them with <HydrationBoundary>.`);
+	};
+}
+/**
+* `useQuery` in a server component: throws, since hooks belong in client
+* components.
+*
+* @see https://raf-query.katt.dev/docs/react-server-components
+*/
+const useQuery = /* @__PURE__ */ clientOnly("useQuery");
+/**
+* `useInfiniteQuery` in a server component: throws, since hooks belong in client
+* components.
+*
+* @see https://raf-query.katt.dev/docs/react-server-components
+*/
+const useInfiniteQuery = /* @__PURE__ */ clientOnly("useInfiniteQuery");
+/**
+* `useIsFetching` in a server component: throws, since hooks belong in client
+* components.
+*
+* @see https://raf-query.katt.dev/docs/react-server-components
+*/
+const useIsFetching = /* @__PURE__ */ clientOnly("useIsFetching");
+/**
+* `useQueryClient` in a server component: throws, since hooks belong in client
+* components.
+*
+* @see https://raf-query.katt.dev/docs/react-server-components
+*/
+const useQueryClient = /* @__PURE__ */ clientOnly("useQueryClient");
+/**
+* `bindUseQueryClient` runs at module level in a file server modules may
+* import too, so it works here and returns the throwing `useQueryClient`.
+*
+* @see https://raf-query.katt.dev/docs/links-and-features#typing-meta-by-its-root
+*/
+function bindUseQueryClient() {
+	return useQueryClient;
+}
+//#endregion
+export { bindUseQueryClient, useInfiniteQuery, useIsFetching, useQuery, useQueryClient };

package/dist/tanstack-router-browser.d.mts

@@ -5,6 +5,8 @@ import { AnyRouter } from "@tanstack/react-router";
  * The browser build of `@raf-query/react/tanstack-router` (the `browser`
  * export condition): the client half only, so the server's dehydration
  * stream stays out of the app bundle.
+ *
+ * @see https://raf-query.katt.dev/docs/tanstack-start#setup
  */
 export declare function setupRouterIntegration<TRouter extends AnyRouter>(options: RouterIntegrationOptions<TRouter>): void;
 //#endregion

package/dist/tanstack-router-browser.mjs

@@ -4,6 +4,8 @@ import { handleRedirects, setupClient } from "./tanstack-router-shared.mjs";
 * The browser build of `@raf-query/react/tanstack-router` (the `browser`
 * export condition): the client half only, so the server's dehydration
 * stream stays out of the app bundle.
+*
+* @see https://raf-query.katt.dev/docs/tanstack-start#setup
 */
 function setupRouterIntegration(options) {
 	setupClient(options);

package/dist/tanstack-router-shared.d.mts

@@ -1,23 +1,25 @@
-import { DehydrateOptions, DehydratedState, HydrateOptions, QueryClient, QueryHandle } from "@raf-query/core";
+import { DehydrateOptions, DehydratedState, QueryClient, QueryHandle } from "@raf-query/core";
 import { AnyRouter } from "@tanstack/react-router";
 //#region src/tanstack-router-shared.d.ts
 declare module "@tanstack/react-router" {
   interface SerializableExtensions {
     /**
-     * Handles are `{ key, input, data? }`, which the router's serializer
-     * sends as is (`data` is dehydrated anyway, so it is serializable). Its
-     * type check can't see that on its own: keys are
-     * `ReadonlyArray<unknown>`, and the handle type names its factory.
-     * So `beforeLoad` can put handles in route context.
+     * Handles are plain `{ queryKey, input }`, which the router's serializer
+     * sends as is. Its type check can't see that on its own: the handle
+     * type names its factory. So loaders can return handles.
      */
     rafQueryHandle: QueryHandle;
   }
 }
+/**
+ * Options for `setupRouterIntegration`.
+ *
+ * @see https://raf-query.katt.dev/docs/tanstack-start#setup
+ */
 export interface RouterIntegrationOptions<TRouter extends AnyRouter> {
   readonly dehydrateOptions?: DehydrateOptions;
   /** Navigate when a `queryFn` throws `redirect()`. Default `true`. */
   readonly handleRedirects?: boolean;
-  readonly hydrateOptions?: HydrateOptions;
   readonly queryClient: QueryClient;
   readonly router: TRouter;
 }

package/dist/tanstack-router-shared.mjs

@@ -1,34 +1,22 @@
 import { hydrate } from "@raf-query/core";
-import { Predicate } from "effect";
 import { isRedirect } from "@tanstack/react-router";
 //#region src/tanstack-router-shared.ts
 function hasRafQueries(value) {
-	return Predicate.hasProperty(value, "raf") && Predicate.isObject(value.raf);
+	return typeof value === "object" && value !== null && "raf" in value;
 }
-/**
-* Hydrate each state as the server's stream delivers it. Reads the stream
-* directly: `Stream.fromReadableStream` + `QueryCache.hydrateStream` would
-* put Effect's `Stream` and `Queue` in the browser bundle.
-*/
-async function hydrateEach(client, stream, options) {
-	const reader = stream.getReader();
-	for (;;) {
-		const next = await reader.read();
-		if (next.done) return;
-		hydrate(client, next.value, options);
-	}
+/** Hydrate each state as the server's stream delivers it. */
+async function hydrateEach(client, stream) {
+	for await (const state of stream) hydrate(client, state);
 }
 function setupClient(options) {
 	const router = options.router;
 	const client = options.queryClient;
-	const hydrateOptions = options.hydrateOptions;
 	const originalHydrate = router.options.hydrate;
 	router.options.hydrate = async (dehydrated) => {
 		await originalHydrate?.(dehydrated);
 		if (!hasRafQueries(dehydrated)) return;
-		const raf = dehydrated.raf;
-		hydrate(client, raf.initial, hydrateOptions);
-		hydrateEach(client, raf.stream, hydrateOptions).catch((error) => {
+		hydrate(client, dehydrated.raf.initial);
+		hydrateEach(client, dehydrated.raf.stream).catch((error) => {
 			console.error("raf-query: reading the query stream failed", error);
 		});
 	};
@@ -36,11 +24,13 @@ function setupClient(options) {
 function handleRedirects(options) {
 	if (!(options.handleRedirects ?? true)) return;
 	const router = options.router;
+	const handled = /* @__PURE__ */ new WeakSet();
 	options.queryClient.subscribe((event) => {
-		if (event.type === "failed" && isRedirect(event.error)) {
-			const redirect = event.error;
-			redirect.options._fromLocation = router.stores.location.get();
-			router.navigate(router.resolveRedirect(redirect).options);
+		const error = event.entry.state.error;
+		if (event.type === "updated" && isRedirect(error) && !handled.has(error)) {
+			handled.add(error);
+			error.options._fromLocation = router.stores.location.get();
+			router.navigate(router.resolveRedirect(error).options);
 		}
 	});
 }

package/dist/tanstack-router.d.mts

@@ -5,12 +5,14 @@ import { AnyRouter } from "@tanstack/react-router";
  * Connects a query client to a TanStack Router (and TanStack Start) router:
  *
  * - During SSR, sends the cache to the browser with the router's dehydrated
- *   state, then streams entries as they start or settle. Pending entries
- *   cross as promises, so the browser resumes them instead of refetching.
+ *   state, then streams entries as they start. Pending entries cross as
+ *   promises, so the browser resumes them instead of refetching.
  * - Clears the request's cache when the response finishes.
  * - Turns `redirect()` thrown from a `queryFn` into a navigation.
  *
  * Call it in `getRouter`, which runs once per request on the server.
+ *
+ * @see https://raf-query.katt.dev/docs/tanstack-start#setup
  */
 export declare function setupRouterIntegration<TRouter extends AnyRouter>(options: RouterIntegrationOptions<TRouter>): void;
 //#endregion

package/dist/tanstack-router.mjs

@@ -1,17 +1,17 @@
 import { handleRedirects, setupClient } from "./tanstack-router-shared.mjs";
-import { Effect, Exit, Scope, Stream } from "effect";
+import { dehydrateStream, removeAll } from "@raf-query/core";
 //#region src/tanstack-router.ts
 const noop = () => {};
 function setupServer(options) {
 	const router = options.router;
-	const queryClient = options.queryClient;
+	const client = options.queryClient;
 	const originalDehydrate = router.options.dehydrate;
 	let finish = noop;
 	let cleanedUp = false;
 	const teardown = () => {
 		cleanedUp = true;
 		finish();
-		queryClient.clear();
+		removeAll(client);
 	};
 	router.serverSsrLifecycle = {
 		...router.serverSsrLifecycle,
@@ -20,21 +20,17 @@ function setupServer(options) {
 	router.options.dehydrate = async () => {
 		const dehydrated = await originalDehydrate?.();
 		if (cleanedUp) {
-			queryClient.clear();
+			removeAll(client);
 			return;
 		}
-		const scope = Scope.makeUnsafe();
-		const stream = Effect.runSync(queryClient.effect.dehydrateStream(options.dehydrateOptions).pipe(Scope.provide(scope)));
-		finish = () => {
-			finish = noop;
-			Effect.runSync(Scope.close(scope, Exit.void));
-		};
-		router.serverSsr?.onRenderFinished(() => finish());
+		const stream = dehydrateStream(client, options.dehydrateOptions);
+		finish = () => stream.close();
+		router.serverSsr?.onRenderFinished(() => stream.close());
 		return {
 			...dehydrated,
 			raf: {
 				initial: stream.initial,
-				stream: Stream.toReadableStream(stream.updates)
+				stream: stream.updates
 			}
 		};
 	};
@@ -43,12 +39,14 @@ function setupServer(options) {
 * Connects a query client to a TanStack Router (and TanStack Start) router:
 *
 * - During SSR, sends the cache to the browser with the router's dehydrated
-*   state, then streams entries as they start or settle. Pending entries
-*   cross as promises, so the browser resumes them instead of refetching.
+*   state, then streams entries as they start. Pending entries cross as
+*   promises, so the browser resumes them instead of refetching.
 * - Clears the request's cache when the response finishes.
 * - Turns `redirect()` thrown from a `queryFn` into a navigation.
 *
 * Call it in `getRouter`, which runs once per request on the server.
+*
+* @see https://raf-query.katt.dev/docs/tanstack-start#setup
 */
 function setupRouterIntegration(options) {
 	if (options.router.isServer) setupServer(options);

package/dist/tracked.d.mts

@@ -0,0 +1 @@
+import { Thenable } from "@raf-query/core";