Official Angular SDK for Stream Chat
The official Angular components for Stream Chat, a service for building chat applications.
Quick Links
With our component library, you can build a variety of chat use cases, including:
- In-game chat like Overwatch or Fortnite
- Team-style chat like Slack
- Messaging-style chat like WhatsApp or Facebook's Messenger
- Customer support chat like Drift or Intercom
Angular Chat Tutorial
The best way to get started is to follow the Angular Chat Tutorial. It shows you how to use this SDK to build a fully functional chat application and includes common customizations.
Free for Makers
Stream is free for most side and hobby projects. To qualify, your project/company must have no more than 5 team members and earn less than $10k in monthly revenue.
For complete pricing and details visit our Chat Pricing Page.
Docs
The docs provide a brief description about the components and services in the library.
The Angular library is created using the stream-chat-js library. For the most common use cases our services should give a nice abstraction over this library, however you might need it for more advanced customization, the documentation is on our website.
Contributing
We welcome code changes that improve this library or fix a problem. Please make sure to follow all best practices and add tests, if applicable, before submitting a pull request on GitHub. We are pleased to merge your code into the official repository if it meets a need. Make sure to sign our Contributor License Agreement (CLA) first. See our license file for more details.
We are hiring.
We recently closed a $38 million Series B funding round and are actively growing.
Our APIs are used by more than a billion end-users, and by working at Stream, you have the chance to make a huge impact on a team of very strong engineers.
Check out our current openings and apply via Stream's website.
Installation
Install with NPM
v8 is built on stream-chat v10. If you are upgrading from v7, follow the upgrade guide.
Supported Angular versions: Angular 17-22
Zoneless mode isn't yet supported
stream-chat-angular supports both @ngx-translate/core v17 and v18. Use v18 on Angular 18+ and v17 on Angular 17 (v18 requires Angular 18 or newer).
Run this command if you are using Angular 22:
npm install stream-chat-angular stream-chat @ngx-translate/core ngx-float-ui@21 --legacy-peer-deps
ngx-float-ui does not have an Angular 22 build yet, so install its latest (v21) with --legacy-peer-deps until an Angular 22 release is available.
Run this command if you are using Angular 21:
npm install stream-chat-angular stream-chat @ngx-translate/core ngx-float-ui@21
Run this command if you are using Angular 20:
npm install stream-chat-angular stream-chat @ngx-translate/core ngx-float-ui@20
Run this command if you are using Angular 19:
npm install stream-chat-angular stream-chat @ngx-translate/core ngx-float-ui@19
Run this command if you are using Angular 18:
npm install stream-chat-angular stream-chat @ngx-translate/core ngx-float-ui@18
Run this command if you are using Angular 17:
npm install stream-chat-angular stream-chat @ngx-translate/core@17 ngx-float-ui@17
Supported Node versions: 22.18+
Sample App
This repository includes a sample app to test our library.
To test the app:
Create a file named .env in the root directory with the following content:
STREAM_API_KEY=<Your API key>
STREAM_USER_ID=<Your user ID>
STREAM_USER_TOKEN=<Your user token>
The easiest way to generate a token for testing purposes is to use our token generator.
Run npm install to install dependencies.
Run npm start and navigate to http://localhost:4200/.
Customization examples
This repository includes a sample app that showcases how you can provide your own template for different components within the SDK:
To run the app:
Create a file named .env in the root directory with the following content:
STREAM_API_KEY=<Your API key>
STREAM_USER_ID=<Your user ID>
STREAM_USER_TOKEN=<Your user token>
Run npm install to install dependencies.
Run npm run start:customizations-example and navigate to http://localhost:4200/.
Local development
This repository includes a sample app to test our library.
To test the app:
Create a file named .env in the root directory with the following content:
STREAM_API_KEY=<Your API key>
STREAM_USER_ID=<Your user ID>
STREAM_USER_TOKEN=<Your user token>
Run npm install in the root of the project. You can use the npm run start:dev command to start the SampleApp with automatic reloading.
