@appbaseio/reactivesearch-vue 1.36.2 → 1.36.3

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.
@@ -18718,7 +18718,8 @@
18718
18718
  selectedTags: [],
18719
18719
  isOpen: false,
18720
18720
  normalizedSuggestions: [],
18721
- isPending: false
18721
+ isPending: false,
18722
+ isSuggestionSelected: false
18722
18723
  };
18723
18724
  this.internalComponent = props.componentId + "__internal";
18724
18725
  return this.__state;
@@ -19096,13 +19097,13 @@
19096
19097
  if (isTagsMode && isEqual$4(value, _this.selectedTags)) {
19097
19098
  return;
19098
19099
  }
19099
- // Refresh recent searches when value becomes empty
19100
19100
  if (!value && props.enableDefaultSuggestions === false) {
19101
19101
  _this.resetStoreForComponent(props.componentId);
19102
19102
  } else if (!value && _this.currentValue && _this.enableRecentSearches) {
19103
19103
  _this.getRecentSearches();
19104
19104
  }
19105
19105
  if (isTagsMode) {
19106
+ var isTagAdded = false;
19106
19107
  if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
19107
19108
  // check if value already present in selectedTags
19108
19109
  if (typeof value === 'string' && _this.selectedTags.includes(value)) {
@@ -19111,14 +19112,36 @@
19111
19112
  }
19112
19113
  _this.selectedTags = [].concat(_this.selectedTags);
19113
19114
  if (typeof value === 'string' && !!value) {
19114
- _this.selectedTags.push(value);
19115
+ if (props.strictSelection && cause === lib_7.SUGGESTION_SELECT) {
19116
+ _this.selectedTags.push(value);
19117
+ isTagAdded = true;
19118
+ } else if (!props.strictSelection) {
19119
+ _this.selectedTags.push(value);
19120
+ isTagAdded = true;
19121
+ }
19115
19122
  } else if (Array.isArray(value) && !isEqual$4(_this.selectedTags, value)) {
19116
- _this.selectedTags = value;
19123
+ if (props.strictSelection && cause === lib_7.SUGGESTION_SELECT) {
19124
+ _this.selectedTags = value;
19125
+ isTagAdded = true;
19126
+ } else if (!props.strictSelection) {
19127
+ _this.selectedTags.push(value);
19128
+ isTagAdded = true;
19129
+ }
19117
19130
  }
19118
19131
  } else if (value) {
19119
- _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
19132
+ if (props.strictSelection && cause === lib_7.SUGGESTION_SELECT) {
19133
+ _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
19134
+ isTagAdded = true;
19135
+ } else if (!props.strictSelection) {
19136
+ _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
19137
+ isTagAdded = true;
19138
+ }
19139
+ }
19140
+ if (props.strictSelection && !isTagAdded) {
19141
+ _this.currentValue = value;
19142
+ } else {
19143
+ _this.currentValue = '';
19120
19144
  }
19121
- _this.currentValue = '';
19122
19145
  } else {
19123
19146
  _this.currentValue = value;
19124
19147
  }
