Overview

The Query Suggestions component displays a list of possible queries that the search engine detects the user may be looking for.

Selector

The selector for this component is <hawksearch-query-suggestions>.

The following data model is exposed to the Handlebars template:

{
  querySuggestions: Array<string>;
}

Name	Parameter

Name	Parameter
query-suggestions	`Array<string>`

This helper function creates a comma-separated list of links with the hawksearch-query attribute, using the word “or” before the last link.

Attribute Name	Attribute Value

Attribute Name	Attribute Value
hawksearch-query	`string`

When an element with this attribute is clicked, a new search will be formed for the specified query.

<div class="query-suggestions">
    <p>Did you mean to search for {{query-suggestions querySuggestions}}?</p>
</div>