Appearance
WARNING
The information provided on this page is intended for users with developer access to ACE Widgets.
Conversation component
The conversation component is used to display a conversation.
Example Usage
js
import { ConversationComponent } from '@telia-ace/widget-conversation-flamingo';
bootstrap('https://url-to-site', (config) => {
config.plugin(ConversationComponent);
});
Properties
Providers
The providers
property is used to enable given provider for the conversation component. The conversation component will use this provider to send and receive chat messages. See the provider section for more information.
Styling
See styling documentation for more details.
Label | Key | Description |
---|---|---|
Background Color | conversation-bg-color | Set the background color for the conversation |
Content Border | conversation-content-border | Apply a border to the conversation content |
User Background Color | conversation-user-bg-color | Set the background color of the user chat bubble |
User Text Color | conversation-user-text-color | Text color of user messages |
Agent Background Color | conversation-agent-bg-color | Set the background color of the agent chat bubble |
Agent Text Color | conversation-agent-text-color | Text color of agent messages |
Message Info Color | conversation-message-info-color | Text color for message details, such as timestamp and author |
Input Border | conversation-input-border | Apply a border to the input field |
Input Text Color | conversation-input-text-color | Text color for the input field |
Input Background Color | conversation-input-bg-color | Background color of the conversation input field |
Texts
See texts documentation for more details.
This component does not have any custom texts.