react-instantsearch 7.31.0 → 7.32.1

package/dist/cjs/components/AutocompleteSearch.js

@@ -19,7 +19,7 @@ var AutocompleteSearchComponent = (0, _instantsearchuicomponents.createAutocompl
     Fragment: _react.Fragment
 });
 function AutocompleteSearch(param) {
-    var inputProps = param.inputProps, clearQuery = param.clearQuery, onQueryChange = param.onQueryChange, query = param.query, isSearchStalled = param.isSearchStalled, onCancel = param.onCancel, isDetached = param.isDetached, submitTitle = param.submitTitle, onAiModeClick = param.onAiModeClick;
+    var inputProps = param.inputProps, clearQuery = param.clearQuery, onQueryChange = param.onQueryChange, query = param.query, isSearchStalled = param.isSearchStalled, onCancel = param.onCancel, isDetached = param.isDetached, submitTitle = param.submitTitle, onAiModeClick = param.onAiModeClick, classNames = param.classNames;
     return /*#__PURE__*/ _react.default.createElement(AutocompleteSearchComponent, {
         inputProps: _object_spread_props._(_object_spread._({}, inputProps), {
             onChange: function onChange(event) {
@@ -33,6 +33,7 @@ function AutocompleteSearch(param) {
         onCancel: onCancel,
         isDetached: isDetached,
         submitTitle: submitTitle,
-        onAiModeClick: onAiModeClick
+        onAiModeClick: onAiModeClick,
+        classNames: classNames
     });
 }

package/dist/cjs/widgets/Autocomplete.js

@@ -582,9 +582,16 @@ function InnerAutocomplete(_0) {
                     });
                 }
             }
-        } : undefined
+        } : undefined,
+        classNames: classNames
     });
