instantsearch-ui-components 0.15.1 → 0.16.0

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

@@ -8,7 +8,7 @@ exports.createAutocompleteIndexComponent = createAutocompleteIndexComponent;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _cx = require("../../lib/cx");
-var _excluded = ["className", "onSelect"];
+var _excluded = ["className", "onSelect", "onApply"];
 function createAutocompleteIndexComponent(_ref) {
   var createElement = _ref.createElement;
   return function AutocompleteIndex(userProps) {
@@ -30,6 +30,7 @@ function createAutocompleteIndexComponent(_ref) {
       var _getItemProps = getItemProps(item, index),
         className = _getItemProps.className,
         onSelect = _getItemProps.onSelect,
+        onApply = _getItemProps.onApply,
         itemProps = (0, _objectWithoutProperties2.default)(_getItemProps, _excluded);
       return createElement("li", (0, _extends2.default)({
         key: "".concat(itemProps.id, ":").concat(item.objectID)
@@ -37,7 +38,8 @@ function createAutocompleteIndexComponent(_ref) {
         className: (0, _cx.cx)('ais-AutocompleteIndexItem', classNames.item, className)
       }), createElement(ItemComponent, {
         item: item,
-        onSelect: onSelect
+        onSelect: onSelect,
+        onApply: onApply
       }));
     })));
   };

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

@@ -8,13 +8,14 @@ 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 function AutocompleteRecentSearch(userProps) {
+    var item = userProps.item,
+      children = userProps.children,
+      onSelect = userProps.onSelect,
+      onRemoveRecentSearch = userProps.onRemoveRecentSearch,
+      onApply = userProps.onApply,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames;
     return createElement("div", {
       onClick: onSelect,
       className: (0, _lib.cx)('ais-AutocompleteItemWrapper ais-AutocompleteRecentSearchWrapper', classNames.root)
@@ -37,6 +38,15 @@ function createAutocompleteRecentSearchComponent(_ref) {
       }
     }, createElement(_icons.TrashIcon, {
       createElement: createElement
+    })), createElement("button", {
+      className: (0, _lib.cx)('ais-AutocompleteItemActionButton', 'ais-AutocompleteRecentSearchItemApplyButton', classNames.applyButton),
+      title: "Apply ".concat(item.query, " as search"),
+      onClick: function onClick(evt) {
+        evt.stopPropagation();
+        onApply();
+      }
+    }, createElement(_icons.ApplyIcon, {
+      createElement: createElement
     }))));
   };
 }

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

@@ -9,11 +9,11 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _icons = require("./icons");
 function createAutocompleteSearchComponent(_ref) {
   var createElement = _ref.createElement;
-  return function AutocompleteSearch(_ref2) {
-    var inputProps = _ref2.inputProps,
-      onClear = _ref2.onClear,
-      query = _ref2.query,
-      isSearchStalled = _ref2.isSearchStalled;
+  return function AutocompleteSearch(userProps) {
+    var inputProps = userProps.inputProps,
+      onClear = userProps.onClear,
+      query = userProps.query,
+      isSearchStalled = userProps.isSearchStalled;
     var inputRef = inputProps.ref;
     return createElement("form", {
       className: "ais-AutocompleteForm",

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

@@ -8,11 +8,13 @@ var _lib = require("../../lib");
 var _icons = require("./icons");
 function createAutocompleteSuggestionComponent(_ref) {
   var createElement = _ref.createElement;
-  return function AutocompleteSuggestion(_ref2) {
-    var children = _ref2.children,
-      onSelect = _ref2.onSelect,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
+  return function AutocompleteSuggestion(userProps) {
+    var item = userProps.item,
+      children = userProps.children,
+      onSelect = userProps.onSelect,
+      onApply = userProps.onApply,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames;
     return createElement("div", {
       onClick: onSelect,
       className: (0, _lib.cx)('ais-AutocompleteItemWrapper', 'ais-AutocompleteSuggestionWrapper', classNames.root)
@@ -24,6 +26,18 @@ function createAutocompleteSuggestionComponent(_ref) {
       createElement: createElement
     })), createElement("div", {
       className: (0, _lib.cx)('ais-AutocompleteItemContentBody', 'ais-AutocompleteSuggestionItemContentBody', classNames.content)
-    }, children)));
+    }, children)), createElement("div", {
+      className: (0, _lib.cx)('ais-AutocompleteItemActions', 'ais-AutocompleteSuggestionItemActions', classNames.actions)
+    }, createElement("button", {
+      className: (0, _lib.cx)('ais-AutocompleteItemActionButton', 'ais-AutocompleteSuggestionItemApplyButton', classNames.applyButton),
+      type: "button",
+      title: "Apply ".concat(item.query, " as search"),
+      onClick: function onClick(evt) {
+        evt.stopPropagation();
+        onApply();
+      }
+    }, createElement(_icons.ApplyIcon, {
+      createElement: createElement
+    }))));
   };
 }

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

