React SDK


The FieldDictionary class is used to map fields in your data to the required fields to display in the UI.

In previous versions, this mapping was done via the Results component. Now it's provided via the fields property into the SearchProvider instead.

Note: This is not required with the @sajari/react-hooks package.


The values can be either:

  • A String - a simple mapping to a field in your schema.
  • A Function - the search result object is passed to the function and then a string is expected back with the value to be used.
  • An Array - An array in order of priority, the first match in the array will be used.
  • A string template - This can be used to inject a value into a template - e.g. url: "/products/${handle}"
Editable Example



By default, the fields for a website search collection are used.

id'_id'Unique identifier for the record.
url'url'URL for the record, required for links in results.
title'title'The main title for the result.
subtitle'url'The subtitle. Often a brand, category, or the URL.
description'description'A description to display beneath the title and subtitle.
image 'image'An image, if applicable.
price'price'A price, if applicable.
originalPrice'originalPrice'An original price, if applicable. If the value is more than price (or it's index if price & originalPrice are both arrays) then the original price will be displayed (with strikethrough) and the current price highlighted in red.
rating'rating'A rating, if applicable.