instantsearch.js 4.46.3 → 4.47.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [4.47.0](https://github.com/algolia/instantsearch.js/compare/v4.46.3...v4.47.0) (2022-10-03)
+
+
+### Bug Fixes
+
+* **hierarchicalMenu:** pass correct attribute name to Insights ([#5124](https://github.com/algolia/instantsearch.js/issues/5124)) ([fe18a16](https://github.com/algolia/instantsearch.js/commit/fe18a168b1b195d067298770b55fd29a7fdb6edb))
+
+
+### Features
+
+* **status:** introduce status in InstantSearch class ([#5115](https://github.com/algolia/instantsearch.js/issues/5115)) ([21f3147](https://github.com/algolia/instantsearch.js/commit/21f31476e75e162b38b002d5439f231f3990e785))
+* **hierarchicalMenu**: introduce `ais-HierarchicalMenu-item--selected` class ([#5125](https://github.com/algolia/instantsearch.js/issues/5125)) ([4ebb828](https://github.com/algolia/instantsearch.js/commit/4ebb828c93afabfd8083246dfe7edfd33932d5fd))
+
+
 ## [4.46.3](https://github.com/algolia/instantsearch.js/compare/v4.46.2...v4.46.3) (2022-09-27)
 
 

package/cjs/connectors/hierarchical-menu/connectHierarchicalMenu.js

@@ -175,7 +175,10 @@ var connectHierarchicalMenu = function connectHierarchicalMenu(renderFn) {
           sendEvent = (0, _index.createSendEventForFacet)({
             instantSearchInstance: instantSearchInstance,
             helper: helper,
-            attribute: hierarchicalFacetName,
+            attribute: function attribute(facetValue) {
+              var index = facetValue.split(separator).length - 1;
+              return attributes[index];
+            },
             widgetType: this.$$type
           });
         }

package/cjs/lib/InstantSearch.js

@@ -103,8 +103,6 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
 
     _defineProperty(_assertThisInitialized(_this), "_searchStalledTimer", void 0);
 
-    _defineProperty(_assertThisInitialized(_this), "_isSearchStalled", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "_initialUiState", void 0);
 
     _defineProperty(_assertThisInitialized(_this), "_initialResults", void 0);
@@ -119,6 +117,10 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
 
     _defineProperty(_assertThisInitialized(_this), "sendEventToInsights", void 0);
 
+    _defineProperty(_assertThisInitialized(_this), "status", 'idle');
+
+    _defineProperty(_assertThisInitialized(_this), "error", undefined);
+
     _defineProperty(_assertThisInitialized(_this), "scheduleSearch", (0, _index2.defer)(function () {
       if (_this.started) {
         _this.mainHelper.search();
@@ -126,10 +128,16 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
     }));
 
     _defineProperty(_assertThisInitialized(_this), "scheduleRender", (0, _index2.defer)(function () {
+      var shouldResetStatus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+
       if (!_this.mainHelper.hasPendingRequests()) {
         clearTimeout(_this._searchStalledTimer);
         _this._searchStalledTimer = null;
-        _this._isSearchStalled = false;
+
+        if (shouldResetStatus) {
+          _this.status = 'idle';
+          _this.error = undefined;
+        }
       }
 
       _this.mainIndex.render({
@@ -210,7 +218,6 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
     };
     _this._stalledSearchDelay = stalledSearchDelay;
     _this._searchStalledTimer = null;
-    _this._isSearchStalled = false;
     _this._createURL = defaultCreateURL;
     _this._initialUiState = initialUiState;
     _this._initialResults = null;
@@ -239,6 +246,25 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
 
 
   _createClass(InstantSearch, [{
+    key: "_isSearchStalled",
+    get:
+    /**
+     * The status of the search. Can be "idle", "loading", "stalled", or "error".
+     */
+
+    /**
+     * The last returned error from the Search API.
+     * The error gets cleared when the next valid search response is rendered.
+     */
+
+    /**
+     * @deprecated use `status === 'stalled'` instead
+     */
+    function get() {
+      process.env.NODE_ENV === 'development' ? (0, _index2.warning)(false, "`InstantSearch._isSearchStalled` is deprecated and will be removed in InstantSearch.js 5.0.\n\nUse `InstantSearch.status === \"stalled\"` instead.") : void 0;
+      return this.status === 'stalled';
+    }
+  }, {
     key: "use",
     value: function use() {
       var _this2 = this;
@@ -400,10 +426,18 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
       var mainHelper = this.mainHelper || (0, _algoliasearchHelper.default)(this.client, this.indexName);
 
       mainHelper.search = function () {
-        // This solution allows us to keep the exact same API for the users but
+        _this3.status = 'loading'; // @MAJOR: use scheduleRender here
+        // For now, widgets don't expect to be rendered at the start of `loading`,
+        // so it would be a breaking change to add an extra render. We don't have
+        // these guarantees about the render event, thus emitting it once more
+        // isn't a breaking change.
+
+        _this3.emit('render'); // This solution allows us to keep the exact same API for the users but
         // 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();
       };
 
@@ -460,6 +494,11 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
 
 
         error.error = error;
+        _this3.error = error;
+        _this3.status = 'error';
+
+        _this3.scheduleRender(false); // This needs to execute last because it throws the error.
+
 
         _this3.emit('error', error);
       });
@@ -548,7 +587,7 @@ var InstantSearch = /*#__PURE__*/function (_EventEmitter) {
 
       if (!this._searchStalledTimer) {
         this._searchStalledTimer = setTimeout(function () {
-          _this4._isSearchStalled = true;
+          _this4.status = 'stalled';
 
           _this4.scheduleRender();
         }, this._stalledSearchDelay);

package/cjs/lib/utils/createSendEventForFacet.js

@@ -12,7 +12,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 function createSendEventForFacet(_ref) {
   var instantSearchInstance = _ref.instantSearchInstance,
       helper = _ref.helper,
-      attribute = _ref.attribute,
+      attr = _ref.attribute,
       widgetType = _ref.widgetType;
 
   var sendEventForFacet = function sendEventForFacet() {
@@ -24,6 +24,7 @@ function createSendEventForFacet(_ref) {
         facetValue = args[1],
         _args$ = args[2],
         eventName = _args$ === void 0 ? 'Filter Applied' : _args$;
+    var attribute = typeof attr === 'string' ? attr : attr(facetValue);
 
     if (args.length === 1 && _typeof(args[0]) === 'object') {
       instantSearchInstance.sendEventToInsights(args[0]);

package/cjs/lib/utils/createSendEventForHits.js

@@ -148,7 +148,7 @@ function createSendEventForHits(_ref2) {
       index: index,
       methodName: 'sendEvent',
       args: args,
-      isSearchStalled: instantSearchInstance._isSearchStalled
+      isSearchStalled: instantSearchInstance.status === 'stalled'
     });
     payloads.forEach(function (payload) {
       return instantSearchInstance.sendEventToInsights(payload);

package/cjs/lib/utils/index.js

@@ -524,6 +524,19 @@ Object.keys(_range).forEach(function (key) {
   });
 });
 
+var _renderArgs = require("./render-args.js");
+
+Object.keys(_renderArgs).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _renderArgs[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _renderArgs[key];
+    }
+  });
+});
+
 var _resolveSearchParameters = require("./resolveSearchParameters.js");
 
 Object.keys(_resolveSearchParameters).forEach(function (key) {

package/cjs/lib/utils/render-args.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createInitArgs = createInitArgs;
+exports.createRenderArgs = createRenderArgs;
+
+function createInitArgs(instantSearchInstance, parent, uiState) {
+  var helper = parent.getHelper();
+  return {
+    uiState: uiState,
+    helper: helper,
+    parent: parent,
+    instantSearchInstance: instantSearchInstance,
+    state: helper.state,
+    renderState: instantSearchInstance.renderState,
+    templatesConfig: instantSearchInstance.templatesConfig,
+    createURL: parent.createURL,
+    scopedResults: [],
+    searchMetadata: {
+      isSearchStalled: instantSearchInstance.status === 'stalled'
+    },
+    status: instantSearchInstance.status,
+    error: instantSearchInstance.error
+  };
+}
+
+function createRenderArgs(instantSearchInstance, parent) {
+  var results = parent.getResults();
+  return {
+    helper: parent.getHelper(),
+    parent: parent,
+    instantSearchInstance: instantSearchInstance,
+    results: results,
+    scopedResults: parent.getScopedResults(),
+    state: results._state,
+    renderState: instantSearchInstance.renderState,
+    templatesConfig: instantSearchInstance.templatesConfig,
+    createURL: parent.createURL,
+    searchMetadata: {
+      isSearchStalled: instantSearchInstance.status === 'stalled'
+    },
+    status: instantSearchInstance.status,
+    error: instantSearchInstance.error
+  };
+}

package/cjs/lib/version.js

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

package/cjs/middlewares/createMetadataMiddleware.js

@@ -9,21 +9,7 @@ exports.createMetadataMiddleware = createMetadataMiddleware;
 var _index = require("../lib/utils/index.js");
 
 function extractPayload(widgets, instantSearchInstance, payload) {
-  var parent = instantSearchInstance.mainIndex;
-  var initOptions = {
-    instantSearchInstance: instantSearchInstance,
-    parent: parent,
-    scopedResults: [],
-    state: parent.getHelper().state,
-    helper: parent.getHelper(),
-    createURL: parent.createURL,
-    uiState: instantSearchInstance._initialUiState,
-    renderState: instantSearchInstance.renderState,
-    templatesConfig: instantSearchInstance.templatesConfig,
-    searchMetadata: {
-      isSearchStalled: instantSearchInstance._isSearchStalled
-    }
-  };
+  var initOptions = (0, _index.createInitArgs)(instantSearchInstance, instantSearchInstance.mainIndex, instantSearchInstance._initialUiState);
   widgets.forEach(function (widget) {
     var widgetParams = {};
 

package/cjs/widgets/hierarchical-menu/defaultTemplates.js

@@ -16,9 +16,10 @@ var defaultTemplates = {
     var url = _ref.url,
         label = _ref.label,
         count = _ref.count,
-        cssClasses = _ref.cssClasses;
+        cssClasses = _ref.cssClasses,
+        isRefined = _ref.isRefined;
     return (0, _preact.h)("a", {
-      className: (0, _index.cx)(cssClasses.link),
+      className: (0, _index.cx)([(0, _index.cx)(cssClasses.link), (0, _index.cx)(isRefined ? cssClasses.selectedItemLink : undefined)]),
       href: url
     }, (0, _preact.h)("span", {
       className: (0, _index.cx)(cssClasses.label)

package/cjs/widgets/hierarchical-menu/hierarchical-menu.js

@@ -173,6 +173,10 @@ var hierarchicalMenu = function hierarchicalMenu(widgetParams) {
     link: (0, _classnames.default)(suit({
       descendantName: 'link'
     }), userCssClasses.link),
+    selectedItemLink: (0, _classnames.default)(suit({
+      descendantName: 'link',
+      modifierName: 'selected'
+    }), userCssClasses.selectedItemLink),
     label: (0, _classnames.default)(suit({
       descendantName: 'label'
     }), userCssClasses.label),

package/cjs/widgets/index/index.js

@@ -195,20 +195,7 @@ var index = function index(widgetParams) {
 
         widgets.forEach(function (widget) {
           if (widget.getRenderState) {
-            var renderState = widget.getRenderState(localInstantSearchInstance.renderState[_this.getIndexId()] || {}, {
-              uiState: localInstantSearchInstance._initialUiState,
-              helper: _this.getHelper(),
-              parent: _this,
-              instantSearchInstance: localInstantSearchInstance,
-              state: helper.state,
-              renderState: localInstantSearchInstance.renderState,
-              templatesConfig: localInstantSearchInstance.templatesConfig,
-              createURL: _this.createURL,
-              scopedResults: [],
-              searchMetadata: {
-                isSearchStalled: localInstantSearchInstance._isSearchStalled
-              }
-            });
+            var renderState = widget.getRenderState(localInstantSearchInstance.renderState[_this.getIndexId()] || {}, (0, _index.createInitArgs)(localInstantSearchInstance, _this, localInstantSearchInstance._initialUiState));
             storeRenderState({
               renderState: renderState,
               instantSearchInstance: localInstantSearchInstance,
@@ -218,20 +205,7 @@ var index = function index(widgetParams) {
         });
         widgets.forEach(function (widget) {
           if (widget.init) {
-            widget.init({
-              helper: helper,
-              parent: _this,
-              uiState: localInstantSearchInstance._initialUiState,
-              instantSearchInstance: localInstantSearchInstance,
-              state: helper.state,
-              renderState: localInstantSearchInstance.renderState,
-              templatesConfig: localInstantSearchInstance.templatesConfig,
-              createURL: _this.createURL,
-              scopedResults: [],
-              searchMetadata: {
-                isSearchStalled: localInstantSearchInstance._isSearchStalled
-              }
-            });
+            widget.init((0, _index.createInitArgs)(localInstantSearchInstance, _this, localInstantSearchInstance._initialUiState));
           }
         });
         localInstantSearchInstance.scheduleSearch();
@@ -397,20 +371,7 @@ var index = function index(widgetParams) {
 
       localWidgets.forEach(function (widget) {
         if (widget.getRenderState) {
-          var renderState = widget.getRenderState(instantSearchInstance.renderState[_this3.getIndexId()] || {}, {
-            uiState: uiState,
-            helper: helper,
-            parent: _this3,
-            instantSearchInstance: instantSearchInstance,
-            state: helper.state,
-            renderState: instantSearchInstance.renderState,
-            templatesConfig: instantSearchInstance.templatesConfig,
-            createURL: _this3.createURL,
-            scopedResults: [],
-            searchMetadata: {
-              isSearchStalled: instantSearchInstance._isSearchStalled
-            }
-          });
+          var renderState = widget.getRenderState(instantSearchInstance.renderState[_this3.getIndexId()] || {}, (0, _index.createInitArgs)(instantSearchInstance, _this3, uiState));
           storeRenderState({
             renderState: renderState,
             instantSearchInstance: instantSearchInstance,
@@ -424,20 +385,7 @@ var index = function index(widgetParams) {
         !widget.getWidgetState || Boolean(widget.getWidgetUiState), '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;
 
         if (widget.init) {
-          widget.init({
-            uiState: uiState,
-            helper: helper,
-            parent: _this3,
-            instantSearchInstance: instantSearchInstance,
-            state: helper.state,
-            renderState: instantSearchInstance.renderState,
-            templatesConfig: instantSearchInstance.templatesConfig,
-            createURL: _this3.createURL,
-            scopedResults: [],
-            searchMetadata: {
-              isSearchStalled: instantSearchInstance._isSearchStalled
-            }
-          });
+          widget.init((0, _index.createInitArgs)(instantSearchInstance, _this3, uiState));
         }
       }); // Subscribe to the Helper state changes for the `uiState` once widgets
       // are initialized. Until the first render, state changes are part of the
@@ -478,20 +426,7 @@ var index = function index(widgetParams) {
 
       localWidgets.forEach(function (widget) {
         if (widget.getRenderState) {
-          var renderState = widget.getRenderState(instantSearchInstance.renderState[_this4.getIndexId()] || {}, {
-            helper: _this4.getHelper(),
-            parent: _this4,
-            instantSearchInstance: instantSearchInstance,
-            results: _this4.getResults(),
-            scopedResults: _this4.getScopedResults(),
-            state: _this4.getResults()._state,
-            renderState: instantSearchInstance.renderState,
-            templatesConfig: instantSearchInstance.templatesConfig,
-            createURL: _this4.createURL,
-            searchMetadata: {
-              isSearchStalled: instantSearchInstance._isSearchStalled
-            }
-          });
+          var renderState = widget.getRenderState(instantSearchInstance.renderState[_this4.getIndexId()] || {}, (0, _index.createRenderArgs)(instantSearchInstance, _this4));
           storeRenderState({
             renderState: renderState,
             instantSearchInstance: instantSearchInstance,
@@ -507,20 +442,7 @@ var index = function index(widgetParams) {
         // be delayed. The render is triggered for the complete tree but some parts do
         // not have results yet.
         if (widget.render) {
-          widget.render({
-            helper: helper,
-            parent: _this4,
-            instantSearchInstance: instantSearchInstance,
-            results: _this4.getResults(),
-            scopedResults: _this4.getScopedResults(),
-            state: _this4.getResults()._state,
-            renderState: instantSearchInstance.renderState,
-            templatesConfig: instantSearchInstance.templatesConfig,
-            createURL: _this4.createURL,
-            searchMetadata: {
-              isSearchStalled: instantSearchInstance._isSearchStalled
-            }
-          });
+          widget.render((0, _index.createRenderArgs)(instantSearchInstance, _this4));
         }
       });
     },

package/dist/instantsearch.development.d.ts

@@ -1516,6 +1516,10 @@ declare type HierarchicalMenuCSSClasses = Partial<{
      * CSS class to add to each link (when using the default template).
      */
     link: string | string[];
+    /**
+     * CSS class to add to the link of each selected item element (when using the default template).
+     */
+    selectedItemLink: string | string[];
     /**
      * CSS class to add to each label (when using the default template).
      */
@@ -2317,7 +2321,6 @@ declare class InstantSearch<TUiState extends UiState = UiState, TRouteState = TU
     renderState: RenderState;
     _stalledSearchDelay: number;
     _searchStalledTimer: any;
-    _isSearchStalled: boolean;
     _initialUiState: TUiState;
     _initialResults: InitialResults | null;
     _createURL: CreateURL<TUiState>;
@@ -2328,6 +2331,19 @@ declare class InstantSearch<TUiState extends UiState = UiState, TRouteState = TU
         instance: MiddlewareDefinition;
     }>;
     sendEventToInsights: (event: InsightsEvent) => void;
+    /**
+     * The status of the search. Can be "idle", "loading", "stalled", or "error".
+     */
+    status: InstantSearchStatus;
+    /**
+     * The last returned error from the Search API.
+     * The error gets cleared when the next valid search response is rendered.
+     */
+    error: Error | undefined;
+    /**
+     * @deprecated use `status === 'stalled'` instead
+     */
+    get _isSearchStalled(): boolean;
     constructor(options: InstantSearchOptions<TUiState, TRouteState>);
     /**
      * Hooks a middleware into the InstantSearch lifecycle.
@@ -2381,11 +2397,11 @@ declare class InstantSearch<TUiState extends UiState = UiState, TRouteState = TU
      * @return {undefined} This method does not return anything
      */
     dispose(): void;
-    scheduleSearch: ((...args: any[]) => void) & {
+    scheduleSearch: (() => void) & {
         wait(): Promise<void>;
         cancel(): void;
     };
-    scheduleRender: ((...args: any[]) => void) & {
+    scheduleRender: ((shouldResetStatus?: boolean) => void) & {
         wait(): Promise<void>;
         cancel(): void;
     };
@@ -2397,7 +2413,7 @@ declare class InstantSearch<TUiState extends UiState = UiState, TRouteState = TU
      */
     setUiState(uiState: TUiState | ((previousUiState: TUiState) => TUiState), callOnStateChange?: boolean): void;
     getUiState(): TUiState;
-    onInternalStateChange: ((...args: any[]) => void) & {
+    onInternalStateChange: (() => void) & {
         wait(): Promise<void>;
         cancel(): void;
     };
@@ -2525,6 +2541,8 @@ declare type InstantSearchOptions<TUiState extends UiState = UiState, TRouteStat
     insightsClient?: InsightsClient;
 };
 
+declare type InstantSearchStatus = 'idle' | 'loading' | 'stalled' | 'error';
+
 declare type InternalMiddleware<TUiState extends UiState = UiState> = (options: MiddlewareOptions) => MiddlewareDefinition<TUiState>;
 
 declare function isMetadataEnabled(): boolean;
@@ -4592,6 +4610,7 @@ declare type SearchBoxRenderState = {
      * `true` if the search results takes more than a certain time to come back
      * from Algolia servers. This can be configured on the InstantSearch constructor with the attribute
      * `stalledSearchDelay` which is 200ms, by default.
+     * @deprecated use `instantSearchInstance.status` instead
      */
     isSearchStalled: boolean;
 };
@@ -4703,9 +4722,13 @@ declare type SharedRenderOptions = {
     state: SearchParameters;
     renderState: IndexRenderState;
     helper: AlgoliaSearchHelper;
+    /** @deprecated use `status` instead */
     searchMetadata: {
+        /** @deprecated use `status === "stalled"` instead */
         isSearchStalled: boolean;
     };
+    status: InstantSearch['status'];
+    error: InstantSearch['error'];
     createURL(state: SearchParameters): string;
 };