The QuickBlox React Chat UIKit is a set of ready-made components and tools for developing functional and powerful chat features in React applications.
Group dialog | Private dialog | |
---|---|---|
File sharing | ✓ | ✓ |
Voice message | ✓ | ✓ |
Typing indicator | ✓ | ✓ |
Delivery receipt | ✓ | ✓ |
Read receipt | ✓ | ✓ |
Unread message count | ✓ | ✓ |
Highlight URLs | ✓ | ✓ |
Id | Component name | Image | Description |
---|---|---|---|
Attachment | Media/Attachment | ![]() | An icon used to select and add files. |
Play | Toogle/ImagePlay | ![]() | An icon for video placeholder. |
GifFile | Media/GifFile | ![]() | An icon for gif placeholder. |
Image | Media/ImageEmpty | ![]() | An icon for image placeholder. |
File | Media/ImageFile | ![]() | An icon for file. |
Id | Component Name | Image | Description |
---|---|---|---|
MicOn | Toogle/MicOn | An icon for send voice. | |
Record | Toogle/Record | An icon for recorder. |
Icon name | Component Name | Image | Description |
---|---|---|---|
Play | Toogle/ImagePlay | An icon for audio. | |
AudioAttachment | AudioAttachmentComponent | ![]() | An icon for audio message background. |
ForwardMessageFlow.scss
file to modify various aspects of the screen. The ForwardMessagePreview.scss
file with classes allows you to customize the forward/reply preview components.
Id | Component Name | Image | Description |
---|---|---|---|
Sent | Status/Sent | An icon for sent status. | |
ViewedDelivered | Status/ViewedDelivered | An icon for delivered status. |
setTertiaryElementsColor()
(see Theme colors)MessagesComponent
.
Id | Component Name | Image | Description |
---|---|---|---|
ViewedDelivered | Status/ViewedDelivered | An icon for read status. |
setMainElementsColor()
(see Theme colors)99+
. The unread message count appears on the DialogsComponent
.