ChatMessageActions API
API reference docs for the React ChatMessageActions component. Learn about the props, CSS, and other APIs of this exported module.
Demos
Import
import { ChatMessageActions } from '@mui/x-chat/ChatMessage';
// or
import { ChatMessageActions } from '@mui/x-chat';Learn about the difference by reading this guide on minimizing bundle size.
Props of the native component are also available.
| Name | Type | Description |
|---|---|---|
| extraActions | Array<{ disabled?: bool, icon?: node, id: string, label: string, onClick: func }> | Declarative action buttons appended after |
| message | { author?: { avatarUrl?: string, displayName?: string, id: string, isOnline?: bool, metadata?: object, role?: 'assistant' | 'system' | 'user' }, conversationId?: string, createdAt?: string, editedAt?: string, id: string, metadata?: object, parts: Array<{ data: any, id?: string, transient?: bool, type: object } | { filename?: string, mediaType: string, type: 'file', url: string } | { sourceId: string, text?: string, title?: string, type: 'source-document' } | { sourceId: string, title?: string, type: 'source-url', url: string } | { state?: 'done' | 'streaming', text: string, type: 'reasoning' } | { state?: 'done' | 'streaming', text: string, type: 'text' } | { toolInvocation: { approval?: object, approvalId?: string, callProviderMetadata?: object, errorText?: string, input?: any, output?: any, preliminary?: bool, providerExecuted?: bool, state: 'approval-requested' | 'approval-responded' | 'input-available' | 'input-streaming' | 'output-available' | 'output-denied' | 'output-error', title?: string, toolCallId: string, toolName: string }, type: 'dynamic-tool' } | { toolInvocation: { approval?: object, approvalId?: string, callProviderMetadata?: object, errorText?: string, input?: any, output?: any, preliminary?: bool, providerExecuted?: bool, state: 'approval-requested' | 'approval-responded' | 'input-available' | 'input-streaming' | 'output-available' | 'output-denied' | 'output-error', title?: string, toolCallId: string, toolName: string }, type: 'tool' } | { type: 'step-start' }>, role: 'assistant' | 'system' | 'user', status?: 'cancelled' | 'error' | 'pending' | 'read' | 'sending' | 'sent' | 'streaming', updatedAt?: string } | The message this bar belongs to. Injected by |
The component cannot hold a ref.
Source code
If you did not find the information in this page, consider having a look at the implementation of the component for more detail.