React
Beignet has optional React integrations for server state, URL state, and forms. Each package is independent, so install only the pieces your app needs.
| Package | Use it for |
|---|---|
@beignet/react-query | Typed TanStack Query options, mutations, prefetching, and query keys |
@beignet/nuqs | URL-backed search, filters, tabs, sorting, and pagination |
@beignet/react-hook-form | Typed React Hook Form setup from a contract body schema |
Recommended flow
Use React Query for data fetching and mutations. It uses the client's throwing call() path because TanStack Query already models failed requests through its error channel.
Use nuqs when route query parameters are part of the user experience. It keeps URL state and contract query input aligned.
Use React Hook Form when a form submits to a contract with a body schema. It reuses the same schema for client-side validation.
All React adapters follow the same shape: create the package adapter once, then bind contracts with the returned function.
const rq = createReactQuery(client);
const rhf = createReactHookForm();
const nq = createNuqs();Install
bun add @beignet/react-query @tanstack/react-query
bun add @beignet/nuqs nuqs
bun add @beignet/react-hook-form react-hook-form @hookform/resolvers