@appbaseio/reactivesearch-vue 1.36.6 → 1.36.7

package/dist/es/{ReactiveComponentPrivate-a774148b.js → ReactiveComponentPrivate-ebe9a60a.js}

@@ -77,7 +77,8 @@ var SearchBox = {
       currentValue: '',
       selectedTags: [],
       isOpen: false,
-      normalizedSuggestions: []
+      normalizedSuggestions: [],
+      isSuggestionSelected: false
     };
     this.internalComponent = props.componentId + "__internal";
     return this.__state;
@@ -277,7 +278,9 @@ var SearchBox = {
         if (this.$options.isTagsMode) {
           cause = causes.SUGGESTION_SELECT;
         }
-        this.setValue(newVal || '', true, this.$props, cause);
+        if (!this.isSuggestionSelected) {
+          this.setValue(newVal || '', true, this.$props, cause);
+        }
       }
     },
     focusShortcuts: function focusShortcuts() {
@@ -406,10 +409,11 @@ var SearchBox = {
         categoryValue = undefined;
       }
       var performUpdate = function performUpdate() {
+        var isTagAdded = false;
         if (_this.$options.isTagsMode && isEqual(value, _this.selectedTags)) {
           return;
         }
-        if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
+        if (_this.$options.isTagsMode) {
           if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
             // check if value already present in selectedTags
             if (typeof value === 'string' && _this.selectedTags.includes(value)) {
@@ -418,14 +422,36 @@ var SearchBox = {
             }
             _this.selectedTags = [].concat(_this.selectedTags);
             if (typeof value === 'string' && !!value) {
-              _this.selectedTags.push(value);
+              if (props.strictSelection && cause === causes.SUGGESTION_SELECT) {
+                _this.selectedTags.push(value);
+                isTagAdded = true;
+              } else if (!props.strictSelection) {
+                _this.selectedTags.push(value);
+                isTagAdded = true;
+              }
             } else if (Array.isArray(value) && !isEqual(_this.selectedTags, value)) {
-              _this.selectedTags = value;
+              if (props.strictSelection && cause === causes.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 === causes.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 = decodeHtml(value);
         }
@@ -438,16 +464,22 @@ var SearchBox = {
             if (toggleIsOpen) {
               _this.isOpen = false;
             }
-            if (typeof _this.currentValue === 'string') _this.triggerDefaultQuery(_this.currentValue);
+            if (typeof _this.currentValue === 'string') {
+              if (_this.$options.isTagsMode && props.strictSelection && isTagAdded) {
+                _this.triggerDefaultQuery(_this.currentValue);
+              } else if (!_this.$options.isTagsMode) {
+                _this.triggerDefaultQuery(_this.currentValue);
+              }
+            }
           } // in case of strict selection only SUGGESTION_SELECT should be able
           // to set the query otherwise the value should reset
-          if (props.strictSelection) {
+          if (_this.$options.isTagsMode && props.strictSelection && isTagAdded) {
             if (cause === causes.SUGGESTION_SELECT || (_this.$options.isTagsMode ? _this.selectedTags.length === 0 : value === '')) {
               _this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
-            } else {
+            } else if (!props.strictSelection) {
               _this.setValue('', true);
             }
-          } else if (props.value === undefined || cause === causes.SUGGESTION_SELECT || cause === causes.CLEAR_VALUE) {
+          } else if (!_this.$options.isTagsMode && (props.value === undefined || cause === causes.SUGGESTION_SELECT || cause === causes.CLEAR_VALUE)) {
             _this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
           }
         } else {
@@ -566,6 +598,7 @@ var SearchBox = {
       this.onValueSelectedHandler('', causes.CLEAR_VALUE);
     },
     handleKeyDown: function handleKeyDown(event, highlightedIndex) {
+      var _this2 = this;
       if (highlightedIndex === void 0) {
         highlightedIndex = null;
       }
@@ -574,7 +607,11 @@ var SearchBox = {
         if (this.$props.autosuggest === false) {
           this.enterButtonOnClick();
         } else if (highlightedIndex === null) {
-          this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined // to handle tags
+          this.isSuggestionSelected = true;
+          setTimeout(function () {
+            _this2.isSuggestionSelected = false;
+          }, 50);
+          this.setValue(event.target.value, true, this.$props, undefined // to handle tags
           );
 
           this.onValueSelectedHandler(event.target.value, causes.ENTER_PRESS);
@@ -586,7 +623,7 @@ var SearchBox = {
       this.$emit('key-down', event, this.triggerQuery);
     },
     onInputChange: function onInputChange(e) {
-      var _this2 = this;
+      var _this3 = this;
       var inputValue = e.target.value;
       if (!this.$data.isOpen && this.$props.autosuggest) {
         this.isOpen = true;
@@ -597,7 +634,7 @@ var SearchBox = {
       } else {
         this.$emit('change', inputValue, function (_ref3) {
           var isOpen = _ref3.isOpen;
-          return _this2.triggerQuery({
+          return _this3.triggerQuery({
             defaultQuery: true,
             customQuery: true,
             value: inputValue,
@@ -607,7 +644,7 @@ var SearchBox = {
       }
     },
     onSuggestionSelected: function onSuggestionSelected(suggestion) {
-      var _this3 = this;
+      var _this4 = this;
       this.isOpen = false;
       var value = this.$props.value;
       // Record analytics for selected suggestions
@@ -628,10 +665,10 @@ var SearchBox = {
         this.setValue(emitValue, true, this.$props, causes.SUGGESTION_SELECT, false, suggestion._category);
         this.$emit('change', emitValue, function (_ref4) {
           var isOpen = _ref4.isOpen;
-          return _this3.triggerQuery(_extends({
+          return _this4.triggerQuery(_extends({
             isOpen: isOpen,
             value: emitValue
-          }, !_this3.$options.isTagsMode && {
+          }, !_this4.$options.isTagsMode && {
             categoryValue: suggestion._category
           }));
         });
@@ -746,7 +783,7 @@ var SearchBox = {
       });
     },
     renderEnterButtonElement: function renderEnterButtonElement() {
-      var _this4 = this;
+      var _this5 = this;
       var h = this.$createElement;
       var _this$$props4 = this.$props,
         enterButton = _this$$props4.enterButton,
@@ -755,7 +792,7 @@ var SearchBox = {
       if (enterButton) {
         var getEnterButtonMarkup = function getEnterButtonMarkup() {
           if (renderEnterButton) {
-            return renderEnterButton(_this4.enterButtonOnClick);
+            return renderEnterButton(_this5.enterButtonOnClick);
           }
           return h(Button, {
             "class": "enter-btn " + getClassName(innerClass, 'enter-button'),
@@ -763,7 +800,7 @@ var SearchBox = {
               "primary": true
             },
             "on": {
-              "click": _this4.enterButtonOnClick
+              "click": _this5.enterButtonOnClick
             }
           }, ["Search"]);
         };
@@ -830,7 +867,7 @@ var SearchBox = {
       (_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)) {
@@ -845,7 +882,7 @@ var SearchBox = {
       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
@@ -855,7 +892,7 @@ var SearchBox = {
         for (var index = 0; index < modifierKeys.length; index += 1) {
           var element = modifierKeys[index];
           if (hotkeys[element]) {
-            _this5.focusSearchBox(event);
+            _this6.focusSearchBox(event);
             break;
           }
         }
@@ -868,11 +905,11 @@ var SearchBox = {
       this.triggerDefaultQuery(value);
     },
     renderAutoFill: function renderAutoFill(suggestion) {
-      var _this6 = this;
+      var _this7 = this;
       var h = this.$createElement;
       var handleAutoFillClick = function handleAutoFillClick(e) {
         e.stopPropagation();
-        _this6.onAutofillClick(suggestion);
+        _this7.onAutofillClick(suggestion);
       };
       /* 👇 avoid showing autofill for category suggestions👇 */
       return suggestion._category ? null : h(AutoFillSvg, {
@@ -882,7 +919,7 @@ var SearchBox = {
       });
     },
     renderTag: function renderTag(item) {
-      var _this7 = this;
+      var _this8 = this;
       var h = this.$createElement;
       var innerClass = this.$props.innerClass;
       return h(TagItem, {
@@ -895,7 +932,7 @@ var SearchBox = {
         "class": "close-icon",
         "on": {
           "click": function click() {
-            return _this7.clearTag(item);
+            return _this8.clearTag(item);
           }
         }
       }, [h(CancelSvg)])]);
@@ -917,7 +954,7 @@ var SearchBox = {
       }
     },
     renderTags: function renderTags() {
-      var _this8 = this;
+      var _this9 = this;
       var h = this.$createElement;
       if (!Array.isArray(this.selectedTags)) {
         return null;
@@ -930,7 +967,7 @@ var SearchBox = {
         handleClear: this.clearTag,
         handleClearAll: this.clearAllTags
       }) : h(TagsContainer, [tagsList.map(function (item) {
-        return _this8.renderTag(item);
+        return _this9.renderTag(item);
       }), shouldRenderClearAllTag && h(TagItem, {
         "class": getClassName(this.$props.innerClass, 'selected-tag') || ''
       }, [h("span", ["Clear All"]), h("span", {
@@ -946,7 +983,7 @@ var SearchBox = {
     }
   },
   render: function render() {
-    var _this9 = this;
+    var _this10 = this;
     var h = arguments[0];
     var _this$$props6 = this.$props,
       theme = _this$$props6.theme,
@@ -987,14 +1024,14 @@ var SearchBox = {
                   return null;
               }
             };
-            return h("div", [_this9.hasCustomRenderer && _this9.getComponent({
+            return h("div", [_this10.hasCustomRenderer && _this10.getComponent({
               isOpen: isOpen,
               getItemProps: getItemProps,
               getItemEvents: getItemEvents,
               highlightedIndex: highlightedIndex
-            }), _this9.renderErrorComponent(), !_this9.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
-              "class": suggestions(_this9.themePreset, theme) + " " + getClassName(_this9.$props.innerClass, 'list')
-            }, [_this9.normalizedSuggestions.map(function (item, index) {
+            }), _this10.renderErrorComponent(), !_this10.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
+              "class": suggestions(_this10.themePreset, theme) + " " + getClassName(_this10.$props.innerClass, 'list')
+            }, [_this10.normalizedSuggestions.map(function (item, index) {
               return renderItem ? h("li", {
                 "domProps": _extends({}, getItemProps({
                   item: item
@@ -1004,7 +1041,7 @@ var SearchBox = {
                 })),
                 "key": index + 1 + "-" + item.value,
                 "style": {
-                  backgroundColor: _this9.getBackgroundColor(highlightedIndex, index),
+                  backgroundColor: _this10.getBackgroundColor(highlightedIndex, index),
                   justifyContent: 'flex-start',
                   alignItems: 'center'
                 }
@@ -1017,7 +1054,7 @@ var SearchBox = {
                 })),
                 "key": index + 1 + "-" + item.value,
                 "style": {
-                  backgroundColor: _this9.getBackgroundColor(highlightedIndex, index),
+                  backgroundColor: _this10.getBackgroundColor(highlightedIndex, index),
                   justifyContent: 'flex-start',
                   alignItems: 'center'
                 }
@@ -1028,58 +1065,58 @@ var SearchBox = {
                 }
               }, [h(CustomSvg, {
                 "attrs": {
-                  "className": getClassName(_this9.$props.innerClass, item._suggestion_type + "-search-icon") || null,
+                  "className": getClassName(_this10.$props.innerClass, item._suggestion_type + "-search-icon") || null,
                   "icon": getIcon(item._suggestion_type),
                   "type": item._suggestion_type + "-search-icon"
                 }
               })]), h(SuggestionItem, {
                 "attrs": {
-                  "currentValue": _this9.currentValue,
+                  "currentValue": _this10.currentValue,
                   "suggestion": item
                 }
-              }), _this9.renderAutoFill(item)]);
-            })]) : _this9.renderNoSuggestions(_this9.normalizedSuggestions)]);
+              }), _this10.renderAutoFill(item)]);
+            })]) : _this10.renderNoSuggestions(_this10.normalizedSuggestions)]);
           };
           return h("div", {
             "class": suggestionsContainer
-          }, [h(InputGroup, [_this9.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
+          }, [h(InputGroup, [_this10.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
             "attrs": {
-              "id": _this9.$props.componentId + "-input",
-              "showIcon": _this9.$props.showIcon,
-              "showClear": _this9.$props.showClear,
-              "iconPosition": _this9.$props.iconPosition,
-              "placeholder": _this9.$props.placeholder,
-              "autoFocus": _this9.$props.autoFocus,
-              "themePreset": _this9.themePreset,
+              "id": _this10.$props.componentId + "-input",
+              "showIcon": _this10.$props.showIcon,
+              "showClear": _this10.$props.showClear,
+              "iconPosition": _this10.$props.iconPosition,
+              "placeholder": _this10.$props.placeholder,
+              "autoFocus": _this10.$props.autoFocus,
+              "themePreset": _this10.themePreset,
               "autocomplete": "off"
             },
-            "ref": _this9.$props.innerRef,
-            "class": getClassName(_this9.$props.innerClass, 'input'),
+            "ref": _this10.$props.innerRef,
+            "class": getClassName(_this10.$props.innerClass, 'input'),
             "on": _extends({}, getInputEvents({
-              onInput: _this9.onInputChange,
+              onInput: _this10.onInputChange,
               onBlur: function onBlur(e) {
-                _this9.$emit('blur', e, _this9.triggerQuery);
+                _this10.$emit('blur', e, _this10.triggerQuery);
               },
-              onFocus: _this9.handleFocus,
+              onFocus: _this10.handleFocus,
               onKeyPress: function onKeyPress(e) {
-                _this9.$emit('keyPress', e, _this9.triggerQuery);
-                _this9.$emit('key-press', e, _this9.triggerQuery);
+                _this10.$emit('keyPress', e, _this10.triggerQuery);
+                _this10.$emit('key-press', e, _this10.triggerQuery);
               },
               onKeyDown: function onKeyDown(e) {
-                return _this9.handleKeyDown(e, highlightedIndex);
+                return _this10.handleKeyDown(e, highlightedIndex);
               },
               onKeyUp: function onKeyUp(e) {
-                _this9.$emit('keyUp', e, _this9.triggerQuery);
-                _this9.$emit('key-up', e, _this9.triggerQuery);
+                _this10.$emit('keyUp', e, _this10.triggerQuery);
+                _this10.$emit('key-up', e, _this10.triggerQuery);
               },
               onClick: function onClick() {
                 setHighlightedIndex(null);
               }
             })),
             "domProps": _extends({}, getInputProps({
-              value: _this9.$data.currentValue === null ? '' : _this9.$data.currentValue
+              value: _this10.$data.currentValue === null ? '' : _this10.$data.currentValue
             }))
-          }), _this9.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()]), _this9.renderInputAddonAfter(), _this9.renderEnterButtonElement()]), expandSuggestionsContainer && renderSuggestionsDropdown(), _this9.renderTags()]);
+          }), _this10.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()]), _this10.renderInputAddonAfter(), _this10.renderEnterButtonElement()]), expandSuggestionsContainer && renderSuggestionsDropdown(), _this10.renderTags()]);
         }
       }
     }) : h("div", {
@@ -1095,20 +1132,20 @@ var SearchBox = {
       },
       "on": _extends({}, {
         blur: function blur(e) {
-          _this9.$emit('blur', e, _this9.triggerQuery);
+          _this10.$emit('blur', e, _this10.triggerQuery);
         },
         keypress: function keypress(e) {
-          _this9.$emit('keyPress', e, _this9.triggerQuery);
-          _this9.$emit('key-press', e, _this9.triggerQuery);
+          _this10.$emit('keyPress', e, _this10.triggerQuery);
+          _this10.$emit('key-press', e, _this10.triggerQuery);
         },
         input: this.onInputChange,
         focus: function focus(e) {
-          _this9.$emit('focus', e, _this9.triggerQuery);
+          _this10.$emit('focus', e, _this10.triggerQuery);
         },
         keydown: this.handleKeyDown,
         keyup: function keyup(e) {
-          _this9.$emit('keyUp', e, _this9.triggerQuery);
-          _this9.$emit('key-up', e, _this9.triggerQuery);
+          _this10.$emit('keyUp', e, _this10.triggerQuery);
+          _this10.$emit('key-up', e, _this10.triggerQuery);
         }
       }),
       "domProps": _extends({}, {

package/dist/es/ReactiveComponentPrivate.js

@@ -27,7 +27,7 @@ import './Input-c09c0b56.js';
 import 'compute-scroll-into-view';
 import './Container-d00219f7.js';
 import 'vue-highlight-words';
-export { R as default } from './ReactiveComponentPrivate-a774148b.js';
+export { R as default } from './ReactiveComponentPrivate-ebe9a60a.js';
 import '@appbaseio/reactivecore/lib/utils/suggestions';
 import './FormControlList-99797d0a.js';
 import './utils-9e5a16a1.js';

package/dist/es/ReactiveGoogleMap.js

@@ -2,6 +2,7 @@ import { Actions, helper } from '@appbaseio/reactivecore';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import { a as _extends, b as _objectWithoutPropertiesLoose, c as _toPropertyKey, d as _inheritsLoose, _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ded08042.js';
 import VueTypes from 'vue-types';
+import { isEqual as isEqual$2 } from '@appbaseio/reactivecore/lib/utils/helper';
 import 'emotion';
 import styled, { css } from '@appbaseio/vue-emotion';
 import 'polished';
@@ -1681,6 +1682,13 @@ var GoogleMapMarker = {
       markerIcon: null
     };
   },
+  watch: {
+    marker: function marker(newVal, oldVal) {
+      if (!isEqual$2(newVal, oldVal)) {
+        this.markerIcon = null;
+      }
+    }
+  },
   methods: {
     setIcon: function setIcon(icon) {
       this.markerIcon = icon;

package/dist/es/index.js

@@ -33,7 +33,7 @@ import 'compute-scroll-into-view';
 import './Container-d00219f7.js';
 import 'vue-highlight-words';
 export { default as DataSearch } from './DataSearch.js';
-export { R as ReactiveComponentPrivate, S as SearchBox } from './ReactiveComponentPrivate-a774148b.js';
+export { R as ReactiveComponentPrivate, S as SearchBox } from './ReactiveComponentPrivate-ebe9a60a.js';
 import '@appbaseio/reactivecore/lib/utils/suggestions';
 import './FormControlList-99797d0a.js';
 import './utils-9e5a16a1.js';

package/dist/es/install.js

@@ -33,7 +33,7 @@ import 'compute-scroll-into-view';
 import './Container-d00219f7.js';
 import 'vue-highlight-words';
 import DataSearch from './DataSearch.js';
-import { S as SearchBox, R as ReactiveComponentPrivate } from './ReactiveComponentPrivate-a774148b.js';
+import { S as SearchBox, R as ReactiveComponentPrivate } from './ReactiveComponentPrivate-ebe9a60a.js';
 import '@appbaseio/reactivecore/lib/utils/suggestions';
 import './FormControlList-99797d0a.js';
 import './utils-9e5a16a1.js';

package/dist/es/version.js

@@ -1,3 +1,3 @@
-var version = "1.36.6";
+var version = "1.36.7";
 
 export default version;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@appbaseio/reactivesearch-vue",
-	"version": "1.36.6",
+	"version": "1.36.7",
 	"private": false,
 	"main": "dist/cjs/index.js",
 	"jsnext:main": "dist/es/index.js",
@@ -35,7 +35,7 @@
 	"sideEffects": false,
 	"dependencies": {
 		"@appbaseio/analytics": "^1.1.1",
-		"@appbaseio/reactivecore": "9.15.1",
+		"@appbaseio/reactivecore": "9.15.2",
 		"@appbaseio/vue-emotion": "0.4.4",
 		"@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
 		"appbase-js": "^5.3.4",