@appbaseio/reactivesearch-vue 1.16.0-alpha.54 → 1.16.0-alpha.57
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 +7668 -5301
- package/dist/@appbaseio/reactivesearch-vue.umd.js.map +1 -1
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js +21 -5
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js.map +1 -1
- package/dist/cjs/{Button-10e5cf51.js → Button-446f819e.js} +1 -1
- package/dist/cjs/{CancelSvg-82021d23.js → CancelSvg-9f258f4f.js} +1 -1
- package/dist/cjs/{Card-4b915733.js → Card-642547a8.js} +2 -2
- package/dist/cjs/{ComponentWrapper-7302fe1a.js → ComponentWrapper-ca5f0cbd.js} +2 -2
- package/dist/cjs/{Container-8a08d663.js → Container-daf30918.js} +1 -1
- package/dist/cjs/{DataSearch-7fd1b95d.js → DataSearch-1333a6de.js} +222 -80
- package/dist/cjs/DataSearch.js +10 -9
- package/dist/cjs/{DropDown-16a2a728.js → DropDown-c3f83a46.js} +4 -4
- package/dist/cjs/DynamicRangeSlider.js +5 -5
- package/dist/cjs/{Flex-699639d2.js → Flex-aa517a13.js} +1 -1
- package/dist/cjs/{FormControlList-73497794.js → FormControlList-c195a592.js} +1 -1
- package/dist/cjs/{Input-64087a69.js → Input-e6603a7e.js} +1 -1
- package/dist/cjs/{ListItem-933c27e4.js → ListItem-8c9e0d68.js} +2 -2
- package/dist/cjs/MultiDropdownList.js +10 -10
- package/dist/cjs/MultiList.js +8 -8
- package/dist/cjs/MultiRange.js +6 -6
- package/dist/cjs/{Pagination-e0654529.js → Pagination-c01d1547.js} +1 -1
- package/dist/cjs/RangeInput.js +8 -8
- package/dist/cjs/RangeSlider.js +6 -6
- package/dist/cjs/ReactiveBase.js +2 -2
- package/dist/cjs/ReactiveComponent.js +3 -3
- package/dist/cjs/ReactiveGoogleMap.js +24 -24
- package/dist/cjs/ReactiveList.js +9 -9
- package/dist/cjs/ResultCard.js +3 -3
- package/dist/cjs/ResultList.js +3 -3
- package/dist/cjs/SelectedFilters.js +44 -27
- package/dist/cjs/SingleDropdownList.js +10 -10
- package/dist/cjs/SingleList.js +8 -8
- package/dist/cjs/SingleRange.js +6 -6
- package/dist/cjs/StateProvider.js +2 -2
- package/dist/cjs/{Title-39765ee6.js → Title-1de7d0f4.js} +1 -1
- package/dist/cjs/ToggleButton.js +6 -6
- package/dist/cjs/{_rollupPluginBabelHelpers-4abdbfff.js → _rollupPluginBabelHelpers-c705cbe6.js} +2 -4
- package/dist/cjs/{index-d44a0a21.js → index-c288153a.js} +1 -1
- package/dist/cjs/index.js +19 -23
- package/dist/cjs/initReactivesearch.js +2 -2
- package/dist/cjs/{install-856cc730.js → install-c771d81a.js} +227 -66
- package/dist/cjs/install.js +19 -18
- package/dist/cjs/{ssr-c333c82c.js → ssr-3027b848.js} +1 -1
- package/dist/cjs/{utils-23afb20b.js → utils-d6a52588.js} +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/es/{Button-8b211174.js → Button-d8bc15ea.js} +1 -1
- package/dist/es/{CancelSvg-4d9e0857.js → CancelSvg-4cfae5fd.js} +1 -1
- package/dist/es/{Card-04b3c33e.js → Card-450683f1.js} +2 -2
- package/dist/es/{ComponentWrapper-bbb717bc.js → ComponentWrapper-6ad0997b.js} +2 -2
- package/dist/es/{Container-4383c6f0.js → Container-ba826e96.js} +1 -1
- package/dist/es/{DataSearch-a5aaa29e.js → DataSearch-1259f2fd.js} +221 -81
- package/dist/es/DataSearch.js +10 -9
- package/dist/es/{DropDown-7639f223.js → DropDown-2ddad7ae.js} +4 -4
- package/dist/es/DynamicRangeSlider.js +5 -5
- package/dist/es/{Flex-aac91505.js → Flex-1f0795c3.js} +1 -1
- package/dist/es/{FormControlList-fe389a2e.js → FormControlList-c22d64f6.js} +1 -1
- package/dist/es/{Input-d1bb4868.js → Input-7a2a9fac.js} +1 -1
- package/dist/es/{ListItem-bdb6d53d.js → ListItem-cad14c5e.js} +2 -2
- package/dist/es/MultiDropdownList.js +10 -10
- package/dist/es/MultiList.js +8 -8
- package/dist/es/MultiRange.js +6 -6
- package/dist/es/{Pagination-3c50d4ba.js → Pagination-491c44ee.js} +1 -1
- package/dist/es/RangeInput.js +8 -8
- package/dist/es/RangeSlider.js +6 -6
- package/dist/es/ReactiveBase.js +2 -2
- package/dist/es/ReactiveComponent.js +3 -3
- package/dist/es/ReactiveGoogleMap.js +23 -24
- package/dist/es/ReactiveList.js +9 -9
- package/dist/es/ResultCard.js +3 -3
- package/dist/es/ResultList.js +3 -3
- package/dist/es/SelectedFilters.js +44 -27
- package/dist/es/SingleDropdownList.js +10 -10
- package/dist/es/SingleList.js +8 -8
- package/dist/es/SingleRange.js +6 -6
- package/dist/es/StateProvider.js +2 -2
- package/dist/es/{Title-579f8d6c.js → Title-3342664a.js} +1 -1
- package/dist/es/ToggleButton.js +6 -6
- package/dist/es/{_rollupPluginBabelHelpers-ecf6c03c.js → _rollupPluginBabelHelpers-76660dab.js} +2 -4
- package/dist/es/{index-5daa8276.js → index-3d98f51b.js} +1 -1
- package/dist/es/index.js +20 -24
- package/dist/es/initReactivesearch.js +2 -2
- package/dist/es/{install-d1a27419.js → install-4391877a.js} +227 -66
- package/dist/es/install.js +19 -18
- package/dist/es/{ssr-e3196de1.js → ssr-b2c0b401.js} +1 -1
- package/dist/es/{utils-3a32e13f.js → utils-9e68acee.js} +1 -1
- package/dist/es/version.js +1 -1
- package/package.json +4 -4
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
import { Actions, helper, causes } from '@appbaseio/reactivecore';
|
|
2
|
-
import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-
|
|
2
|
+
import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-76660dab.js';
|
|
3
3
|
import VueTypes from 'vue-types';
|
|
4
4
|
import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
|
|
5
5
|
import { getQueryOptions, suggestionTypes } from '@appbaseio/reactivecore/lib/utils/helper';
|
|
6
6
|
import styled from '@appbaseio/vue-emotion';
|
|
7
|
-
import { B as Button } from './Button-
|
|
7
|
+
import { B as Button } from './Button-d8bc15ea.js';
|
|
8
8
|
import { t as types } from './vueTypes-9326e0be.js';
|
|
9
9
|
import ReactiveList from './ReactiveList.js';
|
|
10
|
-
import { h as hasCustomRenderer, i as isQueryIdentical, g as getComponent, u as updateDefaultQuery, f as updateCustomQuery, a as isFunction, k as isEmpty, p as parseFocusShortcuts, l as extractModifierKeysFromFocusShortcuts, c as connect } from './index-
|
|
11
|
-
import { C as ComponentWrapper } from './ComponentWrapper-
|
|
12
|
-
import { T as Title } from './Title-
|
|
10
|
+
import { h as hasCustomRenderer, i as isQueryIdentical, g as getComponent, u as updateDefaultQuery, f as updateCustomQuery, a as isFunction, k as isEmpty, p as parseFocusShortcuts, l as extractModifierKeysFromFocusShortcuts, c as connect } from './index-3d98f51b.js';
|
|
11
|
+
import { C as ComponentWrapper } from './ComponentWrapper-6ad0997b.js';
|
|
12
|
+
import { T as Title } from './Title-3342664a.js';
|
|
13
13
|
import ReactiveBase from './ReactiveBase.js';
|
|
14
14
|
import hotkeys from 'hotkeys-js';
|
|
15
|
-
import {
|
|
16
|
-
import {
|
|
17
|
-
import {
|
|
18
|
-
import {
|
|
15
|
+
import { SEARCH_COMPONENTS_MODES } from '@appbaseio/reactivecore/src/utils/constants';
|
|
16
|
+
import { S as SearchSvg, a as SuggestionWrapper, I as InputAddon, M as Mic, T as TagItem, b as TagsContainer, c as InputGroup, C as CustomSvg, d as SuggestionItem, D as DataSearch } from './DataSearch-1259f2fd.js';
|
|
17
|
+
import { C as CancelSvg, a as IconGroup, I as IconWrapper, D as Downshift, b as InputWrapper } from './CancelSvg-4cfae5fd.js';
|
|
18
|
+
import { s as suggestionsContainer, I as Input, a as suggestions } from './Input-7a2a9fac.js';
|
|
19
|
+
import { C as Container } from './Container-ba826e96.js';
|
|
19
20
|
import SingleList from './SingleList.js';
|
|
20
21
|
import MultiList from './MultiList.js';
|
|
21
22
|
import SingleDropdownList from './SingleDropdownList.js';
|
|
@@ -74,10 +75,12 @@ var _debounce = helper.debounce,
|
|
|
74
75
|
normalizeDataField = helper.normalizeDataField;
|
|
75
76
|
var SearchBox = {
|
|
76
77
|
name: 'SearchBox',
|
|
78
|
+
isTagsMode: false,
|
|
77
79
|
data: function data() {
|
|
78
80
|
var props = this.$props;
|
|
79
81
|
this.__state = {
|
|
80
82
|
currentValue: '',
|
|
83
|
+
selectedTags: [],
|
|
81
84
|
isOpen: false,
|
|
82
85
|
normalizedSuggestions: []
|
|
83
86
|
};
|
|
@@ -93,7 +96,16 @@ var SearchBox = {
|
|
|
93
96
|
var _this$$props = this.$props,
|
|
94
97
|
distinctField = _this$$props.distinctField,
|
|
95
98
|
distinctFieldConfig = _this$$props.distinctFieldConfig,
|
|
96
|
-
index = _this$$props.index
|
|
99
|
+
index = _this$$props.index,
|
|
100
|
+
mode = _this$$props.mode;
|
|
101
|
+
|
|
102
|
+
if (mode === SEARCH_COMPONENTS_MODES.TAG) {
|
|
103
|
+
this.$options.isTagsMode = true;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
if (this.$options.isTagsMode) {
|
|
107
|
+
console.warn('Warning(ReactiveSearch): The `categoryField` prop is not supported when `mode` prop is set to `tag`');
|
|
108
|
+
}
|
|
97
109
|
|
|
98
110
|
if (this.enableAppbase && this.aggregationField && this.aggregationField !== '') {
|
|
99
111
|
console.warn('Warning(ReactiveSearch): The `aggregationField` prop has been marked as deprecated, please use the `distinctField` prop instead.');
|
|
@@ -108,8 +120,12 @@ var SearchBox = {
|
|
|
108
120
|
}
|
|
109
121
|
|
|
110
122
|
this.currentValue = this.selectedValue || this.value || this.defaultValue || '';
|
|
111
|
-
|
|
112
|
-
|
|
123
|
+
|
|
124
|
+
if (this.$options.isTagsMode) {
|
|
125
|
+
this.currentValue = '';
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
this.handleTextChange = _debounce(this.handleText, this.$props.debounce); // Set custom and default queries in store
|
|
113
129
|
|
|
114
130
|
this.triggerCustomQuery(this.currentValue, this.selectedCategory);
|
|
115
131
|
this.triggerDefaultQuery(this.currentValue);
|
|
@@ -145,7 +161,7 @@ var SearchBox = {
|
|
|
145
161
|
debounce: VueTypes.number.def(0),
|
|
146
162
|
defaultValue: types.string,
|
|
147
163
|
excludeFields: types.excludeFields,
|
|
148
|
-
value: types.value,
|
|
164
|
+
value: VueTypes.oneOfType([VueTypes.arrayOf(VueTypes.string), types.value]),
|
|
149
165
|
defaultSuggestions: types.suggestions,
|
|
150
166
|
enableSynonyms: VueTypes.bool.def(true),
|
|
151
167
|
enableQuerySuggestions: VueTypes.bool.def(false),
|
|
@@ -198,7 +214,18 @@ var SearchBox = {
|
|
|
198
214
|
onData: types.func,
|
|
199
215
|
renderItem: types.func,
|
|
200
216
|
enterButton: VueTypes.bool.def(false),
|
|
201
|
-
renderEnterButton: VueTypes.any
|
|
217
|
+
renderEnterButton: VueTypes.any,
|
|
218
|
+
mode: VueTypes.oneOf(['select', 'tag']).def('select'),
|
|
219
|
+
renderSelectedTags: VueTypes.any
|
|
220
|
+
},
|
|
221
|
+
beforeMount: function beforeMount() {
|
|
222
|
+
if (this.selectedValue) {
|
|
223
|
+
this.setValue(this.selectedValue, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined);
|
|
224
|
+
} else if (this.$props.value) {
|
|
225
|
+
this.setValue(this.$props.value, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined);
|
|
226
|
+
} else if (this.$props.defaultValue) {
|
|
227
|
+
this.setValue(this.$props.defaultValue, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined);
|
|
228
|
+
}
|
|
202
229
|
},
|
|
203
230
|
mounted: function mounted() {
|
|
204
231
|
this.listenForFocusShortcuts();
|
|
@@ -248,15 +275,25 @@ var SearchBox = {
|
|
|
248
275
|
this.normalizedSuggestions = suggestionsList;
|
|
249
276
|
},
|
|
250
277
|
selectedValue: function selectedValue(newVal, oldVal) {
|
|
251
|
-
if (oldVal
|
|
278
|
+
if (!isEqual(newVal, oldVal) && (this.$options.isTagsMode ? !isEqual(this.$data.selectedTags, newVal) : this.$data.currentValue !== newVal)) {
|
|
252
279
|
if (!newVal && this.$data.currentValue) {
|
|
253
280
|
// selected value is cleared, call onValueSelected
|
|
254
281
|
this.onValueSelectedHandler('', causes.CLEAR_VALUE);
|
|
282
|
+
} // if (this.$props.value === undefined) {
|
|
283
|
+
|
|
284
|
+
|
|
285
|
+
if (this.$options.isTagsMode) {
|
|
286
|
+
// handling reset of tags through SelectedFilters or URL
|
|
287
|
+
this.selectedTags = [];
|
|
255
288
|
}
|
|
256
289
|
|
|
257
|
-
|
|
258
|
-
|
|
290
|
+
var cause = !newVal ? causes.CLEAR_VALUE : undefined;
|
|
291
|
+
|
|
292
|
+
if (this.$options.isTagsMode) {
|
|
293
|
+
cause = causes.SUGGESTION_SELECT;
|
|
259
294
|
}
|
|
295
|
+
|
|
296
|
+
this.setValue(newVal || '', true, this.$props, cause); // }
|
|
260
297
|
}
|
|
261
298
|
},
|
|
262
299
|
focusShortcuts: function focusShortcuts() {
|
|
@@ -397,7 +434,40 @@ var SearchBox = {
|
|
|
397
434
|
}
|
|
398
435
|
|
|
399
436
|
var performUpdate = function performUpdate() {
|
|
400
|
-
_this.
|
|
437
|
+
if (_this.$options.isTagsMode && isEqual(value, _this.selectedTags)) {
|
|
438
|
+
return;
|
|
439
|
+
}
|
|
440
|
+
|
|
441
|
+
if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
|
|
442
|
+
if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
|
|
443
|
+
// check if value already present in selectedTags
|
|
444
|
+
if (typeof value === 'string' && _this.selectedTags.includes(value)) {
|
|
445
|
+
_this.isOpen = false;
|
|
446
|
+
return;
|
|
447
|
+
}
|
|
448
|
+
|
|
449
|
+
_this.selectedTags = [].concat(_this.selectedTags);
|
|
450
|
+
|
|
451
|
+
if (typeof value === 'string' && !!value) {
|
|
452
|
+
_this.selectedTags.push(value);
|
|
453
|
+
} else if (Array.isArray(value) && !isEqual(_this.selectedTags, value)) {
|
|
454
|
+
var mergedArray = Array.from(new Set([].concat(_this.selectedTags, value)));
|
|
455
|
+
_this.selectedTags = mergedArray;
|
|
456
|
+
}
|
|
457
|
+
} else if (value) {
|
|
458
|
+
_this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
|
|
459
|
+
}
|
|
460
|
+
|
|
461
|
+
_this.currentValue = '';
|
|
462
|
+
} else {
|
|
463
|
+
_this.currentValue = value;
|
|
464
|
+
}
|
|
465
|
+
|
|
466
|
+
var queryHandlerValue = value;
|
|
467
|
+
|
|
468
|
+
if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
|
|
469
|
+
queryHandlerValue = Array.isArray(_this.selectedTags) && _this.selectedTags.length ? _this.selectedTags : undefined;
|
|
470
|
+
}
|
|
401
471
|
|
|
402
472
|
if (isDefaultValue) {
|
|
403
473
|
if (_this.$props.autosuggest) {
|
|
@@ -405,19 +475,19 @@ var SearchBox = {
|
|
|
405
475
|
_this.isOpen = false;
|
|
406
476
|
}
|
|
407
477
|
|
|
408
|
-
_this.triggerDefaultQuery(
|
|
478
|
+
if (typeof _this.currentValue === 'string') _this.triggerDefaultQuery(_this.currentValue);
|
|
409
479
|
} // in case of strict selection only SUGGESTION_SELECT should be able
|
|
410
480
|
// to set the query otherwise the value should reset
|
|
411
481
|
|
|
412
482
|
|
|
413
483
|
if (props.strictSelection) {
|
|
414
|
-
if (cause === causes.SUGGESTION_SELECT || value === '') {
|
|
415
|
-
_this.triggerCustomQuery(
|
|
484
|
+
if (cause === causes.SUGGESTION_SELECT || (_this.$options.isTagsMode ? _this.selectedTags.length === 0 : value === '')) {
|
|
485
|
+
_this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
|
|
416
486
|
} else {
|
|
417
487
|
_this.setValue('', true);
|
|
418
488
|
}
|
|
419
|
-
} else if (props.value === undefined) {
|
|
420
|
-
_this.triggerCustomQuery(
|
|
489
|
+
} else if (props.value === undefined || cause === causes.SUGGESTION_SELECT || cause === causes.CLEAR_VALUE) {
|
|
490
|
+
_this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
|
|
421
491
|
}
|
|
422
492
|
} else {
|
|
423
493
|
// debounce for handling text while typing
|
|
@@ -468,6 +538,11 @@ var SearchBox = {
|
|
|
468
538
|
showFilter = _this$$props2.showFilter,
|
|
469
539
|
URLParams = _this$$props2.URLParams;
|
|
470
540
|
var value = typeof paramValue !== 'string' ? this.$data.currentValue : paramValue;
|
|
541
|
+
|
|
542
|
+
if (this.$options.isTagsMode) {
|
|
543
|
+
value = paramValue;
|
|
544
|
+
}
|
|
545
|
+
|
|
471
546
|
var defaultQueryTobeSet = SearchBox.defaultQuery("" + value + (categoryValue ? " in " + categoryValue : ''), this.$props);
|
|
472
547
|
var query = defaultQueryTobeSet;
|
|
473
548
|
|
|
@@ -561,7 +636,8 @@ var SearchBox = {
|
|
|
561
636
|
if (this.$props.autosuggest === false) {
|
|
562
637
|
this.enterButtonOnClick();
|
|
563
638
|
} else if (highlightedIndex === null) {
|
|
564
|
-
this.setValue(event.target.value, true
|
|
639
|
+
this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined // to handle tags
|
|
640
|
+
);
|
|
565
641
|
this.onValueSelectedHandler(event.target.value, causes.ENTER_PRESS);
|
|
566
642
|
}
|
|
567
643
|
} // Need to review
|
|
@@ -606,13 +682,29 @@ var SearchBox = {
|
|
|
606
682
|
if (value === undefined) {
|
|
607
683
|
this.setValue(suggestion.value, true, this.$props, causes.SUGGESTION_SELECT, false, suggestion._category);
|
|
608
684
|
} else {
|
|
609
|
-
|
|
685
|
+
var emitValue = suggestion.value;
|
|
686
|
+
|
|
687
|
+
if (this.$options.isTagsMode) {
|
|
688
|
+
emitValue = Array.isArray(this.selectedTags) ? [].concat(this.selectedTags) : [];
|
|
689
|
+
|
|
690
|
+
if (this.selectedTags.includes(suggestion.value)) {
|
|
691
|
+
// avoid duplicates in tags array
|
|
692
|
+
this.isOpen = false;
|
|
693
|
+
return;
|
|
694
|
+
}
|
|
695
|
+
|
|
696
|
+
emitValue.push(suggestion.value);
|
|
697
|
+
}
|
|
698
|
+
|
|
699
|
+
this.setValue(emitValue, true, this.$props, causes.SUGGESTION_SELECT, false, suggestion._category);
|
|
700
|
+
this.$emit('change', emitValue, function (_ref4) {
|
|
610
701
|
var isOpen = _ref4.isOpen;
|
|
611
|
-
return _this3.triggerQuery({
|
|
702
|
+
return _this3.triggerQuery(_extends({
|
|
612
703
|
isOpen: isOpen,
|
|
613
|
-
value:
|
|
704
|
+
value: emitValue
|
|
705
|
+
}, !_this3.$options.isTagsMode && {
|
|
614
706
|
categoryValue: suggestion._category
|
|
615
|
-
});
|
|
707
|
+
}));
|
|
616
708
|
});
|
|
617
709
|
}
|
|
618
710
|
|
|
@@ -758,7 +850,7 @@ var SearchBox = {
|
|
|
758
850
|
}
|
|
759
851
|
|
|
760
852
|
return h(Button, {
|
|
761
|
-
"class": "enter-btn " + getClassName(innerClass, '
|
|
853
|
+
"class": "enter-btn " + getClassName(innerClass, 'enter-button'),
|
|
762
854
|
"attrs": {
|
|
763
855
|
"primary": true
|
|
764
856
|
},
|
|
@@ -895,10 +987,79 @@ var SearchBox = {
|
|
|
895
987
|
"click": handleAutoFillClick
|
|
896
988
|
}
|
|
897
989
|
});
|
|
990
|
+
},
|
|
991
|
+
renderTag: function renderTag(item) {
|
|
992
|
+
var _this7 = this;
|
|
993
|
+
|
|
994
|
+
var h = this.$createElement;
|
|
995
|
+
var innerClass = this.$props.innerClass;
|
|
996
|
+
return h(TagItem, {
|
|
997
|
+
"class": getClassName(innerClass, 'selected-tag') || ''
|
|
998
|
+
}, [h("span", [item]), h("span", {
|
|
999
|
+
"attrs": {
|
|
1000
|
+
"role": "img",
|
|
1001
|
+
"aria-label": "delete-tag"
|
|
1002
|
+
},
|
|
1003
|
+
"class": "close-icon",
|
|
1004
|
+
"on": {
|
|
1005
|
+
"click": function click() {
|
|
1006
|
+
return _this7.clearTag(item);
|
|
1007
|
+
}
|
|
1008
|
+
}
|
|
1009
|
+
}, [h(CancelSvg)])]);
|
|
1010
|
+
},
|
|
1011
|
+
clearAllTags: function clearAllTags() {
|
|
1012
|
+
this.selectedTags = [];
|
|
1013
|
+
this.setValue('', true, this.$props, causes.SUGGESTION_SELECT);
|
|
1014
|
+
|
|
1015
|
+
if (this.$props.value !== undefined) {
|
|
1016
|
+
this.$emit('change', this.selectedTags, this.triggerQuery);
|
|
1017
|
+
}
|
|
1018
|
+
},
|
|
1019
|
+
clearTag: function clearTag(tagValue) {
|
|
1020
|
+
this.selectedTags = [].concat(this.selectedTags.filter(function (tag) {
|
|
1021
|
+
return tag !== tagValue;
|
|
1022
|
+
}));
|
|
1023
|
+
this.setValue('', true, this.$props, causes.SUGGESTION_SELECT);
|
|
1024
|
+
|
|
1025
|
+
if (this.$props.value !== undefined) {
|
|
1026
|
+
this.$emit('change', this.selectedTags, this.triggerQuery);
|
|
1027
|
+
}
|
|
1028
|
+
},
|
|
1029
|
+
renderTags: function renderTags() {
|
|
1030
|
+
var _this8 = this;
|
|
1031
|
+
|
|
1032
|
+
var h = this.$createElement;
|
|
1033
|
+
|
|
1034
|
+
if (!Array.isArray(this.selectedTags)) {
|
|
1035
|
+
return null;
|
|
1036
|
+
}
|
|
1037
|
+
|
|
1038
|
+
var tagsList = [].concat(this.selectedTags);
|
|
1039
|
+
var shouldRenderClearAllTag = tagsList.length > 1;
|
|
1040
|
+
var renderSelectedTags = this.$scopedSlots.renderSelectedTags || this.$props.renderSelectedTags;
|
|
1041
|
+
return renderSelectedTags ? renderSelectedTags({
|
|
1042
|
+
values: this.selectedTags,
|
|
1043
|
+
handleClear: this.clearTag,
|
|
1044
|
+
handleClearAll: this.clearAllTags
|
|
1045
|
+
}) : h(TagsContainer, [tagsList.map(function (item) {
|
|
1046
|
+
return _this8.renderTag(item);
|
|
1047
|
+
}), shouldRenderClearAllTag && h(TagItem, {
|
|
1048
|
+
"class": getClassName(this.$props.innerClass, 'selected-tag') || ''
|
|
1049
|
+
}, [h("span", ["Clear All"]), h("span", {
|
|
1050
|
+
"attrs": {
|
|
1051
|
+
"role": "img",
|
|
1052
|
+
"aria-label": "delete-tag"
|
|
1053
|
+
},
|
|
1054
|
+
"class": "close-icon",
|
|
1055
|
+
"on": {
|
|
1056
|
+
"click": this.clearAllTags
|
|
1057
|
+
}
|
|
1058
|
+
}, [h(CancelSvg)])])]);
|
|
898
1059
|
}
|
|
899
1060
|
},
|
|
900
1061
|
render: function render() {
|
|
901
|
-
var
|
|
1062
|
+
var _this9 = this;
|
|
902
1063
|
|
|
903
1064
|
var h = arguments[0];
|
|
904
1065
|
var _this$$props6 = this.$props,
|
|
@@ -944,14 +1105,14 @@ var SearchBox = {
|
|
|
944
1105
|
}
|
|
945
1106
|
};
|
|
946
1107
|
|
|
947
|
-
return h("div", [
|
|
1108
|
+
return h("div", [_this9.hasCustomRenderer && _this9.getComponent({
|
|
948
1109
|
isOpen: isOpen,
|
|
949
1110
|
getItemProps: getItemProps,
|
|
950
1111
|
getItemEvents: getItemEvents,
|
|
951
1112
|
highlightedIndex: highlightedIndex
|
|
952
|
-
}),
|
|
953
|
-
"class": suggestions(
|
|
954
|
-
}, [
|
|
1113
|
+
}), _this9.renderErrorComponent(), !_this9.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
|
|
1114
|
+
"class": suggestions(_this9.themePreset, theme) + " " + getClassName(_this9.$props.innerClass, 'list')
|
|
1115
|
+
}, [_this9.normalizedSuggestions.map(function (item, index) {
|
|
955
1116
|
return renderItem ? h("li", {
|
|
956
1117
|
"domProps": _extends({}, getItemProps({
|
|
957
1118
|
item: item
|
|
@@ -961,7 +1122,7 @@ var SearchBox = {
|
|
|
961
1122
|
})),
|
|
962
1123
|
"key": index + 1 + "-" + item.value,
|
|
963
1124
|
"style": {
|
|
964
|
-
backgroundColor:
|
|
1125
|
+
backgroundColor: _this9.getBackgroundColor(highlightedIndex, index),
|
|
965
1126
|
justifyContent: 'flex-start',
|
|
966
1127
|
alignItems: 'center'
|
|
967
1128
|
}
|
|
@@ -974,7 +1135,7 @@ var SearchBox = {
|
|
|
974
1135
|
})),
|
|
975
1136
|
"key": index + 1 + "-" + item.value,
|
|
976
1137
|
"style": {
|
|
977
|
-
backgroundColor:
|
|
1138
|
+
backgroundColor: _this9.getBackgroundColor(highlightedIndex, index),
|
|
978
1139
|
justifyContent: 'flex-start',
|
|
979
1140
|
alignItems: 'center'
|
|
980
1141
|
}
|
|
@@ -985,61 +1146,61 @@ var SearchBox = {
|
|
|
985
1146
|
}
|
|
986
1147
|
}, [h(CustomSvg, {
|
|
987
1148
|
"attrs": {
|
|
988
|
-
"className": getClassName(
|
|
1149
|
+
"className": getClassName(_this9.$props.innerClass, item._suggestion_type + "-search-icon") || null,
|
|
989
1150
|
"icon": getIcon(item._suggestion_type),
|
|
990
1151
|
"type": item._suggestion_type + "-search-icon"
|
|
991
1152
|
}
|
|
992
1153
|
})]), h(SuggestionItem, {
|
|
993
1154
|
"attrs": {
|
|
994
|
-
"currentValue":
|
|
1155
|
+
"currentValue": _this9.currentValue,
|
|
995
1156
|
"suggestion": item
|
|
996
1157
|
}
|
|
997
|
-
}),
|
|
998
|
-
})]) :
|
|
1158
|
+
}), _this9.renderAutoFill(item)]);
|
|
1159
|
+
})]) : _this9.renderNoSuggestions(_this9.normalizedSuggestions)]);
|
|
999
1160
|
};
|
|
1000
1161
|
|
|
1001
1162
|
return h("div", {
|
|
1002
1163
|
"class": suggestionsContainer
|
|
1003
|
-
}, [h(InputGroup, [
|
|
1164
|
+
}, [h(InputGroup, [_this9.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
|
|
1004
1165
|
"attrs": {
|
|
1005
|
-
"id":
|
|
1006
|
-
"showIcon":
|
|
1007
|
-
"showClear":
|
|
1008
|
-
"iconPosition":
|
|
1009
|
-
"placeholder":
|
|
1010
|
-
"autoFocus":
|
|
1011
|
-
"themePreset":
|
|
1166
|
+
"id": _this9.$props.componentId + "-input",
|
|
1167
|
+
"showIcon": _this9.$props.showIcon,
|
|
1168
|
+
"showClear": _this9.$props.showClear,
|
|
1169
|
+
"iconPosition": _this9.$props.iconPosition,
|
|
1170
|
+
"placeholder": _this9.$props.placeholder,
|
|
1171
|
+
"autoFocus": _this9.$props.autoFocus,
|
|
1172
|
+
"themePreset": _this9.themePreset,
|
|
1012
1173
|
"autocomplete": "off"
|
|
1013
1174
|
},
|
|
1014
|
-
"ref":
|
|
1015
|
-
"class": getClassName(
|
|
1175
|
+
"ref": _this9.$props.innerRef,
|
|
1176
|
+
"class": getClassName(_this9.$props.innerClass, 'input'),
|
|
1016
1177
|
"on": _extends({}, getInputEvents({
|
|
1017
|
-
onInput:
|
|
1178
|
+
onInput: _this9.onInputChange,
|
|
1018
1179
|
onBlur: function onBlur(e) {
|
|
1019
|
-
|
|
1180
|
+
_this9.$emit('blur', e, _this9.triggerQuery);
|
|
1020
1181
|
},
|
|
1021
|
-
onFocus:
|
|
1182
|
+
onFocus: _this9.handleFocus,
|
|
1022
1183
|
onKeyPress: function onKeyPress(e) {
|
|
1023
|
-
|
|
1184
|
+
_this9.$emit('keyPress', e, _this9.triggerQuery);
|
|
1024
1185
|
|
|
1025
|
-
|
|
1186
|
+
_this9.$emit('key-press', e, _this9.triggerQuery);
|
|
1026
1187
|
},
|
|
1027
1188
|
onKeyDown: function onKeyDown(e) {
|
|
1028
|
-
return
|
|
1189
|
+
return _this9.handleKeyDown(e, highlightedIndex);
|
|
1029
1190
|
},
|
|
1030
1191
|
onKeyUp: function onKeyUp(e) {
|
|
1031
|
-
|
|
1192
|
+
_this9.$emit('keyUp', e, _this9.triggerQuery);
|
|
1032
1193
|
|
|
1033
|
-
|
|
1194
|
+
_this9.$emit('key-up', e, _this9.triggerQuery);
|
|
1034
1195
|
},
|
|
1035
1196
|
onClick: function onClick() {
|
|
1036
1197
|
setHighlightedIndex(null);
|
|
1037
1198
|
}
|
|
1038
1199
|
})),
|
|
1039
1200
|
"domProps": _extends({}, getInputProps({
|
|
1040
|
-
value:
|
|
1201
|
+
value: _this9.$data.currentValue === null ? '' : _this9.$data.currentValue
|
|
1041
1202
|
}))
|
|
1042
|
-
}),
|
|
1203
|
+
}), _this9.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()]), _this9.renderInputAddonAfter(), _this9.renderEnterButtonElement()]), expandSuggestionsContainer && renderSuggestionsDropdown(), _this9.renderTags()]);
|
|
1043
1204
|
}
|
|
1044
1205
|
}
|
|
1045
1206
|
}) : h("div", {
|
|
@@ -1055,22 +1216,22 @@ var SearchBox = {
|
|
|
1055
1216
|
},
|
|
1056
1217
|
"on": _extends({}, {
|
|
1057
1218
|
blur: function blur(e) {
|
|
1058
|
-
|
|
1219
|
+
_this9.$emit('blur', e, _this9.triggerQuery);
|
|
1059
1220
|
},
|
|
1060
1221
|
keypress: function keypress(e) {
|
|
1061
|
-
|
|
1222
|
+
_this9.$emit('keyPress', e, _this9.triggerQuery);
|
|
1062
1223
|
|
|
1063
|
-
|
|
1224
|
+
_this9.$emit('key-press', e, _this9.triggerQuery);
|
|
1064
1225
|
},
|
|
1065
1226
|
input: this.onInputChange,
|
|
1066
1227
|
focus: function focus(e) {
|
|
1067
|
-
|
|
1228
|
+
_this9.$emit('focus', e, _this9.triggerQuery);
|
|
1068
1229
|
},
|
|
1069
1230
|
keydown: this.handleKeyDown,
|
|
1070
1231
|
keyup: function keyup(e) {
|
|
1071
|
-
|
|
1232
|
+
_this9.$emit('keyUp', e, _this9.triggerQuery);
|
|
1072
1233
|
|
|
1073
|
-
|
|
1234
|
+
_this9.$emit('key-up', e, _this9.triggerQuery);
|
|
1074
1235
|
}
|
|
1075
1236
|
}),
|
|
1076
1237
|
"domProps": _extends({}, {
|
package/dist/es/install.js
CHANGED
|
@@ -1,42 +1,43 @@
|
|
|
1
1
|
import '@appbaseio/reactivecore';
|
|
2
|
-
import './_rollupPluginBabelHelpers-
|
|
2
|
+
import './_rollupPluginBabelHelpers-76660dab.js';
|
|
3
3
|
import 'vue-types';
|
|
4
4
|
import '@appbaseio/reactivecore/lib/utils/constants';
|
|
5
5
|
import '@appbaseio/reactivecore/lib/utils/helper';
|
|
6
6
|
import 'emotion';
|
|
7
7
|
import '@appbaseio/vue-emotion';
|
|
8
8
|
import 'polished';
|
|
9
|
-
import './Button-
|
|
9
|
+
import './Button-d8bc15ea.js';
|
|
10
10
|
import './vueTypes-9326e0be.js';
|
|
11
|
-
import './Pagination-
|
|
11
|
+
import './Pagination-491c44ee.js';
|
|
12
12
|
import './ReactiveList.js';
|
|
13
13
|
import '@appbaseio/reactivecore/lib/utils/transform';
|
|
14
14
|
import 'redux';
|
|
15
|
-
import './index-
|
|
16
|
-
import './ComponentWrapper-
|
|
15
|
+
import './index-3d98f51b.js';
|
|
16
|
+
import './ComponentWrapper-6ad0997b.js';
|
|
17
17
|
import '@vue/babel-helper-vue-jsx-merge-props';
|
|
18
|
-
import './Title-
|
|
19
|
-
import './ListItem-
|
|
20
|
-
import './Card-
|
|
21
|
-
import './Flex-
|
|
18
|
+
import './Title-3342664a.js';
|
|
19
|
+
import './ListItem-cad14c5e.js';
|
|
20
|
+
import './Card-450683f1.js';
|
|
21
|
+
import './Flex-1f0795c3.js';
|
|
22
22
|
import '@appbaseio/reactivecore/lib/actions/analytics';
|
|
23
23
|
import 'appbase-js';
|
|
24
24
|
import 'url-search-params-polyfill';
|
|
25
25
|
import './ReactiveBase.js';
|
|
26
26
|
import 'hotkeys-js';
|
|
27
|
-
import '
|
|
28
|
-
import './
|
|
29
|
-
import './
|
|
27
|
+
import '@appbaseio/reactivecore/src/utils/constants';
|
|
28
|
+
import './DataSearch-1259f2fd.js';
|
|
29
|
+
import './CancelSvg-4cfae5fd.js';
|
|
30
|
+
import './Input-7a2a9fac.js';
|
|
30
31
|
import 'compute-scroll-into-view';
|
|
31
|
-
import './Container-
|
|
32
|
+
import './Container-ba826e96.js';
|
|
32
33
|
import 'vue-highlight-words';
|
|
33
|
-
export { i as default } from './install-
|
|
34
|
+
export { i as default } from './install-4391877a.js';
|
|
34
35
|
import '@appbaseio/reactivecore/lib/utils/suggestions';
|
|
35
|
-
import './FormControlList-
|
|
36
|
-
import './utils-
|
|
36
|
+
import './FormControlList-c22d64f6.js';
|
|
37
|
+
import './utils-9e68acee.js';
|
|
37
38
|
import './SingleList.js';
|
|
38
39
|
import './MultiList.js';
|
|
39
|
-
import './DropDown-
|
|
40
|
+
import './DropDown-2ddad7ae.js';
|
|
40
41
|
import './SingleDropdownList.js';
|
|
41
42
|
import './MultiDropdownList.js';
|
|
42
43
|
import './ToggleButton.js';
|
|
@@ -47,7 +48,7 @@ import './MultiRange.js';
|
|
|
47
48
|
import './ResultCard.js';
|
|
48
49
|
import './ResultList.js';
|
|
49
50
|
import 'vue-no-ssr';
|
|
50
|
-
import './ssr-
|
|
51
|
+
import './ssr-b2c0b401.js';
|
|
51
52
|
import './RangeSlider.js';
|
|
52
53
|
import './DynamicRangeSlider.js';
|
|
53
54
|
import './StateProvider.js';
|
package/dist/es/version.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@appbaseio/reactivesearch-vue",
|
|
3
|
-
"version": "1.16.0-alpha.
|
|
3
|
+
"version": "1.16.0-alpha.57",
|
|
4
4
|
"private": false,
|
|
5
5
|
"main": "dist/cjs/index.js",
|
|
6
6
|
"jsnext:main": "dist/es/index.js",
|
|
@@ -34,15 +34,15 @@
|
|
|
34
34
|
],
|
|
35
35
|
"sideEffects": false,
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@appbaseio/reactivecore": "9.14.
|
|
37
|
+
"@appbaseio/reactivecore": "9.14.15",
|
|
38
38
|
"@appbaseio/vue-emotion": "0.4.4",
|
|
39
39
|
"@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
|
|
40
40
|
"appbase-js": "^5.0.0",
|
|
41
41
|
"compute-scroll-into-view": "^1.0.11",
|
|
42
42
|
"emotion": "9.2.12",
|
|
43
|
-
"gmap-vue": "^
|
|
44
|
-
"ngeohash": "^0.6.3",
|
|
43
|
+
"gmap-vue": "^3.5.2",
|
|
45
44
|
"hotkeys-js": "^3.8.7",
|
|
45
|
+
"ngeohash": "^0.6.3",
|
|
46
46
|
"polished": "^2.2.0",
|
|
47
47
|
"redux": "^4.0.0",
|
|
48
48
|
"url-search-params-polyfill": "^7.0.0",
|