@algolia/autocomplete-core 1.4.0 → 1.5.2

package/dist/esm/createAutocomplete.d.ts

@@ -1,2 +1,8 @@
-import { AutocompleteApi, AutocompleteOptions, BaseItem } from './types';
-export declare function createAutocomplete<TItem extends BaseItem, TEvent = Event, TMouseEvent = MouseEvent, TKeyboardEvent = KeyboardEvent>(options: AutocompleteOptions<TItem>): AutocompleteApi<TItem, TEvent, TMouseEvent, TKeyboardEvent>;
+import { AutocompleteApi, AutocompleteOptions as AutocompleteCoreOptions, BaseItem } from './types';
+export interface AutocompleteOptionsWithMetadata<TItem extends BaseItem> extends AutocompleteCoreOptions<TItem> {
+    /**
+     * @internal
+     */
+    __autocomplete_metadata?: Record<string, unknown>;
+}
+export declare function createAutocomplete<TItem extends BaseItem, TEvent = Event, TMouseEvent = MouseEvent, TKeyboardEvent = KeyboardEvent>(options: AutocompleteOptionsWithMetadata<TItem>): AutocompleteApi<TItem, TEvent, TMouseEvent, TKeyboardEvent>;

package/dist/esm/createAutocomplete.js

@@ -1,4 +1,4 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
@@ -9,6 +9,7 @@ import { createStore } from './createStore';
 import { getAutocompleteSetters } from './getAutocompleteSetters';
 import { getDefaultProps } from './getDefaultProps';
 import { getPropGetters } from './getPropGetters';
+import { getMetadata, injectMetadata } from './metadata';
 import { onInput } from './onInput';
 import { stateReducer } from './stateReducer';
 export function createAutocomplete(options) {
@@ -65,6 +66,13 @@ export function createAutocomplete(options) {
       }
     }));
   });
+  injectMetadata({
+    metadata: getMetadata({
+      plugins: props.plugins,
+      options: options
+    }),
+    environment: props.environment
+  });
   return _objectSpread(_objectSpread({
     refresh: refresh
   }, propGetters), setters);

package/dist/esm/createStore.js

@@ -1,9 +1,10 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
+import { createCancelablePromiseList } from './utils';
 export function createStore(reducer, props, onStoreStateChange) {
   var state = props.initialState;
   return {
@@ -22,6 +23,7 @@ export function createStore(reducer, props, onStoreStateChange) {
         state: state,
         prevState: prevState
       });
-    }
+    },
+    pendingRequests: createCancelablePromiseList()
   };
 }

package/dist/esm/getAutocompleteSetters.js

@@ -1,4 +1,4 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 

package/dist/esm/getDefaultProps.js

@@ -4,13 +4,13 @@ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread n
 
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 

package/dist/esm/getPropGetters.js

