@appbaseio/reactivesearch-vue 1.16.0-alpha.55 → 1.16.0-alpha.58

package/dist/cjs/{install-ac3374ec.js → install-b494733c.js}

@@ -4,24 +4,24 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var configureStore = require('@appbaseio/reactivecore');
 var configureStore__default = _interopDefault(configureStore);
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4abdbfff.js');
+var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-c705cbe6.js');
 var VueTypes = _interopDefault(require('vue-types'));
 var constants = require('@appbaseio/reactivecore/lib/utils/constants');
 var helper = require('@appbaseio/reactivecore/lib/utils/helper');
 var styled = require('@appbaseio/vue-emotion');
 var styled__default = _interopDefault(styled);
-var Button = require('./Button-10e5cf51.js');
+var Button = require('./Button-446f819e.js');
 var vueTypes = require('./vueTypes-6de9d2a9.js');
 var ReactiveList = require('./ReactiveList.js');
-var index = require('./index-d44a0a21.js');
-var ComponentWrapper = require('./ComponentWrapper-7302fe1a.js');
-var Title = require('./Title-39765ee6.js');
+var index = require('./index-c288153a.js');
+var ComponentWrapper = require('./ComponentWrapper-ca5f0cbd.js');
+var Title = require('./Title-1de7d0f4.js');
 var ReactiveBase = require('./ReactiveBase.js');
 var hotkeys = _interopDefault(require('hotkeys-js'));
-var DataSearch = require('./DataSearch-7fd1b95d.js');
-var CancelSvg = require('./CancelSvg-82021d23.js');
-var Input = require('./Input-64087a69.js');
-var Container = require('./Container-8a08d663.js');
+var DataSearch = require('./DataSearch-f63fcf44.js');
+var CancelSvg = require('./CancelSvg-9f258f4f.js');
+var Input = require('./Input-e6603a7e.js');
+var Container = require('./Container-daf30918.js');
 var SingleList = require('./SingleList.js');
 var MultiList = require('./MultiList.js');
 var SingleDropdownList = require('./SingleDropdownList.js');