@@ -19138,7 +19161,7 @@
19138
19161
  if (props.strictSelection && props.autosuggest) {
19139
19162
  if (cause === lib_7.SUGGESTION_SELECT || props.value !== undefined) {
19140
19163
  _this.updateQueryHandler(props.componentId, queryHandlerValue, props);
19141
- } else if (_this.currentValue !== '') {
19164
+ } else if (_this.currentValue !== '' && !props.strictSelection) {
19142
19165
  _this.setValue('', true);
19143
19166
  }
19144
19167
  } else {
@@ -19168,11 +19191,6 @@
19168
19191
  if (props === void 0) {
19169
19192
  props = this.$props;
19170
19193
  }
19171
- if (!value && props.enableDefaultSuggestions === false) {
19172
- // clear Component data from store
19173
- this.resetStoreForComponent(props.componentId);
19174
- return;
19175
- }
19176
19194
  var defaultQueryOptions;
19177
19195
  var query = DataSearch.defaultQuery(value, props);
19178
19196
  if (this.defaultQuery) {
@@ -19185,13 +19203,18 @@
19185
19203
  // Update calculated default query in store
19186
19204
  updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
19187
19205
  }
19188
- this.setQueryOptions(this.internalComponent, _extends({}, this.queryOptions, defaultQueryOptions), execute);
19189
- this.updateQuery({
19190
- componentId: this.internalComponent,
19191
- query: query,
19192
- value: value,
19193
- componentType: constants_1$1.dataSearch
19194
- }, execute);
19206
+ if (!value && props.enableDefaultSuggestions === false) {
19207
+ // clear Component data from store
19208
+ this.resetStoreForComponent(props.componentId);
19209
+ } else {
19210
+ this.setQueryOptions(this.internalComponent, _extends({}, this.queryOptions, defaultQueryOptions), execute);
19211
+ this.updateQuery({
19212
+ componentId: this.internalComponent,
19213
+ query: query,
19214
+ value: value,
19215
+ componentType: constants_1$1.dataSearch
19216
+ }, execute);
19217
+ }
19195
19218
  },
19196
19219
  updateQueryHandler: function updateQueryHandler(componentId, value, props) {
19197
19220
  var customQuery = props.customQuery,
@@ -19267,17 +19290,17 @@
19267
19290
  var targetValue = event.target.value;
19268
19291
  var _this$$props2 = this.$props,
19269
19292
  value = _this$$props2.value,
19270
- strictSelection = _this$$props2.strictSelection,
19271
- size = _this$$props2.size,
19272
- autosuggest = _this$$props2.autosuggest;
19293
+ size = _this$$props2.size;
19273
19294
  if (value !== undefined) {
19274
19295
  this.isPending = true;
19275
19296
  }
19276
19297
  // if a suggestion was selected, delegate the handling to suggestion handler
19277
19298
  if (event.key === 'Enter' && (highlightedIndex === null || highlightedIndex < 0 || highlightedIndex === [].concat([].concat(this.suggestionsList).slice(0, size || 10), this.defaultSearchSuggestions, this.topSuggestions).length)) {
19278
19299
  this.isPending = false;
19279
- this.setValue(this.$options.isTagsMode && autosuggest && strictSelection ? '' : targetValue, true, this.$props, undefined, false);
19280
- this.onValueSelectedHandler(targetValue, lib_7.ENTER_PRESS);
19300
+ if (!this.isSuggestionSelected) {
19301
+ this.setValue(targetValue, true, this.$props, undefined, false);
19302
+ this.onValueSelectedHandler(targetValue, lib_7.ENTER_PRESS);
19303
+ }
19281
19304
  }
19282
19305
  // Need to review
19283
19306
  this.$emit('keyDown', event, this.triggerQuery);
@@ -19313,11 +19336,16 @@
19313
19336
  }
19314
19337
  },
19315
19338
  onSuggestionSelected: function onSuggestionSelected(suggestion) {
19339
+ var _this3 = this;
19316
19340
  var value = this.$props.value;
19317
19341
  // Record analytics for selected suggestions
19318
19342
  this.triggerClickAnalytics(suggestion._click_id);
19319
19343
  if (value === undefined) {
19320
19344
  this.setValue(suggestion.value, true, this.$props, lib_7.SUGGESTION_SELECT);
19345
+ this.isSuggestionSelected = true;
19346
+ setTimeout(function () {
19347
+ _this3.isSuggestionSelected = false;
19348
+ }, 50);
19321
19349
  } else if (this.$options.isTagsMode) {
19322
19350
  var emitValue = Array.isArray(this.selectedTags) ? [].concat(this.selectedTags) : [];
19323
19351
  if (this.selectedTags.includes(suggestion.value)) {
@@ -19423,7 +19451,7 @@
19423
19451
  return null;
19424
19452
  },
19425
19453
  renderTag: function renderTag(item) {
19426
- var _this3 = this;
19454
+ var _this4 = this;
19427
19455
  var h = this.$createElement;
19428
19456
  var innerClass = this.$props.innerClass;
19429
19457
  return h(TagItem, {
@@ -19436,7 +19464,7 @@
19436
19464
  "class": "close-icon",
19437
19465
  "on": {
19438
19466
  "click": function click() {
19439
- return _this3.clearTag(item);
19467
+ return _this4.clearTag(item);
19440
19468
  }
19441
19469
  }
19442
19470
  }, [h(CancelSvg)])]);
@@ -19458,7 +19486,7 @@
19458
19486
  }
