instantsearch-ui-components 0.13.0 → 0.15.0

package/dist/cjs/components/autocomplete/AutocompleteRecentSearch.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createAutocompleteRecentSearchComponent = createAutocompleteRecentSearchComponent;
+var _lib = require("../../lib");
+var _icons = require("./icons");
+function createAutocompleteRecentSearchComponent(_ref) {
+  var createElement = _ref.createElement;
+  return function AutocompleteRecentSearch(_ref2) {
+    var item = _ref2.item,
+      children = _ref2.children,
+      onSelect = _ref2.onSelect,
+      onRemoveRecentSearch = _ref2.onRemoveRecentSearch,
+      _ref2$classNames = _ref2.classNames,
+      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
+    return createElement("div", {
+      onClick: onSelect,
+      className: (0, _lib.cx)('ais-AutocompleteItemWrapper ais-AutocompleteRecentSearchWrapper', classNames.root)
+    }, createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemContent', 'ais-AutocompleteRecentSearchItemContent', classNames.content)
+    }, createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemIcon', 'ais-AutocompleteRecentSearchItemIcon', classNames.content)
+    }, createElement(_icons.AutocompleteClockIcon, {
+      createElement: createElement
+    })), createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemContentBody', 'ais-AutocompleteRecentSearchItemContentBody', classNames.content)
+    }, children)), createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemActions', 'ais-AutocompleteRecentSearchItemActions', classNames.actions)
+    }, createElement("button", {
+      className: (0, _lib.cx)('ais-AutocompleteItemActionButton', 'ais-AutocompleteRecentSearchItemDeleteButton', classNames.deleteButton),
+      title: "Remove ".concat(item.query, " from recent searches"),
+      onClick: function onClick(evt) {
+        evt.stopPropagation();
+        onRemoveRecentSearch();
+      }
+    }, createElement(_icons.AutocompleteTrashIcon, {
+      createElement: createElement
+    }))));
+  };
+}

package/dist/cjs/components/autocomplete/AutocompleteSearch.js

@@ -14,6 +14,7 @@ function createAutocompleteSearchComponent(_ref) {
       onClear = _ref2.onClear,
       query = _ref2.query,
       isSearchStalled = _ref2.isSearchStalled;
+    var inputRef = inputProps.ref;
     return createElement("form", {
       className: "ais-AutocompleteForm",
       action: "",
@@ -21,6 +22,10 @@ function createAutocompleteSearchComponent(_ref) {
       role: "search",
       onSubmit: function onSubmit(e) {
         return e.preventDefault();
+      },
+      onReset: function onReset() {
+        var _inputRef$current;
+        return (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
       }
     }, createElement("div", {
       className: "ais-AutocompleteInputWrapperPrefix"

package/dist/cjs/components/autocomplete/AutocompleteSuggestion.js

@@ -5,16 +5,25 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createAutocompleteSuggestionComponent = createAutocompleteSuggestionComponent;
 var _lib = require("../../lib");
+var _icons = require("./icons");
 function createAutocompleteSuggestionComponent(_ref) {
   var createElement = _ref.createElement;
   return function AutocompleteSuggestion(_ref2) {
-    var item = _ref2.item,
+    var children = _ref2.children,
       onSelect = _ref2.onSelect,
       _ref2$classNames = _ref2.classNames,
       classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
     return createElement("div", {
       onClick: onSelect,
-      className: (0, _lib.cx)('ais-AutocompleteSuggestion', classNames.root)
-    }, item.query);
+      className: (0, _lib.cx)('ais-AutocompleteItemWrapper', 'ais-AutocompleteSuggestionWrapper', classNames.root)
+    }, createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemContent', 'ais-AutocompleteSuggestionItemContent', classNames.content)
+    }, createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemIcon', 'ais-AutocompleteSuggestionItemIcon', classNames.content)
+    }, createElement(_icons.AutocompleteSubmitIcon, {
+      createElement: createElement
+    })), createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemContentBody', 'ais-AutocompleteSuggestionItemContentBody', classNames.content)
+    }, children)));
   };
 }

package/dist/cjs/components/autocomplete/createAutocompletePropGetters.js

@@ -19,6 +19,7 @@ function createAutocompletePropGetters(_ref) {
       onRefine = _ref2.onRefine,
       globalOnSelect = _ref2.onSelect;
     var getElementId = createGetElementId(useId());
+    var inputRef = useRef(null);
     var rootRef = useRef(null);
     var _useState = useState(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -50,7 +51,7 @@ function createAutocompletePropGetters(_ref) {
         document.body.removeEventListener('click', onBodyClick);
       };
     }, [rootRef]);
