@appbaseio/reactivesearch-vue 1.36.2 → 1.36.4

package/dist/@appbaseio/reactivesearch-vue.umd.js

@@ -18718,7 +18718,8 @@
 	      selectedTags: [],
 	      isOpen: false,
 	      normalizedSuggestions: [],
-	      isPending: false
+	      isPending: false,
+	      isSuggestionSelected: false
 	    };
 	    this.internalComponent = props.componentId + "__internal";
 	    return this.__state;
@@ -19096,13 +19097,13 @@
 	        if (isTagsMode && isEqual$4(value, _this.selectedTags)) {
 	          return;
 	        }
-	        // Refresh recent searches when value becomes empty
 	        if (!value && props.enableDefaultSuggestions === false) {
 	          _this.resetStoreForComponent(props.componentId);
 	        } else if (!value && _this.currentValue && _this.enableRecentSearches) {
 	          _this.getRecentSearches();
 	        }
 	        if (isTagsMode) {
+	          var isTagAdded = false;
 	          if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
 	            // check if value already present in selectedTags
 	            if (typeof value === 'string' && _this.selectedTags.includes(value)) {
@@ -19111,14 +19112,36 @@
 	            }
 	            _this.selectedTags = [].concat(_this.selectedTags);
 	            if (typeof value === 'string' && !!value) {
-	              _this.selectedTags.push(value);
+	              if (props.strictSelection && cause === lib_7.SUGGESTION_SELECT) {
+	                _this.selectedTags.push(value);
+	                isTagAdded = true;
+	              } else if (!props.strictSelection) {
+	                _this.selectedTags.push(value);
+	                isTagAdded = true;
+	              }
 	            } else if (Array.isArray(value) && !isEqual$4(_this.selectedTags, value)) {
-	              _this.selectedTags = value;
+	              if (props.strictSelection && cause === lib_7.SUGGESTION_SELECT) {
+	                _this.selectedTags = value;
+	                isTagAdded = true;
+	              } else if (!props.strictSelection) {
+	                _this.selectedTags.push(value);
+	                isTagAdded = true;
+	              }
 	            }
 	          } else if (value) {
-	            _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
+	            if (props.strictSelection && cause === lib_7.SUGGESTION_SELECT) {
+	              _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
+	              isTagAdded = true;
+	            } else if (!props.strictSelection) {
+	              _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
+	              isTagAdded = true;
+	            }
+	          }
+	          if (props.strictSelection && !isTagAdded) {
+	            _this.currentValue = value;
+	          } else {
+	            _this.currentValue = '';
 	          }
-	          _this.currentValue = '';
 	        } else {
 	          _this.currentValue = value;
 	        }
