react-instantsearch 7.26.1 → 7.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/AutocompleteSearch.js +18 -11
- package/dist/cjs/components/Carousel.js +24 -17
- package/dist/cjs/components/index.js +5 -5
- package/dist/cjs/index.js +8 -88
- package/dist/cjs/lib/useStickToBottom.js +17 -11
- package/dist/cjs/types/PartialKeys.js +3 -0
- package/dist/cjs/types/Translatable.js +3 -0
- package/dist/cjs/types/index.js +6 -0
- package/dist/cjs/ui/Breadcrumb.js +31 -24
- package/dist/cjs/ui/ClearRefinements.js +19 -12
- package/dist/cjs/ui/CurrentRefinements.js +32 -26
- package/dist/cjs/ui/HierarchicalMenu.js +35 -28
- package/dist/cjs/ui/Highlight.js +20 -13
- package/dist/cjs/ui/HitsPerPage.js +21 -14
- package/dist/cjs/ui/InfiniteHits.js +38 -31
- package/dist/cjs/ui/InternalHighlight.js +14 -8
- package/dist/cjs/ui/Menu.js +32 -25
- package/dist/cjs/ui/Pagination.js +39 -32
- package/dist/cjs/ui/PoweredBy.js +23 -16
- package/dist/cjs/ui/RangeInput.js +34 -27
- package/dist/cjs/ui/RefinementList.js +40 -33
- package/dist/cjs/ui/ReverseHighlight.js +20 -13
- package/dist/cjs/ui/SearchBox.js +43 -36
- package/dist/cjs/ui/ShowMoreButton.js +13 -6
- package/dist/cjs/ui/Snippet.js +20 -13
- package/dist/cjs/ui/SortBy.js +21 -14
- package/dist/cjs/ui/Stats.js +18 -11
- package/dist/cjs/ui/ToggleRefinement.js +23 -16
- package/dist/cjs/ui/lib/capitalize.js +9 -2
- package/dist/cjs/ui/lib/index.js +6 -7
- package/dist/cjs/ui/lib/isModifierClick.js +9 -2
- package/dist/cjs/widgets/Autocomplete.js +243 -119
- package/dist/cjs/widgets/Breadcrumb.js +17 -10
- package/dist/cjs/widgets/Chat.js +69 -47
- package/dist/cjs/widgets/ClearRefinements.js +17 -10
- package/dist/cjs/widgets/CurrentRefinements.js +17 -10
- package/dist/cjs/widgets/FilterSuggestions.js +20 -13
- package/dist/cjs/widgets/FrequentlyBoughtTogether.js +23 -16
- package/dist/cjs/widgets/HierarchicalMenu.js +18 -11
- package/dist/cjs/widgets/Highlight.js +19 -12
- package/dist/cjs/widgets/Hits.js +24 -17
- package/dist/cjs/widgets/HitsPerPage.js +17 -10
- package/dist/cjs/widgets/InfiniteHits.js +17 -10
- package/dist/cjs/widgets/LookingSimilar.js +23 -16
- package/dist/cjs/widgets/Menu.js +18 -11
- package/dist/cjs/widgets/Pagination.js +18 -11
- package/dist/cjs/widgets/PoweredBy.js +16 -9
- package/dist/cjs/widgets/RangeInput.js +17 -10
- package/dist/cjs/widgets/RefinementList.js +23 -16
- package/dist/cjs/widgets/RelatedProducts.js +23 -16
- package/dist/cjs/widgets/ReverseHighlight.js +19 -12
- package/dist/cjs/widgets/SearchBox.js +20 -13
- package/dist/cjs/widgets/Snippet.js +19 -12
- package/dist/cjs/widgets/SortBy.js +17 -10
- package/dist/cjs/widgets/Stats.js +17 -10
- package/dist/cjs/widgets/ToggleRefinement.js +17 -10
- package/dist/cjs/widgets/TrendingItems.js +23 -16
- package/dist/cjs/widgets/chat/tools/SearchIndexTool.js +32 -25
- package/dist/cjs/widgets/index.js +29 -76
- package/dist/cjs/widgets/index.umd.js +58 -59
- package/dist/es/widgets/Autocomplete.d.ts +8 -4
- package/dist/es/widgets/Autocomplete.js +146 -29
- package/dist/es/widgets/Chat.js +17 -4
- package/dist/umd/ReactInstantSearch.js +1190 -1003
- package/dist/umd/ReactInstantSearch.min.js +3 -3
- package/package.json +5 -5
|
@@ -1,69 +1,84 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
var
|
|
14
|
-
|
|
15
|
-
var
|
|
16
|
-
|
|
17
|
-
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "EXPERIMENTAL_Autocomplete", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function() {
|
|
9
|
+
return EXPERIMENTAL_Autocomplete;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
13
|
+
var _object_spread = require("@swc/helpers/_/_object_spread");
|
|
14
|
+
var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
|
|
15
|
+
var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
|
|
16
|
+
var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
|
|
17
|
+
var _to_consumable_array = require("@swc/helpers/_/_to_consumable_array");
|
|
18
|
+
var _type_of = require("@swc/helpers/_/_type_of");
|
|
19
|
+
var _instantsearchuicomponents = require("instantsearch-ui-components");
|
|
20
|
+
require("instantsearch.js/cjs/lib/utils");
|
|
21
|
+
var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
22
|
+
var _reactinstantsearchcore = require("react-instantsearch-core");
|
|
23
|
+
var _AutocompleteSearch = require("../components/AutocompleteSearch");
|
|
24
|
+
var _Highlight = require("./Highlight");
|
|
25
|
+
var _ReverseHighlight = require("./ReverseHighlight");
|
|
26
|
+
var Autocomplete = (0, _instantsearchuicomponents.createAutocompleteComponent)({
|
|
27
|
+
createElement: _react.createElement,
|
|
28
|
+
Fragment: _react.Fragment
|
|
29
|
+
});
|
|
30
|
+
var AutocompletePanel = (0, _instantsearchuicomponents.createAutocompletePanelComponent)({
|
|
31
|
+
createElement: _react.createElement,
|
|
32
|
+
Fragment: _react.Fragment
|
|
18
33
|
});
|
|
19
|
-
var
|
|
20
|
-
createElement:
|
|
21
|
-
Fragment:
|
|
34
|
+
var AutocompleteIndex = (0, _instantsearchuicomponents.createAutocompleteIndexComponent)({
|
|
35
|
+
createElement: _react.createElement,
|
|
36
|
+
Fragment: _react.Fragment
|
|
22
37
|
});
|
|
23
|
-
var
|
|
24
|
-
createElement:
|
|
25
|
-
Fragment:
|
|
38
|
+
var AutocompleteSuggestion = (0, _instantsearchuicomponents.createAutocompleteSuggestionComponent)({
|
|
39
|
+
createElement: _react.createElement,
|
|
40
|
+
Fragment: _react.Fragment
|
|
26
41
|
});
|
|
27
|
-
var
|
|
28
|
-
createElement:
|
|
29
|
-
Fragment:
|
|
42
|
+
var AutocompletePromptSuggestion = (0, _instantsearchuicomponents.createAutocompletePromptSuggestionComponent)({
|
|
43
|
+
createElement: _react.createElement,
|
|
44
|
+
Fragment: _react.Fragment
|
|
30
45
|
});
|
|
31
|
-
var AutocompleteRecentSearch =
|
|
32
|
-
createElement:
|
|
33
|
-
Fragment:
|
|
46
|
+
var AutocompleteRecentSearch = (0, _instantsearchuicomponents.createAutocompleteRecentSearchComponent)({
|
|
47
|
+
createElement: _react.createElement,
|
|
48
|
+
Fragment: _react.Fragment
|
|
34
49
|
});
|
|
35
|
-
var AutocompleteDetachedContainer =
|
|
36
|
-
createElement:
|
|
37
|
-
Fragment:
|
|
50
|
+
var AutocompleteDetachedContainer = (0, _instantsearchuicomponents.createAutocompleteDetachedContainerComponent)({
|
|
51
|
+
createElement: _react.createElement,
|
|
52
|
+
Fragment: _react.Fragment
|
|
38
53
|
});
|
|
39
|
-
var AutocompleteDetachedOverlay =
|
|
40
|
-
createElement:
|
|
41
|
-
Fragment:
|
|
54
|
+
var AutocompleteDetachedOverlay = (0, _instantsearchuicomponents.createAutocompleteDetachedOverlayComponent)({
|
|
55
|
+
createElement: _react.createElement,
|
|
56
|
+
Fragment: _react.Fragment
|
|
42
57
|
});
|
|
43
|
-
var AutocompleteDetachedFormContainer =
|
|
44
|
-
createElement:
|
|
45
|
-
Fragment:
|
|
58
|
+
var AutocompleteDetachedFormContainer = (0, _instantsearchuicomponents.createAutocompleteDetachedFormContainerComponent)({
|
|
59
|
+
createElement: _react.createElement,
|
|
60
|
+
Fragment: _react.Fragment
|
|
46
61
|
});
|
|
47
|
-
var AutocompleteDetachedSearchButton =
|
|
48
|
-
createElement:
|
|
49
|
-
Fragment:
|
|
62
|
+
var AutocompleteDetachedSearchButton = (0, _instantsearchuicomponents.createAutocompleteDetachedSearchButtonComponent)({
|
|
63
|
+
createElement: _react.createElement,
|
|
64
|
+
Fragment: _react.Fragment
|
|
50
65
|
});
|
|
51
66
|
var id = 0;
|
|
52
|
-
var usePropGetters =
|
|
53
|
-
useEffect:
|
|
54
|
-
useId:
|
|
55
|
-
return
|
|
67
|
+
var usePropGetters = (0, _instantsearchuicomponents.createAutocompletePropGetters)({
|
|
68
|
+
useEffect: _react.useEffect,
|
|
69
|
+
useId: _react.default.useId || function() {
|
|
70
|
+
return _react.default.useState(function() {
|
|
56
71
|
return (id++).toString();
|
|
57
72
|
});
|
|
58
73
|
},
|
|
59
|
-
useMemo:
|
|
60
|
-
useRef:
|
|
61
|
-
useState:
|
|
74
|
+
useMemo: _react.useMemo,
|
|
75
|
+
useRef: _react.useRef,
|
|
76
|
+
useState: _react.useState
|
|
62
77
|
});
|
|
63
|
-
var useStorage =
|
|
64
|
-
useEffect:
|
|
65
|
-
useMemo:
|
|
66
|
-
useState:
|
|
78
|
+
var useStorage = (0, _instantsearchuicomponents.createAutocompleteStorage)({
|
|
79
|
+
useEffect: _react.useEffect,
|
|
80
|
+
useMemo: _react.useMemo,
|
|
81
|
+
useState: _react.useState
|
|
67
82
|
});
|
|
68
83
|
var DEFAULT_DETACHED_MEDIA_QUERY = '(max-width: 680px)';
|
|
69
84
|
var DEFAULT_DETACHED_MODAL_MEDIA_QUERY = '(min-width: 680px)';
|
|
@@ -98,18 +113,18 @@ function getMediaQueryList(mediaQuery) {
|
|
|
98
113
|
/**
|
|
99
114
|
* Hook to manage detached (mobile) mode state
|
|
100
115
|
*/ function useDetachedMode(mediaQuery) {
|
|
101
|
-
var resolvedMediaQuery =
|
|
116
|
+
var resolvedMediaQuery = (0, _react.useMemo)(function() {
|
|
102
117
|
return resolveMediaQuery(mediaQuery, DETACHED_MEDIA_QUERY_CSS_VAR, DEFAULT_DETACHED_MEDIA_QUERY);
|
|
103
118
|
}, [
|
|
104
119
|
mediaQuery
|
|
105
120
|
]);
|
|
106
|
-
var _useState = _sliced_to_array._(
|
|
121
|
+
var _useState = _sliced_to_array._((0, _react.useState)(function() {
|
|
107
122
|
var _getMediaQueryList;
|
|
108
123
|
return resolvedMediaQuery ? Boolean((_getMediaQueryList = getMediaQueryList(resolvedMediaQuery)) === null || _getMediaQueryList === void 0 ? void 0 : _getMediaQueryList.matches) : false;
|
|
109
124
|
}), 2), isDetached = _useState[0], setIsDetached = _useState[1];
|
|
110
|
-
var _useState1 = _sliced_to_array._(
|
|
111
|
-
var _useState2 = _sliced_to_array._(
|
|
112
|
-
|
|
125
|
+
var _useState1 = _sliced_to_array._((0, _react.useState)(false), 2), isModalOpen = _useState1[0], setIsModalOpen = _useState1[1];
|
|
126
|
+
var _useState2 = _sliced_to_array._((0, _react.useState)(false), 2), isModalDetached = _useState2[0], setIsModalDetached = _useState2[1];
|
|
127
|
+
(0, _react.useEffect)(function() {
|
|
113
128
|
if (!resolvedMediaQuery) {
|
|
114
129
|
setIsDetached(false);
|
|
115
130
|
return function() {};
|
|
@@ -135,7 +150,7 @@ function getMediaQueryList(mediaQuery) {
|
|
|
135
150
|
resolvedMediaQuery,
|
|
136
151
|
isDetached
|
|
137
152
|
]);
|
|
138
|
-
|
|
153
|
+
(0, _react.useEffect)(function() {
|
|
139
154
|
if (!isDetached) {
|
|
140
155
|
setIsModalDetached(false);
|
|
141
156
|
return function() {};
|
|
@@ -161,7 +176,7 @@ function getMediaQueryList(mediaQuery) {
|
|
|
161
176
|
}, [
|
|
162
177
|
isDetached
|
|
163
178
|
]);
|
|
164
|
-
|
|
179
|
+
(0, _react.useEffect)(function() {
|
|
165
180
|
if (typeof document === 'undefined') return function() {};
|
|
166
181
|
if (isModalOpen) {
|
|
167
182
|
var scrollY = window.scrollY;
|
|
@@ -185,9 +200,10 @@ function getMediaQueryList(mediaQuery) {
|
|
|
185
200
|
};
|
|
186
201
|
}
|
|
187
202
|
function EXPERIMENTAL_Autocomplete(_0) {
|
|
188
|
-
var _0_indices = _0.indices, indices = _0_indices === void 0 ? [] : _0_indices,
|
|
203
|
+
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, props = _object_without_properties._(_0, [
|
|
189
204
|
"indices",
|
|
190
|
-
"
|
|
205
|
+
"showQuerySuggestions",
|
|
206
|
+
"showPromptSuggestions",
|
|
191
207
|
"showRecent",
|
|
192
208
|
"searchParameters",
|
|
193
209
|
"detachedMediaQuery",
|
|
@@ -195,8 +211,8 @@ function EXPERIMENTAL_Autocomplete(_0) {
|
|
|
195
211
|
]);
|
|
196
212
|
var _showRecent_classNames, _showRecent_classNames1, _showRecent_classNames2, _showRecent_classNames3;
|
|
197
213
|
var translations = _object_spread._({}, DEFAULT_TRANSLATIONS, userTranslations);
|
|
198
|
-
var _useInstantSearch =
|
|
199
|
-
var refine =
|
|
214
|
+
var _useInstantSearch = (0, _reactinstantsearchcore.useInstantSearch)(), indexUiState = _useInstantSearch.indexUiState, indexRenderState = _useInstantSearch.indexRenderState, status = _useInstantSearch.status;
|
|
215
|
+
var refine = (0, _reactinstantsearchcore.useSearchBox)({}, {
|
|
200
216
|
$$type: 'ais.autocomplete',
|
|
201
217
|
$$widgetType: 'ais.autocomplete'
|
|
202
218
|
}).refine;
|
|
@@ -205,56 +221,89 @@ function EXPERIMENTAL_Autocomplete(_0) {
|
|
|
205
221
|
hitsPerPage: 5
|
|
206
222
|
}, userSearchParameters);
|
|
207
223
|
var indicesConfig = _to_consumable_array._(indices);
|
|
208
|
-
if (
|
|
209
|
-
var
|
|
224
|
+
if (showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName) {
|
|
225
|
+
var _showQuerySuggestions_classNames, _showQuerySuggestions_classNames1, _showQuerySuggestions_classNames2, _showQuerySuggestions_classNames3;
|
|
210
226
|
indicesConfig.unshift({
|
|
211
|
-
indexName:
|
|
212
|
-
headerComponent:
|
|
213
|
-
itemComponent:
|
|
227
|
+
indexName: showQuerySuggestions.indexName,
|
|
228
|
+
headerComponent: showQuerySuggestions.headerComponent,
|
|
229
|
+
itemComponent: showQuerySuggestions.itemComponent || function(param) {
|
|
214
230
|
var item = param.item, onSelect = param.onSelect, onApply = param.onApply;
|
|
215
|
-
return /*#__PURE__*/
|
|
231
|
+
return /*#__PURE__*/ _react.default.createElement(AutocompleteSuggestion, {
|
|
216
232
|
item: item,
|
|
217
233
|
onSelect: onSelect,
|
|
218
234
|
onApply: onApply
|
|
219
|
-
}, /*#__PURE__*/
|
|
235
|
+
}, /*#__PURE__*/ _react.default.createElement(ConditionalReverseHighlight, {
|
|
220
236
|
item: item
|
|
221
237
|
}));
|
|
222
238
|
},
|
|
223
239
|
classNames: {
|
|
224
|
-
root:
|
|
225
|
-
list:
|
|
226
|
-
header:
|
|
227
|
-
item:
|
|
240
|
+
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),
|
|
241
|
+
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),
|
|
242
|
+
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),
|
|
243
|
+
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)
|
|
228
244
|
},
|
|
245
|
+
searchParameters: _object_spread._({
|
|
246
|
+
hitsPerPage: 3
|
|
247
|
+
}, showQuerySuggestions.searchParameters),
|
|
229
248
|
getQuery: function getQuery(item) {
|
|
230
249
|
return item.query;
|
|
231
250
|
},
|
|
232
|
-
getURL:
|
|
251
|
+
getURL: showQuerySuggestions.getURL
|
|
252
|
+
});
|
|
253
|
+
}
|
|
254
|
+
if (showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : showPromptSuggestions.indexName) {
|
|
255
|
+
var _showPromptSuggestions_classNames, _showPromptSuggestions_classNames1, _showPromptSuggestions_classNames2, _showPromptSuggestions_classNames3;
|
|
256
|
+
indicesConfig.push({
|
|
257
|
+
indexName: showPromptSuggestions.indexName,
|
|
258
|
+
headerComponent: showPromptSuggestions.headerComponent,
|
|
259
|
+
itemComponent: showPromptSuggestions.itemComponent || function(param) {
|
|
260
|
+
var item = param.item, onSelect = param.onSelect;
|
|
261
|
+
return /*#__PURE__*/ _react.default.createElement(AutocompletePromptSuggestion, {
|
|
262
|
+
item: item,
|
|
263
|
+
onSelect: onSelect
|
|
264
|
+
}, /*#__PURE__*/ _react.default.createElement(ConditionalHighlight, {
|
|
265
|
+
item: item,
|
|
266
|
+
attribute: "prompt"
|
|
267
|
+
}));
|
|
268
|
+
},
|
|
269
|
+
classNames: {
|
|
270
|
+
root: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestions', (_showPromptSuggestions_classNames = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames === void 0 ? void 0 : _showPromptSuggestions_classNames.root),
|
|
271
|
+
list: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsList', (_showPromptSuggestions_classNames1 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames1 === void 0 ? void 0 : _showPromptSuggestions_classNames1.list),
|
|
272
|
+
header: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsHeader', (_showPromptSuggestions_classNames2 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames2 === void 0 ? void 0 : _showPromptSuggestions_classNames2.header),
|
|
273
|
+
item: (0, _instantsearchuicomponents.cx)('ais-AutocompletePromptSuggestionsItem', (_showPromptSuggestions_classNames3 = showPromptSuggestions.classNames) === null || _showPromptSuggestions_classNames3 === void 0 ? void 0 : _showPromptSuggestions_classNames3.item)
|
|
274
|
+
},
|
|
275
|
+
searchParameters: _object_spread._({
|
|
276
|
+
hitsPerPage: 3
|
|
277
|
+
}, showPromptSuggestions.searchParameters),
|
|
278
|
+
getQuery: function getQuery(item) {
|
|
279
|
+
return item.prompt;
|
|
280
|
+
},
|
|
281
|
+
getURL: showPromptSuggestions.getURL
|
|
233
282
|
});
|
|
234
283
|
}
|
|
235
284
|
var recentSearchConfig = showRecent ? {
|
|
236
285
|
headerComponent: (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' ? showRecent.headerComponent : undefined,
|
|
237
286
|
itemComponent: (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' && showRecent.itemComponent ? showRecent.itemComponent : AutocompleteRecentSearch,
|
|
238
287
|
classNames: {
|
|
239
|
-
root:
|
|
240
|
-
list:
|
|
241
|
-
header:
|
|
242
|
-
item:
|
|
288
|
+
root: (0, _instantsearchuicomponents.cx)('ais-AutocompleteRecentSearches', (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' ? (_showRecent_classNames = showRecent.classNames) === null || _showRecent_classNames === void 0 ? void 0 : _showRecent_classNames.root : undefined),
|
|
289
|
+
list: (0, _instantsearchuicomponents.cx)('ais-AutocompleteRecentSearchesList', (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' ? (_showRecent_classNames1 = showRecent.classNames) === null || _showRecent_classNames1 === void 0 ? void 0 : _showRecent_classNames1.list : undefined),
|
|
290
|
+
header: (0, _instantsearchuicomponents.cx)('ais-AutocompleteRecentSearchesHeader', (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' ? (_showRecent_classNames2 = showRecent.classNames) === null || _showRecent_classNames2 === void 0 ? void 0 : _showRecent_classNames2.header : undefined),
|
|
291
|
+
item: (0, _instantsearchuicomponents.cx)('ais-AutocompleteRecentSearchesItem', (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' ? (_showRecent_classNames3 = showRecent.classNames) === null || _showRecent_classNames3 === void 0 ? void 0 : _showRecent_classNames3.item : undefined)
|
|
243
292
|
}
|
|
244
293
|
} : undefined;
|
|
245
|
-
var isSearchPage =
|
|
294
|
+
var isSearchPage = (0, _react.useMemo)(function() {
|
|
246
295
|
return typeof indexRenderState.hits !== 'undefined' || typeof indexRenderState.infiniteHits !== 'undefined';
|
|
247
296
|
}, [
|
|
248
297
|
indexRenderState
|
|
249
298
|
]);
|
|
250
|
-
return /*#__PURE__*/
|
|
299
|
+
return /*#__PURE__*/ _react.default.createElement(_react.Fragment, null, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
|
|
251
300
|
EXPERIMENTAL_isolated: true
|
|
252
|
-
}, /*#__PURE__*/
|
|
253
|
-
return /*#__PURE__*/
|
|
301
|
+
}, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, searchParameters), indicesConfig.map(function(index) {
|
|
302
|
+
return /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
|
|
254
303
|
key: index.indexName,
|
|
255
304
|
indexName: index.indexName
|
|
256
|
-
}, /*#__PURE__*/
|
|
257
|
-
}), /*#__PURE__*/
|
|
305
|
+
}, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, index.searchParameters));
|
|
306
|
+
}), /*#__PURE__*/ _react.default.createElement(InnerAutocomplete, _object_spread_props._(_object_spread._({}, props), {
|
|
258
307
|
indicesConfig: indicesConfig,
|
|
259
308
|
refineSearchBox: refine,
|
|
260
309
|
isSearchStalled: isSearchStalled,
|
|
@@ -262,13 +311,15 @@ function EXPERIMENTAL_Autocomplete(_0) {
|
|
|
262
311
|
isSearchPage: isSearchPage,
|
|
263
312
|
showRecent: showRecent,
|
|
264
313
|
recentSearchConfig: recentSearchConfig,
|
|
265
|
-
|
|
314
|
+
showQuerySuggestions: showQuerySuggestions,
|
|
266
315
|
detachedMediaQuery: detachedMediaQuery,
|
|
267
|
-
translations: translations
|
|
316
|
+
translations: translations,
|
|
317
|
+
showPromptSuggestions: showPromptSuggestions,
|
|
318
|
+
chatRenderState: indexRenderState.chat
|
|
268
319
|
}))));
|
|
269
320
|
}
|
|
270
321
|
function InnerAutocomplete(_0) {
|
|
271
|
-
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,
|
|
322
|
+
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, _0_detachedMediaQuery = _0.detachedMediaQuery, detachedMediaQuery = _0_detachedMediaQuery === void 0 ? DEFAULT_DETACHED_MEDIA_QUERY : _0_detachedMediaQuery, translations = _0.translations, classNames = _0.classNames, props = _object_without_properties._(_0, [
|
|
272
323
|
"indicesConfig",
|
|
273
324
|
"refineSearchBox",
|
|
274
325
|
"isSearchStalled",
|
|
@@ -279,27 +330,78 @@ function InnerAutocomplete(_0) {
|
|
|
279
330
|
"panelComponent",
|
|
280
331
|
"showRecent",
|
|
281
332
|
"recentSearchConfig",
|
|
282
|
-
"
|
|
333
|
+
"showQuerySuggestions",
|
|
334
|
+
"showPromptSuggestions",
|
|
335
|
+
"chatRenderState",
|
|
283
336
|
"transformItems",
|
|
284
337
|
"placeholder",
|
|
285
338
|
"detachedMediaQuery",
|
|
286
339
|
"translations",
|
|
287
340
|
"classNames"
|
|
288
341
|
]);
|
|
289
|
-
var
|
|
342
|
+
var _ref;
|
|
343
|
+
var _showPromptSuggestions_searchParameters;
|
|
344
|
+
var _useAutocomplete = (0, _reactinstantsearchcore.useAutocomplete)({
|
|
290
345
|
transformItems: transformItems
|
|
291
346
|
}), indices = _useAutocomplete.indices, refineAutocomplete = _useAutocomplete.refine, currentRefinement = _useAutocomplete.currentRefinement;
|
|
292
347
|
var _useDetachedMode = useDetachedMode(detachedMediaQuery), isDetached = _useDetachedMode.isDetached, isModalDetached = _useDetachedMode.isModalDetached, isModalOpen = _useDetachedMode.isModalOpen, setIsModalOpen = _useDetachedMode.setIsModalOpen;
|
|
293
|
-
var previousIsDetachedRef =
|
|
348
|
+
var previousIsDetachedRef = (0, _react.useRef)(isDetached);
|
|
294
349
|
var _useStorage = useStorage({
|
|
295
350
|
showRecent: showRecent,
|
|
296
351
|
query: currentRefinement,
|
|
297
352
|
indices: indices,
|
|
298
353
|
indicesConfig: indicesConfig,
|
|
299
|
-
suggestionsIndexName:
|
|
354
|
+
suggestionsIndexName: showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName
|
|
300
355
|
}), storage = _useStorage.storage, storageHits = _useStorage.storageHits, indicesForPropGetters = _useStorage.indicesForPropGetters, indicesConfigForPropGetters = _useStorage.indicesConfigForPropGetters;
|
|
356
|
+
var promptSuggestionsIndexName = showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : showPromptSuggestions.indexName;
|
|
357
|
+
var promptSuggestionsLimit = (_ref = showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : (_showPromptSuggestions_searchParameters = showPromptSuggestions.searchParameters) === null || _showPromptSuggestions_searchParameters === void 0 ? void 0 : _showPromptSuggestions_searchParameters.hitsPerPage) !== null && _ref !== void 0 ? _ref : 3;
|
|
358
|
+
var indicesForPanel = (0, _react.useMemo)(function() {
|
|
359
|
+
return indices.map(function(index) {
|
|
360
|
+
var dedupedHits = index.indexName === (showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName) && showRecent ? index.hits.filter(function(suggestionHit) {
|
|
361
|
+
return !storageHits.find(function(storageHit) {
|
|
362
|
+
return storageHit.query === suggestionHit.query;
|
|
363
|
+
});
|
|
364
|
+
}) : index.hits;
|
|
365
|
+
if (index.indexName !== promptSuggestionsIndexName) {
|
|
366
|
+
return _object_spread_props._(_object_spread._({}, index), {
|
|
367
|
+
hits: dedupedHits
|
|
368
|
+
});
|
|
369
|
+
}
|
|
370
|
+
return _object_spread_props._(_object_spread._({}, index), {
|
|
371
|
+
hits: (0, _instantsearchuicomponents.getPromptSuggestionHits)({
|
|
372
|
+
hits: dedupedHits,
|
|
373
|
+
limit: promptSuggestionsLimit
|
|
374
|
+
})
|
|
375
|
+
});
|
|
376
|
+
});
|
|
377
|
+
}, [
|
|
378
|
+
indices,
|
|
379
|
+
promptSuggestionsIndexName,
|
|
380
|
+
promptSuggestionsLimit,
|
|
381
|
+
showRecent,
|
|
382
|
+
showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName,
|
|
383
|
+
storageHits
|
|
384
|
+
]);
|
|
385
|
+
var indicesForPropGettersWithPromptSuggestions = (0, _react.useMemo)(function() {
|
|
386
|
+
return indicesForPropGetters.map(function(index) {
|
|
387
|
+
if (index.indexName !== promptSuggestionsIndexName) {
|
|
388
|
+
return index;
|
|
389
|
+
}
|
|
390
|
+
return _object_spread_props._(_object_spread._({}, index), {
|
|
391
|
+
hits: (0, _instantsearchuicomponents.getPromptSuggestionHits)({
|
|
392
|
+
hits: index.hits,
|
|
393
|
+
limit: promptSuggestionsLimit
|
|
394
|
+
})
|
|
395
|
+
});
|
|
396
|
+
});
|
|
397
|
+
}, [
|
|
398
|
+
indicesForPropGetters,
|
|
399
|
+
promptSuggestionsIndexName,
|
|
400
|
+
promptSuggestionsLimit
|
|
401
|
+
]);
|
|
402
|
+
(0, _react.useRef)(false);
|
|
301
403
|
var _usePropGetters = usePropGetters({
|
|
302
|
-
indices:
|
|
404
|
+
indices: indicesForPropGettersWithPromptSuggestions,
|
|
303
405
|
indicesConfig: indicesConfigForPropGetters,
|
|
304
406
|
onRefine: function onRefine(query) {
|
|
305
407
|
refineAutocomplete(query);
|
|
@@ -310,7 +412,19 @@ function InnerAutocomplete(_0) {
|
|
|
310
412
|
refineAutocomplete(query);
|
|
311
413
|
},
|
|
312
414
|
onSelect: userOnSelect !== null && userOnSelect !== void 0 ? userOnSelect : function(param) {
|
|
313
|
-
var query = param.query, setQuery = param.setQuery, url = param.url;
|
|
415
|
+
var item = param.item, query = param.query, setQuery = param.setQuery, url = param.url;
|
|
416
|
+
if ((0, _instantsearchuicomponents.isPromptSuggestion)(item)) {
|
|
417
|
+
var chatRenderStateWithFocus = chatRenderState;
|
|
418
|
+
if (chatRenderStateWithFocus) {
|
|
419
|
+
var _chatRenderStateWithFocus_setOpen, _chatRenderStateWithFocus_focusInput, _chatRenderStateWithFocus_sendMessage;
|
|
420
|
+
(_chatRenderStateWithFocus_setOpen = chatRenderStateWithFocus.setOpen) === null || _chatRenderStateWithFocus_setOpen === void 0 ? void 0 : _chatRenderStateWithFocus_setOpen.call(chatRenderStateWithFocus, true);
|
|
421
|
+
(_chatRenderStateWithFocus_focusInput = chatRenderStateWithFocus.focusInput) === null || _chatRenderStateWithFocus_focusInput === void 0 ? void 0 : _chatRenderStateWithFocus_focusInput.call(chatRenderStateWithFocus);
|
|
422
|
+
(_chatRenderStateWithFocus_sendMessage = chatRenderStateWithFocus.sendMessage) === null || _chatRenderStateWithFocus_sendMessage === void 0 ? void 0 : _chatRenderStateWithFocus_sendMessage.call(chatRenderStateWithFocus, {
|
|
423
|
+
text: item.prompt
|
|
424
|
+
});
|
|
425
|
+
return;
|
|
426
|
+
}
|
|
427
|
+
}
|
|
314
428
|
if (url) {
|
|
315
429
|
window.location.href = url;
|
|
316
430
|
return;
|
|
@@ -333,7 +447,7 @@ function InnerAutocomplete(_0) {
|
|
|
333
447
|
isDetached: isDetached
|
|
334
448
|
}), getInputProps = _usePropGetters.getInputProps, getItemProps = _usePropGetters.getItemProps, getPanelProps = _usePropGetters.getPanelProps, getRootProps = _usePropGetters.getRootProps, isOpen = _usePropGetters.isOpen, setIsOpen = _usePropGetters.setIsOpen, focusInput = _usePropGetters.focusInput;
|
|
335
449
|
// Open panel and focus input when modal opens
|
|
336
|
-
|
|
450
|
+
(0, _react.useEffect)(function() {
|
|
337
451
|
if (isDetached && isModalOpen) {
|
|
338
452
|
setIsOpen(true);
|
|
339
453
|
// Focus input to show the keyboard on mobile
|
|
@@ -346,7 +460,7 @@ function InnerAutocomplete(_0) {
|
|
|
346
460
|
focusInput
|
|
347
461
|
]);
|
|
348
462
|
// Keep the modal open if the panel was open before switching to detached
|
|
349
|
-
|
|
463
|
+
(0, _react.useEffect)(function() {
|
|
350
464
|
var wasDetached = previousIsDetachedRef.current;
|
|
351
465
|
var switchedToDetached = !wasDetached && isDetached;
|
|
352
466
|
if (switchedToDetached && isOpen) {
|
|
@@ -361,19 +475,19 @@ function InnerAutocomplete(_0) {
|
|
|
361
475
|
var elements = {};
|
|
362
476
|
if (showRecent && recentSearchConfig) {
|
|
363
477
|
var RecentSearchItemComponent = recentSearchConfig.itemComponent;
|
|
364
|
-
elements.recent = /*#__PURE__*/
|
|
478
|
+
elements.recent = /*#__PURE__*/ _react.default.createElement(AutocompleteIndex, {
|
|
365
479
|
HeaderComponent: recentSearchConfig.headerComponent,
|
|
366
480
|
// @ts-ignore - there seems to be problems with React.ComponentType and this, but it's actually correct
|
|
367
481
|
ItemComponent: function ItemComponent(param) {
|
|
368
482
|
var item = param.item, onSelect = param.onSelect, onApply = param.onApply;
|
|
369
|
-
return /*#__PURE__*/
|
|
483
|
+
return /*#__PURE__*/ _react.default.createElement(RecentSearchItemComponent, {
|
|
370
484
|
item: item,
|
|
371
485
|
onSelect: onSelect,
|
|
372
486
|
onRemoveRecentSearch: function onRemoveRecentSearch() {
|
|
373
487
|
return storage.onRemove(item.query);
|
|
374
488
|
},
|
|
375
489
|
onApply: onApply
|
|
376
|
-
}, /*#__PURE__*/
|
|
490
|
+
}, /*#__PURE__*/ _react.default.createElement(ConditionalReverseHighlight, {
|
|
377
491
|
item: item
|
|
378
492
|
}));
|
|
379
493
|
},
|
|
@@ -383,27 +497,27 @@ function InnerAutocomplete(_0) {
|
|
|
383
497
|
key: "recentSearches"
|
|
384
498
|
});
|
|
385
499
|
}
|
|
386
|
-
|
|
500
|
+
indicesForPanel.forEach(function(param) {
|
|
387
501
|
var indexId = param.indexId, indexName = param.indexName, hits = param.hits;
|
|
388
|
-
var elementId = indexName
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
}
|
|
502
|
+
var elementId = indexName;
|
|
503
|
+
if (indexName === (showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName)) {
|
|
504
|
+
elementId = 'suggestions';
|
|
505
|
+
} else if (indexName === (showPromptSuggestions === null || showPromptSuggestions === void 0 ? void 0 : showPromptSuggestions.indexName)) {
|
|
506
|
+
elementId = 'promptSuggestions';
|
|
507
|
+
}
|
|
394
508
|
var currentIndexConfig = indicesConfig.find(function(config) {
|
|
395
509
|
return config.indexName === indexName;
|
|
396
510
|
});
|
|
397
511
|
if (!currentIndexConfig) {
|
|
398
512
|
return;
|
|
399
513
|
}
|
|
400
|
-
elements[elementId] = /*#__PURE__*/
|
|
514
|
+
elements[elementId] = /*#__PURE__*/ _react.default.createElement(AutocompleteIndex, {
|
|
401
515
|
key: indexId,
|
|
402
516
|
// @ts-expect-error - there seems to be problems with React.ComponentType and this, but it's actually correct
|
|
403
517
|
HeaderComponent: currentIndexConfig.headerComponent,
|
|
404
518
|
// @ts-expect-error - there seems to be problems with React.ComponentType and this, but it's actually correct
|
|
405
519
|
ItemComponent: currentIndexConfig.itemComponent,
|
|
406
|
-
items:
|
|
520
|
+
items: hits.map(function(item) {
|
|
407
521
|
return _object_spread_props._(_object_spread._({}, item), {
|
|
408
522
|
__indexName: indexId
|
|
409
523
|
});
|
|
@@ -412,7 +526,7 @@ function InnerAutocomplete(_0) {
|
|
|
412
526
|
classNames: currentIndexConfig.classNames
|
|
413
527
|
});
|
|
414
528
|
});
|
|
415
|
-
var searchBoxContent = /*#__PURE__*/
|
|
529
|
+
var searchBoxContent = /*#__PURE__*/ _react.default.createElement(_AutocompleteSearch.AutocompleteSearch, {
|
|
416
530
|
inputProps: getInputProps(),
|
|
417
531
|
clearQuery: function clearQuery() {
|
|
418
532
|
refineSearchBox('');
|
|
@@ -425,19 +539,19 @@ function InnerAutocomplete(_0) {
|
|
|
425
539
|
refine: refineSearchBox,
|
|
426
540
|
isSearchStalled: isSearchStalled
|
|
427
541
|
});
|
|
428
|
-
var panelContent = /*#__PURE__*/
|
|
542
|
+
var panelContent = /*#__PURE__*/ _react.default.createElement(AutocompletePanel, getPanelProps(), PanelComponent ? /*#__PURE__*/ _react.default.createElement(PanelComponent, {
|
|
429
543
|
elements: elements,
|
|
430
|
-
indices:
|
|
544
|
+
indices: indicesForPanel
|
|
431
545
|
}) : Object.keys(elements).map(function(elementId) {
|
|
432
546
|
return elements[elementId];
|
|
433
547
|
}));
|
|
434
548
|
var detachedContainerClassNames = isModalDetached ? _object_spread_props._(_object_spread._({}, classNames), {
|
|
435
|
-
detachedContainer:
|
|
549
|
+
detachedContainer: (0, _instantsearchuicomponents.cx)('ais-AutocompleteDetachedContainer--modal', classNames === null || classNames === void 0 ? void 0 : classNames.detachedContainer)
|
|
436
550
|
}) : classNames;
|
|
437
551
|
if (isDetached) {
|
|
438
|
-
return /*#__PURE__*/
|
|
552
|
+
return /*#__PURE__*/ _react.default.createElement(Autocomplete, _object_spread_props._(_object_spread._({}, props, getRootProps()), {
|
|
439
553
|
classNames: classNames
|
|
440
|
-
}), /*#__PURE__*/
|
|
554
|
+
}), /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedSearchButton, {
|
|
441
555
|
query: currentRefinement || indexUiState.query || '',
|
|
442
556
|
placeholder: placeholder,
|
|
443
557
|
classNames: classNames,
|
|
@@ -450,15 +564,15 @@ function InnerAutocomplete(_0) {
|
|
|
450
564
|
refineAutocomplete('');
|
|
451
565
|
},
|
|
452
566
|
translations: translations
|
|
453
|
-
}), isModalOpen && /*#__PURE__*/
|
|
567
|
+
}), isModalOpen && /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedOverlay, {
|
|
454
568
|
classNames: classNames,
|
|
455
569
|
onClose: function onClose() {
|
|
456
570
|
setIsModalOpen(false);
|
|
457
571
|
setIsOpen(false);
|
|
458
572
|
}
|
|
459
|
-
}, /*#__PURE__*/
|
|
573
|
+
}, /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedContainer, {
|
|
460
574
|
classNames: detachedContainerClassNames
|
|
461
|
-
}, /*#__PURE__*/
|
|
575
|
+
}, /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedFormContainer, {
|
|
462
576
|
classNames: classNames,
|
|
463
577
|
onCancel: function onCancel() {
|
|
464
578
|
setIsModalOpen(false);
|
|
@@ -468,7 +582,7 @@ function InnerAutocomplete(_0) {
|
|
|
468
582
|
}, searchBoxContent), panelContent)));
|
|
469
583
|
}
|
|
470
584
|
// Normal (non-detached) rendering
|
|
471
|
-
return /*#__PURE__*/
|
|
585
|
+
return /*#__PURE__*/ _react.default.createElement(Autocomplete, _object_spread_props._(_object_spread._({}, props, getRootProps()), {
|
|
472
586
|
classNames: classNames
|
|
473
587
|
}), searchBoxContent, panelContent);
|
|
474
588
|
}
|
|
@@ -479,10 +593,20 @@ function ConditionalReverseHighlight(param) {
|
|
|
479
593
|
item._highlightResult.query.matchLevel === 'none') {
|
|
480
594
|
return item.query;
|
|
481
595
|
}
|
|
482
|
-
return /*#__PURE__*/
|
|
596
|
+
return /*#__PURE__*/ _react.default.createElement(_ReverseHighlight.ReverseHighlight, {
|
|
483
597
|
attribute: "query",
|
|
484
598
|
hit: item
|
|
485
599
|
});
|
|
486
600
|
}
|
|
487
|
-
|
|
488
|
-
|
|
601
|
+
function ConditionalHighlight(param) {
|
|
602
|
+
var item = param.item, _param_attribute = param.attribute, attribute = _param_attribute === void 0 ? 'query' : _param_attribute;
|
|
603
|
+
var _item__highlightResult;
|
|
604
|
+
if (!((_item__highlightResult = item._highlightResult) === null || _item__highlightResult === void 0 ? void 0 : _item__highlightResult[attribute]) || // @ts-expect-error - we should not have matchLevel as arrays here
|
|
605
|
+
item._highlightResult[attribute].matchLevel === 'none') {
|
|
606
|
+
return /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, item[attribute]);
|
|
607
|
+
}
|
|
608
|
+
return /*#__PURE__*/ _react.default.createElement(_Highlight.Highlight, {
|
|
609
|
+
attribute: attribute,
|
|
610
|
+
hit: item
|
|
611
|
+
});
|
|
612
|
+
}
|