Using selected query suggestion as new search input value

We use query suggestions, but when a user has selected a query we want to move this to be the new value of our search input field. We can’t seem to find a way to set the value of the search input field. We are using react and the instantsearch library. Any suggestions on how to do this?

You’ll need to modify the searchbox’s state, either via a hook (for React hooks) or a connector (for the older React InstantSearch library).

Here’s a more complex example that uses an autocomplete component to display both sets of results, but it also gives a model for how to manipulate the query value for a SearchBox component:

And a similar example using a connector: