Skip to contentSkip to content

ChatMessageContent API

API reference docs for the React ChatMessageContent component. Learn about the props, CSS, and other APIs of this exported module.

Demos

Import

import { ChatMessageContent } from '@mui/x-chat/ChatMessage';
// or
import { ChatMessageContent } from '@mui/x-chat';

Learn about the difference by reading this guide on minimizing bundle size.

Props

Props of the native component are also available.

NameTypeDescription
afterContentnode

Content rendered inside the bubble after the message parts. Useful for placing inline metadata (e.g. timestamp, status) inside the bubble.

partProps{ dynamic-tool?: { className?: string, defaultExpanded?: object, slotProps?: object, slots?: object, toolSlotProps?: object, toolSlots?: object }, file?: { className?: string, slotProps?: object, slots?: object }, reasoning?: { className?: string, slotProps?: object, slots?: object }, source-document?: { className?: string, slotProps?: object, slots?: object }, source-url?: { className?: string, slotProps?: object, slots?: object }, text?: { renderText?: func }, tool?: { className?: string, defaultExpanded?: object, slotProps?: object, slots?: object, toolSlotProps?: object, toolSlots?: object } }

Props forwarded to the built-in unstyled part renderer components. Use this to pass slots and slotProps to individual part type renderers.

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.