@appbaseio/reactivesearch-vue 1.27.0-gamma.3 → 1.29.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/@appbaseio/reactivesearch-vue.umd.js +839 -1033
- package/dist/@appbaseio/reactivesearch-vue.umd.js.map +1 -1
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js +5 -5
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js.map +1 -1
- package/dist/cjs/{Button-11307285.js → Button-e0b7c1f6.js} +1 -1
- package/dist/cjs/{DataSearch-0ef14926.js → DataSearch-eec21890.js} +30 -13
- package/dist/cjs/DataSearch.js +1 -1
- package/dist/cjs/DynamicRangeSlider.js +24 -16
- package/dist/cjs/MultiDropdownList.js +34 -25
- package/dist/cjs/MultiList.js +33 -23
- package/dist/cjs/MultiRange.js +2 -3
- package/dist/cjs/RangeSlider.js +2 -3
- package/dist/cjs/ReactiveComponent.js +41 -72
- package/dist/cjs/ReactiveList.js +38 -48
- package/dist/cjs/SelectedFilters.js +6 -4
- package/dist/cjs/SingleDropdownList.js +21 -18
- package/dist/cjs/SingleList.js +19 -16
- package/dist/cjs/SingleRange.js +2 -3
- package/dist/cjs/ToggleButton.js +1 -1
- package/dist/cjs/index.js +3 -3
- package/dist/cjs/initReactivesearch.js +109 -77
- package/dist/cjs/{install-311df9cc.js → install-4886582d.js} +102 -58
- package/dist/cjs/install.js +3 -3
- package/dist/cjs/version.js +1 -1
- package/dist/es/{Button-91561391.js → Button-33de88e6.js} +1 -1
- package/dist/es/{DataSearch-be45e960.js → DataSearch-42f547cd.js} +30 -13
- package/dist/es/DataSearch.js +1 -1
- package/dist/es/DynamicRangeSlider.js +24 -16
- package/dist/es/MultiDropdownList.js +34 -25
- package/dist/es/MultiList.js +33 -23
- package/dist/es/MultiRange.js +2 -3
- package/dist/es/RangeSlider.js +2 -3
- package/dist/es/ReactiveComponent.js +41 -72
- package/dist/es/ReactiveList.js +38 -48
- package/dist/es/SelectedFilters.js +6 -4
- package/dist/es/SingleDropdownList.js +21 -18
- package/dist/es/SingleList.js +19 -16
- package/dist/es/SingleRange.js +2 -3
- package/dist/es/ToggleButton.js +1 -1
- package/dist/es/index.js +4 -4
- package/dist/es/initReactivesearch.js +111 -79
- package/dist/es/{install-af797de0.js → install-54ebd72e.js} +102 -58
- package/dist/es/install.js +3 -3
- package/dist/es/version.js +1 -1
- package/package.json +3 -3
package/dist/cjs/ToggleButton.js
CHANGED
|
@@ -12,7 +12,7 @@ var constants = require('@appbaseio/reactivecore/lib/utils/constants');
|
|
|
12
12
|
require('emotion');
|
|
13
13
|
require('@appbaseio/vue-emotion');
|
|
14
14
|
require('polished');
|
|
15
|
-
var Button = require('./Button-
|
|
15
|
+
var Button = require('./Button-e0b7c1f6.js');
|
|
16
16
|
var vueTypes = require('./vueTypes-57d01f18.js');
|
|
17
17
|
require('@appbaseio/reactivecore/lib/utils/transform');
|
|
18
18
|
require('redux');
|
package/dist/cjs/index.js
CHANGED
|
@@ -10,7 +10,7 @@ require('@appbaseio/reactivecore/lib/utils/helper');
|
|
|
10
10
|
require('emotion');
|
|
11
11
|
require('@appbaseio/vue-emotion');
|
|
12
12
|
require('polished');
|
|
13
|
-
require('./Button-
|
|
13
|
+
require('./Button-e0b7c1f6.js');
|
|
14
14
|
require('./vueTypes-57d01f18.js');
|
|
15
15
|
var ReactiveList = require('./ReactiveList.js');
|
|
16
16
|
require('@appbaseio/reactivecore/lib/utils/transform');
|
|
@@ -27,13 +27,13 @@ require('appbase-js');
|
|
|
27
27
|
require('url-search-params-polyfill');
|
|
28
28
|
var ReactiveBase = require('./ReactiveBase.js');
|
|
29
29
|
require('hotkeys-js');
|
|
30
|
-
var DataSearch = require('./DataSearch-
|
|
30
|
+
var DataSearch = require('./DataSearch-eec21890.js');
|
|
31
31
|
require('./CancelSvg-4aa35935.js');
|
|
32
32
|
require('./Input-0d7b25ad.js');
|
|
33
33
|
require('compute-scroll-into-view');
|
|
34
34
|
require('./Container-526efa6a.js');
|
|
35
35
|
require('vue-highlight-words');
|
|
36
|
-
var install = require('./install-
|
|
36
|
+
var install = require('./install-4886582d.js');
|
|
37
37
|
require('@appbaseio/reactivecore/lib/utils/suggestions');
|
|
38
38
|
require('./FormControlList-808dbcef.js');
|
|
39
39
|
require('./utils-1219e1fe.js');
|
|
@@ -18,10 +18,10 @@ var dependencyTreeReducer = _interopDefault(require('@appbaseio/reactivecore/lib
|
|
|
18
18
|
var fetchGraphQL = _interopDefault(require('@appbaseio/reactivecore/lib/utils/graphQL'));
|
|
19
19
|
var utils = require('@appbaseio/reactivecore/lib/actions/utils');
|
|
20
20
|
|
|
21
|
-
var _excluded = ["aggs", "size"]
|
|
21
|
+
var _excluded = ["aggs", "size"],
|
|
22
|
+
_excluded2 = ["query"],
|
|
23
|
+
_excluded3 = ["query"];
|
|
22
24
|
var X_SEARCH_CLIENT = 'ReactiveSearch Vue';
|
|
23
|
-
var componentsWithHighlightQuery = [constants.componentTypes.dataSearch, constants.componentTypes.categorySearch];
|
|
24
|
-
var componentsWithOptions = [constants.componentTypes.reactiveList, constants.componentTypes.reactiveMap, constants.componentTypes.singleList, constants.componentTypes.multiList, constants.componentTypes.tagCloud].concat(componentsWithHighlightQuery);
|
|
25
25
|
var componentsWithoutFilters = [constants.componentTypes.numberBox, constants.componentTypes.ratingsFilter];
|
|
26
26
|
var resultComponents = [constants.componentTypes.reactiveList, constants.componentTypes.reactiveMap];
|
|
27
27
|
|
|
@@ -55,23 +55,40 @@ function parseValue(value, component) {
|
|
|
55
55
|
}
|
|
56
56
|
|
|
57
57
|
return value;
|
|
58
|
-
}
|
|
58
|
+
} // Returns query DSL with query property and other options
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
function getDefaultQuery(component, value) {
|
|
62
|
+
// get custom or default query of sensor components
|
|
63
|
+
var currentValue = parseValue(value, component); // get default query of result components
|
|
64
|
+
|
|
65
|
+
if (component.defaultQuery) {
|
|
66
|
+
var defaultQuery = component.defaultQuery(currentValue, component);
|
|
67
|
+
return _rollupPluginBabelHelpers._extends({
|
|
68
|
+
query: helper.extractQueryFromCustomQuery(defaultQuery)
|
|
69
|
+
}, helper.getOptionsForCustomQuery(defaultQuery));
|
|
70
|
+
}
|
|
59
71
|
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
} // get custom or default query of sensor components
|
|
72
|
+
return component.source.defaultQuery ? {
|
|
73
|
+
query: component.source.defaultQuery(currentValue, component)
|
|
74
|
+
} : {};
|
|
75
|
+
} // Only results the query part
|
|
65
76
|
|
|
66
77
|
|
|
78
|
+
function getCustomQuery(component, value) {
|
|
79
|
+
// get custom or default query of sensor components
|
|
67
80
|
var currentValue = parseValue(value, component);
|
|
68
81
|
|
|
69
82
|
if (component.customQuery) {
|
|
70
83
|
var customQuery = component.customQuery(currentValue, component);
|
|
71
|
-
return
|
|
84
|
+
return _rollupPluginBabelHelpers._extends({
|
|
85
|
+
query: helper.extractQueryFromCustomQuery(customQuery)
|
|
86
|
+
}, helper.getOptionsForCustomQuery(customQuery));
|
|
72
87
|
}
|
|
73
88
|
|
|
74
|
-
return component.source.defaultQuery ?
|
|
89
|
+
return component.source.defaultQuery ? {
|
|
90
|
+
query: component.source.defaultQuery(currentValue, component)
|
|
91
|
+
} : null;
|
|
75
92
|
}
|
|
76
93
|
|
|
77
94
|
function initReactivesearch(componentCollection, searchState, settings) {
|
|
@@ -126,6 +143,11 @@ function initReactivesearch(componentCollection, searchState, settings) {
|
|
|
126
143
|
}
|
|
127
144
|
});
|
|
128
145
|
var isInternalComponentPresent = false;
|
|
146
|
+
|
|
147
|
+
if (component.source.hasInternalComponent) {
|
|
148
|
+
isInternalComponentPresent = component.source.hasInternalComponent(component);
|
|
149
|
+
}
|
|
150
|
+
|
|
129
151
|
var isResultComponent = resultComponents.includes(componentType);
|
|
130
152
|
var internalComponent = component.componentId + "__internal";
|
|
131
153
|
var label = component.filterLabel || component.componentId;
|
|
@@ -157,74 +179,66 @@ function initReactivesearch(componentCollection, searchState, settings) {
|
|
|
157
179
|
|
|
158
180
|
if (component.defaultQuery && typeof component.defaultQuery === 'function') {
|
|
159
181
|
defaultQueries[component.componentId] = component.defaultQuery(value, compProps);
|
|
160
|
-
}
|
|
161
|
-
|
|
182
|
+
}
|
|
162
183
|
|
|
163
|
-
|
|
164
|
-
var options = component.source.generateQueryOptions ? component.source.generateQueryOptions(component) : null;
|
|
165
|
-
var highlightQuery = {};
|
|
184
|
+
var componentQueryOptions = {}; // [2] set query options - main component query (valid for result components)
|
|
166
185
|
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
186
|
+
if (component && component.source.generateQueryOptions) {
|
|
187
|
+
componentQueryOptions = _rollupPluginBabelHelpers._extends({}, componentQueryOptions, component.source.generateQueryOptions(component));
|
|
188
|
+
}
|
|
170
189
|
|
|
171
|
-
|
|
172
|
-
// eslint-disable-next-line
|
|
173
|
-
var _ref = options || {},
|
|
174
|
-
aggs = _ref.aggs,
|
|
175
|
-
size = _ref.size,
|
|
176
|
-
otherQueryOptions = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_ref, _excluded);
|
|
177
|
-
|
|
178
|
-
if (aggs && Object.keys(aggs).length) {
|
|
179
|
-
isInternalComponentPresent = true; // query should be applied on the internal component
|
|
180
|
-
// to enable feeding the data to parent component
|
|
181
|
-
|
|
182
|
-
queryOptions = queryOptionsReducer(queryOptions, {
|
|
183
|
-
type: 'SET_QUERY_OPTIONS',
|
|
184
|
-
component: internalComponent,
|
|
185
|
-
options: {
|
|
186
|
-
aggs: aggs,
|
|
187
|
-
size: typeof size === 'undefined' ? 100 : size
|
|
188
|
-
}
|
|
189
|
-
});
|
|
190
|
-
} // sort, highlight, size, from - query should be applied on the main component
|
|
190
|
+
var highlightQuery = {};
|
|
191
191
|
|
|
192
|
+
if (component.source.highlightQuery) {
|
|
193
|
+
highlightQuery = component.source.highlightQuery(component);
|
|
194
|
+
}
|
|
192
195
|
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
+
if (componentQueryOptions && Object.keys(componentQueryOptions).length || highlightQuery && Object.keys(highlightQuery).length) {
|
|
197
|
+
// eslint-disable-next-line
|
|
198
|
+
var _ref = componentQueryOptions || {},
|
|
199
|
+
aggs = _ref.aggs,
|
|
200
|
+
size = _ref.size,
|
|
201
|
+
otherQueryOptions = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_ref, _excluded);
|
|
202
|
+
|
|
203
|
+
if (aggs && Object.keys(aggs).length) {
|
|
204
|
+
isInternalComponentPresent = true;
|
|
205
|
+
componentQueryOptions = _rollupPluginBabelHelpers._extends({}, componentQueryOptions, {
|
|
206
|
+
aggs: aggs,
|
|
207
|
+
size: typeof size === 'undefined' ? 100 : size
|
|
208
|
+
});
|
|
209
|
+
} // sort, highlight, size, from - query should be applied on the main component
|
|
196
210
|
|
|
197
|
-
var mainQueryOptions = _rollupPluginBabelHelpers._extends({}, otherQueryOptions, highlightQuery, {
|
|
198
|
-
size: size
|
|
199
|
-
});
|
|
200
211
|
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
212
|
+
if (otherQueryOptions && Object.keys(otherQueryOptions).length || highlightQuery && Object.keys(highlightQuery).length) {
|
|
213
|
+
if (!otherQueryOptions) otherQueryOptions = {};
|
|
214
|
+
if (!highlightQuery) highlightQuery = {};
|
|
204
215
|
|
|
205
|
-
|
|
206
|
-
|
|
216
|
+
var mainQueryOptions = _rollupPluginBabelHelpers._extends({}, otherQueryOptions, highlightQuery, {
|
|
217
|
+
size: size
|
|
218
|
+
});
|
|
207
219
|
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
220
|
+
if (isInternalComponentPresent) {
|
|
221
|
+
mainQueryOptions = _rollupPluginBabelHelpers._extends({}, otherQueryOptions, highlightQuery);
|
|
222
|
+
}
|
|
211
223
|
|
|
212
|
-
|
|
213
|
-
|
|
224
|
+
if (isResultComponent) {
|
|
225
|
+
var currentPage = component.currentPage ? component.currentPage - 1 : 0;
|
|
214
226
|
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
size: resultSize,
|
|
218
|
-
from: from
|
|
219
|
-
});
|
|
227
|
+
if (selectedValues[component.componentId] && selectedValues[component.componentId].value) {
|
|
228
|
+
currentPage = selectedValues[component.componentId].value - 1 || 0;
|
|
220
229
|
}
|
|
221
230
|
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
231
|
+
var resultSize = component.size || 10;
|
|
232
|
+
var from = currentPage * resultSize; // Update props for RS API
|
|
233
|
+
|
|
234
|
+
compProps.from = from;
|
|
235
|
+
mainQueryOptions = _rollupPluginBabelHelpers._extends({}, mainQueryOptions, highlightQuery, {
|
|
236
|
+
size: resultSize,
|
|
237
|
+
from: from
|
|
226
238
|
});
|
|
227
239
|
}
|
|
240
|
+
|
|
241
|
+
componentQueryOptions = _rollupPluginBabelHelpers._extends({}, componentQueryOptions, mainQueryOptions);
|
|
228
242
|
}
|
|
229
243
|
} // [3] set dependency tree
|
|
230
244
|
|
|
@@ -242,25 +256,42 @@ function initReactivesearch(componentCollection, searchState, settings) {
|
|
|
242
256
|
react: react
|
|
243
257
|
});
|
|
244
258
|
} // [4] set query list
|
|
259
|
+
// Do not set default query for suggestions
|
|
245
260
|
|
|
246
261
|
|
|
247
|
-
if (
|
|
248
|
-
var
|
|
249
|
-
|
|
262
|
+
if (isInternalComponentPresent && !transform.isSearchComponent(component.componentType)) {
|
|
263
|
+
var _ref2 = getDefaultQuery(component, value) || {},
|
|
264
|
+
defaultQuery = _ref2.query,
|
|
265
|
+
defaultQueryOptions = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_ref2, _excluded2);
|
|
250
266
|
|
|
251
267
|
queryList = queryReducer(queryList, {
|
|
252
268
|
type: 'SET_QUERY',
|
|
253
269
|
component: internalComponent,
|
|
254
|
-
query:
|
|
270
|
+
query: defaultQuery
|
|
255
271
|
});
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
query: getQuery(component, value, componentType)
|
|
272
|
+
queryOptions = queryOptionsReducer(queryOptions, {
|
|
273
|
+
type: 'SET_QUERY_OPTIONS',
|
|
274
|
+
component: internalComponent,
|
|
275
|
+
options: _rollupPluginBabelHelpers._extends({}, componentQueryOptions, defaultQueryOptions)
|
|
261
276
|
});
|
|
262
|
-
}
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
var _ref3 = getCustomQuery(component, value) || {},
|
|
280
|
+
query = _ref3.query,
|
|
281
|
+
options = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_ref3, _excluded3);
|
|
263
282
|
|
|
283
|
+
var customQuery = query; // set custom query for main component
|
|
284
|
+
|
|
285
|
+
queryList = queryReducer(queryList, {
|
|
286
|
+
type: 'SET_QUERY',
|
|
287
|
+
component: component.componentId,
|
|
288
|
+
query: customQuery
|
|
289
|
+
});
|
|
290
|
+
queryOptions = queryOptionsReducer(queryOptions, {
|
|
291
|
+
type: 'SET_QUERY_OPTIONS',
|
|
292
|
+
component: component.componentId,
|
|
293
|
+
options: _rollupPluginBabelHelpers._extends({}, options)
|
|
294
|
+
}); // Set component type in component props
|
|
264
295
|
|
|
265
296
|
compProps.componentType = componentType;
|
|
266
297
|
componentProps[component.componentId] = compProps;
|
|
@@ -283,9 +314,10 @@ function initReactivesearch(componentCollection, searchState, settings) {
|
|
|
283
314
|
queryObj = _buildQuery.queryObj,
|
|
284
315
|
options = _buildQuery.options;
|
|
285
316
|
|
|
286
|
-
var
|
|
317
|
+
var componentQueryOptions = options;
|
|
318
|
+
var validOptions = ['aggs', 'from', 'sort']; // check if query or componentQueryOptions are valid - non-empty
|
|
287
319
|
|
|
288
|
-
if (queryObj && !!Object.keys(queryObj).length ||
|
|
320
|
+
if (queryObj && !!Object.keys(queryObj).length || componentQueryOptions && Object.keys(componentQueryOptions).some(function (item) {
|
|
289
321
|
return validOptions.includes(item);
|
|
290
322
|
})) {
|
|
291
323
|
var _extends2;
|
|
@@ -300,7 +332,7 @@ function initReactivesearch(componentCollection, searchState, settings) {
|
|
|
300
332
|
|
|
301
333
|
var currentQuery = _rollupPluginBabelHelpers._extends({
|
|
302
334
|
query: _rollupPluginBabelHelpers._extends({}, queryObj)
|
|
303
|
-
},
|
|
335
|
+
}, componentQueryOptions, queryOptions[component.componentId]);
|
|
304
336
|
|
|
305
337
|
queryLog = _rollupPluginBabelHelpers._extends({}, queryLog, (_extends2 = {}, _extends2[component.componentId] = currentQuery, _extends2));
|
|
306
338
|
|
|
@@ -10,6 +10,7 @@ var constants = require('@appbaseio/reactivecore/lib/utils/constants');
|
|
|
10
10
|
var helper = require('@appbaseio/reactivecore/lib/utils/helper');
|
|
11
11
|
var styled = require('@appbaseio/vue-emotion');
|
|
12
12
|
var styled__default = _interopDefault(styled);
|
|
13
|
+
var Button = require('./Button-e0b7c1f6.js');
|
|
13
14
|
var vueTypes = require('./vueTypes-57d01f18.js');
|
|
14
15
|
var ReactiveList = require('./ReactiveList.js');
|
|
15
16
|
var index = require('./index-4509aa45.js');
|
|
@@ -17,7 +18,7 @@ var ComponentWrapper = require('./ComponentWrapper-10bad289.js');
|
|
|
17
18
|
var Title = require('./Title-584a8cc8.js');
|
|
18
19
|
var ReactiveBase = require('./ReactiveBase.js');
|
|
19
20
|
var hotkeys = _interopDefault(require('hotkeys-js'));
|
|
20
|
-
var DataSearch = require('./DataSearch-
|
|
21
|
+
var DataSearch = require('./DataSearch-eec21890.js');
|
|
21
22
|
var CancelSvg = require('./CancelSvg-4aa35935.js');
|
|
22
23
|
var Input = require('./Input-0d7b25ad.js');
|
|
23
24
|
var Container = require('./Container-526efa6a.js');
|
|
@@ -201,7 +202,9 @@ var SearchBox = {
|
|
|
201
202
|
applyStopwords: VueTypes.bool,
|
|
202
203
|
customStopwords: vueTypes.types.stringArray,
|
|
203
204
|
onData: vueTypes.types.func,
|
|
204
|
-
renderItem: vueTypes.types.func
|
|
205
|
+
renderItem: vueTypes.types.func,
|
|
206
|
+
enterButton: VueTypes.bool.def(false),
|
|
207
|
+
renderEnterButton: VueTypes.any
|
|
205
208
|
},
|
|
206
209
|
mounted: function mounted() {
|
|
207
210
|
this.listenForFocusShortcuts();
|
|
@@ -314,7 +317,7 @@ var SearchBox = {
|
|
|
314
317
|
this.triggerDefaultQuery(value);
|
|
315
318
|
} else if (this.$props.autosuggest) {
|
|
316
319
|
this.triggerDefaultQuery(value);
|
|
317
|
-
} else {
|
|
320
|
+
} else if (!this.$props.enterButton) {
|
|
318
321
|
this.triggerCustomQuery(value);
|
|
319
322
|
}
|
|
320
323
|
},
|
|
@@ -730,15 +733,56 @@ var SearchBox = {
|
|
|
730
733
|
|
|
731
734
|
return null;
|
|
732
735
|
},
|
|
733
|
-
|
|
736
|
+
renderEnterButtonElement: function renderEnterButtonElement() {
|
|
737
|
+
var _this4 = this;
|
|
738
|
+
|
|
734
739
|
var h = this.$createElement;
|
|
735
740
|
var _this$$props4 = this.$props,
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
741
|
+
enterButton = _this$$props4.enterButton,
|
|
742
|
+
innerClass = _this$$props4.innerClass;
|
|
743
|
+
var renderEnterButton = this.$scopedSlots.renderEnterButton;
|
|
744
|
+
|
|
745
|
+
var enterButtonOnClick = function enterButtonOnClick() {
|
|
746
|
+
return _this4.triggerQuery({
|
|
747
|
+
isOpen: false,
|
|
748
|
+
value: _this4.currentValue,
|
|
749
|
+
customQuery: true
|
|
750
|
+
});
|
|
751
|
+
};
|
|
752
|
+
|
|
753
|
+
if (enterButton) {
|
|
754
|
+
var getEnterButtonMarkup = function getEnterButtonMarkup() {
|
|
755
|
+
if (renderEnterButton) {
|
|
756
|
+
return renderEnterButton(enterButtonOnClick);
|
|
757
|
+
}
|
|
758
|
+
|
|
759
|
+
return h(Button.Button, {
|
|
760
|
+
"class": "enter-btn " + getClassName(innerClass, 'enterButton'),
|
|
761
|
+
"attrs": {
|
|
762
|
+
"primary": true
|
|
763
|
+
},
|
|
764
|
+
"on": {
|
|
765
|
+
"click": enterButtonOnClick
|
|
766
|
+
}
|
|
767
|
+
}, ["Search"]);
|
|
768
|
+
};
|
|
769
|
+
|
|
770
|
+
return h("div", {
|
|
771
|
+
"class": "enter-button-wrapper"
|
|
772
|
+
}, [getEnterButtonMarkup()]);
|
|
773
|
+
}
|
|
774
|
+
|
|
775
|
+
return null;
|
|
776
|
+
},
|
|
777
|
+
renderIcons: function renderIcons() {
|
|
778
|
+
var h = this.$createElement;
|
|
779
|
+
var _this$$props5 = this.$props,
|
|
780
|
+
iconPosition = _this$$props5.iconPosition,
|
|
781
|
+
showClear = _this$$props5.showClear,
|
|
782
|
+
innerClass = _this$$props5.innerClass,
|
|
783
|
+
getMicInstance = _this$$props5.getMicInstance,
|
|
784
|
+
showVoiceSearch = _this$$props5.showVoiceSearch,
|
|
785
|
+
showIcon = _this$$props5.showIcon;
|
|
742
786
|
var renderMic = this.$scopedSlots.renderMic || this.$props.renderMic;
|
|
743
787
|
var currentValue = this.$data.currentValue;
|
|
744
788
|
return h("div", [h(CancelSvg.IconGroup, {
|
|
@@ -790,7 +834,7 @@ var SearchBox = {
|
|
|
790
834
|
(_this$$refs = this.$refs) == null ? void 0 : (_this$$refs$this$$pro = _this$$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs$this$$pro.focus(); // eslint-disable-line
|
|
791
835
|
},
|
|
792
836
|
listenForFocusShortcuts: function listenForFocusShortcuts() {
|
|
793
|
-
var
|
|
837
|
+
var _this5 = this;
|
|
794
838
|
|
|
795
839
|
var _this$$props$focusSho = this.$props.focusShortcuts,
|
|
796
840
|
focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
|
|
@@ -808,7 +852,7 @@ var SearchBox = {
|
|
|
808
852
|
// Prevent the default refresh event under WINDOWS system
|
|
809
853
|
event.preventDefault();
|
|
810
854
|
|
|
811
|
-
|
|
855
|
+
_this5.focusSearchBox(event);
|
|
812
856
|
}); // if one of modifier keys are used, they are handled below
|
|
813
857
|
|
|
814
858
|
hotkeys('*', function (event) {
|
|
@@ -819,7 +863,7 @@ var SearchBox = {
|
|
|
819
863
|
var element = modifierKeys[index$1];
|
|
820
864
|
|
|
821
865
|
if (hotkeys[element]) {
|
|
822
|
-
|
|
866
|
+
_this5.focusSearchBox(event);
|
|
823
867
|
|
|
824
868
|
break;
|
|
825
869
|
}
|
|
@@ -833,14 +877,14 @@ var SearchBox = {
|
|
|
833
877
|
this.triggerDefaultQuery(value);
|
|
834
878
|
},
|
|
835
879
|
renderAutoFill: function renderAutoFill(suggestion) {
|
|
836
|
-
var
|
|
880
|
+
var _this6 = this;
|
|
837
881
|
|
|
838
882
|
var h = this.$createElement;
|
|
839
883
|
|
|
840
884
|
var handleAutoFillClick = function handleAutoFillClick(e) {
|
|
841
885
|
e.stopPropagation();
|
|
842
886
|
|
|
843
|
-
|
|
887
|
+
_this6.onAutofillClick(suggestion);
|
|
844
888
|
};
|
|
845
889
|
/* 👇 avoid showing autofill for category suggestions👇 */
|
|
846
890
|
|
|
@@ -853,12 +897,12 @@ var SearchBox = {
|
|
|
853
897
|
}
|
|
854
898
|
},
|
|
855
899
|
render: function render() {
|
|
856
|
-
var
|
|
900
|
+
var _this7 = this;
|
|
857
901
|
|
|
858
902
|
var h = arguments[0];
|
|
859
|
-
var _this$$
|
|
860
|
-
theme = _this$$
|
|
861
|
-
expandSuggestionsContainer = _this$$
|
|
903
|
+
var _this$$props6 = this.$props,
|
|
904
|
+
theme = _this$$props6.theme,
|
|
905
|
+
expandSuggestionsContainer = _this$$props6.expandSuggestionsContainer;
|
|
862
906
|
var _this$$scopedSlots = this.$scopedSlots,
|
|
863
907
|
recentSearchesIcon = _this$$scopedSlots.recentSearchesIcon,
|
|
864
908
|
popularSearchesIcon = _this$$scopedSlots.popularSearchesIcon;
|
|
@@ -899,14 +943,14 @@ var SearchBox = {
|
|
|
899
943
|
}
|
|
900
944
|
};
|
|
901
945
|
|
|
902
|
-
return h("div", [
|
|
946
|
+
return h("div", [_this7.hasCustomRenderer && _this7.getComponent({
|
|
903
947
|
isOpen: isOpen,
|
|
904
948
|
getItemProps: getItemProps,
|
|
905
949
|
getItemEvents: getItemEvents,
|
|
906
950
|
highlightedIndex: highlightedIndex
|
|
907
|
-
}),
|
|
908
|
-
"class": Input.suggestions(
|
|
909
|
-
}, [
|
|
951
|
+
}), _this7.renderErrorComponent(), !_this7.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
|
|
952
|
+
"class": Input.suggestions(_this7.themePreset, theme) + " " + getClassName(_this7.$props.innerClass, 'list')
|
|
953
|
+
}, [_this7.normalizedSuggestions.map(function (item, index) {
|
|
910
954
|
return renderItem ? h("li", {
|
|
911
955
|
"domProps": _rollupPluginBabelHelpers._extends({}, getItemProps({
|
|
912
956
|
item: item
|
|
@@ -916,7 +960,7 @@ var SearchBox = {
|
|
|
916
960
|
})),
|
|
917
961
|
"key": index + 1 + "-" + item.value,
|
|
918
962
|
"style": {
|
|
919
|
-
backgroundColor:
|
|
963
|
+
backgroundColor: _this7.getBackgroundColor(highlightedIndex, index),
|
|
920
964
|
justifyContent: 'flex-start',
|
|
921
965
|
alignItems: 'center'
|
|
922
966
|
}
|
|
@@ -929,7 +973,7 @@ var SearchBox = {
|
|
|
929
973
|
})),
|
|
930
974
|
"key": index + 1 + "-" + item.value,
|
|
931
975
|
"style": {
|
|
932
|
-
backgroundColor:
|
|
976
|
+
backgroundColor: _this7.getBackgroundColor(highlightedIndex, index),
|
|
933
977
|
justifyContent: 'flex-start',
|
|
934
978
|
alignItems: 'center'
|
|
935
979
|
}
|
|
@@ -940,61 +984,61 @@ var SearchBox = {
|
|
|
940
984
|
}
|
|
941
985
|
}, [h(DataSearch.CustomSvg, {
|
|
942
986
|
"attrs": {
|
|
943
|
-
"className": getClassName(
|
|
987
|
+
"className": getClassName(_this7.$props.innerClass, item._suggestion_type + "-search-icon") || null,
|
|
944
988
|
"icon": getIcon(item._suggestion_type),
|
|
945
989
|
"type": item._suggestion_type + "-search-icon"
|
|
946
990
|
}
|
|
947
991
|
})]), h(DataSearch.SuggestionItem, {
|
|
948
992
|
"attrs": {
|
|
949
|
-
"currentValue":
|
|
993
|
+
"currentValue": _this7.currentValue,
|
|
950
994
|
"suggestion": item
|
|
951
995
|
}
|
|
952
|
-
}),
|
|
953
|
-
})]) :
|
|
996
|
+
}), _this7.renderAutoFill(item)]);
|
|
997
|
+
})]) : _this7.renderNoSuggestions(_this7.normalizedSuggestions)]);
|
|
954
998
|
};
|
|
955
999
|
|
|
956
1000
|
return h("div", {
|
|
957
1001
|
"class": Input.suggestionsContainer
|
|
958
|
-
}, [h(DataSearch.InputGroup, [
|
|
1002
|
+
}, [h(DataSearch.InputGroup, [_this7.renderInputAddonBefore(), h(CancelSvg.InputWrapper, [h(Input.Input, {
|
|
959
1003
|
"attrs": {
|
|
960
|
-
"id":
|
|
961
|
-
"showIcon":
|
|
962
|
-
"showClear":
|
|
963
|
-
"iconPosition":
|
|
964
|
-
"placeholder":
|
|
965
|
-
"autoFocus":
|
|
966
|
-
"themePreset":
|
|
1004
|
+
"id": _this7.$props.componentId + "-input",
|
|
1005
|
+
"showIcon": _this7.$props.showIcon,
|
|
1006
|
+
"showClear": _this7.$props.showClear,
|
|
1007
|
+
"iconPosition": _this7.$props.iconPosition,
|
|
1008
|
+
"placeholder": _this7.$props.placeholder,
|
|
1009
|
+
"autoFocus": _this7.$props.autoFocus,
|
|
1010
|
+
"themePreset": _this7.themePreset,
|
|
967
1011
|
"autocomplete": "off"
|
|
968
1012
|
},
|
|
969
|
-
"ref":
|
|
970
|
-
"class": getClassName(
|
|
1013
|
+
"ref": _this7.$props.innerRef,
|
|
1014
|
+
"class": getClassName(_this7.$props.innerClass, 'input'),
|
|
971
1015
|
"on": _rollupPluginBabelHelpers._extends({}, getInputEvents({
|
|
972
|
-
onInput:
|
|
1016
|
+
onInput: _this7.onInputChange,
|
|
973
1017
|
onBlur: function onBlur(e) {
|
|
974
|
-
|
|
1018
|
+
_this7.$emit('blur', e, _this7.triggerQuery);
|
|
975
1019
|
},
|
|
976
|
-
onFocus:
|
|
1020
|
+
onFocus: _this7.handleFocus,
|
|
977
1021
|
onKeyPress: function onKeyPress(e) {
|
|
978
|
-
|
|
1022
|
+
_this7.$emit('keyPress', e, _this7.triggerQuery);
|
|
979
1023
|
|
|
980
|
-
|
|
1024
|
+
_this7.$emit('key-press', e, _this7.triggerQuery);
|
|
981
1025
|
},
|
|
982
1026
|
onKeyDown: function onKeyDown(e) {
|
|
983
|
-
return
|
|
1027
|
+
return _this7.handleKeyDown(e, highlightedIndex);
|
|
984
1028
|
},
|
|
985
1029
|
onKeyUp: function onKeyUp(e) {
|
|
986
|
-
|
|
1030
|
+
_this7.$emit('keyUp', e, _this7.triggerQuery);
|
|
987
1031
|
|
|
988
|
-
|
|
1032
|
+
_this7.$emit('key-up', e, _this7.triggerQuery);
|
|
989
1033
|
},
|
|
990
1034
|
onClick: function onClick() {
|
|
991
1035
|
setHighlightedIndex(null);
|
|
992
1036
|
}
|
|
993
1037
|
})),
|
|
994
1038
|
"domProps": _rollupPluginBabelHelpers._extends({}, getInputProps({
|
|
995
|
-
value:
|
|
1039
|
+
value: _this7.$data.currentValue === null ? '' : _this7.$data.currentValue
|
|
996
1040
|
}))
|
|
997
|
-
}),
|
|
1041
|
+
}), _this7.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()]), _this7.renderInputAddonAfter(), _this7.renderEnterButtonElement()]), expandSuggestionsContainer && renderSuggestionsDropdown()]);
|
|
998
1042
|
}
|
|
999
1043
|
}
|
|
1000
1044
|
}) : h("div", {
|
|
@@ -1010,26 +1054,26 @@ var SearchBox = {
|
|
|
1010
1054
|
},
|
|
1011
1055
|
"on": _rollupPluginBabelHelpers._extends({}, {
|
|
1012
1056
|
blur: function blur(e) {
|
|
1013
|
-
|
|
1057
|
+
_this7.$emit('blur', e, _this7.triggerQuery);
|
|
1014
1058
|
},
|
|
1015
1059
|
keypress: function keypress(e) {
|
|
1016
|
-
|
|
1060
|
+
_this7.$emit('keyPress', e, _this7.triggerQuery);
|
|
1017
1061
|
|
|
1018
|
-
|
|
1062
|
+
_this7.$emit('key-press', e, _this7.triggerQuery);
|
|
1019
1063
|
},
|
|
1020
1064
|
input: this.onInputChange,
|
|
1021
1065
|
focus: function focus(e) {
|
|
1022
|
-
|
|
1066
|
+
_this7.$emit('focus', e, _this7.triggerQuery);
|
|
1023
1067
|
},
|
|
1024
1068
|
keydown: function keydown(e) {
|
|
1025
|
-
|
|
1069
|
+
_this7.$emit('keyDown', e, _this7.triggerQuery);
|
|
1026
1070
|
|
|
1027
|
-
|
|
1071
|
+
_this7.$emit('key-down', e, _this7.triggerQuery);
|
|
1028
1072
|
},
|
|
1029
1073
|
keyup: function keyup(e) {
|
|
1030
|
-
|
|
1074
|
+
_this7.$emit('keyUp', e, _this7.triggerQuery);
|
|
1031
1075
|
|
|
1032
|
-
|
|
1076
|
+
_this7.$emit('key-up', e, _this7.triggerQuery);
|
|
1033
1077
|
}
|
|
1034
1078
|
}),
|
|
1035
1079
|
"domProps": _rollupPluginBabelHelpers._extends({}, {
|
|
@@ -1037,7 +1081,7 @@ var SearchBox = {
|
|
|
1037
1081
|
value: this.$data.currentValue ? this.$data.currentValue : ''
|
|
1038
1082
|
}),
|
|
1039
1083
|
"ref": this.$props.innerRef
|
|
1040
|
-
}), this.renderIcons()]), this.renderInputAddonAfter()])])]);
|
|
1084
|
+
}), this.renderIcons()]), this.renderInputAddonAfter(), this.renderEnterButtonElement()])])]);
|
|
1041
1085
|
},
|
|
1042
1086
|
destroyed: function destroyed() {
|
|
1043
1087
|
document.removeEventListener('keydown', this.onKeyDown);
|
package/dist/cjs/install.js
CHANGED
|
@@ -10,7 +10,7 @@ require('@appbaseio/reactivecore/lib/utils/helper');
|
|
|
10
10
|
require('emotion');
|
|
11
11
|
require('@appbaseio/vue-emotion');
|
|
12
12
|
require('polished');
|
|
13
|
-
require('./Button-
|
|
13
|
+
require('./Button-e0b7c1f6.js');
|
|
14
14
|
require('./vueTypes-57d01f18.js');
|
|
15
15
|
require('./ReactiveList.js');
|
|
16
16
|
require('@appbaseio/reactivecore/lib/utils/transform');
|
|
@@ -27,13 +27,13 @@ require('appbase-js');
|
|
|
27
27
|
require('url-search-params-polyfill');
|
|
28
28
|
require('./ReactiveBase.js');
|
|
29
29
|
require('hotkeys-js');
|
|
30
|
-
require('./DataSearch-
|
|
30
|
+
require('./DataSearch-eec21890.js');
|
|
31
31
|
require('./CancelSvg-4aa35935.js');
|
|
32
32
|
require('./Input-0d7b25ad.js');
|
|
33
33
|
require('compute-scroll-into-view');
|
|
34
34
|
require('./Container-526efa6a.js');
|
|
35
35
|
require('vue-highlight-words');
|
|
36
|
-
var install = require('./install-
|
|
36
|
+
var install = require('./install-4886582d.js');
|
|
37
37
|
require('@appbaseio/reactivecore/lib/utils/suggestions');
|
|
38
38
|
require('./FormControlList-808dbcef.js');
|
|
39
39
|
require('./utils-1219e1fe.js');
|