@appbaseio/reactivesearch-vue 1.24.3 → 1.27.0-gamma.1

package/dist/es/ReactiveBase.js

@@ -4,9 +4,9 @@ import VueTypes from 'vue-types';
 import '@appbaseio/reactivecore/lib/utils/constants';
 import { isEqual as isEqual$1 } from '@appbaseio/reactivecore/lib/utils/helper';
 import styled from '@appbaseio/vue-emotion';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import 'redux';
-import { c as connect, e as composeThemeObject, X as X_SEARCH_CLIENT } from './index-cb1950b6.js';
+import { c as connect, e as composeThemeObject, X as X_SEARCH_CLIENT } from './index-78920565.js';
 import _mergeJSXProps from '@vue/babel-helper-vue-jsx-merge-props';
 import { updateAnalyticsConfig } from '@appbaseio/reactivecore/lib/actions/analytics';
 import Appbase from 'appbase-js';
@@ -77,7 +77,7 @@ var URLParamsProvider = {
     headers: types.headers,
     getSearchParams: types.func,
     setSearchParams: types.func,
-    as: types.string.def('div')
+    as: VueTypes.string.def('div')
   },
   mounted: function mounted() {
     var _this = this;
@@ -225,7 +225,9 @@ var URLParamsProvider = {
         return value.map(function (item) {
           return _this3.getValue(item);
         });
-      } else if (value && typeof value === 'object') {
+      }
+
+      if (value && typeof value === 'object') {
         // TODO: support for NestedList
         if (value.location) return value;
         if (value.category) return value;

package/dist/es/ReactiveComponent.js

@@ -2,11 +2,11 @@ import { Actions, helper } from '@appbaseio/reactivecore';
 import { a as _extends, b as _objectWithoutPropertiesLoose } from './_rollupPluginBabelHelpers-0f24d612.js';
 import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, c as connect } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
+import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, c as connect } from './index-78920565.js';
+import { C as ComponentWrapper } from './ComponentWrapper-0f3431d1.js';
 
 var _excluded = ["options"],
     _excluded2 = ["query"],

package/dist/es/ReactiveList.js

@@ -7,11 +7,11 @@ import { css } from 'emotion';
 import styled from '@appbaseio/vue-emotion';
 import 'polished';
 import { p as pagination, B as Button } from './Button-91561391.js';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { c as connect, h as hasCustomRenderer, i as isQueryIdentical, u as updateDefaultQuery, a as isFunction, g as getComponent } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
+import { c as connect, h as hasCustomRenderer, i as isQueryIdentical, u as updateDefaultQuery, a as isFunction, g as getComponent } from './index-78920565.js';
+import { C as ComponentWrapper } from './ComponentWrapper-0f3431d1.js';
 import _mergeJSXProps from '@vue/babel-helper-vue-jsx-merge-props';
 import './Title-3522ff56.js';
 import { c as container } from './ListItem-8e8fb535.js';
@@ -486,9 +486,20 @@ var ReactiveList = {
     }
 
     this.internalComponent = this.$props.componentId + "__internal";
-    this.sortOptionIndex = this.defaultSortOption ? this.sortOptions.findIndex(function (s) {
-      return s.label === _this.defaultSortOption;
-    }) : 0;
+    this.sortOptionIndex = 0;
+
+    if (this.defaultSortOption && this.sortOptions && Array.isArray(this.sortOptions)) {
+      this.sortOptionIndex = this.sortOptions.findIndex(function (s) {
+        return s.label === _this.defaultSortOption;
+      });
+    }
+
+    if (this.urlSortOption) {
+      this.sortOptionIndex = this.$props.sortOptions.findIndex(function (s) {
+        return s.label === _this.urlSortOption;
+      }) || 0;
+    }
+
     this.updateComponentProps(this.componentId, {
       from: this.from
     }, componentTypes.reactiveList);
