@appbaseio/reactivesearch-vue 1.16.0-alpha.4 → 1.16.0-alpha.42

package/dist/es/SingleList.js

@@ -1,20 +1,21 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
-import { a as _extends } from './_rollupPluginBabelHelpers-c9fbe19f.js';
+import { a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
 import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-98d938a9.js';
+import { t as types } from './vueTypes-9326e0be.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, l as isEvent, h as hasCustomRenderer, c as connect } from './index-1fe91a0a.js';
-import { C as ComponentWrapper } from './ComponentWrapper-d0b21b95.js';
-import { T as Title } from './Title-22c2f3bf.js';
-import { I as Input } from './Input-dfd9dd40.js';
-import { C as Container } from './Container-f5efec9e.js';
-import { U as UL, R as Radio } from './FormControlList-b96aebef.js';
-import { g as getAggsQuery } from './utils-ce3d86fd.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-5daa8276.js';
+import { C as ComponentWrapper } from './ComponentWrapper-bbb717bc.js';
+import { T as Title } from './Title-579f8d6c.js';
+import { I as Input } from './Input-d8519224.js';
+import { C as Container } from './Container-4383c6f0.js';
+import { replaceDiacritics } from '@appbaseio/reactivecore/lib/utils/suggestions';
+import { U as UL, R as Radio } from './FormControlList-fe389a2e.js';
+import { g as getAggsQuery } from './utils-3a32e13f.js';
 
 var updateQuery = Actions.updateQuery,
     setQueryOptions = Actions.setQueryOptions,
@@ -23,13 +24,14 @@ var updateQuery = Actions.updateQuery,
 var getQueryOptions = helper.getQueryOptions,
     checkValueChange = helper.checkValueChange,
     getClassName = helper.getClassName,
-    getOptionsFromQuery = helper.getOptionsFromQuery,
-    isEqual = helper.isEqual;
+    isEqual = helper.isEqual,
+    extractQueryFromCustomQuery = helper.extractQueryFromCustomQuery,
+    getOptionsForCustomQuery = helper.getOptionsForCustomQuery;
 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,27 +51,34 @@ 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),
     showMissing: VueTypes.bool.def(false),
     missingLabel: VueTypes.string.def('N/A'),
     nestedField: types.string,
+    index: VueTypes.string,
     enableStrictSelection: VueTypes.bool.def(false)
   },
   data: function data() {
     var props = this.$props;
     this.__state = {
       currentValue: '',
-      modifiedOptions: props.options && props.options[props.dataField] ? props.options[props.dataField].buckets : [],
+      modifiedOptions: [],
       searchTerm: ''
     };
     this.internalComponent = props.componentId + "__internal";
     return this.__state;
   },
   created: function created() {
-    // Set custom and default queries in store
+    if (!this.enableAppbase && this.$props.index) {
+      console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
+    }
+
+    var props = this.$props;
+    this.modifiedOptions = this.options && this.options[props.dataField] ? this.options[props.dataField].buckets : []; // Set custom and default queries in store
+
     updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.currentValue);
     updateDefaultQuery(this.componentId, this.setDefaultQuery, this.$props, this.currentValue);
   },
