MessageBubble
This component renders a single bubble in a list of messages.
Component children#
Key | Component | Condition | Align | Description |
---|---|---|---|---|
header | styled(div) | Wrapper for message bubble header. It displays the user name and the time | ||
body | styled(div) | Wrapper for the message body. Parses to markdown if markdown support is enabled | ||
media-body | React component | Visible only when message source type is media and when file attachment is enabled | Wrapper for media message | |
media-error | styled(div) | Visible only when a media message needs to be displayed by it is not supported | Wrapper that displays a text notifying the agent media messages are not supported |
Static Properties#
Name | Description | Type |
---|---|---|
Content | Dynamic content store | DynamicContentStore.<MessageBubble.MessageBubbleProps> |
Component Properties
conversationSid: string
The conversation sid
message: MessageState
An object which represents a single message.
participant?: ParticipantState
An object defining the properties of a remote client.
messageStyle?: MessageStyle
Identifies how the message should be displayed.
useFriendlyName?: boolean
An override to use the friendly name passed in participant.
authorName?: string
A custom author name to be used.
hasMarkdownSupport?: boolean
If set to true, the body will be parsed as markdown.
timestampFormatter?: function
Function that formats timestamp