instantsearch.js 4.73.3 → 4.74.0

package/cjs/connectors/answers/connectAnswers.js

@@ -47,14 +47,15 @@ var connectAnswers = function connectAnswers(renderFn) {
     var lastHits = [];
     var isLoading = false;
     var debouncedRender = (0, _utils.debounce)(renderFn, renderDebounceTime);
-
-    // this does not directly use DebouncedFunction<findAnswers>, since then the generic will disappear
     var debouncedRefine;
     return {
       $$type: 'ais.answers',
       init: function init(initOptions) {
         var state = initOptions.state,
           instantSearchInstance = initOptions.instantSearchInstance;
+        if (typeof instantSearchInstance.client.initIndex !== 'function') {
+          throw new Error(withUsage('`algoliasearch` <5 required.'));
+        }
         var answersIndex = instantSearchInstance.client.initIndex(state.index);
         if (!hasFindAnswersMethod(answersIndex)) {
           throw new Error(withUsage('`algoliasearch` >= 4.8.0 required.'));

package/cjs/connectors/configure-related-items/connectConfigureRelatedItems.js

@@ -81,5 +81,7 @@ var connectConfigureRelatedItems = function connectConfigureRelatedItems(renderF
     });
   };
 };
+
+/** @deprecated use connectRelatedItems instead */
 var _default = connectConfigureRelatedItems;
 exports.default = _default;

package/cjs/connectors/index.js

@@ -3,14 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EXPERIMENTAL_connectAnswers = void 0;
-Object.defineProperty(exports, "EXPERIMENTAL_connectConfigureRelatedItems", {
-  enumerable: true,
-  get: function get() {
-    return _connectConfigureRelatedItems.default;
-  }
-});
-exports.EXPERIMENTAL_connectDynamicWidgets = void 0;
+exports.EXPERIMENTAL_connectDynamicWidgets = exports.EXPERIMENTAL_connectConfigureRelatedItems = exports.EXPERIMENTAL_connectAnswers = void 0;
 Object.defineProperty(exports, "connectAutocomplete", {
   enumerable: true,
   get: function get() {
@@ -199,6 +192,7 @@ Object.defineProperty(exports, "connectVoiceSearch", {
 });
 var _utils = require("../lib/utils");
 var _connectAnswers = _interopRequireDefault(require("./answers/connectAnswers"));
+var _connectConfigureRelatedItems = _interopRequireDefault(require("./configure-related-items/connectConfigureRelatedItems"));
 var _connectDynamicWidgets = _interopRequireDefault(require("./dynamic-widgets/connectDynamicWidgets"));
 var _connectClearRefinements = _interopRequireDefault(require("./clear-refinements/connectClearRefinements"));
 var _connectCurrentRefinements = _interopRequireDefault(require("./current-refinements/connectCurrentRefinements"));
@@ -224,7 +218,6 @@ var _connectBreadcrumb = _interopRequireDefault(require("./breadcrumb/connectBre
 var _connectGeoSearch = _interopRequireDefault(require("./geo-search/connectGeoSearch"));
 var _connectPoweredBy = _interopRequireDefault(require("./powered-by/connectPoweredBy"));
 var _connectConfigure = _interopRequireDefault(require("./configure/connectConfigure"));
-var _connectConfigureRelatedItems = _interopRequireDefault(require("./configure-related-items/connectConfigureRelatedItems"));
 var _connectAutocomplete = _interopRequireDefault(require("./autocomplete/connectAutocomplete"));
 var _connectQueryRules = _interopRequireDefault(require("./query-rules/connectQueryRules"));
 var _connectVoiceSearch = _interopRequireDefault(require("./voice-search/connectVoiceSearch"));
@@ -235,7 +228,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 /** @deprecated answers is no longer supported */
 var EXPERIMENTAL_connectAnswers = (0, _utils.deprecate)(_connectAnswers.default, 'answers is no longer supported');
 
-/** @deprecated use connectDynamicWidgets */
+/** @deprecated use connectRelatedItems instead */
 exports.EXPERIMENTAL_connectAnswers = EXPERIMENTAL_connectAnswers;
+var EXPERIMENTAL_connectConfigureRelatedItems = (0, _utils.deprecate)(_connectConfigureRelatedItems.default, 'EXPERIMENTAL_connectConfigureRelatedItems is deprecated and will be removed in a next minor version of InstantSearch. Please use connectRelatedItems instead.');
+
+/** @deprecated use connectDynamicWidgets */
+exports.EXPERIMENTAL_connectConfigureRelatedItems = EXPERIMENTAL_connectConfigureRelatedItems;
 var EXPERIMENTAL_connectDynamicWidgets = (0, _utils.deprecate)(_connectDynamicWidgets.default, 'use connectDynamicWidgets');
 exports.EXPERIMENTAL_connectDynamicWidgets = EXPERIMENTAL_connectDynamicWidgets;

package/cjs/connectors/voice-search/connectVoiceSearch.js

@@ -54,12 +54,13 @@ var connectVoiceSearch = function connectVoiceSearch(renderFn) {
           this._refine = function (query) {
             if (query !== helper.state.query) {
               var queryLanguages = language ? [language.split('-')[0]] : undefined;
+              // @ts-ignore queryLanguages is allowed to be a string, not just an array
               helper.setQueryParameter('queryLanguages', queryLanguages);
               if (typeof additionalQueryParameters === 'function') {
                 helper.setState(helper.state.setQueryParameters(_objectSpread({
                   ignorePlurals: true,
                   removeStopWords: true,
-                  // @ts-ignore (optionalWords only allows array in v3, while string is also valid)
+                  // @ts-ignore optionalWords is allowed to be a string too
                   optionalWords: query
                 }, additionalQueryParameters({
                   query: query

package/cjs/index.js

@@ -13,6 +13,7 @@ var routers = _interopRequireWildcard(require("./lib/routers/index"));
 var stateMappings = _interopRequireWildcard(require("./lib/stateMappings/index"));
 var _version = _interopRequireDefault(require("./lib/version"));
 var middlewares = _interopRequireWildcard(require("./middlewares/index"));
+var templates = _interopRequireWildcard(require("./templates/index"));
 var widgets = _interopRequireWildcard(require("./widgets/index"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -41,6 +42,7 @@ instantsearch.widgets = widgets;
 instantsearch.middlewares = middlewares;
 instantsearch.routers = routers;
 instantsearch.stateMappings = stateMappings;
+instantsearch.templates = templates;
 instantsearch.createInfiniteHitsSessionStorageCache = _index3.createInfiniteHitsSessionStorageCache;
 instantsearch.highlight = helpers.highlight;
 instantsearch.reverseHighlight = helpers.reverseHighlight;

package/cjs/lib/InstantSearch.js

@@ -9,7 +9,7 @@ var _algoliasearchHelper = _interopRequireDefault(require("algoliasearch-helper"
 var _createInsightsMiddleware = require("../middlewares/createInsightsMiddleware");
 var _createMetadataMiddleware = require("../middlewares/createMetadataMiddleware");
 var _createRouterMiddleware = require("../middlewares/createRouterMiddleware");
-var _widgets = require("../widgets");
+var _index = _interopRequireDefault(require("../widgets/index/index"));
 var _createHelpers = _interopRequireDefault(require("./createHelpers"));
 var _utils = require("./utils");
 var _version = _interopRequireDefault(require("./version"));
@@ -175,7 +175,7 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
     _this.indexName = indexName;
     _this.helper = null;
     _this.mainHelper = null;
-    _this.mainIndex = (0, _widgets.index)({
+    _this.mainIndex = (0, _index.default)({
       indexName: indexName
     });
     _this.onStateChange = onStateChange;

package/cjs/lib/version.js

@@ -4,5 +4,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = '4.73.3';
+var _default = '4.74.0';
 exports.default = _default;

package/cjs/templates/carousel/carousel.js

@@ -0,0 +1,62 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.carousel = carousel;
+var _preact = require("htm/preact");
+var _instantsearchUiComponents = require("instantsearch-ui-components");
+var _preact2 = require("preact");
+var _hooks = require("preact/hooks");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var Carousel = (0, _instantsearchUiComponents.createCarouselComponent)({
+  createElement: _preact2.h,
+  Fragment: _preact2.Fragment
+});
+function CarouselWithRefs(props) {
+  var carouselRefs = {
+    listRef: (0, _hooks.useRef)(null),
+    nextButtonRef: (0, _hooks.useRef)(null),
+    previousButtonRef: (0, _hooks.useRef)(null),
+    carouselIdRef: (0, _hooks.useRef)((0, _instantsearchUiComponents.generateCarouselId)())
+  };
+  return (0, _preact2.h)(Carousel, _extends({}, carouselRefs, props));
+}
+function carousel() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    cssClasses = _ref.cssClasses,
+    _ref$templates = _ref.templates,
+    templates = _ref$templates === void 0 ? {} : _ref$templates;
+  return function CarouselTemplate(_ref2) {
+    var items = _ref2.items,
+      widgetTemplates = _ref2.templates,
+      _ref2$cssClasses = _ref2.cssClasses,
+      widgetCssClasses = _ref2$cssClasses === void 0 ? {} : _ref2$cssClasses;
+    var previous = templates.previous,
+      next = templates.next;
+    return (0, _preact2.h)(CarouselWithRefs, {
+      items: items,
+      itemComponent: widgetTemplates.item,
+      previousIconComponent: previous ? function () {
+        return previous({
+          html: _preact.html
+        });
+      } : undefined,
+      nextIconComponent: next ? function () {
+        return next({
+          html: _preact.html
+        });
+      } : undefined,
+      classNames: _objectSpread(_objectSpread({}, cssClasses), {
+        list: (0, _instantsearchUiComponents.cx)(cssClasses === null || cssClasses === void 0 ? void 0 : cssClasses.list, widgetCssClasses === null || widgetCssClasses === void 0 ? void 0 : widgetCssClasses.list),
+        item: (0, _instantsearchUiComponents.cx)(cssClasses === null || cssClasses === void 0 ? void 0 : cssClasses.item, widgetCssClasses === null || widgetCssClasses === void 0 ? void 0 : widgetCssClasses.item)
+      })
+    });
+  };
+}

package/cjs/templates/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _carousel = require("./carousel/carousel");
+Object.keys(_carousel).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _carousel[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _carousel[key];
+    }
+  });
+});

package/cjs/widgets/configure-related-items/configure-related-items.js

@@ -19,5 +19,7 @@ var configureRelatedItems = function configureRelatedItems(widgetParams) {
     $$widgetType: 'ais.configureRelatedItems'
   });
 };
+
+/** @deprecated use relatedItems instead */
 var _default = configureRelatedItems;
 exports.default = _default;

package/cjs/widgets/frequently-bought-together/frequently-bought-together.js

@@ -67,6 +67,29 @@ var renderer = function renderer(_ref) {
         data: results
       }));
     } : undefined;
+    var layoutComponent = templates.layout ? function (data) {
+      return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+        templateKey: "layout",
+        rootTagName: "fragment",
+        data: {
+          items: data.items,
+          templates: {
+            item: templates.item ? function (_ref4) {
+              var item = _ref4.item;
+              return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+                templateKey: "item",
+                rootTagName: "fragment",
+                data: item
+              }));
+            } : undefined
+          },
+          cssClasses: {
+            list: data.classNames.list,
+            item: data.classNames.item
+          }
+        }
+      }));
+    } : undefined;
     (0, _preact.render)((0, _preact.h)(FrequentlyBoughtTogether, {
       items: items,
       headerComponent: headerComponent,
@@ -74,23 +97,24 @@ var renderer = function renderer(_ref) {
       sendEvent: function sendEvent() {},
       classNames: cssClasses,
       emptyComponent: emptyComponent,
+      layout: layoutComponent,
       status: instantSearchInstance.status
     }), containerNode);
   };
 };
 var frequentlyBoughtTogether = function frequentlyBoughtTogether(widgetParams) {
-  var _ref4 = widgetParams || {},
-    container = _ref4.container,
-    objectIDs = _ref4.objectIDs,
-    limit = _ref4.limit,
-    queryParameters = _ref4.queryParameters,
-    threshold = _ref4.threshold,
-    escapeHTML = _ref4.escapeHTML,
-    transformItems = _ref4.transformItems,
-    _ref4$templates = _ref4.templates,
-    templates = _ref4$templates === void 0 ? {} : _ref4$templates,
-    _ref4$cssClasses = _ref4.cssClasses,
-    cssClasses = _ref4$cssClasses === void 0 ? {} : _ref4$cssClasses;
+  var _ref5 = widgetParams || {},
+    container = _ref5.container,
+    objectIDs = _ref5.objectIDs,
+    limit = _ref5.limit,
+    queryParameters = _ref5.queryParameters,
+    threshold = _ref5.threshold,
+    escapeHTML = _ref5.escapeHTML,
+    transformItems = _ref5.transformItems,
+    _ref5$templates = _ref5.templates,
+    templates = _ref5$templates === void 0 ? {} : _ref5$templates,
+    _ref5$cssClasses = _ref5.cssClasses,
+    cssClasses = _ref5$cssClasses === void 0 ? {} : _ref5$cssClasses;
   if (!container) {
     throw new Error(withUsage('The `container` option is required.'));
   }

package/cjs/widgets/index.js

@@ -3,14 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EXPERIMENTAL_answers = void 0;
-Object.defineProperty(exports, "EXPERIMENTAL_configureRelatedItems", {
-  enumerable: true,
-  get: function get() {
-    return _configureRelatedItems.default;
-  }
-});
-exports.EXPERIMENTAL_dynamicWidgets = void 0;
+exports.EXPERIMENTAL_dynamicWidgets = exports.EXPERIMENTAL_configureRelatedItems = exports.EXPERIMENTAL_answers = void 0;
 Object.defineProperty(exports, "analytics", {
   enumerable: true,
   get: function get() {
@@ -223,13 +216,13 @@ Object.defineProperty(exports, "voiceSearch", {
 });
 var _utils = require("../lib/utils");
 var _answers = _interopRequireDefault(require("./answers/answers"));
+var _configureRelatedItems = _interopRequireDefault(require("./configure-related-items/configure-related-items"));
 var _dynamicWidgets = _interopRequireDefault(require("./dynamic-widgets/dynamic-widgets"));
 var _analytics = _interopRequireDefault(require("./analytics/analytics"));
 var _breadcrumb = _interopRequireDefault(require("./breadcrumb/breadcrumb"));
 var _clearRefinements = _interopRequireDefault(require("./clear-refinements/clear-refinements"));
 var _configure = _interopRequireDefault(require("./configure/configure"));
 var _currentRefinements = _interopRequireDefault(require("./current-refinements/current-refinements"));
-var _configureRelatedItems = _interopRequireDefault(require("./configure-related-items/configure-related-items"));
 var _geoSearch = _interopRequireDefault(require("./geo-search/geo-search"));
 var _hierarchicalMenu = _interopRequireDefault(require("./hierarchical-menu/hierarchical-menu"));
 var _hits = _interopRequireDefault(require("./hits/hits"));
@@ -263,7 +256,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 /** @deprecated answers is no longer supported */
 var EXPERIMENTAL_answers = (0, _utils.deprecate)(_answers.default, 'answers is no longer supported');
 
-/** @deprecated use dynamicWidgets */
+/** @deprecated use relatedItems instead */
 exports.EXPERIMENTAL_answers = EXPERIMENTAL_answers;
+var EXPERIMENTAL_configureRelatedItems = (0, _utils.deprecate)(_configureRelatedItems.default, 'EXPERIMENTAL_configureRelatedItems is deprecated and will be removed in a next minor version of InstantSearch. Please use relatedItems instead.');
+
+/** @deprecated use dynamicWidgets */
+exports.EXPERIMENTAL_configureRelatedItems = EXPERIMENTAL_configureRelatedItems;
 var EXPERIMENTAL_dynamicWidgets = (0, _utils.deprecate)(_dynamicWidgets.default, 'use dynamicWidgets');
 exports.EXPERIMENTAL_dynamicWidgets = EXPERIMENTAL_dynamicWidgets;

package/cjs/widgets/looking-similar/looking-similar.js

@@ -67,6 +67,29 @@ function createRenderer(_ref) {
         data: results
       }));
     } : undefined;
+    var layoutComponent = templates.layout ? function (data) {
+      return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+        templateKey: "layout",
+        rootTagName: "fragment",
+        data: {
+          items: data.items,
+          templates: {
+            item: templates.item ? function (_ref4) {
+              var item = _ref4.item;
+              return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+                templateKey: "item",
+                rootTagName: "fragment",
+                data: item
+              }));
+            } : undefined
+          },
+          cssClasses: {
+            list: data.classNames.list,
+            item: data.classNames.item
+          }
+        }
+      }));
+    } : undefined;
     (0, _preact.render)((0, _preact.h)(LookingSimilar, {
       items: items,
       headerComponent: headerComponent,
@@ -74,24 +97,25 @@ function createRenderer(_ref) {
       sendEvent: function sendEvent() {},
       classNames: cssClasses,
       emptyComponent: emptyComponent,
+      layout: layoutComponent,
       status: instantSearchInstance.status
     }), containerNode);
   };
 }
 var lookingSimilar = function lookingSimilar(widgetParams) {
-  var _ref4 = widgetParams || {},
-    container = _ref4.container,
-    objectIDs = _ref4.objectIDs,
-    limit = _ref4.limit,
-    queryParameters = _ref4.queryParameters,
-    fallbackParameters = _ref4.fallbackParameters,
-    threshold = _ref4.threshold,
-    escapeHTML = _ref4.escapeHTML,
-    transformItems = _ref4.transformItems,
-    _ref4$templates = _ref4.templates,
-    templates = _ref4$templates === void 0 ? {} : _ref4$templates,
-    _ref4$cssClasses = _ref4.cssClasses,
-    cssClasses = _ref4$cssClasses === void 0 ? {} : _ref4$cssClasses;
+  var _ref5 = widgetParams || {},
+    container = _ref5.container,
+    objectIDs = _ref5.objectIDs,
+    limit = _ref5.limit,
+    queryParameters = _ref5.queryParameters,
+    fallbackParameters = _ref5.fallbackParameters,
+    threshold = _ref5.threshold,
+    escapeHTML = _ref5.escapeHTML,
+    transformItems = _ref5.transformItems,
+    _ref5$templates = _ref5.templates,
+    templates = _ref5$templates === void 0 ? {} : _ref5$templates,
+    _ref5$cssClasses = _ref5.cssClasses,
+    cssClasses = _ref5$cssClasses === void 0 ? {} : _ref5$cssClasses;
   if (!container) {
     throw new Error(withUsage('The `container` option is required.'));
   }

package/cjs/widgets/related-products/related-products.js

@@ -67,6 +67,29 @@ function createRenderer(_ref) {
         data: results
       }));
     } : undefined;
