react-instantsearch 7.26.0 → 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 +247 -118
- 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 +153 -31
- package/dist/es/widgets/Chat.js +17 -4
- package/dist/umd/ReactInstantSearch.js +1199 -1007
- package/dist/umd/ReactInstantSearch.min.js +3 -3
- package/package.json +5 -5
|
@@ -1,64 +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
|
-
var
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
66
|
+
var id = 0;
|
|
67
|
+
var usePropGetters = (0, _instantsearchuicomponents.createAutocompletePropGetters)({
|
|
68
|
+
useEffect: _react.useEffect,
|
|
69
|
+
useId: _react.default.useId || function() {
|
|
70
|
+
return _react.default.useState(function() {
|
|
71
|
+
return (id++).toString();
|
|
72
|
+
});
|
|
73
|
+
},
|
|
74
|
+
useMemo: _react.useMemo,
|
|
75
|
+
useRef: _react.useRef,
|
|
76
|
+
useState: _react.useState
|
|
57
77
|
});
|
|
58
|
-
var useStorage =
|
|
59
|
-
useEffect:
|
|
60
|
-
useMemo:
|
|
61
|
-
useState:
|
|
78
|
+
var useStorage = (0, _instantsearchuicomponents.createAutocompleteStorage)({
|
|
79
|
+
useEffect: _react.useEffect,
|
|
80
|
+
useMemo: _react.useMemo,
|
|
81
|
+
useState: _react.useState
|
|
62
82
|
});
|
|
63
83
|
var DEFAULT_DETACHED_MEDIA_QUERY = '(max-width: 680px)';
|
|
64
84
|
var DEFAULT_DETACHED_MODAL_MEDIA_QUERY = '(min-width: 680px)';
|
|
@@ -93,18 +113,18 @@ function getMediaQueryList(mediaQuery) {
|
|
|
93
113
|
/**
|
|
94
114
|
* Hook to manage detached (mobile) mode state
|
|
95
115
|
*/ function useDetachedMode(mediaQuery) {
|
|
96
|
-
var resolvedMediaQuery =
|
|
116
|
+
var resolvedMediaQuery = (0, _react.useMemo)(function() {
|
|
97
117
|
return resolveMediaQuery(mediaQuery, DETACHED_MEDIA_QUERY_CSS_VAR, DEFAULT_DETACHED_MEDIA_QUERY);
|
|
98
118
|
}, [
|
|
99
119
|
mediaQuery
|
|
100
120
|
]);
|
|
101
|
-
var _useState = _sliced_to_array._(
|
|
121
|
+
var _useState = _sliced_to_array._((0, _react.useState)(function() {
|
|
102
122
|
var _getMediaQueryList;
|
|
103
123
|
return resolvedMediaQuery ? Boolean((_getMediaQueryList = getMediaQueryList(resolvedMediaQuery)) === null || _getMediaQueryList === void 0 ? void 0 : _getMediaQueryList.matches) : false;
|
|
104
124
|
}), 2), isDetached = _useState[0], setIsDetached = _useState[1];
|
|
105
|
-
var _useState1 = _sliced_to_array._(
|
|
106
|
-
var _useState2 = _sliced_to_array._(
|
|
107
|
-
|
|
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() {
|
|
108
128
|
if (!resolvedMediaQuery) {
|
|
109
129
|
setIsDetached(false);
|
|
110
130
|
return function() {};
|
|
@@ -130,7 +150,7 @@ function getMediaQueryList(mediaQuery) {
|
|
|
130
150
|
resolvedMediaQuery,
|
|
131
151
|
isDetached
|
|
132
152
|
]);
|
|
133
|
-
|
|
153
|
+
(0, _react.useEffect)(function() {
|
|
134
154
|
if (!isDetached) {
|
|
135
155
|
setIsModalDetached(false);
|
|
136
156
|
return function() {};
|
|
@@ -156,7 +176,7 @@ function getMediaQueryList(mediaQuery) {
|
|
|
156
176
|
}, [
|
|
157
177
|
isDetached
|
|
158
178
|
]);
|
|
159
|
-
|
|
179
|
+
(0, _react.useEffect)(function() {
|
|
160
180
|
if (typeof document === 'undefined') return function() {};
|
|
161
181
|
if (isModalOpen) {
|
|
162
182
|
var scrollY = window.scrollY;
|
|
@@ -180,9 +200,10 @@ function getMediaQueryList(mediaQuery) {
|
|
|
180
200
|
};
|
|
181
201
|
}
|
|
182
202
|
function EXPERIMENTAL_Autocomplete(_0) {
|
|
183
|
-
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, [
|
|
184
204
|
"indices",
|
|
185
|
-
"
|
|
205
|
+
"showQuerySuggestions",
|
|
206
|
+
"showPromptSuggestions",
|
|
186
207
|
"showRecent",
|
|
187
208
|
"searchParameters",
|
|
188
209
|
"detachedMediaQuery",
|
|
@@ -190,8 +211,8 @@ function EXPERIMENTAL_Autocomplete(_0) {
|
|
|
190
211
|
]);
|
|
191
212
|
var _showRecent_classNames, _showRecent_classNames1, _showRecent_classNames2, _showRecent_classNames3;
|
|
192
213
|
var translations = _object_spread._({}, DEFAULT_TRANSLATIONS, userTranslations);
|
|
193
|
-
var _useInstantSearch =
|
|
194
|
-
var refine =
|
|
214
|
+
var _useInstantSearch = (0, _reactinstantsearchcore.useInstantSearch)(), indexUiState = _useInstantSearch.indexUiState, indexRenderState = _useInstantSearch.indexRenderState, status = _useInstantSearch.status;
|
|
215
|
+
var refine = (0, _reactinstantsearchcore.useSearchBox)({}, {
|
|
195
216
|
$$type: 'ais.autocomplete',
|
|
196
217
|
$$widgetType: 'ais.autocomplete'
|
|
197
218
|
}).refine;
|
|
@@ -200,56 +221,89 @@ function EXPERIMENTAL_Autocomplete(_0) {
|
|
|
200
221
|
hitsPerPage: 5
|
|
201
222
|
}, userSearchParameters);
|
|
202
223
|
var indicesConfig = _to_consumable_array._(indices);
|
|
203
|
-
if (
|
|
204
|
-
var
|
|
224
|
+
if (showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName) {
|
|
225
|
+
var _showQuerySuggestions_classNames, _showQuerySuggestions_classNames1, _showQuerySuggestions_classNames2, _showQuerySuggestions_classNames3;
|
|
205
226
|
indicesConfig.unshift({
|
|
206
|
-
indexName:
|
|
207
|
-
headerComponent:
|
|
208
|
-
itemComponent:
|
|
227
|
+
indexName: showQuerySuggestions.indexName,
|
|
228
|
+
headerComponent: showQuerySuggestions.headerComponent,
|
|
229
|
+
itemComponent: showQuerySuggestions.itemComponent || function(param) {
|
|
209
230
|
var item = param.item, onSelect = param.onSelect, onApply = param.onApply;
|
|
210
|
-
return /*#__PURE__*/
|
|
231
|
+
return /*#__PURE__*/ _react.default.createElement(AutocompleteSuggestion, {
|
|
211
232
|
item: item,
|
|
212
233
|
onSelect: onSelect,
|
|
213
234
|
onApply: onApply
|
|
214
|
-
}, /*#__PURE__*/
|
|
235
|
+
}, /*#__PURE__*/ _react.default.createElement(ConditionalReverseHighlight, {
|
|
215
236
|
item: item
|
|
216
237
|
}));
|
|
217
238
|
},
|
|
218
239
|
classNames: {
|
|
219
|
-
root:
|
|
220
|
-
list:
|
|
221
|
-
header:
|
|
222
|
-
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)
|
|
223
244
|
},
|
|
245
|
+
searchParameters: _object_spread._({
|
|
246
|
+
hitsPerPage: 3
|
|
247
|
+
}, showQuerySuggestions.searchParameters),
|
|
224
248
|
getQuery: function getQuery(item) {
|
|
225
249
|
return item.query;
|
|
226
250
|
},
|
|
227
|
-
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
|
|
228
282
|
});
|
|
229
283
|
}
|
|
230
284
|
var recentSearchConfig = showRecent ? {
|
|
231
285
|
headerComponent: (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' ? showRecent.headerComponent : undefined,
|
|
232
286
|
itemComponent: (typeof showRecent === "undefined" ? "undefined" : _type_of._(showRecent)) === 'object' && showRecent.itemComponent ? showRecent.itemComponent : AutocompleteRecentSearch,
|
|
233
287
|
classNames: {
|
|
234
|
-
root:
|
|
235
|
-
list:
|
|
236
|
-
header:
|
|
237
|
-
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)
|
|
238
292
|
}
|
|
239
293
|
} : undefined;
|
|
240
|
-
var isSearchPage =
|
|
294
|
+
var isSearchPage = (0, _react.useMemo)(function() {
|
|
241
295
|
return typeof indexRenderState.hits !== 'undefined' || typeof indexRenderState.infiniteHits !== 'undefined';
|
|
242
296
|
}, [
|
|
243
297
|
indexRenderState
|
|
244
298
|
]);
|
|
245
|
-
return /*#__PURE__*/
|
|
299
|
+
return /*#__PURE__*/ _react.default.createElement(_react.Fragment, null, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
|
|
246
300
|
EXPERIMENTAL_isolated: true
|
|
247
|
-
}, /*#__PURE__*/
|
|
248
|
-
return /*#__PURE__*/
|
|
301
|
+
}, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, searchParameters), indicesConfig.map(function(index) {
|
|
302
|
+
return /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Index, {
|
|
249
303
|
key: index.indexName,
|
|
250
304
|
indexName: index.indexName
|
|
251
|
-
}, /*#__PURE__*/
|
|
252
|
-
}), /*#__PURE__*/
|
|
305
|
+
}, /*#__PURE__*/ _react.default.createElement(_reactinstantsearchcore.Configure, index.searchParameters));
|
|
306
|
+
}), /*#__PURE__*/ _react.default.createElement(InnerAutocomplete, _object_spread_props._(_object_spread._({}, props), {
|
|
253
307
|
indicesConfig: indicesConfig,
|
|
254
308
|
refineSearchBox: refine,
|
|
255
309
|
isSearchStalled: isSearchStalled,
|
|
@@ -257,13 +311,15 @@ function EXPERIMENTAL_Autocomplete(_0) {
|
|
|
257
311
|
isSearchPage: isSearchPage,
|
|
258
312
|
showRecent: showRecent,
|
|
259
313
|
recentSearchConfig: recentSearchConfig,
|
|
260
|
-
|
|
314
|
+
showQuerySuggestions: showQuerySuggestions,
|
|
261
315
|
detachedMediaQuery: detachedMediaQuery,
|
|
262
|
-
translations: translations
|
|
316
|
+
translations: translations,
|
|
317
|
+
showPromptSuggestions: showPromptSuggestions,
|
|
318
|
+
chatRenderState: indexRenderState.chat
|
|
263
319
|
}))));
|
|
264
320
|
}
|
|
265
321
|
function InnerAutocomplete(_0) {
|
|
266
|
-
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, [
|
|
267
323
|
"indicesConfig",
|
|
268
324
|
"refineSearchBox",
|
|
269
325
|
"isSearchStalled",
|
|
@@ -274,27 +330,78 @@ function InnerAutocomplete(_0) {
|
|
|
274
330
|
"panelComponent",
|
|
275
331
|
"showRecent",
|
|
276
332
|
"recentSearchConfig",
|
|
277
|
-
"
|
|
333
|
+
"showQuerySuggestions",
|
|
334
|
+
"showPromptSuggestions",
|
|
335
|
+
"chatRenderState",
|
|
278
336
|
"transformItems",
|
|
279
337
|
"placeholder",
|
|
280
338
|
"detachedMediaQuery",
|
|
281
339
|
"translations",
|
|
282
340
|
"classNames"
|
|
283
341
|
]);
|
|
284
|
-
var
|
|
342
|
+
var _ref;
|
|
343
|
+
var _showPromptSuggestions_searchParameters;
|
|
344
|
+
var _useAutocomplete = (0, _reactinstantsearchcore.useAutocomplete)({
|
|
285
345
|
transformItems: transformItems
|
|
286
346
|
}), indices = _useAutocomplete.indices, refineAutocomplete = _useAutocomplete.refine, currentRefinement = _useAutocomplete.currentRefinement;
|
|
287
347
|
var _useDetachedMode = useDetachedMode(detachedMediaQuery), isDetached = _useDetachedMode.isDetached, isModalDetached = _useDetachedMode.isModalDetached, isModalOpen = _useDetachedMode.isModalOpen, setIsModalOpen = _useDetachedMode.setIsModalOpen;
|
|
288
|
-
var previousIsDetachedRef =
|
|
348
|
+
var previousIsDetachedRef = (0, _react.useRef)(isDetached);
|
|
289
349
|
var _useStorage = useStorage({
|
|
290
350
|
showRecent: showRecent,
|
|
291
351
|
query: currentRefinement,
|
|
292
352
|
indices: indices,
|
|
293
353
|
indicesConfig: indicesConfig,
|
|
294
|
-
suggestionsIndexName:
|
|
354
|
+
suggestionsIndexName: showQuerySuggestions === null || showQuerySuggestions === void 0 ? void 0 : showQuerySuggestions.indexName
|
|
295
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);
|
|
296
403
|
var _usePropGetters = usePropGetters({
|
|
297
|
-
indices:
|
|
404
|
+
indices: indicesForPropGettersWithPromptSuggestions,
|
|
298
405
|
indicesConfig: indicesConfigForPropGetters,
|
|
299
406
|
onRefine: function onRefine(query) {
|
|
300
407
|
refineAutocomplete(query);
|
|
@@ -305,7 +412,19 @@ function InnerAutocomplete(_0) {
|
|
|
305
412
|
refineAutocomplete(query);
|
|
306
413
|
},
|
|
307
414
|
onSelect: userOnSelect !== null && userOnSelect !== void 0 ? userOnSelect : function(param) {
|
|
308
|
-
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
|
+
}
|
|
309
428
|
if (url) {
|
|
310
429
|
window.location.href = url;
|
|
311
430
|
return;
|
|
@@ -328,7 +447,7 @@ function InnerAutocomplete(_0) {
|
|
|
328
447
|
isDetached: isDetached
|
|
329
448
|
}), getInputProps = _usePropGetters.getInputProps, getItemProps = _usePropGetters.getItemProps, getPanelProps = _usePropGetters.getPanelProps, getRootProps = _usePropGetters.getRootProps, isOpen = _usePropGetters.isOpen, setIsOpen = _usePropGetters.setIsOpen, focusInput = _usePropGetters.focusInput;
|
|
330
449
|
// Open panel and focus input when modal opens
|
|
331
|
-
|
|
450
|
+
(0, _react.useEffect)(function() {
|
|
332
451
|
if (isDetached && isModalOpen) {
|
|
333
452
|
setIsOpen(true);
|
|
334
453
|
// Focus input to show the keyboard on mobile
|
|
@@ -341,7 +460,7 @@ function InnerAutocomplete(_0) {
|
|
|
341
460
|
focusInput
|
|
342
461
|
]);
|
|
343
462
|
// Keep the modal open if the panel was open before switching to detached
|
|
344
|
-
|
|
463
|
+
(0, _react.useEffect)(function() {
|
|
345
464
|
var wasDetached = previousIsDetachedRef.current;
|
|
346
465
|
var switchedToDetached = !wasDetached && isDetached;
|
|
347
466
|
if (switchedToDetached && isOpen) {
|
|
@@ -356,19 +475,19 @@ function InnerAutocomplete(_0) {
|
|
|
356
475
|
var elements = {};
|
|
357
476
|
if (showRecent && recentSearchConfig) {
|
|
358
477
|
var RecentSearchItemComponent = recentSearchConfig.itemComponent;
|
|
359
|
-
elements.recent = /*#__PURE__*/
|
|
478
|
+
elements.recent = /*#__PURE__*/ _react.default.createElement(AutocompleteIndex, {
|
|
360
479
|
HeaderComponent: recentSearchConfig.headerComponent,
|
|
361
480
|
// @ts-ignore - there seems to be problems with React.ComponentType and this, but it's actually correct
|
|
362
481
|
ItemComponent: function ItemComponent(param) {
|
|
363
482
|
var item = param.item, onSelect = param.onSelect, onApply = param.onApply;
|
|
364
|
-
return /*#__PURE__*/
|
|
483
|
+
return /*#__PURE__*/ _react.default.createElement(RecentSearchItemComponent, {
|
|
365
484
|
item: item,
|
|
366
485
|
onSelect: onSelect,
|
|
367
486
|
onRemoveRecentSearch: function onRemoveRecentSearch() {
|
|
368
487
|
return storage.onRemove(item.query);
|
|
369
488
|
},
|
|
370
489
|
onApply: onApply
|
|
371
|
-
}, /*#__PURE__*/
|
|
490
|
+
}, /*#__PURE__*/ _react.default.createElement(ConditionalReverseHighlight, {
|
|
372
491
|
item: item
|
|
373
492
|
}));
|
|
374
493
|
},
|
|
@@ -378,27 +497,27 @@ function InnerAutocomplete(_0) {
|
|
|
378
497
|
key: "recentSearches"
|
|
379
498
|
});
|
|
380
499
|
}
|
|
381
|
-
|
|
500
|
+
indicesForPanel.forEach(function(param) {
|
|
382
501
|
var indexId = param.indexId, indexName = param.indexName, hits = param.hits;
|
|
383
|
-
var elementId = indexName
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
}
|
|
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
|
+
}
|
|
389
508
|
var currentIndexConfig = indicesConfig.find(function(config) {
|
|
390
509
|
return config.indexName === indexName;
|
|
391
510
|
});
|
|
392
511
|
if (!currentIndexConfig) {
|
|
393
512
|
return;
|
|
394
513
|
}
|
|
395
|
-
elements[elementId] = /*#__PURE__*/
|
|
514
|
+
elements[elementId] = /*#__PURE__*/ _react.default.createElement(AutocompleteIndex, {
|
|
396
515
|
key: indexId,
|
|
397
516
|
// @ts-expect-error - there seems to be problems with React.ComponentType and this, but it's actually correct
|
|
398
517
|
HeaderComponent: currentIndexConfig.headerComponent,
|
|
399
518
|
// @ts-expect-error - there seems to be problems with React.ComponentType and this, but it's actually correct
|
|
400
519
|
ItemComponent: currentIndexConfig.itemComponent,
|
|
401
|
-
items:
|
|
520
|
+
items: hits.map(function(item) {
|
|
402
521
|
return _object_spread_props._(_object_spread._({}, item), {
|
|
403
522
|
__indexName: indexId
|
|
404
523
|
});
|
|
@@ -407,7 +526,7 @@ function InnerAutocomplete(_0) {
|
|
|
407
526
|
classNames: currentIndexConfig.classNames
|
|
408
527
|
});
|
|
409
528
|
});
|
|
410
|
-
var searchBoxContent = /*#__PURE__*/
|
|
529
|
+
var searchBoxContent = /*#__PURE__*/ _react.default.createElement(_AutocompleteSearch.AutocompleteSearch, {
|
|
411
530
|
inputProps: getInputProps(),
|
|
412
531
|
clearQuery: function clearQuery() {
|
|
413
532
|
refineSearchBox('');
|
|
@@ -420,19 +539,19 @@ function InnerAutocomplete(_0) {
|
|
|
420
539
|
refine: refineSearchBox,
|
|
421
540
|
isSearchStalled: isSearchStalled
|
|
422
541
|
});
|
|
423
|
-
var panelContent = /*#__PURE__*/
|
|
542
|
+
var panelContent = /*#__PURE__*/ _react.default.createElement(AutocompletePanel, getPanelProps(), PanelComponent ? /*#__PURE__*/ _react.default.createElement(PanelComponent, {
|
|
424
543
|
elements: elements,
|
|
425
|
-
indices:
|
|
544
|
+
indices: indicesForPanel
|
|
426
545
|
}) : Object.keys(elements).map(function(elementId) {
|
|
427
546
|
return elements[elementId];
|
|
428
547
|
}));
|
|
429
548
|
var detachedContainerClassNames = isModalDetached ? _object_spread_props._(_object_spread._({}, classNames), {
|
|
430
|
-
detachedContainer:
|
|
549
|
+
detachedContainer: (0, _instantsearchuicomponents.cx)('ais-AutocompleteDetachedContainer--modal', classNames === null || classNames === void 0 ? void 0 : classNames.detachedContainer)
|
|
431
550
|
}) : classNames;
|
|
432
551
|
if (isDetached) {
|
|
433
|
-
return /*#__PURE__*/
|
|
552
|
+
return /*#__PURE__*/ _react.default.createElement(Autocomplete, _object_spread_props._(_object_spread._({}, props, getRootProps()), {
|
|
434
553
|
classNames: classNames
|
|
435
|
-
}), /*#__PURE__*/
|
|
554
|
+
}), /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedSearchButton, {
|
|
436
555
|
query: currentRefinement || indexUiState.query || '',
|
|
437
556
|
placeholder: placeholder,
|
|
438
557
|
classNames: classNames,
|
|
@@ -445,15 +564,15 @@ function InnerAutocomplete(_0) {
|
|
|
445
564
|
refineAutocomplete('');
|
|
446
565
|
},
|
|
447
566
|
translations: translations
|
|
448
|
-
}), isModalOpen && /*#__PURE__*/
|
|
567
|
+
}), isModalOpen && /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedOverlay, {
|
|
449
568
|
classNames: classNames,
|
|
450
569
|
onClose: function onClose() {
|
|
451
570
|
setIsModalOpen(false);
|
|
452
571
|
setIsOpen(false);
|
|
453
572
|
}
|
|
454
|
-
}, /*#__PURE__*/
|
|
573
|
+
}, /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedContainer, {
|
|
455
574
|
classNames: detachedContainerClassNames
|
|
456
|
-
}, /*#__PURE__*/
|
|
575
|
+
}, /*#__PURE__*/ _react.default.createElement(AutocompleteDetachedFormContainer, {
|
|
457
576
|
classNames: classNames,
|
|
458
577
|
onCancel: function onCancel() {
|
|
459
578
|
setIsModalOpen(false);
|
|
@@ -463,7 +582,7 @@ function InnerAutocomplete(_0) {
|
|
|
463
582
|
}, searchBoxContent), panelContent)));
|
|
464
583
|
}
|
|
465
584
|
// Normal (non-detached) rendering
|
|
466
|
-
return /*#__PURE__*/
|
|
585
|
+
return /*#__PURE__*/ _react.default.createElement(Autocomplete, _object_spread_props._(_object_spread._({}, props, getRootProps()), {
|
|
467
586
|
classNames: classNames
|
|
468
587
|
}), searchBoxContent, panelContent);
|
|
469
588
|
}
|
|
@@ -474,10 +593,20 @@ function ConditionalReverseHighlight(param) {
|
|
|
474
593
|
item._highlightResult.query.matchLevel === 'none') {
|
|
475
594
|
return item.query;
|
|
476
595
|
}
|
|
477
|
-
return /*#__PURE__*/
|
|
596
|
+
return /*#__PURE__*/ _react.default.createElement(_ReverseHighlight.ReverseHighlight, {
|
|
478
597
|
attribute: "query",
|
|
479
598
|
hit: item
|
|
480
599
|
});
|
|
481
600
|
}
|
|
482
|
-
|
|
483
|
-
|
|
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
|
+
}
|