@@ -80,10 +80,12 @@ var _debounce = configureStore.helper.debounce,
     normalizeDataField = configureStore.helper.normalizeDataField;
 var SearchBox = {
   name: 'SearchBox',
+  isTagsMode: false,
   data: function data() {
     var props = this.$props;
     this.__state = {
       currentValue: '',
+      selectedTags: [],
       isOpen: false,
       normalizedSuggestions: []
     };
@@ -99,7 +101,16 @@ var SearchBox = {
     var _this$$props = this.$props,
         distinctField = _this$$props.distinctField,
         distinctFieldConfig = _this$$props.distinctFieldConfig,
-        index = _this$$props.index;
+        index = _this$$props.index,
+        mode = _this$$props.mode;
+
+    if (mode === constants.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.');
@@ -114,8 +125,12 @@ var SearchBox = {
     }
 
     this.currentValue = this.selectedValue || this.value || this.defaultValue || '';
-    this.handleTextChange = _debounce(this.handleText, this.$props.debounce);
-    this.setValue(this.currentValue, true, this.$props, undefined, false, this.selectedCategory); // Set custom and default queries in store
+
+    if (this.$options.isTagsMode) {
+      this.currentValue = '';
+    }
+
+    this.handleTextChange = _debounce(this.handleText, this.$props.debounce); // Set custom and default queries in store
 
     this.triggerCustomQuery(this.currentValue, this.selectedCategory);
     this.triggerDefaultQuery(this.currentValue);
@@ -151,7 +166,7 @@ var SearchBox = {
     debounce: VueTypes.number.def(0),
     defaultValue: vueTypes.types.string,
     excludeFields: vueTypes.types.excludeFields,
-    value: vueTypes.types.value,
+    value: VueTypes.oneOfType([VueTypes.arrayOf(VueTypes.string), vueTypes.types.value]),
     defaultSuggestions: vueTypes.types.suggestions,
     enableSynonyms: VueTypes.bool.def(true),
     enableQuerySuggestions: VueTypes.bool.def(false),
@@ -204,7 +219,18 @@ var SearchBox = {
     onData: vueTypes.types.func,
     renderItem: vueTypes.types.func,
     enterButton: VueTypes.bool.def(false),
-    renderEnterButton: VueTypes.any
+    renderEnterButton: VueTypes.any,
+    mode: VueTypes.oneOf(['select', 'tag']).def('select'),
+    renderSelectedTags: VueTypes.any
+  },
+  beforeMount: function beforeMount() {
+    if (this.selectedValue) {
+      this.setValue(this.selectedValue, true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined);
+    } else if (this.$props.value) {
+      this.setValue(this.$props.value, true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined);
+    } else if (this.$props.defaultValue) {
+      this.setValue(this.$props.defaultValue, true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined);
+    }
   },
   mounted: function mounted() {
     this.listenForFocusShortcuts();
@@ -254,15 +280,25 @@ var SearchBox = {
       this.normalizedSuggestions = suggestionsList;
     },
     selectedValue: function selectedValue(newVal, oldVal) {
-      if (oldVal !== newVal && this.$data.currentValue !== newVal) {
+      if (!isEqual(newVal, oldVal) && (this.$options.isTagsMode ? !isEqual(this.$data.selectedTags, newVal) : this.$data.currentValue !== newVal)) {
         if (!newVal && this.$data.currentValue) {
           // selected value is cleared, call onValueSelected
           this.onValueSelectedHandler('', configureStore.causes.CLEAR_VALUE);
+        } // if (this.$props.value === undefined) {
+
+
+        if (this.$options.isTagsMode) {
+          // handling reset of tags through SelectedFilters or URL
+          this.selectedTags = [];
         }
 
-        if (this.$props.value === undefined) {
-          this.setValue(newVal || '', true, this.$props);
+        var cause = !newVal ? configureStore.causes.CLEAR_VALUE : undefined;
+
+        if (this.$options.isTagsMode) {
+          cause = configureStore.causes.SUGGESTION_SELECT;
         }
+
+        this.setValue(newVal || '', true, this.$props, cause); // }
       }
     },
     focusShortcuts: function focusShortcuts() {
@@ -403,7 +439,40 @@ var SearchBox = {
       }
 
       var performUpdate = function performUpdate() {
-        _this.currentValue = value;
+        if (_this.$options.isTagsMode && isEqual(value, _this.selectedTags)) {
+          return;
+        }
+
+        if (_this.$options.isTagsMode && cause === configureStore.causes.SUGGESTION_SELECT) {
+          if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
+            // check if value already present in selectedTags
+            if (typeof value === 'string' && _this.selectedTags.includes(value)) {
+              _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)) {
+              var mergedArray = Array.from(new Set([].concat(_this.selectedTags, value)));
+              _this.selectedTags = mergedArray;
+            }
+          } else if (value) {
+            _this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
+          }
+
+          _this.currentValue = '';
+        } else {
+          _this.currentValue = value;
+        }
+
+        var queryHandlerValue = value;
+
+        if (_this.$options.isTagsMode && cause === configureStore.causes.SUGGESTION_SELECT) {
+          queryHandlerValue = Array.isArray(_this.selectedTags) && _this.selectedTags.length ? _this.selectedTags : undefined;
+        }
 
         if (isDefaultValue) {
           if (_this.$props.autosuggest) {
@@ -411,19 +480,19 @@ var SearchBox = {
               _this.isOpen = false;
             }
 
-            _this.triggerDefaultQuery(value);
+            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 === configureStore.causes.SUGGESTION_SELECT || value === '') {
-              _this.triggerCustomQuery(value, categoryValue);
+            if (cause === configureStore.causes.SUGGESTION_SELECT || (_this.$options.isTagsMode ? _this.selectedTags.length === 0 : value === '')) {
+              _this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
             } else {
               _this.setValue('', true);
             }
-          } else if (props.value === undefined) {
-            _this.triggerCustomQuery(value, categoryValue);
+          } else if (props.value === undefined || cause === configureStore.causes.SUGGESTION_SELECT || cause === configureStore.causes.CLEAR_VALUE) {
+            _this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
           }
         } else {
           // debounce for handling text while typing
@@ -474,6 +543,11 @@ var SearchBox = {
           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;
 
@@ -567,7 +641,8 @@ var SearchBox = {
         if (this.$props.autosuggest === false) {
           this.enterButtonOnClick();
         } else if (highlightedIndex === null) {
-          this.setValue(event.target.value, true);
+          this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? configureStore.causes.SUGGESTION_SELECT : undefined // to handle tags
+          );
           this.onValueSelectedHandler(event.target.value, configureStore.causes.ENTER_PRESS);
         }
       } // Need to review
@@ -612,13 +687,29 @@ var SearchBox = {
       if (value === undefined) {
         this.setValue(suggestion.value, true, this.$props, configureStore.causes.SUGGESTION_SELECT, false, suggestion._category);
       } else {
-        this.$emit('change', suggestion.value, function (_ref4) {
+        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, configureStore.causes.SUGGESTION_SELECT, false, suggestion._category);
+        this.$emit('change', emitValue, function (_ref4) {
           var isOpen = _ref4.isOpen;
-          return _this3.triggerQuery({
+          return _this3.triggerQuery(_rollupPluginBabelHelpers._extends({
             isOpen: isOpen,
-            value: suggestion.value,
+            value: emitValue
+          }, !_this3.$options.isTagsMode && {
             categoryValue: suggestion._category
-          });
+          }));
         });
       }
 
@@ -901,10 +992,79 @@ var SearchBox = {
           "click": handleAutoFillClick
         }
       });
+    },
+    renderTag: function renderTag(item) {
+      var _this7 = this;
+
+      var h = this.$createElement;
+      var innerClass = this.$props.innerClass;
+      return h(DataSearch.TagItem, {
+        "class": getClassName(innerClass, 'selected-tag') || ''
+      }, [h("span", [item]), h("span", {
+        "attrs": {
+          "role": "img",
+          "aria-label": "delete-tag"
+        },
+        "class": "close-icon",
+        "on": {
+          "click": function click() {
+            return _this7.clearTag(item);
+          }
+        }
+      }, [h(CancelSvg.CancelSvg)])]);
+    },
+    clearAllTags: function clearAllTags() {
+      this.selectedTags = [];
+      this.setValue('', true, this.$props, configureStore.causes.SUGGESTION_SELECT);
+
+      if (this.$props.value !== undefined) {
+        this.$emit('change', this.selectedTags, this.triggerQuery);
+      }
+    },
+    clearTag: function clearTag(tagValue) {
+      this.selectedTags = [].concat(this.selectedTags.filter(function (tag) {
+        return tag !== tagValue;
+      }));
+      this.setValue('', true, this.$props, configureStore.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;
+      return renderSelectedTags ? renderSelectedTags({
+        values: this.selectedTags,
+        handleClear: this.clearTag,
+        handleClearAll: this.clearAllTags
+      }) : h(DataSearch.TagsContainer, [tagsList.map(function (item) {
+        return _this8.renderTag(item);
+      }), shouldRenderClearAllTag && h(DataSearch.TagItem, {
+        "class": getClassName(this.$props.innerClass, 'selected-tag') || ''
+      }, [h("span", ["Clear All"]), h("span", {
+        "attrs": {
+          "role": "img",
+          "aria-label": "delete-tag"
+        },
+        "class": "close-icon",
+        "on": {
+          "click": this.clearAllTags
+        }
+      }, [h(CancelSvg.CancelSvg)])])]);
     }
   },
   render: function render() {
-    var _this7 = this;
+    var _this9 = this;
 
     var h = arguments[0];
     var _this$$props6 = this.$props,
@@ -950,14 +1110,14 @@ var SearchBox = {
               }
             };
 
-            return h("div", [_this7.hasCustomRenderer && _this7.getComponent({
+            return h("div", [_this9.hasCustomRenderer && _this9.getComponent({
               isOpen: isOpen,
               getItemProps: getItemProps,
               getItemEvents: getItemEvents,
               highlightedIndex: highlightedIndex
-            }), _this7.renderErrorComponent(), !_this7.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
-              "class": Input.suggestions(_this7.themePreset, theme) + " " + getClassName(_this7.$props.innerClass, 'list')
-            }, [_this7.normalizedSuggestions.map(function (item, index) {
+            }), _this9.renderErrorComponent(), !_this9.hasCustomRenderer && isOpen && hasSuggestions ? h("ul", {
+              "class": Input.suggestions(_this9.themePreset, theme) + " " + getClassName(_this9.$props.innerClass, 'list')
+            }, [_this9.normalizedSuggestions.map(function (item, index) {
               return renderItem ? h("li", {
                 "domProps": _rollupPluginBabelHelpers._extends({}, getItemProps({
                   item: item
@@ -967,7 +1127,7 @@ var SearchBox = {
                 })),
                 "key": index + 1 + "-" + item.value,
                 "style": {
-                  backgroundColor: _this7.getBackgroundColor(highlightedIndex, index),
+                  backgroundColor: _this9.getBackgroundColor(highlightedIndex, index),
                   justifyContent: 'flex-start',
                   alignItems: 'center'
                 }
@@ -980,7 +1140,7 @@ var SearchBox = {
                 })),
                 "key": index + 1 + "-" + item.value,
                 "style": {
-                  backgroundColor: _this7.getBackgroundColor(highlightedIndex, index),
+                  backgroundColor: _this9.getBackgroundColor(highlightedIndex, index),
                   justifyContent: 'flex-start',
                   alignItems: 'center'
                 }
@@ -991,61 +1151,61 @@ var SearchBox = {
                 }
               }, [h(DataSearch.CustomSvg, {
                 "attrs": {
-                  "className": getClassName(_this7.$props.innerClass, item._suggestion_type + "-search-icon") || null,
+                  "className": getClassName(_this9.$props.innerClass, item._suggestion_type + "-search-icon") || null,
                   "icon": getIcon(item._suggestion_type),
                   "type": item._suggestion_type + "-search-icon"
                 }
               })]), h(DataSearch.SuggestionItem, {
                 "attrs": {
-                  "currentValue": _this7.currentValue,
+                  "currentValue": _this9.currentValue,
                   "suggestion": item
                 }
-              }), _this7.renderAutoFill(item)]);
-            })]) : _this7.renderNoSuggestions(_this7.normalizedSuggestions)]);
+              }), _this9.renderAutoFill(item)]);
+            })]) : _this9.renderNoSuggestions(_this9.normalizedSuggestions)]);
           };
 
           return h("div", {
             "class": Input.suggestionsContainer
-          }, [h(DataSearch.InputGroup, [_this7.renderInputAddonBefore(), h(CancelSvg.InputWrapper, [h(Input.Input, {
+          }, [h(DataSearch.InputGroup, [_this9.renderInputAddonBefore(), h(CancelSvg.InputWrapper, [h(Input.Input, {
             "attrs": {
-              "id": _this7.$props.componentId + "-input",
-              "showIcon": _this7.$props.showIcon,
-              "showClear": _this7.$props.showClear,
-              "iconPosition": _this7.$props.iconPosition,
-              "placeholder": _this7.$props.placeholder,
-              "autoFocus": _this7.$props.autoFocus,
-              "themePreset": _this7.themePreset,
+              "id": _this9.$props.componentId + "-input",
+              "showIcon": _this9.$props.showIcon,
+              "showClear": _this9.$props.showClear,
+              "iconPosition": _this9.$props.iconPosition,
+              "placeholder": _this9.$props.placeholder,
+              "autoFocus": _this9.$props.autoFocus,
+              "themePreset": _this9.themePreset,
               "autocomplete": "off"
             },
-            "ref": _this7.$props.innerRef,
-            "class": getClassName(_this7.$props.innerClass, 'input'),
+            "ref": _this9.$props.innerRef,
+            "class": getClassName(_this9.$props.innerClass, 'input'),
             "on": _rollupPluginBabelHelpers._extends({}, getInputEvents({
-              onInput: _this7.onInputChange,
+              onInput: _this9.onInputChange,
               onBlur: function onBlur(e) {
-                _this7.$emit('blur', e, _this7.triggerQuery);
+                _this9.$emit('blur', e, _this9.triggerQuery);
               },
-              onFocus: _this7.handleFocus,
+              onFocus: _this9.handleFocus,
               onKeyPress: function onKeyPress(e) {
-                _this7.$emit('keyPress', e, _this7.triggerQuery);
+                _this9.$emit('keyPress', e, _this9.triggerQuery);
 
-                _this7.$emit('key-press', e, _this7.triggerQuery);
+                _this9.$emit('key-press', e, _this9.triggerQuery);
               },
               onKeyDown: function onKeyDown(e) {
-                return _this7.handleKeyDown(e, highlightedIndex);
+                return _this9.handleKeyDown(e, highlightedIndex);
               },
               onKeyUp: function onKeyUp(e) {
-                _this7.$emit('keyUp', e, _this7.triggerQuery);
+                _this9.$emit('keyUp', e, _this9.triggerQuery);
 
-                _this7.$emit('key-up', e, _this7.triggerQuery);
+                _this9.$emit('key-up', e, _this9.triggerQuery);
               },
               onClick: function onClick() {
                 setHighlightedIndex(null);
               }
             })),
             "domProps": _rollupPluginBabelHelpers._extends({}, getInputProps({
-              value: _this7.$data.currentValue === null ? '' : _this7.$data.currentValue
+              value: _this9.$data.currentValue === null ? '' : _this9.$data.currentValue
             }))
-          }), _this7.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()]), _this7.renderInputAddonAfter(), _this7.renderEnterButtonElement()]), expandSuggestionsContainer && renderSuggestionsDropdown()]);
+          }), _this9.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()]), _this9.renderInputAddonAfter(), _this9.renderEnterButtonElement()]), expandSuggestionsContainer && renderSuggestionsDropdown(), _this9.renderTags()]);
         }
       }
     }) : h("div", {
@@ -1061,22 +1221,22 @@ var SearchBox = {
       },
       "on": _rollupPluginBabelHelpers._extends({}, {
         blur: function blur(e) {
-          _this7.$emit('blur', e, _this7.triggerQuery);
+          _this9.$emit('blur', e, _this9.triggerQuery);
         },
         keypress: function keypress(e) {
-          _this7.$emit('keyPress', e, _this7.triggerQuery);
+          _this9.$emit('keyPress', e, _this9.triggerQuery);
 
-          _this7.$emit('key-press', e, _this7.triggerQuery);
+          _this9.$emit('key-press', e, _this9.triggerQuery);
         },
         input: this.onInputChange,
         focus: function focus(e) {
-          _this7.$emit('focus', e, _this7.triggerQuery);
+          _this9.$emit('focus', e, _this9.triggerQuery);
         },
         keydown: this.handleKeyDown,
         keyup: function keyup(e) {
-          _this7.$emit('keyUp', e, _this7.triggerQuery);
+          _this9.$emit('keyUp', e, _this9.triggerQuery);
 
-          _this7.$emit('key-up', e, _this7.triggerQuery);
+          _this9.$emit('key-up', e, _this9.triggerQuery);
         }
       }),
       "domProps": _rollupPluginBabelHelpers._extends({}, {

package/dist/cjs/install.js

@@ -3,44 +3,44 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('@appbaseio/reactivecore');
-require('./_rollupPluginBabelHelpers-4abdbfff.js');
+require('./_rollupPluginBabelHelpers-c705cbe6.js');
 require('vue-types');
 require('@appbaseio/reactivecore/lib/utils/constants');
 require('@appbaseio/reactivecore/lib/utils/helper');
 require('emotion');
 require('@appbaseio/vue-emotion');
 require('polished');
-require('./Button-10e5cf51.js');
+require('./Button-446f819e.js');
 require('./vueTypes-6de9d2a9.js');
-require('./Pagination-e0654529.js');
+require('./Pagination-c01d1547.js');
 require('./ReactiveList.js');
 require('@appbaseio/reactivecore/lib/utils/transform');
 require('redux');
-require('./index-d44a0a21.js');
-require('./ComponentWrapper-7302fe1a.js');
+require('./index-c288153a.js');
+require('./ComponentWrapper-ca5f0cbd.js');
 require('@vue/babel-helper-vue-jsx-merge-props');
-require('./Title-39765ee6.js');
-require('./ListItem-933c27e4.js');
-require('./Card-4b915733.js');
-require('./Flex-699639d2.js');
+require('./Title-1de7d0f4.js');
+require('./ListItem-8c9e0d68.js');
+require('./Card-642547a8.js');
+require('./Flex-aa517a13.js');
 require('@appbaseio/reactivecore/lib/actions/analytics');
 require('appbase-js');
 require('url-search-params-polyfill');
 require('./ReactiveBase.js');
 require('hotkeys-js');
-require('./DataSearch-7fd1b95d.js');
-require('./CancelSvg-82021d23.js');
-require('./Input-64087a69.js');
+require('./DataSearch-f63fcf44.js');
+require('./CancelSvg-9f258f4f.js');
+require('./Input-e6603a7e.js');
 require('compute-scroll-into-view');
-require('./Container-8a08d663.js');
+require('./Container-daf30918.js');
 require('vue-highlight-words');
-var install = require('./install-ac3374ec.js');
+var install = require('./install-b494733c.js');
 require('@appbaseio/reactivecore/lib/utils/suggestions');
-require('./FormControlList-73497794.js');
-require('./utils-23afb20b.js');
+require('./FormControlList-c195a592.js');
+require('./utils-d6a52588.js');
 require('./SingleList.js');
 require('./MultiList.js');
-require('./DropDown-16a2a728.js');
+require('./DropDown-c3f83a46.js');
 require('./SingleDropdownList.js');
 require('./MultiDropdownList.js');
 require('./ToggleButton.js');
@@ -51,7 +51,7 @@ require('./MultiRange.js');
 require('./ResultCard.js');
 require('./ResultList.js');
 require('vue-no-ssr');
-require('./ssr-c333c82c.js');
+require('./ssr-3027b848.js');
 require('./RangeSlider.js');
 require('./DynamicRangeSlider.js');
 require('./StateProvider.js');

package/dist/cjs/{ssr-c333c82c.js → ssr-3027b848.js}

@@ -2,7 +2,7 @@
 
 function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4abdbfff.js');
+var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-c705cbe6.js');
 var styled = require('@appbaseio/vue-emotion');
 var styled__default = _interopDefault(styled);
 var NoSSR = _interopDefault(require('vue-no-ssr'));

package/dist/cjs/{utils-23afb20b.js → utils-d6a52588.js}

@@ -4,7 +4,7 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var configureStore = require('@appbaseio/reactivecore');
 var configureStore__default = _interopDefault(configureStore);
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4abdbfff.js');
+var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-c705cbe6.js');
 
 var getAggsOrder = configureStore.helper.getAggsOrder;
 

package/dist/cjs/version.js

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

package/dist/es/{Button-8b211174.js → Button-d8bc15ea.js}

@@ -1,4 +1,4 @@
-import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ecf6c03c.js';
+import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-76660dab.js';
 import { css } from 'emotion';
 import styled from '@appbaseio/vue-emotion';
 import { darken, rgba, lighten } from 'polished';

package/dist/es/{CancelSvg-4d9e0857.js → CancelSvg-4cfae5fd.js}

@@ -1,4 +1,4 @@
-import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
+import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-76660dab.js';
 import styled, { css } from '@appbaseio/vue-emotion';
 import computeScrollIntoView from 'compute-scroll-into-view';
 

package/dist/es/{Card-04b3c33e.js → Card-450683f1.js}

@@ -1,8 +1,8 @@
-import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ecf6c03c.js';
+import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-76660dab.js';
 import { css } from 'emotion';
 import styled from '@appbaseio/vue-emotion';
 import { lighten } from 'polished';
-import './Title-579f8d6c.js';
+import './Title-3342664a.js';
 
 var _templateObject, _templateObject2, _templateObject3;
 var container = css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: center;\n\tflex-wrap: wrap;\n\tmargin: 0 -8px;\n\n\t@media (max-width: 420px) {\n\t\tmargin: 0;\n\t}\n"])));

package/dist/es/{ComponentWrapper-bbb717bc.js → ComponentWrapper-6ad0997b.js}

@@ -1,9 +1,9 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
-import { a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
+import { a as _extends } from './_rollupPluginBabelHelpers-76660dab.js';
 import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import { getInternalComponentID } from '@appbaseio/reactivecore/lib/utils/transform';
-import { c as connect, b as getCamelCase, d as getValidPropsKeys } from './index-5daa8276.js';
+import { c as connect, b as getCamelCase, d as getValidPropsKeys } from './index-3d98f51b.js';
 
 var addComponent = Actions.addComponent,
     removeComponent = Actions.removeComponent,

package/dist/es/{Container-4383c6f0.js → Container-ba826e96.js}

@@ -1,4 +1,4 @@
-import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ecf6c03c.js';
+import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-76660dab.js';
 import styled from '@appbaseio/vue-emotion';
 
 var _templateObject;