@ic-reactor/react

@ic-reactor/react is the recommended package for React applications. It re-exports the runtime classes from @ic-reactor/core and adds hook factories, auth hooks, direct reactor hooks, and reusable query factories designed around TanStack Query.

Why Use This Package

You want idiomatic React hooks for queries, mutations, suspense, and auth.
You want ClientManager, Reactor, and DisplayReactor from one package.
You want to keep your app code focused on components instead of manual query wiring.

Installation

pnpm add @ic-reactor/react @tanstack/react-query @icp-sdk/core

# Optional: Internet Identity support
pnpm add @icp-sdk/auth

What’s Included

React Setup Complete app wiring with QueryClientProvider, ClientManager, and a Reactor instance.

createActorHooks Generate typed canister hooks from a bound reactor instance.

createAuthHooks React hooks for login, logout, agent state, and user principal access.

Reactor Hooks Direct hooks that accept a reactor instance explicitly.

Factory Functions Reusable query and mutation factories for shared data access patterns.

Quick Start

import { ClientManager, Reactor, createActorHooks } from "@ic-reactor/react"
import { QueryClient } from "@tanstack/react-query"
import { idlFactory, type _SERVICE } from "./declarations/backend"

const queryClient = new QueryClient()
const clientManager = new ClientManager({ queryClient, withCanisterEnv: true })

const backend = new Reactor<_SERVICE>({
  clientManager,
  idlFactory,
  name: "backend",
})

export const { useActorQuery, useActorMutation } = createActorHooks(backend)