instantsearch.js 4.66.1 → 4.68.0

package/cjs/components/Template/Template.js

@@ -48,7 +48,7 @@ var RawHtml = /*#__PURE__*/function (_Component) {
       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);
       });
@@ -58,8 +58,17 @@ var RawHtml = /*#__PURE__*/function (_Component) {
     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",

package/cjs/connectors/hits/connectHits.js

@@ -48,6 +48,7 @@ var connectHits = function connectHits(renderFn) {
         });
       },
       getWidgetRenderState: function getWidgetRenderState(_ref2) {
+        var _results$renderingCon, _results$renderingCon2, _results$renderingCon3;
         var results = _ref2.results,
           helper = _ref2.helper,
           instantSearchInstance = _ref2.instantSearchInstance;
@@ -73,6 +74,7 @@ var connectHits = function connectHits(renderFn) {
           return {
             hits: [],
             results: undefined,
+            banner: undefined,
             sendEvent: sendEvent,
             bindEvent: bindEvent,
             widgetParams: widgetParams
@@ -86,9 +88,11 @@ var connectHits = function connectHits(renderFn) {
         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

package/cjs/lib/InstantSearch.js

@@ -392,7 +392,7 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
         // 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

package/cjs/lib/version.js

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

package/cjs/widgets/hits/hits.js

@@ -43,7 +43,8 @@ var renderer = function renderer(_ref) {
       instantSearchInstance = _ref2.instantSearchInstance,
       insights = _ref2.insights,
       bindEvent = _ref2.bindEvent,
-      sendEvent = _ref2.sendEvent;
+      sendEvent = _ref2.sendEvent,
+      banner = _ref2.banner;
     if (isFirstRendering) {
       renderState.templateProps = (0, _templating.prepareTemplateProps)({
         defaultTemplates: _defaultTemplates.default,
@@ -61,7 +62,8 @@ var renderer = function renderer(_ref) {
       return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
         rootProps: rootProps,
         templateKey: "empty",
-        data: results
+        data: results,
+        rootTagName: "fragment"
       }));
     };
 
@@ -94,12 +96,21 @@ var renderer = function renderer(_ref) {
         sendEvent: sendEvent
       }));
     };
+    var bannerComponent = function bannerComponent(props) {
+      return (0, _preact.h)(_Template.default, _extends({}, renderState.templateProps, {
+        templateKey: "banner",
+        data: props,
+        rootTagName: "fragment"
+      }));
+    };
     (0, _preact.render)((0, _preact.h)(Hits, {
       hits: receivedHits,
       itemComponent: itemComponent,
       sendEvent: sendEvent,
       classNames: cssClasses,
-      emptyComponent: emptyComponent
+      emptyComponent: emptyComponent,
+      banner: banner,
+      bannerComponent: templates.banner ? bannerComponent : undefined
     }), containerNode);
   };
 };

package/cjs/widgets/index/index.js

@@ -7,7 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _algoliasearchHelper = _interopRequireDefault(require("algoliasearch-helper"));
 var _utils = require("../../lib/utils");