19459
19487
  },
19460
19488
  renderTags: function renderTags() {
19461
- var _this4 = this;
19489
+ var _this5 = this;
19462
19490
  var h = this.$createElement;
19463
19491
  if (!Array.isArray(this.selectedTags)) {
19464
19492
  return null;
@@ -19471,7 +19499,7 @@
19471
19499
  handleClear: this.clearTag,
19472
19500
  handleClearAll: this.clearAllTags
19473
19501
  }) : h(TagsContainer, [tagsList.map(function (item) {
19474
- return _this4.renderTag(item);
19502
+ return _this5.renderTag(item);
19475
19503
  }), shouldRenderClearAllTag && h(TagItem, {
19476
19504
  "class": getClassName$3(this.$props.innerClass, 'selected-tag') || ''
19477
19505
  }, [h("span", ["Clear All"]), h("span", {
@@ -19550,7 +19578,7 @@
19550
19578
  (_this$$refs = this.$refs) == null || (_this$$refs = _this$$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs.focus(); // eslint-disable-line
19551
19579
  },
19552
19580
  listenForFocusShortcuts: function listenForFocusShortcuts() {
19553
- var _this5 = this;
19581
+ var _this6 = this;
19554
19582
  var _this$$props$focusSho = this.$props.focusShortcuts,
19555
19583
  focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
19556
19584
  if (isEmpty(focusShortcuts)) {
@@ -19565,7 +19593,7 @@
19565
19593
  function (event, handler) {
19566
19594
  // Prevent the default refresh event under WINDOWS system
19567
19595
  event.preventDefault();
19568
- _this5.focusSearchBox(event);
19596
+ _this6.focusSearchBox(event);
19569
19597
  });
19570
19598
 
19571
19599
  // if one of modifier keys are used, they are handled below
@@ -19575,7 +19603,7 @@
19575
19603
  for (var index = 0; index < modifierKeys.length; index += 1) {
19576
19604
  var element = modifierKeys[index];
19577
19605
  if (hotkeys[element]) {
19578
- _this5.focusSearchBox(event);
19606
+ _this6.focusSearchBox(event);
19579
19607
  break;
19580
19608
  }
19581
19609
  }
@@ -19583,7 +19611,7 @@
19583
19611
  }
19584
19612
  },
19585
19613
  render: function render() {
19586
- var _this6 = this;
19614
+ var _this7 = this;
19587
19615
  var h = arguments[0];
19588
19616
  var _this$$props6 = this.$props,
19589
19617
  theme = _this$$props6.theme,
@@ -19618,14 +19646,14 @@
19618
19646
  highlightedIndex = _ref4.highlightedIndex,
19619
19647
  setHighlightedIndex = _ref4.setHighlightedIndex;
19620
19648
  var renderSuggestionsContainer = function renderSuggestionsContainer() {
19621
- return h("div", [_this6.hasCustomRenderer && _this6.getComponent({
19649
+ return h("div", [_this7.hasCustomRenderer && _this7.getComponent({
19622
19650
  isOpen: isOpen,
19623
19651
  getItemProps: getItemProps,
19624
19652
  getItemEvents: getItemEvents,
19625
19653
  highlightedIndex: highlightedIndex
19626
- }), _this6.renderErrorComponent(), !_this6.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
19627
- "class": suggestions$1(_this6.themePreset, theme) + " " + getClassName$3(_this6.$props.innerClass, 'list')
19628
- }, [_this6.suggestionsList.slice(0, size || 10).map(function (item, index) {
19654
+ }), _this7.renderErrorComponent(), !_this7.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
19655
+ "class": suggestions$1(_this7.themePreset, theme) + " " + getClassName$3(_this7.$props.innerClass, 'list')
19656
+ }, [_this7.suggestionsList.slice(0, size || 10).map(function (item, index) {
19629
19657
  return h("li", {
19630
19658
  "domProps": _extends({}, getItemProps({
19631
19659
  item: item
@@ -19635,15 +19663,15 @@
19635
19663
  })),
19636
19664
  "key": index + 1 + "-" + item.value,
19637
19665
  "style": {
19638
- backgroundColor: _this6.getBackgroundColor(highlightedIndex, index)
19666
+ backgroundColor: _this7.getBackgroundColor(highlightedIndex, index)
19639
19667
  }
19640
19668
  }, [h(SuggestionItem, {
19641
19669
  "attrs": {
19642
- "currentValue": _this6.currentValue,
19670
+ "currentValue": _this7.currentValue,
19643
19671
  "suggestion": item
19644
19672
  }
19645
19673
  })]);
19646
- }), _this6.defaultSearchSuggestions.map(function (sugg, index) {
19674
+ }), _this7.defaultSearchSuggestions.map(function (sugg, index) {
19647
19675
  return h("li", {
19648
19676
  "domProps": _extends({}, getItemProps({
19649
19677
  item: sugg
@@ -19651,9 +19679,9 @@
19651
19679
  "on": _extends({}, getItemEvents({
19652
19680
  item: sugg
19653
19681
  })),
19654
- "key": _this6.suggestionsList.length + index + 1 + "-" + sugg.value,
19682
+ "key": _this7.suggestionsList.length + index + 1 + "-" + sugg.value,
19655
19683
  "style": {
19656
- backgroundColor: _this6.getBackgroundColor(highlightedIndex, _this6.suggestionsList.length + index),
19684
+ backgroundColor: _this7.getBackgroundColor(highlightedIndex, _this7.suggestionsList.length + index),
19657
19685
  justifyContent: 'flex-start'
19658
19686
  }
19659
19687
  }, [h("div", {
@@ -19662,28 +19690,28 @@
19662
19690
  }
19663
19691
  }, [sugg.source && sugg.source._recent_search && h(CustomSvg, {
19664
19692
  "attrs": {
19665
- "className": getClassName$3(_this6.$props.innerClass, 'recent-search-icon') || null,
19693
+ "className": getClassName$3(_this7.$props.innerClass, 'recent-search-icon') || null,
19666
19694
  "icon": recentSearchesIcon,
19667
19695
  "type": "recent-search-icon"
19668
19696
  }
19669
19697
  }), sugg.source && sugg.source._popular_suggestion && h(CustomSvg, {
19670
19698
  "attrs": {
19671
- "className": getClassName$3(_this6.$props.innerClass, 'popular-search-icon') || null,
19699
+ "className": getClassName$3(_this7.$props.innerClass, 'popular-search-icon') || null,
19672
19700
  "icon": popularSearchesIcon,
19673
19701
  "type": "popular-search-icon"
19674
19702
  }
19675
19703
  })]), h(SuggestionItem, {
19676
19704
  "attrs": {
19677
- "currentValue": _this6.currentValue,
19705
+ "currentValue": _this7.currentValue,
19678
19706
  "suggestion": sugg
19679
19707
  }
19680
19708
  })]);
19681
- }), hasQuerySuggestionsRenderer(_this6) ? _this6.getComponent({
19709
+ }), hasQuerySuggestionsRenderer(_this7) ? _this7.getComponent({
19682
19710
  isOpen: isOpen,
19683
19711
  getItemProps: getItemProps,
19684
19712
  getItemEvents: getItemEvents,
19685
19713
  highlightedIndex: highlightedIndex
19686
- }, true) : _this6.topSuggestions.map(function (sugg, index) {
19714
+ }, true) : _this7.topSuggestions.map(function (sugg, index) {
19687
19715
  return h("li", {
19688
19716
  "domProps": _extends({}, getItemProps({
19689
19717
  item: sugg
@@ -19691,9 +19719,9 @@
19691
19719
  "on": _extends({}, getItemEvents({
19692
19720
  item: sugg
19693
19721
  })),
19694
- "key": _this6.suggestionsList.length + index + 1 + "-" + sugg.value,
19722
+ "key": _this7.suggestionsList.length + index + 1 + "-" + sugg.value,
19695
19723
  "style": {
19696
- backgroundColor: _this6.getBackgroundColor(highlightedIndex, _this6.suggestionsList.length + index),
19724
+ backgroundColor: _this7.getBackgroundColor(highlightedIndex, _this7.suggestionsList.length + index),
19697
19725
  justifyContent: 'flex-start'
19698
19726
  }
19699
19727
  }, [h("div", {
@@ -19702,58 +19730,58 @@
19702
19730
  }
19703
19731
  }, [h(CustomSvg, {
19704
19732
  "attrs": {
19705
- "className": getClassName$3(_this6.$props.innerClass, 'popular-search-icon') || null,
19733
+ "className": getClassName$3(_this7.$props.innerClass, 'popular-search-icon') || null,
19706
19734
  "icon": popularSearchesIcon,
19707
19735
  "type": "popular-search-icon"
19708
19736
  }
19709
19737
  })]), h(SuggestionItem, {
19710
19738
  "attrs": {
19711
- "currentValue": _this6.currentValue,
19739
+ "currentValue": _this7.currentValue,
19712
19740
  "suggestion": sugg
19713
19741
  }
19714
19742
  })]);
19715
- })]) : _this6.renderNoSuggestions(_this6.suggestionsList)]);
19743
+ })]) : _this7.renderNoSuggestions(_this7.suggestionsList)]);
19716
19744
  };
19717
19745
  return h("div", {
19718
19746
  "class": suggestionsContainer
19719
- }, [h(InputGroup, [_this6.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
19747
+ }, [h(InputGroup, [_this7.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
19720
19748
  "attrs": {
19721
- "id": _this6.$props.componentId + "-input",
19722
- "showIcon": _this6.$props.showIcon,
19723
- "showClear": _this6.$props.showClear,
19724
- "iconPosition": _this6.$props.iconPosition,
19725
- "placeholder": _this6.$props.placeholder,
19726
- "autoFocus": _this6.$props.autoFocus,
19727
- "themePreset": _this6.themePreset,
19749
+ "id": _this7.$props.componentId + "-input",
19750
+ "showIcon": _this7.$props.showIcon,
19751
+ "showClear": _this7.$props.showClear,
19752
+ "iconPosition": _this7.$props.iconPosition,
19753
+ "placeholder": _this7.$props.placeholder,
19754
+ "autoFocus": _this7.$props.autoFocus,
19755
+ "themePreset": _this7.themePreset,
19728
19756
  "autocomplete": "off"
19729
19757
  },
19730
- "ref": _this6.$props.innerRef,
19731
- "class": getClassName$3(_this6.$props.innerClass, 'input'),
19758
+ "ref": _this7.$props.innerRef,
19759
+ "class": getClassName$3(_this7.$props.innerClass, 'input'),
19732
19760
  "on": _extends({}, getInputEvents({
19733
- onInput: _this6.onInputChange,
19761
+ onInput: _this7.onInputChange,
19734
19762
  onBlur: function onBlur(e) {
19735
- _this6.$emit('blur', e, _this6.triggerQuery);
19763
+ _this7.$emit('blur', e, _this7.triggerQuery);
19736
19764
  },
19737
- onFocus: _this6.handleFocus,
19765
+ onFocus: _this7.handleFocus,
19738
19766
  onKeyPress: function onKeyPress(e) {
19739
- _this6.$emit('keyPress', e, _this6.triggerQuery);
19740
- _this6.$emit('key-press', e, _this6.triggerQuery);
19767
+ _this7.$emit('keyPress', e, _this7.triggerQuery);
19768
+ _this7.$emit('key-press', e, _this7.triggerQuery);
19741
19769
  },
19742
19770
  onKeyDown: function onKeyDown(e) {
19743
- return _this6.handleKeyDown(e, highlightedIndex);
19771
+ return _this7.handleKeyDown(e, highlightedIndex);
19744
19772
  },
19745
19773
  onKeyUp: function onKeyUp(e) {
19746
- _this6.$emit('keyUp', e, _this6.triggerQuery);
19747
- _this6.$emit('key-up', e, _this6.triggerQuery);
19774
+ _this7.$emit('keyUp', e, _this7.triggerQuery);
19775
+ _this7.$emit('key-up', e, _this7.triggerQuery);
19748
19776
  },
19749
19777
  onClick: function onClick() {
19750
19778
  setHighlightedIndex(null);
19751
19779
  }
19752
19780
  })),
19753
19781
  "domProps": _extends({}, getInputProps({
19754
- value: _this6.$data.currentValue === null || typeof _this6.$data.currentValue !== 'string' ? '' : _this6.$data.currentValue
19782
+ value: _this7.$data.currentValue === null || typeof _this7.$data.currentValue !== 'string' ? '' : _this7.$data.currentValue
19755
19783
  }))
19756
- }), _this6.renderIcons(), !expandSuggestionsContainer && renderSuggestionsContainer()]), ' ', _this6.renderInputAddonAfter()]), expandSuggestionsContainer && renderSuggestionsContainer(), _this6.renderTags()]);
19784
+ }), _this7.renderIcons(), !expandSuggestionsContainer && renderSuggestionsContainer()]), ' ', _this7.renderInputAddonAfter()]), expandSuggestionsContainer && renderSuggestionsContainer(), _this7.renderTags()]);
19757
19785
  }
