URL: /docs/sdk-react

---
title: "@rill/react"
description: "React hook for @rill/client. No extra WebRTC."
icon: component
---

{/* Generated by docs/scripts/generate-sdk-docs.mjs via TypeDoc from sdk/react/src/index.ts. Do not edit. */}

`useCall` returns the `@rill/client` [`Call`](/sdk-client), or `null` until connected. It re-renders on `local`, `remote`, `state`, `ended`, and `error`. **Do not** subscribe to `data` here — call `call.on("data")` yourself. Walkthrough: [Your app](/your-app).

```sh
npm i @rill/react @rill/client
```

Until a `v*` tag exists, use this repo's `sdk/` workspace.

```ts
import { useCall } from "@rill/react";

export function Stage({ url, token }: { url: string; token: string }) {
  const call = useCall({ url, token });
  if (!call) {
    return null;
  }
  return call.state;
}
```

## Hook

```ts
useCall(opts: ConnectOptions): Call | null
```

- **`useCall`** — Connects once and re-renders on `local`, `remote`, `state`, `ended`, and `error`. Do not subscribe to `data` here: rrweb-rate messages would re-render on every payload. Apps that need data call `call.on("data")` themselves. No `useDataChannel`. Returns the `@rill/client` Call, or `null` until connected.