@algolia/autocomplete-core 1.11.0 → 1.12.0

package/dist/esm/createAutocomplete.js

@@ -28,6 +28,7 @@ export function createAutocomplete(options) {
     navigator: props.navigator
   }, setters));
   function onStoreStateChange(_ref) {
+    var _state$context, _state$context$algoli;
     var prevState = _ref.prevState,
       state = _ref.state;
     props.onStateChange(_objectSpread({
@@ -36,6 +37,13 @@ export function createAutocomplete(options) {
       refresh: refresh,
       navigator: props.navigator
     }, setters));
+    if (!isAlgoliaInsightsPluginEnabled() && (_state$context = state.context) !== null && _state$context !== void 0 && (_state$context$algoli = _state$context.algoliaInsightsPlugin) !== null && _state$context$algoli !== void 0 && _state$context$algoli.__automaticInsights && props.insights !== false) {
+      var plugin = createAlgoliaInsightsPlugin({
+        __autocomplete_clickAnalytics: false
+      });
+      props.plugins.push(plugin);
+      subscribePlugins([plugin]);
+    }
   }
   function refresh() {
     return onInput(_objectSpread({
@@ -50,34 +58,40 @@ export function createAutocomplete(options) {
       store: store
     }, setters));
   }
-  if (options.insights && !props.plugins.some(function (plugin) {
-    return plugin.name === 'aa.algoliaInsightsPlugin';
-  })) {
-    var insightsParams = typeof options.insights === 'boolean' ? {} : options.insights;
+  function subscribePlugins(plugins) {
+    plugins.forEach(function (plugin) {
+      var _plugin$subscribe;
+      return (_plugin$subscribe = plugin.subscribe) === null || _plugin$subscribe === void 0 ? void 0 : _plugin$subscribe.call(plugin, _objectSpread(_objectSpread({}, setters), {}, {
+        navigator: props.navigator,
+        refresh: refresh,
+        onSelect: function onSelect(fn) {
+          subscribers.push({
+            onSelect: fn
+          });
+        },
+        onActive: function onActive(fn) {
+          subscribers.push({
+            onActive: fn
+          });
+        },
+        onResolve: function onResolve(fn) {
+          subscribers.push({
+            onResolve: fn
+          });
+        }
+      }));
+    });
+  }
+  function isAlgoliaInsightsPluginEnabled() {
+    return props.plugins.some(function (plugin) {
+      return plugin.name === 'aa.algoliaInsightsPlugin';
+    });
+  }
+  if (props.insights && !isAlgoliaInsightsPluginEnabled()) {
+    var insightsParams = typeof props.insights === 'boolean' ? {} : props.insights;
     props.plugins.push(createAlgoliaInsightsPlugin(insightsParams));
   }
-  props.plugins.forEach(function (plugin) {
-    var _plugin$subscribe;
-    return (_plugin$subscribe = plugin.subscribe) === null || _plugin$subscribe === void 0 ? void 0 : _plugin$subscribe.call(plugin, _objectSpread(_objectSpread({}, setters), {}, {
-      navigator: props.navigator,
-      refresh: refresh,
-      onSelect: function onSelect(fn) {
-        subscribers.push({
-          onSelect: fn
-        });
-      },
-      onActive: function onActive(fn) {
-        subscribers.push({
-          onActive: fn
-        });
-      },
-      onResolve: function onResolve(fn) {
-        subscribers.push({
-          onResolve: fn
-        });
-      }
-    }));
-  });
+  subscribePlugins(props.plugins);
   injectMetadata({
     metadata: getMetadata({
       plugins: props.plugins,

package/dist/esm/getDefaultProps.js

@@ -26,7 +26,7 @@ export function getDefaultProps(props, pluginSubscribers) {
     autoFocus: false,
     defaultActiveItemId: null,
     stallThreshold: 300,
-    insights: false,
+    insights: undefined,
     environment: environment,
     shouldPanelOpen: function shouldPanelOpen(_ref) {
       var state = _ref.state;

package/dist/esm/getPropGetters.js

@@ -3,9 +3,8 @@ var _excluded = ["props", "refresh", "store"],
   _excluded2 = ["inputElement", "formElement", "panelElement"],
   _excluded3 = ["inputElement"],
   _excluded4 = ["inputElement", "maxLength"],
-  _excluded5 = ["sourceIndex"],
-  _excluded6 = ["sourceIndex"],
-  _excluded7 = ["item", "source", "sourceIndex"];
+  _excluded5 = ["source"],
+  _excluded6 = ["item", "source"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -16,7 +15,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import { noop } from '@algolia/autocomplete-shared';
 import { onInput } from './onInput';
 import { onKeyDown as _onKeyDown } from './onKeyDown';
-import { getActiveItem, isOrContainsNode, isSamsung } from './utils';
+import { getActiveItem, getAutocompleteElementId, isOrContainsNode, isSamsung } from './utils';
 export function getPropGetters(_ref) {
   var props = _ref.props,
     refresh = _ref.refresh,
@@ -85,8 +84,11 @@ export function getPropGetters(_ref) {
       role: 'combobox',
       'aria-expanded': store.getState().isOpen,
       'aria-haspopup': 'listbox',
-      'aria-owns': store.getState().isOpen ? "".concat(props.id, "-list") : undefined,
-      'aria-labelledby': "".concat(props.id, "-label")
+      'aria-owns': store.getState().isOpen ? store.getState().collections.map(function (_ref2) {
+        var source = _ref2.source;
+        return getAutocompleteElementId(props.id, 'list', source);
+      }).join(' ') : undefined,
+      'aria-labelledby': getAutocompleteElementId(props.id, 'label')
     }, rest);
   };
   var getFormProps = function getFormProps(providedProps) {
@@ -136,22 +138,25 @@ export function getPropGetters(_ref) {
       }
       store.dispatch('focus', null);
     }
-    var _ref2 = providedProps || {},
-      inputElement = _ref2.inputElement,
-      _ref2$maxLength = _ref2.maxLength,
-      maxLength = _ref2$maxLength === void 0 ? 512 : _ref2$maxLength,
-      rest = _objectWithoutProperties(_ref2, _excluded4);
+    var _ref3 = providedProps || {},
+      inputElement = _ref3.inputElement,
+      _ref3$maxLength = _ref3.maxLength,
+      maxLength = _ref3$maxLength === void 0 ? 512 : _ref3$maxLength,
+      rest = _objectWithoutProperties(_ref3, _excluded4);
     var activeItem = getActiveItem(store.getState());
     var userAgent = ((_props$environment$na = props.environment.navigator) === null || _props$environment$na === void 0 ? void 0 : _props$environment$na.userAgent) || '';
     var shouldFallbackKeyHint = isSamsung(userAgent);
     var enterKeyHint = props.enterKeyHint || (activeItem !== null && activeItem !== void 0 && activeItem.itemUrl && !shouldFallbackKeyHint ? 'go' : 'search');
     return _objectSpread({
       'aria-autocomplete': 'both',
-      'aria-activedescendant': store.getState().isOpen && store.getState().activeItemId !== null ? "".concat(props.id, "-item-").concat(store.getState().activeItemId) : undefined,
-      'aria-controls': store.getState().isOpen ? "".concat(props.id, "-list") : undefined,
-      'aria-labelledby': "".concat(props.id, "-label"),
+      'aria-activedescendant': store.getState().isOpen && store.getState().activeItemId !== null ? getAutocompleteElementId(props.id, "item-".concat(store.getState().activeItemId), activeItem === null || activeItem === void 0 ? void 0 : activeItem.source) : undefined,
+      'aria-controls': store.getState().isOpen ? store.getState().collections.map(function (_ref4) {
+        var source = _ref4.source;
+        return getAutocompleteElementId(props.id, 'list', source);
+      }).join(' ') : undefined,
+      'aria-labelledby': getAutocompleteElementId(props.id, 'label'),
       value: store.getState().completion || store.getState().query,
-      id: "".concat(props.id, "-input"),
+      id: getAutocompleteElementId(props.id, 'input'),
       autoComplete: 'off',
       autoCorrect: 'off',
       autoCapitalize: 'off',
@@ -197,26 +202,20 @@ export function getPropGetters(_ref) {
       }
     }, rest);
   };
-  var getAutocompleteId = function getAutocompleteId(instanceId, sourceId) {
-    return typeof sourceId !== 'undefined' ? "".concat(instanceId, "-").concat(sourceId) : instanceId;
-  };
-  var getLabelProps = function getLabelProps(providedProps) {
-    var _ref3 = providedProps || {},
-      sourceIndex = _ref3.sourceIndex,
-      rest = _objectWithoutProperties(_ref3, _excluded5);
+  var getLabelProps = function getLabelProps(rest) {
     return _objectSpread({
-      htmlFor: "".concat(getAutocompleteId(props.id, sourceIndex), "-input"),
-      id: "".concat(getAutocompleteId(props.id, sourceIndex), "-label")
+      htmlFor: getAutocompleteElementId(props.id, 'input'),
+      id: getAutocompleteElementId(props.id, 'label')
     }, rest);
   };
   var getListProps = function getListProps(providedProps) {
-    var _ref4 = providedProps || {},
-      sourceIndex = _ref4.sourceIndex,
-      rest = _objectWithoutProperties(_ref4, _excluded6);
+    var _ref5 = providedProps || {},
+      source = _ref5.source,
+      rest = _objectWithoutProperties(_ref5, _excluded5);
     return _objectSpread({
       role: 'listbox',
-      'aria-labelledby': "".concat(getAutocompleteId(props.id, sourceIndex), "-label"),
-      id: "".concat(getAutocompleteId(props.id, sourceIndex), "-list")
+      'aria-labelledby': getAutocompleteElementId(props.id, 'label'),
+      id: getAutocompleteElementId(props.id, 'list', source)
     }, rest);
   };
   var getPanelProps = function getPanelProps(rest) {
@@ -235,10 +234,9 @@ export function getPropGetters(_ref) {
   var getItemProps = function getItemProps(providedProps) {
     var item = providedProps.item,
       source = providedProps.source,
-      sourceIndex = providedProps.sourceIndex,
-      rest = _objectWithoutProperties(providedProps, _excluded7);
+      rest = _objectWithoutProperties(providedProps, _excluded6);
     return _objectSpread({
-      id: "".concat(getAutocompleteId(props.id, sourceIndex), "-item-").concat(item.__autocomplete_id),
+      id: getAutocompleteElementId(props.id, "item-".concat(item.__autocomplete_id), source),
       role: 'option',
       'aria-selected': store.getState().activeItemId === item.__autocomplete_id,
       onMouseMove: function onMouseMove(event) {

package/dist/esm/onInput.js

@@ -28,7 +28,8 @@ export function onInput(_ref) {
     setIsOpen = setters.setIsOpen,
     setQuery = setters.setQuery,
     setActiveItemId = setters.setActiveItemId,
-    setStatus = setters.setStatus;
+    setStatus = setters.setStatus,
+    setContext = setters.setContext;
   setQuery(query);
   setActiveItemId(props.defaultActiveItemId);
   if (!query && props.openOnFocus === false) {
@@ -78,6 +79,20 @@ export function onInput(_ref) {
         return preResolve(itemsOrDescription, source.sourceId, store.getState());
       });
     })).then(resolve).then(function (responses) {
+      var __automaticInsights = responses.some(function (_ref2) {
+        var items = _ref2.items;
+        return isSearchResponseWithAutomaticInsightsFlag(items);
+      });
+
+      // No need to pollute the context if `__automaticInsights=false`
+      if (__automaticInsights) {
+        var _store$getState$conte;
+        setContext({
+          algoliaInsightsPlugin: _objectSpread(_objectSpread({}, ((_store$getState$conte = store.getState().context) === null || _store$getState$conte === void 0 ? void 0 : _store$getState$conte.algoliaInsightsPlugin) || {}), {}, {
+            __automaticInsights: __automaticInsights
+          })
+        });
+      }
       return postResolve(responses, sources, store);
     }).then(function (collections) {
       return reshape({
@@ -122,4 +137,7 @@ export function onInput(_ref) {
     }
   });
   return store.pendingRequests.add(request);
+}
+function isSearchResponseWithAutomaticInsightsFlag(items) {
+  return !Array.isArray(items) && Boolean(items === null || items === void 0 ? void 0 : items._automaticInsights);
 }

package/dist/esm/onKeyDown.js

@@ -8,7 +8,7 @@ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input ==
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { onInput } from './onInput';
-import { getActiveItem } from './utils';
+import { getActiveItem, getAutocompleteElementId } from './utils';
 export function onKeyDown(_ref) {
   var event = _ref.event,
     props = _ref.props,
@@ -18,7 +18,8 @@ export function onKeyDown(_ref) {
   if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
     // eslint-disable-next-line no-inner-declarations
     var triggerScrollIntoView = function triggerScrollIntoView() {
-      var nodeItem = props.environment.document.getElementById("".concat(props.id, "-item-").concat(store.getState().activeItemId));
+      var highlightedItem = getActiveItem(store.getState());
+      var nodeItem = props.environment.document.getElementById(getAutocompleteElementId(props.id, "item-".concat(store.getState().activeItemId), highlightedItem === null || highlightedItem === void 0 ? void 0 : highlightedItem.source));
       if (nodeItem) {
         if (nodeItem.scrollIntoViewIfNeeded) {
           nodeItem.scrollIntoViewIfNeeded(false);

package/dist/esm/resolve.d.ts

@@ -1,5 +1,6 @@
 import type { ExecuteResponse, RequesterDescription, TransformResponse } from '@algolia/autocomplete-preset-algolia';
-import { MultipleQueriesQuery, SearchForFacetValuesResponse, SearchResponse } from '@algolia/client-search';
+import type { SearchResponse } from '@algolia/autocomplete-shared';
+import { MultipleQueriesQuery, SearchForFacetValuesResponse } from '@algolia/client-search';
 import { AutocompleteState, AutocompleteStore, BaseItem, InternalAutocompleteSource } from './types';
 declare type RequestDescriptionPreResolved<TItem extends BaseItem> = Pick<RequesterDescription<TItem>, 'execute' | 'requesterId' | 'searchClient' | 'transformResponse'> & {
     requests: Array<{

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

@@ -2,17 +2,21 @@ export * from '@algolia/autocomplete-shared/dist/esm/core';
 export * from './AutocompleteStore';
 export * from './AutocompleteSubscribers';
 import { CreateAlgoliaInsightsPluginParams, AutocompleteInsightsApi as _AutocompleteInsightsApi, AlgoliaInsightsHit as _AlgoliaInsightsHit } from '@algolia/autocomplete-plugin-algolia-insights';
-import { AutocompleteOptions as _AutocompleteOptions, BaseItem } from '@algolia/autocomplete-shared/dist/esm/core';
+import { AutocompleteOptions as _AutocompleteOptions, InternalAutocompleteOptions as _InternalAutocompleteOptions, BaseItem } from '@algolia/autocomplete-shared/dist/esm/core';
 export declare type AutocompleteInsightsApi = _AutocompleteInsightsApi;
 export declare type AlgoliaInsightsHit = _AlgoliaInsightsHit;
-export interface AutocompleteOptions<TItem extends BaseItem> extends _AutocompleteOptions<TItem> {
+declare type InsightsOption = {
     /**
      * Whether to enable the Insights plugin and load the Insights library if it has not been loaded yet.
      *
      * See [**autocomplete-plugin-algolia-insights**](https://www.algolia.com/doc/ui-libraries/autocomplete/api-reference/autocomplete-plugin-algolia-insights/) for more information.
      *
-     * @default false
+     * @default undefined
      * @link https://www.algolia.com/doc/ui-libraries/autocomplete/api-reference/autocomplete-js/autocomplete/#param-insights
      */
-    insights?: CreateAlgoliaInsightsPluginParams | boolean;
+    insights?: CreateAlgoliaInsightsPluginParams | boolean | undefined;
+};
+export interface AutocompleteOptions<TItem extends BaseItem> extends _AutocompleteOptions<TItem>, InsightsOption {
+}
+export interface InternalAutocompleteOptions<TItem extends BaseItem> extends _InternalAutocompleteOptions<TItem>, InsightsOption {
 }

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

@@ -0,0 +1,9 @@
+import type { InternalAutocompleteSource } from '../types';
+/**
+ * Returns a full element id for an autocomplete element.
+ *
+ * @param autocompleteInstanceId The id of the autocomplete instance
+ * @param elementId The specific element id
+ * @param source The source of the element, when it needs to be scoped
+ */
+export declare function getAutocompleteElementId(autocompleteInstanceId: string, elementId: string, source?: InternalAutocompleteSource<any>): string;

package/dist/esm/utils/getAutocompleteElementId.js

@@ -0,0 +1,10 @@
+/**
+ * Returns a full element id for an autocomplete element.
+ *
+ * @param autocompleteInstanceId The id of the autocomplete instance
+ * @param elementId The specific element id
+ * @param source The source of the element, when it needs to be scoped
+ */
+export function getAutocompleteElementId(autocompleteInstanceId, elementId, source) {
+  return [autocompleteInstanceId, source === null || source === void 0 ? void 0 : source.sourceId, elementId].filter(Boolean).join('-').replace(/\s/g, '');
+}

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

@@ -4,6 +4,7 @@ export * from './createConcurrentSafePromise';
 export * from './getNextActiveItemId';
 export * from './getNormalizedSources';
 export * from './getActiveItem';
+export * from './getAutocompleteElementId';
 export * from './isOrContainsNode';
 export * from './isSamsung';
 export * from './mapToAlgoliaResponse';

package/dist/esm/utils/index.js

@@ -4,6 +4,7 @@ export * from './createConcurrentSafePromise';
 export * from './getNextActiveItemId';
 export * from './getNormalizedSources';
 export * from './getActiveItem';
+export * from './getAutocompleteElementId';
 export * from './isOrContainsNode';
 export * from './isSamsung';
 export * from './mapToAlgoliaResponse';

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

@@ -1,4 +1,5 @@
-import type { SearchForFacetValuesResponse, SearchResponse } from '@algolia/client-search';
+import type { SearchResponse } from '@algolia/autocomplete-shared';
+import type { SearchForFacetValuesResponse } from '@algolia/client-search';
 export declare function mapToAlgoliaResponse<THit>(rawResults: Array<SearchResponse<THit> | SearchForFacetValuesResponse>): {
     results: (SearchResponse<THit> | SearchForFacetValuesResponse)[];
     hits: import("@algolia/client-search").Hit<THit>[][];