instantsearch.js 4.66.1 → 4.68.0

package/dist/instantsearch.development.js

@@ -1,4 +1,4 @@
-/*! InstantSearch.js 4.66.1 | © Algolia, Inc. and contributors; MIT License | https://github.com/algolia/instantsearch */
+/*! InstantSearch.js 4.68.0 | © Algolia, Inc. and contributors; MIT License | https://github.com/algolia/instantsearch */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
   typeof define === 'function' && define.amd ? define(factory) :
@@ -2666,6 +2666,7 @@
           });
         },
         getWidgetRenderState: function getWidgetRenderState(_ref2) {
+          var _results$renderingCon, _results$renderingCon2, _results$renderingCon3;
           var results = _ref2.results,
             helper = _ref2.helper,
             instantSearchInstance = _ref2.instantSearchInstance;
@@ -2691,6 +2692,7 @@
             return {
               hits: [],
               results: undefined,
+              banner: undefined,
               sendEvent: sendEvent,
               bindEvent: bindEvent,
               widgetParams: widgetParams
@@ -2704,9 +2706,11 @@
           var transformedHits = transformItems(hitsWithAbsolutePositionAndQueryID, {
             results: results
           });
+          var banner = (_results$renderingCon = results.renderingContent) === null || _results$renderingCon === void 0 ? void 0 : (_results$renderingCon2 = _results$renderingCon.widgets) === null || _results$renderingCon2 === void 0 ? void 0 : (_results$renderingCon3 = _results$renderingCon2.banners) === null || _results$renderingCon3 === void 0 ? void 0 : _results$renderingCon3[0];
           return {
             hits: transformedHits,
             results: results,
+            banner: banner,
             sendEvent: sendEvent,
             bindEvent: bindEvent,
             widgetParams: widgetParams
@@ -6101,12 +6105,15 @@
    *    This event contains a {@link SearchResults} object and the
    *    {@link SearchParameters} corresponding to this answer.
    * @param {AlgoliaSearchHelper} mainHelper the main helper
-   * @param {function} fn the function to create the derived state
+   * @param {function} fn the function to create the derived state for search
+   * @param {function} recommendFn the function to create the derived state for recommendations
    */
-  function DerivedHelper(mainHelper, fn) {
+  function DerivedHelper(mainHelper, fn, recommendFn) {
     this.main = mainHelper;
     this.fn = fn;
+    this.recommendFn = recommendFn;
     this.lastResults = null;
+    this.lastRecommendResults = null;
   }
 
   inherits_1(DerivedHelper, events);
@@ -6125,6 +6132,10 @@
     return this.fn(parameters);
   };
 
+  DerivedHelper.prototype.getModifiedRecommendState = function (parameters) {
+    return this.recommendFn(parameters);
+  };
+
   var DerivedHelper_1 = DerivedHelper;
 
   /**
@@ -6285,7 +6296,18 @@
     constructor: RecommendParameters,
 
     addParams: function (params) {
-      return new RecommendParameters({ params: this.params.concat(params) });
+      var newParams = this.params.slice();
+      var existingParamsIndex = this.params.findIndex(function (currentParams) {
+        return currentParams.$$id === params.$$id;
+      });
+
+      if (existingParamsIndex !== -1) {
+        newParams.splice(existingParamsIndex, 1, params);
+      } else {
+        newParams.push(params);
+      }
+
+      return new RecommendParameters({ params: newParams });
     },
 
     removeParams: function (id) {
@@ -6295,6 +6317,45 @@
         }),
       });
     },
+
+    addFrequentlyBoughtTogether: function (params) {
+      return this.addParams(
+        Object.assign({}, params, { model: 'bought-together' })
+      );
+    },
+
+    addRelatedProducts: function (params) {
+      return this.addParams(
+        Object.assign({}, params, { model: 'related-products' })
+      );
+    },
+
+    addTrendingItems: function (params) {
+      return this.addParams(
+        Object.assign({}, params, { model: 'trending-items' })
+      );
+    },
+
+    addTrendingFacets: function (params) {
+      return this.addParams(
+        Object.assign({}, params, { model: 'trending-facets' })
+      );
+    },
+
+    addLookingSimilar: function (params) {
+      return this.addParams(
+        Object.assign({}, params, { model: 'looking-similar' })
+      );
+    },
+
+    _buildQueries: function (indexName) {
+      return this.params.map(function (params) {
+        var query = Object.assign({}, params, { indexName: indexName });
+        delete query.$$id;
+
+        return query;
+      });
+    },
   };
 
   var RecommendParameters_1 = RecommendParameters;
@@ -10146,7 +10207,7 @@
 
   var SearchResults_1 = SearchResults;
 
-  var version = '3.17.0';
+  var version = '3.19.0';
 
   var escapeFacetValue$4 = escapeFacetValue_1.escapeFacetValue;
 
@@ -10276,10 +10337,14 @@
       params: opts.recommendState,
     });
     this.lastResults = null;
+    this.lastRecommendResults = null;
     this._queryId = 0;
+    this._recommendQueryId = 0;
     this._lastQueryIdReceived = -1;
+    this._lastRecommendQueryIdReceived = -1;
     this.derivedHelpers = [];
     this._currentNbQueries = 0;
+    this._currentNbRecommendQueries = 0;
     this._searchResultsOptions = searchResultsOptions;
   }
 
@@ -10306,6 +10371,21 @@
     return this;
   };
 
+  /**
+   * Sends the recommendation queries set in the state. When the method is
+   * called, it triggers a `fetch` event. The results will be available through
+   * the `result` event. If an error occurs, an `error` will be fired instead.
+   * @return {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires fetch
+   * @fires result
+   * @fires error
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.recommend = function () {
+    this._recommend();
+    return this;
+  };
+
   /**
    * Gets the search query parameters that would be sent to the Algolia Client
    * for the hits
@@ -10802,6 +10882,86 @@
     return this;
   };
 
+  /**
+   * Adds a "frequently bought together" recommendation query.
+   *
+   * @param {FrequentlyBoughtTogetherQuery} params the parameters for the recommendation
+   * @return {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.addFrequentlyBoughtTogether = function (params) {
+    this._recommendChange({
+      state: this.recommendState.addFrequentlyBoughtTogether(params),
+    });
+
+    return this;
+  };
+
+  /**
+   * Adds a "related products" recommendation query.
+   *
+   * @param {RelatedProductsQuery} params the parameters for the recommendation
+   * @return {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.addRelatedProducts = function (params) {
+    this._recommendChange({
+      state: this.recommendState.addRelatedProducts(params),
+    });
+
+    return this;
+  };
+
+  /**
+   * Adds a "trending items" recommendation query.
+   *
+   * @param {TrendingItemsQuery} params the parameters for the recommendation
+   * @return {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.addTrendingItems = function (params) {
+    this._recommendChange({
+      state: this.recommendState.addTrendingItems(params),
+    });
+
+    return this;
+  };
+
+  /**
+   * Adds a "trending facets" recommendation query.
+   *
+   * @param {TrendingFacetsQuery} params the parameters for the recommendation
+   * @return {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.addTrendingFacets = function (params) {
+    this._recommendChange({
+      state: this.recommendState.addTrendingFacets(params),
+    });
+
+    return this;
+  };
+
+  /**
+   * Adds a "looking similar" recommendation query.
+   *
+   * @param {LookingSimilarQuery} params the parameters for the recommendation
+   * @return {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.addLookingSimilar = function (params) {
+    this._recommendChange({
+      state: this.recommendState.addLookingSimilar(params),
+    });
+
+    return this;
+  };
+
   /**
    * Removes an numeric filter to an attribute with the `operator` and `value` provided. If the
    * filter is not set, it doesn't change the filters.
@@ -10971,6 +11131,86 @@
     return this;
   };
 
+  /**
+   * Removes a "frequently bought together" recommendation query.
+   *
+   * @param {string} id identifier of the recommendation widget
+   * @returns {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.removeFrequentlyBoughtTogether = function (id) {
+    this._recommendChange({
+      state: this.recommendState.removeParams(id),
+    });
+
+    return this;
+  };
+
+  /**
+   * Removes a "related products" recommendation query.
+   *
+   * @param {string} id identifier of the recommendation widget
+   * @returns {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.removeRelatedProducts = function (id) {
+    this._recommendChange({
+      state: this.recommendState.removeParams(id),
+    });
+
+    return this;
+  };
+
+  /**
+   * Removes a "trending items" recommendation query.
+   *
+   * @param {string} id identifier of the recommendation widget
+   * @returns {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.removeTrendingItems = function (id) {
+    this._recommendChange({
+      state: this.recommendState.removeParams(id),
+    });
+
+    return this;
+  };
+
+  /**
+   * Removes a "trending facets" recommendation query.
+   *
+   * @param {string} id identifier of the recommendation widget
+   * @returns {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.removeTrendingFacets = function (id) {
+    this._recommendChange({
+      state: this.recommendState.removeParams(id),
+    });
+
+    return this;
+  };
+
+  /**
+   * Removes a "looking similar" recommendation query.
+   *
+   * @param {string} id identifier of the recommendation widget
+   * @returns {AlgoliaSearchHelper} Method is chainable, it returns itself
+   * @fires change
+   * @chainable
+   */
+  AlgoliaSearchHelper.prototype.removeLookingSimilar = function (id) {
+    this._recommendChange({
+      state: this.recommendState.removeParams(id),
+    });
+
+    return this;
+  };
+
   /**
    * Adds or removes an exclusion filter to a faceted attribute with the `value` provided. If
    * the value is set then it removes it, otherwise it adds the filter.
@@ -11538,6 +11778,85 @@
     return undefined;
   };
 
+  AlgoliaSearchHelper.prototype._recommend = function () {
+    var searchState = this.state;
+    var recommendState = this.recommendState;
+    var index = this.getIndex();
+    var states = [{ state: recommendState, index: index, helper: this }];
+
+    this.emit('fetch', {
+      recommend: {
+        state: recommendState,
+        results: this.lastRecommendResults,
+      },
+    });
+
+    var derivedQueries = this.derivedHelpers.map(function (derivedHelper) {
+      var derivedIndex = derivedHelper.getModifiedState(searchState).index;
+      if (!derivedIndex) {
+        return [];
+      }
+
+      // Contrary to what is done when deriving the search state, we don't want to
+      // provide the current recommend state to the derived helper, as it would
+      // inherit unwanted queries. We instead provide an empty recommend state.
+      var derivedState = derivedHelper.getModifiedRecommendState(
+        new RecommendParameters_1()
+      );
+      states.push({
+        state: derivedState,
+        index: derivedIndex,
+        helper: derivedHelper,
+      });
+
+      derivedHelper.emit('fetch', {
+        recommend: {
+          state: derivedState,
+          results: derivedHelper.lastRecommendResults,
+        },
+      });
+
+      return derivedState._buildQueries(derivedIndex);
+    });
+
+    var queries = Array.prototype.concat.apply(
+      this.recommendState._buildQueries(index),
+      derivedQueries
+    );
+
+    if (queries.length === 0) {
+      return;
+    }
+
+    if (
+      queries.length > 0 &&
+      typeof this.client.getRecommendations === 'undefined'
+    ) {
+      // eslint-disable-next-line no-console
+      console.warn(
+        'Please update algoliasearch/lite to the latest version in order to use recommendations widgets.'
+      );
+      return;
+    }
+
+    var queryId = this._recommendQueryId++;
+    this._currentNbRecommendQueries++;
+
+    try {
+      this.client
+        .getRecommendations(queries)
+        .then(this._dispatchRecommendResponse.bind(this, queryId, states))
+        .catch(this._dispatchRecommendError.bind(this, queryId));
+    } catch (error) {
+      // If we reach this part, we're in an internal error state
+      this.emit('error', {
+        error: error,
+      });
+    }
+
+    return;
+  };
+
   /**
    * Transform the responses as sent by the server and transform them into a user
    * usable object that merge the results of all the batch requests. It will dispatch
@@ -11597,6 +11916,53 @@
     });
   };
 
+  AlgoliaSearchHelper.prototype._dispatchRecommendResponse = function (
+    queryId,
+    states,
+    content
+  ) {
+    // @TODO remove the number of outdated queries discarded instead of just one
+
+    if (queryId < this._lastRecommendQueryIdReceived) {
+      // Outdated answer
+      return;
+    }
+
+    this._currentNbRecommendQueries -=
+      queryId - this._lastRecommendQueryIdReceived;
+    this._lastRecommendQueryIdReceived = queryId;
+
+    if (this._currentNbRecommendQueries === 0) this.emit('recommendQueueEmpty');
+
+    var results = content.results.slice();
+
+    states.forEach(function (s) {
+      var state = s.state;
+      var helper = s.helper;
+
+      if (!s.index) {
+        // eslint-disable-next-line no-warning-comments
+        // TODO: emit "result" event when events for Recommend are implemented
+        helper.emit('recommend:result', {
+          results: null,
+          state: state,
+        });
+        return;
+      }
+
+      helper.lastRecommendResults = results;
+
+      // eslint-disable-next-line no-warning-comments
+      // TODO: emit "result" event when events for Recommend are implemented
+      helper.emit('recommend:result', {
+        recommend: {
+          results: helper.lastRecommendResults,
+          state: state,
+        },
+      });
+    });
+  };
+
   AlgoliaSearchHelper.prototype._dispatchAlgoliaError = function (
     queryId,
     error
@@ -11616,6 +11982,26 @@
     if (this._currentNbQueries === 0) this.emit('searchQueueEmpty');
   };
 
+  AlgoliaSearchHelper.prototype._dispatchRecommendError = function (
+    queryId,
+    error
+  ) {
+    if (queryId < this._lastRecommendQueryIdReceived) {
+      // Outdated answer
+      return;
+    }
+
+    this._currentNbRecommendQueries -=
+      queryId - this._lastRecommendQueryIdReceived;
+    this._lastRecommendQueryIdReceived = queryId;
+
+    this.emit('error', {
+      error: error,
+    });
+
+    if (this._currentNbRecommendQueries === 0) this.emit('recommendQueueEmpty');
+  };
+
   AlgoliaSearchHelper.prototype.containsRefinement = function (
     query,
     facetFilters,
@@ -11666,6 +12052,16 @@
 
       // eslint-disable-next-line no-warning-comments
       // TODO: emit "change" event when events for Recommend are implemented
+      this.emit('recommend:change', {
+        search: {
+          results: this.lastResults,
+          state: this.state,
+        },
+        recommend: {
+          results: this.lastRecommendResults,
+          state: this.recommendState,
+        },
+      });
     }
   };
 
@@ -11720,10 +12116,11 @@
    * and the SearchParameters that is returned by the call of the
    * parameter function.
    * @param {function} fn SearchParameters -> SearchParameters
+   * @param {function} recommendFn RecommendParameters -> RecommendParameters
    * @return {DerivedHelper} a new DerivedHelper
    */
-  AlgoliaSearchHelper.prototype.derive = function (fn) {
-    var derivedHelper = new DerivedHelper_1(this, fn);
+  AlgoliaSearchHelper.prototype.derive = function (fn, recommendFn) {
+    var derivedHelper = new DerivedHelper_1(this, fn, recommendFn);
     this.derivedHelpers.push(derivedHelper);
     return derivedHelper;
   };
@@ -11825,6 +12222,13 @@
    */
   algoliasearchHelper.SearchParameters = SearchParameters_1;
 
+  /**
+   * Constructor for the object containing all the parameters for Recommend.
+   * @member module:algoliasearchHelper.RecommendParameters
+   * @type {RecommendParameters}
+   */
+  algoliasearchHelper.RecommendParameters = RecommendParameters_1;
+
   /**
    * Constructor for the object containing the results of the search.
    * @member module:algoliasearchHelper.SearchResults
@@ -14413,7 +14817,8 @@
     };
   };
 
-  var _excluded$7 = ["initialSearchParameters"];
+  var _excluded$7 = ["initialSearchParameters"],
+    _excluded2$2 = ["initialRecommendParameters"];
   var withUsage$q = createDocumentationMessageGenerator({
     name: 'index-widget'
   });
@@ -14424,6 +14829,7 @@
    */
   function privateHelperSetState(helper, _ref) {
     var state = _ref.state,
+      recommendState = _ref.recommendState,
       isPageReset = _ref.isPageReset,
       _uiState = _ref._uiState;
     if (state !== helper.state) {
@@ -14435,7 +14841,14 @@
         _uiState: _uiState
       });
     }
+    if (recommendState !== helper.recommendState) {
+      helper.recommendState = recommendState;
+
+      // eslint-disable-next-line no-warning-comments
+      // TODO: emit "change" event when events for Recommend are implemented
+    }
   }
+
   function getLocalWidgetsUiState(widgets, widgetStateOptions) {
     var initialUiState = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
     return widgets.reduce(function (uiState, widget) {
@@ -14454,15 +14867,26 @@
   function getLocalWidgetsSearchParameters(widgets, widgetSearchParametersOptions) {
     var initialSearchParameters = widgetSearchParametersOptions.initialSearchParameters,
       rest = _objectWithoutProperties(widgetSearchParametersOptions, _excluded$7);
-    return widgets.filter(function (widget) {
-      return !isIndexWidget(widget);
-    }).reduce(function (state, widget) {
-      if (!widget.getWidgetSearchParameters) {
+    return widgets.reduce(function (state, widget) {
+      if (!widget.getWidgetSearchParameters || isIndexWidget(widget)) {
         return state;
       }
+      if (widget.dependsOn === 'search' && widget.getWidgetParameters) {
+        return widget.getWidgetParameters(state, rest);
+      }
       return widget.getWidgetSearchParameters(state, rest);
     }, initialSearchParameters);
   }
+  function getLocalWidgetsRecommendParameters(widgets, widgetRecommendParametersOptions) {
+    var initialRecommendParameters = widgetRecommendParametersOptions.initialRecommendParameters,
+      rest = _objectWithoutProperties(widgetRecommendParametersOptions, _excluded2$2);
+    return widgets.reduce(function (state, widget) {
+      if (!isIndexWidget(widget) && widget.dependsOn === 'recommend' && widget.getWidgetParameters) {
+        return widget.getWidgetParameters(state, rest);
+      }
+      return state;
+    }, initialRecommendParameters);
+  }
   function resetPageFromWidgets(widgets) {
     var indexWidgets = widgets.filter(isIndexWidget);
     if (indexWidgets.length === 0) {
@@ -14472,6 +14896,7 @@
       var widgetHelper = widget.getHelper();
       privateHelperSetState(widgetHelper, {
         state: widgetHelper.state.resetPage(),
+        recommendState: widgetHelper.recommendState,
         isPageReset: true
       });
       resetPageFromWidgets(widget.getWidgets());
@@ -14530,9 +14955,18 @@
       },
       getScopedResults: function getScopedResults() {
         var widgetParent = this.getParent();
-
-        // If the widget is the root, we consider itself as the only sibling.
-        var widgetSiblings = widgetParent ? widgetParent.getWidgets() : [this];
+        var widgetSiblings;
+        if (widgetParent) {
+          widgetSiblings = widgetParent.getWidgets();
+        } else if (indexName.length === 0) {
+          // The widget is the root but has no index name:
+          // we resolve results from its children index widgets
+          widgetSiblings = this.getWidgets();
+        } else {
+          // The widget is the root and has an index name:
+          // we consider itself as the only sibling
+          widgetSiblings = [this];
+        }
         return resolveScopedResultsFromWidgets(widgetSiblings);
       },
       getParent: function getParent() {
@@ -14567,6 +15001,10 @@
               uiState: localUiState,
               initialSearchParameters: helper.state
             }),
+            recommendState: getLocalWidgetsRecommendParameters(localWidgets, {
+              uiState: localUiState,
+              initialRecommendParameters: helper.recommendState
+            }),
             _uiState: localUiState
           });
 
@@ -14663,11 +15101,16 @@
             index: indexName
           })
         });
+        var recommendParameters = getLocalWidgetsRecommendParameters(localWidgets, {
+          uiState: localUiState,
+          initialRecommendParameters: new algoliasearchHelper_1.RecommendParameters()
+        });
 
         // This Helper is only used for state management we do not care about the
         // `searchClient`. Only the "main" Helper created at the `InstantSearch`
         // level is aware of the client.
         helper = algoliasearchHelper_1({}, parameters.index, parameters);
+        helper.recommendState = recommendParameters;
 
         // We forward the call to `search` to the "main" instance of the Helper
         // which is responsible for managing the queries (it's the only one that is
@@ -14698,6 +15141,8 @@
         };
         derivedHelper = mainHelper.derive(function () {
           return mergeSearchParameters.apply(void 0, [mainHelper.state].concat(_toConsumableArray(resolveSearchParameters(_this3))));
+        }, function () {
+          return _this3.getHelper().recommendState;
         });
         var indexInitialResults = (_instantSearchInstanc = instantSearchInstance._initialResults) === null || _instantSearchInstanc === void 0 ? void 0 : _instantSearchInstanc[this.getIndexId()];
         if (indexInitialResults) {
@@ -14746,6 +15191,21 @@
           lastValidSearchParameters = results === null || results === void 0 ? void 0 : results._state;
         });
 
