System Message
Information Message
Sometimes you may want to show system messages in the message list.
Emre
Hi there !
Esra
Hii !
Kursat
Heyy ! How are you ?
End of conversation
Example Usage
import { SystemMessage } from "react-chat-elements"
<SystemMessage text={"Here is an example of system message."} />
Result
Here is an example of system message.
System Message Props (extends IMessage)
| prop | default | type | description |
|---|---|---|---|
| text | none | string | message text |
| className | none | string | System message className |
IMessage Props
| props | default | type | description |
|---|---|---|---|
| id | none | string | number | message id |
| position | none | string | message position |
| text | none | string | message text |
| title | none | string | message title |
| focus | none | boolean | message focus |
| date | none | number | Date | message date |
| dateString | none | string | message date string |
| avatar | none | string | message avatar |
| titleColor | none | string | message title color |
| forwarded | none | boolean | message forwarded |
| replyButton | none | boolean | message reply button |
| removeButton | none | boolean | message remove button |
| status | none | 'waiting'| 'sent' | 'received' | 'read' | message status |
| statusTitle | none | string | message status title |
| notch | none | boolean | message notch |
| copiableDate | none | boolean | message copiable date |
| retracted | none | boolean | message retracted |
| className | none | string | message className |
| letterItem | none | object | message letterItem contains id:string, letter:ReactChild |
| reply | none | object | any | message reply should be both any and object (contains message:string, photoURL:string) |
| type | none | string | message type |