Skip to main content

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)

propdefaulttypedescription
textnonestringmessage text
classNamenonestringSystem message className

IMessage Props

propsdefaulttypedescription
idnonestring | numbermessage id
positionnonestringmessage position
textnonestringmessage text
titlenonestringmessage title
focusnonebooleanmessage focus
datenonenumber | Datemessage date
dateStringnonestringmessage date string
avatarnonestringmessage avatar
titleColornonestringmessage title color
forwardednonebooleanmessage forwarded
replyButtonnonebooleanmessage reply button
removeButtonnonebooleanmessage remove button
statusnone'waiting'| 'sent' | 'received' | 'read'message status
statusTitlenonestringmessage status title
notchnonebooleanmessage notch
copiableDatenonebooleanmessage copiable date
retractednonebooleanmessage retracted
classNamenonestringmessage className
letterItemnoneobjectmessage letterItem contains id:string, letter:ReactChild
replynoneobject | anymessage reply should be both any and object (contains message:string, photoURL:string)
typenonestringmessage type