@daily-co/daily-react) is a library of React hooks and components for building custom Daily applications. It wraps daily-js 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.
Start here
Introduction
What Daily React is, when to use it, and how it relates to daily-js.
Quickstart
Build a working multi-participant call in React, end to end.
Installation
Install the package and its peer dependencies, and set up the provider.
Thinking in Daily React
The reactive mental model that makes the rest of the library click.
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 — gives every component access to the call object
- DailyVideo — renders a participant’s video track
- DailyAudio — plug-and-play audio for the whole call
- DailyAudioTrack — 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; the guides show how to combine them. Call and meeting state- useDaily() — the underlying
daily-jscall object - useCallObject() — create a call object for a custom UI
- useCallFrame() — create a Prebuilt iframe instance
- useDailyError() — the most recent error and nonfatal-error
- useMeetingState() — the meeting lifecycle state
- useMeetingSessionState() — shared meeting session data
- useRoom() — room and token configuration
- useRoomExp() — automatic ejection time and countdown
- useParticipantIds() — filtered, sorted list of participant IDs
- useParticipantProperty() — a single participant property
- useParticipantCounts() — present and hidden counts
- useLocalSessionId() — the local participant’s session ID
- useActiveSpeakerId() — the current active speaker
- useWaitingParticipants() — manage the waiting room
- usePermissions() — what a participant can send, receive, and administer
- useDailyEvent() — subscribe to any
daily-jsevent - useThrottledDailyEvent() — batch high-frequency events
- useDevices() — cameras, mics, speakers, and their states
- useMediaTrack() — a participant’s track and its state
- useInputSettings() — background blur and other input processors
- useScreenShare() — start, stop, and observe screen shares
- useAudioLevelObserver() — a participant’s volume, in real time
- useReceiveSettings() — per-participant receive quality
- useSendSettings() — simulcast layer encodings
- useAppMessage() — send and receive custom data messages
- useRecording() — start, stop, and observe recordings
- useLiveStreaming() — start, stop, and observe RTMP live streams
- useTranscription() — real-time transcription and captions
- useNetwork() — network quality, topology, and stats
- useCPULoad() — CPU pressure during a call