Overview

Stream Chat React is a component library built on the Stream Chat API. It provides a set of performant, customizable React components for common chat experiences such as team and social messaging, virtual events, livestreaming, and customer support.

Key features include:

  • Rich media messages
  • Reactions
  • Threads and quoted replies
  • Text input commands (ex: Giphy and @mentions)
  • Image and file uploads
  • Video playback
  • Audio recording
  • Read state and typing indicators
  • Channel and message lists

Best Practices

  • Start with the official tutorial to align on recommended structure before customizing UI.
  • Treat the component library as the default source of truth and only replace parts that need bespoke UX.
  • Use built-in features (threads, reactions, uploads, indicators) before building custom equivalents.
  • Keep customization scoped to theming and component overrides to stay compatible with updates.
  • Validate your target browsers against the supported list to avoid unexpected UI issues.

Where to Get Started

If you’re new, start with the tutorial, then move on to the getting started guide.

Most integrations only need our Theming and Customizing Components guides.

Architecture

The SDK is built around React context providers and hooks. You can use the exported hooks (for example, useChatContext and useChannelStateContext) in your own components to read state and trigger actions while staying subscribed to updates.

Use the left navigation to explore topics, and start with installation and basic setup.

Supported Platforms

Our React Chat SDK can run on all modern browsers and platforms released after April 2024. Here is the list of supported platforms:

  • Chrome 124+
  • Firefox 124+
  • Edge 124+
  • Safari and Mobile Safari 17.4+

Although the SDK works on other exotic and older browser versions, these are the ones we officially support and test against, so we recommend using them for the best experience.