-    var getNextActiveDescendent = function getNextActiveDescendent(key) {
+    var getNextActiveDescendant = function getNextActiveDescendant(key) {
       switch (key) {
         case 'ArrowLeft':
         case 'ArrowUp':
@@ -69,11 +70,21 @@ function createAutocompletePropGetters(_ref) {
       }
     };
     var submit = function submit() {
-      var actualActiveDescendant = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : activeDescendant;
-      setIsOpen(false);
-      if (actualActiveDescendant && items.has(actualActiveDescendant)) {
+      var _override$activeDesce;
+      var override = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      if (isOpen) {
+        setIsOpen(false);
+      } else {
+        var _inputRef$current;
+        (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.blur();
+      }
+      var actualDescendant = (_override$activeDesce = override.activeDescendant) !== null && _override$activeDesce !== void 0 ? _override$activeDesce : activeDescendant;
+      if (!actualDescendant && override.query) {
+        onRefine(override.query);
+      }
+      if (actualDescendant && items.has(actualDescendant)) {
         var _getQuery;
-        var _ref3 = items.get(actualActiveDescendant),
+        var _ref3 = items.get(actualDescendant),
           _item = _ref3.item,
           _ref3$config = _ref3.config,
           indexOnSelect = _ref3$config.onSelect,
@@ -95,6 +106,7 @@ function createAutocompletePropGetters(_ref) {
       getInputProps: function getInputProps() {
         return {
           id: getElementId('input'),
+          ref: inputRef,
           role: 'combobox',
           'aria-autocomplete': 'list',
           'aria-expanded': isOpen,
@@ -105,33 +117,42 @@ function createAutocompletePropGetters(_ref) {
             return setIsOpen(true);
           },
           onKeyDown: function onKeyDown(event) {
-            if (event.key === 'Escape') {
-              setActiveDescendant(undefined);
-              setIsOpen(false);
-              return;
-            }
             switch (event.key) {
+              case 'Escape':
+                {
+                  if (isOpen) {
+                    setIsOpen(false);
+                    event.preventDefault();
+                  } else {
+                    setActiveDescendant(undefined);
+                  }
+                  break;
+                }
               case 'ArrowLeft':
               case 'ArrowUp':
               case 'ArrowRight':
               case 'ArrowDown':
                 {
                   var _document$getElementB;
-                  var nextActiveDescendent = getNextActiveDescendent(event.key);
-                  setActiveDescendant(nextActiveDescendent);
-                  (_document$getElementB = document.getElementById(nextActiveDescendent)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.scrollIntoView(false);
+                  setIsOpen(true);
+                  var nextActiveDescendant = getNextActiveDescendant(event.key);
+                  setActiveDescendant(nextActiveDescendant);
+                  (_document$getElementB = document.getElementById(nextActiveDescendant)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.scrollIntoView(false);
                   event.preventDefault();
                   break;
                 }
               case 'Enter':
                 {
-                  submit();
+                  submit({
+                    query: event.target.value
+                  });
                   break;
                 }
               case 'Tab':
                 setIsOpen(false);
                 break;
               default:
+                setIsOpen(true);
                 return;
             }
           },
@@ -159,7 +180,9 @@ function createAutocompletePropGetters(_ref) {
           role: 'row',
           'aria-selected': id === activeDescendant,
           onSelect: function onSelect() {
-            return submit(id);
+            return submit({
+              activeDescendant: id
+            });
           }
         };
       },

package/dist/cjs/components/autocomplete/createAutocompleteStorage.js

@@ -0,0 +1,174 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createAutocompleteStorage = createAutocompleteStorage;
+exports.createStorage = createStorage;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+function createAutocompleteStorage(_ref) {
+  var useEffect = _ref.useEffect,
+    useMemo = _ref.useMemo,
+    useState = _ref.useState;
+  return function useStorage(_ref2) {
+    var showRecent = _ref2.showRecent,
+      query = _ref2.query,
+      indices = _ref2.indices,
+      indicesConfig = _ref2.indicesConfig;
+    var storageKey = showRecent && (0, _typeof2.default)(showRecent) === 'object' ? showRecent.storageKey : undefined;
+    var storage = useMemo(function () {
+      return createStorage({
+        limit: 5,
+        storageKey: storageKey
+      });
+    }, [storageKey]);
+    var _useState = useState(storage.getSnapshot()),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      snapshot = _useState2[0],
+      setSnapshot = _useState2[1];
+    useEffect(function () {
+      storage.registerUpdateListener(function () {
+        setSnapshot(storage.getSnapshot());
+      });
+      return function () {
+        storage.unregisterUpdateListener();
+      };
+    }, [storage]);
+    if (!showRecent) {
+      return {
+        storage: {
+          onAdd: function onAdd() {},
+          onRemove: function onRemove() {}
+        },
+        storageHits: [],
+        indicesForPropGetters: indices,
+        indicesConfigForPropGetters: indicesConfig
+      };
+    }
+    var storageHits = snapshot.getAll(query).map(function (value) {
+      return {
+        objectID: value,
+        query: value,
+        __indexName: 'recent-searches',
+        _highlightResult: getHighlightedAttribute({
+          item: {
+            query: value
+          },
+          query: query || ''
+        })
+      };
+    });
+    var indicesForPropGetters = (0, _toConsumableArray2.default)(indices);
+    var indicesConfigForPropGetters = (0, _toConsumableArray2.default)(indicesConfig);
+    indicesForPropGetters.unshift({
+      indexName: 'recent-searches',
+      indexId: 'recent-searches',
+      hits: storageHits
+    });
+    indicesConfigForPropGetters.unshift({
+      indexName: 'recent-searches',
+      // @ts-expect-error - we know it has query as it's generated from storageHits
+      getQuery: function getQuery(item) {
+        return item.query;
+      }
+    });
+    return {
+      storage: storage,
+      storageHits: storageHits,
+      indicesForPropGetters: indicesForPropGetters,
+      indicesConfigForPropGetters: indicesConfigForPropGetters
+    };
+  };
+}
+var LOCAL_STORAGE_KEY_TEST = 'test-localstorage-support';
+var LOCAL_STORAGE_KEY = 'autocomplete-recent-searches';
+function isLocalStorageSupported() {
+  try {
+    localStorage.setItem(LOCAL_STORAGE_KEY_TEST, '');
+    localStorage.removeItem(LOCAL_STORAGE_KEY_TEST);
+    return true;
+  } catch (error) {
+    return false;
+  }
+}
+function getHighlightedAttribute(_ref3) {
+  var item = _ref3.item,
+    query = _ref3.query;
+  if (!query.trim().length) {
+    return {
+      query: {
+        matchLevel: 'none'
+      }
+    };
+  }
+  return {
+    query: {
+      value: item.query.replace(new RegExp(query.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'), 'gi'), function (match) {
+        return "<mark>".concat(match, "</mark>");
+      })
+    }
+  };
+}
+function getLocalStorage() {
+  var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : LOCAL_STORAGE_KEY;
+  if (!isLocalStorageSupported()) {
+    return {
+      setItems: function setItems() {},
+      getItems: function getItems() {
+        return [];
+      }
+    };
+  }
+  return {
+    setItems: function setItems(items) {
+      try {
+        window.localStorage.setItem(key, JSON.stringify(items));
+      } catch (_unused) {
+        // do nothing, this likely means the storage is full
+      }
+    },
+    getItems: function getItems() {
+      var items = window.localStorage.getItem(key);
+      return items ? JSON.parse(items) : [];
+    }
+  };
+}
+function createStorage(_ref4) {
+  var _ref4$limit = _ref4.limit,
+    limit = _ref4$limit === void 0 ? 5 : _ref4$limit,
+    storageKey = _ref4.storageKey;
+  var storage = getLocalStorage(storageKey);
+  var updateListener = null;
+  return {
+    onAdd: function onAdd(query) {
+      this.onRemove(query);
+      storage.setItems([query].concat((0, _toConsumableArray2.default)(storage.getItems())));
+    },
+    onRemove: function onRemove(query) {
+      var _updateListener;
+      storage.setItems(storage.getItems().filter(function (q) {
+        return q !== query;
+      }));
+      (_updateListener = updateListener) === null || _updateListener === void 0 ? void 0 : _updateListener();
+    },
+    registerUpdateListener: function registerUpdateListener(callback) {
+      updateListener = callback;
+    },
+    unregisterUpdateListener: function unregisterUpdateListener() {
+      updateListener = null;
+    },
+    getSnapshot: function getSnapshot() {
+      return {
+        getAll: function getAll() {
+          var query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+          return storage.getItems().filter(function (q) {
+            return q.includes(query);
+          }).slice(0, limit);
+        }
+      };
+    }
+  };
+}

package/dist/cjs/components/autocomplete/icons.js

@@ -4,8 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AutocompleteClearIcon = AutocompleteClearIcon;
+exports.AutocompleteClockIcon = AutocompleteClockIcon;
 exports.AutocompleteLoadingIcon = AutocompleteLoadingIcon;
 exports.AutocompleteSubmitIcon = AutocompleteSubmitIcon;
+exports.AutocompleteTrashIcon = AutocompleteTrashIcon;
 function AutocompleteSubmitIcon(_ref) {
   var createElement = _ref.createElement;
   return createElement("svg", {
@@ -53,4 +55,22 @@ function AutocompleteClearIcon(_ref3) {
   }, createElement("path", {
     d: "M5.293 6.707l5.293 5.293-5.293 5.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l5.293-5.293 5.293 5.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-5.293-5.293 5.293-5.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-5.293 5.293-5.293-5.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"
   }));
+}
+function AutocompleteClockIcon(_ref4) {
+  var createElement = _ref4.createElement;
+  return createElement("svg", {
+    viewBox: "0 0 24 24",
+    fill: "currentColor"
+  }, createElement("path", {
+    d: "M12.516 6.984v5.25l4.5 2.672-0.75 1.266-5.25-3.188v-6h1.5zM12 20.016q3.281 0 5.648-2.367t2.367-5.648-2.367-5.648-5.648-2.367-5.648 2.367-2.367 5.648 2.367 5.648 5.648 2.367zM12 2.016q4.125 0 7.055 2.93t2.93 7.055-2.93 7.055-7.055 2.93-7.055-2.93-2.93-7.055 2.93-7.055 7.055-2.93z"
+  }));
+}
+function AutocompleteTrashIcon(_ref5) {
+  var createElement = _ref5.createElement;
+  return createElement("svg", {
+    viewBox: "0 0 24 24",
+    fill: "currentColor"
+  }, createElement("path", {
+    d: "M18 7v13c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293h-10c-0.276 0-0.525-0.111-0.707-0.293s-0.293-0.431-0.293-0.707v-13zM17 5v-1c0-0.828-0.337-1.58-0.879-2.121s-1.293-0.879-2.121-0.879h-4c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v1h-4c-0.552 0-1 0.448-1 1s0.448 1 1 1h1v13c0 0.828 0.337 1.58 0.879 2.121s1.293 0.879 2.121 0.879h10c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121v-13h1c0.552 0 1-0.448 1-1s-0.448-1-1-1zM9 5v-1c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h4c0.276 0 0.525 0.111 0.707 0.293s0.293 0.431 0.293 0.707v1zM9 11v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1zM13 11v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1z"
+  }));
 }

package/dist/cjs/components/autocomplete/index.js

@@ -36,6 +36,17 @@ Object.keys(_AutocompletePanel).forEach(function (key) {
     }
   });
 });
+var _AutocompleteRecentSearch = require("./AutocompleteRecentSearch");
+Object.keys(_AutocompleteRecentSearch).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _AutocompleteRecentSearch[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _AutocompleteRecentSearch[key];
+    }
+  });
+});
 var _AutocompleteSearch = require("./AutocompleteSearch");
 Object.keys(_AutocompleteSearch).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -68,4 +79,15 @@ Object.keys(_createAutocompletePropGetters).forEach(function (key) {
       return _createAutocompletePropGetters[key];
     }
   });
+});
+var _createAutocompleteStorage = require("./createAutocompleteStorage");
+Object.keys(_createAutocompleteStorage).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _createAutocompleteStorage[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _createAutocompleteStorage[key];
+    }
+  });
 });

