> ## Documentation Index
> Fetch the complete documentation index at: https://docs.daily.co/llms.txt
> Use this file to discover all available pages before exploring further.

# Daily React

> Daily React is a library of hooks and components for building custom Daily video and audio apps in React.

Daily React (`@daily-co/daily-react`) is a library of React hooks and components for building [custom](/docs/daily-js/concepts/call-modes#call-object-mode) Daily applications. It wraps [`daily-js`](/docs/daily-js/introduction) so that call state, events, and media become first-class React: reactive hooks instead of manual event listeners, and components instead of hand-managed `<video>` and `<audio>` tags.

<Tip>
  Using Daily React is optional but strongly recommended. We use it internally: [Daily Prebuilt](/docs/prebuilt), our ready-to-use embeddable call UI, is built on Daily React. It is our preferred way to build with Daily and React, and it is tested extensively.
</Tip>

## Start here

<CardGroup cols={2}>
  <Card title="Introduction" icon="circle-info" href="/docs/daily-react/docs">
    What Daily React is, when to use it, and how it relates to daily-js.
  </Card>

  <Card title="Quickstart" icon="rocket" href="/docs/daily-react/docs/quickstart">
    Build a working multi-participant call in React, end to end.
  </Card>

  <Card title="Installation" icon="wrench" href="/docs/daily-react/docs/installation">
    Install the package and its peer dependencies, and set up the provider.
  </Card>

  <Card title="Thinking in Daily React" icon="brain" href="/docs/daily-react/docs/thinking-in-daily-react">
    The reactive mental model that makes the rest of the library click.
  </Card>
</CardGroup>

## Components

Daily React ships a small set of components that handle the parts of a call that touch the DOM directly: rendering video and routing audio.

* [DailyProvider](/reference/daily-react/daily-provider) — gives every component access to the call object
* [DailyVideo](/reference/daily-react/daily-video) — renders a participant's video track
* [DailyAudio](/reference/daily-react/daily-audio) — plug-and-play audio for the whole call
* [DailyAudioTrack](/reference/daily-react/daily-audio-track) — a single audio track, for custom audio layouts

## Hooks

Every hook reads from Daily React's internal store and re-renders your component only when the slice it reads changes. The full per-hook API lives in the [reference](/reference/daily-react/daily-provider); the [guides](/docs/daily-react/docs/thinking-in-daily-react) show how to combine them.

**Call and meeting state**

* [useDaily()](/reference/daily-react/use-daily) — the underlying `daily-js` call object
* [useCallObject()](/reference/daily-react/use-call-object) — create a call object for a custom UI
* [useCallFrame()](/reference/daily-react/use-call-frame) — create a Prebuilt iframe instance
* [useDailyError()](/reference/daily-react/use-daily-error) — the most recent error and nonfatal-error
* [useMeetingState()](/reference/daily-react/use-meeting-state) — the meeting lifecycle state
* [useMeetingSessionState()](/reference/daily-react/use-meeting-session-state) — shared meeting session data
* [useRoom()](/reference/daily-react/use-room) — room and token configuration
* [useRoomExp()](/reference/daily-react/use-room-exp) — automatic ejection time and countdown

**Participants**

* [useParticipantIds()](/reference/daily-react/use-participant-ids) — filtered, sorted list of participant IDs
* [useParticipantProperty()](/reference/daily-react/use-participant-property) — a single participant property
* [useParticipantCounts()](/reference/daily-react/use-participant-counts) — present and hidden counts
* [useLocalSessionId()](/reference/daily-react/use-local-session-id) — the local participant's session ID
* [useActiveSpeakerId()](/reference/daily-react/use-active-speaker-id) — the current active speaker
* [useWaitingParticipants()](/reference/daily-react/use-waiting-participants) — manage the waiting room
* [usePermissions()](/reference/daily-react/use-permissions) — what a participant can send, receive, and administer

**Events**

* [useDailyEvent()](/reference/daily-react/use-daily-event) — subscribe to any `daily-js` event
* [useThrottledDailyEvent()](/reference/daily-react/use-throttled-daily-event) — batch high-frequency events

**Media and devices**

* [useDevices()](/reference/daily-react/use-devices) — cameras, mics, speakers, and their states
* [useMediaTrack()](/reference/daily-react/use-media-track) — a participant's track and its state
* [useInputSettings()](/reference/daily-react/use-input-settings) — background blur and other input processors
* [useScreenShare()](/reference/daily-react/use-screen-share) — start, stop, and observe screen shares
* [useAudioLevelObserver()](/reference/daily-react/use-audio-level-observer) — a participant's volume, in real time
* [useReceiveSettings()](/reference/daily-react/use-receive-settings) — per-participant receive quality
* [useSendSettings()](/reference/daily-react/use-send-settings) — simulcast layer encodings

**Messaging and features**

* [useAppMessage()](/reference/daily-react/use-app-message) — send and receive custom data messages
* [useRecording()](/reference/daily-react/use-recording) — start, stop, and observe recordings
* [useLiveStreaming()](/reference/daily-react/use-live-streaming) — start, stop, and observe RTMP live streams
* [useTranscription()](/reference/daily-react/use-transcription) — real-time transcription and captions

**Quality and diagnostics**

* [useNetwork()](/reference/daily-react/use-network) — network quality, topology, and stats
* [useCPULoad()](/reference/daily-react/use-cpu-load) — CPU pressure during a call