# AutoCompleteInput

Component to render input box within the [`MessageInput`](/chat/docs/sdk/react-native/v4/ui-components/message-input/).
This component provides autocomplete functionality for the commands and mentions feature.
Commands suggestions will show up when user types "`/`" while mentions suggestions will show up when user types "`@`."

Check the [Customize Message Input guide](/chat/docs/sdk/react-native/v4/guides/message-input-customization/)) for more details on how to customize this component

## Props

### `cooldownActive`

Whether there is currently a cool-down active in a channel with [slow mode](/chat/docs/javascript/slow_mode/#channel-slow-mode/) enabled.

| type    | default |
| ------- | ------- |
| boolean | false   |

### additionalTextInputProps

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

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


### autoCompleteSuggestionsLimit

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

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


### `closeSuggestions`

Function to close the autocomplete suggestions popup.

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


### 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 |


### giphyEnabled

Enable Giphy commands feature on the [`MessageInput`](/chat/docs/sdk/react-native/v4/ui-components/message-input/) component.

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


### maxMessageLength

Maximum length of the message text.
The default value is supplied by the [channel config](/chat/docs/javascript/channel_features/).

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


### numberOfLines

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

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


### 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](/chat/docs/javascript/update_users/) docs for
more details on filters/sort/options.

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

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


### `onChange`



### `openSuggestions`

Function to open the autocomplete suggestions popup. This function takes following two parameters:

- `component` - You can either pass a string or a react element.
  - string - `enum('MentionsItem' | 'CommandsItem' | 'EmojisItem')`. Based on value, one of the default components will be rendered as list item within suggestions list.
  - element - React element which takes `item` as a prop, which is a suggestion item within list set using `updateSuggestions`. This element is used to render item in the suggestions list.
- `title` - component to render a title for suggestions list.

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


### setGiphyActive

Setter function for [`giphyActive`](/chat/docs/sdk/react-native/v4/contexts/message-input-context#giphyactive/)

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


### setInputBoxRef

Setter function for [`inputBoxRef`](/chat/docs/sdk/react-native/v4/contexts/message-input-context#inputboxref/)

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


### setShowMoreOptions

Setter function for [`showMoreOptions`](/chat/docs/sdk/react-native/v4/contexts/message-input-context#showmoreoptions/).

| Type                        |
| --------------------------- |
| `(showMoreOptions) => 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 |


### `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) |


### `updateSuggestions`

Update the suggestions in autocomplete suggestions list. This function takes following two parameters:

- `suggestions` - `{ data: array<object>, onSelect: function }`
- `title` - new title component for suggestions list.

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



---

This page was last updated at 2026-05-13T13:38:45.605Z.

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