# MessageInputContext

`MessageInputContext` is provided by [`Channel`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/) component. If you are not familiar with React Context API, please read about it on [React docs](https://reactjs.org/docs/context.html).

## Basic Usage

`MessageInputContext` can be consumed by any of the child component of `Channel` component as following:

```tsx
import { useContext } from "react";
import { MessageInputContext } from "stream-chat-react-native";

const { sendMessage, toggleAttachmentPicker } = useContext(MessageInputContext);
```

Alternatively, you can also use `useMessageInputContext` hook provided by library to consume MessageInputContext.

```tsx
import { useMessageInputContext } from "stream-chat-react-native";

const { sendMessage, toggleAttachmentPicker } = useMessageInputContext();
```

## Value

### additionalTextInputProps

Additional props provided to the underlying [TextInput](https://reactnative.dev/docs/textinput#props) within [`MessageInput`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/).

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

### ayncMessagesLockDistance

Controls how many pixels to the top side the user has to scroll in order to lock the recording view and allow the user to lift their finger from the screen without stopping the recording.

| Type   | Default |
| ------ | ------- |
| Number | 50      |

### ayncMessagesMinimumPressDuration

Controls the minimum duration(in milliseconds) that the user has to press on the record button in the composer, in order to start recording a new voice message.

| Type   | Default |
| ------ | ------- |
| Number | 500     |

### ayncMessagesMultiSendEnabled

When it’s enabled, recorded messages won’t be sent immediately. Instead they will “stack up” in the composer allowing the user to send multiple voice recording as part of the same message.

| Type    | Default |
| ------- | ------- |
| Boolean | true    |

### ayncMessagesSlideToCancelDistance

Controls how many pixels to the leading side the user has to scroll in order to cancel the recording of a voice message.

| Type   | Default |
| ------ | ------- |
| Number | 100     |

### audioRecordingEnabled

Controls whether the feature is enabled.

| Type    | Default |
| ------- | ------- |
| Boolean | false   |

### autoCompleteSuggestionsLimit

Maximum number of suggestions to display as part of autocomplete feature within input box.

| Type   | Default |
| ------ | ------- |
| Number | 10      |

### autoCompleteTriggerSettings

Function that returns the trigger settings for the auto complete input.

| Type     | Default                                                                                                                                           |
| -------- | ------------------------------------------------------------------------------------------------------------------------------------------------- |
| function | [ACITriggerSettings](https://github.com/GetStream/stream-chat-react-native/blob/6f59551d46b24a0d62a5de2dce8121a2ed3c900b/src/utils/utils.ts#L258) |

### clearEditingState

Function to clear "Editing Message" state from MessageInput component.

| Type     |
| -------- |
| Function |

### clearQuotedMessageState

Function to clear "Add Quoted Reply" state from MessageInput component.

| Type     |
| -------- |
| Function |

### compressImageQuality

Image compression quality prior to uploading.

>
> **Note:** On iOS values of 0.8 and above don't reduce the quality noticeably in most images.
> A value of 0.8 will reduce the file size in iOS by approximately half compared to a value of 1.
>

| Type                                   | Default                  |
| -------------------------------------- | ------------------------ |
| number 0 to 1<br />(1 is best quality) | iOS: 0.8<br />Android: 1 |

### cooldownEndsAt

The time at which the active cool-down will end.

| Type |
| ---- |
| Date |

### doDocUploadRequest

Override of the file upload request when a user selects a file from the file picker.
The function must return a `Promise` that is resolved to an object with the key `file` that is the URL of the uploaded file.

>
> **Note:** This can be used to store file attachments in your own custom CDN.
>

| Type     |
| -------- |
| function |

| Parameter | Description                 |
| --------- | --------------------------- |
| file      | `{ name, size, type, uri }` |
| channel   | current channel instance    |

### doImageUploadRequest

Override of the image upload request when a user selects an image from the image picker.
The function must return a `Promise` that is resolved to an object with the key `file` that is the URL of the uploaded image.

>
> **Note:** This can be used to store image attachments in your own custom CDN.
>

| Type     |
| -------- |
| function |

| Parameter | Description              |
| --------- | ------------------------ |
| image     | `{ name, uri }`          |
| channel   | current channel instance |

### editing

Defined with message type if the user is editing some message within `MessageInput` component else its undefined.

| Type                    |
| ----------------------- |
| `Message`\| `undefined` |

### `editMessage`

Handles the edit message event on the message input by taking the new message as input and updating the message for the client.

| Type             |
| ---------------- |
| Function \| null |

| Parameter | Description                     |
| --------- | ------------------------------- |
| message   | message the action is called on |
| userId    | The channel ID                  |

### `emojiSearchIndex`

Prop to override the default emoji search index in [AutoCompleteSuggestionList](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/autocomplete-suggestion-list/).

Read [this guide](https://getstream.io/chat/docs/sdk/react-native/v6/guides/customize-autocomplete-suggestion-list/#customize-auto-complete-emoji-search-result) to know how it works.

| Type   |
| ------ |
| Object |

### `handleAttachButtonPress`

Function to customize the behaviour when the [AttachButton](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/attach-button/) is pressed in the message input.

| Type         |
| ------------ |
| `() => void` |

### `hasCameraPicker`

Enable the file picker on the [`MessageInput`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) component.

| Type    | Default |
| ------- | ------- |
| Boolean | `true`  |

### `hasCommands`

Enable commands on the [`MessageInput`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) component.

| Type    | Default |
| ------- | ------- |
| boolean | true    |

### `hasFilePicker`

Enable the file picker on the [`MessageInput`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) component.

| Type    | Default |
| ------- | ------- |
| Boolean | `true`  |

### `hasImagePicker`

Enable the image picker on the [`MessageInput`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) component.

| Type    | Default |
| ------- | ------- |
| Boolean | `true`  |

### `initialValue`

The initial value for the [`MessageInput`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) component.

| Type   |
| ------ |
| string |

### maxMessageLength

Maximum length of the message text.
The default value is supplied by the [channel config](https://getstream.io/chat/docs/javascript/channel-features/).

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

### maxNumberOfFiles

Maximum number of files (documents & images), that can be attached per message.

| Type   | Default |
| ------ | ------- |
| number | 10      |

### mentionAllAppUsersEnabled

Allows any of the app users to be mentioned in a message, as part of autocomplete feature within input box.
By default only members of channel can be mentioned while composing a message.

| Type    | Default |
| ------- | ------- |
| boolean | false   |

### mentionAllAppUsersQuery

Query to be used for searching users as part of autocomplete mention feature within input box.
Please check the [Querying Users](https://getstream.io/docs/platform/users/) docs for
more details on filters/sort/options.

```tsx
mentionAllAppUsersQuery={{
  filters: {
    id: {
      $in: ['vishal', 'lucas']
    }
  },
  sort: {},
  options: {}
}}
```

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

### numberOfLines

Maximum number of lines that underlying [`TextInput`](https://reactnative.dev/docs/textinput) component within [`MessageInput`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) should expand to.

| Type   | Default |
| ------ | ------- |
| number | 5       |

### onChangeText

Callback that is called when the text input's text changes.

| Type     |
| -------- |
| function |

| Parameter | Description  |
| --------- | ------------ |
| text      | changed text |

### `quotedMessage`

Message that is quoted to the original message

| Type                    |
| ----------------------- |
| `Message`\| `undefined` |

### sendImageAsync

### `sendMessage`

Sends a composed message within `MessageInput` component to channel. This function is attached to `onPress` handler of [`SendButton`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#sendbutton). The message optimistically gets added to message list UI first, before actually making API call to server.
During this intermediate stage, MessageStatus component will display an indicator for "pending" state.

| Type     |
| -------- |
| Function |

[//]: # "### setInputRef"
[//]: # "### setQuotedMessageState"

### `appendText`

Appends text to existing text entered by user in `MessageInput` component.

| Type             |
| ---------------- |
| `(text) => void` |

[//]: # "### asyncIds"
[//]: # "### asyncUploads"

### closeAttachmentPicker

Dismiss the attachment picker, if its already open.

| Type     |
| -------- |
| Function |

### `fileUploads`

List of `file` type attachments currently attached to message, which is being composed in `MessageInput` component.

```tsx
[
  {
    file: {
      name: 'test.pdf';
      size: 2000;
      type: 'application/pdf';
      uri: 'file-uri';
    };
    id: 'asdas232bk3jb42k3';
    state: 'uploaded'; // or 'finished'
    url: 'https://cdn.getstream.io/kajsnkj2n3j4';
  }
]
```

| Type  |
| ----- |
| Array |

### giphyActive

True if a user selects the `giphy` command from commands list (which is shown when you type a `/` in the input box).
This value is set back to `false` when the user sends the message for searching Giphy.

| Type    |
| ------- |
| Boolean |

### `imageUploads`

List of `image` type attachments currently attached to message, which is being composed in `MessageInput` component.

```tsx
[
  {
    file: { name: "fallback-name.jpeg" },
    id: "2j3n4k23nj4k23n4k3",
    state: "finished", // or 'uploading'
    url: "https://cdn.getstream.io/kajsnkj2n3j4", // If the state is `uploading`, then this will be a local uri of image.
  },
];
```

| Type  |
| ----- |
| Array |

### inputBoxRef

Ref for [`TextInput`](https://reactnative.dev/docs/textinput) component within `MessageInput`

| Type                                                                                      |
| ----------------------------------------------------------------------------------------- |
| [React ref](https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element) |

### isValidMessage

False if text within input box is empty and no images or files have been attached to a message yet. You can use this value to add enabled/disabled UI state on SendMessage button.

| Type    |
| ------- |
| Boolean |

### `mentionedUsers`

Ids of users which are mentioned (for example `Hey @Vishal Narkhede, how are you`) in a message, which is being composed in MessageInput component.

```tsx
["vishal-user-id", "jaap-user-id"];
```

| Type     |
| -------- |
| String[] |

### numberOfUploads

Number of image + files attached to message which is being composed in `MessageInput` component.

| Type   |
| ------ |
| Number |

[//]: # "### onChange"
[//]: # "### onSelectItem"

### openAttachmentPicker

Opens the attachment picker bottom sheet, if its not open.

| Type     |
| -------- |
| Function |

### openCommandsPicker

Opens the commands picker box. By default, this function is attached to `onPress` handler for [`CommandsButton`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#commandsbutton).

| Type     |
| -------- |
| Function |

### openFilePicker

Opens the file picker. By default, this function is attached to `onPress` handler for [`FileAttachmentIcon`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#fileattachmenticon).

| Type     |
| -------- |
| Function |

### openMentionsPicker

Opens the user mentions autocomplete popup. When user types `@` in input box, internally this function gets called.

| Type     |
| -------- |
| Function |

### `pickAndUploadImageFromNativePicker`

Opens the native image picker and uploads the selected image.

| Type                  |
| --------------------- |
| `() => Promise<void>` |

[//]: # "### pickFile"

### `removeFile`

Removes attached file in message, which is being composed in `MessageInput` component. By default, this function is attached to `onPress` handler for close button in [FileUploadPreview](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#fileuploadpreview).
It takes a string ID of the file to be removed in the [`fileUploads`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#fileuploads) array as parameter.

| Type                   |
| ---------------------- |
| `(id: string) => void` |

### `removeImage`

Removes an attached image in a message being composed in the `MessageInput` component. By default, this function is attached to `onPress` handler for close button in [ImageUploadPreview](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#imageuploadpreview).
It takes a string ID of the image to be removed in the [`imageUploads`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#imageuploads) array as parameter.

| Type                   |
| ---------------------- |
| `(id: string) => void` |

### `resetInput`

Resets the entire `MessageInput` component to empty state by clearing the text, attachments etc.

| Type     |
| -------- |
| Function |

### `selectedPicker`

Value is `images` (string), when image attachment picker is open. Value will be `undefined` if file picker is active or file picker is open.

| Type                  |
| --------------------- |
| 'images' \| undefined |

[//]: # "### sending"
[//]: # "### sendMessageAsync"

### sendThreadMessageInChannel

This value is only applicable to `Thread` component. When value `sendThreadMessageInChannel` is true, message gets sent from `MessageInput` component with property `show_in_channel: true`.
This value is attached to the checkbox (with label "Also Send To Channel") in `MessageInput` component within `Thread` component.

| Type    |
| ------- |
| Boolean |

[//]: # "### setAsyncIds"
[//]: # "### setAsyncUploads"

### setFileUploads

Setter function for [`fileUploads`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#fileuploads).

| Type              |
| ----------------- |
| `(files) => void` |

### setGiphyActive

Setter function for [`giphyActive`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#giphyactive)

| Type                 |
| -------------------- |
| `(isActive) => void` |

### setImageUploads

Setter function for [`imageUploads`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#imageuploads).

| Type               |
| ------------------ |
| `(images) => void` |

### setInputBoxRef

Setter function for [`inputBoxRef`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#inputboxref)

| Type            |
| --------------- |
| `(ref) => void` |

### setMentionedUsers

Setter function for [`mentionedUsers`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#mentionedusers)

| Type                       |
| -------------------------- |
| `(mentionedUsers) => void` |

### setNumberOfUploads

Setter function for [`numberOfUploads`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#numberofuploads)

| Type                        |
| --------------------------- |
| `(numberOfUploads) => void` |

### setSendThreadMessageInChannel

Setter function for [`setSendThreadMessageInChannel`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#setsendthreadmessageinchannel).

| Type                                   |
| -------------------------------------- |
| `(sendThreadMessageInChannel) => void` |

### setShowMoreOptions

Setter function for [`showMoreOptions`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#showmoreoptions).

| Type                        |
| --------------------------- |
| `(showMoreOptions) => void` |

### `setText`

Setter function for [`text`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#text).

| Type             |
| ---------------- |
| `(text) => void` |

### showMoreOptions

Represents the expanded or collapsed state for attach and commands button, next to input box.

| Type    |
| ------- |
| Boolean |

### `takeAndUploadImage`

Function to click an image using the device camera and upload it.

| Type                  |
| --------------------- |
| `() => Promise<void>` |

### text

Text message entered by user in underlying [`TextInput`](https://reactnative.dev/docs/textinput) within `MessageInput` component.
This value is attached to `TextInput`'s [`value prop`](https://reactnative.dev/docs/textinput#value)

| Type   |
| ------ |
| String |

### thread

Can be either a `MessageType` object or a [`ThreadType`](https://github.com/GetStream/stream-chat-react-native/blob/develop/package/src/contexts/threadContext/ThreadContext.tsx) that when set indicates a thread is open.
Both of the types may be used interchangeably.

When used with the [`Thread`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/thread/) component this will display the thread.
When used with the standard [`MessageList`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-list/) component this will prevent any singleton components in the [`OverlayProvider`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/overlay-provider/) form getting out of sync.

>
> **Note:** `thread` should be set on all `Channel` components when a thread is open.
>

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

### toggleAttachmentPicker

Function to toggle attachment picker. By default, this function is attached to `onPress` handler for [`AttachButton`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#attachbutton).

| Type     |
| -------- |
| Function |

### `triggerSettings`

Trigger settings for the auto complete input.

| Type   | Default                                                                                                               |
| ------ | --------------------------------------------------------------------------------------------------------------------- |
| Object | [TriggerSettings](https://github.com/GetStream/stream-chat-react-native/blob/develop/package/src/utils/utils.ts#L177) |

### `updateMessage`

This function is a counterpart of [`sendMessage`](#sendmessage), for the case of editing a message. This function is attached to [`SendButton`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#sendbutton) when some existing message is being updated.
Similar to `sendMessage` function, the message will be updated in message list UI first, before making API call to update the message.

| Type     |
| -------- |
| Function |

### `uploadFile`

This function is used internally by [`uploadNewFile`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#uploadnewfile) function, and is used for purpose retry mechanism.

| Type     |
| -------- |
| Function |

### `uploadImage`

This function is used internally by [`uploadNewImage`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#uploadnewimage) function, and is used for purpose retry mechanism.

| Type     |
| -------- |
| Function |

### uploadNewFile

Function to upload an attached file in `MessageInput`. This function adds a file to [`fileUploads`](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/#fileuploads) array and calls `channel.sendFile`.
This function takes a file from [react-native-document-picker](https://www.npmjs.com/package/react-native-document-picker) or [@react-native-documents/picker](https://github.com/react-native-documents/document-picker) as parameter.

| Type                |
| ------------------- |
| `(file) => Promise` |

>
> **Info:** If you're using React Native `>=0.78.0` please make sure to use `@react-native-documents/picker` as `react-native-document-picker` will not compile for `Android`.
>
> While `react-native-document-picker` should still be compatible with versions up to `0.78.0`, it is no longer maintained and we recommend switching to the new one as early as possible; as we are going to remove compatibility for it in the next major release.
>
> Support for `@react-native-documents/picker` exists for versions `>=6.6.7` of the SDK.
>

### uploadNewImage

Function to upload an attached image in `MessageInput`. This function takes a image from `imageUploads` array as a parameter.

| Type                 |
| -------------------- |
| `(image) => Promise` |

### AttachButton

Component to render the attach button next to input box.

| Type          | Default                                                                       |
| ------------- | ----------------------------------------------------------------------------- |
| ComponentType | [`AttachButton`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/attach-button/) |

### AudioAttachmentUploadPreview

Component prop used to customize the audio attachment upload preview when its uploading/uploaded in the `MessageInput`.

| Type          | Default                                                                             |
| ------------- | ----------------------------------------------------------------------------------- |
| ComponentType | [`AudioAttachment`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/audio-attachment/) |

### AudioRecorder

Custom UI component to render audio recorder controls in [MessageInput](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/).

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

### AudioRecordingInProgress

Custom UI component to render audio recording in progress in [MessageInput](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/). It renders the waveform, duration etc, for the recording.

| Type          | Default                                                                                                                                                                                 |
| ------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ComponentType | [`AudioRecordingInProgress`](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/MessageInput/components/AudioRecorder/AudioRecordingInProgress.tsx) |

### AudioRecordingLockIndicator

Custom UI component to render audio recording lock indicator in [MessageInput](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) that can be dragged up to lock the recording start.

| Type          | Default                                                                                                                                                                                       |
| ------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ComponentType | [`AudioRecordingLockIndicator`](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/MessageInput/components/AudioRecorder/AudioRecordingLockIndicator.tsx) |

### AudioRecordingPreview

Custom UI component to render audio recording preview in [MessageInput](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/) that allows playing the recording.

| Type          | Default                                                                                                                                                                           |
| ------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ComponentType | [`AudioRecordingPreview`](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/MessageInput/components/AudioRecorder/AudioRecordingPreview.tsx) |

### AudioRecordingWaveform

Custom UI component to render audio recording waveform in [MessageInput](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/).

| Type          | Default                                                                                                                                                                             |
| ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ComponentType | [`AudioRecordingWaveform`](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/MessageInput/components/AudioRecorder/AudioRecordingWaveform.tsx) |

### CommandsButton

Component to render button next to input box, which when pressed opens commands list.

| Type          | Default                                                                           |
| ------------- | --------------------------------------------------------------------------------- |
| ComponentType | [`CommandsButton`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/commands-button/) |

### FileUploadPreview

Component to render preview of attached file, within enclosed `MessageInput` component.

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

### ImageUploadPreview

Component to render preview of attached images, within enclosed MessageInput component

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

### Input

Component to render UI part of enclosed MessageInput component.
Please read section in guides about [Customizing Message Input](https://getstream.io/chat/docs/sdk/react-native/v6/guides/message-input-customization/).

| Type          |
| ------------- |
| ComponentType |

### InputButtons

Component to render action buttons (CommandsButton and AttachButton) on left side of input box, within enclosed `MessageInput` component.

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

### MoreOptionsButton

Component to render a button within enclosed MessageInput, which when pressed shows more options such as AttachButton, CommandsButton.

| Type          | Default                                                                                  |
| ------------- | ---------------------------------------------------------------------------------------- |
| ComponentType | [`MoreOptionsButton`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/more-options-button/) |

### SendButton

Component to render a send message button, within enclosed MessageInput component.

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

### SendMessageDisallowedIndicator

Component to render indicator stating send message feature is not allowed for current user.

| Type          | Default                                                                                                             |
| ------------- | ------------------------------------------------------------------------------------------------------------------- |
| ComponentType | [`SendMessageDisallowedIndicator`](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/send-message-disallowed-indicator/) |

### ShowThreadMessageInChannelButton

Component to render a checkbox within enclosed Thread component, which when checked sets a `show_in_channel` property to true on a message.

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

### StartAudioRecordingButton

Custom UI component for audio recording mic button in [MessageInput](https://getstream.io/chat/docs/sdk/react-native/v6/ui-components/message-input/).

| Type          | Default                                                                                                                                                                              |
| ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| ComponentType | [`StartAudioRecordingButton`](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/MessageInput/components/AudioRecorder/AudioRecordingButton.tsx) |

### UploadProgressIndicator

Component to render progress indicator on `ImageUploadPreview` and `FileUploadPreview` components, as overlay.

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

### `closePollCreationDialog`

Function called whenever the close button is pressed on the poll creation modal. Has no effect if [`PollCreateContent`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#createpollcontent) is custom.

| Type     |
| -------- |
| function |

### `showPollCreationDialog`

A boolean signifying whether the poll creation dialog is shown or not. Will always be `false` if [`PollCreateContent`](https://getstream.io/chat/docs/sdk/react-native/v6/core-components/channel/#createpollcontent) is custom.

| Type    |
| ------- |
| boolean |

---

For the most recent version of this documentation, visit [https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/](https://getstream.io/chat/docs/sdk/react-native/v6/contexts/message-input-context/).