@appbaseio/reactivesearch-vue 1.34.0-alpha.2 → 1.34.0

package/dist/es/MultiDropdownList.js

@@ -1,30 +1,27 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import { a as _extends, b as _objectWithoutPropertiesLoose, c as _toPropertyKey } from './_rollupPluginBabelHelpers-ded08042.js';
-import { createVNode, isVNode } from 'vue';
 import VueTypes from 'vue-types';
-import '@appbaseio/vue-emotion';
 import 'emotion';
+import '@appbaseio/vue-emotion';
 import 'polished';
-import { l as loadMoreContainer, B as Button } from './Button-ebafa3d6.js';
-import { t as types } from './vueTypes-e4af6fe2.js';
+import { l as loadMoreContainer, B as Button } from './Button-153cd885.js';
+import { t as types } from './vueTypes-66ebc93e.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, q as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-285a43a6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-bf443c0b.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-7ea7313a.js';
+import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, q as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-5509c0bc.js';
+import { C as ComponentWrapper } from './ComponentWrapper-edaeaceb.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-86a676c8.js';
+import '@vue/babel-helper-vue-jsx-merge-props';
 import { T as Title } from './Title-863dfa42.js';
-import './CancelSvg-14ebc9a1.js';
-import './Input-3b8408a6.js';
+import './CancelSvg-e40552a5.js';
+import './Input-c09c0b56.js';
 import 'compute-scroll-into-view';
 import { C as Container } from './Container-d00219f7.js';
 import '@appbaseio/reactivecore/lib/utils/suggestions';
 import { g as getAggsQuery } from './utils-9e5a16a1.js';
-import { D as Dropdown } from './DropDown-35e232b7.js';
+import { D as Dropdown } from './DropDown-2c0dd714.js';
 
-function _isSlot(s) {
-  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
-}
 var updateQuery = Actions.updateQuery,
   setQueryOptions = Actions.setQueryOptions,
   setCustomQuery = Actions.setCustomQuery,
