MessageContent API - MUI X

MessageContent API - MUI XSkip to contentSkip to content🚀 Material UI and MUI X v9 are out! Check out the announcement blogpost.Search…

MUI Xv9.4.0What's new in MUI XIntroductionCommon conceptsData GridDate and Time PickersChartsTree ViewSchedulerPreviewChatPreviewOverviewQuickstartMain featuresChatBoxAdaptersStreamingError handlingCustomizationSlots and compositionStylingTailwind CSSLocalizationAdvanced featuresBuilding BlocksDisplayBehaviorMulti-conversationAI and agentsBackend integrationDemosResourcesHooks ReferenceSelectors ReferenceEvents & CallbacksPerformanceAPI ReferenceAPI referenceChatBoxChatCodeBlockChatComposerAttachButtonChatComposerAttachmentListChatComposerHelperTextChatComposerLabelChatComposerSendButtonChatComposerTextAreaChatComposerToolbarChatConfirmationChatConversationChatConversationHeaderChatConversationHeaderActionsChatConversationHeaderInfoChatConversationListChatConversationSubtitleChatConversationTitleChatDateDividerChatLayoutChatMessageActionsChatMessageAuthorLabelChatMessageAvatarChatMessageContentChatMessageGroupChatMessageInlineMetaChatMessageListChatMessageMetaChatMessageSkeletonChatMessageSourceChatMessageSourcesChatProviderChatRootChatScrollToBottomAffordanceChatSuggestionsChatTypingIndicatorChatUnreadMarkerComposerAttachButtonComposerAttachmentListComposerHelperTextComposerLabelComposerRootComposerSendButtonComposerTextAreaComposerToolbarConversationHeaderConversationHeaderActionsConversationListItemConversationListItemAvatarConversationListPreviewConversationListRootConversationListTimestampConversationListTitleConversationListUnreadBadgeConversationRootConversationSubtitleConversationTitleMessageActionsMessageAuthorLabelMessageAvatarMessageContentMessageErrorMessageGroupMessageListDateDividerMessageListRootMessageMetaMessageRootScrollToBottomAffordanceTypingIndicatorUnreadMarkerMigrationMessageContent API

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

Demos

For examples and details on the usage of this React component, visit the component demo pages:

Chat - Headless messagesImport

import { MessageContent } from '@mui/x-chat/headless';
// or
import { MessageContent } from '@mui/x-chat/headless';

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

PropsView:tableNameTypeDescriptionThe component cannot hold a ref.SlotsView:tableSlot nameClass nameDefault componentDescriptioncontentbubbleSource code

If you did not find the information in this page, consider having a look at the implementation of the component for more detail.

Edit this page

Was this page helpful?

•

Blog

•

Store

Contents

DemosImportPropsSlotscontentbubbleSource codeBecome a Diamond sponsorMUI stands in solidarity with Ukraine.Search…