@@ -18,6 +18,7 @@ function createAutocompletePropGetters(_ref) {
       indicesConfig = _ref2.indicesConfig,
       onRefine = _ref2.onRefine,
       globalOnSelect = _ref2.onSelect,
+      _onApply = _ref2.onApply,
       placeholder = _ref2.placeholder;
     var getElementId = createGetElementId(useId());
     var inputRef = useRef(null);
@@ -185,6 +186,13 @@ function createAutocompletePropGetters(_ref) {
             return submit({
               activeDescendant: id
             });
+          },
+          onApply: function onApply() {
+            var _getQuery2;
+            var _ref4 = items.get(id),
+              currentItem = _ref4.item,
+              getQuery = _ref4.config.getQuery;
+            _onApply((_getQuery2 = getQuery === null || getQuery === void 0 ? void 0 : getQuery(currentItem)) !== null && _getQuery2 !== void 0 ? _getQuery2 : '');
           }
         };
       },
@@ -204,10 +212,10 @@ function createAutocompletePropGetters(_ref) {
     };
   };
 }
-function buildItems(_ref4) {
-  var indices = _ref4.indices,
-    indicesConfig = _ref4.indicesConfig,
-    getElementId = _ref4.getElementId;
+function buildItems(_ref5) {
+  var indices = _ref5.indices,
+    indicesConfig = _ref5.indicesConfig,
+    getElementId = _ref5.getElementId;
   var itemsIds = [];
   var items = new Map();
   for (var i = 0; i < indicesConfig.length; i++) {

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.ApplyIcon = ApplyIcon;
 exports.ClearIcon = ClearIcon;
 exports.ClockIcon = ClockIcon;
 exports.LoadingIcon = LoadingIcon;
@@ -67,4 +68,13 @@ function TrashIcon(_ref5) {
   }, 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"
   }));
+}
+function ApplyIcon(_ref6) {
+  var createElement = _ref6.createElement;
+  return createElement("svg", {
+    viewBox: "0 0 24 24",
+    fill: "currentColor"
+  }, createElement("path", {
+    d: "M8 17v-7.586l8.293 8.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-8.293-8.293h7.586c0.552 0 1-0.448 1-1s-0.448-1-1-1h-10c-0.552 0-1 0.448-1 1v10c0 0.552 0.448 1 1 1s1-0.448 1-1z"
+  }));
 }

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

@@ -35,22 +35,22 @@ function createChatComponent(_ref) {
     createElement: createElement,
     Fragment: Fragment
   });