@@ -83,7 +80,7 @@ var MultiDropdownList = {
     showSearch: VueTypes.bool.def(false),
     showClear: VueTypes.bool.def(false),
     showLoadMore: VueTypes.bool.def(false),
-    loadMoreLabel: VueTypes.oneOfType([VueTypes.string, VueTypes.nullable]).def('Load More'),
+    loadMoreLabel: VueTypes.oneOfType([VueTypes.string, VueTypes.any]).def('Load More'),
     nestedField: types.string,
     index: VueTypes.string,
     searchPlaceholder: VueTypes.string.def('Type here to search...'),
@@ -185,25 +182,25 @@ var MultiDropdownList = {
     }
   },
   render: function render() {
-    var _this3 = this;
+    var h = arguments[0];
     var _this$$props = this.$props,
       showLoadMore = _this$$props.showLoadMore,
       loadMoreLabel = _this$$props.loadMoreLabel,
       renderItem = _this$$props.renderItem,
       renderError = _this$$props.renderError,
       renderLabel = _this$$props.renderLabel;
-    var renderItemCalc = this.$slots.renderItem || renderItem;
-    var renderErrorCalc = this.$slots.renderError || renderError;
-    var renderLabelCalc = this.$slots.renderLabel || renderLabel;
+    var renderItemCalc = this.$scopedSlots.renderItem || renderItem;
+    var renderErrorCalc = this.$scopedSlots.renderError || renderError;
+    var renderLabelCalc = this.$scopedSlots.renderLabel || renderLabel;
     var isLastBucket = this.$data.isLastBucket;
-    var renderNoResults = this.$slots.renderNoResults || this.$props.renderNoResults;
+    var renderNoResults = this.$scopedSlots.renderNoResults || this.$props.renderNoResults;
     var selectAll = [];
     if (renderErrorCalc && this.error) {
       return isFunction(renderErrorCalc) ? renderErrorCalc(this.error) : renderErrorCalc;
     }
     if (!this.hasCustomRenderer && this.$data.modifiedOptions.length === 0 && !this.isLoading) {
       if (renderNoResults && isFunction(renderNoResults)) {
-        return createVNode("div", null, [renderNoResults()]);
+        return h("div", [renderNoResults()]);
       }
       if (renderNoResults && !isFunction(renderNoResults)) {
         return renderNoResults;
@@ -216,53 +213,47 @@ var MultiDropdownList = {
         doc_count: this.totalDocumentCount
       }];
     }
-    return createVNode(Container, {
+    return h(Container, {
       "class": this.$props.className
-    }, {
-      "default": function _default() {
-        return [_this3.$props.title && createVNode(Title, {
-          "class": getClassName(_this3.$props.innerClass, 'title') || ''
-        }, {
-          "default": function _default() {
-            return [_this3.$props.title];
-          }
-        }), createVNode(Dropdown, {
-          "innerClass": _this3.$props.innerClass,
-          "items": [].concat(selectAll, _this3.$data.modifiedOptions.filter(function (item) {
-            return String(item.key).trim().length;
-          }).map(function (item) {
-            return _extends({}, item, {
-              key: String(item.key)
-            });
-          })),
-          "hasCustomRenderer": _this3.hasCustomRenderer,
-          "customRenderer": _this3.getComponent,
-          "handleChange": _this3.handleChange,
-          "selectedItem": _this3.$data.currentValue,
-          "placeholder": _this3.$props.placeholder,
-          "labelField": "key",
-          "multi": true,
-          "showCount": _this3.$props.showCount,
-          "themePreset": _this3.themePreset,
-          "renderItem": renderItemCalc,
-          "renderNoResults": _this3.$slots.renderNoResults || _this3.$props.renderNoResults,
-          "showSearch": _this3.$props.showSearch,
-          "showClear": _this3.$props.showClear,
-          "searchPlaceholder": _this3.$props.searchPlaceholder,
-          "transformData": _this3.$props.transformData,
-          "footer": showLoadMore && !isLastBucket && createVNode("div", {
+    }, [this.$props.title && h(Title, {
+      "class": getClassName(this.$props.innerClass, 'title') || ''
+    }, [this.$props.title]), h(Dropdown, {
+      "attrs": {
+        "innerClass": this.$props.innerClass,
+        "items": [].concat(selectAll, this.$data.modifiedOptions.filter(function (item) {
+          return String(item.key).trim().length;
+        }).map(function (item) {
+          return _extends({}, item, {
+            key: String(item.key)
+          });
+        })),
+        "hasCustomRenderer": this.hasCustomRenderer,
+        "customRenderer": this.getComponent,
+        "handleChange": this.handleChange,
+        "selectedItem": this.$data.currentValue,
+        "placeholder": this.$props.placeholder,
+        "labelField": "key",
+        "multi": true,
+        "showCount": this.$props.showCount,
+        "themePreset": this.themePreset,
+        "renderItem": renderItemCalc,
+        "renderNoResults": this.$scopedSlots.renderNoResults || this.$props.renderNoResults,
+        "showSearch": this.$props.showSearch,
+        "showClear": this.$props.showClear,
+        "searchPlaceholder": this.$props.searchPlaceholder,
+        "transformData": this.$props.transformData,
+        "footer": showLoadMore && !isLastBucket && h("div", {
+          "attrs": {
             "css": loadMoreContainer
-          }, [createVNode(Button, {
-            "onClick": _this3.handleLoadMore
-          }, _isSlot(loadMoreLabel) ? loadMoreLabel : {
-            "default": function _default() {
-              return [loadMoreLabel];
-            }
-          })]),
-          "customLabelRenderer": renderLabelCalc
-        }, null)];
+          }
+        }, [h(Button, {
+          "on": {
+            "click": this.handleLoadMore
+          }
+        }, [loadMoreLabel])]),
+        "customLabelRenderer": renderLabelCalc
       }
-    });
+    })]);
   },
   methods: {
     handleChange: function handleChange(item) {
@@ -275,7 +266,7 @@ var MultiDropdownList = {
       }
     },
     setValue: function setValue(value, isDefaultValue, props) {
-      var _this4 = this;
+      var _this3 = this;
       if (isDefaultValue === void 0) {
         isDefaultValue = false;
       }
@@ -328,10 +319,10 @@ var MultiDropdownList = {
         finalValues = Object.keys(currentValue);
       }
       var performUpdate = function performUpdate() {
-        _this4.currentValue = _extends({}, currentValue);
-        _this4.updateQueryHandler(finalValues, props);
-        _this4.$emit('valueChange', finalValues);
-        _this4.$emit('value-change', finalValues);
+        _this3.currentValue = _extends({}, currentValue);
+        _this3.updateQueryHandler(finalValues, props);
+        _this3.$emit('valueChange', finalValues);
+        _this3.$emit('value-change', finalValues);
       };
       checkValueChange(props.componentId, finalValues, props.beforeValueChange, performUpdate);
     },
@@ -539,12 +530,15 @@ var ListConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps
   internalComponent: MultiDropdownList.hasInternalComponent()
 }));
 ListConnected.name = MultiDropdownList.name;
