react-native-searchbox provides declarative props to query Elasticsearch, and bind UI components with different types of search queries. As the name suggests, it provides a default UI component for searchbox.


To install react-native-searchbox, you can use npm or yarn to get set as follows:

Using npm

npm install @appbaseio/react-native-searchbox

Using yarn

yarn add @appbaseio/react-native-searchbox

react-native-searchbox requires react-native-vector-icons as a peer dependency. Expo or create-react-native-app projects include react-native-vector-icons out of the box, so all you need to do is install @appbaseio/react-native-searchbox.

If your project is a standard React Native project created using react-native init (it should have an ios/android directory), then you have to install the react-native-vector-icons along with react-native-searchbox.

Basic usage

A simple example

The following example renders an autosuggestion search bar(search-component) with one custom component(result-component) to render the results. The result-component watches the search-component for input changes and updates its UI when the user selects a suggestion.

An example with a facet

You can check out the docs for API Reference over here.