-  return function Chat(_ref2) {
-    var open = _ref2.open,
-      _ref2$maximized = _ref2.maximized,
-      maximized = _ref2$maximized === void 0 ? false : _ref2$maximized,
-      headerProps = _ref2.headerProps,
-      toggleButtonProps = _ref2.toggleButtonProps,
-      messagesProps = _ref2.messagesProps,
-      _ref2$promptProps = _ref2.promptProps,
-      promptProps = _ref2$promptProps === void 0 ? {} : _ref2$promptProps,
-      HeaderComponent = _ref2.headerComponent,
-      PromptComponent = _ref2.promptComponent,
-      ToggleButtonComponent = _ref2.toggleButtonComponent,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames,
-      className = _ref2.className,
-      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  return function Chat(userProps) {
+    var open = userProps.open,
+      _userProps$maximized = userProps.maximized,
+      maximized = _userProps$maximized === void 0 ? false : _userProps$maximized,
+      headerProps = userProps.headerProps,
+      toggleButtonProps = userProps.toggleButtonProps,
+      messagesProps = userProps.messagesProps,
+      _userProps$promptProp = userProps.promptProps,
+      promptProps = _userProps$promptProp === void 0 ? {} : _userProps$promptProp,
+      HeaderComponent = userProps.headerComponent,
+      PromptComponent = userProps.promptComponent,
+      ToggleButtonComponent = userProps.toggleButtonComponent,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      className = userProps.className,
+      props = (0, _objectWithoutProperties2.default)(userProps, _excluded);
     return createElement("div", (0, _extends2.default)({}, props, {
       className: (0, _lib.cx)('ais-Chat', maximized && 'ais-Chat--maximized', classNames.root, className)
     }), createElement("div", {

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

@@ -19,22 +19,22 @@ function createChatHeaderComponent(_ref) {
   var Button = (0, _Button.createButtonComponent)({
     createElement: createElement
   });
-  return function ChatHeader(_ref2) {
-    var _ref2$maximized = _ref2.maximized,
-      maximized = _ref2$maximized === void 0 ? false : _ref2$maximized,
-      onToggleMaximize = _ref2.onToggleMaximize,
-      onClose = _ref2.onClose,
-      onClear = _ref2.onClear,
-      _ref2$canClear = _ref2.canClear,
-      canClear = _ref2$canClear === void 0 ? false : _ref2$canClear,
-      CloseIcon = _ref2.closeIconComponent,
-      MinimizeIcon = _ref2.minimizeIconComponent,
-      MaximizeIcon = _ref2.maximizeIconComponent,
-      TitleIcon = _ref2.titleIconComponent,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames,
-      userTranslations = _ref2.translations,
-      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  return function ChatHeader(userProps) {
+    var _userProps$maximized = userProps.maximized,
+      maximized = _userProps$maximized === void 0 ? false : _userProps$maximized,
+      onToggleMaximize = userProps.onToggleMaximize,
+      onClose = userProps.onClose,
+      onClear = userProps.onClear,
+      _userProps$canClear = userProps.canClear,
+      canClear = _userProps$canClear === void 0 ? false : _userProps$canClear,
+      CloseIcon = userProps.closeIconComponent,
+      MinimizeIcon = userProps.minimizeIconComponent,
+      MaximizeIcon = userProps.maximizeIconComponent,
+      TitleIcon = userProps.titleIconComponent,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      userTranslations = userProps.translations,
+      props = (0, _objectWithoutProperties2.default)(userProps, _excluded);
     var translations = _objectSpread({
       title: 'Chat',
       minimizeLabel: 'Minimize chat',

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

@@ -18,11 +18,11 @@ function createChatMessageErrorComponent(_ref) {
   var Button = (0, _Button.createButtonComponent)({
     createElement: createElement
   });
-  return function ChatMessageError(_ref2) {
-    var onReload = _ref2.onReload,
-      actions = _ref2.actions,
-      userTranslations = _ref2.translations,
-      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  return function ChatMessageError(userProps) {
+    var onReload = userProps.onReload,
+      actions = userProps.actions,
+      userTranslations = userProps.translations,
+      props = (0, _objectWithoutProperties2.default)(userProps, _excluded);
     var translations = _objectSpread({
       errorMessage: 'Sorry, we are not able to generate a response at the moment. Please retry or contact support.',
       retryText: 'Retry'

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

@@ -14,9 +14,9 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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; }
 function createChatMessageLoaderComponent(_ref) {
   var createElement = _ref.createElement;
-  return function ChatMessageLoader(_ref2) {
-    var userTranslations = _ref2.translations,
-      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  return function ChatMessageLoader(userProps) {
+    var userTranslations = userProps.translations,
+      props = (0, _objectWithoutProperties2.default)(userProps, _excluded);
     var translations = _objectSpread({
       loaderText: 'Thinking...'
     }, userTranslations);

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

@@ -16,14 +16,14 @@ function createChatToggleButtonComponent(_ref) {
   var Button = (0, _Button.createButtonComponent)({
     createElement: createElement
   });
-  return function ChatToggleButton(_ref2) {
-    var open = _ref2.open,
-      onClick = _ref2.onClick,
-      ToggleIcon = _ref2.toggleIconComponent,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames,
-      className = _ref2.className,
-      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  return function ChatToggleButton(userProps) {
+    var open = userProps.open,
+      onClick = userProps.onClick,
+      ToggleIcon = userProps.toggleIconComponent,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      className = userProps.className,
+      props = (0, _objectWithoutProperties2.default)(userProps, _excluded);
     var defaultIcon = open ? createElement(_icons.ChevronUpIcon, {
       createElement: createElement
     }) : createElement(_icons.SparklesIcon, {

package/dist/cjs/version.js

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

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

@@ -11,9 +11,11 @@ export type AutocompleteIndexProps<T = {
     ItemComponent: (props: {
         item: T;
         onSelect: () => void;
+        onApply: () => void;
     }) => JSX.Element;
     getItemProps: (item: T, index: number) => Omit<ComponentProps<'li'>, 'onSelect'> & {
         onSelect: () => void;
+        onApply: () => void;
     };
     classNames?: Partial<AutocompleteIndexClassNames>;
 };

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

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["className", "onSelect"];
+var _excluded = ["className", "onSelect", "onApply"];
 import { cx } from "../../lib/cx.js";
 export function createAutocompleteIndexComponent(_ref) {
   var createElement = _ref.createElement;
@@ -23,6 +23,7 @@ export function createAutocompleteIndexComponent(_ref) {
       var _getItemProps = getItemProps(item, index),
         className = _getItemProps.className,
         onSelect = _getItemProps.onSelect,
+        onApply = _getItemProps.onApply,
         itemProps = _objectWithoutProperties(_getItemProps, _excluded);
       return createElement("li", _extends({
         key: "".concat(itemProps.id, ":").concat(item.objectID)
@@ -30,7 +31,8 @@ export function createAutocompleteIndexComponent(_ref) {
         className: cx('ais-AutocompleteIndexItem', classNames.item, className)
       }), createElement(ItemComponent, {
         item: item,
-        onSelect: onSelect
+        onSelect: onSelect,
+        onApply: onApply
       }));
     })));
   };

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

@@ -7,6 +7,7 @@ export type AutocompleteRecentSearchProps<T = {
     children?: ComponentChildren;
     onSelect: () => void;
     onRemoveRecentSearch: () => void;
+    onApply: () => void;
     classNames?: Partial<AutocompleteRecentSearchClassNames>;
 };
 export type AutocompleteRecentSearchClassNames = {
@@ -34,5 +35,9 @@ export type AutocompleteRecentSearchClassNames = {
      * Class names to apply to the delete button element
      **/
     deleteButton: string | string[];
+    /**
+     * Class names to apply to the apply button element
+     **/
+    applyButton: string | string[];
 };
-export declare function createAutocompleteRecentSearchComponent({ createElement, }: Renderer): ({ item, children, onSelect, onRemoveRecentSearch, classNames, }: AutocompleteRecentSearchProps) => JSX.Element;
+export declare function createAutocompleteRecentSearchComponent({ createElement, }: Renderer): (userProps: AutocompleteRecentSearchProps) => JSX.Element;

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

@@ -1,14 +1,15 @@
 import { cx } from "../../lib/index.js";
-import { ClockIcon, TrashIcon } from "./icons.js";
+import { ApplyIcon, ClockIcon, TrashIcon } 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 function AutocompleteRecentSearch(userProps) {
+    var item = userProps.item,
+      children = userProps.children,
+      onSelect = userProps.onSelect,
+      onRemoveRecentSearch = userProps.onRemoveRecentSearch,
+      onApply = userProps.onApply,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames;
     return createElement("div", {
       onClick: onSelect,
       className: cx('ais-AutocompleteItemWrapper ais-AutocompleteRecentSearchWrapper', classNames.root)
@@ -31,6 +32,15 @@ export function createAutocompleteRecentSearchComponent(_ref) {
       }
     }, createElement(TrashIcon, {
       createElement: createElement
+    })), createElement("button", {
+      className: cx('ais-AutocompleteItemActionButton', 'ais-AutocompleteRecentSearchItemApplyButton', classNames.applyButton),
+      title: "Apply ".concat(item.query, " as search"),
+      onClick: function onClick(evt) {
+        evt.stopPropagation();
+        onApply();
+      }
+    }, createElement(ApplyIcon, {
+      createElement: createElement
     }))));
   };
 }

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

@@ -1,8 +1,8 @@
 import type { ComponentProps, Renderer } from '../..';
 export type AutocompleteSearchProps = {
-    inputProps: Partial<ComponentProps<'input'>>;
+    inputProps: ComponentProps<'input'>;
     onClear: () => void;
     query: string;
     isSearchStalled: boolean;
 };
-export declare function createAutocompleteSearchComponent({ createElement }: Renderer): ({ inputProps, onClear, query, isSearchStalled, }: AutocompleteSearchProps) => JSX.Element;
+export declare function createAutocompleteSearchComponent({ createElement }: Renderer): (userProps: AutocompleteSearchProps) => JSX.Element;

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

@@ -2,11 +2,11 @@ import _extends from "@babel/runtime/helpers/extends";
 import { ClearIcon, LoadingIcon, SubmitIcon } from "./icons.js";
 export function createAutocompleteSearchComponent(_ref) {
   var createElement = _ref.createElement;
-  return function AutocompleteSearch(_ref2) {
-    var inputProps = _ref2.inputProps,
-      onClear = _ref2.onClear,
-      query = _ref2.query,
-      isSearchStalled = _ref2.isSearchStalled;
+  return function AutocompleteSearch(userProps) {
+    var inputProps = userProps.inputProps,
+      onClear = userProps.onClear,
+      query = userProps.query,
+      isSearchStalled = userProps.isSearchStalled;
     var inputRef = inputProps.ref;
     return createElement("form", {
       className: "ais-AutocompleteForm",

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

@@ -5,6 +5,7 @@ export type AutocompleteSuggestionProps<T = {
 } & Record<string, unknown>> = {
     item: T;
     onSelect: () => void;
+    onApply: () => void;
     children: ComponentChildren;
     classNames?: Partial<AutocompleteSuggestionClassNames>;
 };
@@ -21,5 +22,7 @@ export type AutocompleteSuggestionClassNames = {
     icon: string | string[];
     /** Class names to apply to the body element **/
     body: string | string[];
+    /** Class names to apply to the apply button element **/
+    applyButton: string | string[];
 };
-export declare function createAutocompleteSuggestionComponent({ createElement, }: Renderer): ({ children, onSelect, classNames, }: AutocompleteSuggestionProps) => JSX.Element;
+export declare function createAutocompleteSuggestionComponent({ createElement, }: Renderer): (userProps: AutocompleteSuggestionProps) => JSX.Element;

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

@@ -1,12 +1,14 @@
 import { cx } from "../../lib/index.js";
-import { SubmitIcon } from "./icons.js";
+import { SubmitIcon, ApplyIcon } from "./icons.js";
 export function createAutocompleteSuggestionComponent(_ref) {
   var createElement = _ref.createElement;
-  return function AutocompleteSuggestion(_ref2) {
-    var children = _ref2.children,
-      onSelect = _ref2.onSelect,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames;
+  return function AutocompleteSuggestion(userProps) {
+    var item = userProps.item,
+      children = userProps.children,
+      onSelect = userProps.onSelect,
+      onApply = userProps.onApply,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames;
     return createElement("div", {
       onClick: onSelect,
       className: cx('ais-AutocompleteItemWrapper', 'ais-AutocompleteSuggestionWrapper', classNames.root)
@@ -18,6 +20,18 @@ export function createAutocompleteSuggestionComponent(_ref) {
       createElement: createElement
     })), createElement("div", {
       className: cx('ais-AutocompleteItemContentBody', 'ais-AutocompleteSuggestionItemContentBody', classNames.content)
-    }, children)));
+    }, children)), createElement("div", {
+      className: cx('ais-AutocompleteItemActions', 'ais-AutocompleteSuggestionItemActions', classNames.actions)
+    }, createElement("button", {
+      className: cx('ais-AutocompleteItemActionButton', 'ais-AutocompleteSuggestionItemApplyButton', classNames.applyButton),
+      type: "button",
+      title: "Apply ".concat(item.query, " as search"),
+      onClick: function onClick(evt) {
+        evt.stopPropagation();
+        onApply();
+      }
+    }, createElement(ApplyIcon, {
+      createElement: createElement
+    }))));
   };
 }

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

@@ -1,4 +1,4 @@
-import type { ComponentProps } from '../../types';
+import type { ComponentProps, MutableRef } from '../../types';
 type BaseHit = Record<string, unknown>;
 export type AutocompleteIndexConfig<TItem extends BaseHit> = {
     indexName: string;
@@ -11,14 +11,27 @@ export type AutocompleteIndexConfig<TItem extends BaseHit> = {
         url?: string;
     }) => void;
 };
-type GetInputProps = () => Partial<ComponentProps<'input'>>;
+type GetInputProps = () => ComponentProps<'input'>;
+type ValidAriaRole = 'combobox' | 'row' | 'grid';
 type GetItemProps = (item: {
     __indexName: string;
-} & Record<string, unknown>, index: number) => Pick<ComponentProps<'li'>, 'id' | 'role' | 'aria-selected'> & {
+} & Record<string, unknown>, index: number) => {
+    id?: string;
+    role?: ValidAriaRole;
+    'aria-selected'?: boolean;
+} & {
     onSelect: () => void;
+    onApply: () => void;
+};
+type GetPanelProps = () => {
+    id?: string;
+    hidden?: boolean;
+    role?: ValidAriaRole;
+    'aria-labelledby'?: string;
+};
+type GetRootProps = () => {
+    ref?: MutableRef<HTMLDivElement | null>;
 };
-type GetPanelProps = () => Pick<ComponentProps<'div'>, 'id' | 'hidden' | 'role' | 'aria-labelledby'>;
-type GetRootProps = () => Pick<ComponentProps<'div'>, 'ref'>;
 type CreateAutocompletePropGettersParams = {
     useEffect: (effect: () => void, inputs?: readonly unknown[]) => void;
     useId: () => string;
@@ -39,6 +52,7 @@ export type UsePropGetters<TItem extends BaseHit> = (params: {
     indicesConfig: Array<AutocompleteIndexConfig<TItem>>;
     onRefine: (query: string) => void;
     onSelect: NonNullable<AutocompleteIndexConfig<TItem>['onSelect']>;
+    onApply: (query: string) => void;
     placeholder?: string;
 }) => {
     getInputProps: GetInputProps;
@@ -46,5 +60,5 @@ export type UsePropGetters<TItem extends BaseHit> = (params: {
     getPanelProps: GetPanelProps;
     getRootProps: GetRootProps;
 };
-export declare function createAutocompletePropGetters({ useEffect, useId, useMemo, useRef, useState, }: CreateAutocompletePropGettersParams): <TItem extends BaseHit>({ indices, indicesConfig, onRefine, onSelect: globalOnSelect, placeholder, }: Parameters<UsePropGetters<TItem>>[0]) => ReturnType<UsePropGetters<TItem>>;
+export declare function createAutocompletePropGetters({ useEffect, useId, useMemo, useRef, useState, }: CreateAutocompletePropGettersParams): <TItem extends BaseHit>({ indices, indicesConfig, onRefine, onSelect: globalOnSelect, onApply, placeholder, }: Parameters<UsePropGetters<TItem>>[0]) => ReturnType<UsePropGetters<TItem>>;
 export {};

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

@@ -11,6 +11,7 @@ export function createAutocompletePropGetters(_ref) {
       indicesConfig = _ref2.indicesConfig,
       onRefine = _ref2.onRefine,
       globalOnSelect = _ref2.onSelect,
+      _onApply = _ref2.onApply,
       placeholder = _ref2.placeholder;
     var getElementId = createGetElementId(useId());
     var inputRef = useRef(null);
@@ -178,6 +179,13 @@ export function createAutocompletePropGetters(_ref) {
             return submit({
               activeDescendant: id
             });
+          },
+          onApply: function onApply() {
+            var _getQuery2;
+            var _ref4 = items.get(id),
+              currentItem = _ref4.item,
+              getQuery = _ref4.config.getQuery;
+            _onApply((_getQuery2 = getQuery === null || getQuery === void 0 ? void 0 : getQuery(currentItem)) !== null && _getQuery2 !== void 0 ? _getQuery2 : '');
           }
         };
       },
@@ -197,10 +205,10 @@ export function createAutocompletePropGetters(_ref) {
     };
   };
 }
-function buildItems(_ref4) {
-  var indices = _ref4.indices,
-    indicesConfig = _ref4.indicesConfig,
-    getElementId = _ref4.getElementId;
+function buildItems(_ref5) {
+  var indices = _ref5.indices,
+    indicesConfig = _ref5.indicesConfig,
+    getElementId = _ref5.getElementId;
   var itemsIds = [];
   var items = new Map();
   for (var i = 0; i < indicesConfig.length; i++) {

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

@@ -6,4 +6,5 @@ export declare function LoadingIcon({ createElement }: IconProps): JSX.Element;
 export declare function ClearIcon({ createElement }: IconProps): JSX.Element;
 export declare function ClockIcon({ createElement }: IconProps): JSX.Element;
 export declare function TrashIcon({ createElement }: IconProps): JSX.Element;
+export declare function ApplyIcon({ createElement }: IconProps): JSX.Element;
 export {};

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

@@ -57,4 +57,13 @@ export function TrashIcon(_ref5) {
   }, 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"
   }));
+}
+export function ApplyIcon(_ref6) {
+  var createElement = _ref6.createElement;
+  return createElement("svg", {
+    viewBox: "0 0 24 24",
+    fill: "currentColor"
+  }, createElement("path", {
+    d: "M8 17v-7.586l8.293 8.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-8.293-8.293h7.586c0.552 0 1-0.448 1-1s-0.448-1-1-1h-10c-0.552 0-1 0.448-1 1v10c0 0.552 0.448 1 1 1s1-0.448 1-1z"
+  }));
 }

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

@@ -40,4 +40,4 @@ export type ChatProps = Omit<ComponentProps<'div'>, 'onError' | 'title'> & {
      */
     toggleButtonComponent?: (props: ChatToggleButtonOwnProps) => JSX.Element;
 };
-export declare function createChatComponent({ createElement, Fragment }: Renderer): ({ open, maximized, headerProps, toggleButtonProps, messagesProps, promptProps, headerComponent: HeaderComponent, promptComponent: PromptComponent, toggleButtonComponent: ToggleButtonComponent, classNames, className, ...props }: ChatProps) => JSX.Element;
+export declare function createChatComponent({ createElement, Fragment }: Renderer): (userProps: ChatProps) => JSX.Element;

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

@@ -28,22 +28,22 @@ export function createChatComponent(_ref) {
     createElement: createElement,
     Fragment: Fragment
   });
-  return function Chat(_ref2) {
-    var open = _ref2.open,
-      _ref2$maximized = _ref2.maximized,
-      maximized = _ref2$maximized === void 0 ? false : _ref2$maximized,
-      headerProps = _ref2.headerProps,
-      toggleButtonProps = _ref2.toggleButtonProps,
-      messagesProps = _ref2.messagesProps,
-      _ref2$promptProps = _ref2.promptProps,
-      promptProps = _ref2$promptProps === void 0 ? {} : _ref2$promptProps,
-      HeaderComponent = _ref2.headerComponent,
-      PromptComponent = _ref2.promptComponent,
-      ToggleButtonComponent = _ref2.toggleButtonComponent,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames,
-      className = _ref2.className,
-      props = _objectWithoutProperties(_ref2, _excluded);
+  return function Chat(userProps) {
+    var open = userProps.open,
+      _userProps$maximized = userProps.maximized,
+      maximized = _userProps$maximized === void 0 ? false : _userProps$maximized,
+      headerProps = userProps.headerProps,
+      toggleButtonProps = userProps.toggleButtonProps,
+      messagesProps = userProps.messagesProps,
+      _userProps$promptProp = userProps.promptProps,
+      promptProps = _userProps$promptProp === void 0 ? {} : _userProps$promptProp,
+      HeaderComponent = userProps.headerComponent,
+      PromptComponent = userProps.promptComponent,
+      ToggleButtonComponent = userProps.toggleButtonComponent,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      className = userProps.className,
+      props = _objectWithoutProperties(userProps, _excluded);
     return createElement("div", _extends({}, props, {
       className: cx('ais-Chat', maximized && 'ais-Chat--maximized', classNames.root, className)
     }), createElement("div", {

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

@@ -96,4 +96,4 @@ export type ChatHeaderOwnProps = {
     translations?: Partial<ChatHeaderTranslations>;
 };
 export type ChatHeaderProps = ComponentProps<'div'> & ChatHeaderOwnProps;
-export declare function createChatHeaderComponent({ createElement }: Renderer): ({ maximized, onToggleMaximize, onClose, onClear, canClear, closeIconComponent: CloseIcon, minimizeIconComponent: MinimizeIcon, maximizeIconComponent: MaximizeIcon, titleIconComponent: TitleIcon, classNames, translations: userTranslations, ...props }: ChatHeaderProps) => JSX.Element;
+export declare function createChatHeaderComponent({ createElement }: Renderer): (userProps: ChatHeaderProps) => JSX.Element;

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

@@ -12,22 +12,22 @@ export function createChatHeaderComponent(_ref) {
   var Button = createButtonComponent({
     createElement: createElement
   });
-  return function ChatHeader(_ref2) {
-    var _ref2$maximized = _ref2.maximized,
-      maximized = _ref2$maximized === void 0 ? false : _ref2$maximized,
-      onToggleMaximize = _ref2.onToggleMaximize,
-      onClose = _ref2.onClose,
-      onClear = _ref2.onClear,
-      _ref2$canClear = _ref2.canClear,
-      canClear = _ref2$canClear === void 0 ? false : _ref2$canClear,
-      CloseIcon = _ref2.closeIconComponent,
-      MinimizeIcon = _ref2.minimizeIconComponent,
-      MaximizeIcon = _ref2.maximizeIconComponent,
-      TitleIcon = _ref2.titleIconComponent,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames,
-      userTranslations = _ref2.translations,
-      props = _objectWithoutProperties(_ref2, _excluded);
+  return function ChatHeader(userProps) {
+    var _userProps$maximized = userProps.maximized,
+      maximized = _userProps$maximized === void 0 ? false : _userProps$maximized,
+      onToggleMaximize = userProps.onToggleMaximize,
+      onClose = userProps.onClose,
+      onClear = userProps.onClear,
+      _userProps$canClear = userProps.canClear,
+      canClear = _userProps$canClear === void 0 ? false : _userProps$canClear,
+      CloseIcon = userProps.closeIconComponent,
+      MinimizeIcon = userProps.minimizeIconComponent,
+      MaximizeIcon = userProps.maximizeIconComponent,
+      TitleIcon = userProps.titleIconComponent,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      userTranslations = userProps.translations,
+      props = _objectWithoutProperties(userProps, _excluded);
     var translations = _objectSpread({
       title: 'Chat',
       minimizeLabel: 'Minimize chat',

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

@@ -24,4 +24,4 @@ export type ChatMessageErrorProps = ComponentProps<'article'> & {
      */
     translations?: Partial<ChatMessageErrorTranslations>;
 };
-export declare function createChatMessageErrorComponent({ createElement, }: Pick<Renderer, 'createElement'>): ({ onReload, actions, translations: userTranslations, ...props }: ChatMessageErrorProps) => JSX.Element;
+export declare function createChatMessageErrorComponent({ createElement, }: Pick<Renderer, 'createElement'>): (userProps: ChatMessageErrorProps) => JSX.Element;

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

@@ -11,11 +11,11 @@ export function createChatMessageErrorComponent(_ref) {
   var Button = createButtonComponent({
     createElement: createElement
   });
-  return function ChatMessageError(_ref2) {
-    var onReload = _ref2.onReload,
-      actions = _ref2.actions,
-      userTranslations = _ref2.translations,
-      props = _objectWithoutProperties(_ref2, _excluded);
+  return function ChatMessageError(userProps) {
+    var onReload = userProps.onReload,
+      actions = userProps.actions,
+      userTranslations = userProps.translations,
+      props = _objectWithoutProperties(userProps, _excluded);
     var translations = _objectSpread({
       errorMessage: 'Sorry, we are not able to generate a response at the moment. Please retry or contact support.',
       retryText: 'Retry'

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

@@ -12,4 +12,4 @@ export type ChatMessageLoaderProps = ComponentProps<'article'> & {
      */
     translations?: Partial<ChatMessageLoaderTranslations>;
 };
-export declare function createChatMessageLoaderComponent({ createElement, }: Pick<Renderer, 'createElement'>): ({ translations: userTranslations, ...props }: ChatMessageLoaderProps) => JSX.Element;
+export declare function createChatMessageLoaderComponent({ createElement, }: Pick<Renderer, 'createElement'>): (userProps: ChatMessageLoaderProps) => JSX.Element;

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

@@ -7,9 +7,9 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { LoadingSpinnerIcon } from "./icons.js";
 export function createChatMessageLoaderComponent(_ref) {
   var createElement = _ref.createElement;
-  return function ChatMessageLoader(_ref2) {
-    var userTranslations = _ref2.translations,
-      props = _objectWithoutProperties(_ref2, _excluded);
+  return function ChatMessageLoader(userProps) {
+    var userTranslations = userProps.translations,
+      props = _objectWithoutProperties(userProps, _excluded);
     var translations = _objectSpread({
       loaderText: 'Thinking...'
     }, userTranslations);

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

@@ -105,11 +105,11 @@ export type ChatPromptOwnProps = {
     /**
      * Callback when the form is submitted
      */
-    onSubmit?: ComponentProps<'textarea'>['onSubmit'];
+    onSubmit?: (event: SubmitEvent) => void;
     /**
      * Callback when the textarea value changes
      */
-    onInput?: ComponentProps<'textarea'>['onInput'];
+    onInput?: (event: InputEvent) => void;
     /**
      * Ref to the prompt textarea element for focus management
      */

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

@@ -26,4 +26,4 @@ export type ChatToggleButtonOwnProps = {
     classNames?: Partial<ChatToggleButtonClassNames>;
 };
 export type ChatToggleButtonProps = ComponentProps<'button'> & ChatToggleButtonOwnProps;
-export declare function createChatToggleButtonComponent({ createElement }: Renderer): ({ open, onClick, toggleIconComponent: ToggleIcon, classNames, className, ...props }: ChatToggleButtonProps) => JSX.Element;
+export declare function createChatToggleButtonComponent({ createElement }: Renderer): (userProps: ChatToggleButtonProps) => JSX.Element;

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

@@ -9,14 +9,14 @@ export function createChatToggleButtonComponent(_ref) {
   var Button = createButtonComponent({
     createElement: createElement
   });
-  return function ChatToggleButton(_ref2) {
-    var open = _ref2.open,
-      onClick = _ref2.onClick,
-      ToggleIcon = _ref2.toggleIconComponent,
-      _ref2$classNames = _ref2.classNames,
-      classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames,
-      className = _ref2.className,
-      props = _objectWithoutProperties(_ref2, _excluded);
+  return function ChatToggleButton(userProps) {
+    var open = userProps.open,
+      onClick = userProps.onClick,
+      ToggleIcon = userProps.toggleIconComponent,
+      _userProps$classNames = userProps.classNames,
+      classNames = _userProps$classNames === void 0 ? {} : _userProps$classNames,
+      className = userProps.className,
+      props = _objectWithoutProperties(userProps, _excluded);
     var defaultIcon = open ? createElement(ChevronUpIcon, {
       createElement: createElement
     }) : createElement(SparklesIcon, {

package/dist/es/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "0.15.1";
+declare const _default: "0.16.0";
 export default _default;

package/dist/es/version.js

@@ -1 +1 @@
-export default '0.15.1';
+export default '0.16.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "instantsearch-ui-components",
-  "version": "0.15.1",
+  "version": "0.16.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": "417c7fb9ebaa31063d7a817466a303ce51558453"
+  "gitHead": "13c7c916b870f34f5f6dde9bd7b16850990dc7ea"
 }