react-instantsearch 7.35.1 → 7.37.0

package/dist/es/widgets/Autocomplete.js

@@ -1,14 +1,14 @@
-import { _ as _$1 } from '@swc/helpers/esm/_object_spread.js';
+import { _ as _$2 } from '@swc/helpers/esm/_object_spread.js';
 import { _ as _$4 } from '@swc/helpers/esm/_object_spread_props.js';
 import { _ } from '@swc/helpers/esm/_object_without_properties.js';
-import { _ as _$5 } from '@swc/helpers/esm/_sliced_to_array.js';
-import { _ as _$2 } from '@swc/helpers/esm/_to_consumable_array.js';
-import { _ as _$3 } from '@swc/helpers/esm/_type_of.js';
+import { _ as _$1 } from '@swc/helpers/esm/_sliced_to_array.js';
+import { _ as _$3 } from '@swc/helpers/esm/_to_consumable_array.js';
+import { _ as _$5 } from '@swc/helpers/esm/_type_of.js';
 import { createAutocompleteComponent, createAutocompletePanelComponent, createAutocompleteIndexComponent, createAutocompleteSuggestionComponent, createAutocompletePromptSuggestionComponent, createAutocompleteRecentSearchComponent, createAutocompleteDetachedContainerComponent, createAutocompleteDetachedOverlayComponent, createAutocompleteDetachedFormContainerComponent, createAutocompleteDetachedSearchButtonComponent, createAutocompletePropGetters, createAutocompleteStorage, cx, getPromptSuggestionHits, isPromptSuggestion } from 'instantsearch-ui-components';
 import { openChat, isChatBusy } from 'instantsearch.js/es/lib/chat/index.js';
 import 'instantsearch.js/es/lib/utils/index.js';
-import React, { createElement, Fragment, useEffect, useMemo, useRef, useState } from 'react';
-import { useInstantSearch, useSearchBox, Index, Configure, useAutocomplete } from 'react-instantsearch-core';
+import React, { createElement, Fragment, useEffect, useMemo, useRef, useState, useLayoutEffect } from 'react';
+import { useInstantSearch, useInstantSearchContext, useSearchBox, Index, Configure, Feeds, useAutocomplete } from 'react-instantsearch-core';
 import { AutocompleteSearch } from '../components/AutocompleteSearch.js';
 import { Highlight } from './Highlight.js';
 import { ReverseHighlight } from './ReverseHighlight.js';