-var _excluded = ["initialSearchParameters"];
+var _excluded = ["initialSearchParameters"],
+  _excluded2 = ["initialRecommendParameters"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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; }
@@ -32,6 +33,7 @@ var withUsage = (0, _utils.createDocumentationMessageGenerator)({
  */
 function privateHelperSetState(helper, _ref) {
   var state = _ref.state,
+    recommendState = _ref.recommendState,
     isPageReset = _ref.isPageReset,
     _uiState = _ref._uiState;
   if (state !== helper.state) {
@@ -43,7 +45,14 @@ function privateHelperSetState(helper, _ref) {
       _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) {
@@ -62,15 +71,26 @@ function getLocalWidgetsUiState(widgets, widgetStateOptions) {
 function getLocalWidgetsSearchParameters(widgets, widgetSearchParametersOptions) {
   var initialSearchParameters = widgetSearchParametersOptions.initialSearchParameters,
     rest = _objectWithoutProperties(widgetSearchParametersOptions, _excluded);
-  return widgets.filter(function (widget) {
-    return !(0, _utils.isIndexWidget)(widget);
-  }).reduce(function (state, widget) {
-    if (!widget.getWidgetSearchParameters) {
+  return widgets.reduce(function (state, widget) {
+    if (!widget.getWidgetSearchParameters || (0, _utils.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);
+  return widgets.reduce(function (state, widget) {
+    if (!(0, _utils.isIndexWidget)(widget) && widget.dependsOn === 'recommend' && widget.getWidgetParameters) {
+      return widget.getWidgetParameters(state, rest);
+    }
+    return state;
+  }, initialRecommendParameters);
+}
 function resetPageFromWidgets(widgets) {
   var indexWidgets = widgets.filter(_utils.isIndexWidget);
   if (indexWidgets.length === 0) {
@@ -80,6 +100,7 @@ function resetPageFromWidgets(widgets) {
     var widgetHelper = widget.getHelper();
     privateHelperSetState(widgetHelper, {
       state: widgetHelper.state.resetPage(),
+      recommendState: widgetHelper.recommendState,
       isPageReset: true
     });
     resetPageFromWidgets(widget.getWidgets());
@@ -138,9 +159,18 @@ var index = function index(widgetParams) {
     },
     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() {
@@ -175,6 +205,10 @@ var index = function index(widgetParams) {
             uiState: localUiState,
             initialSearchParameters: helper.state
           }),
+          recommendState: getLocalWidgetsRecommendParameters(localWidgets, {
+            uiState: localUiState,
+            initialRecommendParameters: helper.recommendState
+          }),
           _uiState: localUiState
         });
 
@@ -271,11 +305,16 @@ var index = function index(widgetParams) {
           index: indexName
         })
       });
+      var recommendParameters = getLocalWidgetsRecommendParameters(localWidgets, {
+        uiState: localUiState,
+        initialRecommendParameters: new _algoliasearchHelper.default.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 = (0, _algoliasearchHelper.default)({}, 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
@@ -306,6 +345,8 @@ var index = function index(widgetParams) {
       };
       derivedHelper = mainHelper.derive(function () {
         return _utils.mergeSearchParameters.apply(void 0, [mainHelper.state].concat(_toConsumableArray((0, _utils.resolveSearchParameters)(_this3))));
+      }, function () {
+        return _this3.getHelper().recommendState;
       });
       var indexInitialResults = (_instantSearchInstanc = instantSearchInstance._initialResults) === null || _instantSearchInstanc === void 0 ? void 0 : _instantSearchInstanc[this.getIndexId()];
       if (indexInitialResults) {
@@ -354,6 +395,21 @@ var index = function index(widgetParams) {
         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`.
@@ -404,9 +460,9 @@ var index = function index(widgetParams) {
         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) {
@@ -416,6 +472,14 @@ var index = function index(widgetParams) {
       // 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(_utils.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()] || {}, (0, _utils.createRenderArgs)(instantSearchInstance, _this4));
@@ -474,8 +538,8 @@ var index = function index(widgetParams) {
       process.env.NODE_ENV === 'development' ? (0, _utils.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.') : void 0;
       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
@@ -497,10 +561,10 @@ var index = function index(widgetParams) {
 };
 var _default = index;
 exports.default = _default;
-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 = _objectSpread(_objectSpread({}, instantSearchInstance.renderState), {}, _defineProperty({}, parentIndexName, _objectSpread(_objectSpread({}, instantSearchInstance.renderState[parentIndexName]), renderState)));
 }

package/dist/instantsearch.development.d.ts

@@ -15,6 +15,7 @@ import type { InsightsMethodMap as InsightsMethodMap_2 } from 'search-insights';
 import type * as Places from 'places.js';
 import type { PlainSearchParameters } from 'algoliasearch-helper';
 import { default as qs_2 } from 'qs';
+import type { RecommendParameters } from 'algoliasearch-helper';
 import { SearchClient } from 'algoliasearch-helper/types/algoliasearch.js';
 import { SearchOptions } from 'algoliasearch-helper/types/algoliasearch.js';
 import type { SearchParameters } from 'algoliasearch-helper';
@@ -242,7 +243,7 @@ declare type AtLeastOne<TTarget, TMapped = {
     [Key in keyof TTarget]: Pick<TTarget, Key>;
 }> = Partial<TTarget> & TMapped[keyof TMapped];
 
-declare type AugmentedWidget<TWidgetFactory extends AnyWidgetFactory, TOverriddenKeys extends keyof Widget = 'init' | 'render' | 'dispose'> = Omit<ReturnType<TWidgetFactory>, TOverriddenKeys> & Pick<Required<Widget>, TOverriddenKeys>;
+declare type AugmentedWidget<TWidgetFactory extends AnyWidgetFactory, TOverriddenKeys extends keyof Widget = 'init' | 'render' | 'dispose'> = Omit<ReturnType<TWidgetFactory>, TOverriddenKeys | 'dependsOn' | 'getWidgetParameters'> & Pick<Required<Widget>, TOverriddenKeys>;
 
 declare type AutocompleteConnector = Connector<AutocompleteWidgetDescription, AutocompleteConnectorParams>;
 
@@ -302,6 +303,8 @@ declare type AutocompleteWidgetDescription = {
     };
 };
 
+declare type Banner = NonNullable<NonNullable<Required<SearchResults<Hit>['renderingContent']>>['widgets']['banners']>[number];
+
 declare type BaseHit = Record<string, unknown>;
 
 declare type BindEventForHits = BuiltInBindEventForHits & CustomBindEventForHits;
@@ -1993,6 +1996,10 @@ declare type HitsRenderState<THit extends BaseHit = BaseHit> = {
      * The response from the Algolia API.
      */
     results?: SearchResults<Hit<THit>>;
+    /**
+     * The banner to display above the hits.
+     */
+    banner?: Banner;
     /**
      * Sends an event to the Insights middleware.
      */
@@ -2019,6 +2026,13 @@ declare type HitsTemplates = Partial<{
         /** @deprecated the index in the hits array, use __position instead, which is the absolute position */
         __hitIndex: number;
     }>;
+    /**
+     * Template to use for the banner.
+     */
+    banner: Template<{
+        banner: Required<HitsRenderState['banner']>;
+        className: string;
+    }>;
 }>;
 
 declare type HitsWidget = WidgetFactory<HitsWidgetDescription & {
@@ -4007,6 +4021,13 @@ declare type Read<THit extends BaseHit> = ({ state, }: {
     state: PlainSearchParameters;
 }) => InfiniteHitsCachedHits<THit> | null;
 
+declare type RecommendWidgetLifeCycle<TWidgetDescription extends WidgetDescription> = {
+    dependsOn?: 'recommend';
+    getWidgetParameters: (state: RecommendParameters, widgetParametersOptions: {
+        uiState: Expand<Partial<TWidgetDescription['indexUiState'] & IndexUiState>>;
+    }) => RecommendParameters;
+};
+
 declare type ReconfigurableOptions = Places.ReconfigurableOptions;
 
 /**
@@ -4517,7 +4538,7 @@ declare type RequiredUiStateLifeCycle<TWidgetDescription extends WidgetDescripti
     getWidgetSearchParameters: (state: SearchParameters, widgetSearchParametersOptions: {
         uiState: Expand<Partial<TWidgetDescription['indexUiState'] & IndexUiState>>;
     }) => SearchParameters;
-};
+} & (SearchWidgetLifeCycle<TWidgetDescription> | RecommendWidgetLifeCycle<TWidgetDescription>);
 
 declare type RequiredWidgetLifeCycle<TWidgetDescription extends WidgetDescription> = {
     /**
@@ -4528,6 +4549,10 @@ declare type RequiredWidgetLifeCycle<TWidgetDescription extends WidgetDescriptio
      * Called once before the first search.
      */
     init?: (options: InitOptions) => void;
+    /**
+     * Whether `render` should be called
+     */
+    shouldRender?: (options: ShouldRenderOptions) => boolean;
     /**
      * Called after each search response has been received.
      */
@@ -4843,6 +4868,13 @@ declare type SearchBoxWidgetParams = {
     queryHook?: (query: string, hook: (value: string) => void) => void;
 };
 
+declare type SearchWidgetLifeCycle<TWidgetDescription extends WidgetDescription> = {
+    dependsOn?: 'search';
+    getWidgetParameters?: (state: SearchParameters, widgetParametersOptions: {
+        uiState: Expand<Partial<TWidgetDescription['indexUiState'] & IndexUiState>>;
+    }) => SearchParameters;
+};
+
 declare type SendEvent = (...args: [InsightsEvent] | [string, string, string?]) => void;
 
 declare type SendEventForFacet = BuiltInSendEventForFacet & CustomSendEventForFacet;
@@ -4869,6 +4901,10 @@ declare type SharedRenderOptions = {
     createURL: (nextState: SearchParameters | ((state: IndexUiState) => IndexUiState)) => string;
 };
 
+declare type ShouldRenderOptions = {
+    instantSearchInstance: InstantSearch;
+};
+
 declare function simpleStateMapping<TUiState extends UiState = UiState>(): StateMapping<TUiState, TUiState>;
 
 declare function singleIndexStateMapping<TUiState extends UiState = UiState>(indexName: keyof TUiState): StateMapping<TUiState, TUiState[typeof indexName]>;