react-instantsearch 7.35.1 → 7.37.0

package/dist/cjs/widgets/Autocomplete.js

@@ -65,6 +65,16 @@ var AutocompleteDetachedSearchButton = (0, _instantsearchuicomponents.createAuto
     Fragment: _react.Fragment
 });
 var id = 0;
+// Colons (`:r0:`) preserved so concatenations like `autocomplete:r0:input`
+// have a recognisable boundary; callers that need a colon-free variant for
+// InstantSearch's `indexId` strip them at the use site.
+var useAutocompleteId = _react.default.useId ? function() {
+    return _react.default.useId();
+} : function() {
+    return _react.default.useState(function() {
+        return ":a".concat(id++, ":");
+    })[0];
+};
 var usePropGetters = (0, _instantsearchuicomponents.createAutocompletePropGetters)({
     useEffect: _react.useEffect,
     useId: _react.default.useId || function() {
@@ -200,91 +210,185 @@ function getMediaQueryList(mediaQuery) {
         setIsModalOpen: setIsModalOpen
     };
 }
-function EXPERIMENTAL_Autocomplete(_0) {
-    var _0_indices = _0.indices, indices = _0_indices === void 0 ? [] : _0_indices, showQuerySuggestions = _0.showQuerySuggestions, showPromptSuggestions = _0.showPromptSuggestions, showRecent = _0.showRecent, userSearchParameters = _0.searchParameters, detachedMediaQuery = _0.detachedMediaQuery, tmp = _0.translations, userTranslations = tmp === void 0 ? {} : tmp, aiMode = _0.aiMode, props = _object_without_properties._(_0, [
-        "indices",
+function EXPERIMENTAL_Autocomplete(props) {
+    var _showRecent_classNames, _showRecent_classNames1, _showRecent_classNames2, _showRecent_classNames3;
+    var indices = 'indices' in props ? props.indices : undefined;
+    var feeds = 'feeds' in props ? props.feeds : undefined;
+    var isFeedsMode = feeds !== undefined;
+    var showQuerySuggestions = props.showQuerySuggestions, showPromptSuggestions = props.showPromptSuggestions, showRecent = props.showRecent, userSearchParameters = props.searchParameters, detachedMediaQuery = props.detachedMediaQuery, tmp = props.translations, userTranslations = tmp === void 0 ? {} : tmp, transformItems = props.transformItems, restProps = _object_without_properties._(props, [
         "showQuerySuggestions",
         "showPromptSuggestions",
         "showRecent",
         "searchParameters",
         "detachedMediaQuery",
         "translations",
-        "aiMode"
+        "transformItems"
     ]);
-    var _showRecent_classNames, _showRecent_classNames1, _showRecent_classNames2, _showRecent_classNames3;
+    var autoFocus = restProps.autoFocus, placeholder = restProps.placeholder, classNames = restProps.classNames;
+    // Eager-mount only when `autoFocus` is set — otherwise wait for first focus
+    // before registering the autocomplete subtree in the search graph.
+    var _useState = _sliced_to_array._((0, _react.useState)(autoFocus === true), 2), activated = _useState[0], setActivated = _useState[1];
     var translations = _object_spread._({}, DEFAULT_TRANSLATIONS, userTranslations);
     var _useInstantSearch = (0, _reactinstantsearchcore.useInstantSearch)(), indexUiState = _useInstantSearch.indexUiState, indexRenderState = _useInstantSearch.indexRenderState, status = _useInstantSearch.status;
+    var compositionID = (0, _reactinstantsearchcore.useInstantSearchContext)().compositionID;
     var refine = (0, _reactinstantsearchcore.useSearchBox)({}, _object_spread._({
         $$type: 'ais.autocomplete',
         $$widgetType: 'ais.autocomplete'
-    }, aiMode ? {
+    }, props.aiMode ? {
         opensChat: true
     } : {})).refine;
+    var domId = useAutocompleteId();
+    var instanceKey = domId.replace(/:/g, '');
+    if (isFeedsMode && indices !== undefined) {
+        throw new Error('EXPERIMENTAL_Autocomplete: `feeds` and `indices` are mutually exclusive.');
+    }
+    if (isFeedsMode && !compositionID) {
+        throw new Error('EXPERIMENTAL_Autocomplete in feeds-mode requires a composition-based <InstantSearch> (compositionID must be set).');
+    }
     var isSearchStalled = status === 'stalled';
     var searchParameters = _object_spread._({
         hitsPerPage: 5
     }, userSearchParameters);
-    var indicesConfig = _to_consumable_array._(indices);
-    if (showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName) {
-        var _showQuerySuggestions_classNames, _showQuerySuggestions_classNames1, _showQuerySuggestions_classNames2, _showQuerySuggestions_classNames3;
-        indicesConfig.unshift({
-            indexName: showQuerySuggestions.indexName,
-            headerComponent: showQuerySuggestions.headerComponent,
-            itemComponent: showQuerySuggestions.itemComponent || function(param) {
-                var item = param.item, onSelect = param.onSelect, onApply = param.onApply;
-                return /*#__PURE__*/ _react.default.createElement(AutocompleteSuggestion, {
-                    item: item,
-                    onSelect: onSelect,
-                    onApply: onApply
-                }, /*#__PURE__*/ _react.default.createElement(ConditionalReverseHighlight, {
-                    item: item
-                }));
-            },
-            classNames: {
-                root: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestions', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames === void 0 ? void 0 : _showQuerySuggestions_classNames.root),
-                list: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestionsList', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames1 = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames1 === void 0 ? void 0 : _showQuerySuggestions_classNames1.list),
-                header: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestionsHeader', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames2 = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames2 === void 0 ? void 0 : _showQuerySuggestions_classNames2.header),
-                item: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestionsItem', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames3 = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames3 === void 0 ? void 0 : _showQuerySuggestions_classNames3.item)
-            },
-            searchParameters: _object_spread._({
+    // In feeds-mode `indexName` carries the feedID so downstream matching
+    // (section building, dedupe in createAutocompleteStorage) treats feeds
+    // like indices without any changes to InnerAutocomplete.
+    var querySuggestionsKey = isFeedsMode ? showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.feedID : showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName;
+    var promptSuggestionsKey = isFeedsMode ? showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : showPromptSuggestions.feedID : showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : showPromptSuggestions.indexName;
+    var indicesConfig = (0, _react.useMemo)(function() {
+        var config = isFeedsMode ? feeds.map(function(feed) {
+            return {
+                indexName: feed.feedID,
+                headerComponent: feed.headerComponent,
+                itemComponent: feed.itemComponent,
+                noResultsComponent: feed.noResultsComponent,
+                getURL: feed.getURL,
+                getQuery: feed.getQuery,
+                classNames: feed.classNames
+            };
+        }) : _to_consumable_array._(indices !== null && indices !== void 0 ? indices : []);
+        if (querySuggestionsKey) {
+            var _showQuerySuggestions_classNames, _showQuerySuggestions_classNames1, _showQuerySuggestions_classNames2, _showQuerySuggestions_classNames3;
+            var querySuggestionsSearchParameters = isFeedsMode ? undefined : _object_spread._({
                 hitsPerPage: 3
-            }, showQuerySuggestions.searchParameters),
-            getQuery: function getQuery(item) {
-                return item.query;
-            },
-            getURL: showQuerySuggestions.getURL
-        });
-    }
-    if (showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : showPromptSuggestions.indexName) {
-        var _showPromptSuggestions_classNames, _showPromptSuggestions_classNames1, _showPromptSuggestions_classNames2, _showPromptSuggestions_classNames3;
-        indicesConfig.push({
-            indexName: showPromptSuggestions.indexName,
-            headerComponent: showPromptSuggestions.headerComponent,
-            itemComponent: showPromptSuggestions.itemComponent || function(param) {
-                var item = param.item, onSelect = param.onSelect;
-                return /*#__PURE__*/ _react.default.createElement(AutocompletePromptSuggestion, {
-                    item: item,
-                    onSelect: onSelect
-                }, /*#__PURE__*/ _react.default.createElement(ConditionalHighlight, {
-                    item: item,
-                    attribute: "prompt"
-                }));
-            },
-            classNames: {
-                root: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestions', (_showPromptSuggestions_classNames = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames === void 0 ? void 0 : _showPromptSuggestions_classNames.root),
-                list: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsList', (_showPromptSuggestions_classNames1 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames1 === void 0 ? void 0 : _showPromptSuggestions_classNames1.list),
-                header: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsHeader', (_showPromptSuggestions_classNames2 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames2 === void 0 ? void 0 : _showPromptSuggestions_classNames2.header),
-                item: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsItem', (_showPromptSuggestions_classNames3 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames3 === void 0 ? void 0 : _showPromptSuggestions_classNames3.item)
-            },
-            searchParameters: _object_spread._({
+            }, showQuerySuggestions.searchParameters);
+            config.unshift({
+                indexName: querySuggestionsKey,
+                headerComponent: showQuerySuggestions.headerComponent,
+                itemComponent: showQuerySuggestions.itemComponent || function(param) {
+                    var item = param.item, onSelect = param.onSelect, onApply = param.onApply;
+                    return /*#__PURE__*/ _react.default.createElement(AutocompleteSuggestion, {
+                        item: item,
+                        onSelect: onSelect,
+                        onApply: onApply
+                    }, /*#__PURE__*/ _react.default.createElement(ConditionalReverseHighlight, {
+                        item: item
+                    }));
+                },
+                classNames: {
+                    root: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestions', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames === void 0 ? void 0 : _showQuerySuggestions_classNames.root),
+                    list: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestionsList', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames1 = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames1 === void 0 ? void 0 : _showQuerySuggestions_classNames1.list),
+                    header: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestionsHeader', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames2 = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames2 === void 0 ? void 0 : _showQuerySuggestions_classNames2.header),
+                    item: (0, _instantsearchuicomponents.cx)('ais-AutocompleteSuggestionsItem', showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : (_showQuerySuggestions_classNames3 = showQuerySuggestions.classNames) === null || _showQuerySuggestions_classNames3 === void 0 ? void 0 : _showQuerySuggestions_classNames3.item)
+                },
+                searchParameters: querySuggestionsSearchParameters,
+                getQuery: function getQuery(item) {
+                    return item.query;
+                },
+                getURL: showQuerySuggestions.getURL
+            });
+        }
+        if (promptSuggestionsKey) {
+            var _showPromptSuggestions_classNames, _showPromptSuggestions_classNames1, _showPromptSuggestions_classNames2, _showPromptSuggestions_classNames3;
+            var promptSuggestionsSearchParameters = isFeedsMode ? undefined : _object_spread._({
                 hitsPerPage: 3
-            }, showPromptSuggestions.searchParameters),
-            getQuery: function getQuery(item) {
-                return item.prompt;
-            },
-            getURL: showPromptSuggestions.getURL
-        });
-    }
+            }, showPromptSuggestions.searchParameters);
+            config.push({
+                indexName: promptSuggestionsKey,
+                headerComponent: showPromptSuggestions.headerComponent,
+                itemComponent: showPromptSuggestions.itemComponent || function(param) {
+                    var item = param.item, onSelect = param.onSelect;
+                    return /*#__PURE__*/ _react.default.createElement(AutocompletePromptSuggestion, {
+                        item: item,
+                        onSelect: onSelect
+                    }, /*#__PURE__*/ _react.default.createElement(ConditionalHighlight, {
+                        item: item,
+                        attribute: "prompt"
+                    }));
+                },
+                classNames: {
+                    root: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestions', showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : (_showPromptSuggestions_classNames = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames === void 0 ? void 0 : _showPromptSuggestions_classNames.root),
+                    list: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsList', showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : (_showPromptSuggestions_classNames1 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames1 === void 0 ? void 0 : _showPromptSuggestions_classNames1.list),
+                    header: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsHeader', showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : (_showPromptSuggestions_classNames2 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames2 === void 0 ? void 0 : _showPromptSuggestions_classNames2.header),
+                    item: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsItem', showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : (_showPromptSuggestions_classNames3 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames3 === void 0 ? void 0 : _showPromptSuggestions_classNames3.item)
+                },
+                searchParameters: promptSuggestionsSearchParameters,
+                getQuery: function getQuery(item) {
+                    return item.prompt;
+                },
+                getURL: showPromptSuggestions.getURL
+            });
+        }
+        return config;
+    }, [
+        feeds,
+        indices,
+        isFeedsMode,
+        promptSuggestionsKey,
+        querySuggestionsKey,
+        showPromptSuggestions,
+        showQuerySuggestions
+    ]);
+    // Normalize `show*` for InnerAutocomplete: always surface `indexName`
+    // (in feeds-mode it carries the feedID). Keeps downstream dedupe in
+    // createAutocompleteStorage (suggestionsIndexName === index.indexName) working.
+    var normalizedShowQuerySuggestions = (0, _react.useMemo)(function() {
+        if (!showQuerySuggestions) {
+            return undefined;
+        }
+        if (isFeedsMode) {
+            return _object_spread_props._(_object_spread._({}, showQuerySuggestions), {
+                indexName: querySuggestionsKey
+            });
+        }
+        return showQuerySuggestions;
+    }, [
+        isFeedsMode,
+        querySuggestionsKey,
+        showQuerySuggestions
+    ]);
+    var normalizedShowPromptSuggestions = (0, _react.useMemo)(function() {
+        if (!showPromptSuggestions) {
+            return undefined;
+        }
+        if (isFeedsMode) {
+            return _object_spread_props._(_object_spread._({}, showPromptSuggestions), {
+                indexName: promptSuggestionsKey
+            });
+        }
+        return showPromptSuggestions;
+    }, [
+        isFeedsMode,
+        promptSuggestionsKey,
+        showPromptSuggestions
+    ]);
+    // In feeds-mode, remap `indexName := indexId` so downstream storage (which
+    // matches on indexName) sees feedIDs instead of the composition index name
+    // that connectAutocomplete sets from the helper results.
+    // Must be memoized: useConnector's useStableValue runs dequal on each render
+    // and treats a new function identity as a change, re-registering the widget.
+    var effectiveTransformItems = (0, _react.useMemo)(function() {
+        return isFeedsMode ? function(items) {
+            var remapped = items.map(function(item) {
+                return _object_spread_props._(_object_spread._({}, item), {
+                    indexName: item.indexId
+                });
+            });
+            return transformItems ? transformItems(remapped) : remapped;
+        } : transformItems;
+    }, [
+        isFeedsMode,
+        transformItems
+    ]);
     var recentSearchConfig = showRecent ? {
         headerComponent: (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' ? showRecent.headerComponent : undefined,
         itemComponent: (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' && showRecent.itemComponent ? showRecent.itemComponent : AutocompleteRecentSearch,
@@ -300,15 +404,88 @@ function EXPERIMENTAL_Autocomplete(_0) {
     }, [
         indexRenderState
     ]);
-    return /*#__PURE__*/ _react.default.createElement(_react.Fragment, null, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
-        EXPERIMENTAL_isolated: true
-    }, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, searchParameters), indicesConfig.map(function(index) {
-        return /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
-            key: index.indexName,
-            indexName: index.indexName
-        }, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, index.searchParameters));
-    }), /*#__PURE__*/ _react.default.createElement(InnerAutocomplete, _object_spread_props._(_object_spread._({}, props), {
-        aiMode: aiMode,
+    restProps.indices; restProps.feeds; var forwardedProps = _object_without_properties._(restProps, [
+        "indices",
+        "feeds"
+    ]);
+    var instance = (0, _reactinstantsearchcore.useInstantSearchContext)();
+    var detached = useDetachedMode(detachedMediaQuery);
+    var isDetached = detached.isDetached, setIsModalOpen = detached.setIsModalOpen;
+    // Lazy activation only: when `activated` flips from false to true, the
+    // newly-mounted isolated `<Index>` schedules the parent's search even
+    // though the parent's state hasn't changed. Cancel it so only the
+    // autocomplete's own search fires on activation. Skip when `autoFocus`
+    // mounts the inner eagerly — the parent's legitimate initial search
+    // shares the same defer slot and must not be cancelled.
+    var initialActivatedRef = (0, _react.useRef)(activated);
+    (0, _react.useLayoutEffect)(function() {
+        if (activated && !initialActivatedRef.current) {
+            initialActivatedRef.current = true;
+            instance.scheduleSearch.cancel();
+        }
+    }, [
+        activated,
+        instance
+    ]);
+    if (!activated) {
+        var _indexUiState_query, _indexUiState_query1;
+        restProps.indices; restProps.feeds; restProps.autoFocus; restProps.placeholder; restProps.classNames; restProps.aiMode; restProps.panelComponent; restProps.getSearchPageURL; restProps.onSelect; var shellRootProps = _object_without_properties._(restProps, [
+            "indices",
+            "feeds",
+            "autoFocus",
+            "placeholder",
+            "classNames",
+            "aiMode",
+            "panelComponent",
+            "getSearchPageURL",
+            "onSelect"
+        ]);
+        var activateWithQueryMirror = function activateWithQueryMirror() {
+            // Routing only fills the parent index's UI state, not the
+            // autocomplete's isolated one, so without this, the autocomplete
+            // would activate with an empty query and fire a useless search.
+            // We copy the parent's query into the autocomplete's slot of
+            // `_initialUiState` right before flipping `activated`: that's the
+            // moment the isolated `<Index>` is about to mount and read it.
+            // Doing this later would mean firing a second search to correct
+            // the first.
+            if (indexUiState.query) {
+                var isoIndexId = "ais-autocomplete-".concat(instanceKey);
+                var initial = instance._initialUiState;
+                initial[isoIndexId] = _object_spread_props._(_object_spread._({}, initial[isoIndexId]), {
+                    query: indexUiState.query
+                });
+            }
+            setActivated(true);
+        };
+        return /*#__PURE__*/ _react.default.createElement(Autocomplete, _object_spread_props._(_object_spread._({}, shellRootProps), {
+            classNames: classNames
+        }), isDetached ? /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedSearchButton, {
+            query: (_indexUiState_query = indexUiState.query) !== null && _indexUiState_query !== void 0 ? _indexUiState_query : '',
+            placeholder: placeholder,
+            classNames: classNames,
+            translations: translations,
+            onClick: function onClick() {
+                setIsModalOpen(true);
+                activateWithQueryMirror();
+            }
+        }) : /*#__PURE__*/ _react.default.createElement(_AutocompleteSearch.AutocompleteSearch, {
+            inputProps: {
+                id: "autocomplete".concat(domId, "input"),
+                role: 'combobox',
+                placeholder: placeholder,
+                onFocus: activateWithQueryMirror
+            },
+            clearQuery: function clearQuery() {},
+            query: (_indexUiState_query1 = indexUiState.query) !== null && _indexUiState_query1 !== void 0 ? _indexUiState_query1 : '',
+            isSearchStalled: false,
+            classNames: classNames
+        }));
+    }
+    var innerAutocomplete = /*#__PURE__*/ _react.default.createElement(InnerAutocomplete, _object_spread_props._(_object_spread._({}, forwardedProps), {
+        autoFocus: true,
+        domId: domId,
+        detached: detached,
         indicesConfig: indicesConfig,
         refineSearchBox: refine,
         isSearchStalled: isSearchStalled,
@@ -316,15 +493,37 @@ function EXPERIMENTAL_Autocomplete(_0) {
         isSearchPage: isSearchPage,
         showRecent: showRecent,
         recentSearchConfig: recentSearchConfig,
-        showQuerySuggestions: showQuerySuggestions,
-        detachedMediaQuery: detachedMediaQuery,
+        showQuerySuggestions: normalizedShowQuerySuggestions,
         translations: translations,
-        showPromptSuggestions: showPromptSuggestions,
+        showPromptSuggestions: normalizedShowPromptSuggestions,
+        transformItems: effectiveTransformItems,
         chatRenderState: indexRenderState.chat
-    }))));
+    }));
+    if (isFeedsMode) {
+        return /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
+            EXPERIMENTAL_isolated: true,
+            indexName: compositionID,
+            indexId: "ais-autocomplete-".concat(instanceKey)
+        }, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, searchParameters), /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Feeds, {
+            isolated: false,
+            renderFeed: function renderFeed() {
+                return null;
+            }
+        }), innerAutocomplete);
+    }
+    return /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
+        EXPERIMENTAL_isolated: true,
+        indexId: "ais-autocomplete-".concat(instanceKey)
+    }, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, searchParameters), indicesConfig.map(function(index) {
+        return /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
+            key: index.indexName,
+            indexName: index.indexName,
+            indexId: "ais-autocomplete-".concat(instanceKey, "-").concat(index.indexName)
+        }, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, index.searchParameters));
+    }), innerAutocomplete);
 }
 function InnerAutocomplete(_0) {
-    var indicesConfig = _0.indicesConfig, refineSearchBox = _0.refineSearchBox, isSearchStalled = _0.isSearchStalled, getSearchPageURL = _0.getSearchPageURL, userOnSelect = _0.onSelect, indexUiState = _0.indexUiState, isSearchPage = _0.isSearchPage, PanelComponent = _0.panelComponent, showRecent = _0.showRecent, recentSearchConfig = _0.recentSearchConfig, showQuerySuggestions = _0.showQuerySuggestions, showPromptSuggestions = _0.showPromptSuggestions, chatRenderState = _0.chatRenderState, transformItems = _0.transformItems, placeholder = _0.placeholder, autoFocus = _0.autoFocus, _0_detachedMediaQuery = _0.detachedMediaQuery, detachedMediaQuery = _0_detachedMediaQuery === void 0 ? DEFAULT_DETACHED_MEDIA_QUERY : _0_detachedMediaQuery, translations = _0.translations, classNames = _0.classNames, aiMode = _0.aiMode, props = _object_without_properties._(_0, [
+    var indicesConfig = _0.indicesConfig, refineSearchBox = _0.refineSearchBox, isSearchStalled = _0.isSearchStalled, getSearchPageURL = _0.getSearchPageURL, userOnSelect = _0.onSelect, indexUiState = _0.indexUiState, isSearchPage = _0.isSearchPage, PanelComponent = _0.panelComponent, showRecent = _0.showRecent, recentSearchConfig = _0.recentSearchConfig, showQuerySuggestions = _0.showQuerySuggestions, showPromptSuggestions = _0.showPromptSuggestions, chatRenderState = _0.chatRenderState, transformItems = _0.transformItems, placeholder = _0.placeholder, autoFocus = _0.autoFocus, translations = _0.translations, classNames = _0.classNames, aiMode = _0.aiMode, domId = _0.domId, detached = _0.detached, props = _object_without_properties._(_0, [
         "indicesConfig",
         "refineSearchBox",
         "isSearchStalled",
@@ -341,10 +540,11 @@ function InnerAutocomplete(_0) {
         "transformItems",
         "placeholder",
         "autoFocus",
-        "detachedMediaQuery",
         "translations",
         "classNames",
-        "aiMode"
+        "aiMode",
+        "domId",
+        "detached"
     ]);
     var _indexUiState_query, _ref;
     var _showPromptSuggestions_searchParameters;
@@ -355,7 +555,7 @@ function InnerAutocomplete(_0) {
         }
     }), indices = _useAutocomplete.indices, refineAutocomplete = _useAutocomplete.refine, currentRefinement = _useAutocomplete.currentRefinement;
     var resolvedQuery = currentRefinement !== undefined ? currentRefinement : (_indexUiState_query = indexUiState.query) !== null && _indexUiState_query !== void 0 ? _indexUiState_query : '';
-    var _useDetachedMode = useDetachedMode(detachedMediaQuery), isDetached = _useDetachedMode.isDetached, isModalDetached = _useDetachedMode.isModalDetached, isModalOpen = _useDetachedMode.isModalOpen, setIsModalOpen = _useDetachedMode.setIsModalOpen;
+    var isDetached = detached.isDetached, isModalDetached = detached.isModalDetached, isModalOpen = detached.isModalOpen, setIsModalOpen = detached.setIsModalOpen;
     var previousIsDetachedRef = (0, _react.useRef)(isDetached);
     var _useStorage = useStorage({
         showRecent: showRecent,
@@ -421,6 +621,7 @@ function InnerAutocomplete(_0) {
     });
     var shouldHideEmptyPanel = allIndicesEmpty && recentEmpty && !hasNoResultsTemplate && !PanelComponent;
     var _usePropGetters = usePropGetters({
+        id: domId,
         indices: indicesForPropGettersWithPromptSuggestions,
         indicesConfig: indicesConfigForPropGetters,
         onRefine: function onRefine(query) {
@@ -541,7 +742,7 @@ function InnerAutocomplete(_0) {
             NoResultsComponent: currentIndexConfig.noResultsComponent,
             items: hits.map(function(item) {
                 return _object_spread_props._(_object_spread._({}, item), {
-                    __indexName: indexId
+                    __indexName: indexName
                 });
             }),
             getItemProps: getItemProps,

package/dist/cjs/widgets/Chat.js

@@ -51,7 +51,8 @@ var _DisplayResultsTool = require("./chat/tools/DisplayResultsTool");
 var _SearchIndexTool = require("./chat/tools/SearchIndexTool");
 var ChatUiComponent = (0, _instantsearchuicomponents.createChatComponent)({
     createElement: _react.createElement,
-    Fragment: _react.Fragment
+    Fragment: _react.Fragment,
+    memo: _react.memo
 });
 function createDefaultTools(itemComponent, getSearchPageURL) {
     var _obj;
@@ -139,6 +140,23 @@ function ChatInner(_0, _1) {
     }, [
         open
     ]);
+    // Keep the conversation pinned to the bottom while streaming. The stick-to-
+    // bottom ResizeObserver only reacts to content *height* changes, but tool
+    // results such as a horizontally-growing carousel stream in without changing
+    // height — so we also re-pin on every message/status update. Passing
+    // `preserveScrollPosition` reuses the existing "only if already at the
+    // bottom" gate, so this never fights a user who has scrolled up to read.
+    (0, _react.useEffect)(function() {
+        if (status === 'streaming' || status === 'submitted') {
+            scrollToBottom({
+                preserveScrollPosition: true
+            });
+        }
+    }, [
+        messages,
+        status,
+        scrollToBottom
+    ]);
     return /*#__PURE__*/ _react.default.createElement(ChatUiComponent, {
         title: title,
         open: open,

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

@@ -21,36 +21,74 @@ type AutocompleteTranslations = {
     detachedSearchButtonTitle: string;
     detachedClearButtonTitle: string;
 };
-export type AutocompleteProps<TItem extends BaseHit> = ComponentProps<'div'> & {
-    indices?: Array<IndexConfig<TItem>>;
-    showQuerySuggestions?: Partial<Pick<IndexConfig<{
+export type FeedConfig<TItem extends BaseHit> = {
+    feedID: string;
+    headerComponent?: AutocompleteIndexProps<TItem>['HeaderComponent'];
+    itemComponent: AutocompleteIndexProps<TItem>['ItemComponent'];
+    noResultsComponent?: AutocompleteIndexProps<TItem>['NoResultsComponent'];
+    getURL?: AutocompleteIndexConfig<TItem>['getURL'];
+    getQuery?: AutocompleteIndexConfig<TItem>['getQuery'];
+    classNames?: Partial<AutocompleteIndexClassNames>;
+};
+type IndicesShowQuerySuggestionsConfig = Partial<Pick<IndexConfig<{
+    query: string;
+}>, 'indexName' | 'getURL' | 'headerComponent' | 'itemComponent' | 'classNames' | 'searchParameters'>>;
+type FeedsShowQuerySuggestionsConfig = {
+    feedID: string;
+    getURL?: IndexConfig<{
         query: string;
-    }>, 'indexName' | 'getURL' | 'headerComponent' | 'itemComponent' | 'classNames' | 'searchParameters'>>;
-    showPromptSuggestions?: Partial<Pick<IndexConfig<{
+    }>['getURL'];
+    headerComponent?: IndexConfig<{
+        query: string;
+    }>['headerComponent'];
+    itemComponent?: IndexConfig<{
+        query: string;
+    }>['itemComponent'];
+    classNames?: Partial<AutocompleteIndexClassNames>;
+};
+type IndicesShowPromptSuggestionsConfig = Partial<Pick<IndexConfig<{
+    query: string;
+    label?: string;
+}>, 'indexName' | 'getURL' | 'headerComponent' | 'itemComponent' | 'classNames' | 'searchParameters'>>;
+type FeedsShowPromptSuggestionsConfig = {
+    feedID: string;
+    getURL?: IndexConfig<{
+        query: string;
+        label?: string;
+    }>['getURL'];
+    headerComponent?: IndexConfig<{
         query: string;
         label?: string;
-    }>, 'indexName' | 'getURL' | 'headerComponent' | 'itemComponent' | 'classNames' | 'searchParameters'>>;
-    showRecent?: boolean | {
-        /**
-         * Storage key to use in the local storage.
-         */
-        storageKey?: string;
-        /**
-         * Component to use for the header, before the list of items.
-         */
-        headerComponent?: AutocompleteIndexProps<{
-            query: string;
-        }>['HeaderComponent'];
-        /**
-         * Component to use for each recent search item.
-         */
-        itemComponent?: AutocompleteIndexProps<{
-            query: string;
-        }>['ItemComponent'] & {
-            onRemoveRecentSearch: () => void;
-        };
-        classNames?: Partial<AutocompleteIndexClassNames>;
+    }>['headerComponent'];
+    itemComponent?: IndexConfig<{
+        query: string;
+        label?: string;
+    }>['itemComponent'];
+    classNames?: Partial<AutocompleteIndexClassNames>;
+};
+type AutocompleteShowRecentConfig = {
+    /**
+     * Storage key to use in the local storage.
+     */
+    storageKey?: string;
+    /**
+     * Component to use for the header, before the list of items.
+     */
+    headerComponent?: AutocompleteIndexProps<{
+        query: string;
+    }>['HeaderComponent'];
+    /**
+     * Component to use for each recent search item.
+     */
+    itemComponent?: AutocompleteIndexProps<{
+        query: string;
+    }>['ItemComponent'] & {
+        onRemoveRecentSearch: () => void;
     };
+    classNames?: Partial<AutocompleteIndexClassNames>;
+};
+type AutocompleteCommonProps<TItem extends BaseHit> = ComponentProps<'div'> & {
+    showRecent?: boolean | AutocompleteShowRecentConfig;
     getSearchPageURL?: (nextUiState: IndexUiState) => string;
     onSelect?: AutocompleteIndexConfig<TItem>['onSelect'];
     transformItems?: (indices: TransformItemsIndicesConfig[]) => TransformItemsIndicesConfig[];
@@ -84,5 +122,18 @@ export type AutocompleteProps<TItem extends BaseHit> = ComponentProps<'div'> & {
      */
     aiMode?: boolean;
 };
-export declare function EXPERIMENTAL_Autocomplete<TItem extends BaseHit = BaseHit>({ indices, showQuerySuggestions, showPromptSuggestions, showRecent, searchParameters: userSearchParameters, detachedMediaQuery, translations: userTranslations, aiMode, ...props }: AutocompleteProps<TItem>): React.JSX.Element;
+export type AutocompleteIndicesProps<TItem extends BaseHit> = AutocompleteCommonProps<TItem> & {
+    indices?: Array<IndexConfig<TItem>>;
+    feeds?: never;
+    showQuerySuggestions?: IndicesShowQuerySuggestionsConfig;
+    showPromptSuggestions?: IndicesShowPromptSuggestionsConfig;
+};
+export type AutocompleteFeedsProps<TItem extends BaseHit> = AutocompleteCommonProps<TItem> & {
+    feeds: Array<FeedConfig<TItem>>;
+    indices?: never;
+    showQuerySuggestions?: FeedsShowQuerySuggestionsConfig;
+    showPromptSuggestions?: FeedsShowPromptSuggestionsConfig;
+};
+export type AutocompleteProps<TItem extends BaseHit> = AutocompleteIndicesProps<TItem> | AutocompleteFeedsProps<TItem>;
+export declare function EXPERIMENTAL_Autocomplete<TItem extends BaseHit = BaseHit>(props: AutocompleteProps<TItem>): React.JSX.Element;
 export {};