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