@@ -498,7 +509,7 @@ var ReactiveList = {
   },
   props: {
     currentPage: VueTypes.number.def(0),
-    includeFields: types.includeFields.def(['*']),
+    includeFields: types.includeFields,
     // component props
     className: types.string,
     componentId: types.stringRequired,
@@ -507,7 +518,7 @@ var ReactiveList = {
     aggregationSize: VueTypes.number,
     defaultQuery: types.func,
     defaultSortOption: types.string,
-    excludeFields: types.excludeFields.def([]),
+    excludeFields: types.excludeFields,
     innerClass: types.style,
     listClass: VueTypes.string.def(''),
     loader: types.title,
@@ -519,7 +530,7 @@ var ReactiveList = {
     pages: VueTypes.number.def(5),
     pagination: VueTypes.bool.def(false),
     infiniteScroll: VueTypes.bool.def(true),
-    paginationAt: types.paginationAt.def('bottom'),
+    paginationAt: VueTypes.oneOf(['top', 'bottom', 'both']).def('bottom'),
     react: types.react,
     scrollOnChange: VueTypes.bool.def(true),
     showResultStats: VueTypes.bool.def(true),
@@ -720,11 +731,11 @@ var ReactiveList = {
     var options = getQueryOptions(this.$props);
     options.from = this.$data.from;
 
-    if (this.$props.sortOptions) {
+    if (this.sortOptions && this.sortOptions[this.sortOptionIndex]) {
       var _ref2;
 
-      var sortField = this.$props.sortOptions[this.sortOptionIndex].dataField;
-      var sortBy = this.$props.sortOptions[this.sortOptionIndex].sortBy;
+      var sortField = this.sortOptions[this.sortOptionIndex].dataField;
+      var sortBy = this.sortOptions[this.sortOptionIndex].sortBy;
       options.sort = [(_ref2 = {}, _ref2[sortField] = {
         order: sortBy
       }, _ref2)]; // To handle sort options for RS API
@@ -794,10 +805,10 @@ var ReactiveList = {
       "class": this.$props.className
     }, [this.isLoading && this.shouldRenderPagination && this.showInfiniteScroll && (this.$scopedSlots.loader || this.$props.loader), this.renderErrorComponent(), h(Flex, {
       "attrs": {
-        "labelPosition": this.$props.sortOptions ? 'right' : 'left'
+        "labelPosition": this.sortOptions ? 'right' : 'left'
       },
       "class": getClassName$1(this.$props.innerClass, 'resultsInfo')
-    }, [this.$props.sortOptions ? this.renderSortOptions() : null, this.$props.showResultStats && results.length ? this.renderStats() : null]), !this.isLoading && results.length === 0 ? this.renderNoResult() : null, this.shouldRenderPagination && (this.$props.paginationAt === 'top' || this.$props.paginationAt === 'both') ? h(Pagination, {
+    }, [this.sortOptions ? this.renderSortOptions() : null, this.$props.showResultStats && results.length ? this.renderStats() : null]), !this.isLoading && hits && hits.length === 0 ? this.renderNoResult() : null, this.shouldRenderPagination && (this.$props.paginationAt === 'top' || this.$props.paginationAt === 'both') ? h(Pagination, {
       "attrs": {
         "pages": this.$props.pages,
         "totalPages": this.totalPages,
@@ -868,15 +879,18 @@ var ReactiveList = {
       var options = getQueryOptions(props);
       options.from = this.$data.from;
 
-      if (props.sortOptions) {
-        var _ref5;
-
+      if (props.sortOptions && Array.isArray(props.sortOptions)) {
         var sortOptionIndex = props.defaultSortOption ? props.sortOptions.findIndex(function (s) {
           return s.label === props.defaultSortOption;
         }) : 0;
-        options.sort = [(_ref5 = {}, _ref5[props.sortOptions[sortOptionIndex].dataField] = {
-          order: props.sortOptions[sortOptionIndex].sortBy
-        }, _ref5)];
+
+        if (props.sortOptions[sortOptionIndex]) {
+          var _ref5;
+
+          options.sort = [(_ref5 = {}, _ref5[props.sortOptions[sortOptionIndex].dataField] = {
+            order: props.sortOptions[sortOptionIndex].sortBy
+          }, _ref5)];
+        }
       } else if (props.sortBy) {
         var _ref6;
 
@@ -982,26 +996,32 @@ var ReactiveList = {
       }, [isFunction(renderNoResults) ? renderNoResults() : renderNoResults]);
     },
     handleSortChange: function handleSortChange(e) {
-      var _ref7;
+      var index = e.target.value;
 
-      var index = e.target.value; // This fixes issue #371 (where sorting a multi-result page with infinite loader breaks)
+      if (this.sortOptions && this.sortOptions[index]) {
+        var _ref7;
 
-      var options = getQueryOptions(this.$props);
-      options.from = 0;
-      var sortField = this.$props.sortOptions[index].dataField;
-      var sortBy = this.$props.sortOptions[index].sortBy;
-      options.sort = [(_ref7 = {}, _ref7[sortField] = {
-        order: sortBy
-      }, _ref7)];
-      this.sortOptionIndex = index; // To handle sort options for RS API
-
-      this.updateComponentProps(this.componentId, {
-        dataField: sortField,
-        sortBy: sortBy
-      }, componentTypes.reactiveList);
-      this.setQueryOptions(this.$props.componentId, options, true);
-      this.currentPageState = 0;
-      this.from = 0;
+        // This fixes issue #371 (where sorting a multi-result page with infinite loader breaks)
+        var options = getQueryOptions(this.$props);
+        options.from = 0;
+        var sortField = this.sortOptions[index].dataField;
+        var sortBy = this.sortOptions[index].sortBy;
+        options.sort = [(_ref7 = {}, _ref7[sortField] = {
+          order: sortBy
+        }, _ref7)];
+        this.sortOptionIndex = index; // To handle sort options for RS API
+
+        this.updateComponentProps(this.componentId, {
+          dataField: sortField,
+          sortBy: sortBy
+        }, componentTypes.reactiveList);
+        this.setQueryOptions(this.$props.componentId, options, true);
+        this.setPage(0);
+        this.currentPageState = 0;
+        this.from = 0;
+        var sortOption = this.$props.sortOptions[this.sortOptionIndex] ? this.$props.sortOptions[this.sortOptionIndex].label : null;
+        this.setPageURL(this.$props.componentId + "sortOption", sortOption, this.$props.componentId + "sortOption", false, this.$props.URLParams);
+      }
     },
     triggerClickAnalytics: function triggerClickAnalytics(searchPosition, documentId) {
       var docId = documentId;
@@ -1035,7 +1055,7 @@ var ReactiveList = {
         "domProps": {
           "value": this.sortOptionIndex
         }
-      }, [this.$props.sortOptions.map(function (sort, index) {
+      }, [this.sortOptions.map(function (sort, index) {
         return h("option", {
           "key": sort.label,
           "domProps": {
@@ -1112,6 +1132,7 @@ var ReactiveList = {
 var mapStateToProps = function mapStateToProps(state, props) {
   return {
     defaultPage: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value - 1,
+    urlSortOption: state.selectedValues[props.componentId + "sortOption"] && state.selectedValues[props.componentId + "sortOption"].value,
     hits: state.hits[props.componentId] && state.hits[props.componentId].hits,
     rawData: state.rawData[props.componentId],
     aggregationData: state.compositeAggregations[props.componentId],
@@ -1141,11 +1162,7 @@ var mapDispatchtoProps = {
 }; // Only used for SSR
 
 ReactiveList.generateQueryOptions = function (props) {
-  // simulate default (includeFields and excludeFields) props to generate consistent query
-  var options = getQueryOptions(_extends({
-    includeFields: ['*'],
-    excludeFields: []
-  }, props));
+  var options = getQueryOptions(props);
   var size = props.size,
       dataField = props.dataField,
       defaultSortOption = props.defaultSortOption,

package/dist/es/ResultCard.js

@@ -3,7 +3,7 @@ import VueTypes from 'vue-types';
 import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import _mergeJSXProps from '@vue/babel-helper-vue-jsx-merge-props';
 import { T as Title } from './Title-3522ff56.js';
 import { I as Image, C as Card } from './Card-6446f1b7.js';

package/dist/es/ResultList.js

@@ -3,7 +3,7 @@ import VueTypes from 'vue-types';
 import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import _mergeJSXProps from '@vue/babel-helper-vue-jsx-merge-props';
 import { T as Title } from './Title-3522ff56.js';
 import { I as Image, L as ListItem } from './ListItem-8e8fb535.js';

package/dist/es/SelectedFilters.js

@@ -6,9 +6,9 @@ import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
 import { f as filters, B as Button } from './Button-91561391.js';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import 'redux';
-import { c as connect } from './index-cb1950b6.js';
+import { c as connect } from './index-78920565.js';
 import { T as Title } from './Title-3522ff56.js';
 import { C as Container } from './Container-18b03fde.js';
 
@@ -25,7 +25,8 @@ var SelectedFilters = {
     innerClass: types.style,
     showClearAll: VueTypes.bool.def(true),
     title: types.title,
-    resetToDefault: VueTypes.bool.def(false)
+    resetToDefault: VueTypes.bool.def(false),
+    resetToValues: VueTypes.object
   },
   inject: {
     theme: {
@@ -78,15 +79,16 @@ var SelectedFilters = {
       this.$emit('clear', component, value);
     },
     clearValues: function clearValues() {
-      var resetToDefault = this.resetToDefault;
+      var resetToDefault = this.resetToDefault,
+          resetToValues = this.resetToValues;
 
       if (resetToDefault) {
         this.resetValuesToDefault();
       } else {
-        this.clearValuesAction();
+        this.clearValuesAction(resetToValues);
       }
 
-      this.$emit('clear', null);
+      this.$emit('clear', resetToValues);
     },
     renderValue: function renderValue(value, isArray) {
       var _this2 = this;

package/dist/es/SingleDropdownList.js

@@ -6,18 +6,20 @@ import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
 import { l as loadMoreContainer, B as Button } from './Button-91561391.js';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, g as getComponent, h as hasCustomRenderer, c as connect } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
+import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, g as getComponent, h as hasCustomRenderer, c as connect } from './index-78920565.js';
+import { C as ComponentWrapper } from './ComponentWrapper-0f3431d1.js';
+import '@vue/babel-helper-vue-jsx-merge-props';
 import { T as Title } from './Title-3522ff56.js';
-import './Input-08bb1bcf.js';
+import './CancelSvg-c2c03a35.js';
+import './Input-10b1d62d.js';
 import 'compute-scroll-into-view';
-import './DownShift-3558d402.js';
 import { C as Container } from './Container-18b03fde.js';
+import '@appbaseio/reactivecore/lib/utils/suggestions';
 import { g as getAggsQuery } from './utils-64a2e5f0.js';
-import { D as Dropdown } from './DropDown-035c804f.js';
+import { D as Dropdown } from './DropDown-0dd8f2a3.js';
 
 var updateQuery = Actions.updateQuery,
     setQueryOptions = Actions.setQueryOptions,
@@ -73,10 +75,12 @@ var SingleDropdownList = {
     showMissing: VueTypes.bool.def(false),
     missingLabel: VueTypes.string.def('N/A'),
     showSearch: VueTypes.bool.def(false),
+    showClear: VueTypes.bool.def(false),
     showLoadMore: VueTypes.bool.def(false),
     loadMoreLabel: VueTypes.oneOfType([VueTypes.string, VueTypes.any]).def('Load More'),
     nestedField: types.string,
-    index: VueTypes.string
+    index: VueTypes.string,
+    searchPlaceholder: VueTypes.string.def('Type here to search...')
   },
   created: function created() {
     if (!this.enableAppbase && this.$props.index) {
@@ -190,7 +194,9 @@ var SingleDropdownList = {
     if (!this.hasCustomRenderer && this.$data.modifiedOptions.length === 0 && !this.isLoading) {
       if (renderNoResults && isFunction(renderNoResults)) {
         return h("div", [renderNoResults()]);
-      } else if (renderNoResults && !isFunction(renderNoResults)) {
+      }
+
+      if (renderNoResults && !isFunction(renderNoResults)) {
         return renderNoResults;
       }
 
@@ -228,6 +234,8 @@ var SingleDropdownList = {
         "renderNoResults": this.$scopedSlots.renderNoResults || this.$props.renderNoResults,
         "themePreset": this.themePreset,
         "showSearch": this.$props.showSearch,
+        "showClear": this.$props.showClear,
+        "searchPlaceholder": this.$props.searchPlaceholder,
         "transformData": this.$props.transformData,
         "footer": showLoadMore && !isLastBucket && h("div", {
           "attrs": {
@@ -287,7 +295,7 @@ var SingleDropdownList = {
         updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
       }
 
-      this.setQueryOptions(this.internalComponent, defaultQueryOptions);
+      this.setQueryOptions(this.internalComponent, defaultQueryOptions, false);
       this.updateQuery({
         componentId: this.internalComponent,
         query: query,
@@ -308,7 +316,7 @@ var SingleDropdownList = {
         updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
       }
 
-      this.setQueryOptions(props.componentId, customQueryOptions);
+      this.setQueryOptions(props.componentId, customQueryOptions, false);
       this.updateQuery({
         componentId: props.componentId,
         query: query,

package/dist/es/SingleList.js

@@ -5,14 +5,15 @@ import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, g as getComponent, n as isEvent, h as hasCustomRenderer, c as connect } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
+import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, g as getComponent, n as isEvent, h as hasCustomRenderer, c as connect } from './index-78920565.js';
+import { C as ComponentWrapper } from './ComponentWrapper-0f3431d1.js';
 import { T as Title } from './Title-3522ff56.js';
-import { I as Input } from './Input-08bb1bcf.js';
+import { I as Input } from './Input-10b1d62d.js';
 import { C as Container } from './Container-18b03fde.js';
+import { replaceDiacritics } from '@appbaseio/reactivecore/lib/utils/suggestions';
 import { U as UL, R as Radio } from './FormControlList-704f8dee.js';
 import { g as getAggsQuery } from './utils-64a2e5f0.js';
 
@@ -29,7 +30,7 @@ var SingleList = {
   name: 'SingleList',
   props: {
     beforeValueChange: types.func,
-    className: types.string.def(''),
+    className: VueTypes.string.def(''),
     componentId: types.stringRequired,
     customQuery: types.func,
     dataField: types.stringRequired,
@@ -49,7 +50,7 @@ var SingleList = {
     showFilter: VueTypes.bool.def(true),
     showRadio: VueTypes.bool.def(true),
     showSearch: VueTypes.bool.def(true),
-    size: VueTypes.number.def(100),
+    size: VueTypes.number,
     sortBy: VueTypes.oneOf(['asc', 'desc', 'count']).def('count'),
     title: types.title,
     URLParams: VueTypes.bool.def(false),
@@ -163,7 +164,7 @@ var SingleList = {
     var filteredItemsToRender = itemsToRender.filter(function (item) {
       if (String(item.key).length) {
         if (_this.$props.showSearch && _this.$data.searchTerm) {
-          return String(item.key).toLowerCase().includes(_this.$data.searchTerm.toLowerCase());
+          return replaceDiacritics(String(item.key)).toLowerCase().includes(replaceDiacritics(_this.$data.searchTerm.toLowerCase()));
         }
 
         return true;
@@ -276,7 +277,7 @@ var SingleList = {
         updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
       }
 
-      this.setQueryOptions(this.internalComponent, defaultQueryOptions);
+      this.setQueryOptions(this.internalComponent, defaultQueryOptions, false);
       this.updateQuery({
         componentId: this.internalComponent,
         query: query,
@@ -297,7 +298,7 @@ var SingleList = {
         updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
       }
 
-      this.setQueryOptions(props.componentId, customQueryOptions);
+      this.setQueryOptions(props.componentId, customQueryOptions, false);
       this.updateQuery({
         componentId: props.componentId,
         query: query,

package/dist/es/SingleRange.js

@@ -5,11 +5,11 @@ import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
+import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-78920565.js';
+import { C as ComponentWrapper } from './ComponentWrapper-0f3431d1.js';
 import { T as Title } from './Title-3522ff56.js';
 import { C as Container } from './Container-18b03fde.js';
 import { U as UL, R as Radio } from './FormControlList-704f8dee.js';
@@ -160,7 +160,7 @@ var SingleRange = {
         updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.currentValue);
       }
 
-      this.setQueryOptions(props.componentId, customQueryOptions);
+      this.setQueryOptions(props.componentId, customQueryOptions, false);
       this.updateQuery({
         componentId: props.componentId,
         query: query,

package/dist/es/StateProvider.js

@@ -3,12 +3,16 @@ import { a as _extends } from './_rollupPluginBabelHelpers-0f24d612.js';
 import VueTypes from 'vue-types';
 import '@appbaseio/reactivecore/lib/utils/constants';
 import 'redux';
-import { c as connect } from './index-cb1950b6.js';
+import { c as connect } from './index-78920565.js';
 
 var getSearchState = helper.getSearchState;
 var defaultKeys = ['hits', 'value', 'aggregations', 'error'];
 
 var filterProps = function filterProps(props) {
+  if (props === void 0) {
+    props = {};
+  }
+
   return _extends({}, props, {
     props: props.componentProps
   });
@@ -28,7 +32,7 @@ var filterByComponentIds = function filterByComponentIds(state, props) {
     return _ref = {}, _ref[componentIds] = state[componentIds], _ref;
   }
 
-  if (componentIds instanceof Array) {
+  if (Array.isArray(componentIds)) {
     var filteredState = {};
     componentIds.forEach(function (componentId) {
       filteredState[componentId] = state[componentId];
@@ -67,7 +71,7 @@ var StateProvider = {
     };
     return this.__state;
   },
-  mounted: function mounted() {
+  created: function created() {
     this.searchState = filterByKeys(getSearchState(filterProps(this.searchStateProps)), this.includeKeys);
   },
   computed: {

package/dist/es/ToggleButton.js

@@ -6,11 +6,11 @@ import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
 import { B as Button, t as toggleButtons } from './Button-91561391.js';
-import { t as types } from './vueTypes-fb61bb7b.js';
+import { t as types } from './vueTypes-687b2304.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
+import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-78920565.js';
+import { C as ComponentWrapper } from './ComponentWrapper-0f3431d1.js';
 import { T as Title } from './Title-3522ff56.js';
 import { C as Container } from './Container-18b03fde.js';
 
@@ -28,7 +28,7 @@ var ToggleButton = {
     componentId: types.stringRequired,
     data: types.data,
     dataField: types.stringRequired,
-    defaultValue: types.stringOrArray,
+    defaultValue: types.any,
     value: types.stringOrArray,
     filterLabel: types.string,
     nestedField: types.string,
@@ -186,7 +186,7 @@ var ToggleButton = {
         var _ref = customQuery(value, props) || {};
 
         query = _ref.query;
-        this.setQueryOptions(props.componentId, getOptionsFromQuery(customQuery(value, props)));
+        this.setQueryOptions(props.componentId, getOptionsFromQuery(customQuery(value, props)), false);
         updateCustomQuery(props.componentId, this.setCustomQuery, props, value);
       }
 

package/dist/es/{index-cb1950b6.js → index-78920565.js}

@@ -155,10 +155,16 @@ var isFunction = function isFunction(element) {
 }; // parses current array (i.e. this.$props.value) for `onChange` callback for multi-* components
 
 function parseValueArray(objectValues, currentValue) {
-  var keys = Object.keys(objectValues);
-  var selectedValues = keys.map(function (key) {
-    return objectValues[key] ? key : null;
-  });
+  var selectedValues;
+
+  if (Array.isArray(objectValues)) {
+    selectedValues = [].concat(objectValues);
+  } else {
+    var keys = Object.keys(objectValues);
+    selectedValues = keys.map(function (key) {
+      return objectValues[key] ? key : null;
+    });
+  }
 
   if (selectedValues.includes(currentValue)) {
     return selectedValues.filter(function (item) {

package/dist/es/index.js

@@ -7,12 +7,12 @@ import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
 import './Button-91561391.js';
-import './vueTypes-fb61bb7b.js';
+import './vueTypes-687b2304.js';
 export { default as ReactiveList } from './ReactiveList.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import './index-cb1950b6.js';
-import './ComponentWrapper-4f85a67e.js';
+import './index-78920565.js';
+import './ComponentWrapper-0f3431d1.js';
 import '@vue/babel-helper-vue-jsx-merge-props';
 import './Title-3522ff56.js';
 import './ListItem-8e8fb535.js';
@@ -23,17 +23,20 @@ import 'appbase-js';
 import 'url-search-params-polyfill';
 export { default as ReactiveBase } from './ReactiveBase.js';
 import 'hotkeys-js';
-export { default as DataSearch } from './DataSearch.js';
-import './Input-08bb1bcf.js';
+export { D as DataSearch } from './DataSearch-77325036.js';
+import './CancelSvg-c2c03a35.js';
+import './Input-10b1d62d.js';
 import 'compute-scroll-into-view';
-import './DownShift-3558d402.js';
 import './Container-18b03fde.js';
 import 'vue-highlight-words';
+import { i as install } from './install-86388b0e.js';
+export { S as SearchBox, i as install } from './install-86388b0e.js';
+import '@appbaseio/reactivecore/lib/utils/suggestions';
 import './FormControlList-704f8dee.js';
 import './utils-64a2e5f0.js';
 export { default as SingleList } from './SingleList.js';
 export { default as MultiList } from './MultiList.js';
-import './DropDown-035c804f.js';
+import './DropDown-0dd8f2a3.js';
 export { default as SingleDropdownList } from './SingleDropdownList.js';
 export { default as MultiDropdownList } from './MultiDropdownList.js';
 export { default as ToggleButton } from './ToggleButton.js';
@@ -44,13 +47,15 @@ export { default as MultiRange } from './MultiRange.js';
 export { default as ResultCard } from './ResultCard.js';
 export { default as ResultList } from './ResultList.js';
 import 'vue-no-ssr';
-import './ssr-5d255b08.js';
+import './ssr-a41dfea9.js';
 export { default as RangeSlider } from './RangeSlider.js';
 export { default as DynamicRangeSlider } from './DynamicRangeSlider.js';
 export { default as StateProvider } from './StateProvider.js';
 import '@appbaseio/reactivecore/lib/reducers/valueReducer';
 import '@appbaseio/reactivecore/lib/reducers/queryReducer';
 import '@appbaseio/reactivecore/lib/reducers/queryOptionsReducer';
+import '@appbaseio/reactivecore/lib/reducers/compositeAggsReducer';
+import '@appbaseio/reactivecore/lib/constants';
 import '@appbaseio/reactivecore/lib/reducers/dependencyTreeReducer';
 import '@appbaseio/reactivecore/lib/utils/graphQL';
 import '@appbaseio/reactivecore/lib/actions/utils';
@@ -58,8 +63,6 @@ export { default as initReactivesearch } from './initReactivesearch.js';
 import version from './version.js';
 export { default as version } from './version.js';
 export { default as RangeInput } from './RangeInput.js';
-import install from './install.js';
-export { default as install } from './install.js';
 
 // Add polyfills to support in IE