instantsearch.js 4.54.0 → 4.55.0

package/es/middlewares/createInsightsMiddleware.js

@@ -6,37 +6,71 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _ty
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-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 _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 _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+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."); }
+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" && 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; }
 import { getInsightsAnonymousUserTokenInternal } from "../helpers/index.js";
-import { warning, noop, getAppIdAndApiKey, find } from "../lib/utils/index.js";
-export function createInsightsMiddleware(props) {
-  var _ref = props || {},
-    _insightsClient = _ref.insightsClient,
-    insightsInitParams = _ref.insightsInitParams,
-    onEvent = _ref.onEvent;
-  if (_insightsClient !== null && !_insightsClient) {
-    if (process.env.NODE_ENV === 'development') {
-      throw new Error("The `insightsClient` option is required if you want userToken to be automatically set in search calls. If you don't want this behaviour, set it to `null`.");
-    } else {
-      throw new Error('The `insightsClient` option is required. To disable, set it to `null`.');
-    }
+import { warning, noop, getAppIdAndApiKey, find, safelyRunOnBrowser } from "../lib/utils/index.js";
+var ALGOLIA_INSIGHTS_VERSION = '2.6.0';
+var ALGOLIA_INSIGHTS_SRC = "https://cdn.jsdelivr.net/npm/search-insights@".concat(ALGOLIA_INSIGHTS_VERSION, "/dist/search-insights.min.js");
+export function createInsightsMiddleware() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var _insightsClient = props.insightsClient,
+    insightsInitParams = props.insightsInitParams,
+    onEvent = props.onEvent,
+    _props$$$internal = props.$$internal,
+    $$internal = _props$$$internal === void 0 ? false : _props$$$internal;
+  var potentialInsightsClient = _insightsClient;
+  if (!_insightsClient && _insightsClient !== null) {
+    safelyRunOnBrowser(function (_ref) {
+      var window = _ref.window;
+      var pointer = window.AlgoliaAnalyticsObject || 'aa';
+      if (typeof pointer === 'string') {
+        potentialInsightsClient = window[pointer];
+      }
+      if (!potentialInsightsClient) {
+        window.AlgoliaAnalyticsObject = pointer;
+        if (!window[pointer]) {
+          window[pointer] = function () {
+            if (!window[pointer].queue) {
+              window[pointer].queue = [];
+            }
+            for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+              args[_key] = arguments[_key];
+            }
+            window[pointer].queue.push(args);
+          };
+          window[pointer].version = ALGOLIA_INSIGHTS_VERSION;
+          window[pointer].shouldAddScript = true;
+        }
+        potentialInsightsClient = window[pointer];
+      }
+    });
   }
-  var hasInsightsClient = Boolean(_insightsClient);
-  var insightsClient = _insightsClient === null ? noop : _insightsClient;
+  // if still no insightsClient was found, we use a noop
+  var insightsClient = potentialInsightsClient || noop;
   return function (_ref2) {
     var instantSearchInstance = _ref2.instantSearchInstance;
+    // remove existing default insights middleware
+    // user-provided insights middleware takes precedence
+    var existingInsightsMiddlewares = instantSearchInstance.middleware.filter(function (m) {
+      return m.instance.$$type === 'ais.insights' && m.instance.$$internal;
+    }).map(function (m) {
+      return m.creator;
+    });
+    instantSearchInstance.unuse.apply(instantSearchInstance, _toConsumableArray(existingInsightsMiddlewares));
     var _getAppIdAndApiKey = getAppIdAndApiKey(instantSearchInstance.client),
       _getAppIdAndApiKey2 = _slicedToArray(_getAppIdAndApiKey, 2),
       appId = _getAppIdAndApiKey2[0],
       apiKey = _getAppIdAndApiKey2[1];
 
     // search-insights.js also throws an error so dev-only clarification is sufficient
-    if (process.env.NODE_ENV === 'development' && !(appId && apiKey)) {
-      throw new Error('[insights middleware]: could not extract Algolia credentials from searchClient');
-    }
+    process.env.NODE_ENV === 'development' ? warning(Boolean(appId && apiKey), 'could not extract Algolia credentials from searchClient in insights middleware.') : void 0;
     var queuedUserToken = undefined;
     var userTokenBeforeInit = undefined;
     if (Array.isArray(insightsClient.queue)) {
@@ -66,15 +100,39 @@ export function createInsightsMiddleware(props) {
       // Otherwise, the `init` call might override it with anonymous user token.
       userTokenBeforeInit = userToken;
     });
-    insightsClient('init', _objectSpread({
-      appId: appId,
-      apiKey: apiKey
-    }, insightsInitParams));
+
+    // Only `init` if the `insightsInitParams` option is passed or
+    // if the `insightsClient` version doesn't supports optional `init` calling.
+    if (insightsInitParams || !isModernInsightsClient(insightsClient)) {
+      insightsClient('init', _objectSpread({
+        appId: appId,
+        apiKey: apiKey,
+        partial: true
+      }, insightsInitParams));
+    }
     var initialParameters;
     var helper;
     return {
+      $$type: 'ais.insights',
+      $$internal: $$internal,
       onStateChange: function onStateChange() {},
-      subscribe: function subscribe() {},
+      subscribe: function subscribe() {
+        if (!insightsClient.shouldAddScript) return;
+        var errorMessage = '[insights middleware]: could not load search-insights.js. Please load it manually following https://alg.li/insights-init';
+        try {
+          var script = document.createElement('script');
+          script.async = true;
+          script.src = ALGOLIA_INSIGHTS_SRC;
+          script.onerror = function () {
+            instantSearchInstance.emit('error', new Error(errorMessage));
+          };
+          document.body.appendChild(script);
+          insightsClient.shouldAddScript = false;
+        } catch (cause) {
+          insightsClient.shouldAddScript = false;
+          instantSearchInstance.emit('error', new Error(errorMessage));
+        }
+      },
       started: function started() {
         insightsClient('addAlgoliaAgent', 'insights-middleware');
         helper = instantSearchInstance.helper;
@@ -85,15 +143,23 @@ export function createInsightsMiddleware(props) {
         helper.overrideStateWithoutTriggeringChangeEvent(_objectSpread(_objectSpread({}, helper.state), {}, {
           clickAnalytics: true
         }));
-        instantSearchInstance.scheduleSearch();
+        if (!$$internal) {
+          instantSearchInstance.scheduleSearch();
+        }
         var setUserTokenToSearch = function setUserTokenToSearch(userToken) {
+          if (!userToken) {
+            return;
+          }
+          var existingToken = helper.state.userToken;
           helper.overrideStateWithoutTriggeringChangeEvent(_objectSpread(_objectSpread({}, helper.state), {}, {
             userToken: userToken
           }));
-          instantSearchInstance.scheduleSearch();
+          if (existingToken && existingToken !== userToken) {
+            instantSearchInstance.scheduleSearch();
+          }
         };
         var anonymousUserToken = getInsightsAnonymousUserTokenInternal();
-        if (hasInsightsClient && anonymousUserToken) {
+        if (anonymousUserToken) {
           // When `aa('init', { ... })` is called, it creates an anonymous user token in cookie.
           // We can set it as userToken.
           setUserTokenToSearch(anonymousUserToken);
@@ -102,8 +168,10 @@ export function createInsightsMiddleware(props) {
         // We consider the `userToken` coming from a `init` call to have a higher
         // importance than the one coming from the queue.
         if (userTokenBeforeInit) {
+          setUserTokenToSearch(userTokenBeforeInit);
           insightsClient('setUserToken', userTokenBeforeInit);
         } else if (queuedUserToken) {
+          setUserTokenToSearch(queuedUserToken);
           insightsClient('setUserToken', queuedUserToken);
         }
 
@@ -111,16 +179,31 @@ export function createInsightsMiddleware(props) {
         insightsClient('onUserTokenChange', setUserTokenToSearch, {
           immediate: true
         });
+        var insightsClientWithLocalCredentials = insightsClient;
+        if (isModernInsightsClient(insightsClient)) {
+          insightsClientWithLocalCredentials = function insightsClientWithLocalCredentials(method, payload) {
+            var extraParams = {
+              headers: {
+                'X-Algolia-Application-Id': appId,
+                'X-Algolia-API-Key': apiKey
+              }
+            };
+
+            // @ts-ignore we are calling this only when we know that the client actually is correct
+            return insightsClient(method, payload, extraParams);
+          };
+        }
         instantSearchInstance.sendEventToInsights = function (event) {
           if (onEvent) {
-            onEvent(event, _insightsClient);
+            onEvent(event, insightsClientWithLocalCredentials);
           } else if (event.insightsMethod) {
-            var hasUserToken = Boolean(helper.state.userToken);
-            if (hasUserToken) {
-              insightsClient(event.insightsMethod, event.payload);
-            } else {
-              process.env.NODE_ENV === 'development' ? warning(false, "\nCannot send event to Algolia Insights because `userToken` is not set.\n\nSee documentation: https://www.algolia.com/doc/guides/building-search-ui/going-further/send-insights-events/js/#setting-the-usertoken\n") : void 0;
+            // Source is used to differentiate events sent by instantsearch from those sent manually.
+            event.payload.algoliaSource = ['instantsearch'];
+            if (event.eventModifier === 'internal') {
+              event.payload.algoliaSource.push('instantsearch-internal');
             }
+            insightsClientWithLocalCredentials(event.insightsMethod, event.payload);
+            process.env.NODE_ENV === 'development' ? warning(Boolean(helper.state.userToken), "\nCannot send event to Algolia Insights because `userToken` is not set.\n\nSee documentation: https://www.algolia.com/doc/guides/building-search-ui/going-further/send-insights-events/js/#setting-the-usertoken\n") : void 0;
           } else {
             process.env.NODE_ENV === 'development' ? warning(false, 'Cannot send event to Algolia Insights because `insightsMethod` option is missing.') : void 0;
           }
@@ -130,10 +213,29 @@ export function createInsightsMiddleware(props) {
         insightsClient('onUserTokenChange', undefined);
         instantSearchInstance.sendEventToInsights = noop;
         if (helper && initialParameters) {
-          helper.setState(_objectSpread(_objectSpread({}, helper.state), initialParameters));
+          helper.overrideStateWithoutTriggeringChangeEvent(_objectSpread(_objectSpread({}, helper.state), initialParameters));
           instantSearchInstance.scheduleSearch();
         }
       }
     };
   };
+}
+
+/**
+ * Determines if a given insights `client` supports the optional call to `init`
+ * and the ability to set credentials via extra parameters when sending events.
+ */
+function isModernInsightsClient(client) {
+  var _split$map = (client.version || '').split('.').map(Number),
+    _split$map2 = _slicedToArray(_split$map, 2),
+    major = _split$map2[0],
+    minor = _split$map2[1];
+
+  /* eslint-disable @typescript-eslint/naming-convention */
+  var v3 = major >= 3;
+  var v2_6 = major === 2 && minor >= 6;
+  var v1_10 = major === 1 && minor >= 10;
+  /* eslint-enable @typescript-eslint/naming-convention */
+
+  return v3 || v2_6 || v1_10;
 }

package/es/middlewares/createMetadataMiddleware.d.ts

@@ -7,4 +7,6 @@ export declare function isMetadataEnabled(): boolean;
  * - widget name
  * - connector name
  */
-export declare function createMetadataMiddleware(): InternalMiddleware;
+export declare function createMetadataMiddleware({ $$internal, }?: {
+    $$internal?: boolean;
+}): InternalMiddleware;

package/es/middlewares/createMetadataMiddleware.js

@@ -1,5 +1,5 @@
 import { createInitArgs, safelyRunOnBrowser } from "../lib/utils/index.js";
-function extractPayload(widgets, instantSearchInstance, payload) {
+function extractWidgetPayload(widgets, instantSearchInstance, payload) {
   var initOptions = createInitArgs(instantSearchInstance, instantSearchInstance.mainIndex, instantSearchInstance._initialUiState);
   widgets.forEach(function (widget) {
     var widgetParams = {};
@@ -21,7 +21,7 @@ function extractPayload(widgets, instantSearchInstance, payload) {
       params: params
     });
     if (widget.$$type === 'ais.index') {
-      extractPayload(widget.getWidgets(), instantSearchInstance, payload);
+      extractWidgetPayload(widget.getWidgets(), instantSearchInstance, payload);
     }
   });
 }
@@ -45,8 +45,11 @@ export function isMetadataEnabled() {
  * - connector name
  */
 export function createMetadataMiddleware() {
-  return function (_ref2) {
-    var instantSearchInstance = _ref2.instantSearchInstance;
+  var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    _ref2$$$internal = _ref2.$$internal,
+    $$internal = _ref2$$$internal === void 0 ? false : _ref2$$$internal;
+  return function (_ref3) {
+    var instantSearchInstance = _ref3.instantSearchInstance;
     var payload = {
       widgets: []
     };
@@ -54,13 +57,22 @@ export function createMetadataMiddleware() {
     var refNode = document.querySelector('head');
     payloadContainer.name = 'instantsearch:widgets';
     return {
+      $$type: 'ais.metadata',
+      $$internal: $$internal,
       onStateChange: function onStateChange() {},
       subscribe: function subscribe() {
         // using setTimeout here to delay extraction until widgets have been added in a tick (e.g. Vue)
         setTimeout(function () {
           var client = instantSearchInstance.client;
           payload.ua = client.transporter && client.transporter.userAgent ? client.transporter.userAgent.value : client._ua;
-          extractPayload(instantSearchInstance.mainIndex.getWidgets(), instantSearchInstance, payload);
+          extractWidgetPayload(instantSearchInstance.mainIndex.getWidgets(), instantSearchInstance, payload);
+          instantSearchInstance.middleware.forEach(function (middleware) {
+            return payload.widgets.push({
+              middleware: true,
+              type: middleware.instance.$$type,
+              internal: middleware.instance.$$internal
+            });
+          });
           payloadContainer.content = JSON.stringify(payload);
           refNode.appendChild(payloadContainer);
         }, 0);

package/es/middlewares/createRouterMiddleware.js

@@ -12,7 +12,9 @@ export var createRouterMiddleware = function createRouterMiddleware() {
   var _props$router = props.router,
     router = _props$router === void 0 ? historyRouter() : _props$router,
     _props$stateMapping = props.stateMapping,
-    stateMapping = _props$stateMapping === void 0 ? simpleStateMapping() : _props$stateMapping;
+    stateMapping = _props$stateMapping === void 0 ? simpleStateMapping() : _props$stateMapping,
+    _props$$$internal = props.$$internal,
+    $$internal = _props$$$internal === void 0 ? false : _props$$$internal;
   return function (_ref) {
     var instantSearchInstance = _ref.instantSearchInstance;
     function topLevelCreateURL(nextState) {
@@ -29,6 +31,8 @@ export var createRouterMiddleware = function createRouterMiddleware() {
     var lastRouteState = undefined;
     var initialUiState = instantSearchInstance._initialUiState;
     return {
+      $$type: "ais.router({router:".concat(router.$$type || '__unknown__', ", stateMapping:").concat(stateMapping.$$type || '__unknown__', "})"),
+      $$internal: $$internal,
       onStateChange: function onStateChange(_ref2) {
         var uiState = _ref2.uiState;
         var routeState = stateMapping.stateToRoute(uiState);

package/es/types/insights.d.ts

@@ -1,6 +1,24 @@
-import type { InsightsMethodMap, InsightsClient as _InsightsClient } from 'search-insights';
+import type { Hit } from './results';
+import type { InsightsMethodMap as _InsightsMethodMap, InsightsClient as _InsightsClient } from 'search-insights';
 export type { Init as InsightsInit, AddAlgoliaAgent as InsightsAddAlgoliaAgent, SetUserToken as InsightsSetUserToken, GetUserToken as InsightsGetUserToken, OnUserTokenChange as InsightsOnUserTokenChange, } from 'search-insights';
+export type InsightsMethodMap = _InsightsMethodMap;
 export type InsightsClientMethod = keyof InsightsMethodMap;
+/**
+ * Method allowed by the insights middleware.
+ */
+export type InsightsMethod = 'clickedObjectIDsAfterSearch' | 'clickedObjectIDs' | 'clickedFilters' | 'convertedObjectIDsAfterSearch' | 'convertedObjectIDs' | 'convertedFilters' | 'viewedObjectIDs' | 'viewedFilters';
+/**
+ * The event sent to the insights middleware.
+ */
+export type InsightsEvent<TMethod extends InsightsMethod = InsightsMethod> = {
+    insightsMethod?: TMethod;
+    payload: InsightsMethodMap[TMethod][0];
+    widgetType: string;
+    eventType: string;
+    eventModifier?: string;
+    hits?: Hit[];
+    attribute?: string;
+};
 export type InsightsClientPayload = {
     eventName: string;
     queryID: string;

package/es/types/middleware.d.ts

@@ -2,11 +2,27 @@ import type InstantSearch from '../lib/InstantSearch';
 import type { UiState } from './ui-state';
 import type { AtLeastOne } from './utils';
 export type MiddlewareDefinition<TUiState extends UiState = UiState> = {
+    /**
+     * string to identify the middleware
+     */
+    $$type: string;
+    /**
+     * Change handler called on every UiState change
+     */
     onStateChange(options: {
         uiState: TUiState;
     }): void;
+    /**
+     * Called when the middleware is added to InstantSearch
+     */
     subscribe(): void;
+    /**
+     * Called when InstantSearch is started
+     */
     started(): void;
+    /**
+     * Called when the middleware is removed from InstantSearch
+     */
     unsubscribe(): void;
 };
 export type MiddlewareOptions = {

package/es/types/router.d.ts

@@ -34,6 +34,10 @@ export type Router<TRouteState = UiState> = {
      * Called when InstantSearch is started.
      */
     start?: () => void;
+    /**
+     * Identifier for this router. Used to differentiate between routers.
+     */
+    $$type?: string;
 };
 /**
  * The state mapping is a way to customize the structure before sending it to the router.
@@ -55,4 +59,8 @@ export type StateMapping<TUiState = UiState, TRouteState = TUiState> = {
      * The format is the output of `stateToRoute`.
      */
     routeToState(routeState: TRouteState): TUiState;
+    /**
+     * Identifier for this stateMapping. Used to differentiate between stateMappings.
+     */
+    $$type?: string;
 };

package/es/widgets/hits/hits.js

@@ -8,7 +8,7 @@ import { cx } from '@algolia/ui-components-shared';
 import { h, render } from 'preact';
 import Hits from "../../components/Hits/Hits.js";
 import connectHits from "../../connectors/hits/connectHits.js";
-import { withInsights, withInsightsListener } from "../../lib/insights/index.js";
+import { withInsights } from "../../lib/insights/index.js";
 import { component } from "../../lib/suit.js";
 import { prepareTemplateProps } from "../../lib/templating/index.js";
 import { getContainerNode, createDocumentationMessageGenerator } from "../../lib/utils/index.js";
@@ -17,7 +17,6 @@ var withUsage = createDocumentationMessageGenerator({
   name: 'hits'
 });
 var suit = component('Hits');
-var HitsWithInsightsListener = withInsightsListener(Hits);
 var renderer = function renderer(_ref) {
   var renderState = _ref.renderState,
     cssClasses = _ref.cssClasses,
@@ -38,7 +37,7 @@ var renderer = function renderer(_ref) {
       });
       return;
     }
-    render(h(HitsWithInsightsListener, {
+    render(h(Hits, {
       cssClasses: cssClasses,
       hits: receivedHits,
       results: results,

package/es/widgets/infinite-hits/infinite-hits.js

@@ -8,7 +8,7 @@ import { cx } from '@algolia/ui-components-shared';
 import { h, render } from 'preact';
 import InfiniteHits from "../../components/InfiniteHits/InfiniteHits.js";
 import connectInfiniteHits from "../../connectors/infinite-hits/connectInfiniteHits.js";
-import { withInsights, withInsightsListener } from "../../lib/insights/index.js";
+import { withInsights } from "../../lib/insights/index.js";
 import { component } from "../../lib/suit.js";
 import { prepareTemplateProps } from "../../lib/templating/index.js";
 import { getContainerNode, createDocumentationMessageGenerator } from "../../lib/utils/index.js";
@@ -17,7 +17,6 @@ var withUsage = createDocumentationMessageGenerator({
   name: 'infinite-hits'
 });
 var suit = component('InfiniteHits');
-var InfiniteHitsWithInsightsListener = withInsightsListener(InfiniteHits);
 var renderer = function renderer(_ref) {
   var containerNode = _ref.containerNode,
     cssClasses = _ref.cssClasses,
@@ -43,7 +42,7 @@ var renderer = function renderer(_ref) {
       });
       return;
     }
-    render(h(InfiniteHitsWithInsightsListener, {
+    render(h(InfiniteHits, {
       cssClasses: cssClasses,
       hits: hits,
       results: results,

package/es/widgets/pagination/pagination.d.ts

@@ -1,6 +1,6 @@
 
 import type { PaginationConnectorParams, PaginationWidgetDescription } from '../../connectors/pagination/connectPagination';
-import type { WidgetFactory } from '../../types';
+import type { Template, WidgetFactory } from '../../types';
 export type PaginationCSSClasses = Partial<{
     /**
      * CSS classes added to the root element of the widget.
@@ -55,19 +55,26 @@ export type PaginationTemplates = Partial<{
     /**
      * Label for the Previous link.
      */
-    previous: string;
+    previous: Template;
     /**
      * Label for the Next link.
      */
-    next: string;
+    next: Template;
+    /**
+     * Label for the link of a certain page
+     * Page is one-based, so `page` will be `1` for the first page.
+     */
+    page: Template<{
+        page: number;
+    }>;
     /**
      * Label for the First link.
      */
-    first: string;
+    first: Template;
     /**
      * Label for the Last link.
      */
-    last: string;
+    last: Template;
 }>;
 export type PaginationWidgetParams = {
     /**

package/es/widgets/pagination/pagination.js

@@ -15,28 +15,40 @@ var withUsage = createDocumentationMessageGenerator({
   name: 'pagination'
 });
 var defaultTemplates = {
-  previous: '‹',
-  next: '›',
-  first: '«',
-  last: '»'
+  previous: function previous() {
+    return '‹';
+  },
+  next: function next() {
+    return '›';
+  },
+  page: function page(_ref) {
+    var _page = _ref.page;
+    return "".concat(_page);
+  },
+  first: function first() {
+    return '«';
+  },
+  last: function last() {
+    return '»';
+  }
 };
-var renderer = function renderer(_ref) {
-  var containerNode = _ref.containerNode,
-    cssClasses = _ref.cssClasses,
-    templates = _ref.templates,
-    showFirst = _ref.showFirst,
-    showLast = _ref.showLast,
-    showPrevious = _ref.showPrevious,
-    showNext = _ref.showNext,
-    scrollToNode = _ref.scrollToNode;
-  return function (_ref2, isFirstRendering) {
-    var createURL = _ref2.createURL,
-      currentRefinement = _ref2.currentRefinement,
-      nbPages = _ref2.nbPages,
-      pages = _ref2.pages,
-      isFirstPage = _ref2.isFirstPage,
-      isLastPage = _ref2.isLastPage,
-      refine = _ref2.refine;
+var renderer = function renderer(_ref2) {
+  var containerNode = _ref2.containerNode,
+    cssClasses = _ref2.cssClasses,
+    templates = _ref2.templates,
+    showFirst = _ref2.showFirst,
+    showLast = _ref2.showLast,
+    showPrevious = _ref2.showPrevious,
+    showNext = _ref2.showNext,
+    scrollToNode = _ref2.scrollToNode;
+  return function (_ref3, isFirstRendering) {
+    var createURL = _ref3.createURL,
+      currentRefinement = _ref3.currentRefinement,
+      nbPages = _ref3.nbPages,
+      pages = _ref3.pages,
+      isFirstPage = _ref3.isFirstPage,
+      isLastPage = _ref3.isLastPage,
+      refine = _ref3.refine;
     if (isFirstRendering) return;
     var setCurrentPage = function setCurrentPage(pageNumber) {
       refine(pageNumber);
@@ -62,24 +74,24 @@ var renderer = function renderer(_ref) {
   };
 };
 var pagination = function pagination(widgetParams) {
-  var _ref3 = widgetParams || {},
-    container = _ref3.container,
-    _ref3$templates = _ref3.templates,
-    userTemplates = _ref3$templates === void 0 ? {} : _ref3$templates,
-    _ref3$cssClasses = _ref3.cssClasses,
-    userCssClasses = _ref3$cssClasses === void 0 ? {} : _ref3$cssClasses,
-    totalPages = _ref3.totalPages,
-    padding = _ref3.padding,
-    _ref3$showFirst = _ref3.showFirst,
-    showFirst = _ref3$showFirst === void 0 ? true : _ref3$showFirst,
-    _ref3$showLast = _ref3.showLast,
-    showLast = _ref3$showLast === void 0 ? true : _ref3$showLast,
-    _ref3$showPrevious = _ref3.showPrevious,
-    showPrevious = _ref3$showPrevious === void 0 ? true : _ref3$showPrevious,
-    _ref3$showNext = _ref3.showNext,
-    showNext = _ref3$showNext === void 0 ? true : _ref3$showNext,
-    _ref3$scrollTo = _ref3.scrollTo,
-    userScrollTo = _ref3$scrollTo === void 0 ? 'body' : _ref3$scrollTo;
+  var _ref4 = widgetParams || {},
+    container = _ref4.container,
+    _ref4$templates = _ref4.templates,
+    userTemplates = _ref4$templates === void 0 ? {} : _ref4$templates,
+    _ref4$cssClasses = _ref4.cssClasses,
+    userCssClasses = _ref4$cssClasses === void 0 ? {} : _ref4$cssClasses,
+    totalPages = _ref4.totalPages,
+    padding = _ref4.padding,
+    _ref4$showFirst = _ref4.showFirst,
+    showFirst = _ref4$showFirst === void 0 ? true : _ref4$showFirst,
+    _ref4$showLast = _ref4.showLast,
+    showLast = _ref4$showLast === void 0 ? true : _ref4$showLast,
+    _ref4$showPrevious = _ref4.showPrevious,
+    showPrevious = _ref4$showPrevious === void 0 ? true : _ref4$showPrevious,
+    _ref4$showNext = _ref4.showNext,
+    showNext = _ref4$showNext === void 0 ? true : _ref4$showNext,
+    _ref4$scrollTo = _ref4.scrollTo,
+    userScrollTo = _ref4$scrollTo === void 0 ? 'body' : _ref4$scrollTo;
   if (!container) {
     throw new Error(withUsage('The `container` option is required.'));
   }

package/es/widgets/panel/panel.js

@@ -90,8 +90,6 @@ var panel = function panel(panelWidgetParams) {
       }
       var containerNode = getContainerNode(widgetParams.container);
       var defaultTemplates = {
-        header: '',
-        footer: '',
         collapseButtonText: function collapseButtonText(_ref4) {
           var isCollapsed = _ref4.collapsed;
           return "<svg\n          class=\"".concat(cssClasses.collapseIcon, "\"\n          style=\"width: 1em; height: 1em;\"\n          viewBox=\"0 0 500 500\"\n        >\n        <path d=\"").concat(isCollapsed ? 'M100 250l300-150v300z' : 'M250 400l150-300H100z', "\" fill=\"currentColor\" />\n        </svg>");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "instantsearch.js",
-  "version": "4.54.0",
+  "version": "4.55.0",
   "description": "InstantSearch.js is a JavaScript library for building performant and instant search experiences with Algolia.",
   "homepage": "https://www.algolia.com/doc/guides/building-search-ui/what-is-instantsearch/js/",
   "types": "es/index.d.ts",
@@ -38,7 +38,7 @@
     "htm": "^3.0.0",
     "preact": "^10.10.0",
     "qs": "^6.5.1 < 6.10",
-    "search-insights": "^2.1.0"
+    "search-insights": "^2.6.0"
   },
   "peerDependencies": {
     "algoliasearch": ">= 3.1 < 6"
@@ -55,9 +55,9 @@
     "version": "./scripts/version/update-version.js"
   },
   "devDependencies": {
-    "@instantsearch/mocks": "1.10.0",
-    "@instantsearch/tests": "1.10.0",
-    "@instantsearch/testutils": "1.0.13",
+    "@instantsearch/mocks": "1.12.0",
+    "@instantsearch/tests": "1.12.0",
+    "@instantsearch/testutils": "1.1.0",
     "@storybook/html": "5.3.9",
     "@types/scriptjs": "0.0.2",
     "algoliasearch": "4.14.3",
@@ -65,5 +65,5 @@
     "scriptjs": "2.5.9",
     "webpack": "4.41.5"
   },
-  "gitHead": "419aa9869727dceeb49dfc5289a0b9241e0e5827"
+  "gitHead": "c483ae31e1e615be61dffb5d0bc04a4927960a67"
 }