-ListConnected.install = function (Vue) {
-  Vue.component(ListConnected.name, ListConnected);
-};
 
 // Add componentType for SSR
 ListConnected.componentType = componentTypes.multiDropdownList;
+ListConnected.defaultQuery = MultiDropdownList.defaultQuery;
+ListConnected.generateQueryOptions = MultiDropdownList.generateQueryOptions;
+ListConnected.hasInternalComponent = MultiDropdownList.hasInternalComponent;
+ListConnected.install = function (Vue) {
+  Vue.component(ListConnected.name, ListConnected);
+};
 
 export default ListConnected;
 export { ListConnected };

package/dist/es/MultiList.js

@@ -1,22 +1,21 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
-import { b as _objectWithoutPropertiesLoose, c as _toPropertyKey, a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
-import { createVNode, mergeProps, createTextVNode } from 'vue';
+import { a as _extends, b as _objectWithoutPropertiesLoose, c as _toPropertyKey } from './_rollupPluginBabelHelpers-ded08042.js';
 import VueTypes from 'vue-types';
-import '@appbaseio/vue-emotion';
 import 'emotion';
+import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-e4af6fe2.js';
+import { t as types } from './vueTypes-66ebc93e.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, o as isEvent, q as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-285a43a6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-bf443c0b.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-7ea7313a.js';
+import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, o as isEvent, q as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-5509c0bc.js';
+import { C as ComponentWrapper } from './ComponentWrapper-edaeaceb.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-86a676c8.js';
 import { T as Title } from './Title-863dfa42.js';
-import { I as Input } from './Input-3b8408a6.js';
+import { I as Input } from './Input-c09c0b56.js';
 import { C as Container } from './Container-d00219f7.js';
 import { replaceDiacritics } from '@appbaseio/reactivecore/lib/utils/suggestions';
-import { U as UL, C as Checkbox } from './FormControlList-fa5cf78b.js';
+import { U as UL, C as Checkbox } from './FormControlList-99797d0a.js';
 import { g as getAggsQuery } from './utils-9e5a16a1.js';
 
 var updateQuery = Actions.updateQuery,
@@ -154,17 +153,18 @@ var MultiList = {
   },
   render: function render() {
     var _this2 = this;
+    var h = arguments[0];
     var _this$$props = this.$props,
       selectAllLabel = _this$$props.selectAllLabel,
       renderItem = _this$$props.renderItem,
       renderError = _this$$props.renderError;
-    var renderItemCalc = this.$slots.renderItem || renderItem;
-    var renderErrorCalc = this.$slots.renderError || renderError;
+    var renderItemCalc = this.$scopedSlots.renderItem || renderItem;
+    var renderErrorCalc = this.$scopedSlots.renderError || renderError;
     if (renderErrorCalc && this.error) {
       return isFunction(renderErrorCalc) ? renderErrorCalc(this.error) : renderErrorCalc;
     }
     if (!this.hasCustomRenderer && this.modifiedOptions.length === 0 && !this.isLoading) {
-      if (this.renderNoResult) {
+      if (this.renderNoResults) {
         this.renderNoResult();
       } else {
         return null;
@@ -183,72 +183,69 @@ var MultiList = {
       }
       return false;
     });
-    return createVNode(Container, {
+    return h(Container, {
       "class": this.$props.className
-    }, {
-      "default": function _default() {
-        return [_this2.$props.title && createVNode(Title, {
-          "class": getClassName(_this2.$props.innerClass, 'title')
-        }, {
-          "default": function _default() {
-            return [_this2.$props.title];
-          }
-        }), _this2.renderSearch(), _this2.hasCustomRenderer ? _this2.getComponent() : createVNode(UL, {
-          "class": getClassName(_this2.$props.innerClass, 'list')
-        }, {
-          "default": function _default() {
-            return [selectAllLabel ? createVNode("li", {
-              "key": selectAllLabel,
-              "class": "" + (_this2.currentValue[selectAllLabel] ? 'active' : '')
-            }, [createVNode(Checkbox, mergeProps({
-              "type": "checkbox",
-              "class": getClassName(_this2.$props.innerClass, 'checkbox'),
-              "id": _this2.$props.componentId + "-" + selectAllLabel,
-              "name": selectAllLabel,
-              "value": selectAllLabel,
-              "onClick": _this2.handleClick
-            }, {
-              domProps: {
-                checked: !!_this2.currentValue[selectAllLabel]
-              }
-            }, {
-              "show": _this2.$props.showCheckbox
-            }), null), createVNode("label", {
-              "class": getClassName(_this2.$props.innerClass, 'label'),
-              "for": _this2.$props.componentId + "-" + selectAllLabel
-            }, [createVNode("span", null, [selectAllLabel, _this2.$props.showCount && createVNode("span", {
-              "class": getClassName(_this2.$props.innerClass, 'count')
-            }, [createTextVNode("\xA0("), _this2.totalDocumentCount, createTextVNode(")")])])])]) : null, !_this2.hasCustomRenderer && filteredItemsToRender.length === 0 && !_this2.isLoading ? _this2.renderNoResult() : filteredItemsToRender.map(function (item) {
-              return createVNode("li", {
-                "key": item.key,
-                "class": "" + (_this2.$data.currentValue[item.key] ? 'active' : '')
-              }, [createVNode(Checkbox, mergeProps({
-                "type": "checkbox",
-                "class": getClassName(_this2.$props.innerClass, 'checkbox'),
-                "id": _this2.$props.componentId + "-" + item.key,
-                "name": _this2.$props.componentId,
-                "value": item.key,
-                "onClick": _this2.handleClick,
-                "show": _this2.$props.showCheckbox
-              }, {
-                domProps: {
-                  checked: !!_this2.$data.currentValue[item.key]
-                }
-              }), null), createVNode("label", {
-                "class": getClassName(_this2.$props.innerClass, 'label'),
-                "for": _this2.$props.componentId + "-" + item.key
-              }, [renderItemCalc ? renderItemCalc({
-                label: item.key,
-                count: item.doc_count,
-                isChecked: !!_this2.$data.currentValue[item.key]
-              }) : createVNode("span", null, [item.key, _this2.$props.showCount && createVNode("span", {
-                "class": getClassName(_this2.$props.innerClass, 'count')
-              }, [createTextVNode("\xA0("), item.doc_count, createTextVNode(")")])])])]);
-            })];
-          }
-        })];
+    }, [this.$props.title && h(Title, {
+      "class": getClassName(this.$props.innerClass, 'title')
+    }, [this.$props.title]), this.renderSearch(), this.hasCustomRenderer ? this.getComponent() : h(UL, {
+      "class": getClassName(this.$props.innerClass, 'list')
+    }, [selectAllLabel ? h("li", {
+      "key": selectAllLabel,
+      "class": "" + (this.currentValue[selectAllLabel] ? 'active' : '')
+    }, [h(Checkbox, {
+      "attrs": {
+        "type": "checkbox",
+        "id": this.$props.componentId + "-" + selectAllLabel,
+        "name": selectAllLabel,
+        "value": selectAllLabel,
+        "show": this.$props.showCheckbox
+      },
+      "class": getClassName(this.$props.innerClass, 'checkbox'),
+      "on": {
+        "click": this.handleClick
+      },
+      "domProps": _extends({}, {
+        checked: !!this.currentValue[selectAllLabel]
+      })
+    }), h("label", {
+      "class": getClassName(this.$props.innerClass, 'label'),
+      "attrs": {
+        "for": this.$props.componentId + "-" + selectAllLabel
       }
-    });
+    }, [h("span", [selectAllLabel, this.$props.showCount && h("span", {
+      "class": getClassName(this.$props.innerClass, 'count')
+    }, ["\xA0(", this.totalDocumentCount, ")"])])])]) : null, !this.hasCustomRenderer && filteredItemsToRender.length === 0 && !this.isLoading ? this.renderNoResult() : filteredItemsToRender.map(function (item) {
+      return h("li", {
+        "key": item.key,
+        "class": "" + (_this2.$data.currentValue[item.key] ? 'active' : '')
+      }, [h(Checkbox, {
+        "attrs": {
+          "type": "checkbox",
+          "id": _this2.$props.componentId + "-" + item.key,
+          "name": _this2.$props.componentId,
+          "value": item.key,
+          "show": _this2.$props.showCheckbox
+        },
+        "class": getClassName(_this2.$props.innerClass, 'checkbox'),
+        "on": {
+          "click": _this2.handleClick
+        },
+        "domProps": _extends({}, {
+          checked: !!_this2.$data.currentValue[item.key]
+        })
+      }), h("label", {
+        "class": getClassName(_this2.$props.innerClass, 'label'),
+        "attrs": {
+          "for": _this2.$props.componentId + "-" + item.key
+        }
+      }, [renderItemCalc ? renderItemCalc({
+        label: item.key,
+        count: item.doc_count,
+        isChecked: !!_this2.$data.currentValue[item.key]
+      }) : h("span", [item.key, _this2.$props.showCount && h("span", {
+        "class": getClassName(_this2.$props.innerClass, 'count')
+      }, ["\xA0(", item.doc_count, ")"])])])]);
+    })])]);
   },
   methods: {
     setValue: function setValue(value, isDefaultValue, props) {
@@ -376,17 +373,22 @@ var MultiList = {
       this.searchTerm = value;
     },
     renderSearch: function renderSearch() {
+      var h = this.$createElement;
       if (this.$props.showSearch) {
-        return createVNode(Input, {
+        return h(Input, {
           "class": getClassName(this.$props.innerClass, 'input') || '',
-          "onInput": this.handleInputChange,
-          "value": this.$data.searchTerm,
-          "placeholder": this.$props.placeholder,
+          "on": {
+            "input": this.handleInputChange
+          },
+          "attrs": {
+            "value": this.$data.searchTerm,
+            "placeholder": this.$props.placeholder,
+            "themePreset": this.$props.themePreset
+          },
           "style": {
             margin: '0 0 8px'
-          },
-          "themePreset": this.$props.themePreset
-        }, null);
+          }
+        });
       }
       return null;
     },
@@ -423,8 +425,9 @@ var MultiList = {
       return getComponent(data, this);
     },
     renderNoResult: function renderNoResult() {
-      var renderNoResults = this.$slots.renderNoResults || this.$props.renderNoResults;
-      return createVNode("p", {
+      var h = this.$createElement;
+      var renderNoResults = this.$scopedSlots.renderNoResults || this.$props.renderNoResults;
+      return h("p", {
         "class": getClassName(this.$props.innerClass, 'noResults') || null
       }, [isFunction(renderNoResults) ? renderNoResults() : renderNoResults]);
     }
@@ -543,12 +546,14 @@ var ListConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps
   internalComponent: MultiList.hasInternalComponent()
 }));
 ListConnected.name = MultiList.name;
+ListConnected.defaultQuery = MultiList.defaultQuery;
+ListConnected.generateQueryOptions = MultiList.generateQueryOptions;
+ListConnected.hasInternalComponent = MultiList.hasInternalComponent;
+// Add componentType for SSR
+ListConnected.componentType = componentTypes.multiList;
 ListConnected.install = function (Vue) {
   Vue.component(ListConnected.name, ListConnected);
 };
 
-// Add componentType for SSR
-ListConnected.componentType = componentTypes.multiList;
-
 export default ListConnected;
 export { ListConnected };

package/dist/es/MultiRange.js

@@ -1,23 +1,20 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import { a as _extends, b as _objectWithoutPropertiesLoose, c as _toPropertyKey } from './_rollupPluginBabelHelpers-ded08042.js';
-import { createVNode, mergeProps, isVNode } from 'vue';
 import VueTypes from 'vue-types';
+import 'emotion';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-e4af6fe2.js';
+import { t as types } from './vueTypes-66ebc93e.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { q as parseValueArray, f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-285a43a6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-bf443c0b.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-7ea7313a.js';
+import { q as parseValueArray, f as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-5509c0bc.js';
+import { C as ComponentWrapper } from './ComponentWrapper-edaeaceb.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-86a676c8.js';
 import { T as Title } from './Title-863dfa42.js';
 import { C as Container } from './Container-d00219f7.js';
-import { U as UL, C as Checkbox } from './FormControlList-fa5cf78b.js';
+import { U as UL, C as Checkbox } from './FormControlList-99797d0a.js';
 
-function _isSlot(s) {
-  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
-}
 var updateQuery = Actions.updateQuery,
   setQueryOptions = Actions.setQueryOptions,
   setCustomQuery = Actions.setCustomQuery;
@@ -185,51 +182,41 @@ var MultiRange = {
     }
   },
   render: function render() {
-    var _slot;
     var _this2 = this;
-    return createVNode(Container, {
+    var h = arguments[0];
+    return h(Container, {
       "class": this.$props.className
-    }, {
-      "default": function _default() {
-        return [_this2.$props.title && createVNode(Title, {
-          "class": getClassName(_this2.$props.innerClass, 'title')
-        }, {
-          "default": function _default() {
-            return [_this2.$props.title];
-          }
-        }), createVNode(UL, {
-          "class": getClassName(_this2.$props.innerClass, 'list')
-        }, _isSlot(_slot = _this2.$props.data.map(function (item) {
-          var selected = !!_this2.$data.currentValue && _this2.$data.currentValue.label === item.label;
-          return createVNode("li", {
-            "key": item.label,
-            "class": "" + (selected ? 'active' : '')
-          }, [createVNode(Checkbox, mergeProps({
-            "class": getClassName(_this2.$props.innerClass, 'checkbox'),
-            "id": _this2.$props.componentId + "-" + item.label,
-            "name": _this2.$props.componentId,
-            "value": item.label,
-            "type": "Checkbox",
-            "show": _this2.$props.showCheckbox
-          }, {
-            domProps: {
-              checked: _this2.selectedValues[item.label]
-            }
-          }, {
-            on: {
-              click: _this2.handleClick
-            }
-          }), null), createVNode("label", {
-            "class": getClassName(_this2.$props.innerClass, 'label'),
-            "for": _this2.$props.componentId + "-" + item.label
-          }, [item.label])]);
-        })) ? _slot : {
-          "default": function _default() {
-            return [_slot];
-          }
-        })];
-      }
-    });
+    }, [this.$props.title && h(Title, {
+      "class": getClassName(this.$props.innerClass, 'title')
+    }, [this.$props.title]), h(UL, {
+      "class": getClassName(this.$props.innerClass, 'list')
+    }, [this.$props.data.map(function (item) {
+      var selected = !!_this2.$data.currentValue && _this2.$data.currentValue.label === item.label;
+      return h("li", {
+        "key": item.label,
+        "class": "" + (selected ? 'active' : '')
+      }, [h(Checkbox, {
+        "class": getClassName(_this2.$props.innerClass, 'checkbox'),
+        "attrs": {
+          "id": _this2.$props.componentId + "-" + item.label,
+          "name": _this2.$props.componentId,
+          "value": item.label,
+          "type": "Checkbox",
+          "show": _this2.$props.showCheckbox
+        },
+        "domProps": _extends({}, {
+          checked: _this2.selectedValues[item.label]
+        }),
+        "on": _extends({}, {
+          click: _this2.handleClick
+        })
+      }), h("label", {
+        "class": getClassName(_this2.$props.innerClass, 'label'),
+        "attrs": {
+          "for": _this2.$props.componentId + "-" + item.label
+        }
+      }, [item.label])]);
+    })])]);
   }
 };
 MultiRange.parseValue = function (value, props) {
@@ -291,6 +278,9 @@ var RangeConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProp
   componentType: componentTypes.multiRange
 }));
 RangeConnected.name = MultiRange.name;
+RangeConnected.defaultQuery = MultiRange.defaultQuery;
+RangeConnected.parseValue = MultiRange.parseValue;
+RangeConnected.hasInternalComponent = MultiRange.hasInternalComponent;
 RangeConnected.install = function (Vue) {
   Vue.component(RangeConnected.name, RangeConnected);
 };