# AutoCompleteSuggestionHeader

Component to render and customize the header in the auto suggestion list.

## General Usage

You can customize the `AutoCompleteSuggestionHeader` component and provide it back to the SDK via the [`AutoCompleteSuggestionHeader`](https://getstream.io/chat/docs/sdk/react-native/v5/core-components/channel/#autocompletesuggestionheader) prop on `Channel` if desired.

For more details about its usage refer [`Customizing autocomplete suggestions`](https://getstream.io/chat/docs/sdk/react-native/v5/guides/customize-autocomplete-suggestion-list/).

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

const AutoCompleteSuggestionHeaderComponent = () => <AutoCompleteSuggestionHeader />

<Channel AutoCompleteSuggestionHeader={AutoCompleteSuggestionHeaderComponent} />
```

## Props

### `queryText`

The text which the user types in the message input to get autocomplete suggestions.

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

### `triggerType`

The trigger type triggers a particular type of autocomplete list depending on user input.

| Type                              |
| --------------------------------- |
| 'command' \| 'emoji' \| 'mention' |

---

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