@algolia/autocomplete-js 1.5.1 → 1.5.2

package/dist/umd/index.development.js

@@ -1,4 +1,4 @@
-/*! @algolia/autocomplete-js 1.5.1 | MIT License | © Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */
+/*! @algolia/autocomplete-js 1.5.2 | MIT License | © Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
   typeof define === 'function' && define.amd ? define(['exports'], factory) :
@@ -335,7 +335,7 @@
 
   var noop = function noop() {};
 
-  var version = '1.5.1';
+  var version = '1.5.2';
 
   var userAgents$1 = [{
     segment: 'autocomplete-core',
@@ -370,180 +370,79 @@
     "development" !== 'production' ? warn(!options.debug, 'The `debug` option is meant for development debugging and should not be used in production.') : void 0 ;
   }
 
-  function ownKeys$f(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$f(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i] != null ? arguments[i] : {};
-
-      if (i % 2) {
-        ownKeys$f(Object(source), true).forEach(function (key) {
-          _defineProperty$f(target, key, source[key]);
-        });
-      } else if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-      } else {
-        ownKeys$f(Object(source)).forEach(function (key) {
-          Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-      }
-    }
-
-    return target;
-  }
-
-  function _defineProperty$f(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;
-  }
-
-  function createStore(reducer, props, onStoreStateChange) {
-    var state = props.initialState;
+  function createInternalCancelablePromise(promise, initialState) {
+    var state = initialState;
     return {
-      getState: function getState() {
-        return state;
+      then: function then(onfulfilled, onrejected) {
+        return createInternalCancelablePromise(promise.then(createCallback(onfulfilled, state, promise), createCallback(onrejected, state, promise)), state);
       },
-      dispatch: function dispatch(action, payload) {
-        var prevState = _objectSpread$f({}, state);
+      catch: function _catch(onrejected) {
+        return createInternalCancelablePromise(promise.catch(createCallback(onrejected, state, promise)), state);
+      },
+      finally: function _finally(onfinally) {
+        if (onfinally) {
+          state.onCancelList.push(onfinally);
+        }
 
-        state = reducer(state, {
-          type: action,
-          props: props,
-          payload: payload
-        });
-        onStoreStateChange({
-          state: state,
-          prevState: prevState
+        return createInternalCancelablePromise(promise.finally(createCallback(onfinally && function () {
+          state.onCancelList = [];
+          return onfinally();
+        }, state, promise)), state);
+      },
+      cancel: function cancel() {
+        state.isCanceled = true;
+        var callbacks = state.onCancelList;
+        state.onCancelList = [];
+        callbacks.forEach(function (callback) {
+          callback();
         });
       },
-      shouldSkipPendingUpdate: false
+      isCanceled: function isCanceled() {
+        return state.isCanceled === true;
+      }
     };
   }
 
-  function ownKeys$e(object, enumerableOnly) {
-    var keys = Object.keys(object);
+  function cancelable(promise) {
+    return createInternalCancelablePromise(promise, {
+      isCanceled: false,
+      onCancelList: []
+    });
+  }
 
-    if (Object.getOwnPropertySymbols) {
-      var symbols = Object.getOwnPropertySymbols(object);
+  function createCallback(onResult, state, fallback) {
+    if (!onResult) {
+      return fallback;
+    }
 
-      if (enumerableOnly) {
-        symbols = symbols.filter(function (sym) {
-          return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-        });
+    return function callback(arg) {
+      if (state.isCanceled) {
+        return arg;
       }
 
-      keys.push.apply(keys, symbols);
-    }
-
-    return keys;
+      return onResult(arg);
+    };
   }
 
-  function _objectSpread$e(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i] != null ? arguments[i] : {};
-
-      if (i % 2) {
-        ownKeys$e(Object(source), true).forEach(function (key) {
-          _defineProperty$e(target, key, source[key]);
+  function createCancelablePromiseList() {
+    var list = [];
+    return {
+      add: function add(cancelablePromise) {
+        list.push(cancelablePromise);
+        return cancelablePromise.finally(function () {
+          list = list.filter(function (item) {
+            return item !== cancelablePromise;
+          });
         });
-      } else if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-      } else {
-        ownKeys$e(Object(source)).forEach(function (key) {
-          Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+      },
+      cancelAll: function cancelAll() {
+        list.forEach(function (promise) {
+          return promise.cancel();
         });
+      },
+      isEmpty: function isEmpty() {
+        return list.length === 0;
       }
-    }
-
-    return target;
-  }
-
-  function _defineProperty$e(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;
-  }
-  function getAutocompleteSetters(_ref) {
-    var store = _ref.store;
-
-    var setActiveItemId = function setActiveItemId(value) {
-      store.dispatch('setActiveItemId', value);
-    };
-
-    var setQuery = function setQuery(value) {
-      store.dispatch('setQuery', value);
-    };
-
-    var setCollections = function setCollections(rawValue) {
-      var baseItemId = 0;
-      var value = rawValue.map(function (collection) {
-        return _objectSpread$e(_objectSpread$e({}, collection), {}, {
-          // We flatten the stored items to support calling `getAlgoliaResults`
-          // from the source itself.
-          items: flatten(collection.items).map(function (item) {
-            return _objectSpread$e(_objectSpread$e({}, item), {}, {
-              __autocomplete_id: baseItemId++
-            });
-          })
-        });
-      });
-      store.dispatch('setCollections', value);
-    };
-
-    var setIsOpen = function setIsOpen(value) {
-      store.dispatch('setIsOpen', value);
-    };
-
-    var setStatus = function setStatus(value) {
-      store.dispatch('setStatus', value);
-    };
-
-    var setContext = function setContext(value) {
-      store.dispatch('setContext', value);
-    };
-
-    return {
-      setActiveItemId: setActiveItemId,
-      setQuery: setQuery,
-      setCollections: setCollections,
-      setIsOpen: setIsOpen,
-      setStatus: setStatus,
-      setContext: setContext
     };
   }
 
@@ -557,11 +456,8 @@
     var basePromiseId = -1;
     var latestResolvedId = -1;
     var latestResolvedValue = undefined;
-    var runningPromisesCount = 0;
-
-    function runConcurrentSafePromise(promise) {
+    return function runConcurrentSafePromise(promise) {
       basePromiseId++;
-      runningPromisesCount++;
       var currentPromiseId = basePromiseId;
       return Promise.resolve(promise).then(function (x) {
         // The promise might take too long to resolve and get outdated. This would
@@ -584,16 +480,8 @@
         latestResolvedId = currentPromiseId;
         latestResolvedValue = x;
         return x;
-      }).finally(function () {
-        return runningPromisesCount--;
       });
-    }
-
-    runConcurrentSafePromise.isRunning = function () {
-      return runningPromisesCount > 0;
     };
-
-    return runConcurrentSafePromise;
   }
 
   /**
@@ -630,7 +518,7 @@
     return numericIndex;
   }
 
-  function ownKeys$d(object, enumerableOnly) {
+  function ownKeys$f(object, enumerableOnly) {
     var keys = Object.keys(object);
 
     if (Object.getOwnPropertySymbols) {
@@ -648,18 +536,18 @@
     return keys;
   }
 
-  function _objectSpread$d(target) {
+  function _objectSpread$f(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i] != null ? arguments[i] : {};
 
       if (i % 2) {
-        ownKeys$d(Object(source), true).forEach(function (key) {
-          _defineProperty$d(target, key, source[key]);
+        ownKeys$f(Object(source), true).forEach(function (key) {
+          _defineProperty$f(target, key, source[key]);
         });
       } else if (Object.getOwnPropertyDescriptors) {
         Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
       } else {
-        ownKeys$d(Object(source)).forEach(function (key) {
+        ownKeys$f(Object(source)).forEach(function (key) {
           Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
         });
       }
@@ -668,7 +556,7 @@
     return target;
   }
 
-  function _defineProperty$d(obj, key, value) {
+  function _defineProperty$f(obj, key, value) {
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value: value,
@@ -718,7 +606,7 @@
 
         seenSourceIds.push(source.sourceId);
 
-        var normalizedSource = _objectSpread$d({
+        var normalizedSource = _objectSpread$f({
           getItemInputValue: function getItemInputValue(_ref) {
             var state = _ref.state;
             return state.query;
@@ -828,7 +716,7 @@
     return parent === child || parent.contains(child);
   }
 
-  function ownKeys$c(object, enumerableOnly) {
+  function ownKeys$e(object, enumerableOnly) {
     var keys = Object.keys(object);
 
     if (Object.getOwnPropertySymbols) {
@@ -846,18 +734,18 @@
     return keys;
   }
 
-  function _objectSpread$c(target) {
+  function _objectSpread$e(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i] != null ? arguments[i] : {};
 
       if (i % 2) {
-        ownKeys$c(Object(source), true).forEach(function (key) {
-          _defineProperty$c(target, key, source[key]);
+        ownKeys$e(Object(source), true).forEach(function (key) {
+          _defineProperty$e(target, key, source[key]);
         });
       } else if (Object.getOwnPropertyDescriptors) {
         Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
       } else {
-        ownKeys$c(Object(source)).forEach(function (key) {
+        ownKeys$e(Object(source)).forEach(function (key) {
           Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
         });
       }
@@ -866,7 +754,7 @@
     return target;
   }
 
-  function _defineProperty$c(obj, key, value) {
+  function _defineProperty$e(obj, key, value) {
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value: value,
@@ -885,10 +773,10 @@
     var results = rawResults.map(function (result) {
       var _hits;
 
-      return _objectSpread$c(_objectSpread$c({}, result), {}, {
+      return _objectSpread$e(_objectSpread$e({}, result), {}, {
         hits: (_hits = result.hits) === null || _hits === void 0 ? void 0 : _hits.map(function (hit) {
           // Bring support for the Insights plugin.
-          return _objectSpread$c(_objectSpread$c({}, hit), {}, {
+          return _objectSpread$e(_objectSpread$e({}, hit), {}, {
             __autocomplete_indexName: result.index,
             __autocomplete_queryID: result.queryID
           });
@@ -919,6 +807,182 @@
     };
   }
 
+  function ownKeys$d(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$d(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+
+      if (i % 2) {
+        ownKeys$d(Object(source), true).forEach(function (key) {
+          _defineProperty$d(target, key, source[key]);
+        });
+      } else if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+      } else {
+        ownKeys$d(Object(source)).forEach(function (key) {
+          Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+      }
+    }
+
+    return target;
+  }
+
+  function _defineProperty$d(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;
+  }
+  function createStore(reducer, props, onStoreStateChange) {
+    var state = props.initialState;
+    return {
+      getState: function getState() {
+        return state;
+      },
+      dispatch: function dispatch(action, payload) {
+        var prevState = _objectSpread$d({}, state);
+
+        state = reducer(state, {
+          type: action,
+          props: props,
+          payload: payload
+        });
+        onStoreStateChange({
+          state: state,
+          prevState: prevState
+        });
+      },
+      pendingRequests: createCancelablePromiseList()
+    };
+  }
+
+  function ownKeys$c(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$c(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+
+      if (i % 2) {
+        ownKeys$c(Object(source), true).forEach(function (key) {
+          _defineProperty$c(target, key, source[key]);
+        });
+      } else if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+      } else {
+        ownKeys$c(Object(source)).forEach(function (key) {
+          Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+      }
+    }
+
+    return target;
+  }
+
+  function _defineProperty$c(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;
+  }
+  function getAutocompleteSetters(_ref) {
+    var store = _ref.store;
+
+    var setActiveItemId = function setActiveItemId(value) {
+      store.dispatch('setActiveItemId', value);
+    };
+
+    var setQuery = function setQuery(value) {
+      store.dispatch('setQuery', value);
+    };
+
+    var setCollections = function setCollections(rawValue) {
+      var baseItemId = 0;
+      var value = rawValue.map(function (collection) {
+        return _objectSpread$c(_objectSpread$c({}, collection), {}, {
+          // We flatten the stored items to support calling `getAlgoliaResults`
+          // from the source itself.
+          items: flatten(collection.items).map(function (item) {
+            return _objectSpread$c(_objectSpread$c({}, item), {}, {
+              __autocomplete_id: baseItemId++
+            });
+          })
+        });
+      });
+      store.dispatch('setCollections', value);
+    };
+
+    var setIsOpen = function setIsOpen(value) {
+      store.dispatch('setIsOpen', value);
+    };
+
+    var setStatus = function setStatus(value) {
+      store.dispatch('setStatus', value);
+    };
+
+    var setContext = function setContext(value) {
+      store.dispatch('setContext', value);
+    };
+
+    return {
+      setActiveItemId: setActiveItemId,
+      setQuery: setQuery,
+      setCollections: setCollections,
+      setIsOpen: setIsOpen,
+      setStatus: setStatus,
+      setContext: setContext
+    };
+  }
+
   function _toConsumableArray$4(arr) {
     return _arrayWithoutHoles$4(arr) || _iterableToArray$4(arr) || _unsupportedIterableToArray$4(arr) || _nonIterableSpread$4();
   }
@@ -1534,9 +1598,11 @@
       // updates performed in this code path.
       // We chain with a void promise to respect `onInput`'s expected return type.
 
-      return runConcurrentSafePromise(collections).then(function () {
+      var _request = cancelable(runConcurrentSafePromise(collections).then(function () {
         return Promise.resolve();
-      });
+      }));
+
+      return store.pendingRequests.add(_request);
     }
 
     setStatus('loading');
@@ -1549,7 +1615,7 @@
     // meaning we should only ever manipulate the state once this concurrent-safe
     // promise is resolved.
 
-    return runConcurrentSafePromise(props.getSources(_objectSpread$8({
+    var request = cancelable(runConcurrentSafePromise(props.getSources(_objectSpread$8({
       query: query,
       refresh: refresh,
       state: store.getState()
@@ -1571,7 +1637,7 @@
           state: store.getState()
         });
       });
-    })).then(function (collections) {
+    }))).then(function (collections) {
       var _nextState$isOpen2; // 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.
@@ -1579,15 +1645,6 @@
 
 
       setStatus('idle');
-
-      if (store.shouldSkipPendingUpdate) {
-        if (!runConcurrentSafePromise.isRunning()) {
-          store.shouldSkipPendingUpdate = false;
-        }
-
-        return;
-      }
-
       setCollections(collections);
       var isPanelOpen = props.shouldPanelOpen({
         state: store.getState()
@@ -1611,12 +1668,14 @@
         }, setters));
       }
     }).finally(function () {
+      setStatus('idle');
+
       if (lastStalledId) {
         props.environment.clearTimeout(lastStalledId);
       }
     });
+    return store.pendingRequests.add(request);
   }
-  onInput.isRunning = runConcurrentSafePromise.isRunning;
 
   var _excluded$5 = ["event", "props", "refresh", "store"];
 
@@ -1784,12 +1843,10 @@
       event.preventDefault();
       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
-      // running and could reopen the panel once they resolve, because that would
+      // pending and could reopen the panel once they resolve, because that would
       // result in an unsolicited UI behavior.
 
-      if (onInput.isRunning()) {
-        store.shouldSkipPendingUpdate = true;
-      }
+      store.pendingRequests.cancelAll();
     } else if (event.key === 'Enter') {
       // No active item, so we let the browser handle the native `onSubmit` form
       // event.
@@ -2004,12 +2061,12 @@
           // 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 running requests
+          // - 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 isNotAutocompleteInteraction = store.getState().isOpen === false && !onInput.isRunning();
+          var isAutocompleteInteraction = store.getState().isOpen || !store.pendingRequests.isEmpty();
 
-          if (isNotAutocompleteInteraction || event.target === inputElement) {
+          if (!isAutocompleteInteraction || event.target === inputElement) {
             return;
           }
 
@@ -2018,13 +2075,13 @@
           });
 
           if (isTargetWithinAutocomplete === false) {
-            store.dispatch('blur', null); // If requests are still running when the user closes the panel, they
+            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 && onInput.isRunning()) {
-              store.shouldSkipPendingUpdate = true;
+            if (!props.debug) {
+              store.pendingRequests.cancelAll();
             }
           }
         },
@@ -2151,13 +2208,13 @@
           // We do rely on the `blur` event on touch devices.
           // See explanation in `onTouchStart`.
           if (!isTouchDevice) {
-            store.dispatch('blur', null); // If requests are still running when the user closes the panel, they
+            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 && onInput.isRunning()) {
-              store.shouldSkipPendingUpdate = true;
+            if (!props.debug) {
+              store.pendingRequests.cancelAll();
             }
           }
         },