instantsearch-ui-components 0.14.0 → 0.15.1

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

@@ -10,8 +10,10 @@ export function createAutocompletePropGetters(_ref) {
     var indices = _ref2.indices,
       indicesConfig = _ref2.indicesConfig,
       onRefine = _ref2.onRefine,
-      globalOnSelect = _ref2.onSelect;
+      globalOnSelect = _ref2.onSelect,
+      placeholder = _ref2.placeholder;
     var getElementId = createGetElementId(useId());
+    var inputRef = useRef(null);
     var rootRef = useRef(null);
     var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -43,7 +45,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 +64,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,43 +100,54 @@ export function createAutocompletePropGetters(_ref) {
       getInputProps: function getInputProps() {
         return {
           id: getElementId('input'),
+          ref: inputRef,
           role: 'combobox',
           'aria-autocomplete': 'list',
           'aria-expanded': isOpen,
           'aria-haspopup': 'grid',
           'aria-controls': getElementId('panel'),
           'aria-activedescendant': activeDescendant,
+          placeholder: placeholder,
           onFocus: function onFocus() {
             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 +175,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

@@ -38,6 +38,17 @@ export declare function createAutocompleteStorage({ useEffect, useMemo, useState
         objectID: string;
         query: string;
         __indexName: string;
+        _highlightResult: {
+            query: {
+                matchLevel: string;
+                value?: undefined;
+            };
+        } | {
+            query: {
+                value: string;
+                matchLevel?: undefined;
+            };
+        };
     }[];
     indicesForPropGetters: {
         indexName: string;

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

@@ -44,7 +44,13 @@ export function createAutocompleteStorage(_ref) {
       return {
         objectID: value,
         query: value,
-        __indexName: 'recent-searches'
+        __indexName: 'recent-searches',
+        _highlightResult: getHighlightedAttribute({
+          item: {
+            query: value
+          },
+          query: query || ''
+        })
       };
     });
     var indicesForPropGetters = _toConsumableArray(indices);
@@ -80,6 +86,24 @@ function isLocalStorageSupported() {
     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()) {
@@ -104,10 +128,10 @@ function getLocalStorage() {
     }
   };
 }
-export function createStorage(_ref3) {
-  var _ref3$limit = _ref3.limit,
-    limit = _ref3$limit === void 0 ? 5 : _ref3$limit,
-    storageKey = _ref3.storageKey;
+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 {

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

@@ -1,9 +1,9 @@
 /** @jsx createElement */
 import type { Renderer } from '../../types';
 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 declare function SubmitIcon({ createElement }: IconProps): JSX.Element;
+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 {};

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

@@ -1,22 +1,18 @@
-export function AutocompleteSubmitIcon(_ref) {
+export function SubmitIcon(_ref) {
   var createElement = _ref.createElement;
   return createElement("svg", {
     className: "ais-AutocompleteSubmitIcon",
     viewBox: "0 0 24 24",
-    width: "20",
-    height: "20",
     fill: "currentColor"
   }, createElement("path", {
     d: "M16.041 15.856c-0.034 0.026-0.067 0.055-0.099 0.087s-0.060 0.064-0.087 0.099c-1.258 1.213-2.969 1.958-4.855 1.958-1.933 0-3.682-0.782-4.95-2.050s-2.050-3.017-2.050-4.95 0.782-3.682 2.050-4.95 3.017-2.050 4.95-2.050 3.682 0.782 4.95 2.050 2.050 3.017 2.050 4.95c0 1.886-0.745 3.597-1.959 4.856zM21.707 20.293l-3.675-3.675c1.231-1.54 1.968-3.493 1.968-5.618 0-2.485-1.008-4.736-2.636-6.364s-3.879-2.636-6.364-2.636-4.736 1.008-6.364 2.636-2.636 3.879-2.636 6.364 1.008 4.736 2.636 6.364 3.879 2.636 6.364 2.636c2.125 0 4.078-0.737 5.618-1.968l3.675 3.675c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414z"
   }));
 }
-export function AutocompleteLoadingIcon(_ref2) {
+export function LoadingIcon(_ref2) {
   var createElement = _ref2.createElement;
   return createElement("svg", {
     className: "ais-AutocompleteLoadingIcon",
-    viewBox: "0 0 100 100",
-    width: "20",
-    height: "20"
+    viewBox: "0 0 100 100"
   }, createElement("circle", {
     cx: "50",
     cy: "50",
@@ -34,19 +30,17 @@ export function AutocompleteLoadingIcon(_ref2) {
     keyTimes: "0;0.40;0.65;1"
   })));
 }
-export function AutocompleteClearIcon(_ref3) {
+export function ClearIcon(_ref3) {
   var createElement = _ref3.createElement;
   return createElement("svg", {
     className: "ais-AutocompleteClearIcon",
     viewBox: "0 0 24 24",
-    width: "18",
-    height: "18",
     fill: "currentColor"
   }, 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) {
+export function ClockIcon(_ref4) {
   var createElement = _ref4.createElement;
   return createElement("svg", {
     viewBox: "0 0 24 24",
@@ -55,7 +49,7 @@ export function AutocompleteClockIcon(_ref4) {
     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) {
+export function TrashIcon(_ref5) {
   var createElement = _ref5.createElement;
   return createElement("svg", {
     viewBox: "0 0 24 24",

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: CloseIconComponent, minimizeIconComponent: MinimizeIconComponent, maximizeIconComponent: MaximizeIconComponent, titleIconComponent: TitleIconComponent, classNames, translations: userTranslations, ...props }: ChatHeaderProps) => JSX.Element;
+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;

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

@@ -6,7 +6,7 @@ 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) { _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";
 import { createButtonComponent } from "../Button.js";
-import { SparklesIconComponent, MaximizeIconComponent as MaximizeIconComponentDefault, MinimizeIconComponent as MinimizeIconComponentDefault, CloseIconComponent as CloseIconComponentDefault } from "./icons.js";
+import { SparklesIcon, MaximizeIcon as MaximizeIconDefault, MinimizeIcon as MinimizeIconDefault, CloseIcon as CloseIconDefault } from "./icons.js";
 export function createChatHeaderComponent(_ref) {
   var createElement = _ref.createElement;
   var Button = createButtonComponent({
@@ -20,10 +20,10 @@ export function createChatHeaderComponent(_ref) {
       onClear = _ref2.onClear,
       _ref2$canClear = _ref2.canClear,
       canClear = _ref2$canClear === void 0 ? false : _ref2$canClear,
-      CloseIconComponent = _ref2.closeIconComponent,
-      MinimizeIconComponent = _ref2.minimizeIconComponent,
-      MaximizeIconComponent = _ref2.maximizeIconComponent,
-      TitleIconComponent = _ref2.titleIconComponent,
+      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,
@@ -35,9 +35,9 @@ export function createChatHeaderComponent(_ref) {
       closeLabel: 'Close chat',
       clearLabel: 'Clear'
     }, userTranslations);
-    var defaultMaximizeIcon = maximized ? createElement(MinimizeIconComponentDefault, {
+    var defaultMaximizeIcon = maximized ? createElement(MinimizeIconDefault, {
       createElement: createElement
-    }) : createElement(MaximizeIconComponentDefault, {
+    }) : createElement(MaximizeIconDefault, {
       createElement: createElement
     });
     return createElement("div", _extends({
@@ -46,10 +46,8 @@ export function createChatHeaderComponent(_ref) {
       className: cx('ais-ChatHeader-title', classNames.title)
     }, createElement("span", {
       className: cx('ais-ChatHeader-titleIcon', classNames.titleIcon)
-    }, TitleIconComponent ? createElement(TitleIconComponent, null) : createElement(SparklesIconComponent, {
-      createElement: createElement,
-      width: 20,
-      height: 20
+    }, TitleIcon ? createElement(TitleIcon, null) : createElement(SparklesIcon, {
+      createElement: createElement
     })), translations.title), createElement("div", {
       className: cx('ais-ChatHeader-actions')
     }, onClear && createElement(Button, {
@@ -65,7 +63,7 @@ export function createChatHeaderComponent(_ref) {
       className: cx('ais-ChatHeader-maximize', classNames.maximize),
       onClick: onToggleMaximize,
       "aria-label": maximized ? translations.minimizeLabel : translations.maximizeLabel
-    }, MaximizeIconComponent ? createElement(MaximizeIconComponent, {
+    }, MaximizeIcon ? createElement(MaximizeIcon, {
       maximized: maximized
     }) : defaultMaximizeIcon), createElement(Button, {
       variant: "ghost",
@@ -75,7 +73,7 @@ export function createChatHeaderComponent(_ref) {
       onClick: onClose,
       "aria-label": translations.closeLabel,
       title: translations.closeLabel
-    }, CloseIconComponent ? createElement(CloseIconComponent, null) : createElement(CloseIconComponentDefault, {
+    }, CloseIcon ? createElement(CloseIcon, null) : createElement(CloseIconDefault, {
       createElement: createElement
     }))));
   };

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

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { compiler } from 'markdown-to-jsx';
 import { cx, startsWith } from "../../lib/index.js";
 import { createButtonComponent } from "../Button.js";
-import { MenuIconComponent } from "./icons.js";
+import { MenuIcon } from "./icons.js";
 export function createChatMessageComponent(_ref) {
   var createElement = _ref.createElement;
   var Button = createButtonComponent({
@@ -124,7 +124,7 @@ export function createChatMessageComponent(_ref) {
           var _action$onClick;
           return (_action$onClick = action.onClick) === null || _action$onClick === void 0 ? void 0 : _action$onClick.call(action, message);
         }
-      }, action.icon ? createElement(action.icon, null) : createElement(MenuIconComponent, {
+      }, action.icon ? createElement(action.icon, null) : createElement(MenuIcon, {
         createElement: createElement
       }));
     })), FooterComponent && createElement("div", {

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

@@ -5,7 +5,7 @@ var _excluded = ["onReload", "actions", "translations"];
 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 { createButtonComponent } from "../Button.js";
-import { ReloadIconComponent } from "./icons.js";
+import { ReloadIcon } from "./icons.js";
 export function createChatMessageErrorComponent(_ref) {
   var createElement = _ref.createElement;
   var Button = createButtonComponent({
@@ -43,7 +43,7 @@ export function createChatMessageErrorComponent(_ref) {
       onClick: function onClick() {
         return onReload === null || onReload === void 0 ? void 0 : onReload();
       }
-    }, createElement(ReloadIconComponent, {
+    }, createElement(ReloadIcon, {
       createElement: createElement
     }), translations.retryText)))));
   };

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

@@ -4,7 +4,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["translations"];
 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 { LoadingSpinnerIconComponent } from "./icons.js";
+import { LoadingSpinnerIcon } from "./icons.js";
 export function createChatMessageLoaderComponent(_ref) {
   var createElement = _ref.createElement;
   return function ChatMessageLoader(_ref2) {
@@ -21,7 +21,7 @@ export function createChatMessageLoaderComponent(_ref) {
       className: "ais-ChatMessage-leading"
     }, createElement("div", {
       className: "ais-ChatMessageLoader-spinner"
-    }, createElement(LoadingSpinnerIconComponent, {
+    }, createElement(LoadingSpinnerIcon, {
       createElement: createElement
     }))), createElement("div", {
       className: "ais-ChatMessage-content"

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

@@ -10,7 +10,7 @@ import { createButtonComponent } from "../Button.js";
 import { createChatMessageComponent } from "./ChatMessage.js";
 import { createChatMessageErrorComponent } from "./ChatMessageError.js";
 import { createChatMessageLoaderComponent } from "./ChatMessageLoader.js";
-import { ChevronDownIconComponent, CopyIconComponent, ReloadIconComponent } from "./icons.js";
+import { ChevronDownIcon, CopyIcon, ReloadIcon } from "./icons.js";
 var getTextContent = function getTextContent(message) {
   return message.parts.map(function (part) {
     return 'text' in part ? part.text : '';
@@ -45,7 +45,7 @@ function createDefaultMessageComponent(_ref) {
     var defaultAssistantActions = [].concat(_toConsumableArray(hasTextContent(message) ? [{
       title: translations.copyToClipboardLabel,
       icon: function icon() {
-        return createElement(CopyIconComponent, {
+        return createElement(CopyIcon, {
           createElement: createElement
         });
       },
@@ -53,7 +53,7 @@ function createDefaultMessageComponent(_ref) {
     }] : []), [{
       title: translations.regenerateLabel,
       icon: function icon() {
-        return createElement(ReloadIconComponent, {
+        return createElement(ReloadIcon, {
           createElement: createElement
         });
       },
@@ -187,7 +187,7 @@ export function createChatMessagesComponent(_ref3) {
       onClick: onScrollToBottom,
       "aria-label": translations.scrollToBottomLabel,
       tabIndex: isScrollAtBottom ? -1 : 0
-    }, createElement(ChevronDownIconComponent, {
+    }, createElement(ChevronDownIcon, {
       createElement: createElement
     })));
   };

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

@@ -6,7 +6,7 @@ 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) { _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";
 import { createButtonComponent } from "../Button.js";
-import { ArrowUpIconComponent, StopIconComponent } from "./icons.js";
+import { ArrowUpIcon, StopIcon } from "./icons.js";
 export function createChatPromptComponent(_ref) {
   var createElement = _ref.createElement;
   var Button = createButtonComponent({
@@ -87,9 +87,9 @@ export function createChatPromptComponent(_ref) {
     var hasValue = typeof value === 'string' ? value.trim() !== '' : Boolean(value);
     var canStop = status === 'submitted' || status === 'streaming';
     var buttonDisabled = !hasValue && !canStop || disabled;
-    var submitIcon = canStop ? createElement(StopIconComponent, {
+    var submitIcon = canStop ? createElement(StopIcon, {
       createElement: createElement
-    }) : createElement(ArrowUpIconComponent, {
+    }) : createElement(ArrowUpIcon, {
       createElement: createElement
     });
     return createElement("form", {

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: ToggleIconComponent, classNames, className, ...props }: ChatToggleButtonProps) => JSX.Element;
+export declare function createChatToggleButtonComponent({ createElement }: Renderer): ({ open, onClick, toggleIconComponent: ToggleIcon, classNames, className, ...props }: ChatToggleButtonProps) => JSX.Element;

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

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["open", "onClick", "toggleIconComponent", "classNames", "className"];
 import { cx } from "../../lib/cx.js";
 import { createButtonComponent } from "../Button.js";
-import { SparklesIconComponent, ChevronUpIconComponent } from "./icons.js";
+import { SparklesIcon, ChevronUpIcon } from "./icons.js";
 export function createChatToggleButtonComponent(_ref) {
   var createElement = _ref.createElement;
   var Button = createButtonComponent({
@@ -12,19 +12,15 @@ export function createChatToggleButtonComponent(_ref) {
   return function ChatToggleButton(_ref2) {
     var open = _ref2.open,
       onClick = _ref2.onClick,
-      ToggleIconComponent = _ref2.toggleIconComponent,
+      ToggleIcon = _ref2.toggleIconComponent,
       _ref2$classNames = _ref2.classNames,
       classNames = _ref2$classNames === void 0 ? {} : _ref2$classNames,
       className = _ref2.className,
       props = _objectWithoutProperties(_ref2, _excluded);
-    var defaultIcon = open ? createElement(ChevronUpIconComponent, {
-      createElement: createElement,
-      width: 28,
-      height: 28
-    }) : createElement(SparklesIconComponent, {
-      createElement: createElement,
-      width: 28,
-      height: 28
+    var defaultIcon = open ? createElement(ChevronUpIcon, {
+      createElement: createElement
+    }) : createElement(SparklesIcon, {
+      createElement: createElement
     });
     return createElement(Button, _extends({
       variant: "primary",
@@ -32,7 +28,7 @@ export function createChatToggleButtonComponent(_ref) {
       iconOnly: true,
       className: cx('ais-ChatToggleButton', open && 'ais-ChatToggleButton--open', classNames.root, className),
       onClick: onClick
-    }, props), ToggleIconComponent ? createElement(ToggleIconComponent, {
+    }, props), ToggleIcon ? createElement(ToggleIcon, {
       isOpen: open
     }) : defaultIcon);
   };

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

@@ -1,22 +1,19 @@
 /** @jsx createElement */
 import type { Renderer } from '../../types';
-type IconProps = Pick<Renderer, 'createElement'> & {
-    width?: number;
-    height?: number;
-};
-export declare function SparklesIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function ArrowUpIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function ArrowRightIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function ChevronUpIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function ChevronDownIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function CloseIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function MaximizeIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function MinimizeIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function StopIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function ReloadIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function CopyIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function MenuIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function LoadingSpinnerIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function ChevronLeftIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
-export declare function ChevronRightIconComponent({ createElement, width, height, }: IconProps): JSX.Element;
+type IconProps = Pick<Renderer, 'createElement'>;
+export declare function SparklesIcon({ createElement }: IconProps): JSX.Element;
+export declare function ArrowUpIcon({ createElement }: IconProps): JSX.Element;
+export declare function ArrowRightIcon({ createElement }: IconProps): JSX.Element;
+export declare function ChevronUpIcon({ createElement }: IconProps): JSX.Element;
+export declare function ChevronDownIcon({ createElement }: IconProps): JSX.Element;
+export declare function CloseIcon({ createElement }: IconProps): JSX.Element;
+export declare function MaximizeIcon({ createElement }: IconProps): JSX.Element;
+export declare function MinimizeIcon({ createElement }: IconProps): JSX.Element;
+export declare function StopIcon({ createElement }: IconProps): JSX.Element;
+export declare function ReloadIcon({ createElement }: IconProps): JSX.Element;
+export declare function CopyIcon({ createElement }: IconProps): JSX.Element;
+export declare function MenuIcon({ createElement }: IconProps): JSX.Element;
+export declare function LoadingSpinnerIcon({ createElement }: IconProps): JSX.Element;
+export declare function ChevronLeftIcon({ createElement }: IconProps): JSX.Element;
+export declare function ChevronRightIcon({ createElement }: IconProps): JSX.Element;
 export {};