MessageInputContext

MessageInputContext is provided by Channel. If you are not familiar with the React Context API, see the React docs.

Best Practices

Prefer useMessageInputContext for consistent access and typings.
Use context handlers (sendMessage, editMessage) to keep behavior aligned with the SDK.
Keep input-related props stable to avoid re-renders while typing.
Use openAttachmentPicker and closeAttachmentPicker helpers to keep picker state consistent.
Respect cooldowns and permissions before allowing sends or uploads.

Basic Usage

Consume MessageInputContext in any child of Channel:

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

const { sendMessage, openAttachmentPicker } = useContext(MessageInputContext);

Alternatively, use the useMessageInputContext hook.

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

const { sendMessage, openAttachmentPicker } = useMessageInputContext();

Values

Value	Description	Type
`additionalTextInputProps`	Extra props passed to the underlying TextInput in `MessageComposer`.	`object`
`allowSendBeforeAttachmentsUpload`	When enabled, messages can be sent before all attachments have finished uploading.	`boolean`
`asyncMessagesLockDistance`	Pixels the user must drag upward to lock recording and lift their finger without stopping it. Defaults to `50`.	`number`
`asyncMessagesMinimumPressDuration`	Minimum press duration (ms) on the record button to start voice recording. Defaults to `500`.	`number`
`asyncMessagesSlideToCancelDistance`	Pixels the user must drag toward the leading side to cancel voice recording. Defaults to `100`.	`number`
`attachmentPickerBottomSheetHeight`	Height of the attachment picker bottom sheet when open. Defaults to 40% of Window Height.	`number`
`audioRecorderManager`	Instance of `AudioRecorderManager` used to manage audio recording state internally.	`AudioRecorderManager`
`audioRecordingEnabled`	Enable or disable audio recording. Defaults to `false`.	`boolean`
`audioRecordingSendOnComplete`	Controls what happens after a completed voice recording upload. When `true`, sends the voice recording immediately after upload. When `false`, keeps it in the composer so the user can add text, attachments, or more recordings before sending. Defaults to `true`.	`boolean`
`closeAttachmentPicker`	Dismiss the attachment picker, if its already open.	`function`
`closePollCreationDialog`	Function called whenever the close button is pressed on the poll creation modal. Has no effect if `PollCreateContent` is custom.	`function`
`compressImageQuality`	Image compression quality before upload. On iOS, values >= 0.8 usually keep quality while reducing size. A value of 0.8 can roughly halve file size vs 1.0. Defaults to `0.8` on iOS, `1` on Android.	`number` (0 to 1, 1 is best quality)
`createPollOptionGap`	Vertical gap between poll options in the poll creation dialog.	`number`
`deleteVoiceRecording`	Deletes the current voice recording.	`() => Promise<void>`
`doFileUploadRequest`	Custom function to handle file upload requests.	`function`
`editMessage`	Handles the edit message event on the message input by taking the new message as input and updating the message for the client. See Examples for parameter details.	`function`
`handleAttachButtonPress`	Customize behavior when the AttachButton is pressed in the message input.	`() => void`
`hasCameraPicker`	Enable the camera picker in `MessageComposer`. Defaults to `true`.	`boolean`
`hasCommands`	Enable commands in `MessageComposer`. Defaults to `true`.	`boolean`
`hasFilePicker`	Enable the file picker in `MessageComposer`. Defaults to `true`.	`boolean`
`hasImagePicker`	Enable the image picker in `MessageComposer`. Defaults to `true`.	`boolean`
`inputBoxRef`	Ref for `TextInput` component within `MessageComposer`.	React ref
`messageInputFloating`	Whether the message input is floating or not. Defaults to `false`.	`boolean`
`messageInputHeightStore`	Store instance for tracking the message input height.	`MessageInputHeightStore`
`openAttachmentPicker`	Opens the attachment picker bottom sheet, if its not open.	`function`
`openPollCreationDialog`	Called when the poll creation button is clicked in the attachment picker. Use it to override the default modal UI. If overridden, a `payload` is passed with `sendMessage` from `MessageInputContext` for use in `CreatePoll`. See Examples for parameter details.	`function`
`pickAndUploadImageFromNativePicker`	Opens the native image picker and uploads the selected image.	`() => Promise<void>`
`pickFile`	Opens the native document/file picker and uploads the selected files.	`() => Promise<void>`
`sendMessage`	Sends a composed message within `MessageComposer` component to channel. Attached to the `onPress` handler of `SendButton`. The message optimistically gets added to the message list UI first, before actually making the API call to the server. See Examples for parameter details.	`function`
`setInputBoxRef`	Setter function for `inputBoxRef`.	`(ref) => void`
`showPollCreationDialog`	A boolean signifying whether the poll creation dialog is shown or not. Will always be `false` if `PollCreateContent` is custom.	`boolean`
`startVoiceRecording`	Starts a new voice recording session.	`() => Promise<boolean \| undefined>`
`stopVoiceRecording`	Stops the current voice recording.	`() => Promise<void>`
`takeAndUploadImage`	Function to click an image using the device camera and upload it.	`() => Promise<void>`
`thread`	Can be a `LocalMessage` or `ThreadType`. Setting it indicates a thread is open. With `Thread`, this displays the thread. With the standard `MessageList`, it keeps singleton components in `OverlayProvider` in sync. Set `thread` on all `Channel` components when a thread is open.	`object`
`uploadNewFile`	Function to upload an attached file in `MessageComposer`. Invokes the Message composer Attachment Manager's `uploadFiles` method to handle the file upload process. Handles the abort controller to make sure the upload can be cancelled if needed.	`(file: File) => Promise`
`uploadVoiceRecording`	Uploads the current voice recording. When `sendOnComplete` is `true`, the recording is sent immediately after upload. When `false`, the recording stays in the composer so the user can add text, attachments, or more recordings before sending.	`(sendOnComplete: boolean) => Promise<void>`

Examples

editMessage

The editMessage function takes an object as a parameter with the following properties:

Parameter	Description
`localMessage`	Contains the message data that will be shown in the UI immediately
`options`	Contains options for sending/updating the message

openPollCreationDialog

When overridden, the openPollCreationDialog function receives a payload parameter:

Parameter	Description
`payload`	`{ sendMessage }`

sendMessage

The sendMessage function takes an object as a parameter with the following properties:

Parameter	Description
`localMessage`	Contains the message data that will be shown in the UI immediately
`message`	Contains the data that will be sent to the backend
`options`	Contains options for sending/updating the message

MessageComposer Middleware

MessageComposerAPIContext

On this page:

Best Practices
Basic Usage
Values
Examples