# FileAttachment

Component to render file attachments within the [`MessageList`](/chat/docs/sdk/react-native/v4/ui-components/message-list/).

## Basic Usage

You can customize this component and provide it back to the SDK via the [`FileAttachment`](/chat/docs/sdk/react-native/v4/core-components/channel#fileattachment/) prop on `Channel` if desired.

Changing the size of the file attachment icon can be easily accomplished.

```tsx
import { Channel, FileAttachment } from 'stream-chat-react-native';

<Channel FileAttachment={() => <FileAttachment attachmentSize={40} />}
```

## Props

### **attachment**

Attachment object for `file` type attachment.

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

### `attachmentSize`

Size of an attachment icon. This value gets passed to [`FileAttachmentIcon`](#fileattachmenticon) component.

| Type   |
| ------ |
| number |

### additionalTouchableProps

Additional props provided to the underlying [TouchableOpacity](https://reactnative.dev/docs/touchableopacity#props) used by components within a message such as [`MessageContent`](/chat/docs/sdk/react-native/v4/ui-components/message-content#additionaltouchableprops/).

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


### AttachmentActions

Component to render additional actions on attachment. for example send, shuffle, cancel in case of Giphy.

| Type      | Default                                                                                                                                      |
| --------- | -------------------------------------------------------------------------------------------------------------------------------------------- |
| component | [AttachmentActions](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Attachment/AttachmentActions.tsx) |


### FileAttachmentIcon

Component to render file icon for `file` type attachment.

| Type      | Default                                                               |
| --------- | --------------------------------------------------------------------- |
| component | [`FileIcon`](/chat/docs/sdk/react-native/v4/ui-components/file-icon/) |



---

This page was last updated at 2026-04-22T16:42:55.576Z.

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