+        // eslint-disable-next-line no-warning-comments
+        // TODO: listen to "result" event when events for Recommend are implemented
+        derivedHelper.on('recommend:result', function (_ref5) {
+          var recommend = _ref5.recommend;
+          // The index does not render the results it schedules a new render
+          // to let all the other indices emit their own results. It allows us to
+          // run the render process in one pass.
+          instantSearchInstance.scheduleRender();
+
+          // the derived helper is the one which actually searches, but the helper
+          // which is exposed e.g. via instance.helper, doesn't search, and thus
+          // does not have access to lastRecommendResults.
+          helper.lastRecommendResults = recommend.results;
+        });
+
         // We compute the render state before calling `init` in a separate loop
         // to construct the whole render state object that is then passed to
         // `init`.
@@ -14796,9 +15256,9 @@
           instantSearchInstance.scheduleRender();
         }
       },
-      render: function render(_ref5) {
+      render: function render(_ref6) {
         var _this4 = this;
-        var instantSearchInstance = _ref5.instantSearchInstance;
+        var instantSearchInstance = _ref6.instantSearchInstance;
         // we can't attach a listener to the error event of search, as the error
         // then would no longer be thrown for global handlers.
         if (instantSearchInstance.status === 'error' && !instantSearchInstance.mainHelper.hasPendingRequests() && lastValidSearchParameters) {
@@ -14808,6 +15268,14 @@
         // We only render index widgets if there are no results.
         // This makes sure `render` is never called with `results` being `null`.
         var widgetsToRender = this.getResults() ? localWidgets : localWidgets.filter(isIndexWidget);
+        widgetsToRender = widgetsToRender.filter(function (widget) {
+          if (!widget.shouldRender) {
+            return true;
+          }
+          return widget.shouldRender({
+            instantSearchInstance: instantSearchInstance
+          });
+        });
         widgetsToRender.forEach(function (widget) {
           if (widget.getRenderState) {
             var renderState = widget.getRenderState(instantSearchInstance.renderState[_this4.getIndexId()] || {}, createRenderArgs(instantSearchInstance, _this4));
@@ -14866,8 +15334,8 @@
          _warning(false, 'The `getWidgetState` method is renamed `getWidgetUiState` and will no longer exist under that name in InstantSearch.js 5.x. Please use `getWidgetUiState` instead.') ;
         return this.getWidgetUiState(uiState);
       },
-      getWidgetSearchParameters: function getWidgetSearchParameters(searchParameters, _ref6) {
-        var uiState = _ref6.uiState;
+      getWidgetSearchParameters: function getWidgetSearchParameters(searchParameters, _ref7) {
+        var uiState = _ref7.uiState;
         return getLocalWidgetsSearchParameters(localWidgets, {
           uiState: uiState,
           initialSearchParameters: searchParameters
@@ -14887,10 +15355,10 @@
       }
     };
   };
-  function storeRenderState(_ref7) {
-    var renderState = _ref7.renderState,
-      instantSearchInstance = _ref7.instantSearchInstance,
-      parent = _ref7.parent;
+  function storeRenderState(_ref8) {
+    var renderState = _ref8.renderState,
+      instantSearchInstance = _ref8.instantSearchInstance,
+      parent = _ref8.parent;
     var parentIndexName = parent ? parent.getIndexId() : instantSearchInstance.mainIndex.getIndexId();
     instantSearchInstance.renderState = _objectSpread2(_objectSpread2({}, instantSearchInstance.renderState), {}, _defineProperty({}, parentIndexName, _objectSpread2(_objectSpread2({}, instantSearchInstance.renderState[parentIndexName]), renderState)));
   }
@@ -14960,7 +15428,7 @@
     };
   }
 
-  var version$1 = '4.66.1';
+  var version$1 = '4.68.0';
 
   var withUsage$r = createDocumentationMessageGenerator({
     name: 'instantsearch'
@@ -15323,7 +15791,7 @@
           // under the hood, we have a different implementation. It should be
           // completely transparent for the rest of the codebase. Only this module
           // is impacted.
-          return mainHelper.searchOnlyWithDerivedHelpers();
+          return mainHelper.searchOnlyWithDerivedHelpers() && mainHelper.recommend();
         };
         if (this._searchFunction) {
           // this client isn't used to actually search, but required for the helper
@@ -15730,12 +16198,43 @@
     };
   }
 
-  var _excluded$a = ["classNames", "hits", "itemComponent", "sendEvent", "emptyComponent"];
+  var _excluded$a = ["classNames", "hits", "itemComponent", "sendEvent", "emptyComponent", "banner", "bannerComponent"];
 
   // Should be imported from a shared package in the future
 
-  function createHitsComponent(_ref) {
+  function createDefaultBannerComponent(_ref) {
     var createElement = _ref.createElement;
+    return function DefaultBanner(_ref2) {
+      var _banner$link;
+      var classNames = _ref2.classNames,
+        banner = _ref2.banner;
+      if (!banner.image.urls[0].url) {
+        return null;
+      }
+      return createElement("aside", {
+        className: cx('ais-Hits-banner', classNames.bannerRoot)
+      }, (_banner$link = banner.link) !== null && _banner$link !== void 0 && _banner$link.url ? createElement("a", {
+        className: cx('ais-Hits-banner-link', classNames.bannerLink),
+        href: banner.link.url,
+        target: banner.link.target
+      }, createElement("img", {
+        className: cx('ais-Hits-banner-image', classNames.bannerImage),
+        src: banner.image.urls[0].url,
+        alt: banner.image.title
+      })) : createElement("img", {
+        className: cx('ais-Hits-banner-image', classNames.bannerImage),
+        src: banner.image.urls[0].url,
+        alt: banner.image.title
+      }));
+    };
+  }
+  function createHitsComponent(_ref3) {
+    var createElement = _ref3.createElement,
+      Fragment = _ref3.Fragment;
+    var DefaultBannerComponent = createDefaultBannerComponent({
+      createElement: createElement,
+      Fragment: Fragment
+    });
     return function Hits(userProps) {
       var _userProps$classNames = userProps.classNames,
         classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
@@ -15743,15 +16242,18 @@
         ItemComponent = userProps.itemComponent,
         sendEvent = userProps.sendEvent,
         EmptyComponent = userProps.emptyComponent,
+        banner = userProps.banner,
+        BannerComponent = userProps.bannerComponent,
         props = _objectWithoutProperties$1(userProps, _excluded$a);
-      if (hits.length === 0 && EmptyComponent) {
-        return createElement(EmptyComponent, {
-          className: cx('ais-Hits', classNames.root, cx('ais-Hits--empty', classNames.emptyRoot), props.className)
-        });
-      }
       return createElement("div", _extends$1({}, props, {
         className: cx('ais-Hits', classNames.root, hits.length === 0 && cx('ais-Hits--empty', classNames.emptyRoot), props.className)
-      }), createElement("ol", {
+      }), banner && (BannerComponent ? createElement(BannerComponent, {
+        className: cx('ais-Hits-banner', classNames.bannerRoot),
+        banner: banner
+      }) : createElement(DefaultBannerComponent, {
+        classNames: classNames,
+        banner: banner
+      })), hits.length === 0 && EmptyComponent ? createElement(EmptyComponent, null) : createElement("ol", {
         className: cx('ais-Hits-list', classNames.list)
       }, hits.map(function (hit, index) {
         return createElement(ItemComponent, {
@@ -16636,7 +17138,7 @@
   }
 
   var _excluded$e = ["hit", "attribute", "cssClasses"],
-    _excluded2$2 = ["isHighlighted"];
+    _excluded2$3 = ["isHighlighted"];
   function ReverseHighlight$1(_ref) {
     var hit = _ref.hit,
       attribute = _ref.attribute,
@@ -16649,7 +17151,7 @@
       var value = _ref2.value;
       return getHighlightedParts(unescape$1(value || '')).map(function (_ref3) {
         var isHighlighted = _ref3.isHighlighted,
-          rest = _objectWithoutProperties(_ref3, _excluded2$2);
+          rest = _objectWithoutProperties(_ref3, _excluded2$3);
         return _objectSpread2(_objectSpread2({}, rest), {}, {
           isHighlighted: !isHighlighted
         });
@@ -16677,7 +17179,7 @@
   }
 
   var _excluded$g = ["hit", "attribute", "cssClasses"],
-    _excluded2$3 = ["isHighlighted"];
+    _excluded2$4 = ["isHighlighted"];
   function ReverseSnippet$1(_ref) {
     var hit = _ref.hit,
       attribute = _ref.attribute,
@@ -16690,7 +17192,7 @@
       var value = _ref2.value;
       return getHighlightedParts(unescape$1(value || '')).map(function (_ref3) {
         var isHighlighted = _ref3.isHighlighted,
-          rest = _objectWithoutProperties(_ref3, _excluded2$3);
+          rest = _objectWithoutProperties(_ref3, _excluded2$4);
         return _objectSpread2(_objectSpread2({}, rest), {}, {
           isHighlighted: !isHighlighted
         });
@@ -16812,7 +17314,7 @@
         var fragment = new DocumentFragment();
         var root = document.createElement('div');
         root.innerHTML = this.props.content;
-        this.nodes = _toConsumableArray(root.children);
+        this.nodes = _toConsumableArray(root.childNodes);
         this.nodes.forEach(function (node) {
           return fragment.appendChild(node);
         });
@@ -16822,8 +17324,17 @@
       key: "componentWillUnmount",
       value: function componentWillUnmount() {
         this.nodes.forEach(function (node) {
-          return node.outerHTML = '';
+          if (node instanceof Element) {
+            node.outerHTML = '';
+            return;
+          }
+          node.nodeValue = '';
         });
+        // if there is one TextNode first and one TextNode last, the
+        // last one's nodeValue will be assigned to the first.
+        if (this.nodes[0].nodeValue) {
+          this.nodes[0].nodeValue = '';
+        }
       }
     }, {
       key: "render",
@@ -18041,7 +18552,7 @@
   };
 
   var _excluded$k = ["initialZoom", "initialPosition", "templates", "cssClasses", "builtInMarker", "customHTMLMarker", "enableRefine", "enableClearMapRefinement", "enableRefineControl", "container", "googleReference"],
-    _excluded2$4 = ["item"],
+    _excluded2$5 = ["item"],
     _excluded3 = ["item"];
   var withUsage$y = createDocumentationMessageGenerator({
     name: 'geo-search'
@@ -18143,7 +18654,7 @@
     var customHTMLMarker = isCustomHTMLMarker && _objectSpread2(_objectSpread2({}, defaultCustomHTMLMarker), userCustomHTMLMarker);
     var createBuiltInMarker = function createBuiltInMarker(_ref2) {
       var item = _ref2.item,
-        rest = _objectWithoutProperties(_ref2, _excluded2$4);
+        rest = _objectWithoutProperties(_ref2, _excluded2$5);
       return new googleReference.maps.Marker(_objectSpread2(_objectSpread2(_objectSpread2({}, builtInMarker.createOptions(item)), rest), {}, {
         // @ts-expect-error @types/googlemaps doesn't document this
         __id: item.objectID,
@@ -18855,7 +19366,8 @@
         instantSearchInstance = _ref2.instantSearchInstance,
         insights = _ref2.insights,
         bindEvent = _ref2.bindEvent,
-        sendEvent = _ref2.sendEvent;
+        sendEvent = _ref2.sendEvent,
+        banner = _ref2.banner;
       if (isFirstRendering) {
         renderState.templateProps = prepareTemplateProps({
           defaultTemplates: defaultTemplates$5,
@@ -18873,7 +19385,8 @@
         return h(Template, _extends({}, renderState.templateProps, {
           rootProps: rootProps,
           templateKey: "empty",
-          data: results
+          data: results,
+          rootTagName: "fragment"
         }));
       };
 
@@ -18906,12 +19419,21 @@
           sendEvent: sendEvent
         }));
       };
+      var bannerComponent = function bannerComponent(props) {
+        return h(Template, _extends({}, renderState.templateProps, {
+          templateKey: "banner",
+          data: props,
+          rootTagName: "fragment"
+        }));
+      };
       P(h(Hits, {
         hits: receivedHits,
         itemComponent: itemComponent,
         sendEvent: sendEvent,
         classNames: cssClasses,
-        emptyComponent: emptyComponent
+        emptyComponent: emptyComponent,
+        banner: banner,
+        bannerComponent: templates.banner ? bannerComponent : undefined
       }), containerNode);
     };
   };
@@ -20083,7 +20605,7 @@
   };
 
   var _excluded$n = ["placesReference", "defaultPosition"],
-    _excluded2$5 = ["places"];
+    _excluded2$6 = ["places"];
 
   /* Places.js is an optional dependency, no error should be reported if the package is missing */
   /** @ts-ignore */
@@ -20139,7 +20661,7 @@
         var hasPositionSet = position !== defaultPosition.join(',');
         if (!hasPositionSet && !state.query) {
           var places = uiState.places,
-            uiStateWithoutPlaces = _objectWithoutProperties(uiState, _excluded2$5);
+            uiStateWithoutPlaces = _objectWithoutProperties(uiState, _excluded2$6);
           return uiStateWithoutPlaces;
         }
         return _objectSpread2(_objectSpread2({}, uiState), {}, {