-    var panelContent = /*#__PURE__*/ _react.default.createElement(AutocompletePanel, getPanelProps(), PanelComponent ? /*#__PURE__*/ _react.default.createElement(PanelComponent, {
+    var panelContent = /*#__PURE__*/ _react.default.createElement(AutocompletePanel, _object_spread_props._(_object_spread._({}, getPanelProps()), {
+        classNames: {
+            root: classNames === null || classNames === void 0 ? void 0 : classNames.panel,
+            open: classNames === null || classNames === void 0 ? void 0 : classNames.panelOpen,
+            layout: classNames === null || classNames === void 0 ? void 0 : classNames.panelLayout
+        }
+    }), PanelComponent ? /*#__PURE__*/ _react.default.createElement(PanelComponent, {
         elements: elements,
         indices: indicesForPanel
     }) : Object.keys(elements).map(function(elementId) {

package/dist/cjs/widgets/Chat.js

@@ -13,6 +13,9 @@ _export(exports, {
     get Chat () {
         return Chat;
     },
+    get DisplayResultsToolType () {
+        return _chat.DisplayResultsToolType;
+    },
     get MemorizeToolType () {
         return _chat.MemorizeToolType;
     },
@@ -44,6 +47,7 @@ var _chat = require("instantsearch.js/cjs/lib/chat");
 var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _reactinstantsearchcore = require("react-instantsearch-core");
 var _useStickToBottom = require("../lib/useStickToBottom");
+var _DisplayResultsTool = require("./chat/tools/DisplayResultsTool");
 var _SearchIndexTool = require("./chat/tools/SearchIndexTool");
 var ChatUiComponent = (0, _instantsearchuicomponents.createChatComponent)({
     createElement: _react.createElement,
@@ -51,7 +55,7 @@ var ChatUiComponent = (0, _instantsearchuicomponents.createChatComponent)({
 });
 function createDefaultTools(itemComponent, getSearchPageURL) {
     var _obj;
-    return _obj = {}, _define_property._(_obj, _chat.SearchIndexToolType, (0, _SearchIndexTool.createCarouselTool)(true, itemComponent, getSearchPageURL)), _define_property._(_obj, _chat.RecommendToolType, (0, _SearchIndexTool.createCarouselTool)(false, itemComponent, getSearchPageURL)), _define_property._(_obj, _chat.MemorizeToolType, {}), _define_property._(_obj, _chat.MemorySearchToolType, {}), _define_property._(_obj, _chat.PonderToolType, {}), _obj;
+    return _obj = {}, _define_property._(_obj, _chat.SearchIndexToolType, (0, _SearchIndexTool.createCarouselTool)(true, itemComponent, getSearchPageURL)), _define_property._(_obj, _chat.RecommendToolType, (0, _SearchIndexTool.createCarouselTool)(false, itemComponent, getSearchPageURL)), _define_property._(_obj, _chat.DisplayResultsToolType, (0, _DisplayResultsTool.createDisplayResultsTool)(itemComponent)), _define_property._(_obj, _chat.MemorizeToolType, {}), _define_property._(_obj, _chat.MemorySearchToolType, {}), _define_property._(_obj, _chat.PonderToolType, {}), _obj;
 }
 function ChatInner(_0, _1) {
     var _ref = [

package/dist/cjs/widgets/chat/tools/DisplayResultsTool.js

@@ -0,0 +1,69 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "createDisplayResultsTool", {
+    enumerable: true,
+    get: function() {
+        return createDisplayResultsTool;
+    }
+});
+var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+var _instantsearchuicomponents = require("instantsearch-ui-components");
+var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+var _components = require("../../../components");
+function createDisplayResultsTool(itemComponent) {
+    var DisplayResultsUIComponent = (0, _instantsearchuicomponents.createDisplayResultsToolComponent)({
+        createElement: _react.createElement,
+        Fragment: _react.Fragment
+    });
+    var Button = (0, _instantsearchuicomponents.createButtonComponent)({
+        createElement: _react.createElement
+    });
+    var DisplayResultsLayoutComponent = function DisplayResultsLayoutComponent(toolProps) {
+        return /*#__PURE__*/ _react.default.createElement(DisplayResultsUIComponent, {
+            toolProps: toolProps,
+            groupCarouselComponent: function groupCarouselComponent(param) {
+                var items = param.items, sendEvent = param.sendEvent;
+                return /*#__PURE__*/ _react.default.createElement(_components.Carousel, {
+                    items: items,
+                    itemComponent: itemComponent,
+                    sendEvent: sendEvent,
+                    showNavigation: false,
+                    headerComponent: function headerComponent(param) {
+                        var canScrollLeft = param.canScrollLeft, canScrollRight = param.canScrollRight, scrollLeft = param.scrollLeft, scrollRight = param.scrollRight;
+                        return /*#__PURE__*/ _react.default.createElement("div", {
+                            className: "ais-ChatToolDisplayResultsCarouselHeader"
+                        }, /*#__PURE__*/ _react.default.createElement("div", {
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderCount"
+                        }, items.length, " result", items.length > 1 ? 's' : ''), /*#__PURE__*/ _react.default.createElement("div", {
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderScrollButtons"
+                        }, /*#__PURE__*/ _react.default.createElement(Button, {
+                            variant: "outline",
+                            size: "sm",
+                            iconOnly: true,
+                            onClick: scrollLeft,
+                            disabled: !canScrollLeft,
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderScrollButton"
+                        }, /*#__PURE__*/ _react.default.createElement(_instantsearchuicomponents.ChevronLeftIcon, {
+                            createElement: _react.createElement
+                        })), /*#__PURE__*/ _react.default.createElement(Button, {
+                            variant: "outline",
+                            size: "sm",
+                            iconOnly: true,
+                            onClick: scrollRight,
+                            disabled: !canScrollRight,
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderScrollButton"
+                        }, /*#__PURE__*/ _react.default.createElement(_instantsearchuicomponents.ChevronRightIcon, {
+                            createElement: _react.createElement
+                        }))));
+                    }
+                });
+            }
+        });
+    };
+    return {
+        layoutComponent: DisplayResultsLayoutComponent
+    };
+}

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ComponentProps } from 'instantsearch-ui-components';
+import type { AutocompleteClassNames, ComponentProps } from 'instantsearch-ui-components';
 export type AutocompleteSearchProps = {
     inputProps: ComponentProps<'input'>;
     clearQuery: () => void;
@@ -10,5 +10,6 @@ export type AutocompleteSearchProps = {
     isDetached?: boolean;
     submitTitle?: string;
     onAiModeClick?: () => void;
+    classNames?: Partial<AutocompleteClassNames>;
 };
-export declare function AutocompleteSearch({ inputProps, clearQuery, onQueryChange, query, isSearchStalled, onCancel, isDetached, submitTitle, onAiModeClick, }: AutocompleteSearchProps): React.JSX.Element;
+export declare function AutocompleteSearch({ inputProps, clearQuery, onQueryChange, query, isSearchStalled, onCancel, isDetached, submitTitle, onAiModeClick, classNames, }: AutocompleteSearchProps): React.JSX.Element;

package/dist/es/components/AutocompleteSearch.js

@@ -8,7 +8,7 @@ var AutocompleteSearchComponent = createAutocompleteSearchComponent({
     Fragment: Fragment
 });
 function AutocompleteSearch(param) {
-    var inputProps = param.inputProps, clearQuery = param.clearQuery, onQueryChange = param.onQueryChange, query = param.query, isSearchStalled = param.isSearchStalled, onCancel = param.onCancel, isDetached = param.isDetached, submitTitle = param.submitTitle, onAiModeClick = param.onAiModeClick;
+    var inputProps = param.inputProps, clearQuery = param.clearQuery, onQueryChange = param.onQueryChange, query = param.query, isSearchStalled = param.isSearchStalled, onCancel = param.onCancel, isDetached = param.isDetached, submitTitle = param.submitTitle, onAiModeClick = param.onAiModeClick, classNames = param.classNames;
     return /*#__PURE__*/ React.createElement(AutocompleteSearchComponent, {
         inputProps: _(_$1({}, inputProps), {
             onChange: function onChange(event) {
@@ -22,7 +22,8 @@ function AutocompleteSearch(param) {
         onCancel: onCancel,
         isDetached: isDetached,
         submitTitle: submitTitle,
-        onAiModeClick: onAiModeClick
+        onAiModeClick: onAiModeClick,
+        classNames: classNames
     });
 }
 

package/dist/es/index.js

@@ -2,7 +2,7 @@ export * from 'react-instantsearch-core';
 export { useStickToBottom } from './lib/useStickToBottom.js';
 export { EXPERIMENTAL_Autocomplete } from './widgets/Autocomplete.js';
 export { Breadcrumb } from './widgets/Breadcrumb.js';
-export { MemorizeToolType, MemorySearchToolType, PonderToolType, RecommendToolType, SearchIndexToolType } from 'instantsearch.js/es/lib/chat/index.js';
+export { DisplayResultsToolType, MemorizeToolType, MemorySearchToolType, PonderToolType, RecommendToolType, SearchIndexToolType } from 'instantsearch.js/es/lib/chat/index.js';
 export { Chat, createDefaultTools } from './widgets/Chat.js';
 export { ClearRefinements } from './widgets/ClearRefinements.js';
 export { CurrentRefinements } from './widgets/CurrentRefinements.js';

package/dist/es/widgets/Autocomplete.js

@@ -571,9 +571,16 @@ function InnerAutocomplete(_0) {
                     });
                 }
             }
-        } : undefined
+        } : undefined,
+        classNames: classNames
     });
-    var panelContent = /*#__PURE__*/ React.createElement(AutocompletePanel, getPanelProps(), PanelComponent ? /*#__PURE__*/ React.createElement(PanelComponent, {
+    var panelContent = /*#__PURE__*/ React.createElement(AutocompletePanel, _$4(_$1({}, getPanelProps()), {
+        classNames: {
+            root: classNames === null || classNames === void 0 ? void 0 : classNames.panel,
+            open: classNames === null || classNames === void 0 ? void 0 : classNames.panelOpen,
+            layout: classNames === null || classNames === void 0 ? void 0 : classNames.panelLayout
+        }
+    }), PanelComponent ? /*#__PURE__*/ React.createElement(PanelComponent, {
         elements: elements,
         indices: indicesForPanel
     }) : Object.keys(elements).map(function(elementId) {

package/dist/es/widgets/Chat.d.ts

@@ -1,6 +1,6 @@
-import { SearchIndexToolType, RecommendToolType, MemorizeToolType, MemorySearchToolType, PonderToolType } from 'instantsearch.js/es/lib/chat';
+import { SearchIndexToolType, RecommendToolType, MemorizeToolType, MemorySearchToolType, PonderToolType, DisplayResultsToolType } from 'instantsearch.js/es/lib/chat';
 import React from 'react';
-export { SearchIndexToolType, RecommendToolType, MemorizeToolType, MemorySearchToolType, PonderToolType, };
+export { SearchIndexToolType, RecommendToolType, MemorizeToolType, MemorySearchToolType, PonderToolType, DisplayResultsToolType, };
 import type { ChatProps as ChatUiProps, ChatLayoutOwnProps, RecommendComponentProps, RecordWithObjectID, UserClientSideTool, UserClientSideTools, ChatMessageProps } from 'instantsearch-ui-components';
 import type { IndexUiState } from 'instantsearch.js';
 import type { UIMessage } from 'instantsearch.js/es/lib/chat';

package/dist/es/widgets/Chat.js

@@ -5,11 +5,12 @@ import { _ as _$2 } from '@swc/helpers/esm/_object_without_properties.js';
 import { _ as _$3 } from '@swc/helpers/esm/_sliced_to_array.js';
 import { _ as _$1 } from '@swc/helpers/esm/_to_array.js';
 import { createChatComponent } from 'instantsearch-ui-components';
-import { SearchIndexToolType, RecommendToolType, MemorizeToolType, MemorySearchToolType, PonderToolType } from 'instantsearch.js/es/lib/chat/index.js';
-export { MemorizeToolType, MemorySearchToolType, PonderToolType, RecommendToolType, SearchIndexToolType } from 'instantsearch.js/es/lib/chat/index.js';
+import { SearchIndexToolType, RecommendToolType, DisplayResultsToolType, MemorizeToolType, MemorySearchToolType, PonderToolType } from 'instantsearch.js/es/lib/chat/index.js';
+export { DisplayResultsToolType, MemorizeToolType, MemorySearchToolType, PonderToolType, RecommendToolType, SearchIndexToolType } from 'instantsearch.js/es/lib/chat/index.js';
 import React, { createElement, Fragment, useState, useRef, useMemo, useImperativeHandle, useEffect } from 'react';
 import { useInstantSearch, useChat } from 'react-instantsearch-core';
 import { useStickToBottom } from '../lib/useStickToBottom.js';
+import { createDisplayResultsTool } from './chat/tools/DisplayResultsTool.js';
 import { createCarouselTool } from './chat/tools/SearchIndexTool.js';
 
 var ChatUiComponent = createChatComponent({
@@ -18,7 +19,7 @@ var ChatUiComponent = createChatComponent({
 });
 function createDefaultTools(itemComponent, getSearchPageURL) {
     var _obj;
-    return _obj = {}, _(_obj, SearchIndexToolType, createCarouselTool(true, itemComponent, getSearchPageURL)), _(_obj, RecommendToolType, createCarouselTool(false, itemComponent, getSearchPageURL)), _(_obj, MemorizeToolType, {}), _(_obj, MemorySearchToolType, {}), _(_obj, PonderToolType, {}), _obj;
+    return _obj = {}, _(_obj, SearchIndexToolType, createCarouselTool(true, itemComponent, getSearchPageURL)), _(_obj, RecommendToolType, createCarouselTool(false, itemComponent, getSearchPageURL)), _(_obj, DisplayResultsToolType, createDisplayResultsTool(itemComponent)), _(_obj, MemorizeToolType, {}), _(_obj, MemorySearchToolType, {}), _(_obj, PonderToolType, {}), _obj;
 }
 function ChatInner(_0, _1) {
     var _ref = [

package/dist/es/widgets/chat/tools/DisplayResultsTool.d.ts

@@ -0,0 +1,4 @@
+import type { RecommendComponentProps, RecordWithObjectID, UserClientSideTool } from 'instantsearch-ui-components';
+type ItemComponent<TObject> = RecommendComponentProps<TObject>['itemComponent'];
+declare function createDisplayResultsTool<TObject extends RecordWithObjectID>(itemComponent?: ItemComponent<TObject>): UserClientSideTool;
+export { createDisplayResultsTool };

package/dist/es/widgets/chat/tools/DisplayResultsTool.js

@@ -0,0 +1,60 @@
+import { createDisplayResultsToolComponent, createButtonComponent, ChevronLeftIcon, ChevronRightIcon } from 'instantsearch-ui-components';
+import React, { createElement, Fragment } from 'react';
+import { Carousel } from '../../../components/Carousel.js';
+
+function createDisplayResultsTool(itemComponent) {
+    var DisplayResultsUIComponent = createDisplayResultsToolComponent({
+        createElement: createElement,
+        Fragment: Fragment
+    });
+    var Button = createButtonComponent({
+        createElement: createElement
+    });
+    var DisplayResultsLayoutComponent = function DisplayResultsLayoutComponent(toolProps) {
+        return /*#__PURE__*/ React.createElement(DisplayResultsUIComponent, {
+            toolProps: toolProps,
+            groupCarouselComponent: function groupCarouselComponent(param) {
+                var items = param.items, sendEvent = param.sendEvent;
+                return /*#__PURE__*/ React.createElement(Carousel, {
+                    items: items,
+                    itemComponent: itemComponent,
+                    sendEvent: sendEvent,
+                    showNavigation: false,
+                    headerComponent: function headerComponent(param) {
+                        var canScrollLeft = param.canScrollLeft, canScrollRight = param.canScrollRight, scrollLeft = param.scrollLeft, scrollRight = param.scrollRight;
+                        return /*#__PURE__*/ React.createElement("div", {
+                            className: "ais-ChatToolDisplayResultsCarouselHeader"
+                        }, /*#__PURE__*/ React.createElement("div", {
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderCount"
+                        }, items.length, " result", items.length > 1 ? 's' : ''), /*#__PURE__*/ React.createElement("div", {
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderScrollButtons"
+                        }, /*#__PURE__*/ React.createElement(Button, {
+                            variant: "outline",
+                            size: "sm",
+                            iconOnly: true,
+                            onClick: scrollLeft,
+                            disabled: !canScrollLeft,
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderScrollButton"
+                        }, /*#__PURE__*/ React.createElement(ChevronLeftIcon, {
+                            createElement: createElement
+                        })), /*#__PURE__*/ React.createElement(Button, {
+                            variant: "outline",
+                            size: "sm",
+                            iconOnly: true,
+                            onClick: scrollRight,
+                            disabled: !canScrollRight,
+                            className: "ais-ChatToolDisplayResultsCarouselHeaderScrollButton"
+                        }, /*#__PURE__*/ React.createElement(ChevronRightIcon, {
+                            createElement: createElement
+                        }))));
+                    }
+                });
+            }
+        });
+    };
+    return {
+        layoutComponent: DisplayResultsLayoutComponent
+    };
+}
+
+export { createDisplayResultsTool };

package/dist/es/widgets/index.js

@@ -25,4 +25,4 @@ export { ToggleRefinement } from './ToggleRefinement.js';
 export { TrendingItems } from './TrendingItems.js';
 export { TrendingFacets } from './TrendingFacets.js';
 export { FilterSuggestions } from './FilterSuggestions.js';
-export { MemorizeToolType, MemorySearchToolType, PonderToolType, RecommendToolType, SearchIndexToolType } from 'instantsearch.js/es/lib/chat/index.js';
+export { DisplayResultsToolType, MemorizeToolType, MemorySearchToolType, PonderToolType, RecommendToolType, SearchIndexToolType } from 'instantsearch.js/es/lib/chat/index.js';