@@ -54,6 +54,16 @@ var AutocompleteDetachedSearchButton = createAutocompleteDetachedSearchButtonCom
     Fragment: 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.useId ? function() {
+    return React.useId();
+} : function() {
+    return React.useState(function() {
+        return ":a".concat(id++, ":");
+    })[0];
+};
 var usePropGetters = createAutocompletePropGetters({
     useEffect: useEffect,
     useId: React.useId || function() {
@@ -108,12 +118,12 @@ function getMediaQueryList(mediaQuery) {
     }, [
         mediaQuery
     ]);
-    var _useState = _$5(useState(function() {
+    var _useState = _$1(useState(function() {
         var _getMediaQueryList;
         return resolvedMediaQuery ? Boolean((_getMediaQueryList = getMediaQueryList(resolvedMediaQuery)) === null || _getMediaQueryList === void 0 ? void 0 : _getMediaQueryList.matches) : false;
     }), 2), isDetached = _useState[0], setIsDetached = _useState[1];
-    var _useState1 = _$5(useState(false), 2), isModalOpen = _useState1[0], setIsModalOpen = _useState1[1];
-    var _useState2 = _$5(useState(false), 2), isModalDetached = _useState2[0], setIsModalDetached = _useState2[1];
+    var _useState1 = _$1(useState(false), 2), isModalOpen = _useState1[0], setIsModalOpen = _useState1[1];
+    var _useState2 = _$1(useState(false), 2), isModalDetached = _useState2[0], setIsModalDetached = _useState2[1];
     useEffect(function() {
         if (!resolvedMediaQuery) {
             setIsDetached(false);
@@ -189,99 +199,193 @@ 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 = _(_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 = _(props, [
         "showQuerySuggestions",
         "showPromptSuggestions",
         "showRecent",
         "searchParameters",
         "detachedMediaQuery",
         "translations",
-        "aiMode"
+        "transformItems"
     ]);
-    var _showRecent_classNames, _showRecent_classNames1, _showRecent_classNames2, _showRecent_classNames3;
-    var translations = _$1({}, DEFAULT_TRANSLATIONS, userTranslations);
+    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 = _$1(useState(autoFocus === true), 2), activated = _useState[0], setActivated = _useState[1];
+    var translations = _$2({}, DEFAULT_TRANSLATIONS, userTranslations);
     var _useInstantSearch = useInstantSearch(), indexUiState = _useInstantSearch.indexUiState, indexRenderState = _useInstantSearch.indexRenderState, status = _useInstantSearch.status;
-    var refine = useSearchBox({}, _$1({
+    var compositionID = useInstantSearchContext().compositionID;
+    var refine = useSearchBox({}, _$2({
         $$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 = _$1({
+    var searchParameters = _$2({
         hitsPerPage: 5
     }, userSearchParameters);
-    var indicesConfig = _$2(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.createElement(AutocompleteSuggestion, {
-                    item: item,
-                    onSelect: onSelect,
-                    onApply: onApply
-                }, /*#__PURE__*/ React.createElement(ConditionalReverseHighlight, {
-                    item: item
-                }));
-            },
-            classNames: {
-                root: 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: 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: 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: 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: _$1({
+    // 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 = 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
+            };
+        }) : _$3(indices !== null && indices !== void 0 ? indices : []);
+        if (querySuggestionsKey) {
+            var _showQuerySuggestions_classNames, _showQuerySuggestions_classNames1, _showQuerySuggestions_classNames2, _showQuerySuggestions_classNames3;
+            var querySuggestionsSearchParameters = isFeedsMode ? undefined : _$2({
                 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.createElement(AutocompletePromptSuggestion, {
-                    item: item,
-                    onSelect: onSelect
-                }, /*#__PURE__*/ React.createElement(ConditionalHighlight, {
-                    item: item,
-                    attribute: "prompt"
-                }));
-            },
-            classNames: {
-                root: cx('ais-AutocompletePromptSuggestions', (_showPromptSuggestions_classNames = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames === void 0 ? void 0 : _showPromptSuggestions_classNames.root),
-                list: cx('ais-AutocompletePromptSuggestionsList', (_showPromptSuggestions_classNames1 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames1 === void 0 ? void 0 : _showPromptSuggestions_classNames1.list),
-                header: cx('ais-AutocompletePromptSuggestionsHeader', (_showPromptSuggestions_classNames2 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames2 === void 0 ? void 0 : _showPromptSuggestions_classNames2.header),
-                item: cx('ais-AutocompletePromptSuggestionsItem', (_showPromptSuggestions_classNames3 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames3 === void 0 ? void 0 : _showPromptSuggestions_classNames3.item)
-            },
-            searchParameters: _$1({
+            }, 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.createElement(AutocompleteSuggestion, {
+                        item: item,
+                        onSelect: onSelect,
+                        onApply: onApply
+                    }, /*#__PURE__*/ React.createElement(ConditionalReverseHighlight, {
+                        item: item
+                    }));
+                },
+                classNames: {
+                    root: 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: 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: 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: 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 : _$2({
                 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.createElement(AutocompletePromptSuggestion, {
+                        item: item,
+                        onSelect: onSelect
+                    }, /*#__PURE__*/ React.createElement(ConditionalHighlight, {
+                        item: item,
+                        attribute: "prompt"
+                    }));
+                },
+                classNames: {
+                    root: 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: 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: 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: 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 = useMemo(function() {
+        if (!showQuerySuggestions) {
+            return undefined;
+        }
+        if (isFeedsMode) {
+            return _$4(_$2({}, showQuerySuggestions), {
+                indexName: querySuggestionsKey
+            });
+        }
+        return showQuerySuggestions;
+    }, [
+        isFeedsMode,
+        querySuggestionsKey,
+        showQuerySuggestions
+    ]);
+    var normalizedShowPromptSuggestions = useMemo(function() {
+        if (!showPromptSuggestions) {
+            return undefined;
+        }
+        if (isFeedsMode) {
+            return _$4(_$2({}, 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 = useMemo(function() {
+        return isFeedsMode ? function(items) {
+            var remapped = items.map(function(item) {
+                return _$4(_$2({}, item), {
+                    indexName: item.indexId
+                });
+            });
+            return transformItems ? transformItems(remapped) : remapped;
+        } : transformItems;
+    }, [
+        isFeedsMode,
+        transformItems
+    ]);
     var recentSearchConfig = showRecent ? {
-        headerComponent: (typeof showRecent === "undefined" ? "undefined" : _$3(showRecent)) === 'object' ? showRecent.headerComponent : undefined,
-        itemComponent: (typeof showRecent === "undefined" ? "undefined" : _$3(showRecent)) === 'object' && showRecent.itemComponent ? showRecent.itemComponent : AutocompleteRecentSearch,
+        headerComponent: (typeof showRecent === "undefined" ? "undefined" : _$5(showRecent)) === 'object' ? showRecent.headerComponent : undefined,
+        itemComponent: (typeof showRecent === "undefined" ? "undefined" : _$5(showRecent)) === 'object' && showRecent.itemComponent ? showRecent.itemComponent : AutocompleteRecentSearch,
         classNames: {
-            root: cx('ais-AutocompleteRecentSearches', (typeof showRecent === "undefined" ? "undefined" : _$3(showRecent)) === 'object' ? (_showRecent_classNames = showRecent.classNames) === null || _showRecent_classNames === void 0 ? void 0 : _showRecent_classNames.root : undefined),
-            list: cx('ais-AutocompleteRecentSearchesList', (typeof showRecent === "undefined" ? "undefined" : _$3(showRecent)) === 'object' ? (_showRecent_classNames1 = showRecent.classNames) === null || _showRecent_classNames1 === void 0 ? void 0 : _showRecent_classNames1.list : undefined),
-            header: cx('ais-AutocompleteRecentSearchesHeader', (typeof showRecent === "undefined" ? "undefined" : _$3(showRecent)) === 'object' ? (_showRecent_classNames2 = showRecent.classNames) === null || _showRecent_classNames2 === void 0 ? void 0 : _showRecent_classNames2.header : undefined),
-            item: cx('ais-AutocompleteRecentSearchesItem', (typeof showRecent === "undefined" ? "undefined" : _$3(showRecent)) === 'object' ? (_showRecent_classNames3 = showRecent.classNames) === null || _showRecent_classNames3 === void 0 ? void 0 : _showRecent_classNames3.item : undefined)
+            root: cx('ais-AutocompleteRecentSearches', (typeof showRecent === "undefined" ? "undefined" : _$5(showRecent)) === 'object' ? (_showRecent_classNames = showRecent.classNames) === null || _showRecent_classNames === void 0 ? void 0 : _showRecent_classNames.root : undefined),
+            list: cx('ais-AutocompleteRecentSearchesList', (typeof showRecent === "undefined" ? "undefined" : _$5(showRecent)) === 'object' ? (_showRecent_classNames1 = showRecent.classNames) === null || _showRecent_classNames1 === void 0 ? void 0 : _showRecent_classNames1.list : undefined),
+            header: cx('ais-AutocompleteRecentSearchesHeader', (typeof showRecent === "undefined" ? "undefined" : _$5(showRecent)) === 'object' ? (_showRecent_classNames2 = showRecent.classNames) === null || _showRecent_classNames2 === void 0 ? void 0 : _showRecent_classNames2.header : undefined),
+            item: cx('ais-AutocompleteRecentSearchesItem', (typeof showRecent === "undefined" ? "undefined" : _$5(showRecent)) === 'object' ? (_showRecent_classNames3 = showRecent.classNames) === null || _showRecent_classNames3 === void 0 ? void 0 : _showRecent_classNames3.item : undefined)
         }
     } : undefined;
     var isSearchPage = useMemo(function() {
@@ -289,15 +393,88 @@ function EXPERIMENTAL_Autocomplete(_0) {
     }, [
         indexRenderState
     ]);
-    return /*#__PURE__*/ React.createElement(Fragment, null, /*#__PURE__*/ React.createElement(Index, {
-        EXPERIMENTAL_isolated: true
-    }, /*#__PURE__*/ React.createElement(Configure, searchParameters), indicesConfig.map(function(index) {
-        return /*#__PURE__*/ React.createElement(Index, {
-            key: index.indexName,
-            indexName: index.indexName
-        }, /*#__PURE__*/ React.createElement(Configure, index.searchParameters));
-    }), /*#__PURE__*/ React.createElement(InnerAutocomplete, _$4(_$1({}, props), {
-        aiMode: aiMode,
+    restProps.indices; restProps.feeds; var forwardedProps = _(restProps, [
+        "indices",
+        "feeds"
+    ]);
+    var instance = 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 = useRef(activated);
+    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 = _(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] = _$4(_$2({}, initial[isoIndexId]), {
+                    query: indexUiState.query
+                });
+            }
+            setActivated(true);
+        };
+        return /*#__PURE__*/ React.createElement(Autocomplete, _$4(_$2({}, shellRootProps), {
+            classNames: classNames
+        }), isDetached ? /*#__PURE__*/ React.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.createElement(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.createElement(InnerAutocomplete, _$4(_$2({}, forwardedProps), {
+        autoFocus: true,
+        domId: domId,
+        detached: detached,
         indicesConfig: indicesConfig,
         refineSearchBox: refine,
         isSearchStalled: isSearchStalled,
@@ -305,15 +482,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.createElement(Index, {
+            EXPERIMENTAL_isolated: true,
+            indexName: compositionID,
+            indexId: "ais-autocomplete-".concat(instanceKey)
+        }, /*#__PURE__*/ React.createElement(Configure, searchParameters), /*#__PURE__*/ React.createElement(Feeds, {
+            isolated: false,
+            renderFeed: function renderFeed() {
+                return null;
+            }
+        }), innerAutocomplete);
+    }
+    return /*#__PURE__*/ React.createElement(Index, {
+        EXPERIMENTAL_isolated: true,
+        indexId: "ais-autocomplete-".concat(instanceKey)
+    }, /*#__PURE__*/ React.createElement(Configure, searchParameters), indicesConfig.map(function(index) {
+        return /*#__PURE__*/ React.createElement(Index, {
+            key: index.indexName,
+            indexName: index.indexName,
+            indexId: "ais-autocomplete-".concat(instanceKey, "-").concat(index.indexName)
+        }, /*#__PURE__*/ React.createElement(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 = _(_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 = _(_0, [
         "indicesConfig",
         "refineSearchBox",
         "isSearchStalled",
@@ -330,10 +529,11 @@ function InnerAutocomplete(_0) {
         "transformItems",
         "placeholder",
         "autoFocus",
-        "detachedMediaQuery",
         "translations",
         "classNames",
-        "aiMode"
+        "aiMode",
+        "domId",
+        "detached"
     ]);
     var _indexUiState_query, _ref;
     var _showPromptSuggestions_searchParameters;
@@ -344,7 +544,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 = useRef(isDetached);
     var _useStorage = useStorage({
         showRecent: showRecent,
@@ -363,11 +563,11 @@ function InnerAutocomplete(_0) {
                 });
             }) : index.hits;
             if (index.indexName !== promptSuggestionsIndexName) {
-                return _$4(_$1({}, index), {
+                return _$4(_$2({}, index), {
                     hits: dedupedHits
                 });
             }
-            return _$4(_$1({}, index), {
+            return _$4(_$2({}, index), {
                 hits: getPromptSuggestionHits({
                     hits: dedupedHits,
                     limit: promptSuggestionsLimit
@@ -387,7 +587,7 @@ function InnerAutocomplete(_0) {
             if (index.indexName !== promptSuggestionsIndexName) {
                 return index;
             }
-            return _$4(_$1({}, index), {
+            return _$4(_$2({}, index), {
                 hits: getPromptSuggestionHits({
                     hits: index.hits,
                     limit: promptSuggestionsLimit
@@ -410,6 +610,7 @@ function InnerAutocomplete(_0) {
     });
     var shouldHideEmptyPanel = allIndicesEmpty && recentEmpty && !hasNoResultsTemplate && !PanelComponent;
     var _usePropGetters = usePropGetters({
+        id: domId,
         indices: indicesForPropGettersWithPromptSuggestions,
         indicesConfig: indicesConfigForPropGetters,
         onRefine: function onRefine(query) {
@@ -438,7 +639,7 @@ function InnerAutocomplete(_0) {
                 return;
             }
             if (!isSearchPage && typeof getSearchPageURL !== 'undefined') {
-                window.location.href = getSearchPageURL(_$4(_$1({}, indexUiState), {
+                window.location.href = getSearchPageURL(_$4(_$2({}, indexUiState), {
                     query: query
                 }));
                 return;
@@ -529,8 +730,8 @@ function InnerAutocomplete(_0) {
             ItemComponent: currentIndexConfig.itemComponent,
             NoResultsComponent: currentIndexConfig.noResultsComponent,
             items: hits.map(function(item) {
-                return _$4(_$1({}, item), {
-                    __indexName: indexId
+                return _$4(_$2({}, item), {
+                    __indexName: indexName
                 });
             }),
             getItemProps: getItemProps,
@@ -576,7 +777,7 @@ function InnerAutocomplete(_0) {
         aiModeButtonDisabled: aiMode ? isChatBusy(chatRenderState) : undefined,
         classNames: classNames
     });
-    var panelContent = /*#__PURE__*/ React.createElement(AutocompletePanel, _$4(_$1({}, getPanelProps()), {
+    var panelContent = /*#__PURE__*/ React.createElement(AutocompletePanel, _$4(_$2({}, getPanelProps()), {
         classNames: {
             root: classNames === null || classNames === void 0 ? void 0 : classNames.panel,
             open: classNames === null || classNames === void 0 ? void 0 : classNames.panelOpen,
@@ -588,14 +789,14 @@ function InnerAutocomplete(_0) {
     }) : Object.keys(elements).map(function(elementId) {
         return elements[elementId];
     }));
-    var detachedContainerClassNames = isModalDetached ? _$4(_$1({}, classNames), {
+    var detachedContainerClassNames = isModalDetached ? _$4(_$2({}, classNames), {
         detachedContainer: cx('ais-AutocompleteDetachedContainer--modal', classNames === null || classNames === void 0 ? void 0 : classNames.detachedContainer)
     }) : classNames;
     var _getRootProps = getRootProps(), rootRef = _getRootProps.ref, rootProps = _(_getRootProps, [
         "ref"
     ]);
     if (isDetached) {
-        return /*#__PURE__*/ React.createElement(Autocomplete, _$4(_$1({}, props, rootProps), {
+        return /*#__PURE__*/ React.createElement(Autocomplete, _$4(_$2({}, props, rootProps), {
             rootRef: rootRef,
             classNames: classNames
         }), /*#__PURE__*/ React.createElement(AutocompleteDetachedSearchButton, {
@@ -621,7 +822,7 @@ function InnerAutocomplete(_0) {
         }, searchBoxContent), panelContent)));
     }
     // Normal (non-detached) rendering
-    return /*#__PURE__*/ React.createElement(Autocomplete, _$4(_$1({}, props, rootProps), {
+    return /*#__PURE__*/ React.createElement(Autocomplete, _$4(_$2({}, props, rootProps), {
         rootRef: rootRef,
         classNames: classNames
     }), searchBoxContent, panelContent);

package/dist/es/widgets/Chat.js

@@ -7,7 +7,7 @@ import { _ as _$1 } from '@swc/helpers/esm/_to_array.js';
 import { createChatComponent } from 'instantsearch-ui-components';
 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 React, { createElement, Fragment, memo, 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';
@@ -15,7 +15,8 @@ import { createCarouselTool } from './chat/tools/SearchIndexTool.js';
 
 var ChatUiComponent = createChatComponent({
     createElement: createElement,
-    Fragment: Fragment
+    Fragment: Fragment,
+    memo: memo
 });
 function createDefaultTools(itemComponent, getSearchPageURL) {
     var _obj;
@@ -103,6 +104,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.
+    useEffect(function() {
+        if (status === 'streaming' || status === 'submitted') {
+            scrollToBottom({
+                preserveScrollPosition: true
+            });
+        }
+    }, [
+        messages,
+        status,
+        scrollToBottom
+    ]);
     return /*#__PURE__*/ React.createElement(ChatUiComponent, {
         title: title,
         open: open,