Widgets

After Sitecore Search indexes your website content, you can request content from Sitecore Search using widgets. A widget is a configurable page component that collects and transmits the search-related content to your app.

For example, when you create a search results page, you request data for a search results widget using the SearchWidgetItem class. The following example describes a request for 10 index documents in the Product entity, including all the available attributes. The getWidgetData function makes the data request.

import { SearchWidgetItem } from "@sitecore-cloudsdk/search/browser";

// Configure the search request:
const widgetRequest = new SearchWidgetItem("product", "rfkid_7"); // Create a new widget request for the "Product" entity
widgetRequest.content = {}; // Request all attributes for the entity
widgetRequest.limit = 10; // Limit the number of results to 10

// ...

// Call the `getWidgetData` function to request the data:
const response = await getWidgetData(
  new WidgetRequestData([widgetRequest]),
);

Here's an example response, including attributes for a shoes index document:

{
  "brand": "Sneakers4All",
  "id": "id-12345",
  "image_url": "https://...",
  "name": "Men's Trainers",
  "price": "79.99",
  "source_id": "10569",
  "in_stock": true,
  "review_count": "...",
  "sku": "...",
  ...
}

You can use the SearchOptions interface to configure your request. For example, you could specify certain attributes to be returned in the response, add personalization options, or change the search limit and offset to paginate the results.