# MessageContent

Renders message content inside [`MessageList`](/chat/docs/sdk/react-native/v8/ui-components/message-list/). It excludes the avatar and reactions. This is the default component for the [`MessageContent`](/chat/docs/sdk/react-native/v8/core-components/channel#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](https://reactnative.dev/docs/pressable#props) used in message components like [`MessageContent`](/chat/docs/sdk/react-native/v8/ui-components/message-content/).

| 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](/chat/docs/javascript/disabling_channels/) and [disableIfFrozenChannel](/chat/docs/sdk/react-native/v8/core-components/channel#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](/chat/docs/sdk/react-native/v8/customization/theming/) applied to the current user’s messages.

| Type   |
| ------ |
| object |

<admonition type="warning">

Memoize this object or pass a stable reference.

</admonition>


### `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`](/chat/docs/sdk/react-native/v8/ui-components/attachment/) |

### `FileAttachmentGroup`

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

| Type          | Default                                                                                      |
| ------------- | -------------------------------------------------------------------------------------------- |
| ComponentType | [`FileAttachmentGroup`](/chat/docs/sdk/react-native/v8/ui-components/file-attachment-group/) |

### `Gallery`

Renders `image` attachments in `MessageList`.

| Type          | Default                                                            |
| ------------- | ------------------------------------------------------------------ |
| ComponentType | [`Gallery`](/chat/docs/sdk/react-native/v8/ui-components/gallery/) |


### `MessageError`

Customize the message error component.

| Type          | Default                                                                       |
| ------------- | ----------------------------------------------------------------------------- |
| ComponentType | [`MessageError`](/chat/docs/sdk/react-native/v8/ui-components/message-error/) |

### `Reply`

Renders a preview of the parent message for quoted replies.

| Type          | Default                                                                                                                 |
| ------------- | ----------------------------------------------------------------------------------------------------------------------- |
| ComponentType | [`Reply`](https://github.com/GetStream/stream-chat-react-native/v8/blob/develop/package/src/components/Reply/Reply.tsx) |



---

This page was last updated at 2026-04-17T17:33:44.494Z.

For the most recent version of this documentation, visit [https://getstream.io/chat/docs/sdk/react-native/v8/ui-components/message-content/](https://getstream.io/chat/docs/sdk/react-native/v8/ui-components/message-content/).