@appbaseio/reactivesearch-vue 2.0.0-alpha.2 → 2.0.0-alpha.4

package/dist/cjs/version.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "2.0.0-alpha.2";
+var version = "2.0.0-alpha.4";
 
 exports.default = version;

package/dist/es/{DataSearch-4888aa43.js → DataSearch-b86a6675.js}

@@ -1182,7 +1182,11 @@ var DataSearch = {
     },
     value: function value(newVal, oldVal) {
       if (!isEqual(newVal, oldVal)) {
-        this.setValue(newVal, true, this.$props, undefined, false);
+        if (this.isPending && this.$options.isTagsMode && Array.isArray(newVal)) {
+          this.isPending = false;
+        }
+
+        this.setValue(newVal, true, this.$props, undefined, false, typeof newVal !== 'string' && this.$options.isTagsMode);
       }
     },
     defaultQuery: function defaultQuery(newVal, oldVal) {
@@ -1326,7 +1330,7 @@ var DataSearch = {
         this.onValueSelectedHandler(currentValue, causes.SEARCH_ICON_CLICK);
       }
     },
-    setValue: function setValue(value, isDefaultValue, props, cause, toggleIsOpen) {
+    setValue: function setValue(value, isDefaultValue, props, cause, toggleIsOpen, isTagsMode) {
       var _this = this;
 
       if (isDefaultValue === void 0) {
@@ -1341,8 +1345,12 @@ var DataSearch = {
         toggleIsOpen = true;
       }
 
+      if (isTagsMode === void 0) {
+        isTagsMode = this.$options.isTagsMode;
+      }
+
       var performUpdate = function performUpdate() {
-        if (_this.$options.isTagsMode && isEqual(value, _this.selectedTags)) {
+        if (isTagsMode && isEqual(value, _this.selectedTags)) {
           return;
         } // Refresh recent searches when value becomes empty
 
@@ -1353,7 +1361,7 @@ var DataSearch = {
           _this.getRecentSearches();
         }
 
-        if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
+        if (isTagsMode) {
           if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
             // check if value already present in selectedTags
             if (typeof value === 'string' && _this.selectedTags.includes(value)) {
@@ -1380,7 +1388,7 @@ var DataSearch = {
 
         var queryHandlerValue = value;
 
-        if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
+        if (isTagsMode) {
           queryHandlerValue = Array.isArray(_this.selectedTags) && _this.selectedTags.length ? _this.selectedTags : undefined;
         }
 
@@ -1558,19 +1566,40 @@ var DataSearch = {
       this.$emit('key-down', event, this.triggerQuery);
     },
     onInputChange: function onInputChange(e) {
+      var _this2 = this;
+
       var inputValue = e.target.value;
 
       if (!this.$data.isOpen) {
         this.isOpen = true;
       }
 
-      var value = this.$props.value;
+      var _this$$props2 = this.$props,
+          value = _this$$props2.value,
+          autosuggest = _this$$props2.autosuggest;
 
       if (value === undefined) {
-        this.setValue(inputValue);
+        this.setValue(inputValue, false, this.$props, undefined, true, false);
       } else {
         this.isPending = true;
-        this.$emit('change', inputValue, this.triggerQuery, e);
+        this.$emit('change', inputValue, function (_temp2) {
+          var _ref3 = _temp2 === void 0 ? {} : _temp2,
+              _ref3$isOpen = _ref3.isOpen,
+              isOpen = _ref3$isOpen === void 0 ? false : _ref3$isOpen;
+
+          if (_this2.$options.isTagsMode && autosuggest) {
+            _this2.currentValue = value;
+            _this2.isOpen = isOpen;
+
+            _this2.updateDefaultQueryHandler(_this2.currentValue, _this2.$props);
+
+            return;
+          }
+
+          _this2.triggerQuery({
+            isOpen: isOpen
+          });
+        }, e);
       }
     },
     onSuggestionSelected: function onSuggestionSelected(suggestion) {
@@ -1665,9 +1694,9 @@ var DataSearch = {
       }
 
       var h = this.$createElement;
-      var _this$$props2 = this.$props,
-          theme = _this$$props2.theme,
-          innerClass = _this$$props2.innerClass;
+      var _this$$props3 = this.$props,
+          theme = _this$$props3.theme,
+          innerClass = _this$$props3.innerClass;
       var renderNoSuggestion = this.$scopedSlots.renderNoSuggestion || this.$props.renderNoSuggestion;
       var renderError = this.$scopedSlots.renderError || this.$props.renderError;
       var _this$$data = this.$data,
@@ -1703,7 +1732,7 @@ var DataSearch = {
       return null;
     },
     renderTag: function renderTag(item) {
-      var _this2 = this;
+      var _this3 = this;
 
       var h = this.$createElement;
       var innerClass = this.$props.innerClass;
@@ -1717,7 +1746,7 @@ var DataSearch = {
         "class": "close-icon",
         "on": {
           "click": function click() {
-            return _this2.clearTag(item);
+            return _this3.clearTag(item);
           }
         }
       }, [h(CancelSvg)])]);
@@ -1741,7 +1770,7 @@ var DataSearch = {
       }
     },
     renderTags: function renderTags() {
-      var _this3 = this;
+      var _this4 = this;
 
       var h = this.$createElement;
 
@@ -1757,7 +1786,7 @@ var DataSearch = {
         handleClear: this.clearTag,
         handleClearAll: this.clearAllTags
       }) : h(TagsContainer, [tagsList.map(function (item) {
-        return _this3.renderTag(item);
+        return _this4.renderTag(item);
       }), shouldRenderClearAllTag && h(TagItem, {
         "class": getClassName$1(this.$props.innerClass, 'selected-tag') || ''
       }, [h("span", ["Clear All"]), h("span", {
@@ -1783,13 +1812,13 @@ var DataSearch = {
     },
     renderIcons: function renderIcons() {
       var h = this.$createElement;
-      var _this$$props3 = this.$props,
-          iconPosition = _this$$props3.iconPosition,
-          showClear = _this$$props3.showClear,
-          innerClass = _this$$props3.innerClass,
-          getMicInstance = _this$$props3.getMicInstance,
-          showVoiceSearch = _this$$props3.showVoiceSearch,
-          showIcon = _this$$props3.showIcon;
+      var _this$$props4 = this.$props,
+          iconPosition = _this$$props4.iconPosition,
+          showClear = _this$$props4.showClear,
+          innerClass = _this$$props4.innerClass,
+          getMicInstance = _this$$props4.getMicInstance,
+          showVoiceSearch = _this$$props4.showVoiceSearch,
+          showIcon = _this$$props4.showIcon;
       var renderMic = this.$scopedSlots.renderMic || this.$props.renderMic;
       var currentValue = this.$data.currentValue;
       return h("div", [h(IconGroup, {
@@ -1841,7 +1870,7 @@ var DataSearch = {
       (_this$$refs = this.$refs) == null ? void 0 : (_this$$refs$this$$pro = _this$$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs$this$$pro.focus(); // eslint-disable-line
     },
     listenForFocusShortcuts: function listenForFocusShortcuts() {
-      var _this4 = this;
+      var _this5 = this;
 
       var _this$$props$focusSho = this.$props.focusShortcuts,
           focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
@@ -1859,7 +1888,7 @@ var DataSearch = {
         // Prevent the default refresh event under WINDOWS system
         event.preventDefault();
 
-        _this4.focusSearchBox(event);
+        _this5.focusSearchBox(event);
       }); // if one of modifier keys are used, they are handled below
 
       hotkeys('*', function (event) {
@@ -1870,7 +1899,7 @@ var DataSearch = {
           var element = modifierKeys[index];
 
           if (hotkeys[element]) {
-            _this4.focusSearchBox(event);
+            _this5.focusSearchBox(event);
 
             break;
           }
@@ -1879,14 +1908,14 @@ var DataSearch = {
     }
   },
   render: function render() {
-    var _this5 = this;
+    var _this6 = this;
 
     var h = arguments[0];
-    var _this$$props4 = this.$props,
-        theme = _this$$props4.theme,
-        size = _this$$props4.size,
-        expandSuggestionsContainer = _this$$props4.expandSuggestionsContainer,
-        enableDefaultSuggestions = _this$$props4.enableDefaultSuggestions;
+    var _this$$props5 = this.$props,
+        theme = _this$$props5.theme,
+        size = _this$$props5.size,
+        expandSuggestionsContainer = _this$$props5.expandSuggestionsContainer,
+        enableDefaultSuggestions = _this$$props5.enableDefaultSuggestions;
     var _this$$scopedSlots = this.$scopedSlots,
         recentSearchesIcon = _this$$scopedSlots.recentSearchesIcon,
         popularSearchesIcon = _this$$scopedSlots.popularSearchesIcon;
@@ -1908,24 +1937,24 @@ var DataSearch = {
         "isOpen": this.$data.isOpen
       },
       "scopedSlots": {
-        "default": function _default(_ref3) {
-          var getInputEvents = _ref3.getInputEvents,
-              getInputProps = _ref3.getInputProps,
-              getItemProps = _ref3.getItemProps,
-              getItemEvents = _ref3.getItemEvents,
-              isOpen = _ref3.isOpen,
-              highlightedIndex = _ref3.highlightedIndex,
-              setHighlightedIndex = _ref3.setHighlightedIndex;
+        "default": function _default(_ref4) {
+          var getInputEvents = _ref4.getInputEvents,
+              getInputProps = _ref4.getInputProps,
+              getItemProps = _ref4.getItemProps,
+              getItemEvents = _ref4.getItemEvents,
+              isOpen = _ref4.isOpen,
+              highlightedIndex = _ref4.highlightedIndex,
+              setHighlightedIndex = _ref4.setHighlightedIndex;
 
           var renderSuggestionsContainer = function renderSuggestionsContainer() {
-            return h("div", [_this5.hasCustomRenderer && _this5.getComponent({
+            return h("div", [_this6.hasCustomRenderer && _this6.getComponent({
               isOpen: isOpen,
               getItemProps: getItemProps,
               getItemEvents: getItemEvents,
               highlightedIndex: highlightedIndex
-            }), _this5.renderErrorComponent(), !_this5.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
-              "class": suggestions(_this5.themePreset, theme) + " " + getClassName$1(_this5.$props.innerClass, 'list')
-            }, [_this5.suggestionsList.slice(0, size || 10).map(function (item, index) {
+            }), _this6.renderErrorComponent(), !_this6.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
+              "class": suggestions(_this6.themePreset, theme) + " " + getClassName$1(_this6.$props.innerClass, 'list')
+            }, [_this6.suggestionsList.slice(0, size || 10).map(function (item, index) {
               return h("li", {
                 "domProps": _extends({}, getItemProps({
                   item: item
@@ -1935,15 +1964,15 @@ var DataSearch = {
                 })),
                 "key": index + 1 + "-" + item.value,
                 "style": {
-                  backgroundColor: _this5.getBackgroundColor(highlightedIndex, index)
+                  backgroundColor: _this6.getBackgroundColor(highlightedIndex, index)
                 }
               }, [h(SuggestionItem, {
                 "attrs": {
-                  "currentValue": _this5.currentValue,
+                  "currentValue": _this6.currentValue,
                   "suggestion": item
                 }
               })]);
-            }), _this5.defaultSearchSuggestions.map(function (sugg, index) {
+            }), _this6.defaultSearchSuggestions.map(function (sugg, index) {
               return h("li", {
                 "domProps": _extends({}, getItemProps({
                   item: sugg
@@ -1951,9 +1980,9 @@ var DataSearch = {
                 "on": _extends({}, getItemEvents({
                   item: sugg
                 })),
-                "key": _this5.suggestionsList.length + index + 1 + "-" + sugg.value,
+                "key": _this6.suggestionsList.length + index + 1 + "-" + sugg.value,
                 "style": {
-                  backgroundColor: _this5.getBackgroundColor(highlightedIndex, _this5.suggestionsList.length + index),
+                  backgroundColor: _this6.getBackgroundColor(highlightedIndex, _this6.suggestionsList.length + index),
                   justifyContent: 'flex-start'
                 }
               }, [h("div", {
@@ -1962,28 +1991,28 @@ var DataSearch = {
                 }
               }, [sugg.source && sugg.source._recent_search && h(CustomSvg, {
                 "attrs": {
-                  "className": getClassName$1(_this5.$props.innerClass, 'recent-search-icon') || null,
+                  "className": getClassName$1(_this6.$props.innerClass, 'recent-search-icon') || null,
                   "icon": recentSearchesIcon,
                   "type": "recent-search-icon"
                 }
               }), sugg.source && sugg.source._popular_suggestion && h(CustomSvg, {
                 "attrs": {
-                  "className": getClassName$1(_this5.$props.innerClass, 'popular-search-icon') || null,
+                  "className": getClassName$1(_this6.$props.innerClass, 'popular-search-icon') || null,
                   "icon": popularSearchesIcon,
                   "type": "popular-search-icon"
                 }
               })]), h(SuggestionItem, {
                 "attrs": {
-                  "currentValue": _this5.currentValue,
+                  "currentValue": _this6.currentValue,
                   "suggestion": sugg
                 }
               })]);
-            }), hasQuerySuggestionsRenderer(_this5) ? _this5.getComponent({
+            }), hasQuerySuggestionsRenderer(_this6) ? _this6.getComponent({
               isOpen: isOpen,
               getItemProps: getItemProps,
               getItemEvents: getItemEvents,
               highlightedIndex: highlightedIndex
-            }, true) : _this5.topSuggestions.map(function (sugg, index) {
+            }, true) : _this6.topSuggestions.map(function (sugg, index) {
               return h("li", {
                 "domProps": _extends({}, getItemProps({
                   item: sugg
@@ -1991,9 +2020,9 @@ var DataSearch = {
                 "on": _extends({}, getItemEvents({
                   item: sugg
                 })),
-                "key": _this5.suggestionsList.length + index + 1 + "-" + sugg.value,
+                "key": _this6.suggestionsList.length + index + 1 + "-" + sugg.value,
                 "style": {
-                  backgroundColor: _this5.getBackgroundColor(highlightedIndex, _this5.suggestionsList.length + index),
+                  backgroundColor: _this6.getBackgroundColor(highlightedIndex, _this6.suggestionsList.length + index),
                   justifyContent: 'flex-start'
                 }
               }, [h("div", {
@@ -2002,61 +2031,61 @@ var DataSearch = {
                 }
               }, [h(CustomSvg, {
                 "attrs": {
-                  "className": getClassName$1(_this5.$props.innerClass, 'popular-search-icon') || null,
+                  "className": getClassName$1(_this6.$props.innerClass, 'popular-search-icon') || null,
                   "icon": popularSearchesIcon,
                   "type": "popular-search-icon"
                 }
               })]), h(SuggestionItem, {
                 "attrs": {
-                  "currentValue": _this5.currentValue,
+                  "currentValue": _this6.currentValue,
                   "suggestion": sugg
                 }
               })]);
-            })]) : _this5.renderNoSuggestions(_this5.suggestionsList)]);
+            })]) : _this6.renderNoSuggestions(_this6.suggestionsList)]);
           };
 
           return h("div", {
             "class": suggestionsContainer
-          }, [h(InputGroup, [_this5.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
+          }, [h(InputGroup, [_this6.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
             "attrs": {
-              "id": _this5.$props.componentId + "-input",
-              "showIcon": _this5.$props.showIcon,
-              "showClear": _this5.$props.showClear,
-              "iconPosition": _this5.$props.iconPosition,
-              "placeholder": _this5.$props.placeholder,
-              "autoFocus": _this5.$props.autoFocus,
-              "themePreset": _this5.themePreset,
+              "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,
               "autocomplete": "off"
             },
-            "ref": _this5.$props.innerRef,
-            "class": getClassName$1(_this5.$props.innerClass, 'input'),
+            "ref": _this6.$props.innerRef,
+            "class": getClassName$1(_this6.$props.innerClass, 'input'),
             "on": _extends({}, getInputEvents({
-              onInput: _this5.onInputChange,
+              onInput: _this6.onInputChange,
               onBlur: function onBlur(e) {
-                _this5.$emit('blur', e, _this5.triggerQuery);
+                _this6.$emit('blur', e, _this6.triggerQuery);
               },
-              onFocus: _this5.handleFocus,
+              onFocus: _this6.handleFocus,
               onKeyPress: function onKeyPress(e) {
-                _this5.$emit('keyPress', e, _this5.triggerQuery);
+                _this6.$emit('keyPress', e, _this6.triggerQuery);
 
-                _this5.$emit('key-press', e, _this5.triggerQuery);
+                _this6.$emit('key-press', e, _this6.triggerQuery);
               },
               onKeyDown: function onKeyDown(e) {
-                return _this5.handleKeyDown(e, highlightedIndex);
+                return _this6.handleKeyDown(e, highlightedIndex);
               },
               onKeyUp: function onKeyUp(e) {
-                _this5.$emit('keyUp', e, _this5.triggerQuery);
+                _this6.$emit('keyUp', e, _this6.triggerQuery);
 
-                _this5.$emit('key-up', e, _this5.triggerQuery);
+                _this6.$emit('key-up', e, _this6.triggerQuery);
               },
               onClick: function onClick() {
                 setHighlightedIndex(null);
               }
             })),
             "domProps": _extends({}, getInputProps({
-              value: _this5.$data.currentValue === null ? '' : _this5.$data.currentValue
+              value: _this6.$data.currentValue === null ? '' : _this6.$data.currentValue
             }))
-          }), _this5.renderIcons(), !expandSuggestionsContainer && renderSuggestionsContainer()]), ' ', _this5.renderInputAddonAfter()]), expandSuggestionsContainer && renderSuggestionsContainer(), _this5.renderTags()]);
+          }), _this6.renderIcons(), !expandSuggestionsContainer && renderSuggestionsContainer()]), ' ', _this6.renderInputAddonAfter()]), expandSuggestionsContainer && renderSuggestionsContainer(), _this6.renderTags()]);
         }
       }
     }) : h("div", {
@@ -2072,26 +2101,26 @@ var DataSearch = {
       },
       "on": _extends({}, {
         blur: function blur(e) {
-          _this5.$emit('blur', e, _this5.triggerQuery);
+          _this6.$emit('blur', e, _this6.triggerQuery);
         },
         keypress: function keypress(e) {
-          _this5.$emit('keyPress', e, _this5.triggerQuery);
+          _this6.$emit('keyPress', e, _this6.triggerQuery);
 
-          _this5.$emit('key-press', e, _this5.triggerQuery);
+          _this6.$emit('key-press', e, _this6.triggerQuery);
         },
         input: this.onInputChange,
         focus: function focus(e) {
-          _this5.$emit('focus', e, _this5.triggerQuery);
+          _this6.$emit('focus', e, _this6.triggerQuery);
         },
         keydown: function keydown(e) {
-          _this5.$emit('keyDown', e, _this5.triggerQuery);
+          _this6.$emit('keyDown', e, _this6.triggerQuery);
 
-          _this5.$emit('key-down', e, _this5.triggerQuery);
+          _this6.$emit('key-down', e, _this6.triggerQuery);
         },
         keyup: function keyup(e) {
-          _this5.$emit('keyUp', e, _this5.triggerQuery);
+          _this6.$emit('keyUp', e, _this6.triggerQuery);
 
-          _this5.$emit('key-up', e, _this5.triggerQuery);
+          _this6.$emit('key-up', e, _this6.triggerQuery);
         }
       }),
       "domProps": _extends({}, {

package/dist/es/DataSearch.js

@@ -14,7 +14,7 @@ import './ComponentWrapper-424e86fd.js';
 import './Title-3342664a.js';
 import './Flex-1f0795c3.js';
 import 'hotkeys-js';
-export { D as default } from './DataSearch-4888aa43.js';
+export { D as default } from './DataSearch-b86a6675.js';
 import './CancelSvg-4cfae5fd.js';
 import './Input-7a2a9fac.js';
 import 'compute-scroll-into-view';

package/dist/es/StateProvider.js

@@ -26,23 +26,61 @@ var filterByComponentIds = function filterByComponentIds(state, props) {
   }
 
   var _props = props,
-      componentIds = _props.componentIds;
+      componentIds = _props.componentIds,
+      excludeComponentIds = _props.excludeComponentIds;
 
-  if (typeof componentIds === 'string') {
-    var _ref;
+  if (componentIds) {
+    if (typeof componentIds === 'string') {
+      var _ref;
 
-    return _ref = {}, _ref[componentIds] = state[componentIds], _ref;
+      return _ref = {}, _ref[componentIds] = state[componentIds], _ref;
+    }
+
+    if (Array.isArray(componentIds) && componentIds.length) {
+      var _filteredState = {};
+      componentIds.forEach(function (componentId) {
+        _filteredState[componentId] = state[componentId];
+      });
+      return _filteredState;
+    }
   }
 
-  if (Array.isArray(componentIds)) {
-    var filteredState = {};
-    componentIds.forEach(function (componentId) {
+  var filteredState = {};
+
+  if (!props.includeInternalComponents) {
+    Object.keys(state).forEach(function (componentId) {
+      if (componentId.endsWith('internal') || componentId.endsWith('active') || componentId.endsWith('timestamp')) {
+        return;
+      }
+
       filteredState[componentId] = state[componentId];
     });
-    return filteredState;
+  } else {
+    filteredState = state;
+  } // Apply exclude component ids
+
+
+  if (excludeComponentIds) {
+    if (typeof excludeComponentIds === 'string') {
+      Object.keys(state).forEach(function (componentId) {
+        if (componentId === excludeComponentIds) {
+          // Delete state
+          delete filteredState[componentId];
+        }
+      });
+    }
+
+    if (Array.isArray(excludeComponentIds) && excludeComponentIds.length) {
+      Object.keys(state).forEach(function (componentId) {
+        if (excludeComponentIds.includes(componentId)) {
+          // Delete state
+          delete filteredState[componentId];
+        }
+      });
+    }
   }
 
-  return state;
+  return filteredState;
 };
 
 var filterByKeys = function filterByKeys(state, allowedKeys) {
@@ -65,7 +103,9 @@ var StateProvider = {
     onChange: VueTypes.func,
     componentIds: VueTypes.oneOfType([VueTypes.string, VueTypes.arrayOf(VueTypes.string)]),
     includeKeys: VueTypes.arrayOf(VueTypes.string).def(defaultKeys),
-    strict: VueTypes.bool.def(true)
+    strict: VueTypes.bool.def(true),
+    includeInternalComponents: VueTypes.bool.def(false),
+    excludeComponentIds: VueTypes.oneOfType([VueTypes.string, VueTypes.arrayOf(VueTypes.string)])
   },
   data: function data() {
     this.__state = {
@@ -80,21 +120,21 @@ var StateProvider = {
     searchStateProps: function searchStateProps() {
       return {
         selectedValues: this.selectedValues || {},
-        queryLog: this.queryLog,
-        dependencyTree: this.dependencyTree,
-        componentProps: this.componentProps,
-        hits: this.hits,
-        aggregations: this.aggregations,
-        isLoading: this.isLoading,
-        error: this.error,
-        promotedResults: this.promotedResults,
-        rawData: this.rawData
+        queryLog: this.queryLog || {},
+        dependencyTree: this.dependencyTree || {},
+        componentProps: this.componentProps || {},
+        hits: this.hits || {},
+        aggregations: this.aggregations || {},
+        isLoading: this.isLoading || {},
+        error: this.error || {},
+        promotedResults: this.promotedResults || {},
+        rawData: this.rawData || {}
       };
     }
   },
   watch: {
     searchState: function searchState(newVal, oldVal) {
-      if (this.isStateChanged(newVal, oldVal)) {
+      if (oldVal != null && this.isStateChanged(newVal, oldVal)) {
         this.$emit('change', oldVal, newVal);
       }
     },
@@ -125,6 +165,9 @@ var StateProvider = {
     componentIds: function componentIds(newVal, oldVal) {
       this.calculateSearchState(newVal, oldVal);
     },
+    excludeComponentIds: function excludeComponentIds(newVal, oldVal) {
+      this.calculateSearchState(newVal, oldVal);
+    },
     includeKeys: function includeKeys(newVal, oldVal) {
       this.calculateSearchState(newVal, oldVal);
     },

package/dist/es/index.js

@@ -24,14 +24,14 @@ import 'appbase-js';
 import 'url-search-params-polyfill';
 export { default as ReactiveBase } from './ReactiveBase.js';
 import 'hotkeys-js';
-export { D as DataSearch } from './DataSearch-4888aa43.js';
+export { D as DataSearch } from './DataSearch-b86a6675.js';
 import './CancelSvg-4cfae5fd.js';
 import './Input-7a2a9fac.js';
 import 'compute-scroll-into-view';
 import './Container-ba826e96.js';
 import 'vue-highlight-words';
-import { i as install } from './install-87984085.js';
-export { S as SearchBox, i as install } from './install-87984085.js';
+import { i as install } from './install-ac8a1edb.js';
+export { S as SearchBox, i as install } from './install-ac8a1edb.js';
 import '@appbaseio/reactivecore/lib/utils/suggestions';
 import './FormControlList-c22d64f6.js';
 import './utils-9e68acee.js';

package/dist/es/initReactivesearch.js

@@ -15,11 +15,14 @@ import { isPropertyDefined } from '@appbaseio/reactivecore/lib/actions/utils';
 var _excluded = ["aggs", "size"],
     _excluded2 = ["query"],
     _excluded3 = ["query"];
+
+var _componentTypeToDefau;
 var X_SEARCH_CLIENT = 'ReactiveSearch Vue';
 var componentsWithoutFilters = [componentTypes.numberBox, componentTypes.ratingsFilter];
 var resultComponents = [componentTypes.reactiveList, componentTypes.reactiveMap];
+var componentTypeToDefaultValue = (_componentTypeToDefau = {}, _componentTypeToDefau[componentTypes.singleList] = '', _componentTypeToDefau[componentTypes.multiList] = [], _componentTypeToDefau[componentTypes.singleDataList] = '', _componentTypeToDefau[componentTypes.singleDropdownList] = '', _componentTypeToDefau[componentTypes.multiDataList] = [], _componentTypeToDefau[componentTypes.multiDropdownList] = [], _componentTypeToDefau[componentTypes.tagCloud] = '', _componentTypeToDefau[componentTypes.toggleButton] = '', _componentTypeToDefau[componentTypes.singleDropdownRange] = '', _componentTypeToDefau[componentTypes.multiDropdownRange] = [], _componentTypeToDefau[componentTypes.singleRange] = '', _componentTypeToDefau[componentTypes.multiRange] = [], _componentTypeToDefau);
 
-function getValue(state, id, defaultValue) {
+function getValue(state, id, defaultValue, componentType) {
   if (state && state[id]) {
     try {
       // parsing for next.js - since it uses extra set of quotes to wrap params
@@ -38,7 +41,7 @@ function getValue(state, id, defaultValue) {
   }
 
   return {
-    value: defaultValue,
+    value: defaultValue || componentTypeToDefaultValue[componentType] || null,
     reference: 'DEFAULT'
   };
 }
@@ -177,7 +180,7 @@ function initReactivesearch(componentCollection, searchState, settings) {
       var internalComponent = component.componentId + "__internal";
       var label = component.filterLabel || component.componentId;
 
-      var _getValue = getValue(searchState, component.componentId, component.value || component.defaultValue),
+      var _getValue = getValue(searchState, component.componentId, component.value || component.defaultValue, componentType),
           value = _getValue.value,
           reference = _getValue.reference; // [1] set selected values
 
@@ -547,3 +550,4 @@ function initReactivesearch(componentCollection, searchState, settings) {
 }
 
 export default initReactivesearch;
+export { componentTypeToDefaultValue };

package/dist/es/{install-87984085.js → install-ac8a1edb.js}

@@ -12,7 +12,7 @@ import { C as ComponentWrapper } from './ComponentWrapper-424e86fd.js';
 import { T as Title } from './Title-3342664a.js';
 import ReactiveBase from './ReactiveBase.js';
 import hotkeys from 'hotkeys-js';
-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-4888aa43.js';
+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-b86a6675.js';
 import { C as CancelSvg, a as IconGroup, I as IconWrapper, D as Downshift, b as InputWrapper } from './CancelSvg-4cfae5fd.js';
 import { s as suggestionsContainer, I as Input, a as suggestions } from './Input-7a2a9fac.js';
 import { C as Container } from './Container-ba826e96.js';