@appbaseio/reactivesearch-vue 1.33.0 → 1.33.2

package/dist/es/{ReactiveComponent-ee01562d.js → ReactiveComponent-dd85aa9c.js}

@@ -1,21 +1,21 @@
 import { Actions, helper, causes } from '@appbaseio/reactivecore';
 import { SEARCH_COMPONENTS_MODES, componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
-import { _ as _taggedTemplateLiteralLoose, a as _extends, b as _objectWithoutPropertiesLoose } from './_rollupPluginBabelHelpers-76660dab.js';
+import { _ as _taggedTemplateLiteralLoose, a as _extends, b as _objectWithoutPropertiesLoose } from './_rollupPluginBabelHelpers-ded08042.js';
 import VueTypes from 'vue-types';
 import { getQueryOptions, suggestionTypes } from '@appbaseio/reactivecore/lib/utils/helper';
 import styled from '@appbaseio/vue-emotion';
-import { B as Button } from './Button-35aa984e.js';
-import { t as types } from './vueTypes-b8146772.js';
+import { B as Button } from './Button-153cd885.js';
+import { t as types } from './vueTypes-8986b709.js';
 import { RLConnected } from './ReactiveList.js';
-import { n as decodeHtml, h as hasCustomRenderer, i as isQueryIdentical, g as getComponent, u as updateDefaultQuery, f as updateCustomQuery, a as isFunction, k as isEmpty, p as parseFocusShortcuts, l as extractModifierKeysFromFocusShortcuts, c as connect } from './index-99c5f9c9.js';
-import { C as ComponentWrapper } from './ComponentWrapper-d5e814a4.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-c30605fe.js';
-import { T as Title } from './Title-3342664a.js';
+import { n as decodeHtml, h as hasCustomRenderer, i as isQueryIdentical, g as getComponent, u as updateDefaultQuery, f as updateCustomQuery, a as isFunction, k as isEmpty, p as parseFocusShortcuts, l as extractModifierKeysFromFocusShortcuts, c as connect } from './index-0444a498.js';
+import { C as ComponentWrapper } from './ComponentWrapper-240450cc.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-bc097ebb.js';
+import { T as Title } from './Title-863dfa42.js';
 import hotkeys from 'hotkeys-js';
-import { S as SearchSvg, b as SuggestionWrapper, I as InputAddon, M as Mic, T as TagItem, c as TagsContainer, d as InputGroup, C as CustomSvg, e as SuggestionItem, D as DSConnected } from './DataSearch-5376d39a.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';
+import { S as SearchSvg, b as SuggestionWrapper, I as InputAddon, M as Mic, T as TagItem, c as TagsContainer, d as InputGroup, C as CustomSvg, e as SuggestionItem, D as DSConnected } from './DataSearch-20f0d8f1.js';
+import { C as CancelSvg, a as IconGroup, I as IconWrapper, D as Downshift, b as InputWrapper } from './CancelSvg-e40552a5.js';
+import { s as suggestionsContainer, I as Input, a as suggestions } from './Input-c09c0b56.js';
+import { C as Container } from './Container-d00219f7.js';
 import { ListConnected as ListConnected$4 } from './SingleList.js';
 import { ListConnected as ListConnected$3 } from './MultiList.js';
 import { ListConnected as ListConnected$2 } from './SingleDropdownList.js';
@@ -56,17 +56,17 @@ var AutoFillSvg = {
 };
 
 var updateQuery = Actions.updateQuery,
-    setCustomQuery = Actions.setCustomQuery,
-    setDefaultQuery = Actions.setDefaultQuery,
-    recordSuggestionClick = Actions.recordSuggestionClick;
+  setCustomQuery = Actions.setCustomQuery,
+  setDefaultQuery = Actions.setDefaultQuery,
+  recordSuggestionClick = Actions.recordSuggestionClick;
 var _debounce = helper.debounce,
-    checkValueChange = helper.checkValueChange,
-    getClassName = helper.getClassName,
-    isEqual = helper.isEqual,
-    getCompositeAggsQuery = helper.getCompositeAggsQuery,
-    withClickIds = helper.withClickIds,
-    getResultStats = helper.getResultStats,
-    normalizeDataField = helper.normalizeDataField;
+  checkValueChange = helper.checkValueChange,
+  getClassName = helper.getClassName,
+  isEqual = helper.isEqual,
+  getCompositeAggsQuery = helper.getCompositeAggsQuery,
+  withClickIds = helper.withClickIds,
+  getResultStats = helper.getResultStats,
+  normalizeDataField = helper.normalizeDataField;
 var SearchBox = {
   name: 'SearchBox',
   isTagsMode: false,
@@ -88,39 +88,32 @@ var SearchBox = {
   },
   created: function created() {
     var _this$$props = this.$props,
-        distinctField = _this$$props.distinctField,
-        distinctFieldConfig = _this$$props.distinctFieldConfig,
-        index = _this$$props.index,
-        mode = _this$$props.mode;
-
+      distinctField = _this$$props.distinctField,
+      distinctFieldConfig = _this$$props.distinctFieldConfig,
+      index = _this$$props.index,
+      mode = _this$$props.mode;
     if (mode === SEARCH_COMPONENTS_MODES.TAG) {
       this.$options.isTagsMode = true;
     }
-
     if (this.$options.isTagsMode) {
       console.warn('Warning(ReactiveSearch): The `categoryField` prop is not supported when `mode` prop is set to `tag`');
     }
-
     if (this.enableAppbase && this.aggregationField && this.aggregationField !== '') {
       console.warn('Warning(ReactiveSearch): The `aggregationField` prop has been marked as deprecated, please use the `distinctField` prop instead.');
     }
-
     if (!this.enableAppbase && (distinctField || distinctFieldConfig)) {
       console.warn('Warning(ReactiveSearch): In order to use the `distinctField` and `distinctFieldConfig` props, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
     }
-
     if (!this.enableAppbase && index) {
       console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
     }
-
     this.currentValue = decodeHtml(this.selectedValue || this.value || this.defaultValue || '');
-
     if (this.$options.isTagsMode) {
       this.currentValue = '';
     }
+    this.handleTextChange = _debounce(this.handleText, this.$props.debounce);
 
-    this.handleTextChange = _debounce(this.handleText, this.$props.debounce); // Set custom and default queries in store
-
+    // Set custom and default queries in store
     this.triggerCustomQuery(this.currentValue, this.selectedCategory);
     this.triggerDefaultQuery(this.currentValue);
   },
@@ -261,13 +254,11 @@ var SearchBox = {
     },
     suggestions: function suggestions(newVal) {
       var suggestionsList = [];
-
       if (Array.isArray(newVal) && newVal.length) {
         suggestionsList = [].concat(withClickIds(newVal));
       } else if (Array.isArray(this.$props.defaultSuggestions) && this.$props.defaultSuggestions.length) {
         suggestionsList = [].concat(withClickIds(this.$props.defaultSuggestions));
       }
-
       this.normalizedSuggestions = suggestionsList;
     },
     selectedValue: function selectedValue(newVal, oldVal) {
@@ -275,21 +266,18 @@ var SearchBox = {
         if (!newVal && this.$data.currentValue) {
           // selected value is cleared, call onValueSelected
           this.onValueSelectedHandler('', causes.CLEAR_VALUE);
-        } // if (this.$props.value === undefined) {
-
-
+        }
+        // if (this.$props.value === undefined) {
         if (this.$options.isTagsMode) {
           // handling reset of tags through SelectedFilters or URL
           this.selectedTags = [];
         }
-
         var cause = !newVal ? causes.CLEAR_VALUE : undefined;
-
         if (this.$options.isTagsMode) {
           cause = causes.SUGGESTION_SELECT;
         }
-
-        this.setValue(newVal || '', true, this.$props, cause); // }
+        this.setValue(newVal || '', true, this.$props, cause);
+        // }
       }
     },
     focusShortcuts: function focusShortcuts() {
@@ -354,18 +342,15 @@ var SearchBox = {
       var props = this.$props;
       var requiredError = propName + " supplied to " + componentName + " is required. Validation failed.";
       var propValue = props[propName];
-
       if (!this.enableAppbase) {
         if (!propValue) {
           console.error(requiredError);
           return;
         }
-
         if (typeof propValue !== 'string' && typeof propValue !== 'object' && !Array.isArray(propValue)) {
           console.error("Invalid " + propName + " supplied to " + componentName + ". Validation failed.");
           return;
         }
-
         if (Array.isArray(propValue) && propValue.length === 0) {
           console.error(requiredError);
         }
@@ -375,7 +360,6 @@ var SearchBox = {
       if (downshiftProps === void 0) {
         downshiftProps = {};
       }
-
       var currentValue = this.$data.currentValue;
       var data = {
         error: this.error,
@@ -392,19 +376,16 @@ var SearchBox = {
     getBasicQueryOptions: function getBasicQueryOptions() {
       var aggregationField = this.$props.aggregationField;
       var queryOptions = getQueryOptions(this.$props);
-
       if (aggregationField) {
         queryOptions.aggs = getCompositeAggsQuery({
           props: this.$props,
           showTopHits: true
         }).aggs;
       }
-
       return queryOptions;
     },
     handleSearchIconClick: function handleSearchIconClick() {
       var currentValue = this.currentValue;
-
       if (currentValue.trim()) {
         this.setValue(currentValue, true);
         this.onValueSelectedHandler(currentValue, causes.SEARCH_ICON_CLICK);
@@ -412,28 +393,22 @@ var SearchBox = {
     },
     setValue: function setValue(value, isDefaultValue, props, cause, toggleIsOpen, categoryValue) {
       var _this = this;
-
       if (isDefaultValue === void 0) {
         isDefaultValue = false;
       }
-
       if (props === void 0) {
         props = this.$props;
       }
-
       if (toggleIsOpen === void 0) {
         toggleIsOpen = true;
       }
-
       if (categoryValue === void 0) {
         categoryValue = undefined;
       }
-
       var performUpdate = function performUpdate() {
         if (_this.$options.isTagsMode && isEqual(value, _this.selectedTags)) {
           return;
         }
-
         if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
           if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
             // check if value already present in selectedTags
@@ -441,9 +416,7 @@ var SearchBox = {
               _this.isOpen = false;
               return;
             }
-
             _this.selectedTags = [].concat(_this.selectedTags);
-
             if (typeof value === 'string' && !!value) {
               _this.selectedTags.push(value);
             } else if (Array.isArray(value) && !isEqual(_this.selectedTags, value)) {
@@ -453,29 +426,22 @@ var SearchBox = {
           } else if (value) {
             _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
           }
-
           _this.currentValue = '';
         } else {
           _this.currentValue = decodeHtml(value);
         }
-
         var queryHandlerValue = value;
-
         if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
           queryHandlerValue = Array.isArray(_this.selectedTags) && _this.selectedTags.length ? _this.selectedTags : undefined;
         }
-
         if (isDefaultValue) {
           if (_this.$props.autosuggest) {
             if (toggleIsOpen) {
               _this.isOpen = false;
             }
-
             if (typeof _this.currentValue === 'string') _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 (cause === causes.SUGGESTION_SELECT || (_this.$options.isTagsMode ? _this.selectedTags.length === 0 : value === '')) {
               _this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
@@ -489,33 +455,26 @@ var SearchBox = {
           // debounce for handling text while typing
           _this.handleTextChange(value, cause);
         }
-
         _this.$emit('valueChange', value);
-
         _this.$emit('value-change', value);
       };
-
       checkValueChange(props.componentId, value, props.beforeValueChange, performUpdate);
     },
     triggerDefaultQuery: function triggerDefaultQuery(paramValue) {
       if (!this.$props.autosuggest) {
         return;
       }
-
       var value = typeof paramValue !== 'string' ? this.currentValue : paramValue;
       var query = SearchBox.defaultQuery(value, this.$props);
-
       if (this.defaultQuery) {
         var defaultQueryToBeSet = this.defaultQuery(value, this.$props) || {};
-
         if (defaultQueryToBeSet.query) {
           query = defaultQueryToBeSet.query;
-        } // Update calculated default query in store
-
+        }
 
+        // Update calculated default query in store
         updateDefaultQuery(this.$props.componentId, this.setDefaultQuery, this.$props, value);
       }
-
       this.updateQuery({
         componentId: this.internalComponent,
         query: query,
@@ -527,32 +486,25 @@ var SearchBox = {
       if (categoryValue === void 0) {
         categoryValue = undefined;
       }
-
       var _this$$props2 = this.$props,
-          customQuery = _this$$props2.customQuery,
-          filterLabel = _this$$props2.filterLabel,
-          showFilter = _this$$props2.showFilter,
-          URLParams = _this$$props2.URLParams;
+        customQuery = _this$$props2.customQuery,
+        filterLabel = _this$$props2.filterLabel,
+        showFilter = _this$$props2.showFilter,
+        URLParams = _this$$props2.URLParams;
       var value = typeof paramValue !== 'string' ? this.$data.currentValue : paramValue;
-
       if (this.$options.isTagsMode) {
         value = paramValue;
       }
-
       var defaultQueryTobeSet = SearchBox.defaultQuery("" + value + (categoryValue ? " in " + categoryValue : ''), this.$props);
       var query = defaultQueryTobeSet;
-
       if (customQuery) {
         var customQueryTobeSet = customQuery(value, this.$props);
         var queryTobeSet = customQueryTobeSet.query;
-
         if (queryTobeSet) {
           query = queryTobeSet;
         }
-
         updateCustomQuery(this.$props.componentId, this.setCustomQuery, this.$props, value);
       }
-
       this.updateQuery({
         componentId: this.$props.componentId,
         query: query,
@@ -568,36 +520,31 @@ var SearchBox = {
       if (this.$props.autosuggest) {
         this.isOpen = true;
       }
-
       this.$emit('focus', event);
     },
     handleVoiceResults: function handleVoiceResults(_ref) {
       var results = _ref.results;
-
       if (results && results[0] && results[0].isFinal && results[0][0] && results[0][0].transcript && results[0][0].transcript.trim()) {
         this.setValue(results[0][0].transcript.trim(), true);
       }
     },
     triggerQuery: function triggerQuery(_ref2) {
       var _ref2$isOpen = _ref2.isOpen,
-          isOpen = _ref2$isOpen === void 0 ? undefined : _ref2$isOpen,
-          _ref2$customQuery = _ref2.customQuery,
-          customQuery = _ref2$customQuery === void 0 ? true : _ref2$customQuery,
-          _ref2$defaultQuery = _ref2.defaultQuery,
-          defaultQuery = _ref2$defaultQuery === void 0 ? true : _ref2$defaultQuery,
-          _ref2$value = _ref2.value,
-          value = _ref2$value === void 0 ? undefined : _ref2$value,
-          _ref2$categoryValue = _ref2.categoryValue,
-          categoryValue = _ref2$categoryValue === void 0 ? undefined : _ref2$categoryValue;
-
+        isOpen = _ref2$isOpen === void 0 ? undefined : _ref2$isOpen,
+        _ref2$customQuery = _ref2.customQuery,
+        customQuery = _ref2$customQuery === void 0 ? true : _ref2$customQuery,
+        _ref2$defaultQuery = _ref2.defaultQuery,
+        defaultQuery = _ref2$defaultQuery === void 0 ? true : _ref2$defaultQuery,
+        _ref2$value = _ref2.value,
+        value = _ref2$value === void 0 ? undefined : _ref2$value,
+        _ref2$categoryValue = _ref2.categoryValue,
+        categoryValue = _ref2$categoryValue === void 0 ? undefined : _ref2$categoryValue;
       if (typeof isOpen === 'boolean') {
         this.isOpen = isOpen;
       }
-
       if (customQuery) {
         this.triggerCustomQuery(value, categoryValue);
       }
-
       if (defaultQuery) {
         this.triggerDefaultQuery(value);
       }
@@ -605,17 +552,14 @@ var SearchBox = {
     triggerClickAnalytics: function triggerClickAnalytics(searchPosition, documentId) {
       // click analytics would only work client side and after javascript loads
       var docId = documentId;
-
       if (!docId) {
         var hitData = this.normalizedSuggestions.find(function (hit) {
           return hit._click_id === searchPosition;
         });
-
         if (hitData && hitData.source && hitData.source._id) {
           docId = hitData.source._id;
         }
       }
-
       this.recordSuggestionClick(searchPosition, docId);
     },
     clearValue: function clearValue() {
@@ -626,7 +570,6 @@ var SearchBox = {
       if (highlightedIndex === void 0) {
         highlightedIndex = null;
       }
-
       // if a suggestion was selected, delegate the handling to suggestion handler
       if (event.key === 'Enter') {
         if (this.$props.autosuggest === false) {
@@ -634,25 +577,22 @@ var SearchBox = {
         } else if (highlightedIndex === null) {
           this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined // to handle tags
           );
+
           this.onValueSelectedHandler(event.target.value, causes.ENTER_PRESS);
         }
-      } // Need to review
-
+      }
 
+      // Need to review
       this.$emit('keyDown', event, this.triggerQuery);
       this.$emit('key-down', event, this.triggerQuery);
     },
     onInputChange: function onInputChange(e) {
       var _this2 = this;
-
       var inputValue = e.target.value;
-
       if (!this.$data.isOpen && this.$props.autosuggest) {
         this.isOpen = true;
       }
-
       var value = this.$props.value;
-
       if (value === undefined) {
         this.setValue(inputValue, false, this.$props, inputValue === '' ? causes.CLEAR_VALUE : undefined);
       } else {
@@ -669,29 +609,23 @@ var SearchBox = {
     },
     onSuggestionSelected: function onSuggestionSelected(suggestion) {
       var _this3 = this;
-
       this.isOpen = false;
-      var value = this.$props.value; // Record analytics for selected suggestions
-
+      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, causes.SUGGESTION_SELECT, false, suggestion._category);
       } else {
         var emitValue = suggestion.value;
-
         if (this.$options.isTagsMode) {
           emitValue = Array.isArray(this.selectedTags) ? [].concat(this.selectedTags) : [];
-
           if (this.selectedTags.includes(suggestion.value)) {
             // avoid duplicates in tags array
             this.isOpen = false;
             return;
           }
-
           emitValue.push(suggestion.value);
         }
-
         this.setValue(emitValue, true, this.$props, causes.SUGGESTION_SELECT, false, suggestion._category);
         this.$emit('change', emitValue, function (_ref4) {
           var isOpen = _ref4.isOpen;
@@ -703,18 +637,15 @@ var SearchBox = {
           }));
         });
       }
-
       this.onValueSelectedHandler(suggestion.value, causes.SUGGESTION_SELECT, suggestion.source);
     },
     onValueSelectedHandler: function onValueSelectedHandler(currentValue) {
       if (currentValue === void 0) {
         currentValue = this.$data.currentValue;
       }
-
       for (var _len = arguments.length, cause = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
         cause[_key - 1] = arguments[_key];
       }
-
       this.$emit.apply(this, ['valueSelected', currentValue].concat(cause));
       this.$emit.apply(this, ['value-selected', currentValue].concat(cause));
     },
@@ -724,26 +655,21 @@ var SearchBox = {
     },
     getBackgroundColor: function getBackgroundColor(highlightedIndex, index) {
       var isDark = this.themePreset === 'dark';
-
       if (isDark) {
         return highlightedIndex === index ? '#555' : '#424242';
       }
-
       return highlightedIndex === index ? '#eee' : '#fff';
     },
     renderIcon: function renderIcon() {
       var h = this.$createElement;
-
       if (this.$props.showIcon) {
         return this.$props.icon || h(SearchSvg);
       }
-
       return null;
     },
     renderErrorComponent: function renderErrorComponent() {
       var h = this.$createElement;
       var renderError = this.$scopedSlots.renderError || this.$props.renderError;
-
       if (this.error && renderError && this.$data.currentValue && !this.isLoading) {
         return h(SuggestionWrapper, {
           "attrs": {
@@ -754,33 +680,28 @@ var SearchBox = {
           }
         }, [isFunction(renderError) ? renderError(this.error) : renderError]);
       }
-
       return null;
     },
     renderCancelIcon: function renderCancelIcon() {
       var h = this.$createElement;
-
       if (this.$props.showClear) {
         return this.$props.clearIcon || h(CancelSvg);
       }
-
       return null;
     },
     renderNoSuggestions: function renderNoSuggestions(finalSuggestionsList) {
       if (finalSuggestionsList === void 0) {
         finalSuggestionsList = [];
       }
-
       var h = this.$createElement;
       var _this$$props3 = this.$props,
-          theme = _this$$props3.theme,
-          innerClass = _this$$props3.innerClass;
+        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,
-          isOpen = _this$$data.isOpen,
-          currentValue = _this$$data.currentValue;
-
+        isOpen = _this$$data.isOpen,
+        currentValue = _this$$data.currentValue;
       if (renderNoSuggestion && isOpen && !finalSuggestionsList.length && !this.isLoading && currentValue && !(renderError && this.error)) {
         return h(SuggestionWrapper, {
           "attrs": {
@@ -796,31 +717,26 @@ var SearchBox = {
           }
         });
       }
-
       return null;
     },
     renderInputAddonBefore: function renderInputAddonBefore() {
       var h = this.$createElement;
       var addonBefore = this.$scopedSlots.addonBefore;
-
       if (addonBefore) {
         return h(InputAddon, {
           "class": "addon-before"
         }, [addonBefore()]);
       }
-
       return null;
     },
     renderInputAddonAfter: function renderInputAddonAfter() {
       var h = this.$createElement;
       var addonAfter = this.$scopedSlots.addonAfter;
-
       if (addonAfter) {
         return h(InputAddon, {
           "class": "addon-after"
         }, [addonAfter()]);
       }
-
       return null;
     },
     enterButtonOnClick: function enterButtonOnClick() {
@@ -832,19 +748,16 @@ var SearchBox = {
     },
     renderEnterButtonElement: function renderEnterButtonElement() {
       var _this4 = this;
-
       var h = this.$createElement;
       var _this$$props4 = this.$props,
-          enterButton = _this$$props4.enterButton,
-          innerClass = _this$$props4.innerClass;
+        enterButton = _this$$props4.enterButton,
+        innerClass = _this$$props4.innerClass;
       var renderEnterButton = this.$scopedSlots.renderEnterButton;
-
       if (enterButton) {
         var getEnterButtonMarkup = function getEnterButtonMarkup() {
           if (renderEnterButton) {
             return renderEnterButton(_this4.enterButtonOnClick);
           }
-
           return h(Button, {
             "class": "enter-btn " + getClassName(innerClass, 'enter-button'),
             "attrs": {
@@ -855,23 +768,21 @@ var SearchBox = {
             }
           }, ["Search"]);
         };
-
         return h("div", {
           "class": "enter-button-wrapper"
         }, [getEnterButtonMarkup()]);
       }
-
       return null;
     },
     renderIcons: function renderIcons() {
       var h = this.$createElement;
       var _this$$props5 = this.$props,
-          iconPosition = _this$$props5.iconPosition,
-          showClear = _this$$props5.showClear,
-          innerClass = _this$$props5.innerClass,
-          getMicInstance = _this$$props5.getMicInstance,
-          showVoiceSearch = _this$$props5.showVoiceSearch,
-          showIcon = _this$$props5.showIcon;
+        iconPosition = _this$$props5.iconPosition,
+        showClear = _this$$props5.showClear,
+        innerClass = _this$$props5.innerClass,
+        getMicInstance = _this$$props5.getMicInstance,
+        showVoiceSearch = _this$$props5.showVoiceSearch,
+        showIcon = _this$$props5.showIcon;
       var renderMic = this.$scopedSlots.renderMic || this.$props.renderMic;
       var currentValue = this.$data.currentValue;
       return h("div", [h(IconGroup, {
@@ -911,49 +822,41 @@ var SearchBox = {
     },
     focusSearchBox: function focusSearchBox(event) {
       var _this$$refs, _this$$refs$this$$pro;
-
       var elt = event.target || event.srcElement;
       var tagName = elt.tagName;
-
       if (elt.isContentEditable || tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA') {
         // already in an input
         return;
       }
-
       (_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 _this5 = this;
-
       var _this$$props$focusSho = this.$props.focusShortcuts,
-          focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
-
+        focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
       if (isEmpty(focusShortcuts)) {
         return;
       }
+      var shortcutsString = parseFocusShortcuts(focusShortcuts).join(',');
 
-      var shortcutsString = parseFocusShortcuts(focusShortcuts).join(','); // handler for alphabets and other key combinations
-
-      hotkeys(shortcutsString, // eslint-disable-next-line no-unused-vars
-
+      // handler for alphabets and other key combinations
+      hotkeys(shortcutsString,
+      // eslint-disable-next-line no-unused-vars
       /* eslint-disable no-shadow */
       function (event, handler) {
         // Prevent the default refresh event under WINDOWS system
         event.preventDefault();
-
         _this5.focusSearchBox(event);
-      }); // if one of modifier keys are used, they are handled below
+      });
 
+      // if one of modifier keys are used, they are handled below
       hotkeys('*', function (event) {
         var modifierKeys = extractModifierKeysFromFocusShortcuts(focusShortcuts);
         if (modifierKeys.length === 0) return;
-
         for (var index = 0; index < modifierKeys.length; index += 1) {
           var element = modifierKeys[index];
-
           if (hotkeys[element]) {
             _this5.focusSearchBox(event);
-
             break;
           }
         }
@@ -967,17 +870,12 @@ var SearchBox = {
     },
     renderAutoFill: function renderAutoFill(suggestion) {
       var _this6 = this;
-
       var h = this.$createElement;
-
       var handleAutoFillClick = function handleAutoFillClick(e) {
         e.stopPropagation();
-
         _this6.onAutofillClick(suggestion);
       };
       /* 👇 avoid showing autofill for category suggestions👇 */
-
-
       return suggestion._category ? null : h(AutoFillSvg, {
         "on": {
           "click": handleAutoFillClick
@@ -986,7 +884,6 @@ var SearchBox = {
     },
     renderTag: function renderTag(item) {
       var _this7 = this;
-
       var h = this.$createElement;
       var innerClass = this.$props.innerClass;
       return h(TagItem, {
@@ -1007,7 +904,6 @@ var SearchBox = {
     clearAllTags: function clearAllTags() {
       this.selectedTags = [];
       this.setValue('', true, this.$props, causes.SUGGESTION_SELECT);
-
       if (this.$props.value !== undefined) {
         this.$emit('change', this.selectedTags, this.triggerQuery);
       }
@@ -1017,20 +913,16 @@ var SearchBox = {
         return tag !== tagValue;
       }));
       this.setValue('', true, this.$props, causes.SUGGESTION_SELECT);
-
       if (this.$props.value !== undefined) {
         this.$emit('change', this.selectedTags, this.triggerQuery);
       }
     },
     renderTags: function renderTags() {
       var _this8 = this;
-
       var h = this.$createElement;
-
       if (!Array.isArray(this.selectedTags)) {
         return null;
       }
-
       var tagsList = [].concat(this.selectedTags);
       var shouldRenderClearAllTag = tagsList.length > 1;
       var renderSelectedTags = this.$scopedSlots.renderSelectedTags || this.$props.renderSelectedTags;
@@ -1056,14 +948,13 @@ var SearchBox = {
   },
   render: function render() {
     var _this9 = this;
-
     var h = arguments[0];
     var _this$$props6 = this.$props,
-        theme = _this$$props6.theme,
-        expandSuggestionsContainer = _this$$props6.expandSuggestionsContainer;
+      theme = _this$$props6.theme,
+      expandSuggestionsContainer = _this$$props6.expandSuggestionsContainer;
     var _this$$scopedSlots = this.$scopedSlots,
-        recentSearchesIcon = _this$$scopedSlots.recentSearchesIcon,
-        popularSearchesIcon = _this$$scopedSlots.popularSearchesIcon;
+      recentSearchesIcon = _this$$scopedSlots.recentSearchesIcon,
+      popularSearchesIcon = _this$$scopedSlots.popularSearchesIcon;
     var hasSuggestions = Array.isArray(this.normalizedSuggestions) && this.normalizedSuggestions.length;
     var renderItem = this.$scopedSlots.renderItem || this.$props.renderItem;
     return h(Container, {
@@ -1080,27 +971,23 @@ var SearchBox = {
       "scopedSlots": {
         "default": function _default(_ref5) {
           var getInputEvents = _ref5.getInputEvents,
-              getInputProps = _ref5.getInputProps,
-              getItemProps = _ref5.getItemProps,
-              getItemEvents = _ref5.getItemEvents,
-              isOpen = _ref5.isOpen,
-              highlightedIndex = _ref5.highlightedIndex,
-              setHighlightedIndex = _ref5.setHighlightedIndex;
-
+            getInputProps = _ref5.getInputProps,
+            getItemProps = _ref5.getItemProps,
+            getItemEvents = _ref5.getItemEvents,
+            isOpen = _ref5.isOpen,
+            highlightedIndex = _ref5.highlightedIndex,
+            setHighlightedIndex = _ref5.setHighlightedIndex;
           var renderSuggestionsDropdown = function renderSuggestionsDropdown() {
             var getIcon = function getIcon(iconType) {
               switch (iconType) {
                 case suggestionTypes.Recent:
                   return recentSearchesIcon;
-
                 case suggestionTypes.Popular:
                   return popularSearchesIcon;
-
                 default:
                   return null;
               }
             };
-
             return h("div", [_this9.hasCustomRenderer && _this9.getComponent({
               isOpen: isOpen,
               getItemProps: getItemProps,
@@ -1154,7 +1041,6 @@ var SearchBox = {
               }), _this9.renderAutoFill(item)]);
             })]) : _this9.renderNoSuggestions(_this9.normalizedSuggestions)]);
           };
-
           return h("div", {
             "class": suggestionsContainer
           }, [h(InputGroup, [_this9.renderInputAddonBefore(), h(InputWrapper, [h(Input, {
@@ -1178,7 +1064,6 @@ var SearchBox = {
               onFocus: _this9.handleFocus,
               onKeyPress: function onKeyPress(e) {
                 _this9.$emit('keyPress', e, _this9.triggerQuery);
-
                 _this9.$emit('key-press', e, _this9.triggerQuery);
               },
               onKeyDown: function onKeyDown(e) {
@@ -1186,7 +1071,6 @@ var SearchBox = {
               },
               onKeyUp: function onKeyUp(e) {
                 _this9.$emit('keyUp', e, _this9.triggerQuery);
-
                 _this9.$emit('key-up', e, _this9.triggerQuery);
               },
               onClick: function onClick() {
@@ -1216,7 +1100,6 @@ var SearchBox = {
         },
         keypress: function keypress(e) {
           _this9.$emit('keyPress', e, _this9.triggerQuery);
-
           _this9.$emit('key-press', e, _this9.triggerQuery);
         },
         input: this.onInputChange,
@@ -1226,7 +1109,6 @@ var SearchBox = {
         keydown: this.handleKeyDown,
         keyup: function keyup(e) {
           _this9.$emit('keyUp', e, _this9.triggerQuery);
-
           _this9.$emit('key-up', e, _this9.triggerQuery);
         }
       }),
@@ -1241,7 +1123,6 @@ var SearchBox = {
     document.removeEventListener('keydown', this.onKeyDown);
   }
 };
-
 SearchBox.defaultQuery = function (value, props) {
   var finalQuery = null;
   var fields = normalizeDataField(props.dataField, props.fieldWeights);
@@ -1251,7 +1132,6 @@ SearchBox.defaultQuery = function (value, props) {
       minimum_should_match: '1'
     }
   };
-
   if (finalQuery && props.nestedField) {
     return {
       query: {
@@ -1262,23 +1142,18 @@ SearchBox.defaultQuery = function (value, props) {
       }
     };
   }
-
   return finalQuery;
 };
-
 SearchBox.shouldQuery = function (value, dataFields, props) {
   var finalQuery = [];
   var phrasePrefixFields = [];
   var fields = dataFields.map(function (dataField) {
     var queryField = "" + dataField.field + (dataField.weight ? "^" + dataField.weight : '');
-
     if (!(dataField.field.endsWith('.keyword') || dataField.field.endsWith('.autosuggest') || dataField.field.endsWith('.search'))) {
       phrasePrefixFields.push(queryField);
     }
-
     return queryField;
   });
-
   if (props.searchOperators || props.queryString) {
     return {
       query: value,
@@ -1286,7 +1161,6 @@ SearchBox.shouldQuery = function (value, dataFields, props) {
       default_operator: props.queryFormat
     };
   }
-
   if (props.queryFormat === 'and') {
     finalQuery.push({
       multi_match: {
@@ -1304,7 +1178,6 @@ SearchBox.shouldQuery = function (value, dataFields, props) {
         operator: 'and'
       }
     });
-
     if (phrasePrefixFields.length > 0) {
       finalQuery.push({
         multi_match: {
@@ -1315,10 +1188,8 @@ SearchBox.shouldQuery = function (value, dataFields, props) {
         }
       });
     }
-
     return finalQuery;
   }
-
   finalQuery.push({
     multi_match: {
       query: value,
@@ -1336,7 +1207,6 @@ SearchBox.shouldQuery = function (value, dataFields, props) {
       operator: 'or'
     }
   });
-
   if (phrasePrefixFields.length > 0) {
     finalQuery.push({
       multi_match: {
@@ -1347,10 +1217,8 @@ SearchBox.shouldQuery = function (value, dataFields, props) {
       }
     });
   }
-
   return finalQuery;
 };
-
 var mapStateToProps = function mapStateToProps(state, props) {
   return {
     selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
@@ -1367,7 +1235,6 @@ var mapStateToProps = function mapStateToProps(state, props) {
     hidden: state.hits[props.componentId] && state.hits[props.componentId].hidden
   };
 };
-
 var mapDispatchToProps = {
   updateQuery: updateQuery,
   setCustomQuery: setCustomQuery,
@@ -1378,25 +1245,23 @@ var SBConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps,
   componentType: componentTypes.searchBox,
   internalComponent: true
 }));
-
 SearchBox.install = function (Vue) {
   Vue.component(SearchBox.name, SBConnected);
-}; // Add componentType for SSR
-
-
+};
+// Add componentType for SSR
 SearchBox.componentType = componentTypes.searchBox;
 
 var _excluded = ["options"];
 var updateQuery$1 = Actions.updateQuery,
-    setQueryOptions = Actions.setQueryOptions,
-    setCustomQuery$1 = Actions.setCustomQuery,
-    setDefaultQuery$1 = Actions.setDefaultQuery;
+  setQueryOptions = Actions.setQueryOptions,
+  setCustomQuery$1 = Actions.setCustomQuery,
+  setDefaultQuery$1 = Actions.setDefaultQuery;
 var parseHits = helper.parseHits,
-    isEqual$1 = helper.isEqual,
-    getCompositeAggsQuery$1 = helper.getCompositeAggsQuery,
-    getResultStats$1 = helper.getResultStats,
-    extractQueryFromCustomQuery = helper.extractQueryFromCustomQuery,
-    getOptionsForCustomQuery = helper.getOptionsForCustomQuery;
+  isEqual$1 = helper.isEqual,
+  getCompositeAggsQuery$1 = helper.getCompositeAggsQuery,
+  getResultStats$1 = helper.getResultStats,
+  extractQueryFromCustomQuery = helper.extractQueryFromCustomQuery,
+  getOptionsForCustomQuery = helper.getOptionsForCustomQuery;
 var ReactiveComponent = {
   name: 'ReactiveComponent',
   props: {
@@ -1417,42 +1282,35 @@ var ReactiveComponent = {
   },
   created: function created() {
     var _this = this;
-
     var props = this.$props;
     this.internalComponent = null;
-    this.$defaultQuery = null; // Set custom query in store
-
+    this.$defaultQuery = null;
+    // Set custom query in store
     updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.selectedValue);
     var customQuery = props.customQuery,
-        componentId = props.componentId,
-        filterLabel = props.filterLabel,
-        showFilter = props.showFilter,
-        URLParams = props.URLParams,
-        distinctField = props.distinctField,
-        distinctFieldConfig = props.distinctFieldConfig,
-        index = props.index;
-
+      componentId = props.componentId,
+      filterLabel = props.filterLabel,
+      showFilter = props.showFilter,
+      URLParams = props.URLParams,
+      distinctField = props.distinctField,
+      distinctFieldConfig = props.distinctFieldConfig,
+      index = props.index;
     if (this.enableAppbase && this.aggregationField && this.aggregationField !== '') {
       console.warn('Warning(ReactiveSearch): The `aggregationField` prop has been marked as deprecated, please use the `distinctField` prop instead.');
     }
-
     if (!this.enableAppbase && (distinctField || distinctFieldConfig)) {
       console.warn('Warning(ReactiveSearch): In order to use the `distinctField` and `distinctFieldConfig` props, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
     }
-
     if (!this.enableAppbase && index) {
       console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
     }
-
     if (customQuery) {
       var calcCustomQuery = customQuery(this.selectedValue, props);
       var query = extractQueryFromCustomQuery(calcCustomQuery);
       var customQueryOptions = calcCustomQuery ? getOptionsForCustomQuery(calcCustomQuery) : null;
-
       if (customQueryOptions) {
         this.setQueryOptions(componentId, _extends({}, customQueryOptions, this.getAggsQuery()), false);
       } else this.setQueryOptions(componentId, this.getAggsQuery(), false);
-
       this.updateQuery({
         componentId: componentId,
         query: query,
@@ -1462,34 +1320,28 @@ var ReactiveComponent = {
         URLParams: URLParams
       });
     }
-
     this.setQuery = function (_ref) {
       var options = _ref.options,
-          obj = _objectWithoutPropertiesLoose(_ref, _excluded);
-
-      var queryToBeSet = obj.query; // when enableAppbase is true, Backend throws error because of repeated query in request body
+        obj = _objectWithoutPropertiesLoose(_ref, _excluded);
+      var queryToBeSet = obj.query;
 
+      // when enableAppbase is true, Backend throws error because of repeated query in request body
       if (queryToBeSet && queryToBeSet.query) {
         queryToBeSet = queryToBeSet.query;
       }
-
       var customQueryCalc = _extends({}, options, {
         query: queryToBeSet
       });
-
-      var rsAPIQuery = customQueryCalc; // handle stored queries
-
+      var rsAPIQuery = customQueryCalc;
+      // handle stored queries
       if (queryToBeSet && queryToBeSet.id) {
         rsAPIQuery = queryToBeSet;
-      } // Update customQuery field for RS API
-
-
+      }
+      // Update customQuery field for RS API
       _this.setCustomQuery(props.componentId, rsAPIQuery);
-
       if (options) {
         _this.setQueryOptions(props.componentId, _extends({}, _this.getAggsQuery(), options), false);
       }
-
       _this.updateQuery(_extends({}, obj, {
         query: customQueryCalc.query,
         componentId: props.componentId,
@@ -1498,23 +1350,17 @@ var ReactiveComponent = {
         URLParams: props.URLParams
       }));
     };
-
     if (props.defaultQuery) {
       this.internalComponent = props.componentId + "__internal";
     }
-
     if (this.internalComponent && this.$props.defaultQuery) {
       updateDefaultQuery(this.componentId, this.setDefaultQuery, this.$props, this.selectedValue);
       this.$defaultQuery = this.$props.defaultQuery(this.selectedValue, this.$props);
-
       var _query = extractQueryFromCustomQuery(this.$defaultQuery);
-
       var queryOptions = getOptionsForCustomQuery(this.$defaultQuery);
-
       if (queryOptions) {
         this.setQueryOptions(this.internalComponent, _extends({}, queryOptions, this.getAggsQuery()), false);
       } else this.setQueryOptions(this.internalComponent, this.getAggsQuery(), false);
-
       this.updateQuery({
         componentId: this.internalComponent,
         query: _query
@@ -1567,12 +1413,10 @@ var ReactiveComponent = {
         this.$defaultQuery = newVal(this.selectedValue, this.$props);
         var query = extractQueryFromCustomQuery(this.$defaultQuery);
         var queryOptions = getOptionsForCustomQuery(this.$defaultQuery);
-
         if (queryOptions) {
           this.setQueryOptions(this.internalComponent, _extends({}, queryOptions, this.getAggsQuery()), false);
-        } else this.setQueryOptions(this.internalComponent, this.getAggsQuery(), false); // Update default query for RS API
-
-
+        } else this.setQueryOptions(this.internalComponent, this.getAggsQuery(), false);
+        // Update default query for RS API
         updateDefaultQuery(this.componentId, this.setDefaultQuery, this.$props, this.selectedValue);
         this.updateQuery({
           componentId: this.internalComponent,
@@ -1586,12 +1430,11 @@ var ReactiveComponent = {
         this.$customQuery = newVal(this.selectedValue, this.$props);
         var query = extractQueryFromCustomQuery(this.$customQuery);
         var queryOptions = getOptionsForCustomQuery(this.$customQuery);
-
         if (queryOptions) {
           this.setQueryOptions(componentId, _extends({}, queryOptions, this.getAggsQuery()), false);
-        } else this.setQueryOptions(componentId, this.getAggsQuery(), false); // Update custom query for RS API
-
+        } else this.setQueryOptions(componentId, this.getAggsQuery(), false);
 
+        // Update custom query for RS API
         updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.selectedValue);
         this.updateQuery({
           componentId: componentId,
@@ -1602,13 +1445,11 @@ var ReactiveComponent = {
   },
   render: function render() {
     var h = arguments[0];
-
     try {
       var dom = this.$scopedSlots["default"];
       var error = this.error,
-          isLoading = this.isLoading,
-          selectedValue = this.selectedValue;
-
+        isLoading = this.isLoading,
+        selectedValue = this.selectedValue;
       var propsToBePassed = _extends({
         error: error,
         loading: isLoading
@@ -1616,7 +1457,6 @@ var ReactiveComponent = {
         value: selectedValue,
         setQuery: this.setQuery
       });
-
       return h("div", [dom(propsToBePassed)]);
     } catch (e) {
       return null;
@@ -1633,31 +1473,26 @@ var ReactiveComponent = {
           }).aggs
         };
       }
-
       return {};
     },
     getData: function getData() {
       var hits = this.hits,
-          aggregations = this.aggregations,
-          aggregationData = this.aggregationData,
-          promotedResults = this.promotedResults,
-          rawData = this.rawData;
+        aggregations = this.aggregations,
+        aggregationData = this.aggregationData,
+        promotedResults = this.promotedResults,
+        rawData = this.rawData;
       var filteredResults = parseHits(hits);
-
       if (promotedResults.length) {
         var ids = promotedResults.map(function (item) {
           return item._id;
         }).filter(Boolean);
-
         if (ids) {
           filteredResults = filteredResults.filter(function (item) {
             return !ids.includes(item._id);
           });
         }
-
         filteredResults = [].concat(promotedResults, filteredResults);
       }
-
       return {
         data: filteredResults,
         aggregationData: aggregationData,
@@ -1674,11 +1509,9 @@ var ReactiveComponent = {
     }
   }
 };
-
 ReactiveComponent.hasInternalComponent = function (props) {
   return !!props.defaultQuery;
 };
-
 var mapStateToProps$1 = function mapStateToProps(state, props) {
   return {
     aggregations: state.aggregations[props.componentId] && state.aggregations[props.componentId] || null,
@@ -1696,7 +1529,6 @@ var mapStateToProps$1 = function mapStateToProps(state, props) {
     enableAppbase: state.config.enableAppbase
   };
 };
-
 var mapDispatchtoProps = {
   setQueryOptions: setQueryOptions,
   updateQuery: updateQuery$1,
@@ -1710,64 +1542,50 @@ var RcConnected = PreferencesConsumer({
   name: 'RcConnected',
   render: function render(h) {
     var component = ConnectedComponent;
-
     switch (this.$attrs.componentType) {
       case componentTypes.reactiveList:
         component = RLConnected;
         break;
-
       case componentTypes.dataSearch:
         component = DSConnected;
         break;
-
       case componentTypes.searchBox:
         component = SBConnected;
         break;
       // list components
-
       case componentTypes.singleList:
         component = ListConnected$4;
         break;
-
       case componentTypes.multiList:
         component = ListConnected$3;
         break;
-
       case componentTypes.singleDropdownList:
         component = ListConnected$2;
         break;
-
       case componentTypes.multiDropdownList:
         component = ListConnected$1;
         break;
       // basic components
-
       case componentTypes.toggleButton:
         component = ListConnected;
         break;
       // range components
-
       case componentTypes.dynamicRangeSlider:
         component = RangeConnected$4;
         break;
-
       case componentTypes.singleRange:
         component = RangeConnected$3;
         break;
-
       case componentTypes.multiRange:
         component = RangeConnected$2;
         break;
-
       case componentTypes.rangeSlider:
         component = RangeConnected$1;
         break;
-
       case componentTypes.rangeInput:
         component = RangeConnected;
         break;
     }
-
     return h(component, {
       attrs: this.$attrs,
       on: this.$listeners,
@@ -1776,12 +1594,11 @@ var RcConnected = PreferencesConsumer({
     });
   }
 });
-
 ReactiveComponent.install = function (Vue) {
   Vue.component(ReactiveComponent.name, RcConnected);
-}; // Add componentType for SSR
-
+};
 
+// Add componentType for SSR
 ReactiveComponent.componentType = componentTypes.reactiveComponent;
 
 export { ReactiveComponent as R, SearchBox as S };