Components · AI
One message in a conversation. User messages sit in a bubble at the end; assistant replies run full width. MessageActions adds copy, feedback and regenerate.
import { Message Bubble } from '@nexub/react';When to use
Reach for this component when…
When not to use
Pick a different component if…
Hover or focus the assistant reply to show its actions.
| Prop | Type | Default | Required | Description |
|---|---|---|---|---|
| from | 'user' | 'assistant' | 'system' | — | ✓ | Who sent it. Sets layout and the default accessible name. |
| avatar | ReactNode | — | — | Assistant only: shown at the inline start. |
| name | string | — | — | Accessible name of the message. Defaults to "You said" or "Assistant said". |
| status | 'sending' | 'error' | — | — | `sending` sets `aria-busy`; `error` shows "Failed to send". |
| onRetry | () => void | — | — | With `status="error"`, adds a Retry button. |
| messages | Partial<MessageStrings> | — | — | Local string overrides. |
| MessageActions text | string | — | — | Text Copy puts on the clipboard. |
| MessageActions copy | boolean | true | — | Set false to hide Copy. |
| MessageActions feedback / defaultFeedback / onFeedback | 'up' | 'down' | null | — | — | Thumbs up/down appear when `onFeedback` is set. Pressing the active one clears it. |
| MessageActions onRegenerate | () => void | — | — | Shows Regenerate when set. |