# @explita/actyx-rpc-react
> React client for Actyx RPC — type-safe queries, mutations, streaming, and server actions
Latest version **0.2.0** (published 2026-09-23) · MIT license · 0 weekly downloads
## Install
```sh
npm install @explita/actyx-rpc-react
pnpm add @explita/actyx-rpc-react
yarn add @explita/actyx-rpc-react
bun add @explita/actyx-rpc-react
```
## Health
**Score 65/100 (B)** — status: active.
Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score.
Warnings: low downloads; pre 1.0.
## Facts
| | |
|---|---|
| Version | 0.2.0 |
| Published | 2026-09-23 |
| First published | 2026-09-20 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 299.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Explita |
| Maintainers | explita |
| Keywords | actyx, rpc, typescript, react, hooks, query, mutation, sse, websocket |
## Links
- npm: https://www.npmjs.com/package/@explita/actyx-rpc-react
- Repository: https://github.com/explita/actyx-rpc
- Homepage: https://actyx.explita.ng
- Issues: https://github.com/explita/actyx-rpc/issues
- npm.io page: https://npm.io/package/@explita/actyx-rpc-react
## Alternatives
- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads
## Recent versions
- 0.2.0 (latest) — 2026-09-23
- 0.1.0 — 2026-09-20
## README
# Actyx RPC React
**React client for Actyx RPC — type-safe queries, mutations, streaming, and server actions.**
`@explita/actyx-rpc-react` provides first-class React hooks and client-side caching for [Actyx RPC](https://github.com/explita/actyx-rpc). It enables end-to-end type safety from server procedures to React components with zero code generation.
[](https://www.npmjs.com/package/@explita/actyx-rpc-react)
[](https://github.com/explita/actyx-rpc/blob/main/LICENSE)
[](https://actyx.explita.ng)
---
## 📖 Complete Documentation
Visit our documentation portal for the complete guide, hook recipes, streaming patterns, and API references:
👉 **[actyx.explita.ng](https://actyx.explita.ng)**
---
## Installation
```bash
npm install @explita/actyx-rpc-react @explita/actyx-rpc
```
> **Peer Dependency**: Requires `react` version `^19` (or `^18.2.0`).
---
## Quick Start
### 1. Setup Provider & QueryClient
Wrap your application root (or layout) with `ActyxProvider`:
```tsx
// app/providers.tsx
"use client";
import { useState } from "react";
import { ActyxProvider, QueryClient } from "@explita/actyx-rpc-react";
export function Providers({ children }: { children: React.ReactNode }) {
const [queryClient] = useState(() => new QueryClient({
queries: {
staleTime: "5m",
},
}));
return (
{children}
);
}
```
### 2. Query and Mutate Procedures
Use your typed server procedures directly inside React components:
```tsx
// components/user-profile.tsx
"use client";
import { useQuery, useMutation } from "@explita/actyx-rpc-react";
import { getUserProfile, updateUserProfile } from "@/server/procedures";
export function UserProfile({ userId }: { userId: string }) {
// Queries automatically infer inputs, outputs, and status
const { data, isLoading, error } = useQuery(getUserProfile, {
input: { id: userId },
});
// Mutations provide async execution and reactive states
const { mutate, isPending } = useMutation(updateUserProfile, {
onSuccess(updated) {
console.log("Profile updated:", updated.name);
},
});
if (isLoading) return
Loading profile...
;
if (error) return
Error: {error.message}
;
return (
{data?.name}
{data?.email}
);
}
```
---
## Features
- ⚡ **End-to-End Type Safety**: Input validation and output types flow seamlessly from server procedures to hooks.
- 🎯 **Core Hooks**: `useQuery`, `useMutation`, and `useSuspenseQuery` with automatic unwrap and selection helpers.
- 📦 **Parallel Fetching**: `useQueries` with per-element contextual type inference and IDE autocompletion.
- 📜 **Pagination & Infinite Lists**: `useInfiniteQuery` and `usePaginatedQuery` with bidirectional selection sync.
- 🌊 **Real-Time Streaming**: First-class `useSSE` (Server-Sent Events) and `useWS` (WebSocket) hooks.
- 🔄 **Stream Pagination**: `useSSEInfiniteQuery` and `useWSInfiniteQuery` for real-time live feeds.
- 🔍 **Activity Tracking**: `useIsFetching` and `useIsMutating` indicators for global background state.
- 💾 **Intelligent Caching**: `QueryClient` supports TTL, stale windows, optimistic updates, and tag invalidation.
---
## 💖 Support the Mission
Actyx RPC is built to simplify building type-safe, distributed systems with minimal boilerplate. If it has helped you build better apps faster, please consider supporting the project!
### 🚀 Ways to Contribute
- **Give us a ⭐**: It helps others discover the project on GitHub.
- **Join the Discussion**: Report [bugs](https://github.com/explita/actyx-rpc/issues) or suggest new [features](https://github.com/explita/actyx-rpc/discussions).
- **Spread the Word**: Share your experience with Actyx RPC on social media.
---
_Source: https://npm.io/package/@explita/actyx-rpc-react · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
