# @ic-reactor/react

`@ic-reactor/react` is the recommended package for React applications. It
re-exports the runtime classes from [`@ic-reactor/core`](https://ic-reactor.b3pay.net/v3/packages/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

```bash
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](https://ic-reactor.b3pay.net/v3/framework/react-setup)
  [createActorHooks](https://ic-reactor.b3pay.net/v3/reference/createactorhooks/overview)
  [createAuthHooks](https://ic-reactor.b3pay.net/v3/reference/createauthhooks/overview)
  [Reactor Hooks](https://ic-reactor.b3pay.net/v3/reference/reactorhooks)
  [Factory Functions](https://ic-reactor.b3pay.net/v3/reference/factories/overview)
**Tip:** If you do not need React-specific hooks, install
  [@ic-reactor/core](https://ic-reactor.b3pay.net/v3/packages/core) instead and use the runtime classes
  directly.

## Quick Start

```tsx
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)
```

## See Also

- [Queries](https://ic-reactor.b3pay.net/v3/framework/queries) — Standard query patterns
- [Mutations](https://ic-reactor.b3pay.net/v3/framework/mutations) — Update and invalidation patterns
- [Query Caching](https://ic-reactor.b3pay.net/v3/framework/query-caching) — Cache behavior and invalidation
- [@ic-reactor/core](https://ic-reactor.b3pay.net/v3/packages/core) — Runtime layer re-exported by this package