+    var layoutComponent = templates.layout ? function (data) {
+      return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+        templateKey: "layout",
+        rootTagName: "fragment",
+        data: {
+          items: data.items,
+          templates: {
+            item: templates.item ? function (_ref4) {
+              var item = _ref4.item;
+              return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+                templateKey: "item",
+                rootTagName: "fragment",
+                data: item
+              }));
+            } : undefined
+          },
+          cssClasses: {
+            list: data.classNames.list,
+            item: data.classNames.item
+          }
+        }
+      }));
+    } : undefined;
     (0, _preact.render)((0, _preact.h)(RelatedProducts, {
       items: items,
       sendEvent: function sendEvent() {},
@@ -74,24 +97,25 @@ function createRenderer(_ref) {
       headerComponent: headerComponent,
       itemComponent: itemComponent,
       emptyComponent: emptyComponent,
+      layout: layoutComponent,
       status: instantSearchInstance.status
     }), containerNode);
   };
 }
 var relatedProducts = function relatedProducts(widgetParams) {
-  var _ref4 = widgetParams || {},
-    container = _ref4.container,
-    objectIDs = _ref4.objectIDs,
-    limit = _ref4.limit,
-    queryParameters = _ref4.queryParameters,
-    fallbackParameters = _ref4.fallbackParameters,
-    threshold = _ref4.threshold,
-    escapeHTML = _ref4.escapeHTML,
-    transformItems = _ref4.transformItems,
-    _ref4$templates = _ref4.templates,
-    templates = _ref4$templates === void 0 ? {} : _ref4$templates,
-    _ref4$cssClasses = _ref4.cssClasses,
-    cssClasses = _ref4$cssClasses === void 0 ? {} : _ref4$cssClasses;
+  var _ref5 = widgetParams || {},
+    container = _ref5.container,
+    objectIDs = _ref5.objectIDs,
+    limit = _ref5.limit,
+    queryParameters = _ref5.queryParameters,
+    fallbackParameters = _ref5.fallbackParameters,
+    threshold = _ref5.threshold,
+    escapeHTML = _ref5.escapeHTML,
+    transformItems = _ref5.transformItems,
+    _ref5$templates = _ref5.templates,
+    templates = _ref5$templates === void 0 ? {} : _ref5$templates,
+    _ref5$cssClasses = _ref5.cssClasses,
+    cssClasses = _ref5$cssClasses === void 0 ? {} : _ref5$cssClasses;
   if (!container) {
     throw new Error(withUsage('The `container` option is required.'));
   }

package/cjs/widgets/trending-items/trending-items.js

@@ -67,6 +67,29 @@ function createRenderer(_ref) {
         data: results
       }));
     } : undefined;
