MessageContent

Renders message content inside MessageList. It excludes the avatar and reactions. This is the default component for the MessageContent prop.

Best Practices

Keep content rendering lightweight to avoid list performance issues.
Respect messageContentOrder so attachments and text appear consistently.
Use isAttachmentEqual to prevent unnecessary attachment re-renders.
Avoid deep context access in custom content components.
Use preventPress for non-interactive content to avoid accidental actions.

Props

`additionalPressableProps`

Extra props passed to the underlying Pressable used in message components like MessageContent.

Type
object

`alignment`

Sets whether the message aligns left or right in the list.

Type	Default
enum('right', 'left')	'right'

`backgroundColor`

Message content background color.

Type
`string` \| `undefined`

`disabled`

True if channel is frozen and disableIfFrozenChannel is true.

Type
Boolean

`goToMessage`

Scrolls to a specific message in the chat.

Type	Default
`(messageId: string) => void`\| `undefined`	`undefined`

`groupStyles`

Position of the message within a group of consecutive messages from the same user. Use groupStyles to style messages based on position (for example, avatars show only on the last message).

Type
array of enum('top', 'bottom', 'middle', 'single')

`isAttachmentEqual`

Returns true if rendering nextAttachment would produce the same result as prevAttachment, otherwise false.

Type
function

Parameter	Description
prevAttachment	previous message attachment to be compared
nextAttachment	next message attachment to be compared

`isEditedMessageOpen`

Whether the edited label is expanded.

Type	Default
Boolean	`false`

`isMyMessage`

True if the message was sent by the current user.

Type
boolean

`message`

Message object.

Type
`Message` type

`messageContentOrder`

Order of message content.

Example: ['quoted_reply', 'attachments', 'file', 'gallery', 'text']

Type
array

`MyMessageTheme`

Theme applied to the current user’s messages.

Type
object

Warning:

Memoize this object or pass a stable reference.

`noBorder`

If true, the message content has no border.

Type	Default
`Boolean`\| `undefined`	`false`

`onLongPress`

Default long press handler for message UI.

Type
function

`onPress`

Default press handler for message UI.

Type
function

`onPressIn`

Default pressIn handler for message UI.

Type
function

`otherAttachments`

All attachments except file and image.

Type
Array

`preventPress`

`threadList`

True if the current message is part of a thread.

Type
Boolean

UI Component Props

`Attachment`

Renders attachments in MessageList.

Available props:

attachment {object}

Type	Default
ComponentType	`Attachment`

`FileAttachmentGroup`

Renders a group of file attachments when a message has multiple files.

Type	Default
ComponentType	`FileAttachmentGroup`

`Gallery`

Renders image attachments in MessageList.

Type	Default
ComponentType	`Gallery`

`MessageError`

Customize the message error component.

Type	Default
ComponentType	`MessageError`

`Reply`

Renders a preview of the parent message for quoted replies.

Type	Default
ComponentType	`Reply`