Message
Renders one message — user, assistant, tool, or system. Streaming-aware, role-aware.
Headless single-message renderer. Role in data-ak-role. Streaming
state in data-ak-streaming. Content chunks (text, tool-call,
tool-result, image, file) each emit a data-ak-part wrapper.
#React props
| Prop | Type | Default |
|---|---|---|
message | Message | — |
avatar | ReactNode | — |
actions | ReactNode | — |
avatar and actions are React slots. Message parts are exposed by the core | ||
| message shape but this component currently renders the message text; it does | ||
not expose a renderPart prop. |
#Message shape
import type { ContentPart } from '@agentskit/core'
type Message = {
id: string
role: 'user' | 'assistant' | 'tool' | 'system'
content: string
status: 'pending' | 'streaming' | 'complete' | 'error'
createdAt: Date
parts?: ContentPart[]
}#Per-framework
| Framework | Import |
|---|---|
| React | import { Message } from '@agentskit/react' |
| Vue | import { Message } from '@agentskit/vue' |
| Svelte | import { Message } from '@agentskit/svelte' |
| Solid | import { Message } from '@agentskit/solid' |
| React Native | import { Message } from '@agentskit/react-native' |
| Angular | <ak-message [message]="msg"> |
| Ink | import { Message } from '@agentskit/ink' |
#Related
Explore nearby
- PeerUI + hooks
Every AgentsKit UI binding shares the core state and action contract; host component APIs remain framework-specific.
- PeeruseChat
The shared chat state and action contract adapted by each framework binding.
- PeerChatContainer
Headless scrollable transcript container. Auto-scroll on new messages, virtualized-ready.