# React (/docs/reference/react)

```ts
import { … } from "@monarcode/session-kit/react";
```

Guide: [Read the session in React](/docs/getting-started#4-read-the-session-in-react).

## Functions [#functions]

### createAuthHooks [#createauthhooks]

Creates React hooks typed for one auth client. Each call has its own context, so an app with several clients calls it once per client. With TanStack Router, pass `useRouterAuth` as `useClient` instead of rendering `AuthProvider`. See [`AuthHooksOptions`](#authhooksoptions).

### useMirrorAuth [#usemirrorauth]

Creates a `createMirrorAuth` client once, from the session the page was rendered with, and keeps it in step with your server. Call it in the component that renders `AuthProvider`.

## Types [#types]

### AuthHooks [#authhooks]

The provider and hooks [`createAuthHooks`](#createauthhooks) returns, typed for one client.

### AuthHooksOptions [#authhooksoptions]

Options for [`createAuthHooks`](#createauthhooks).

### AuthHooksOptions

Options for createAuthHooks.

| Prop         | Type       | Description                                                                                                                                                                                                                                                                                                      |
| ------------ | ---------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `useClient?` | `function` | Finds the client some other way than `AuthProvider`, such as from router context with `useRouterAuth`. It's called as a hook, inside every hook, on every render. The hooks then need no `AuthProvider`, so mount the client another way, such as with `connectAuth`. Default: reads the nearest `AuthProvider`. |

### AuthProviderProps [#authproviderprops]

Props for the `AuthProvider` that [`createAuthHooks`](#createauthhooks) returns.

### AuthProviderProps

Props for the `AuthProvider` that createAuthHooks returns.

| Prop        | Type        | Description                                                    |
| ----------- | ----------- | -------------------------------------------------------------- |
| `client`    | `Client`    | The client for this tree. On a server, create one per request. |
| `children?` | `ReactNode` | The tree that reads `client` through the hooks.                |

### AuthSource [#authsource]

What the React bindings need from an auth client: its `state`, and `mount` to start background work while rendered. A `createAuth` or `createMirrorAuth` client fits.

### StateOf [#stateof]

The state type of a client: what `useAuth()` returns (`AuthState`).