Overview

Building on top of the Stream Chat API, the Stream Chat Angular component library includes everything you need to build feature-rich and high-functioning chat user experiences out of the box. The library includes an extensive set of performant and customizable Angular components which allow you to get started quickly with little to no plumbing required. Use cases include team and social messaging and customer support. The library supports:

  • Rich media messages
  • Reactions
  • Image and file uploads
  • Read state
  • Channel and message lists
  • Threads

Start here

Angular tutorial
Build your first Stream Angular chat application.
Theming
Customize the look and feel of the built-in components.
JavaScript client docs
The stream-chat client API the library is built on.

Build with Stream CLI and Agent Skills

The Stream CLI and Agent Skills give AI coding agents the tools and knowledge to work with Stream. There is no dedicated skill pack for Angular yet, but the default skills still help with live documentation and CLI-driven API work.

Install the CLI and the default skills:

curl -fsSL https://getstream.io/cli.sh | bash
getstream skills

Once installed, invoke /stream from your agent. It routes documentation lookups and API operations for you.

Stream Agent Skills can also be installed from skills.sh.

Architecture

The library contains a set of components that contain all of the necessary features to build a performant chat UI. However, it is also possible to provide your own custom components instead of the built-in ones.

If you want to, you can build your own chat UI from scratch but still take advantage of the library by using our services.

flowchart LR
  app[Your app] --> components[Chat components]
  app -. custom UI .-> services[Services]
  components --> services
  services --> client[stream-chat client]
  client <--> api[Stream API]

Check out the instructions below for adding the library to your Angular project.

Installation

We recommend using the component library through a package manager. Stream Chat Angular is based on top of Stream's JavaScript Client.

Install with npm

Angular versions 17-22 are supported

# Not all libraries support Angular 22 yet
npm install stream-chat-angular stream-chat @ngx-translate/core ngx-float-ui@21 --legacy-peer-deps

Supported Node versions: 18+

What's next

Users and tokens
Connect users and authenticate them with tokens.
Customization
Swap the built-in components for your own.
Client state
How the library manages and exposes chat state.
Next
Angular version support