@raf-query/react 0.9.0 → 0.9.1

package/CHANGELOG.md

@@ -1,19 +1,29 @@
 # Changelog
 
+## [0.9.1](https://github.com/KATT/raf-query/compare/0.9.0...0.9.1) (2026-10-15)
+
+### Features
+
+* **react:** add @raf-query/react/react-router for React Router Framework Mode ([#146](https://github.com/KATT/raf-query/issues/146)) ([4e02c80](https://github.com/KATT/raf-query/commit/4e02c809d8be1eea33935c9f0b6abc38cbdce25c)), references [#130](https://github.com/KATT/raf-query/issues/130) [#148](https://github.com/KATT/raf-query/issues/148) [#148](https://github.com/KATT/raf-query/issues/148)
+
+### Miscellaneous Chores
+
+* **lint:** ban member access on use(), in code and Markdown fences ([#155](https://github.com/KATT/raf-query/issues/155)) ([b7b37b4](https://github.com/KATT/raf-query/commit/b7b37b4f6d83c0a232697d05b177c33bdea11df1)), references [#140](https://github.com/KATT/raf-query/issues/140)
+
 ## [0.9.0](https://github.com/KATT/raf-query/compare/0.8.0...0.9.0) (2026-10-15)
 
 ### ⚠ BREAKING CHANGES
 
-* useQuery returns the data for a handle from ensure or fetch ([#144](https://github.com/KATT/raf-query/issues/144))
+- useQuery returns the data for a handle from ensure or fetch ([#144](https://github.com/KATT/raf-query/issues/144))
 
 ### Features
 
-* useQuery returns the data for a handle from ensure or fetch ([#144](https://github.com/KATT/raf-query/issues/144)) ([1845244](https://github.com/KATT/raf-query/commit/18452443ba61c205a53c4f71d60ec99a9b8620a7)), references [#142](https://github.com/KATT/raf-query/issues/142)
+- useQuery returns the data for a handle from ensure or fetch ([#144](https://github.com/KATT/raf-query/issues/144)) ([1845244](https://github.com/KATT/raf-query/commit/18452443ba61c205a53c4f71d60ec99a9b8620a7)), references [#142](https://github.com/KATT/raf-query/issues/142)
 
 ### Documentation
 
-* call the early API a note about minor releases ([#143](https://github.com/KATT/raf-query/issues/143)) ([2d79eed](https://github.com/KATT/raf-query/commit/2d79eed7b107b6d16898ebb203a9bdfcfb3856c4))
-* show prefetch and ensure, and make list queries infinite ([#140](https://github.com/KATT/raf-query/issues/140)) ([25cfaa0](https://github.com/KATT/raf-query/commit/25cfaa08f9f192af7efded1269f4ae8a9e5f1026))
+- call the early API a note about minor releases ([#143](https://github.com/KATT/raf-query/issues/143)) ([2d79eed](https://github.com/KATT/raf-query/commit/2d79eed7b107b6d16898ebb203a9bdfcfb3856c4))
+- show prefetch and ensure, and make list queries infinite ([#140](https://github.com/KATT/raf-query/issues/140)) ([25cfaa0](https://github.com/KATT/raf-query/commit/25cfaa08f9f192af7efded1269f4ae8a9e5f1026))
 
 ## [0.8.0](https://github.com/KATT/raf-query/compare/0.7.12...0.8.0) (2026-10-15)
 

package/README.md

@@ -129,6 +129,7 @@ function PostPage() {
 | `@raf-query/react`                 | `QueryClient`, `QueryClientProvider`, `useQuery`, `useWaterfall`, `useIsFetching`, and all of core |
 | `@raf-query/react/tanstack-router` | [TanStack Start and Router](https://raf-query.katt.dev/docs/tanstack-start) SSR streaming          |
 | `@raf-query/react/rsc`             | [React Server Components](https://raf-query.katt.dev/docs/nextjs), such as the Next.js App Router  |
+| `@raf-query/react/react-router`    | [React Router](https://raf-query.katt.dev/docs/react-router) Framework Mode loaders                |
 | `@raf-query/react/devtools`        | The [devtools](https://raf-query.katt.dev/docs/devtools) panel; omit the element to tree-shake it  |
 
 ## License

package/dist/react-router.d.mts

@@ -0,0 +1,35 @@
+import { DehydratedState, HydrateOptions } from "@raf-query/core";
+import { ReactNode } from "react";
+//#region src/react-router.d.ts
+/**
+ * Writes a loader's dehydrated cache into the browser (or SSR) client.
+ * Use it with React Router Framework Mode: start queries in the loader,
+ * `dehydrate` the request's client, and pass that state here.
+ *
+ * ```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.
+ */
+export declare function HydrationBoundary(props: {
+  readonly children?: ReactNode;
+  readonly options?: HydrateOptions;
+  readonly state: DehydratedState;
+}): import("react").JSX.Element;
+//#endregion

package/dist/react-router.mjs

@@ -0,0 +1,39 @@
+"use client";
+import { Hydrate } from "./hydrate.mjs";
+import { jsx } from "react/jsx-runtime";
+//#region src/react-router.tsx
+/**
+* Writes a loader's dehydrated cache into the browser (or SSR) client.
+* Use it with React Router Framework Mode: start queries in the loader,
+* `dehydrate` the request's client, and pass that state here.
+*
+* ```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.
+*/
+function HydrationBoundary(props) {
+	return /* @__PURE__ */ jsx(Hydrate, {
+		options: props.options,
+		state: props.state,
+		children: props.children
+	});
+}
+//#endregion
+export { HydrationBoundary };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@raf-query/react",
-  "version": "0.9.0",
+  "version": "0.9.1",
   "description": "React bindings for raf-query, a render-as-you-fetch query library",
   "keywords": [
     "query",
@@ -35,6 +35,7 @@
     ".": "./dist/index.mjs",
     "./devtools": "./dist/devtools.mjs",
     "./rsc": "./dist/rsc.mjs",
+    "./react-router": "./dist/react-router.mjs",
     "./tanstack-router": {
       "workerd": "./dist/tanstack-router.mjs",
       "worker": "./dist/tanstack-router.mjs",
@@ -46,7 +47,7 @@
     }
   },
   "dependencies": {
-    "@raf-query/core": "0.9.0"
+    "@raf-query/core": "0.9.1"
   },
   "peerDependencies": {
     "@tanstack/react-router": "^1.170.0",