@@ -1,4 +1,10 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+var _excluded = ["props", "refresh", "store"],
+    _excluded2 = ["inputElement", "formElement", "panelElement"],
+    _excluded3 = ["inputElement"],
+    _excluded4 = ["inputElement", "maxLength"],
+    _excluded5 = ["item", "source"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
@@ -15,13 +21,13 @@ export function getPropGetters(_ref) {
   var props = _ref.props,
       refresh = _ref.refresh,
       store = _ref.store,
-      setters = _objectWithoutProperties(_ref, ["props", "refresh", "store"]);
+      setters = _objectWithoutProperties(_ref, _excluded);
 
   var getEnvironmentProps = function getEnvironmentProps(providedProps) {
     var inputElement = providedProps.inputElement,
         formElement = providedProps.formElement,
         panelElement = providedProps.panelElement,
-        rest = _objectWithoutProperties(providedProps, ["inputElement", "formElement", "panelElement"]);
+        rest = _objectWithoutProperties(providedProps, _excluded2);
 
     return _objectSpread({
       // On touch devices, we do not rely on the native `blur` event of the
@@ -29,19 +35,34 @@ export function getPropGetters(_ref) {
       // outside of the autocomplete elements.
       // This ensures a working experience on mobile because we blur the input
       // on touch devices when the user starts scrolling (`touchmove`).
+      // @TODO: support cases where there are multiple Autocomplete instances.
+      // Right now, a second instance makes this computation return false.
       onTouchStart: function onTouchStart(event) {
-        if (store.getState().isOpen === false || event.target === inputElement) {
-          return;
-        } // @TODO: support cases where there are multiple Autocomplete instances.
-        // Right now, a second instance makes this computation return false.
+        // The `onTouchStart` event shouldn't trigger the `blur` handler when
+        // it's not an interaction with Autocomplete. We detect it with the
+        // following heuristics:
+        // - the panel is closed AND there are no pending requests
+        //   (no interaction with the autocomplete, no future state updates)
+        // - OR the touched target is the input element (should open the panel)
+        var isAutocompleteInteraction = store.getState().isOpen || !store.pendingRequests.isEmpty();
 
+        if (!isAutocompleteInteraction || event.target === inputElement) {
+          return;
+        }
 
         var isTargetWithinAutocomplete = [formElement, panelElement].some(function (contextNode) {
-          return isOrContainsNode(contextNode, event.target) || isOrContainsNode(contextNode, props.environment.document.activeElement);
+          return isOrContainsNode(contextNode, event.target);
         });
 
         if (isTargetWithinAutocomplete === false) {
-          store.dispatch('blur', null);
+          store.dispatch('blur', null); // If requests are still pending when the user closes the panel, they
+          // could reopen the panel once they resolve.
+          // We want to prevent any subsequent query from reopening the panel
+          // because it would result in an unsolicited UI behavior.
+
+          if (!props.debug) {
+            store.pendingRequests.cancelAll();
+          }
         }
       },
       // When scrolling on touch devices (mobiles, tablets, etc.), we want to
@@ -70,7 +91,7 @@ export function getPropGetters(_ref) {
 
   var getFormProps = function getFormProps(providedProps) {
     var inputElement = providedProps.inputElement,
-        rest = _objectWithoutProperties(providedProps, ["inputElement"]);
+        rest = _objectWithoutProperties(providedProps, _excluded3);
 
     return _objectSpread({
       action: '',
@@ -126,7 +147,7 @@ export function getPropGetters(_ref) {
         inputElement = _ref2.inputElement,
         _ref2$maxLength = _ref2.maxLength,
         maxLength = _ref2$maxLength === void 0 ? 512 : _ref2$maxLength,
-        rest = _objectWithoutProperties(_ref2, ["inputElement", "maxLength"]);
+        rest = _objectWithoutProperties(_ref2, _excluded4);
 
     var activeItem = getActiveItem(store.getState());
     return _objectSpread({
@@ -167,7 +188,14 @@ export function getPropGetters(_ref) {
         // We do rely on the `blur` event on touch devices.
         // See explanation in `onTouchStart`.
         if (!isTouchDevice) {
-          store.dispatch('blur', null);
+          store.dispatch('blur', null); // If requests are still pending when the user closes the panel, they
+          // could reopen the panel once they resolve.
+          // We want to prevent any subsequent query from reopening the panel
+          // because it would result in an unsolicited UI behavior.
+
+          if (!props.debug) {
+            store.pendingRequests.cancelAll();
+          }
         }
       },
       onClick: function onClick(event) {
@@ -217,7 +245,7 @@ export function getPropGetters(_ref) {
   var getItemProps = function getItemProps(providedProps) {
     var item = providedProps.item,
         source = providedProps.source,
-        rest = _objectWithoutProperties(providedProps, ["item", "source"]);
+        rest = _objectWithoutProperties(providedProps, _excluded5);
 
     return _objectSpread({
       id: "".concat(props.id, "-item-").concat(item.__autocomplete_id),

package/dist/esm/index.d.ts

@@ -1,4 +1,3 @@
 export * from './createAutocomplete';
 export * from './getDefaultProps';
 export * from './types';
-export * from './version';

package/dist/esm/index.js

@@ -1,4 +1,3 @@
 export * from './createAutocomplete';
 export * from './getDefaultProps';
-export * from './types';
-export * from './version';
+export * from './types';

package/dist/esm/metadata.d.ts

@@ -0,0 +1,33 @@
+import { UserAgent } from '@algolia/autocomplete-shared';
+import { AutocompleteEnvironment, AutocompleteOptionsWithMetadata, AutocompletePlugin, BaseItem } from '.';
+declare type AutocompleteMetadata = {
+    plugins: Array<{
+        name: string | undefined;
+        options: string[];
+    }>;
+    options: Record<string, string[]>;
+    ua: UserAgent[];
+};
+declare type GetMetadataParams<TItem extends BaseItem, TData = unknown> = {
+    plugins: Array<AutocompletePlugin<TItem, TData>>;
+    options: AutocompleteOptionsWithMetadata<TItem>;
+};
+export declare function getMetadata<TItem extends BaseItem, TData = unknown>({ plugins, options, }: GetMetadataParams<TItem, TData>): {
+    plugins: {
+        name: string | undefined;
+        options: string[];
+    }[];
+    options: {
+        'autocomplete-core': string[];
+    };
+    ua: {
+        segment: string;
+        version: string;
+    }[];
+};
+declare type InlineMetadataParams = {
+    metadata: AutocompleteMetadata;
+    environment: AutocompleteEnvironment;
+};
+export declare function injectMetadata({ metadata, environment, }: InlineMetadataParams): void;
+export {};

package/dist/esm/metadata.js

@@ -0,0 +1,44 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import { userAgents } from '@algolia/autocomplete-shared';
+export function getMetadata(_ref) {
+  var _, _options$__autocomple, _options$__autocomple2, _options$__autocomple3;
+
+  var plugins = _ref.plugins,
+      options = _ref.options;
+  var optionsKey = (_ = (((_options$__autocomple = options.__autocomplete_metadata) === null || _options$__autocomple === void 0 ? void 0 : _options$__autocomple.userAgents) || [])[0]) === null || _ === void 0 ? void 0 : _.segment;
+  var extraOptions = optionsKey ? _defineProperty({}, optionsKey, Object.keys(((_options$__autocomple2 = options.__autocomplete_metadata) === null || _options$__autocomple2 === void 0 ? void 0 : _options$__autocomple2.options) || {})) : {};
+  return {
+    plugins: plugins.map(function (plugin) {
+      return {
+        name: plugin.name,
+        options: Object.keys(plugin.__autocomplete_pluginOptions || [])
+      };
+    }),
+    options: _objectSpread({
+      'autocomplete-core': Object.keys(options)
+    }, extraOptions),
+    ua: userAgents.concat(((_options$__autocomple3 = options.__autocomplete_metadata) === null || _options$__autocomple3 === void 0 ? void 0 : _options$__autocomple3.userAgents) || [])
+  };
+}
+export function injectMetadata(_ref3) {
+  var _environment$navigato;
+
+  var metadata = _ref3.metadata,
+      environment = _ref3.environment;
+  var isMetadataEnabled = (_environment$navigato = environment.navigator) === null || _environment$navigato === void 0 ? void 0 : _environment$navigato.userAgent.includes('Algolia Crawler');
+
+  if (isMetadataEnabled) {
+    var metadataContainer = environment.document.createElement('meta');
+    var headRef = environment.document.querySelector('head');
+    metadataContainer.name = 'algolia:metadata';
+    setTimeout(function () {
+      metadataContainer.content = JSON.stringify(metadata);
+      headRef.appendChild(metadataContainer);
+    }, 0);
+  }
+}

package/dist/esm/onInput.d.ts

@@ -1,4 +1,5 @@
 import { AutocompleteScopeApi, AutocompleteState, AutocompleteStore, BaseItem, InternalAutocompleteOptions } from './types';
+import { CancelablePromise } from './utils';
 interface OnInputParams<TItem extends BaseItem> extends AutocompleteScopeApi<TItem> {
     event: any;
     /**
@@ -13,5 +14,5 @@ interface OnInputParams<TItem extends BaseItem> extends AutocompleteScopeApi<TIt
     query: string;
     store: AutocompleteStore<TItem>;
 }
-export declare function onInput<TItem extends BaseItem>({ event, nextState, props, query, refresh, store, ...setters }: OnInputParams<TItem>): Promise<void>;
+export declare function onInput<TItem extends BaseItem>({ event, nextState, props, query, refresh, store, ...setters }: OnInputParams<TItem>): CancelablePromise<void>;
 export {};

package/dist/esm/onInput.js

@@ -1,4 +1,6 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+var _excluded = ["event", "nextState", "props", "query", "refresh", "store"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
@@ -10,8 +12,9 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 import { reshape } from './reshape';
 import { preResolve, resolve, postResolve } from './resolve';
-import { getActiveItem } from './utils';
+import { cancelable, createConcurrentSafePromise, getActiveItem } from './utils';
 var lastStalledId = null;
+var runConcurrentSafePromise = createConcurrentSafePromise();
 export function onInput(_ref) {
   var event = _ref.event,
       _ref$nextState = _ref.nextState,
@@ -20,7 +23,7 @@ export function onInput(_ref) {
       query = _ref.query,
       refresh = _ref.refresh,
       store = _ref.store,
-      setters = _objectWithoutProperties(_ref, ["event", "nextState", "props", "query", "refresh", "store"]);
+      setters = _objectWithoutProperties(_ref, _excluded);
 
   if (lastStalledId) {
     props.environment.clearTimeout(lastStalledId);
@@ -37,28 +40,42 @@ export function onInput(_ref) {
   if (!query && props.openOnFocus === false) {
     var _nextState$isOpen;
 
-    setStatus('idle');
-    setCollections(store.getState().collections.map(function (collection) {
+    var collections = store.getState().collections.map(function (collection) {
       return _objectSpread(_objectSpread({}, collection), {}, {
         items: []
       });
-    }));
+    });
+    setStatus('idle');
+    setCollections(collections);
     setIsOpen((_nextState$isOpen = nextState.isOpen) !== null && _nextState$isOpen !== void 0 ? _nextState$isOpen : props.shouldPanelOpen({
       state: store.getState()
+    })); // We make sure to update the latest resolved value of the tracked
+    // promises to keep late resolving promises from "cancelling" the state
+    // updates performed in this code path.
+    // We chain with a void promise to respect `onInput`'s expected return type.
+
+    var _request = cancelable(runConcurrentSafePromise(collections).then(function () {
+      return Promise.resolve();
     }));
-    return Promise.resolve();
+
+    return store.pendingRequests.add(_request);
   }
 
   setStatus('loading');
   lastStalledId = props.environment.setTimeout(function () {
     setStatus('stalled');
-  }, props.stallThreshold);
-  return props.getSources(_objectSpread({
+  }, props.stallThreshold); // We track the entire promise chain triggered by `onInput` before mutating
+  // the Autocomplete state to make sure that any state manipulation is based on
+  // fresh data regardless of when promises individually resolve.
+  // We don't track nested promises and only rely on the full chain resolution,
+  // meaning we should only ever manipulate the state once this concurrent-safe
+  // promise is resolved.
+
+  var request = cancelable(runConcurrentSafePromise(props.getSources(_objectSpread({
     query: query,
     refresh: refresh,
     state: store.getState()
   }, setters)).then(function (sources) {
-    setStatus('loading');
     return Promise.all(sources.map(function (source) {
       return Promise.resolve(source.getItems(_objectSpread({
         query: query,
@@ -75,36 +92,43 @@ export function onInput(_ref) {
         props: props,
         state: store.getState()
       });
-    }).then(function (collections) {
-      var _nextState$isOpen2;
+    });
+  }))).then(function (collections) {
+    var _nextState$isOpen2;
 
-      setStatus('idle');
-      setCollections(collections);
-      var isPanelOpen = props.shouldPanelOpen({
-        state: store.getState()
-      });
-      setIsOpen((_nextState$isOpen2 = nextState.isOpen) !== null && _nextState$isOpen2 !== void 0 ? _nextState$isOpen2 : props.openOnFocus && !query && isPanelOpen || isPanelOpen);
-      var highlightedItem = getActiveItem(store.getState());
-
-      if (store.getState().activeItemId !== null && highlightedItem) {
-        var item = highlightedItem.item,
-            itemInputValue = highlightedItem.itemInputValue,
-            itemUrl = highlightedItem.itemUrl,
-            source = highlightedItem.source;
-        source.onActive(_objectSpread({
-          event: event,
-          item: item,
-          itemInputValue: itemInputValue,
-          itemUrl: itemUrl,
-          refresh: refresh,
-          source: source,
-          state: store.getState()
-        }, setters));
-      }
-    }).finally(function () {
-      if (lastStalledId) {
-        props.environment.clearTimeout(lastStalledId);
-      }
+    // Parameters passed to `onInput` could be stale when the following code
+    // executes, because `onInput` calls may not resolve in order.
+    // If it becomes a problem we'll need to save the last passed parameters.
+    // See: https://codesandbox.io/s/agitated-cookies-y290z
+    setStatus('idle');
+    setCollections(collections);
+    var isPanelOpen = props.shouldPanelOpen({
+      state: store.getState()
     });
+    setIsOpen((_nextState$isOpen2 = nextState.isOpen) !== null && _nextState$isOpen2 !== void 0 ? _nextState$isOpen2 : props.openOnFocus && !query && isPanelOpen || isPanelOpen);
+    var highlightedItem = getActiveItem(store.getState());
+
+    if (store.getState().activeItemId !== null && highlightedItem) {
+      var item = highlightedItem.item,
+          itemInputValue = highlightedItem.itemInputValue,
+          itemUrl = highlightedItem.itemUrl,
+          source = highlightedItem.source;
+      source.onActive(_objectSpread({
+        event: event,
+        item: item,
+        itemInputValue: itemInputValue,
+        itemUrl: itemUrl,
+        refresh: refresh,
+        source: source,
+        state: store.getState()
+      }, setters));
+    }
+  }).finally(function () {
+    setStatus('idle');
+
+    if (lastStalledId) {
+      props.environment.clearTimeout(lastStalledId);
+    }
   });
+  return store.pendingRequests.add(request);
 }

package/dist/esm/onKeyDown.js

@@ -1,4 +1,6 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+var _excluded = ["event", "props", "refresh", "store"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
@@ -15,7 +17,7 @@ export function onKeyDown(_ref) {
       props = _ref.props,
       refresh = _ref.refresh,
       store = _ref.store,
-      setters = _objectWithoutProperties(_ref, ["event", "props", "refresh", "store"]);
+      setters = _objectWithoutProperties(_ref, _excluded);
 
   if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
     // eslint-disable-next-line no-inner-declarations
@@ -84,7 +86,12 @@ export function onKeyDown(_ref) {
     // from removing the query right away because we first want to close the
     // panel.
     event.preventDefault();
-    store.dispatch(event.key, null);
+    store.dispatch(event.key, null); // Hitting the `Escape` key signals the end of a user interaction with the
+    // autocomplete. At this point, we should ignore any requests that are still
+    // pending and could reopen the panel once they resolve, because that would
+    // result in an unsolicited UI behavior.
+
+    store.pendingRequests.cancelAll();
   } else if (event.key === 'Enter') {
     // No active item, so we let the browser handle the native `onSubmit` form
     // event.

package/dist/esm/reshape.js

@@ -1,4 +1,4 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 

package/dist/esm/resolve.js

@@ -6,13 +6,13 @@ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread n
 
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 

package/dist/esm/stateReducer.js

@@ -1,4 +1,4 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 

package/dist/esm/types/AutocompleteApi.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteCollection.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteContext.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteEnvironment.d.ts

@@ -9,4 +9,5 @@ export declare type AutocompleteEnvironment = Window | {
         assign: Location['assign'];
     };
     open: Window['open'];
+    navigator: Window['navigator'];
 };

package/dist/esm/types/AutocompleteEnvironment.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteNavigator.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteOptions.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompletePlugin.d.ts

@@ -21,5 +21,15 @@ export declare type AutocompletePlugin<TItem extends BaseItem, TData = unknown>
      * @link https://www.algolia.com/doc/ui-libraries/autocomplete/core-concepts/plugins/#param-data
      */
     data?: TData;
+    /**
+     * A name to identify the plugin.
+     *
+     * @link https://www.algolia.com/doc/ui-libraries/autocomplete/core-concepts/plugins/#param-name
+     */
+    name?: string;
+    /**
+     * @internal
+     */
+    __autocomplete_pluginOptions?: Record<string, any>;
 };
 export {};

package/dist/esm/types/AutocompletePlugin.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompletePropGetters.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteReshape.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteSetters.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteSource.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteState.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteStore.d.ts

@@ -1,9 +1,11 @@
+import { CancelablePromiseList } from '../utils';
 import { BaseItem } from './AutocompleteApi';
 import { InternalAutocompleteOptions } from './AutocompleteOptions';
 import { AutocompleteState } from './AutocompleteState';
 export interface AutocompleteStore<TItem extends BaseItem> {
     getState(): AutocompleteState<TItem>;
     dispatch(action: ActionType, payload: any): void;
+    pendingRequests: CancelablePromiseList<void>;
 }
 export declare type Reducer = <TItem extends BaseItem>(state: AutocompleteState<TItem>, action: Action<TItem, any>) => AutocompleteState<TItem>;
 declare type Action<TItem extends BaseItem, TPayload> = {

package/dist/esm/types/AutocompleteStore.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/AutocompleteSubscribers.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/utils/createCancelablePromise.d.ts

@@ -0,0 +1,15 @@
+declare type PromiseExecutor<TValue> = (resolve: (value: TValue | PromiseLike<TValue>) => void, reject: (reason?: any) => void) => void;
+export declare type CancelablePromise<TValue> = {
+    then<TResultFulfilled = TValue, TResultRejected = never>(onfulfilled?: ((value: TValue) => TResultFulfilled | PromiseLike<TResultFulfilled> | CancelablePromise<TResultFulfilled>) | undefined | null, onrejected?: ((reason: any) => TResultRejected | PromiseLike<TResultRejected> | CancelablePromise<TResultRejected>) | undefined | null): CancelablePromise<TResultFulfilled | TResultRejected>;
+    catch<TResult = never>(onrejected?: ((reason: any) => TResult | PromiseLike<TResult> | CancelablePromise<TResult>) | undefined | null): CancelablePromise<TValue | TResult>;
+    finally(onfinally?: (() => void) | undefined | null): CancelablePromise<TValue>;
+    cancel(): void;
+    isCanceled(): boolean;
+};
+export declare function createCancelablePromise<TValue>(executor: PromiseExecutor<TValue>): CancelablePromise<TValue>;
+export declare namespace createCancelablePromise {
+    var resolve: <TValue>(value?: TValue | PromiseLike<TValue> | CancelablePromise<TValue> | undefined) => CancelablePromise<TValue | CancelablePromise<TValue> | undefined>;
+    var reject: (reason?: any) => CancelablePromise<never>;
+}
+export declare function cancelable<TValue>(promise: Promise<TValue>): CancelablePromise<TValue>;
+export {};