+    var layoutComponent = templates.layout ? function (data) {
+      return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+        templateKey: "layout",
+        rootTagName: "fragment",
+        data: {
+          items: data.items,
+          templates: {
+            item: templates.item ? function (_ref4) {
+              var item = _ref4.item;
+              return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+                templateKey: "item",
+                rootTagName: "fragment",
+                data: item
+              }));
+            } : undefined
+          },
+          cssClasses: {
+            list: data.classNames.list,
+            item: data.classNames.item
+          }
+        }
+      }));
+    } : undefined;
     (0, _preact.render)((0, _preact.h)(TrendingItems, {
       items: items,
       sendEvent: function sendEvent() {},
@@ -74,25 +97,26 @@ function createRenderer(_ref) {
       headerComponent: headerComponent,
       itemComponent: itemComponent,
       emptyComponent: emptyComponent,
+      layout: layoutComponent,
       status: instantSearchInstance.status
     }), containerNode);
   };
 }
 var trendingItems = function trendingItems(widgetParams) {
-  var _ref4 = widgetParams || {},
-    container = _ref4.container,
-    facetName = _ref4.facetName,
-    facetValue = _ref4.facetValue,
-    limit = _ref4.limit,
-    queryParameters = _ref4.queryParameters,
-    fallbackParameters = _ref4.fallbackParameters,
-    threshold = _ref4.threshold,
-    escapeHTML = _ref4.escapeHTML,
-    transformItems = _ref4.transformItems,
-    _ref4$templates = _ref4.templates,
-    templates = _ref4$templates === void 0 ? {} : _ref4$templates,
-    _ref4$cssClasses = _ref4.cssClasses,
-    cssClasses = _ref4$cssClasses === void 0 ? {} : _ref4$cssClasses;
+  var _ref5 = widgetParams || {},
+    container = _ref5.container,
+    facetName = _ref5.facetName,
+    facetValue = _ref5.facetValue,
+    limit = _ref5.limit,
+    queryParameters = _ref5.queryParameters,
+    fallbackParameters = _ref5.fallbackParameters,
+    threshold = _ref5.threshold,
+    escapeHTML = _ref5.escapeHTML,
+    transformItems = _ref5.transformItems,
+    _ref5$templates = _ref5.templates,
+    templates = _ref5$templates === void 0 ? {} : _ref5$templates,
+    _ref5$cssClasses = _ref5.cssClasses,
+    cssClasses = _ref5$cssClasses === void 0 ? {} : _ref5$cssClasses;
   if (!container) {
     throw new Error(withUsage('The `container` option is required.'));
   }