Searchstax ResultWidget for React and Next.js


The SearchStax Site Search solution offers a React and Next.js results widget to assist with your custom search page.

The SearchstaxResultsWidget displays the search results.

Usage

<SearchstaxResultsWidget
  afterLinkClick={afterLinkClick}
/>

Props

  • afterLinkClick – Callback when a result link is clicked. Allows handling link click behavior.
  • noResultTemplate – Renders custom UI when no results are returned.
  • resultsTemplate – Renders custom UI for the results list.

noResultTemplate

Customize the no results UI.

It receives:

  • searchTerm – The search term used
  • metaData – Search metadata object

resultsTemplate

Customize the results UI.

It receives:

  • searchResults – Array of result items
  • resultClicked – Handler when a result is clicked

Example

<SearchstaxResultsWidget
  afterLinkClick={afterLinkClick}

  noResultTemplate={(searchTerm, metaData) => (
    <div>
      {/* Custom no result UI */}
    </div>
  )}

  resultsTemplate={(searchResults, resultClicked) => (
    <div>
      {searchResults.map(result => (
        <div
          key={result.uniqueId}
          onClick={() => resultClicked(result)}
        >
          {/* Custom result UI */}
        </div>
      ))}
    </div>
  )}
/>


Questions?

Do not hesitate to contact the SearchStax Support Desk.