19758
19786
  }
19759
19787
  }) : h("div", {
@@ -19769,22 +19797,22 @@
19769
19797
  },
19770
19798
  "on": _extends({}, {
19771
19799
  blur: function blur(e) {
19772
- _this6.$emit('blur', e, _this6.triggerQuery);
19800
+ _this7.$emit('blur', e, _this7.triggerQuery);
19773
19801
  },
19774
19802
  keypress: function keypress(e) {
19775
- _this6.$emit('keyPress', e, _this6.triggerQuery);
19776
- _this6.$emit('key-press', e, _this6.triggerQuery);
19803
+ _this7.$emit('keyPress', e, _this7.triggerQuery);
19804
+ _this7.$emit('key-press', e, _this7.triggerQuery);
19777
19805
  },
19778
19806
  input: this.onInputChange,
19779
19807
  focus: function focus(e) {
19780
- _this6.$emit('focus', e, _this6.triggerQuery);
19808
+ _this7.$emit('focus', e, _this7.triggerQuery);
19781
19809
  },
19782
19810
  keydown: function keydown(e) {
19783
- _this6.handleKeyDown(e, null);
19811
+ _this7.handleKeyDown(e, null);
19784
19812
  },
19785
19813
  keyup: function keyup(e) {
19786
- _this6.$emit('keyUp', e, _this6.triggerQuery);
19787
- _this6.$emit('key-up', e, _this6.triggerQuery);
19814
+ _this7.$emit('keyUp', e, _this7.triggerQuery);
19815
+ _this7.$emit('key-up', e, _this7.triggerQuery);
19788
19816
  }
19789
19817
  }),
19790
19818
  "domProps": _extends({}, {
@@ -34959,7 +34987,7 @@
34959
34987
  });
34960
34988
  }
34961
34989
 
34962
- var version = "1.36.2";
34990
+ var version = "1.36.3";
34963
34991
 
34964
34992
  var components$1 = [RLConnected, ResultCard, ResultList, ReactiveBase, DSConnected, SBConnected, ListConnected, ListConnected$1, RangeConnected$1, RangeConnected$2, RangeConnected$3, RangeConnected, RcConnected, RcConnected$1, RcConnected$2, TBConnected, ListConnected$2, ListConnected$3, StateProviderConnected, RangeConnected$4];
34965
34993
  function install (Vue) {