@@ -86,7 +95,9 @@ var SingleList = {
   },
   watch: {
     options: function options(newVal) {
-      this.modifiedOptions = newVal[this.$props.dataField] ? newVal[this.$props.dataField].buckets : [];
+      if (newVal) {
+        this.modifiedOptions = newVal[this.$props.dataField] ? newVal[this.$props.dataField].buckets : [];
+      }
     },
     size: function size() {
       this.updateQueryHandlerOptions(this.$props);
@@ -129,8 +140,7 @@ var SingleList = {
     var _this$$props = this.$props,
         selectAllLabel = _this$$props.selectAllLabel,
         renderItem = _this$$props.renderItem,
-        renderError = _this$$props.renderError,
-        enableStrictSelection = _this$$props.enableStrictSelection;
+        renderError = _this$$props.renderError;
     var renderItemCalc = this.$scopedSlots.renderItem || renderItem;
     var renderErrorCalc = this.$scopedSlots.renderError || renderError;
 
@@ -138,8 +148,12 @@ var SingleList = {
       return isFunction(renderErrorCalc) ? renderErrorCalc(this.error) : renderErrorCalc;
     }
 
-    if (!this.hasCustomRenderer && this.modifiedOptions.length === 0) {
-      return null;
+    if (!this.hasCustomRenderer && this.modifiedOptions.length === 0 && !this.isLoading) {
+      if (this.renderNoResult) {
+        this.renderNoResult();
+      } else {
+        return null;
+      }
     }
 
     var itemsToRender = this.$data.modifiedOptions;
@@ -151,7 +165,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;
@@ -203,9 +217,7 @@ var SingleList = {
           "show": _this.$props.showRadio
         },
         "on": {
-          "click": _this.$data.currentValue === String(item.key) && enableStrictSelection ? function () {
-            return false;
-          } : _this.handleClick
+          "click": _this.handleClick
         },
         "domProps": _extends({}, {
           checked: _this.currentValue === String(item.key)
@@ -256,17 +268,18 @@ var SingleList = {
 
       if (this.defaultQuery) {
         var defaultQueryToBeSet = this.defaultQuery(value, props) || {};
+        var defaultQueryObj = extractQueryFromCustomQuery(defaultQueryToBeSet);
 
-        if (defaultQueryToBeSet.query) {
-          query = defaultQueryToBeSet.query;
+        if (defaultQueryObj) {
+          query = defaultQueryObj;
         }
 
-        defaultQueryOptions = getOptionsFromQuery(defaultQueryToBeSet); // Update calculated default query in store
+        defaultQueryOptions = getOptionsForCustomQuery(defaultQueryToBeSet); // Update calculated default query in store
 
         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,
@@ -280,14 +293,13 @@ var SingleList = {
       var customQueryOptions;
 
       if (customQuery) {
-        var _ref = customQuery(value, props) || {};
-
-        query = _ref.query;
-        customQueryOptions = getOptionsFromQuery(customQuery(value, props));
+        var customQueryCalc = customQuery(value, props);
+        query = extractQueryFromCustomQuery(customQueryCalc);
+        customQueryOptions = getOptionsForCustomQuery(customQueryCalc);
         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,
@@ -307,8 +319,8 @@ var SingleList = {
 
       if (props.defaultQuery) {
         var value = this.$data.currentValue;
-        var defaultQueryOptions = getOptionsFromQuery(props.defaultQuery(value, props));
-        this.setQueryOptions(this.internalComponent, _extends(_extends({}, queryOptions), defaultQueryOptions));
+        var defaultQueryOptions = getOptionsForCustomQuery(props.defaultQuery(value, props));
+        this.setQueryOptions(this.internalComponent, _extends({}, queryOptions, defaultQueryOptions));
       } else {
         this.setQueryOptions(this.internalComponent, queryOptions);
       }
@@ -367,6 +379,10 @@ var SingleList = {
         currentValue = e.target.value;
       }
 
+      if (this.enableStrictSelection && currentValue === this.currentValue) {
+        return false;
+      }
+
       var value = this.$props.value;
 
       if (value === undefined) {
@@ -374,6 +390,8 @@ var SingleList = {
       } else {
         this.$emit('change', currentValue);
       }
+
+      return true;
     },
     renderNoResult: function renderNoResult() {
       var h = this.$createElement;
@@ -446,6 +464,10 @@ SingleList.defaultQuery = function (value, props) {
   return query;
 };
 
+SingleList.hasInternalComponent = function () {
+  return true;
+};
+
 var mapStateToProps = function mapStateToProps(state, props) {
   return {
     options: props.nestedField && state.aggregations[props.componentId] ? state.aggregations[props.componentId].reactivesearch_nested : state.aggregations[props.componentId],
@@ -454,7 +476,8 @@ var mapStateToProps = function mapStateToProps(state, props) {
     selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || '',
     themePreset: state.config.themePreset,
     error: state.error[props.componentId],
-    componentProps: state.props[props.componentId]
+    componentProps: state.props[props.componentId],
+    enableAppbase: state.config.enableAppbase
   };
 };
 
@@ -466,7 +489,7 @@ var mapDispatchtoProps = {
 };
 var ListConnected = ComponentWrapper(connect(mapStateToProps, mapDispatchtoProps)(SingleList), {
   componentType: componentTypes.singleList,
-  internalComponent: true
+  internalComponent: SingleList.hasInternalComponent()
 });
 
 SingleList.install = function (Vue) {

package/dist/es/SingleRange.js

@@ -1,18 +1,18 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
-import './_rollupPluginBabelHelpers-c9fbe19f.js';
+import './_rollupPluginBabelHelpers-ecf6c03c.js';
 import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-98d938a9.js';
+import { t as types } from './vueTypes-9326e0be.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-1fe91a0a.js';
-import { C as ComponentWrapper } from './ComponentWrapper-d0b21b95.js';
-import { T as Title } from './Title-22c2f3bf.js';
-import { C as Container } from './Container-f5efec9e.js';
-import { U as UL, R as Radio } from './FormControlList-b96aebef.js';
+import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-5daa8276.js';
+import { C as ComponentWrapper } from './ComponentWrapper-bbb717bc.js';
+import { T as Title } from './Title-579f8d6c.js';
+import { C as Container } from './Container-4383c6f0.js';
+import { U as UL, R as Radio } from './FormControlList-fe389a2e.js';
 
 var updateQuery = Actions.updateQuery,
     setQueryOptions = Actions.setQueryOptions,
@@ -46,10 +46,15 @@ var SingleRange = {
     showRadio: VueTypes.bool.def(true),
     title: types.title,
     URLParams: VueTypes.bool.def(false),
-    nestedField: types.string
+    nestedField: types.string,
+    index: VueTypes.string
   },
   created: function created() {
-    // Set custom query in store
+    if (!this.enableAppbase && this.$props.index) {
+      console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
+    } // Set custom query in store
+
+
     updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.currentValue);
   },
   beforeMount: function beforeMount() {
@@ -155,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,
@@ -216,7 +221,8 @@ SingleRange.defaultQuery = function (value, props) {
 var mapStateToProps = function mapStateToProps(state, props) {
   return {
     selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
-    componentProps: state.props[props.componentId]
+    componentProps: state.props[props.componentId],
+    enableAppbase: state.config.enableAppbase
   };
 };
 

package/dist/es/StateProvider.js

@@ -1,15 +1,19 @@
 import { helper } from '@appbaseio/reactivecore';
-import { a as _extends } from './_rollupPluginBabelHelpers-c9fbe19f.js';
+import { a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
 import VueTypes from 'vue-types';
 import '@appbaseio/reactivecore/lib/utils/constants';
 import 'redux';
-import { c as connect } from './index-1fe91a0a.js';
+import { c as connect } from './index-5daa8276.js';
 
 var getSearchState = helper.getSearchState;
 var defaultKeys = ['hits', 'value', 'aggregations', 'error'];
 
 var filterProps = function filterProps(props) {
-  return _extends(_extends({}, 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];
@@ -43,7 +47,7 @@ var filterByKeys = function filterByKeys(state, allowedKeys) {
   return Object.keys(state).reduce(function (components, componentId) {
     var _extends2;
 
-    return _extends(_extends({}, components), {}, (_extends2 = {}, _extends2[componentId] = Object.keys(state[componentId]).filter(function (key) {
+    return _extends({}, components, (_extends2 = {}, _extends2[componentId] = Object.keys(state[componentId]).filter(function (key) {
       return allowedKeys.includes(key);
     }).reduce(function (obj, key) {
       // eslint-disable-next-line
@@ -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: {
@@ -89,7 +93,7 @@ var StateProvider = {
   watch: {
     searchState: function searchState(newVal, oldVal) {
       if (this.isStateChanged(newVal, oldVal)) {
-        this.$emit('change', newVal, oldVal);
+        this.$emit('change', oldVal, newVal);
       }
     },
     selectedValues: function selectedValues(newVal, oldVal) {

package/dist/es/Title-579f8d6c.js

@@ -0,0 +1,10 @@
+import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ecf6c03c.js';
+import styled from '@appbaseio/vue-emotion';
+
+var _templateObject;
+var Title = styled('h2')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\tmargin: 0 0 8px;\n\tfont-size: 1rem;\n\tcolor: ", ";\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.colors.titleColor;
+});
+
+export { Title as T };

package/dist/es/ToggleButton.js

@@ -1,18 +1,18 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
-import './_rollupPluginBabelHelpers-c9fbe19f.js';
-import 'vue-types';
+import './_rollupPluginBabelHelpers-ecf6c03c.js';
+import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { B as Button, t as toggleButtons } from './Button-6c71c66e.js';
-import { t as types } from './vueTypes-98d938a9.js';
+import { B as Button, t as toggleButtons } from './Button-799185e2.js';
+import { t as types } from './vueTypes-9326e0be.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-1fe91a0a.js';
-import { C as ComponentWrapper } from './ComponentWrapper-d0b21b95.js';
-import { T as Title } from './Title-22c2f3bf.js';
-import { C as Container } from './Container-f5efec9e.js';
+import { f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-5daa8276.js';
+import { C as ComponentWrapper } from './ComponentWrapper-bbb717bc.js';
+import { T as Title } from './Title-579f8d6c.js';
+import { C as Container } from './Container-4383c6f0.js';
 
 var updateQuery = Actions.updateQuery,
     setQueryOptions = Actions.setQueryOptions,
@@ -28,17 +28,19 @@ 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,
     innerClass: types.style,
-    multiSelect: types.bool,
+    multiSelect: VueTypes.bool,
     react: types.react,
-    showFilter: types.bool,
+    showFilter: VueTypes.bool,
     title: types.title,
-    URLParams: types.bool,
-    renderItem: types.func
+    URLParams: VueTypes.bool,
+    renderItem: types.func,
+    index: VueTypes.string,
+    enableStrictSelection: VueTypes.bool
   },
   data: function data() {
     this.__state = {
@@ -58,7 +60,11 @@ var ToggleButton = {
     }
   },
   created: function created() {
-    // Set custom query in store
+    if (!this.enableAppbase && this.$props.index) {
+      console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
+    } // Set custom query in store
+
+
     updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.currentValue);
   },
   watch: {
@@ -180,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);
       }
 
@@ -196,6 +202,16 @@ var ToggleButton = {
       });
     },
     handleClick: function handleClick(item) {
+      var _this$$props = this.$props,
+          enableStrictSelection = _this$$props.enableStrictSelection,
+          multiSelect = _this$$props.multiSelect;
+
+      if (enableStrictSelection && !multiSelect && this.$data.currentValue.find(function (stateItem) {
+        return isEqual(item, stateItem);
+      })) {
+        return false;
+      }
+
       var value = this.$props.value;
 
       if (value === undefined) {
@@ -203,6 +219,8 @@ var ToggleButton = {
       } else {
         this.$emit('change', item.value);
       }
+
+      return true;
     },
     renderButton: function renderButton(item) {
       var _this2 = this;
@@ -305,7 +323,8 @@ ToggleButton.defaultQuery = function (value, props) {
 var mapStateToProps = function mapStateToProps(state, props) {
   return {
     selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
-    componentProps: state.props[props.componentId]
+    componentProps: state.props[props.componentId],
+    enableAppbase: state.config.enableAppbase
   };
 };
 

package/dist/es/{_rollupPluginBabelHelpers-c9fbe19f.js → _rollupPluginBabelHelpers-ecf6c03c.js}

@@ -19,7 +19,17 @@ function _extends() {
 function _inheritsLoose(subClass, superClass) {
   subClass.prototype = Object.create(superClass.prototype);
   subClass.prototype.constructor = subClass;
-  subClass.__proto__ = superClass;
+
+  _setPrototypeOf(subClass, superClass);
+}
+
+function _setPrototypeOf(o, p) {
+  _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+    o.__proto__ = p;
+    return o;
+  };
+
+  return _setPrototypeOf(o, p);
 }
 
 function _objectWithoutPropertiesLoose(source, excluded) {

package/dist/es/{index-1fe91a0a.js → index-5daa8276.js}

@@ -1,5 +1,5 @@
 import { helper } from '@appbaseio/reactivecore';
-import { a as _extends } from './_rollupPluginBabelHelpers-c9fbe19f.js';
+import { a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
 import { validProps } from '@appbaseio/reactivecore/lib/utils/constants';
 import { bindActionCreators } from 'redux';
 
@@ -52,7 +52,7 @@ var normalizeMapState = function normalizeMapState(mapState) {
       }).reduce(function (map, key) {
         var _extends2;
 
-        return _extends(_extends({}, map), {}, (_extends2 = {}, _extends2[key] = mapState[key](state, ownProps), _extends2));
+        return _extends({}, map, (_extends2 = {}, _extends2[key] = mapState[key](state, ownProps), _extends2));
       }, {});
     };
   }
@@ -77,12 +77,12 @@ var connector = function connector(_mapState, mapDispatch) {
       mixins: [component],
       inject: ['$$store'],
       data: function data() {
-        var merged = _extends(_extends({}, mapState(this.$$store.getState(), this.$props || {})), bindActionCreators(mapDispatch, this.$$store.dispatch));
+        var merged = _extends({}, mapState(this.$$store.getState(), this.$props || {}), bindActionCreators(mapDispatch, this.$$store.dispatch));
 
         return Object.keys(merged).reduce(function (data, key) {
           var _extends3;
 
-          return _extends(_extends({}, data), {}, (_extends3 = {}, _extends3[key] = merged[key], _extends3));
+          return _extends({}, data, (_extends3 = {}, _extends3[key] = merged[key], _extends3));
         }, {});
       },
       created: function created() {
@@ -129,6 +129,7 @@ var connect = function connect() {
 //   storeKey,
 // });
 
+var X_SEARCH_CLIENT = 'ReactiveSearch Vue';
 var composeThemeObject = function composeThemeObject(ownTheme, userTheme) {
   if (ownTheme === void 0) {
     ownTheme = {};
@@ -139,9 +140,9 @@ var composeThemeObject = function composeThemeObject(ownTheme, userTheme) {
   }
 
   return {
-    typography: _extends(_extends({}, ownTheme.typography), userTheme.typography),
-    colors: _extends(_extends({}, ownTheme.colors), userTheme.colors),
-    component: _extends(_extends({}, ownTheme.component), userTheme.component)
+    typography: _extends({}, ownTheme.typography, userTheme.typography),
+    colors: _extends({}, ownTheme.colors, userTheme.colors),
+    component: _extends({}, ownTheme.component, userTheme.component)
   };
 };
 /**
@@ -154,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) {
@@ -216,12 +223,12 @@ var isEvent = function isEvent(candidate) {
   return !!(candidate && candidate.stopPropagation && candidate.preventDefault);
 };
 var updateDefaultQuery = function updateDefaultQuery(componentId, setDefaultQuery, props, value) {
-  defaultQueryUtil(componentId, _extends(_extends({}, props), {}, {
+  defaultQueryUtil(componentId, _extends({}, props, {
     setDefaultQuery: setDefaultQuery
   }), value);
 };
 var updateCustomQuery = function updateCustomQuery(componentId, setCustomQuery, props, value) {
-  customQueryUtil(componentId, _extends(_extends({}, props), {}, {
+  customQueryUtil(componentId, _extends({}, props, {
     setCustomQuery: setCustomQuery
   }), value);
 };
@@ -294,5 +301,68 @@ var getCamelCase = function getCamelCase(str) {
   var capitalString = capital.join('');
   return capitalString || '';
 };
+var isEmpty = function isEmpty(val) {
+  return !(val && val.length && Object.keys(val).length);
+};
+function isNumeric(value) {
+  return /^-?\d+$/.test(value);
+} // check if passed shortcut a key combination
+
+function isHotkeyCombination(hotkey) {
+  return typeof hotkey === 'string' && hotkey.indexOf('+') !== -1;
+} // used for getting correct string char from keycode passed
+// the below algebraic expression is used to get the correct ascii code out of the e.which || e.keycode returned value
+// since the keyboards doesn't understand ascii but scan codes and they differ for certain keys such as '/'
+// stackoverflow ref: https://stackoverflow.com/a/29811987/10822996
+
+function getCharFromCharCode(passedCharCode) {
+  var which = passedCharCode;
+  var chrCode = which - 48 * Math.floor(which / 48);
+  return String.fromCharCode(which >= 96 ? chrCode : which);
+} // used for parsing focusshortcuts for keycodes passed as string, eg: 'ctrl+/' is same as 'ctrl+47'
+// returns focusShortcuts containing appropriate key charsas depicted on keyboards
+
+function parseFocusShortcuts(focusShortcutsArray) {
+  if (isEmpty(focusShortcutsArray)) return [];
+  var parsedFocusShortcutsArray = [];
+  focusShortcutsArray.forEach(function (element) {
+    if (typeof element === 'string') {
+      if (isHotkeyCombination(element)) {
+        // splitting the combination into pieces
+        var splitCombination = element.split('+');
+        var parsedSplitCombination = []; // parsedCombination would have all the keycodes converted into chars
+
+        var parsedCombination = '';
+
+        for (var i = 0; i < splitCombination.length; i += 1) {
+          if (isNumeric(splitCombination[i])) {
+            parsedSplitCombination.push(getCharFromCharCode(+splitCombination[i]));
+          } else {
+            parsedSplitCombination.push(splitCombination[i]);
+          }
+        }
+
+        parsedCombination = parsedSplitCombination.join('+');
+        parsedFocusShortcutsArray.push(parsedCombination);
+      } else if (isNumeric(element)) {
+        parsedFocusShortcutsArray.push(getCharFromCharCode(+element));
+      } else {
+        // single char shortcut, eg: '/'
+        parsedFocusShortcutsArray.push(element);
+      }
+    } else {
+      // if not a string the the shortcut is assumed to be a keycode
+      parsedFocusShortcutsArray.push(getCharFromCharCode(element));
+    }
+  });
+  return parsedFocusShortcutsArray;
+}
+var MODIFIER_KEYS = ['shift', 'ctrl', 'alt', 'control', 'option', 'cmd', 'command']; // filter out modifierkeys such as ctrl, alt, command, shift from focusShortcuts prop
+
+function extractModifierKeysFromFocusShortcuts(focusShortcutsArray) {
+  return focusShortcutsArray.filter(function (shortcutKey) {
+    return MODIFIER_KEYS.includes(shortcutKey);
+  });
+}
 
-export { isFunction as a, getCamelCase as b, connect as c, getValidPropsKeys as d, composeThemeObject as e, updateCustomQuery as f, getComponent as g, hasCustomRenderer as h, isQueryIdentical as i, getQuerySuggestionsComponent as j, hasQuerySuggestionsRenderer as k, isEvent as l, parseValueArray as p, updateDefaultQuery as u };
+export { X_SEARCH_CLIENT as X, isFunction as a, getCamelCase as b, connect as c, getValidPropsKeys as d, composeThemeObject as e, updateCustomQuery as f, getComponent as g, hasCustomRenderer as h, isQueryIdentical as i, getQuerySuggestionsComponent as j, isEmpty as k, extractModifierKeysFromFocusShortcuts as l, hasQuerySuggestionsRenderer as m, isEvent as n, parseValueArray as o, parseFocusShortcuts as p, updateDefaultQuery as u };