Chat Message
Messages with streaming output. Pro · AI chat and agents › Chat
Installation
npx valyro-cli@latest login
npx valyro-cli@latest add chat-messagenpm install valyro-ui-pro
import 'valyro-ui-pro/styles.css';
import { ChatMessage } from 'valyro-ui-pro';Props
| Prop | Type | Default | |
|---|---|---|---|
role * | 'user' | 'assistant' | 'system' | Author of the message (the element's ARIA role is set by the component). | |
content * | string | Markdown for assistant replies; plain text for user and system messages. | |
name | string | Display name. Defaults to labels.assistant / labels.user. | |
avatar | ReactNode | Replaces the assistant's monogram tile (the first letter of its name); shown beside user messages when given. | |
timestamp | DateInput | Send time (Date, ISO string or epoch ms), shown as a localized time; unparseable values are hidden. | |
streaming | boolean | false | Reply still generating: a blinking caret, or a "Thinking" shimmer while empty. |
attachments | ChatAttachment[] | Files sent with a user message, or produced by an assistant reply. | |
footer | ReactNode | Extra content under an assistant reply, e.g. a compact TokenUsage. | |
children | ReactNode | Parts of an agent turn shown above the reply text: a ChainOfThought, ToolCall cards… | |
renderCitation | (index: number) => ReactNode | Turns [1] markers in the reply into nodes such as Citation chips (see MarkdownPreview). | |
actions | boolean | true | Show copy / regenerate / feedback on assistant replies. Default true. |
onRegenerate | () => void | Adds a Regenerate action. | |
feedback | ChatFeedback | Controlled feedback; use with onFeedbackChange. | |
defaultFeedback | ChatFeedback | null | Initial feedback when uncontrolled. |
onFeedbackChange | (feedback: ChatFeedback) => void | Called with the new feedback when it changes. | |
locale | string | BCP 47 locale for the timestamp and attachment sizes; defaults to the ThemeProvider's, then the browser's. | |
labels | Partial<ChatMessageLabels> | Overrides for the built-in English text; keys left out keep their defaults. |
Related components
- AI Chat Window — AI chat window
- Message Branches — Message versions and a conversation branch tree
- Streaming Text — Smooth token streaming
- Markdown Preview — Rendered Markdown
- Response Feedback — Answer rating and a rubric for reviewers
- Prompt Composer — Prompt field with attachments
- Inline Suggestion — Inline autocomplete suggestion
- Model Selector — AI model picker
- Model Comparison — Side-by-side answers from several models
- Prompt Library — Prompt library with variables
- Chain of Thought — Model reasoning steps
- Tool Call — Tool call with approval
Previous: AI Chat Window · Next: Message Branches · All AI chat and agents