React Chat SDK Messaging Components
The Stream Chat React SDK is a rich set of performant, customizable React components. Out of the box, you get everything necessary to build a fully functioning chat user experience: rich message lists, messages, reactions, threads, image and video attachments, and channel previews.
React Social Chat Messaging
Build feature rich chat messaging into your app with a familiar social style that will remind you of iMessage, Facebook or Whatsapp. Try the demo.
React Team Chat
Building an app for your team? Need chat as a feature to support other team functionality? Stream’s Team Chat UI is drop-in ready for your project. Try the demo.
Ready-To-Use React Components
- Message list
- Message input
- Channel list
- Channel header
- Threads
Channel List
- Load channels on demand
- Last message previews
- Automatic channel sorting
- Channel search
Message List
- UI Virtualization
- Date separators
- Group messages by user
- Threading and replies
- Soft deleted messages
Message Component
- Avatar
- Timestamp
- Reactions
- Message actions
- Mentions
- Markdown support
- Message editing
Message Input
- Slash commands support
- Emoji picker and autocomplete
- File uploads
- Image upload previews
- Autocomplete mentions
Attachments
- URL previews
- Giphies
- Images/image galleries
- Video attachment player
- Video links player
Extensible and Customizable
- Customize with CSS variables
- Custom component props
- Custom React hooks
Compliant
- I18n with with 10+ translations
- ARIA attributes
Flexibility & Reusability
Set up your UI exactly the way you want it
Our React SDK Components expose a rich set of customization properties which let you tweak numerous logical and visual aspects. Pass your own custom React component for an avatar, or replace the entire Message component with the one your team needs. We also expose various lifecycle callbacks which let you inject additional logic to be performed when a message is sent.
Chat is active, so we've included ways to pay attention to performance with PureComponent.
Streami18n allows for built-in translations for components across multiple languages.
Contact Us
Hi! We are always busy working on our React SDK here at Stream. Any feedback that other developers can provide will be very helpful.
Would you consider leaving some feedback on what you need from Stream?
Give Developer Feedback
Didn’t find what you’re looking for? Get in touch with our Developer Advocacy team to let us know what we can do to help:
Activity Feeds
Enterprise