package/dist/cjs/components/chat/Chat.js

@@ -59,7 +59,8 @@ function createChatComponent(_ref) {
       classNames: classNames.header,
       maximized: maximized
     })), createElement(ChatMessages, (0, _extends2.default)({}, messagesProps, {
-      classNames: classNames.messages
+      classNames: classNames.messages,
+      messageClassNames: classNames.message
     })), createElement(PromptComponent || ChatPrompt, _objectSpread(_objectSpread({}, promptProps), {}, {
       classNames: classNames.prompt
     }))), createElement("div", {

package/dist/cjs/components/chat/ChatMessage.js

@@ -84,6 +84,9 @@ function createChatMessageComponent(_ref) {
               toolCallId: toolMessage.toolCallId
             });
           };
+          if (!ToolLayoutComponent) {
+            return null;
+          }
           return createElement("div", {
             key: "".concat(message.id, "-").concat(index),
             className: "ais-ChatMessage-tool"

package/dist/cjs/components/chat/ChatMessages.js

@@ -15,7 +15,7 @@ var _ChatMessage = require("./ChatMessage");
 var _ChatMessageError = require("./ChatMessageError");
 var _ChatMessageLoader = require("./ChatMessageLoader");
 var _icons = require("./icons");
-var _excluded = ["classNames", "messages", "messageComponent", "loaderComponent", "errorComponent", "actionsComponent", "tools", "indexUiState", "setIndexUiState", "status", "hideScrollToBottom", "onReload", "onClose", "translations", "userMessageProps", "assistantMessageProps", "isClearing", "onClearTransitionEnd", "isScrollAtBottom", "scrollRef", "contentRef", "onScrollToBottom"];
+var _excluded = ["classNames", "messageClassNames", "messageTranslations", "messages", "messageComponent", "loaderComponent", "errorComponent", "actionsComponent", "tools", "indexUiState", "setIndexUiState", "status", "hideScrollToBottom", "onReload", "onClose", "translations", "userMessageProps", "assistantMessageProps", "isClearing", "onClearTransitionEnd", "isScrollAtBottom", "scrollRef", "contentRef", "onScrollToBottom"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var getTextContent = function getTextContent(message) {
@@ -45,8 +45,10 @@ function createDefaultMessageComponent(_ref) {
       setIndexUiState = _ref2.setIndexUiState,
       onReload = _ref2.onReload,
       onClose = _ref2.onClose,
-      translations = _ref2.translations,
-      actionsComponent = _ref2.actionsComponent;
+      actionsComponent = _ref2.actionsComponent,
+      classNames = _ref2.classNames,
+      messageTranslations = _ref2.messageTranslations,
+      translations = _ref2.translations;
     var defaultAssistantActions = [].concat((0, _toConsumableArray2.default)(hasTextContent(message) ? [{
       title: translations.copyToClipboardLabel,
       icon: function icon() {
@@ -78,7 +80,9 @@ function createDefaultMessageComponent(_ref) {
       onClose: onClose,
       actions: defaultActions,
       actionsComponent: actionsComponent,
-      "data-role": message.role
+      "data-role": message.role,
+      classNames: classNames,
+      translations: messageTranslations
     }, messageProps));
   };
 }
@@ -101,6 +105,9 @@ function createChatMessagesComponent(_ref3) {
   return function ChatMessages(userProps) {
     var _userProps$classNames = userProps.classNames,
       classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      _userProps$messageCla = userProps.messageClassNames,
+      messageClassNames = _userProps$messageCla === void 0 ? {} : _userProps$messageCla,
+      messageTranslations = userProps.messageTranslations,
       _userProps$messages = userProps.messages,
       messages = _userProps$messages === void 0 ? [] : _userProps$messages,
       MessageComponent = userProps.messageComponent,
@@ -169,7 +176,9 @@ function createChatMessagesComponent(_ref3) {
         onReload: onReload,
         actionsComponent: ActionsComponent,
         onClose: onClose,
-        translations: translations
+        translations: translations,
+        classNames: messageClassNames,
+        messageTranslations: messageTranslations
       });
     }), status === 'submitted' && createElement(DefaultLoader, {
       translations: {

package/dist/cjs/version.js

@@ -4,4 +4,4 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = '0.13.0';
+var _default = exports.default = '0.15.0';

package/dist/es/components/autocomplete/AutocompleteRecentSearch.d.ts

@@ -0,0 +1,38 @@
+/** @jsx createElement */
+import type { ComponentChildren, Renderer } from '../../types';
+export type AutocompleteRecentSearchProps<T = {
+    query: string;
+} & Record<string, unknown>> = {
+    item: T;
+    children?: ComponentChildren;
+    onSelect: () => void;
+    onRemoveRecentSearch: () => void;
+    classNames?: Partial<AutocompleteRecentSearchClassNames>;
+};
+export type AutocompleteRecentSearchClassNames = {
+    /**
+     * Class names to apply to the root element
+     **/
+    root: string | string[];
+    /**
+     * Class names to apply to the content element
+     **/
+    content: string | string[];
+    /**
+     * Class names to apply to the actions element
+     **/
+    actions: string | string[];
+    /**
+     * Class names to apply to the icon element
+     **/
+    icon: string | string[];
+    /**
+     * Class names to apply to the body element
+     **/
+    body: string | string[];
+    /**
+     * Class names to apply to the delete button element
+     **/
+    deleteButton: string | string[];
+};
+export declare function createAutocompleteRecentSearchComponent({ createElement, }: Renderer): ({ item, children, onSelect, onRemoveRecentSearch, classNames, }: AutocompleteRecentSearchProps) => JSX.Element;

package/dist/es/components/autocomplete/AutocompleteRecentSearch.js

@@ -0,0 +1,36 @@
+import { cx } from "../../lib/index.js";
+import { AutocompleteClockIcon, AutocompleteTrashIcon } from "./icons.js";
+export function createAutocompleteRecentSearchComponent(_ref) {
+  var createElement = _ref.createElement;
+  return function AutocompleteRecentSearch(_ref2) {
+    var item = _ref2.item,
+      children = _ref2.children,
+      onSelect = _ref2.onSelect,
+      onRemoveRecentSearch = _ref2.onRemoveRecentSearch,
+      _ref2$classNames = _ref2.classNames,
+      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
+    return createElement("div", {
+      onClick: onSelect,
+      className: cx('ais-AutocompleteItemWrapper ais-AutocompleteRecentSearchWrapper', classNames.root)
+    }, createElement("div", {
+      className: cx('ais-AutocompleteItemContent', 'ais-AutocompleteRecentSearchItemContent', classNames.content)
+    }, createElement("div", {
+      className: cx('ais-AutocompleteItemIcon', 'ais-AutocompleteRecentSearchItemIcon', classNames.content)
+    }, createElement(AutocompleteClockIcon, {
+      createElement: createElement
+    })), createElement("div", {
+      className: cx('ais-AutocompleteItemContentBody', 'ais-AutocompleteRecentSearchItemContentBody', classNames.content)
+    }, children)), createElement("div", {
+      className: cx('ais-AutocompleteItemActions', 'ais-AutocompleteRecentSearchItemActions', classNames.actions)
+    }, createElement("button", {
+      className: cx('ais-AutocompleteItemActionButton', 'ais-AutocompleteRecentSearchItemDeleteButton', classNames.deleteButton),
+      title: "Remove ".concat(item.query, " from recent searches"),
+      onClick: function onClick(evt) {
+        evt.stopPropagation();
+        onRemoveRecentSearch();
+      }
+    }, createElement(AutocompleteTrashIcon, {
+      createElement: createElement
+    }))));
+  };
+}

package/dist/es/components/autocomplete/AutocompleteSearch.js

@@ -7,6 +7,7 @@ export function createAutocompleteSearchComponent(_ref) {
       onClear = _ref2.onClear,
       query = _ref2.query,
       isSearchStalled = _ref2.isSearchStalled;
+    var inputRef = inputProps.ref;
     return createElement("form", {
       className: "ais-AutocompleteForm",
       action: "",
@@ -14,6 +15,10 @@ export function createAutocompleteSearchComponent(_ref) {
       role: "search",
       onSubmit: function onSubmit(e) {
         return e.preventDefault();
+      },
+      onReset: function onReset() {
+        var _inputRef$current;
+        return (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
       }
     }, createElement("div", {
       className: "ais-AutocompleteInputWrapperPrefix"

package/dist/es/components/autocomplete/AutocompleteSuggestion.d.ts

@@ -1,10 +1,11 @@
 /** @jsx createElement */
-import type { Renderer } from '../../types';
+import type { ComponentChildren, Renderer } from '../../types';
 export type AutocompleteSuggestionProps<T = {
     query: string;
 } & Record<string, unknown>> = {
     item: T;
     onSelect: () => void;
+    children: ComponentChildren;
     classNames?: Partial<AutocompleteSuggestionClassNames>;
 };
 export type AutocompleteSuggestionClassNames = {
@@ -12,5 +13,13 @@ export type AutocompleteSuggestionClassNames = {
      * Class names to apply to the root element
      **/
     root: string | string[];
+    /** Class names to apply to the content element **/
+    content: string | string[];
+    /** Class names to apply to the actions element **/
+    actions: string | string[];
+    /** Class names to apply to the icon element **/
+    icon: string | string[];
+    /** Class names to apply to the body element **/
+    body: string | string[];
 };
-export declare function createAutocompleteSuggestionComponent({ createElement, }: Renderer): ({ item, onSelect, classNames, }: AutocompleteSuggestionProps) => JSX.Element;
+export declare function createAutocompleteSuggestionComponent({ createElement, }: Renderer): ({ children, onSelect, classNames, }: AutocompleteSuggestionProps) => JSX.Element;

package/dist/es/components/autocomplete/AutocompleteSuggestion.js

@@ -1,14 +1,23 @@
 import { cx } from "../../lib/index.js";
+import { AutocompleteSubmitIcon } from "./icons.js";
 export function createAutocompleteSuggestionComponent(_ref) {
   var createElement = _ref.createElement;
   return function AutocompleteSuggestion(_ref2) {
-    var item = _ref2.item,
+    var children = _ref2.children,
       onSelect = _ref2.onSelect,
       _ref2$classNames = _ref2.classNames,
       classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
     return createElement("div", {
       onClick: onSelect,
-      className: cx('ais-AutocompleteSuggestion', classNames.root)
-    }, item.query);
+      className: cx('ais-AutocompleteItemWrapper', 'ais-AutocompleteSuggestionWrapper', classNames.root)
+    }, createElement("div", {
+      className: cx('ais-AutocompleteItemContent', 'ais-AutocompleteSuggestionItemContent', classNames.content)
+    }, createElement("div", {
+      className: cx('ais-AutocompleteItemIcon', 'ais-AutocompleteSuggestionItemIcon', classNames.content)
+    }, createElement(AutocompleteSubmitIcon, {
+      createElement: createElement
+    })), createElement("div", {
+      className: cx('ais-AutocompleteItemContentBody', 'ais-AutocompleteSuggestionItemContentBody', classNames.content)
+    }, children)));
   };
 }

package/dist/es/components/autocomplete/createAutocompletePropGetters.d.ts

@@ -28,7 +28,7 @@ type CreateAutocompletePropGettersParams = {
     };
     useState: <TType>(initialState: TType) => [TType, (newState: TType) => unknown];
 };
-type UsePropGetters<TItem extends BaseHit> = (params: {
+export type UsePropGetters<TItem extends BaseHit> = (params: {
     indices: Array<{
         indexName: string;
         indexId: string;

package/dist/es/components/autocomplete/createAutocompletePropGetters.js

@@ -12,6 +12,7 @@ export function createAutocompletePropGetters(_ref) {
       onRefine = _ref2.onRefine,
       globalOnSelect = _ref2.onSelect;
     var getElementId = createGetElementId(useId());
+    var inputRef = useRef(null);
     var rootRef = useRef(null);
     var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -43,7 +44,7 @@ export function createAutocompletePropGetters(_ref) {
         document.body.removeEventListener('click', onBodyClick);
       };
     }, [rootRef]);
-    var getNextActiveDescendent = function getNextActiveDescendent(key) {
+    var getNextActiveDescendant = function getNextActiveDescendant(key) {
       switch (key) {
         case 'ArrowLeft':
         case 'ArrowUp':
@@ -62,11 +63,21 @@ export function createAutocompletePropGetters(_ref) {
       }
     };
     var submit = function submit() {
-      var actualActiveDescendant = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : activeDescendant;
-      setIsOpen(false);
-      if (actualActiveDescendant && items.has(actualActiveDescendant)) {
+      var _override$activeDesce;
+      var override = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      if (isOpen) {
+        setIsOpen(false);
+      } else {
+        var _inputRef$current;
+        (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.blur();
+      }
+      var actualDescendant = (_override$activeDesce = override.activeDescendant) !== null && _override$activeDesce !== void 0 ? _override$activeDesce : activeDescendant;
+      if (!actualDescendant && override.query) {
+        onRefine(override.query);
+      }
+      if (actualDescendant && items.has(actualDescendant)) {
         var _getQuery;
-        var _ref3 = items.get(actualActiveDescendant),
+        var _ref3 = items.get(actualDescendant),
           _item = _ref3.item,
           _ref3$config = _ref3.config,
           indexOnSelect = _ref3$config.onSelect,
@@ -88,6 +99,7 @@ export function createAutocompletePropGetters(_ref) {
       getInputProps: function getInputProps() {
         return {
           id: getElementId('input'),
+          ref: inputRef,
           role: 'combobox',
           'aria-autocomplete': 'list',
           'aria-expanded': isOpen,
@@ -98,33 +110,42 @@ export function createAutocompletePropGetters(_ref) {
             return setIsOpen(true);
           },
           onKeyDown: function onKeyDown(event) {
-            if (event.key === 'Escape') {
-              setActiveDescendant(undefined);
-              setIsOpen(false);
-              return;
-            }
             switch (event.key) {
+              case 'Escape':
+                {
+                  if (isOpen) {
+                    setIsOpen(false);
+                    event.preventDefault();
+                  } else {
+                    setActiveDescendant(undefined);
+                  }
+                  break;
+                }
               case 'ArrowLeft':
               case 'ArrowUp':
               case 'ArrowRight':
               case 'ArrowDown':
                 {
                   var _document$getElementB;
-                  var nextActiveDescendent = getNextActiveDescendent(event.key);
-                  setActiveDescendant(nextActiveDescendent);
-                  (_document$getElementB = document.getElementById(nextActiveDescendent)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.scrollIntoView(false);
+                  setIsOpen(true);
+                  var nextActiveDescendant = getNextActiveDescendant(event.key);
+                  setActiveDescendant(nextActiveDescendant);
+                  (_document$getElementB = document.getElementById(nextActiveDescendant)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.scrollIntoView(false);
                   event.preventDefault();
                   break;
                 }
               case 'Enter':
                 {
-                  submit();
+                  submit({
+                    query: event.target.value
+                  });
                   break;
                 }
               case 'Tab':
                 setIsOpen(false);
                 break;
               default:
+                setIsOpen(true);
                 return;
             }
           },
@@ -152,7 +173,9 @@ export function createAutocompletePropGetters(_ref) {
           role: 'row',
           'aria-selected': id === activeDescendant,
           onSelect: function onSelect() {
-            return submit(id);
+            return submit({
+              activeDescendant: id
+            });
           }
         };
       },

package/dist/es/components/autocomplete/createAutocompleteStorage.d.ts

@@ -0,0 +1,74 @@
+import type { UsePropGetters } from './createAutocompletePropGetters';
+type CreateAutocompleteStorageParams = {
+    useEffect: (effect: () => void, inputs?: readonly unknown[]) => void;
+    useMemo: <TType>(factory: () => TType, inputs: readonly unknown[]) => TType;
+    useState: <TType>(initialState: TType) => [TType, (newState: TType) => unknown];
+};
+type UseStorageParams<TItem extends Record<string, unknown>> = {
+    showRecent?: boolean | {
+        storageKey?: string;
+    };
+    query?: string;
+} & Pick<Parameters<UsePropGetters<TItem>>[0], 'indices' | 'indicesConfig'>;
+export declare function createAutocompleteStorage({ useEffect, useMemo, useState, }: CreateAutocompleteStorageParams): <TItem extends Record<string, unknown>>({ showRecent, query, indices, indicesConfig, }: UseStorageParams<TItem>) => {
+    storage: {
+        onAdd: () => void;
+        onRemove: () => void;
+    };
+    storageHits: never[];
+    indicesForPropGetters: {
+        indexName: string;
+        indexId: string;
+        hits: Array<{
+            [key: string]: unknown;
+        }>;
+    }[];
+    indicesConfigForPropGetters: import("./createAutocompletePropGetters").AutocompleteIndexConfig<TItem>[];
+} | {
+    storage: {
+        onAdd(query: string): void;
+        onRemove(query: string): void;
+        registerUpdateListener(callback: () => void): void;
+        unregisterUpdateListener(): void;
+        getSnapshot(): {
+            getAll(query?: string): string[];
+        };
+    };
+    storageHits: {
+        objectID: string;
+        query: string;
+        __indexName: string;
+        _highlightResult: {
+            query: {
+                matchLevel: string;
+                value?: undefined;
+            };
+        } | {
+            query: {
+                value: string;
+                matchLevel?: undefined;
+            };
+        };
+    }[];
+    indicesForPropGetters: {
+        indexName: string;
+        indexId: string;
+        hits: Array<{
+            [key: string]: unknown;
+        }>;
+    }[];
+    indicesConfigForPropGetters: import("./createAutocompletePropGetters").AutocompleteIndexConfig<TItem>[];
+};
+export declare function createStorage({ limit, storageKey, }: {
+    limit: number;
+    storageKey?: string;
+}): {
+    onAdd(query: string): void;
+    onRemove(query: string): void;
+    registerUpdateListener(callback: () => void): void;
+    unregisterUpdateListener(): void;
+    getSnapshot(): {
+        getAll(query?: string): string[];
+    };
+};
+export {};

package/dist/es/components/autocomplete/createAutocompleteStorage.js

@@ -0,0 +1,166 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _typeof from "@babel/runtime/helpers/typeof";
+export function createAutocompleteStorage(_ref) {
+  var useEffect = _ref.useEffect,
+    useMemo = _ref.useMemo,
+    useState = _ref.useState;
+  return function useStorage(_ref2) {
+    var showRecent = _ref2.showRecent,
+      query = _ref2.query,
+      indices = _ref2.indices,
+      indicesConfig = _ref2.indicesConfig;
+    var storageKey = showRecent && _typeof(showRecent) === 'object' ? showRecent.storageKey : undefined;
+    var storage = useMemo(function () {
+      return createStorage({
+        limit: 5,
+        storageKey: storageKey
+      });
+    }, [storageKey]);
+    var _useState = useState(storage.getSnapshot()),
+      _useState2 = _slicedToArray(_useState, 2),
+      snapshot = _useState2[0],
+      setSnapshot = _useState2[1];
+    useEffect(function () {
+      storage.registerUpdateListener(function () {
+        setSnapshot(storage.getSnapshot());
+      });
+      return function () {
+        storage.unregisterUpdateListener();
+      };
+    }, [storage]);
+    if (!showRecent) {
+      return {
+        storage: {
+          onAdd: function onAdd() {},
+          onRemove: function onRemove() {}
+        },
+        storageHits: [],
+        indicesForPropGetters: indices,
+        indicesConfigForPropGetters: indicesConfig
+      };
+    }
+    var storageHits = snapshot.getAll(query).map(function (value) {
+      return {
+        objectID: value,
+        query: value,
+        __indexName: 'recent-searches',
+        _highlightResult: getHighlightedAttribute({
+          item: {
+            query: value
+          },
+          query: query || ''
+        })
+      };
+    });
+    var indicesForPropGetters = _toConsumableArray(indices);
+    var indicesConfigForPropGetters = _toConsumableArray(indicesConfig);
+    indicesForPropGetters.unshift({
+      indexName: 'recent-searches',
+      indexId: 'recent-searches',
+      hits: storageHits
+    });
+    indicesConfigForPropGetters.unshift({
+      indexName: 'recent-searches',
+      // @ts-expect-error - we know it has query as it's generated from storageHits
+      getQuery: function getQuery(item) {
+        return item.query;
+      }
+    });
+    return {
+      storage: storage,
+      storageHits: storageHits,
+      indicesForPropGetters: indicesForPropGetters,
+      indicesConfigForPropGetters: indicesConfigForPropGetters
+    };
+  };
+}
+var LOCAL_STORAGE_KEY_TEST = 'test-localstorage-support';
+var LOCAL_STORAGE_KEY = 'autocomplete-recent-searches';
+function isLocalStorageSupported() {
+  try {
+    localStorage.setItem(LOCAL_STORAGE_KEY_TEST, '');
+    localStorage.removeItem(LOCAL_STORAGE_KEY_TEST);
+    return true;
+  } catch (error) {
+    return false;
+  }
+}
+function getHighlightedAttribute(_ref3) {
+  var item = _ref3.item,
+    query = _ref3.query;
+  if (!query.trim().length) {
+    return {
+      query: {
+        matchLevel: 'none'
+      }
+    };
+  }
+  return {
+    query: {
+      value: item.query.replace(new RegExp(query.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'), 'gi'), function (match) {
+        return "<mark>".concat(match, "</mark>");
+      })
+    }
+  };
+}
+function getLocalStorage() {
+  var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : LOCAL_STORAGE_KEY;
+  if (!isLocalStorageSupported()) {
+    return {
+      setItems: function setItems() {},
+      getItems: function getItems() {
+        return [];
+      }
+    };
+  }
+  return {
+    setItems: function setItems(items) {
+      try {
+        window.localStorage.setItem(key, JSON.stringify(items));
+      } catch (_unused) {
+        // do nothing, this likely means the storage is full
+      }
+    },
+    getItems: function getItems() {
+      var items = window.localStorage.getItem(key);
+      return items ? JSON.parse(items) : [];
+    }
+  };
+}
+export function createStorage(_ref4) {
+  var _ref4$limit = _ref4.limit,
+    limit = _ref4$limit === void 0 ? 5 : _ref4$limit,
+    storageKey = _ref4.storageKey;
+  var storage = getLocalStorage(storageKey);
+  var updateListener = null;
+  return {
+    onAdd: function onAdd(query) {
+      this.onRemove(query);
+      storage.setItems([query].concat(_toConsumableArray(storage.getItems())));
+    },
+    onRemove: function onRemove(query) {
+      var _updateListener;
+      storage.setItems(storage.getItems().filter(function (q) {
+        return q !== query;
+      }));
+      (_updateListener = updateListener) === null || _updateListener === void 0 ? void 0 : _updateListener();
+    },
+    registerUpdateListener: function registerUpdateListener(callback) {
+      updateListener = callback;
+    },
+    unregisterUpdateListener: function unregisterUpdateListener() {
+      updateListener = null;
+    },
+    getSnapshot: function getSnapshot() {
+      return {
+        getAll: function getAll() {
+          var query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+          return storage.getItems().filter(function (q) {
+            return q.includes(query);
+          }).slice(0, limit);
+        }
+      };
+    }
+  };
+}

package/dist/es/components/autocomplete/icons.d.ts

@@ -4,4 +4,6 @@ type IconProps = Pick<Renderer, 'createElement'>;
 export declare function AutocompleteSubmitIcon({ createElement }: IconProps): JSX.Element;
 export declare function AutocompleteLoadingIcon({ createElement }: IconProps): JSX.Element;
 export declare function AutocompleteClearIcon({ createElement }: IconProps): JSX.Element;
+export declare function AutocompleteClockIcon({ createElement }: IconProps): JSX.Element;
+export declare function AutocompleteTrashIcon({ createElement }: IconProps): JSX.Element;
 export {};

package/dist/es/components/autocomplete/icons.js

@@ -45,4 +45,22 @@ export function AutocompleteClearIcon(_ref3) {
   }, createElement("path", {
     d: "M5.293 6.707l5.293 5.293-5.293 5.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l5.293-5.293 5.293 5.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-5.293-5.293 5.293-5.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-5.293 5.293-5.293-5.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"
   }));
+}
+export function AutocompleteClockIcon(_ref4) {
+  var createElement = _ref4.createElement;
+  return createElement("svg", {
+    viewBox: "0 0 24 24",
+    fill: "currentColor"
+  }, createElement("path", {
+    d: "M12.516 6.984v5.25l4.5 2.672-0.75 1.266-5.25-3.188v-6h1.5zM12 20.016q3.281 0 5.648-2.367t2.367-5.648-2.367-5.648-5.648-2.367-5.648 2.367-2.367 5.648 2.367 5.648 5.648 2.367zM12 2.016q4.125 0 7.055 2.93t2.93 7.055-2.93 7.055-7.055 2.93-7.055-2.93-2.93-7.055 2.93-7.055 7.055-2.93z"
+  }));
+}
+export function AutocompleteTrashIcon(_ref5) {
+  var createElement = _ref5.createElement;
+  return createElement("svg", {
+    viewBox: "0 0 24 24",
+    fill: "currentColor"
+  }, createElement("path", {
+    d: "M18 7v13c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293h-10c-0.276 0-0.525-0.111-0.707-0.293s-0.293-0.431-0.293-0.707v-13zM17 5v-1c0-0.828-0.337-1.58-0.879-2.121s-1.293-0.879-2.121-0.879h-4c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v1h-4c-0.552 0-1 0.448-1 1s0.448 1 1 1h1v13c0 0.828 0.337 1.58 0.879 2.121s1.293 0.879 2.121 0.879h10c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121v-13h1c0.552 0 1-0.448 1-1s-0.448-1-1-1zM9 5v-1c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h4c0.276 0 0.525 0.111 0.707 0.293s0.293 0.431 0.293 0.707v1zM9 11v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1zM13 11v6c0 0.552 0.448 1 1 1s1-0.448 1-1v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1z"
+  }));
 }

package/dist/es/components/autocomplete/index.d.ts

@@ -1,6 +1,8 @@
 export * from './Autocomplete';
 export * from './AutocompleteIndex';
 export * from './AutocompletePanel';
+export * from './AutocompleteRecentSearch';
 export * from './AutocompleteSearch';
 export * from './AutocompleteSuggestion';
 export * from './createAutocompletePropGetters';
+export * from './createAutocompleteStorage';

package/dist/es/components/autocomplete/index.js

@@ -1,6 +1,8 @@
 export * from "./Autocomplete.js";
 export * from "./AutocompleteIndex.js";
 export * from "./AutocompletePanel.js";
+export * from "./AutocompleteRecentSearch.js";
 export * from "./AutocompleteSearch.js";
 export * from "./AutocompleteSuggestion.js";
-export * from "./createAutocompletePropGetters.js";
+export * from "./createAutocompletePropGetters.js";
+export * from "./createAutocompleteStorage.js";

package/dist/es/components/chat/Chat.d.ts

@@ -8,6 +8,7 @@ export type ChatClassNames = {
     container?: string | string[];
     header?: ChatHeaderProps['classNames'];
     messages?: ChatMessagesProps['classNames'];
+    message?: ChatMessagesProps['messageClassNames'];
     prompt?: ChatPromptProps['classNames'];
     toggleButton?: ChatToggleButtonProps['classNames'];
 };

package/dist/es/components/chat/Chat.js

@@ -52,7 +52,8 @@ export function createChatComponent(_ref) {
       classNames: classNames.header,
       maximized: maximized
     })), createElement(ChatMessages, _extends({}, messagesProps, {
-      classNames: classNames.messages
+      classNames: classNames.messages,
+      messageClassNames: classNames.message
     })), createElement(PromptComponent || ChatPrompt, _objectSpread(_objectSpread({}, promptProps), {}, {
       classNames: classNames.prompt
     }))), createElement("div", {

package/dist/es/components/chat/ChatMessage.js

@@ -77,6 +77,9 @@ export function createChatMessageComponent(_ref) {
               toolCallId: toolMessage.toolCallId
             });
           };
+          if (!ToolLayoutComponent) {
+            return null;
+          }
           return createElement("div", {
             key: "".concat(message.id, "-").concat(index),
             className: "ais-ChatMessage-tool"

package/dist/es/components/chat/ChatMessages.d.ts

@@ -1,6 +1,6 @@
 /** @jsx createElement */
 import type { ComponentProps, MutableRef, Renderer } from '../../types';
-import type { ChatMessageProps } from './ChatMessage';
+import type { ChatMessageProps, ChatMessageClassNames, ChatMessageTranslations } from './ChatMessage';
 import type { ChatMessageErrorProps } from './ChatMessageError';
 import type { ChatMessageLoaderProps } from './ChatMessageLoader';
 import type { ChatMessageBase, ChatStatus, ClientSideTools } from './types';
@@ -99,10 +99,18 @@ export type ChatMessagesProps<TMessage extends ChatMessageBase = ChatMessageBase
      * Optional class names
      */
     classNames?: Partial<ChatMessagesClassNames>;
+    /**
+     * Optional message class names
+     */
+    messageClassNames?: Partial<ChatMessageClassNames>;
     /**
      * Optional translations
      */
     translations?: Partial<ChatMessagesTranslations>;
+    /**
+     * Optional message translations
+     */
+    messageTranslations?: Partial<ChatMessageTranslations>;
     /**
      * Optional user message props
      */

package/dist/es/components/chat/ChatMessages.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _extends from "@babel/runtime/helpers/extends";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-var _excluded = ["classNames", "messages", "messageComponent", "loaderComponent", "errorComponent", "actionsComponent", "tools", "indexUiState", "setIndexUiState", "status", "hideScrollToBottom", "onReload", "onClose", "translations", "userMessageProps", "assistantMessageProps", "isClearing", "onClearTransitionEnd", "isScrollAtBottom", "scrollRef", "contentRef", "onScrollToBottom"];
+var _excluded = ["classNames", "messageClassNames", "messageTranslations", "messages", "messageComponent", "loaderComponent", "errorComponent", "actionsComponent", "tools", "indexUiState", "setIndexUiState", "status", "hideScrollToBottom", "onReload", "onClose", "translations", "userMessageProps", "assistantMessageProps", "isClearing", "onClearTransitionEnd", "isScrollAtBottom", "scrollRef", "contentRef", "onScrollToBottom"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { cx } from "../../lib/index.js";
@@ -38,8 +38,10 @@ function createDefaultMessageComponent(_ref) {
       setIndexUiState = _ref2.setIndexUiState,
       onReload = _ref2.onReload,
       onClose = _ref2.onClose,
-      translations = _ref2.translations,
-      actionsComponent = _ref2.actionsComponent;
+      actionsComponent = _ref2.actionsComponent,
+      classNames = _ref2.classNames,
+      messageTranslations = _ref2.messageTranslations,
+      translations = _ref2.translations;
     var defaultAssistantActions = [].concat(_toConsumableArray(hasTextContent(message) ? [{
       title: translations.copyToClipboardLabel,
       icon: function icon() {
@@ -71,7 +73,9 @@ function createDefaultMessageComponent(_ref) {
       onClose: onClose,
       actions: defaultActions,
       actionsComponent: actionsComponent,
-      "data-role": message.role
+      "data-role": message.role,
+      classNames: classNames,
+      translations: messageTranslations
     }, messageProps));
   };
 }
@@ -94,6 +98,9 @@ export function createChatMessagesComponent(_ref3) {
   return function ChatMessages(userProps) {
     var _userProps$classNames = userProps.classNames,
       classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      _userProps$messageCla = userProps.messageClassNames,
+      messageClassNames = _userProps$messageCla === void 0 ? {} : _userProps$messageCla,
+      messageTranslations = userProps.messageTranslations,
       _userProps$messages = userProps.messages,
       messages = _userProps$messages === void 0 ? [] : _userProps$messages,
       MessageComponent = userProps.messageComponent,
@@ -162,7 +169,9 @@ export function createChatMessagesComponent(_ref3) {
         onReload: onReload,
         actionsComponent: ActionsComponent,
         onClose: onClose,
-        translations: translations
+        translations: translations,
+        classNames: messageClassNames,
+        messageTranslations: messageTranslations
       });
     }), status === 'submitted' && createElement(DefaultLoader, {
       translations: {

package/dist/es/components/chat/types.d.ts

@@ -18,7 +18,7 @@ export type ClientSideToolComponentProps = {
 };
 export type ClientSideToolComponent = (props: ClientSideToolComponentProps) => JSX.Element;
 export type ClientSideTool = {
-    layoutComponent: ClientSideToolComponent;
+    layoutComponent?: ClientSideToolComponent;
     addToolResult: AddToolResult;
     onToolCall?: (params: Parameters<NonNullable<ChatInit<UIMessage>['onToolCall']>>[0]['toolCall'] & {
         addToolResult: AddToolResultWithOutput;

package/dist/es/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "0.13.0";
+declare const _default: "0.15.0";
 export default _default;

package/dist/es/version.js

@@ -1 +1 @@
-export default '0.13.0';
+export default '0.15.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "instantsearch-ui-components",
-  "version": "0.13.0",
+  "version": "0.15.0",
   "description": "Common UI components for InstantSearch.",
   "types": "dist/es/index.d.ts",
   "main": "dist/cjs/index.js",
@@ -53,5 +53,5 @@
     "zod": "^3.25.76 || ^4",
     "zod-to-json-schema": "3.24.6"
   },
-  "gitHead": "89dc58afb61fbabb29e326d18543e51907eaea88"
+  "gitHead": "b4cb69c8cfaa9dc22dfe8fe695568cf5200f3893"
 }