instantsearch.js 4.82.0 → 4.83.0

package/dist/instantsearch.development.js

@@ -1,4 +1,4 @@
-/*! InstantSearch.js 4.82.0 | © Algolia, Inc. and contributors; MIT License | https://github.com/algolia/instantsearch */
+/*! InstantSearch.js 4.83.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) :
@@ -6277,8 +6277,8 @@
 
     return recSort(
       function (data, facetName) {
+        var facetOrdering = getFacetOrdering(results, facetName);
         if (options.facetOrdering) {
-          var facetOrdering = getFacetOrdering(results, facetName);
           if (facetOrdering) {
             return sortViaFacetOrdering(data, facetOrdering);
           }
@@ -6286,7 +6286,24 @@
 
         if (Array.isArray(options.sortBy)) {
           var order = formatSort(options.sortBy, SearchResults.DEFAULT_SORT);
-          return orderBy_1(data, order[0], order[1]);
+          var items = orderBy_1(data, order[0], order[1]);
+
+          var hide =
+            facetOrdering && facetOrdering.hide ? facetOrdering.hide : [];
+          if (hide.length > 0) {
+            var visible = [];
+            items.forEach(function (item) {
+              // hierarchical facets get sorted using their raw name
+              var name = item.path || item.name;
+              if (hide.indexOf(name) === -1) {
+                visible.push(item);
+              }
+            });
+
+            return visible;
+          }
+
+          return items;
         } else if (typeof options.sortBy === 'function') {
           return vanillaSortFn(options.sortBy, data);
         }
@@ -6551,7 +6568,7 @@
 
   var sortAndMergeRecommendations_1 = sortAndMergeRecommendations;
 
-  var version = '3.26.0';
+  var version = '3.26.1';
 
   var escapeFacetValue$4 = escapeFacetValue_1.escapeFacetValue;
 
@@ -7004,16 +7021,19 @@
 
         content = Array.isArray(content) ? content[0] : content;
 
-        content.facetHits.forEach(function (f, i) {
+        content.facetHits = content.facetHits.reduce(function (acc, f) {
           if (hide.indexOf(f.value) > -1) {
-            content.facetHits.splice(i, 1);
-            return;
+            return acc;
           }
+
           f.escapedValue = escapeFacetValue$4(f.value);
           f.isRefined = isDisjunctive
             ? state.isDisjunctiveFacetRefined(facet, f.escapedValue)
             : state.isFacetRefined(facet, f.escapedValue);
-        });
+
+          acc.push(f);
+          return acc;
+        }, []);
 
         return content;
       },
@@ -16134,12 +16154,6 @@
         helper.searchWithoutTriggeringOnStateChange = function () {
           return mainHelper.search();
         };
-
-        // We use the same pattern for the `searchForFacetValues`.
-        helper.searchForFacetValues = function (facetName, facetValue, maxFacetHits, userState) {
-          var state = helper.state.setQueryParameters(userState);
-          return mainHelper.searchForFacetValues(facetName, facetValue, maxFacetHits, state);
-        };
         var isolatedHelper = indexName ? helper : algoliasearchHelper_1({}, '__empty_index__', {});
         var derivingHelper = isolated ? isolatedHelper : nearestIsolatedHelper(parent, mainHelper);
         derivedHelper = derivingHelper.derive(function () {
@@ -16468,7 +16482,7 @@
     };
   }
 
-  var version$1 = '4.82.0';
+  var version$1 = '4.83.0';
 
   var withUsage$v = createDocumentationMessageGenerator({
     name: 'instantsearch'
@@ -17271,117 +17285,6 @@
     };
   }
 
-  function AutocompleteSubmitIcon(_ref) {
-    var createElement = _ref.createElement;
-    return createElement("svg", {
-      className: "ais-AutocompleteSubmitIcon",
-      viewBox: "0 0 24 24",
-      width: "20",
-      height: "20",
-      fill: "currentColor"
-    }, createElement("path", {
-      d: "M16.041 15.856c-0.034 0.026-0.067 0.055-0.099 0.087s-0.060 0.064-0.087 0.099c-1.258 1.213-2.969 1.958-4.855 1.958-1.933 0-3.682-0.782-4.95-2.050s-2.050-3.017-2.050-4.95 0.782-3.682 2.050-4.95 3.017-2.050 4.95-2.050 3.682 0.782 4.95 2.050 2.050 3.017 2.050 4.95c0 1.886-0.745 3.597-1.959 4.856zM21.707 20.293l-3.675-3.675c1.231-1.54 1.968-3.493 1.968-5.618 0-2.485-1.008-4.736-2.636-6.364s-3.879-2.636-6.364-2.636-4.736 1.008-6.364 2.636-2.636 3.879-2.636 6.364 1.008 4.736 2.636 6.364 3.879 2.636 6.364 2.636c2.125 0 4.078-0.737 5.618-1.968l3.675 3.675c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414z"
-    }));
-  }
-  function AutocompleteLoadingIcon(_ref2) {
-    var createElement = _ref2.createElement;
-    return createElement("svg", {
-      className: "ais-AutocompleteLoadingIcon",
-      viewBox: "0 0 100 100",
-      width: "20",
-      height: "20"
-    }, createElement("circle", {
-      cx: "50",
-      cy: "50",
-      fill: "none",
-      r: "35",
-      stroke: "currentColor",
-      strokeDasharray: "164.93361431346415 56.97787143782138",
-      strokeWidth: "6"
-    }, createElement("animateTransform", {
-      attributeName: "transform",
-      type: "rotate",
-      repeatCount: "indefinite",
-      dur: "1s",
-      values: "0 50 50;90 50 50;180 50 50;360 50 50",
-      keyTimes: "0;0.40;0.65;1"
-    })));
-  }
-  function AutocompleteClearIcon(_ref3) {
-    var createElement = _ref3.createElement;
-    return createElement("svg", {
-      className: "ais-AutocompleteClearIcon",
-      viewBox: "0 0 24 24",
-      width: "18",
-      height: "18",
-      fill: "currentColor"
-    }, createElement("path", {
-      d: "M5.293 6.707l5.293 5.293-5.293 5.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l5.293-5.293 5.293 5.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-5.293-5.293 5.293-5.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-5.293 5.293-5.293-5.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"
-    }));
-  }
-
-  function createAutocompleteSearchComponent(_ref) {
-    var createElement = _ref.createElement;
-    return function AutocompleteSearch(_ref2) {
-      var inputProps = _ref2.inputProps,
-        onClear = _ref2.onClear,
-        query = _ref2.query,
-        isSearchStalled = _ref2.isSearchStalled;
-      return createElement("form", {
-        className: "ais-AutocompleteForm",
-        action: "",
-        noValidate: true,
-        role: "search",
-        onSubmit: function onSubmit(e) {
-          return e.preventDefault();
-        }
-      }, createElement("div", {
-        className: "ais-AutocompleteInputWrapperPrefix"
-      }, createElement("label", {
-        className: "ais-AutocompleteLabel",
-        "aria-label": "Submit",
-        htmlFor: inputProps.id,
-        id: "".concat(inputProps.id, "-label")
-      }, createElement("button", {
-        className: "ais-AutocompleteSubmitButton",
-        type: "submit",
-        title: "Submit"
-      }, createElement(AutocompleteSubmitIcon, {
-        createElement: createElement
-      }))), createElement("div", {
-        className: "ais-AutocompleteLoadingIndicator",
-        hidden: !isSearchStalled
-      }, createElement(AutocompleteLoadingIcon, {
-        createElement: createElement
-      }))), createElement("div", {
-        className: "ais-AutocompleteInputWrapper"
-      }, createElement("input", _extends$1({
-        className: "ais-AutocompleteInput",
-        "aria-autocomplete": "both",
-        "aria-labelledby": "".concat(inputProps.id, "-label"),
-        autoComplete: "off",
-        autoCorrect: "off",
-        autoCapitalize: "off",
-        enterKeyHint: "search",
-        spellCheck: "false",
-        placeholder: "",
-        maxLength: 512,
-        type: "search",
-        value: query
-      }, inputProps))), createElement("div", {
-        className: "ais-AutocompleteInputWrapperSuffix"
-      }, createElement("button", {
-        className: "ais-AutocompleteClearButton",
-        type: "reset",
-        title: "Clear",
-        hidden: query.length === 0 || isSearchStalled,
-        onClick: onClear
-      }, createElement(AutocompleteClearIcon, {
-        createElement: createElement
-      }))));
-    };
-  }
-
   var _typeof_1 = createCommonjsModule(function (module) {
   function _typeof(o) {
     "@babel/helpers - typeof";
@@ -17524,6 +17427,169 @@
 
   var _slicedToArray$1 = unwrapExports(slicedToArray);
 
+  function AutocompleteSubmitIcon(_ref) {
+    var createElement = _ref.createElement;
+    return createElement("svg", {
+      className: "ais-AutocompleteSubmitIcon",
+      viewBox: "0 0 24 24",
+      width: "20",
+      height: "20",
+      fill: "currentColor"
+    }, createElement("path", {
+      d: "M16.041 15.856c-0.034 0.026-0.067 0.055-0.099 0.087s-0.060 0.064-0.087 0.099c-1.258 1.213-2.969 1.958-4.855 1.958-1.933 0-3.682-0.782-4.95-2.050s-2.050-3.017-2.050-4.95 0.782-3.682 2.050-4.95 3.017-2.050 4.95-2.050 3.682 0.782 4.95 2.050 2.050 3.017 2.050 4.95c0 1.886-0.745 3.597-1.959 4.856zM21.707 20.293l-3.675-3.675c1.231-1.54 1.968-3.493 1.968-5.618 0-2.485-1.008-4.736-2.636-6.364s-3.879-2.636-6.364-2.636-4.736 1.008-6.364 2.636-2.636 3.879-2.636 6.364 1.008 4.736 2.636 6.364 3.879 2.636 6.364 2.636c2.125 0 4.078-0.737 5.618-1.968l3.675 3.675c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414z"
+    }));
+  }
+  function AutocompleteLoadingIcon(_ref2) {
+    var createElement = _ref2.createElement;
+    return createElement("svg", {
+      className: "ais-AutocompleteLoadingIcon",
+      viewBox: "0 0 100 100",
+      width: "20",
+      height: "20"
+    }, createElement("circle", {
+      cx: "50",
+      cy: "50",
+      fill: "none",
+      r: "35",
+      stroke: "currentColor",
+      strokeDasharray: "164.93361431346415 56.97787143782138",
+      strokeWidth: "6"
+    }, createElement("animateTransform", {
+      attributeName: "transform",
+      type: "rotate",
+      repeatCount: "indefinite",
+      dur: "1s",
+      values: "0 50 50;90 50 50;180 50 50;360 50 50",
+      keyTimes: "0;0.40;0.65;1"
+    })));
+  }
+  function AutocompleteClearIcon(_ref3) {
+    var createElement = _ref3.createElement;
+    return createElement("svg", {
+      className: "ais-AutocompleteClearIcon",
+      viewBox: "0 0 24 24",
+      width: "18",
+      height: "18",
+      fill: "currentColor"
+    }, createElement("path", {
+      d: "M5.293 6.707l5.293 5.293-5.293 5.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l5.293-5.293 5.293 5.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-5.293-5.293 5.293-5.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-5.293 5.293-5.293-5.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"
+    }));
+  }
+  function AutocompleteClockIcon(_ref4) {
+    var createElement = _ref4.createElement;
+    return createElement("svg", {
+      viewBox: "0 0 24 24",
+      fill: "currentColor"
+    }, createElement("path", {
+      d: "M12.516 6.984v5.25l4.5 2.672-0.75 1.266-5.25-3.188v-6h1.5zM12 20.016q3.281 0 5.648-2.367t2.367-5.648-2.367-5.648-5.648-2.367-5.648 2.367-2.367 5.648 2.367 5.648 5.648 2.367zM12 2.016q4.125 0 7.055 2.93t2.93 7.055-2.93 7.055-7.055 2.93-7.055-2.93-2.93-7.055 2.93-7.055 7.055-2.93z"
+    }));
+  }
+  function AutocompleteTrashIcon(_ref5) {
+    var createElement = _ref5.createElement;
+    return createElement("svg", {
+      viewBox: "0 0 24 24",
+      fill: "currentColor"
+    }, createElement("path", {
+      d: "M18 7v13c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293h-10c-0.276 0-0.525-0.111-0.707-0.293s-0.293-0.431-0.293-0.707v-13zM17 5v-1c0-0.828-0.337-1.58-0.879-2.121s-1.293-0.879-2.121-0.879h-4c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v1h-4c-0.552 0-1 0.448-1 1s0.448 1 1 1h1v13c0 0.828 0.337 1.58 0.879 2.121s1.293 0.879 2.121 0.879h10c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121v-13h1c0.552 0 1-0.448 1-1s-0.448-1-1-1zM9 5v-1c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h4c0.276 0 0.525 0.111 0.707 0.293s0.293 0.431 0.293 0.707v1zM9 11v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1zM13 11v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1z"
+    }));
+  }
+
+  function createAutocompleteRecentSearchComponent(_ref) {
+    var createElement = _ref.createElement;
+    return function AutocompleteRecentSearch(_ref2) {
+      var item = _ref2.item,
+        onSelect = _ref2.onSelect,
+        onRemoveRecentSearch = _ref2.onRemoveRecentSearch,
+        _ref2$classNames = _ref2.classNames,
+        classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
+      return createElement("div", {
+        onClick: onSelect,
+        className: cx('ais-AutocompleteItemWrapper ais-AutocompleteRecentSearchWrapper', classNames.root)
+      }, createElement("div", {
+        className: cx('ais-AutocompleteItemContent', 'ais-AutocompleteRecentSearchItemContent', classNames.content)
+      }, createElement("div", {
+        className: cx('ais-AutocompleteItemIcon', 'ais-AutocompleteRecentSearchItemIcon', classNames.content)
+      }, createElement(AutocompleteClockIcon, {
+        createElement: createElement
+      })), createElement("div", {
+        className: cx('ais-AutocompleteItemContentBody', 'ais-AutocompleteRecentSearchItemContentBody', classNames.content)
+      }, item.query)), createElement("div", {
+        className: cx('ais-AutocompleteItemActions', 'ais-AutocompleteRecentSearchItemActions', classNames.actions)
+      }, createElement("button", {
+        className: cx('ais-AutocompleteItemActionButton', 'ais-AutocompleteRecentSearchItemDeleteButton', classNames.deleteButton),
+        title: "Remove ".concat(item.query, " from recent searches"),
+        onClick: function onClick(evt) {
+          evt.stopPropagation();
+          onRemoveRecentSearch();
+        }
+      }, createElement(AutocompleteTrashIcon, {
+        createElement: createElement
+      }))));
+    };
+  }
+
+  function createAutocompleteSearchComponent(_ref) {
+    var createElement = _ref.createElement;
+    return function AutocompleteSearch(_ref2) {
+      var inputProps = _ref2.inputProps,
+        onClear = _ref2.onClear,
+        query = _ref2.query,
+        isSearchStalled = _ref2.isSearchStalled;
+      return createElement("form", {
+        className: "ais-AutocompleteForm",
+        action: "",
+        noValidate: true,
+        role: "search",
+        onSubmit: function onSubmit(e) {
+          return e.preventDefault();
+        }
+      }, createElement("div", {
+        className: "ais-AutocompleteInputWrapperPrefix"
+      }, createElement("label", {
+        className: "ais-AutocompleteLabel",
+        "aria-label": "Submit",
+        htmlFor: inputProps.id,
+        id: "".concat(inputProps.id, "-label")
+      }, createElement("button", {
+        className: "ais-AutocompleteSubmitButton",
+        type: "submit",
+        title: "Submit"
+      }, createElement(AutocompleteSubmitIcon, {
+        createElement: createElement
+      }))), createElement("div", {
+        className: "ais-AutocompleteLoadingIndicator",
+        hidden: !isSearchStalled
+      }, createElement(AutocompleteLoadingIcon, {
+        createElement: createElement
+      }))), createElement("div", {
+        className: "ais-AutocompleteInputWrapper"
+      }, createElement("input", _extends$1({
+        className: "ais-AutocompleteInput",
+        "aria-autocomplete": "both",
+        "aria-labelledby": "".concat(inputProps.id, "-label"),
+        autoComplete: "off",
+        autoCorrect: "off",
+        autoCapitalize: "off",
+        enterKeyHint: "search",
+        spellCheck: "false",
+        placeholder: "",
+        maxLength: 512,
+        type: "search",
+        value: query
+      }, inputProps))), createElement("div", {
+        className: "ais-AutocompleteInputWrapperSuffix"
+      }, createElement("button", {
+        className: "ais-AutocompleteClearButton",
+        type: "reset",
+        title: "Clear",
+        hidden: query.length === 0 || isSearchStalled,
+        onClick: onClear
+      }, createElement(AutocompleteClearIcon, {
+        createElement: createElement
+      }))));
+    };
+  }
+
   function createAutocompleteSuggestionComponent(_ref) {
     var createElement = _ref.createElement;
     return function AutocompleteSuggestion(_ref2) {
@@ -17533,8 +17599,16 @@
         classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
       return createElement("div", {
         onClick: onSelect,
-        className: cx('ais-AutocompleteSuggestion', classNames.root)
-      }, item.query);
+        className: cx('ais-AutocompleteItemWrapper', 'ais-AutocompleteSuggestionWrapper', classNames.root)
+      }, createElement("div", {
+        className: cx('ais-AutocompleteItemContent', 'ais-AutocompleteSuggestionItemContent', classNames.content)
+      }, createElement("div", {
+        className: cx('ais-AutocompleteItemIcon', 'ais-AutocompleteSuggestionItemIcon', classNames.content)
+      }, createElement(AutocompleteSubmitIcon, {
+        createElement: createElement
+      })), createElement("div", {
+        className: cx('ais-AutocompleteItemContentBody', 'ais-AutocompleteSuggestionItemContentBody', classNames.content)
+      }, item.query)));
     };
   }
 
@@ -17752,6 +17826,182 @@
     : ref.current; // React
   }
 
+  var arrayWithoutHoles = createCommonjsModule(function (module) {
+  function _arrayWithoutHoles(r) {
+    if (Array.isArray(r)) return arrayLikeToArray(r);
+  }
+  module.exports = _arrayWithoutHoles, module.exports.__esModule = true, module.exports["default"] = module.exports;
+  });
+
+  unwrapExports(arrayWithoutHoles);
+
+  var iterableToArray = createCommonjsModule(function (module) {
+  function _iterableToArray(r) {
+    if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
+  }
+  module.exports = _iterableToArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
+  });
+
+  unwrapExports(iterableToArray);
+
+  var nonIterableSpread = createCommonjsModule(function (module) {
+  function _nonIterableSpread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  }
+  module.exports = _nonIterableSpread, module.exports.__esModule = true, module.exports["default"] = module.exports;
+  });
+
+  unwrapExports(nonIterableSpread);
+
+  var toConsumableArray = createCommonjsModule(function (module) {
+  function _toConsumableArray(r) {
+    return arrayWithoutHoles(r) || iterableToArray(r) || unsupportedIterableToArray(r) || nonIterableSpread();
+  }
+  module.exports = _toConsumableArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
+  });
+
+  var _toConsumableArray$1 = unwrapExports(toConsumableArray);
+
+  function createAutocompleteStorage(_ref) {
+    var useEffect = _ref.useEffect,
+      useMemo = _ref.useMemo,
+      useState = _ref.useState;
+    return function useStorage(_ref2) {
+      var showRecent = _ref2.showRecent,
+        query = _ref2.query,
+        indices = _ref2.indices,
+        indicesConfig = _ref2.indicesConfig;
+      var storageKey = showRecent && _typeof$1(showRecent) === 'object' ? showRecent.storageKey : undefined;
+      var storage = useMemo(function () {
+        return createStorage({
+          limit: 5,
+          storageKey: storageKey
+        });
+      }, [storageKey]);
+      var _useState = useState(storage.getSnapshot()),
+        _useState2 = _slicedToArray$1(_useState, 2),
+        snapshot = _useState2[0],
+        setSnapshot = _useState2[1];
+      useEffect(function () {
+        storage.registerUpdateListener(function () {
+          setSnapshot(storage.getSnapshot());
+        });
+        return function () {
+          storage.unregisterUpdateListener();
+        };
+      }, [storage]);
+      if (!showRecent) {
+        return {
+          storage: {
+            onAdd: function onAdd() {},
+            onRemove: function onRemove() {}
+          },
+          storageHits: [],
+          indicesForPropGetters: indices,
+          indicesConfigForPropGetters: indicesConfig
+        };
+      }
+      var storageHits = snapshot.getAll(query).map(function (value) {
+        return {
+          objectID: value,
+          query: value,
+          __indexName: 'recent-searches'
+        };
+      });
+      var indicesForPropGetters = _toConsumableArray$1(indices);
+      var indicesConfigForPropGetters = _toConsumableArray$1(indicesConfig);
+      indicesForPropGetters.unshift({
+        indexName: 'recent-searches',
+        indexId: 'recent-searches',
+        hits: storageHits
+      });
+      indicesConfigForPropGetters.unshift({
+        indexName: 'recent-searches',
+        // @ts-expect-error - we know it has query as it's generated from storageHits
+        getQuery: function getQuery(item) {
+          return item.query;
+        }
+      });
+      return {
+        storage: storage,
+        storageHits: storageHits,
+        indicesForPropGetters: indicesForPropGetters,
+        indicesConfigForPropGetters: indicesConfigForPropGetters
+      };
+    };
+  }
+  var LOCAL_STORAGE_KEY_TEST = 'test-localstorage-support';
+  var LOCAL_STORAGE_KEY = 'autocomplete-recent-searches';
+  function isLocalStorageSupported() {
+    try {
+      localStorage.setItem(LOCAL_STORAGE_KEY_TEST, '');
+      localStorage.removeItem(LOCAL_STORAGE_KEY_TEST);
+      return true;
+    } catch (error) {
+      return false;
+    }
+  }
+  function getLocalStorage() {
+    var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : LOCAL_STORAGE_KEY;
+    if (!isLocalStorageSupported()) {
+      return {
+        setItems: function setItems() {},
+        getItems: function getItems() {
+          return [];
+        }
+      };
+    }
+    return {
+      setItems: function setItems(items) {
+        try {
+          window.localStorage.setItem(key, JSON.stringify(items));
+        } catch (_unused) {
+          // do nothing, this likely means the storage is full
+        }
+      },
+      getItems: function getItems() {
+        var items = window.localStorage.getItem(key);
+        return items ? JSON.parse(items) : [];
+      }
+    };
+  }
+  function createStorage(_ref3) {
+    var _ref3$limit = _ref3.limit,
+      limit = _ref3$limit === void 0 ? 5 : _ref3$limit,
+      storageKey = _ref3.storageKey;
+    var storage = getLocalStorage(storageKey);
+    var updateListener = null;
+    return {
+      onAdd: function onAdd(query) {
+        this.onRemove(query);
+        storage.setItems([query].concat(_toConsumableArray$1(storage.getItems())));
+      },
+      onRemove: function onRemove(query) {
+        var _updateListener;
+        storage.setItems(storage.getItems().filter(function (q) {
+          return q !== query;
+        }));
+        (_updateListener = updateListener) === null || _updateListener === void 0 ? void 0 : _updateListener();
+      },
+      registerUpdateListener: function registerUpdateListener(callback) {
+        updateListener = callback;
+      },
+      unregisterUpdateListener: function unregisterUpdateListener() {
+        updateListener = null;
+      },
+      getSnapshot: function getSnapshot() {
+        return {
+          getAll: function getAll() {
+            var query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+            return storage.getItems().filter(function (q) {
+              return q.includes(query);
+            }).slice(0, limit);
+          }
+        };
+      }
+    };
+  }
+
   function createDefaultEmptyComponent(_ref) {
     var createElement = _ref.createElement,
       Fragment = _ref.Fragment;
@@ -20117,6 +20367,10 @@
     createElement: h,
     Fragment: p
   });
+  var AutocompleteRecentSearch = createAutocompleteRecentSearchComponent({
+    createElement: h,
+    Fragment: p
+  });
   var usePropGetters = createAutocompletePropGetters({
     useEffect: s$1,
     useId: b$1,
@@ -20124,12 +20378,18 @@
     useRef: A$1,
     useState: y$1
   });
+  var useStorage = createAutocompleteStorage({
+    useEffect: s$1,
+    useState: y$1,
+    useMemo: T$1
+  });
   var createRenderer = function createRenderer(params) {
     var instanceId = params.instanceId,
       containerNode = params.containerNode,
       rendererParams = _objectWithoutProperties(params, _excluded$s);
     return function (connectorParams, isFirstRendering) {
       if (isFirstRendering) {
+        var _targetIndex$getHelpe, _targetIndex$getHelpe2;
         var isolatedIndex = connectorParams.instantSearchInstance.mainIndex;
         var targetIndex = connectorParams.instantSearchInstance.mainIndex;
         walkIndex(targetIndex, function (childIndex) {
@@ -20143,13 +20403,14 @@
           isolatedIndex: isolatedIndex,
           targetIndex: targetIndex
         };
+        connectorParams.refine((_targetIndex$getHelpe = (_targetIndex$getHelpe2 = targetIndex.getHelper()) === null || _targetIndex$getHelpe2 === void 0 ? void 0 : _targetIndex$getHelpe2.state.query) !== null && _targetIndex$getHelpe !== void 0 ? _targetIndex$getHelpe : '');
         return;
       }
       P(h(AutocompleteWrapper, _extends({}, rendererParams, connectorParams)), containerNode);
     };
   };
   function AutocompleteWrapper(_ref) {
-    var _targetIndex$getWidge, _isolatedIndex$getHel;
+    var _isolatedIndex$getHel, _targetIndex$getWidge, _showRecent$templates;
     var indicesConfig = _ref.indicesConfig,
       indices = _ref.indices,
       getSearchPageURL = _ref.getSearchPageURL,
@@ -20157,9 +20418,21 @@
       refine = _ref.refine,
       cssClasses = _ref.cssClasses,
       renderState = _ref.renderState,
-      instantSearchInstance = _ref.instantSearchInstance;
+      instantSearchInstance = _ref.instantSearchInstance,
+      showRecent = _ref.showRecent;
     var isolatedIndex = renderState.isolatedIndex,
       targetIndex = renderState.targetIndex;
+    var searchboxQuery = isolatedIndex === null || isolatedIndex === void 0 ? void 0 : (_isolatedIndex$getHel = isolatedIndex.getHelper()) === null || _isolatedIndex$getHel === void 0 ? void 0 : _isolatedIndex$getHel.state.query;
+    var _useStorage = useStorage({
+        query: searchboxQuery,
+        showRecent: showRecent,
+        indices: indices,
+        indicesConfig: indicesConfig
+      }),
+      storage = _useStorage.storage,
+      storageHits = _useStorage.storageHits,
+      indicesConfigForPropGetters = _useStorage.indicesConfigForPropGetters,
+      indicesForPropGetters = _useStorage.indicesForPropGetters;
     var isSearchPage = (_targetIndex$getWidge = targetIndex === null || targetIndex === void 0 ? void 0 : targetIndex.getWidgets().some(function (_ref2) {
       var $$type = _ref2.$$type;
       return ['ais.hits', 'ais.infiniteHits'].includes($$type);
@@ -20173,10 +20446,11 @@
           query: query
         }), _objectSpread2$1));
       });
+      query.length > 0 && storage.onAdd(query);
     };
     var _usePropGetters = usePropGetters({
-        indices: indices,
-        indicesConfig: indicesConfig,
+        indices: indicesForPropGetters,
+        indicesConfig: indicesConfigForPropGetters,
         onRefine: onRefine,
         onSelect: userOnSelect !== null && userOnSelect !== void 0 ? userOnSelect : function (_ref3) {
           var query = _ref3.query,
@@ -20200,11 +20474,32 @@
       getItemProps = _usePropGetters.getItemProps,
       getPanelProps = _usePropGetters.getPanelProps,
       getRootProps = _usePropGetters.getRootProps;
-    var query = isolatedIndex === null || isolatedIndex === void 0 ? void 0 : (_isolatedIndex$getHel = isolatedIndex.getHelper()) === null || _isolatedIndex$getHel === void 0 ? void 0 : _isolatedIndex$getHel.state.query;
+    var AutocompleteRecentSearchComponent = AutocompleteRecentSearch;
+    if (_typeof(showRecent) === 'object' && (_showRecent$templates = showRecent.templates) !== null && _showRecent$templates !== void 0 && _showRecent$templates.item) {
+      var props = prepareTemplateProps({
+        defaultTemplates: {},
+        templatesConfig: instantSearchInstance.templatesConfig,
+        templates: showRecent.templates
+      });
+      AutocompleteRecentSearchComponent = function AutocompleteRecentSearchComponent(_ref4) {
+        var item = _ref4.item,
+          onSelect = _ref4.onSelect,
+          onRemoveRecentSearch = _ref4.onRemoveRecentSearch;
+        return h(Template, _extends({}, props, {
+          templateKey: "item",
+          rootTagName: "fragment",
+          data: {
+            item: item,
+            onSelect: onSelect,
+            onRemoveRecentSearch: onRemoveRecentSearch
+          }
+        }));
+      };
+    }
     return h(Autocomplete, _extends({}, getRootProps(), {
       classNames: cssClasses
     }), h(AutocompleteSearchBox, {
-      query: query || '',
+      query: searchboxQuery || '',
       inputProps: _objectSpread2(_objectSpread2({}, getInputProps()), {}, {
         // @ts-ignore - This clashes with some ambient React JSX declarations.
         onInput: function onInput(evt) {
@@ -20215,10 +20510,31 @@
         return onRefine('');
       },
       isSearchStalled: instantSearchInstance.status === 'stalled'
-    }), h(AutocompletePanel, getPanelProps(), indices.map(function (_ref4, i) {
+    }), h(AutocompletePanel, getPanelProps(), showRecent && h(AutocompleteIndex
+    // @ts-ignore - there seems to be problems with React.ComponentType and this, but it's actually correct
+    , {
+      ItemComponent: function ItemComponent(_ref5) {
+        var item = _ref5.item,
+          onSelect = _ref5.onSelect;
+        return h(AutocompleteRecentSearchComponent, {
+          item: item,
+          onSelect: onSelect,
+          onRemoveRecentSearch: function onRemoveRecentSearch() {
+            return storage.onRemove(item.query);
+          }
+        });
+      },
+      classNames: {
+        root: 'ais-AutocompleteRecentSearches',
+        list: 'ais-AutocompleteRecentSearchesList',
+        item: 'ais-AutocompleteRecentSearchesItem'
+      },
+      items: storageHits,
+      getItemProps: getItemProps
+    }), indices.map(function (_ref6, i) {
       var _indicesConfig$i$temp;
-      var indexId = _ref4.indexId,
-        hits = _ref4.hits;
+      var indexId = _ref6.indexId,
+        hits = _ref6.hits;
       if (!renderState.indexTemplateProps[i]) {
         renderState.indexTemplateProps[i] = prepareTemplateProps({
           defaultTemplates: {},
@@ -20226,8 +20542,8 @@
           templates: indicesConfig[i].templates
         });
       }
-      var headerComponent = (_indicesConfig$i$temp = indicesConfig[i].templates) !== null && _indicesConfig$i$temp !== void 0 && _indicesConfig$i$temp.header ? function (_ref5) {
-        var items = _ref5.items;
+      var headerComponent = (_indicesConfig$i$temp = indicesConfig[i].templates) !== null && _indicesConfig$i$temp !== void 0 && _indicesConfig$i$temp.header ? function (_ref7) {
+        var items = _ref7.items;
         return h(Template, _extends({}, renderState.indexTemplateProps[i], {
           templateKey: "header",
           rootTagName: "fragment",
@@ -20236,9 +20552,9 @@
           }
         }));
       } : undefined;
-      var itemComponent = function itemComponent(_ref6) {
-        var item = _ref6.item,
-          onSelect = _ref6.onSelect;
+      var itemComponent = function itemComponent(_ref8) {
+        var item = _ref8.item,
+          onSelect = _ref8.onSelect;
         return h(Template, _extends({}, renderState.indexTemplateProps[i], {
           templateKey: "item",
           rootTagName: "fragment",
@@ -20263,18 +20579,19 @@
     })));
   }
   function EXPERIMENTAL_autocomplete(widgetParams) {
-    var _ref7 = widgetParams || {},
-      container = _ref7.container,
-      escapeHTML = _ref7.escapeHTML,
-      _ref7$indices = _ref7.indices,
-      indices = _ref7$indices === void 0 ? [] : _ref7$indices,
-      showSuggestions = _ref7.showSuggestions,
-      getSearchPageURL = _ref7.getSearchPageURL,
-      onSelect = _ref7.onSelect,
-      _ref7$templates = _ref7.templates,
-      templates = _ref7$templates === void 0 ? {} : _ref7$templates,
-      _ref7$cssClasses = _ref7.cssClasses,
-      userCssClasses = _ref7$cssClasses === void 0 ? {} : _ref7$cssClasses;
+    var _ref9 = widgetParams || {},
+      container = _ref9.container,
+      escapeHTML = _ref9.escapeHTML,
+      _ref9$indices = _ref9.indices,
+      indices = _ref9$indices === void 0 ? [] : _ref9$indices,
+      showSuggestions = _ref9.showSuggestions,
+      showRecent = _ref9.showRecent,
+      getSearchPageURL = _ref9.getSearchPageURL,
+      onSelect = _ref9.onSelect,
+      _ref9$templates = _ref9.templates,
+      templates = _ref9$templates === void 0 ? {} : _ref9$templates,
+      _ref9$cssClasses = _ref9.cssClasses,
+      userCssClasses = _ref9$cssClasses === void 0 ? {} : _ref9$cssClasses;
     if (!container) {
       throw new Error(withUsage$z('The `container` option is required.'));
     }
@@ -20311,6 +20628,7 @@
       getSearchPageURL: getSearchPageURL,
       onSelect: onSelect,
       cssClasses: cssClasses,
+      showRecent: showRecent,
       renderState: {
         indexTemplateProps: [],
         isolatedIndex: undefined,
@@ -20326,14 +20644,14 @@
     })({}), index({
       indexId: "ais-autocomplete-".concat(instanceId),
       EXPERIMENTAL_isolated: true
-    }).addWidgets([configure({
-      hitsPerPage: 5
-    })].concat(_toConsumableArray(indicesConfig.map(function (_ref8) {
-      var indexName = _ref8.indexName;
+    }).addWidgets([].concat(_toConsumableArray(indicesConfig.map(function (_ref0) {
+      var indexName = _ref0.indexName;
       return index({
         indexName: indexName,
         indexId: indexName
-      }).addWidgets([configure({})]);
+      }).addWidgets([configure({
+        hitsPerPage: 5
+      })]);
     })), [_objectSpread2(_objectSpread2({}, makeWidget({
       escapeHTML: escapeHTML
     })), {}, {