@@ -19138,7 +19161,7 @@
 	          if (props.strictSelection && props.autosuggest) {
 	            if (cause === lib_7.SUGGESTION_SELECT || props.value !== undefined) {
 	              _this.updateQueryHandler(props.componentId, queryHandlerValue, props);
-	            } else if (_this.currentValue !== '') {
+	            } else if (_this.currentValue !== '' && !props.strictSelection) {
 	              _this.setValue('', true);
 	            }
 	          } else {
@@ -19168,11 +19191,6 @@
 	      if (props === void 0) {
 	        props = this.$props;
 	      }
-	      if (!value && props.enableDefaultSuggestions === false) {
-	        // clear Component data from store
-	        this.resetStoreForComponent(props.componentId);
-	        return;
-	      }
 	      var defaultQueryOptions;
 	      var query = DataSearch.defaultQuery(value, props);
 	      if (this.defaultQuery) {
@@ -19185,13 +19203,18 @@
 	        // Update calculated default query in store
 	        updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
 	      }
-	      this.setQueryOptions(this.internalComponent, _extends({}, this.queryOptions, defaultQueryOptions), execute);
-	      this.updateQuery({
-	        componentId: this.internalComponent,
-	        query: query,
-	        value: value,
-	        componentType: constants_1$1.dataSearch
-	      }, execute);
+	      if (!value && props.enableDefaultSuggestions === false) {
+	        // clear Component data from store
+	        this.resetStoreForComponent(props.componentId);
+	      } else {
+	        this.setQueryOptions(this.internalComponent, _extends({}, this.queryOptions, defaultQueryOptions), execute);
+	        this.updateQuery({
+	          componentId: this.internalComponent,
+	          query: query,
+	          value: value,
+	          componentType: constants_1$1.dataSearch
+	        }, execute);
+	      }
 	    },
 	    updateQueryHandler: function updateQueryHandler(componentId, value, props) {
 	      var customQuery = props.customQuery,
@@ -19260,24 +19283,27 @@
 	    },
 	    clearValue: function clearValue() {
 	      this.isPending = false;
-	      this.setValue('', true);
+	      if (!this.$props.enableDefaultSuggestions) {
+	        this.isOpen = false;
+	      }
+	      this.setValue('', false);
 	      this.onValueSelectedHandler('', lib_7.CLEAR_VALUE);
 	    },
 	    handleKeyDown: function handleKeyDown(event, highlightedIndex) {
 	      var targetValue = event.target.value;
 	      var _this$$props2 = this.$props,
 	        value = _this$$props2.value,
-	        strictSelection = _this$$props2.strictSelection,
-	        size = _this$$props2.size,
-	        autosuggest = _this$$props2.autosuggest;
+	        size = _this$$props2.size;
 	      if (value !== undefined) {
 	        this.isPending = true;
 	      }
 	      // if a suggestion was selected, delegate the handling to suggestion handler
 	      if (event.key === 'Enter' && (highlightedIndex === null || highlightedIndex < 0 || highlightedIndex === [].concat([].concat(this.suggestionsList).slice(0, size || 10), this.defaultSearchSuggestions, this.topSuggestions).length)) {
 	        this.isPending = false;
-	        this.setValue(this.$options.isTagsMode && autosuggest && strictSelection ? '' : targetValue, true, this.$props, undefined, false);
-	        this.onValueSelectedHandler(targetValue, lib_7.ENTER_PRESS);
+	        if (!this.isSuggestionSelected) {
+	          this.setValue(targetValue, true, this.$props, undefined, false);
+	          this.onValueSelectedHandler(targetValue, lib_7.ENTER_PRESS);
+	        }
 	      }
 	      // Need to review
 	      this.$emit('keyDown', event, this.triggerQuery);
@@ -19313,11 +19339,16 @@
 	      }
 	    },
 	    onSuggestionSelected: function onSuggestionSelected(suggestion) {
+	      var _this3 = this;
 	      var value = this.$props.value;
 	      // Record analytics for selected suggestions
 	      this.triggerClickAnalytics(suggestion._click_id);
 	      if (value === undefined) {
 	        this.setValue(suggestion.value, true, this.$props, lib_7.SUGGESTION_SELECT);
+	        this.isSuggestionSelected = true;
+	        setTimeout(function () {
+	          _this3.isSuggestionSelected = false;
+	        }, 50);
 	      } else if (this.$options.isTagsMode) {
 	        var emitValue = Array.isArray(this.selectedTags) ? [].concat(this.selectedTags) : [];
 	        if (this.selectedTags.includes(suggestion.value)) {
@@ -19423,7 +19454,7 @@
 	      return null;
 	    },
 	    renderTag: function renderTag(item) {
-	      var _this3 = this;
+	      var _this4 = this;
 	      var h = this.$createElement;
 	      var innerClass = this.$props.innerClass;
 	      return h(TagItem, {
@@ -19436,7 +19467,7 @@
 	        "class": "close-icon",
 	        "on": {
 	          "click": function click() {
-	            return _this3.clearTag(item);
+	            return _this4.clearTag(item);
 	          }
 	        }
 	      }, [h(CancelSvg)])]);
@@ -19458,7 +19489,7 @@
 	      }
 	    },
 	    renderTags: function renderTags() {
-	      var _this4 = this;
+	      var _this5 = this;
 	      var h = this.$createElement;
 	      if (!Array.isArray(this.selectedTags)) {
 	        return null;
@@ -19471,7 +19502,7 @@
 	        handleClear: this.clearTag,
 	        handleClearAll: this.clearAllTags
 	      }) : h(TagsContainer, [tagsList.map(function (item) {
-	        return _this4.renderTag(item);
+	        return _this5.renderTag(item);
 	      }), shouldRenderClearAllTag && h(TagItem, {
 	        "class": getClassName$3(this.$props.innerClass, 'selected-tag') || ''
 	      }, [h("span", ["Clear All"]), h("span", {
@@ -19550,7 +19581,7 @@
 	      (_this$$refs = this.$refs) == null || (_this$$refs = _this$$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs.focus(); // eslint-disable-line
 	    },
 	    listenForFocusShortcuts: function listenForFocusShortcuts() {
-	      var _this5 = this;
+	      var _this6 = this;
 	      var _this$$props$focusSho = this.$props.focusShortcuts,
 	        focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
 	      if (isEmpty(focusShortcuts)) {
@@ -19565,7 +19596,7 @@
 	      function (event, handler) {
 	        // Prevent the default refresh event under WINDOWS system
 	        event.preventDefault();
-	        _this5.focusSearchBox(event);
+	        _this6.focusSearchBox(event);
 	      });
 
 	      // if one of modifier keys are used, they are handled below
@@ -19575,7 +19606,7 @@
 	        for (var index = 0; index < modifierKeys.length; index += 1) {
 	          var element = modifierKeys[index];
 	          if (hotkeys[element]) {
-	            _this5.focusSearchBox(event);
+	            _this6.focusSearchBox(event);
 	            break;
 	          }
 	        }
@@ -19583,7 +19614,7 @@
 	    }
 	  },
 	  render: function render() {
-	    var _this6 = this;
+	    var _this7 = this;
 	    var h = arguments[0];
 	    var _this$$props6 = this.$props,
 	      theme = _this$$props6.theme,
@@ -19618,14 +19649,14 @@
 	            highlightedIndex = _ref4.highlightedIndex,
 	            setHighlightedIndex = _ref4.setHighlightedIndex;
 	          var renderSuggestionsContainer = function renderSuggestionsContainer() {
-	            return h("div", [_this6.hasCustomRenderer && _this6.getComponent({
+	            return h("div", [_this7.hasCustomRenderer && _this7.getComponent({
 	              isOpen: isOpen,
 	              getItemProps: getItemProps,
 	              getItemEvents: getItemEvents,
 	              highlightedIndex: highlightedIndex
-	            }), _this6.renderErrorComponent(), !_this6.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
-	              "class": suggestions$1(_this6.themePreset, theme) + " " + getClassName$3(_this6.$props.innerClass, 'list')
-	            }, [_this6.suggestionsList.slice(0, size || 10).map(function (item, index) {
+	            }), _this7.renderErrorComponent(), !_this7.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
+	              "class": suggestions$1(_this7.themePreset, theme) + " " + getClassName$3(_this7.$props.innerClass, 'list')
+	            }, [_this7.suggestionsList.slice(0, size || 10).map(function (item, index) {
 	              return h("li", {
 	                "domProps": _extends({}, getItemProps({
 	                  item: item
@@ -19635,15 +19666,15 @@
 	                })),
 	                "key": index + 1 + "-" + item.value,
 	                "style": {
-	                  backgroundColor: _this6.getBackgroundColor(highlightedIndex, index)
+	                  backgroundColor: _this7.getBackgroundColor(highlightedIndex, index)
 	                }
 	              }, [h(SuggestionItem, {
 	                "attrs": {
-	                  "currentValue": _this6.currentValue,
+	                  "currentValue": _this7.currentValue,
 	                  "suggestion": item
 	                }
 	              })]);
-	            }), _this6.defaultSearchSuggestions.map(function (sugg, index) {
+	            }), _this7.defaultSearchSuggestions.map(function (sugg, index) {
 	              return h("li", {
 	                "domProps": _extends({}, getItemProps({
 	                  item: sugg
@@ -19651,9 +19682,9 @@
 	                "on": _extends({}, getItemEvents({
 	                  item: sugg
 	                })),
-	                "key": _this6.suggestionsList.length + index + 1 + "-" + sugg.value,
+	                "key": _this7.suggestionsList.length + index + 1 + "-" + sugg.value,
 	                "style": {
-	                  backgroundColor: _this6.getBackgroundColor(highlightedIndex, _this6.suggestionsList.length + index),
+	                  backgroundColor: _this7.getBackgroundColor(highlightedIndex, _this7.suggestionsList.length + index),
 	                  justifyContent: 'flex-start'
 	                }
 	              }, [h("div", {
@@ -19662,28 +19693,28 @@
 	                }
 	              }, [sugg.source && sugg.source._recent_search && h(CustomSvg, {
 	                "attrs": {
-	                  "className": getClassName$3(_this6.$props.innerClass, 'recent-search-icon') || null,
+	                  "className": getClassName$3(_this7.$props.innerClass, 'recent-search-icon') || null,
 	                  "icon": recentSearchesIcon,
 	                  "type": "recent-search-icon"
 	                }
 	              }), sugg.source && sugg.source._popular_suggestion && h(CustomSvg, {
 	                "attrs": {
-	                  "className": getClassName$3(_this6.$props.innerClass, 'popular-search-icon') || null,
+	                  "className": getClassName$3(_this7.$props.innerClass, 'popular-search-icon') || null,
 	                  "icon": popularSearchesIcon,
 	                  "type": "popular-search-icon"
 	                }
 	              })]), h(SuggestionItem, {
 	                "attrs": {
-	                  "currentValue": _this6.currentValue,
+	                  "currentValue": _this7.currentValue,
 	                  "suggestion": sugg
 	                }
 	              })]);
-	            }), hasQuerySuggestionsRenderer(_this6) ? _this6.getComponent({
+	            }), hasQuerySuggestionsRenderer(_this7) ? _this7.getComponent({
 	              isOpen: isOpen,
 	              getItemProps: getItemProps,
 	              getItemEvents: getItemEvents,
 	              highlightedIndex: highlightedIndex
-	            }, true) : _this6.topSuggestions.map(function (sugg, index) {
+	            }, true) : _this7.topSuggestions.map(function (sugg, index) {
 	              return h("li", {
 	                "domProps": _extends({}, getItemProps({
 	                  item: sugg
@@ -19691,9 +19722,9 @@
 	                "on": _extends({}, getItemEvents({
 	                  item: sugg
 	                })),
-	                "key": _this6.suggestionsList.length + index + 1 + "-" + sugg.value,
+	                "key": _this7.suggestionsList.length + index + 1 + "-" + sugg.value,
 	                "style": {
-	                  backgroundColor: _this6.getBackgroundColor(highlightedIndex, _this6.suggestionsList.length + index),
+	                  backgroundColor: _this7.getBackgroundColor(highlightedIndex, _this7.suggestionsList.length + index),
 	                  justifyContent: 'flex-start'
 	                }
 	              }, [h("div", {
@@ -19702,58 +19733,58 @@
 	                }
 	              }, [h(CustomSvg, {
 	                "attrs": {
-	                  "className": getClassName$3(_this6.$props.innerClass, 'popular-search-icon') || null,
+	                  "className": getClassName$3(_this7.$props.innerClass, 'popular-search-icon') || null,
 	                  "icon": popularSearchesIcon,
 	                  "type": "popular-search-icon"
 	                }
 	              })]), h(SuggestionItem, {
 	                "attrs": {
-	                  "currentValue": _this6.currentValue,
+	                  "currentValue": _this7.currentValue,
 	                  "suggestion": sugg
 	                }
 	              })]);
-	            })]) : _this6.renderNoSuggestions(_this6.suggestionsList)]);
+	            })]) : _this7.renderNoSuggestions(_this7.suggestionsList)]);
 	          };
 	          return h("div", {
 	            "class": suggestionsContainer
-	          }, [h(InputGroup, [_this6.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
+	          }, [h(InputGroup, [_this7.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
 	            "attrs": {
-	              "id": _this6.$props.componentId + "-input",
-	              "showIcon": _this6.$props.showIcon,
-	              "showClear": _this6.$props.showClear,
-	              "iconPosition": _this6.$props.iconPosition,
-	              "placeholder": _this6.$props.placeholder,
-	              "autoFocus": _this6.$props.autoFocus,
-	              "themePreset": _this6.themePreset,
+	              "id": _this7.$props.componentId + "-input",
+	              "showIcon": _this7.$props.showIcon,
+	              "showClear": _this7.$props.showClear,
+	              "iconPosition": _this7.$props.iconPosition,
+	              "placeholder": _this7.$props.placeholder,
+	              "autoFocus": _this7.$props.autoFocus,
+	              "themePreset": _this7.themePreset,
 	              "autocomplete": "off"
 	            },
-	            "ref": _this6.$props.innerRef,
-	            "class": getClassName$3(_this6.$props.innerClass, 'input'),
+	            "ref": _this7.$props.innerRef,
+	            "class": getClassName$3(_this7.$props.innerClass, 'input'),
 	            "on": _extends({}, getInputEvents({
-	              onInput: _this6.onInputChange,
+	              onInput: _this7.onInputChange,
 	              onBlur: function onBlur(e) {
-	                _this6.$emit('blur', e, _this6.triggerQuery);
+	                _this7.$emit('blur', e, _this7.triggerQuery);
 	              },
-	              onFocus: _this6.handleFocus,
+	              onFocus: _this7.handleFocus,
 	              onKeyPress: function onKeyPress(e) {
-	                _this6.$emit('keyPress', e, _this6.triggerQuery);
-	                _this6.$emit('key-press', e, _this6.triggerQuery);
+	                _this7.$emit('keyPress', e, _this7.triggerQuery);
+	                _this7.$emit('key-press', e, _this7.triggerQuery);
 	              },
 	              onKeyDown: function onKeyDown(e) {
-	                return _this6.handleKeyDown(e, highlightedIndex);
+	                return _this7.handleKeyDown(e, highlightedIndex);
 	              },
 	              onKeyUp: function onKeyUp(e) {
-	                _this6.$emit('keyUp', e, _this6.triggerQuery);
-	                _this6.$emit('key-up', e, _this6.triggerQuery);
+	                _this7.$emit('keyUp', e, _this7.triggerQuery);
+	                _this7.$emit('key-up', e, _this7.triggerQuery);
 	              },
 	              onClick: function onClick() {
 	                setHighlightedIndex(null);
 	              }
 	            })),
 	            "domProps": _extends({}, getInputProps({
-	              value: _this6.$data.currentValue === null || typeof _this6.$data.currentValue !== 'string' ? '' : _this6.$data.currentValue
+	              value: _this7.$data.currentValue === null || typeof _this7.$data.currentValue !== 'string' ? '' : _this7.$data.currentValue
 	            }))
-	          }), _this6.renderIcons(), !expandSuggestionsContainer && renderSuggestionsContainer()]), ' ', _this6.renderInputAddonAfter()]), expandSuggestionsContainer && renderSuggestionsContainer(), _this6.renderTags()]);
+	          }), _this7.renderIcons(), !expandSuggestionsContainer && renderSuggestionsContainer()]), ' ', _this7.renderInputAddonAfter()]), expandSuggestionsContainer && renderSuggestionsContainer(), _this7.renderTags()]);
 	        }
 	      }
 	    }) : h("div", {
@@ -19769,22 +19800,22 @@
 	      },
 	      "on": _extends({}, {
 	        blur: function blur(e) {
-	          _this6.$emit('blur', e, _this6.triggerQuery);
+	          _this7.$emit('blur', e, _this7.triggerQuery);
 	        },
 	        keypress: function keypress(e) {
-	          _this6.$emit('keyPress', e, _this6.triggerQuery);
-	          _this6.$emit('key-press', e, _this6.triggerQuery);
+	          _this7.$emit('keyPress', e, _this7.triggerQuery);
+	          _this7.$emit('key-press', e, _this7.triggerQuery);
 	        },
 	        input: this.onInputChange,
 	        focus: function focus(e) {
-	          _this6.$emit('focus', e, _this6.triggerQuery);
+	          _this7.$emit('focus', e, _this7.triggerQuery);
 	        },
 	        keydown: function keydown(e) {
-	          _this6.handleKeyDown(e, null);
+	          _this7.handleKeyDown(e, null);
 	        },
 	        keyup: function keyup(e) {
-	          _this6.$emit('keyUp', e, _this6.triggerQuery);
-	          _this6.$emit('key-up', e, _this6.triggerQuery);
+	          _this7.$emit('keyUp', e, _this7.triggerQuery);
+	          _this7.$emit('key-up', e, _this7.triggerQuery);
 	        }
 	      }),
 	      "domProps": _extends({}, {
@@ -34959,7 +34990,7 @@
 	  });
 	}
 
-	var version = "1.36.2";
+	var version = "1.36.4";
 
 	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];
 	function install (Vue) {