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

package/dist/cjs/StateProvider.js

@@ -11,7 +11,7 @@ var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js
 var VueTypes = _interopDefault(require('vue-types'));
 var transform = require('@appbaseio/reactivecore/lib/utils/transform');
 require('redux');
-var index = require('./index-30126fd0.js');
+var index = require('./index-dc25b706.js');
 
 var setSearchState = configureStore.Actions.setSearchState;
 var getSearchState = configureStore.helper.getSearchState;
@@ -220,7 +220,7 @@ var StateProvider = {
   },
   render: function render() {
     var searchState = this.searchState;
-    var dom = this.$scopedSlots["default"];
+    var dom = this.$slots["default"];
     return dom ? dom({
       searchState: searchState,
       setSearchState: this.setSearchState

package/dist/cjs/Title-8802a218.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
+var vueEmotion = require('@appbaseio/vue-emotion');
+
+var _templateObject;
+var Title = vueEmotion.styled('h2')(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tmargin: 0 0 8px;\n\tfont-size: 1rem;\n\tcolor: ", ";\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.colors.titleColor;
+});
+
+exports.Title = Title;

package/dist/cjs/ToggleButton.js

@@ -8,19 +8,20 @@ var configureStore = require('@appbaseio/reactivecore');
 var configureStore__default = _interopDefault(configureStore);
 var constants = require('@appbaseio/reactivecore/lib/utils/constants');
 require('./_rollupPluginBabelHelpers-f8b843f8.js');
+var vue = require('vue');
 var VueTypes = _interopDefault(require('vue-types'));
-require('emotion');
 require('@appbaseio/vue-emotion');
+require('emotion');
 require('polished');
-var Button = require('./Button-841fd06d.js');
-var vueTypes = require('./vueTypes-7cfc2f98.js');
+var Button = require('./Button-626c5e8e.js');
+var vueTypes = require('./vueTypes-621a8143.js');
 require('@appbaseio/reactivecore/lib/utils/transform');
 require('redux');
-var index = require('./index-30126fd0.js');
-var ComponentWrapper = require('./ComponentWrapper-b6d4660c.js');
-var PreferencesConsumer = require('./PreferencesConsumer-5d67b486.js');
-var Title = require('./Title-16042ea0.js');
-var Container = require('./Container-e699ea95.js');
+var index = require('./index-dc25b706.js');
+var ComponentWrapper = require('./ComponentWrapper-db45cc6d.js');
+var PreferencesConsumer = require('./PreferencesConsumer-034c55e3.js');
+var Title = require('./Title-8802a218.js');
+var Container = require('./Container-29f049b2.js');
 
 var updateQuery = configureStore.Actions.updateQuery,
   setQueryOptions = configureStore.Actions.setQueryOptions,
@@ -210,8 +211,7 @@ var ToggleButton = {
     },
     renderButton: function renderButton(item) {
       var _this2 = this;
-      var h = this.$createElement;
-      var renderItem = this.$scopedSlots.renderItem || this.renderItem;
+      var renderItem = this.$slots.renderItem || this.renderItem;
       var isSelected = this.$data.currentValue.some(function (value) {
         return value.value === item.value;
       });
@@ -221,37 +221,44 @@ var ToggleButton = {
         handleClick: function handleClick() {
           return _this2.handleClick(item);
         }
-      }) : h(Button.Button, {
+      }) : vue.createVNode(Button.Button, {
         "class": getClassName(this.$props.innerClass, 'button') + " " + (isSelected ? 'active' : ''),
-        "on": {
-          "click": function click() {
-            return _this2.handleClick(item);
-          },
-          "keypress": function keypress(e) {
-            return handleA11yAction(e, function () {
-              return _this2.handleClick(item);
-            });
-          }
+        "onClick": function onClick() {
+          return _this2.handleClick(item);
         },
         "key": item.value,
-        "attrs": {
-          "primary": isSelected,
-          "large": true,
-          "tabIndex": isSelected ? '-1' : '0'
+        "primary": isSelected,
+        "large": true,
+        "tabIndex": isSelected ? '-1' : '0',
+        "onKeypress": function onKeypress(e) {
+          return handleA11yAction(e, function () {
+            return _this2.handleClick(item);
+          });
+        }
+      }, {
+        "default": function _default() {
+          return [item.label];
         }
-      }, [item.label]);
+      });
     }
   },
   render: function render() {
     var _this3 = this;
-    var h = arguments[0];
-    return h(Container.Container, {
+    return vue.createVNode(Container.Container, {
       "class": Button.toggleButtons
-    }, [this.$props.title && h(Title.Title, {
-      "class": getClassName(this.$props.innerClass, 'title')
-    }, [this.$props.title]), this.$props.data.map(function (item) {
-      return _this3.renderButton(item);
-    })]);
+    }, {
+      "default": function _default() {
+        return [_this3.$props.title && vue.createVNode(Title.Title, {
+          "class": getClassName(_this3.$props.innerClass, 'title')
+        }, {
+          "default": function _default() {
+            return [_this3.$props.title];
+          }
+        }), _this3.$props.data.map(function (item) {
+          return _this3.renderButton(item);
+        })];
+      }
+    });
   }
 };
 ToggleButton.parseValue = function (value, props) {

package/dist/cjs/{index-30126fd0.js → index-dc25b706.js}

@@ -93,11 +93,11 @@ var connector = function connector(_mapState, mapDispatch) {
         };
         this._unsubscribe = observeStore(this.$$store, getMappedState, function (newState) {
           Object.keys(newState).forEach(function (key) {
-            _this.$set(_this, key, newState[key]);
+            _this[key] = newState[key];
           });
         });
       },
-      beforeDestroy: function beforeDestroy() {
+      beforeUnmount: function beforeUnmount() {
         this._unsubscribe();
       }
     };
@@ -171,7 +171,7 @@ var getComponent = function getComponent(data, _ref) {
   if (_ref === void 0) {
     _ref = {};
   }
-  var _ref2 = _ref.$scopedSlots || _ref.$props,
+  var _ref2 = _ref.$slots || _ref.$props,
     render = _ref2.render;
   if (render) return render(data);
   return null;
@@ -184,7 +184,7 @@ var hasCustomRenderer = function hasCustomRenderer(_ref) {
   if (_ref === void 0) {
     _ref = {};
   }
-  var _ref3 = _ref.$scopedSlots || _ref.$props,
+  var _ref3 = _ref.$slots || _ref.$props,
     render = _ref3.render;
   return Boolean(render);
 };
@@ -233,7 +233,7 @@ var getQuerySuggestionsComponent = function getQuerySuggestionsComponent(data, _
   if (_ref === void 0) {
     _ref = {};
   }
-  var _ref4 = _ref.$scopedSlots || _ref.$props,
+  var _ref4 = _ref.$slots || _ref.$props,
     renderQuerySuggestions = _ref4.renderQuerySuggestions,
     renderPopularSuggestions = _ref4.renderPopularSuggestions;
   var render = renderPopularSuggestions || renderQuerySuggestions;
@@ -248,7 +248,7 @@ var hasQuerySuggestionsRenderer = function hasQuerySuggestionsRenderer(_ref) {
   if (_ref === void 0) {
     _ref = {};
   }
-  var _ref5 = _ref.$scopedSlots || _ref.$props,
+  var _ref5 = _ref.$slots || _ref.$props,
     renderQuerySuggestions = _ref5.renderQuerySuggestions,
     renderPopularSuggestions = _ref5.renderPopularSuggestions;
   return Boolean(renderPopularSuggestions) || Boolean(renderQuerySuggestions);

package/dist/cjs/index.js

@@ -5,49 +5,50 @@ Object.defineProperty(exports, '__esModule', { value: true });
 require('@appbaseio/reactivecore');
 var constants = require('@appbaseio/reactivecore/lib/utils/constants');
 require('./_rollupPluginBabelHelpers-f8b843f8.js');
+require('vue');
 require('vue-types');
 require('@appbaseio/reactivecore/lib/utils/helper');
-require('emotion');
 require('@appbaseio/vue-emotion');
+require('emotion');
 require('polished');
-require('./Button-841fd06d.js');
-require('./vueTypes-7cfc2f98.js');
-require('./Pagination-07f4dbad.js');
+require('./Button-626c5e8e.js');
+require('./vueTypes-621a8143.js');
+require('./Pagination-a468f960.js');
 var ReactiveList = require('./ReactiveList.js');
 require('@appbaseio/reactivecore/lib/utils/transform');
 require('redux');
-require('./index-30126fd0.js');
-require('./ComponentWrapper-b6d4660c.js');
-require('./PreferencesConsumer-5d67b486.js');
-require('@vue/babel-helper-vue-jsx-merge-props');
-require('./Title-16042ea0.js');
-require('./ListItem-5088bd6a.js');
-require('./Card-240f283d.js');
-require('./Flex-ddd7cb6b.js');
+require('./index-dc25b706.js');
+require('./ComponentWrapper-db45cc6d.js');
+require('./PreferencesConsumer-034c55e3.js');
+require('./Title-8802a218.js');
+require('./ListItem-c067bc07.js');
+require('./Card-c381ded3.js');
+require('./Flex-d5675ea6.js');
 require('@appbaseio/reactivecore/lib/actions/analytics');
 require('appbase-js');
 require('@appbaseio/analytics');
 require('url-search-params-polyfill');
 var ReactiveBase = require('./ReactiveBase.js');
 require('hotkeys-js');
-var DataSearch = require('./DataSearch-1c5c2202.js');
-require('./CancelSvg-220a7cc3.js');
-require('./Input-ead4cd84.js');
+var DataSearch = require('./DataSearch-7c71ec9f.js');
+require('./CancelSvg-062a42f0.js');
+require('./Input-4d278ca0.js');
 require('compute-scroll-into-view');
-require('./Container-e699ea95.js');
+require('./Container-29f049b2.js');
 require('vue-highlight-words');
-var ReactiveComponent = require('./ReactiveComponent-4e75c939.js');
+require('@vue/babel-helper-vue-transform-on');
+var ReactiveComponent = require('./ReactiveComponent-f0f486ca.js');
 require('@appbaseio/reactivecore/lib/utils/suggestions');
-require('./FormControlList-bbb5cd24.js');
+require('./FormControlList-cf1ff2ca.js');
 require('./utils-83fd01e9.js');
 var SingleList = require('./SingleList.js');
 var MultiList = require('./MultiList.js');
-require('./DropDown-8984b544.js');
+require('./DropDown-3b899b20.js');
 var SingleDropdownList = require('./SingleDropdownList.js');
 var MultiDropdownList = require('./MultiDropdownList.js');
 var ToggleButton = require('./ToggleButton.js');
 require('vue-no-ssr');
-require('./ssr-f2fc1bf6.js');
+require('./ssr-eb901d09.js');
 var DynamicRangeSlider = require('./DynamicRangeSlider.js');
 var SingleRange = require('./SingleRange.js');
 var MultiRange = require('./MultiRange.js');
@@ -57,7 +58,7 @@ var SelectedFilters = require('./SelectedFilters.js');
 var ResultCard = require('./ResultCard.js');
 var ResultList = require('./ResultList.js');
 var StateProvider = require('./StateProvider.js');
-require('gmap-vue');
+require('vue-google-maps-community-fork');
 require('ngeohash');
 var ReactiveGoogleMap = require('./ReactiveGoogleMap.js');
 require('@appbaseio/reactivecore/lib/reducers/valueReducer');

package/dist/cjs/install.js

@@ -5,49 +5,50 @@ Object.defineProperty(exports, '__esModule', { value: true });
 require('@appbaseio/reactivecore');
 require('@appbaseio/reactivecore/lib/utils/constants');
 require('./_rollupPluginBabelHelpers-f8b843f8.js');
+require('vue');
 require('vue-types');
 require('@appbaseio/reactivecore/lib/utils/helper');
-require('emotion');
 require('@appbaseio/vue-emotion');
+require('emotion');
 require('polished');
-require('./Button-841fd06d.js');
-require('./vueTypes-7cfc2f98.js');
-require('./Pagination-07f4dbad.js');
+require('./Button-626c5e8e.js');
+require('./vueTypes-621a8143.js');
+require('./Pagination-a468f960.js');
 var ReactiveList = require('./ReactiveList.js');
 require('@appbaseio/reactivecore/lib/utils/transform');
 require('redux');
-require('./index-30126fd0.js');
-require('./ComponentWrapper-b6d4660c.js');
-require('./PreferencesConsumer-5d67b486.js');
-require('@vue/babel-helper-vue-jsx-merge-props');
-require('./Title-16042ea0.js');
-require('./ListItem-5088bd6a.js');
-require('./Card-240f283d.js');
-require('./Flex-ddd7cb6b.js');
+require('./index-dc25b706.js');
+require('./ComponentWrapper-db45cc6d.js');
+require('./PreferencesConsumer-034c55e3.js');
+require('./Title-8802a218.js');
+require('./ListItem-c067bc07.js');
+require('./Card-c381ded3.js');
+require('./Flex-d5675ea6.js');
 require('@appbaseio/reactivecore/lib/actions/analytics');
 require('appbase-js');
 require('@appbaseio/analytics');
 require('url-search-params-polyfill');
 var ReactiveBase = require('./ReactiveBase.js');
 require('hotkeys-js');
-var DataSearch = require('./DataSearch-1c5c2202.js');
-require('./CancelSvg-220a7cc3.js');
-require('./Input-ead4cd84.js');
+var DataSearch = require('./DataSearch-7c71ec9f.js');
+require('./CancelSvg-062a42f0.js');
+require('./Input-4d278ca0.js');
 require('compute-scroll-into-view');
-require('./Container-e699ea95.js');
+require('./Container-29f049b2.js');
 require('vue-highlight-words');
-var ReactiveComponent = require('./ReactiveComponent-4e75c939.js');
+require('@vue/babel-helper-vue-transform-on');
+var ReactiveComponent = require('./ReactiveComponent-f0f486ca.js');
 require('@appbaseio/reactivecore/lib/utils/suggestions');
-require('./FormControlList-bbb5cd24.js');
+require('./FormControlList-cf1ff2ca.js');
 require('./utils-83fd01e9.js');
 var SingleList = require('./SingleList.js');
 var MultiList = require('./MultiList.js');
-require('./DropDown-8984b544.js');
+require('./DropDown-3b899b20.js');
 var SingleDropdownList = require('./SingleDropdownList.js');
 var MultiDropdownList = require('./MultiDropdownList.js');
 var ToggleButton = require('./ToggleButton.js');
 require('vue-no-ssr');
-require('./ssr-f2fc1bf6.js');
+require('./ssr-eb901d09.js');
 var DynamicRangeSlider = require('./DynamicRangeSlider.js');
 var SingleRange = require('./SingleRange.js');
 var MultiRange = require('./MultiRange.js');

package/dist/cjs/ssr-eb901d09.js

@@ -0,0 +1,35 @@
+'use strict';
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
+var vueEmotion = require('@appbaseio/vue-emotion');
+var NoSSR = _interopDefault(require('vue-no-ssr'));
+
+var _templateObject;
+var Slider = vueEmotion.styled('div')(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tmargin-top: 30px;\n\tpadding: 10px;\n\n\t/* component style */\n\t.vue-slider-disabled {\n\t\topacity: 0.5;\n\t\tcursor: not-allowed;\n\t}\n\n\t/* rail style */\n\t.vue-slider-rail {\n\t\tbackground-color: #ccc;\n\t\tborder-radius: 15px;\n\t\theight: 4px;\n\t}\n\n\t/* process style */\n\t.vue-slider-process {\n\t\tbackground-color: #0b6aff;\n\t\tborder-radius: 15px;\n\t}\n\n\t/* mark style */\n\t.vue-slider-mark {\n\t\tz-index: 4;\n\t}\n\n\t.vue-slider-mark:first-child .vue-slider-mark-step,\n\t.vue-slider-mark:last-child .vue-slider-mark-step {\n\t\tdisplay: none;\n\t}\n\n\t.vue-slider-mark-step {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder-radius: 50%;\n\t\tbackground-color: rgba(0, 0, 0, 0.16);\n\t}\n\n\t.vue-slider-mark-label {\n\t\tfont-size: 14px;\n\t\twhite-space: nowrap;\n\t}\n\n\t/* dot style */\n\t.vue-slider-dot {\n\t\tz-index: 2;\n\t}\n\n\t.vue-slider-dot-handle {\n\t\tcursor: pointer;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder-radius: 50%;\n\t\tbackground-color: #fff;\n\t\tbox-sizing: border-box;\n\t\tborder: 1px solid #9a9a9a;\n\t\tz-index: 2;\n\t\tbox-shadow: 0.5px 0.5px 2px 1px rgb(0 0 0 / 32%);\n\t}\n\n\t.vue-slider-dot-handle-disabled {\n\t\tcursor: not-allowed;\n\t\tbackground-color: #ccc;\n\t}\n\n\t.vue-slider-dot-tooltip-inner {\n\t\tfont-size: 14px;\n\t\twhite-space: nowrap;\n\t\tpadding: 2px 5px;\n\t\tmin-width: 20px;\n\t\ttext-align: center;\n\t\tcolor: #fff;\n\t\tborder-radius: 5px;\n\t\tborder: 1px solid #3498db;\n\t\tbackground-color: #3498db;\n\t\tbox-sizing: content-box;\n\t}\n\n\t.vue-slider-dot-tooltip-inner::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t}\n\n\t.vue-slider-dot-tooltip-inner-top::after {\n\t\ttop: 100%;\n\t\tleft: 50%;\n\t\ttransform: translate(-50%, 0);\n\t\theight: 0;\n\t\twidth: 0;\n\t\tborder-color: transparent;\n\t\tborder-style: solid;\n\t\tborder-width: 5px;\n\t\tborder-top-color: inherit;\n\t}\n\n\t.vue-slider-dot-tooltip-inner-bottom::after {\n\t\tbottom: 100%;\n\t\tleft: 50%;\n\t\ttransform: translate(-50%, 0);\n\t\theight: 0;\n\t\twidth: 0;\n\t\tborder-color: transparent;\n\t\tborder-style: solid;\n\t\tborder-width: 5px;\n\t\tborder-bottom-color: inherit;\n\t}\n\n\t.vue-slider-dot-tooltip-inner-left::after {\n\t\tleft: 100%;\n\t\ttop: 50%;\n\t\ttransform: translate(0, -50%);\n\t\theight: 0;\n\t\twidth: 0;\n\t\tborder-color: transparent;\n\t\tborder-style: solid;\n\t\tborder-width: 5px;\n\t\tborder-left-color: inherit;\n\t}\n\n\t.vue-slider-dot-tooltip-inner-right::after {\n\t\tright: 100%;\n\t\ttop: 50%;\n\t\ttransform: translate(0, -50%);\n\t\theight: 0;\n\t\twidth: 0;\n\t\tborder-color: transparent;\n\t\tborder-style: solid;\n\t\tborder-width: 5px;\n\t\tborder-right-color: inherit;\n\t}\n\n\t.vue-slider-dot-tooltip-wrapper {\n\t\topacity: 0;\n\t\ttransition: all 0.3s;\n\t}\n\t.vue-slider-dot-tooltip-wrapper-show {\n\t\topacity: 1;\n\t}\n\n\t.label-container {\n\t\tmargin: 10px 0;\n\t\twidth: 100%;\n\t}\n\n\t.range-label-right {\n\t\tfloat: right;\n\t}\n"])));
+
+/**
+ * Caution: Please do not change this file without having a discussion with the Team.
+ * Any change may break the umd build, we're directly replacing the line no: 14
+ * `components['vue-slider-component'] = require('vue-slider-component');` in rollup umd build process with some script.
+ */
+// eslint-disable-next-line
+var getComponents = function getComponents() {
+  var components = {
+    NoSSR: NoSSR
+  };
+  if (process.browser) {
+    try {
+      // in older versions of nuxt, it's process.BROWSER_BUILD
+      // eslint-disable-next-line
+      components['vue-slider-component'] = require('vue-slider-component');
+    } catch (e) {
+      console.error('Unable to load vue-slider', e);
+    }
+  }
+  return components;
+};
+
+exports.Slider = Slider;
+exports.getComponents = getComponents;

package/dist/cjs/version.js

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

package/dist/cjs/{vueTypes-7cfc2f98.js → vueTypes-621a8143.js}

@@ -99,7 +99,7 @@ var types = {
   params: VueTypes.object.isRequired,
   props: VueTypes.object,
   rangeLabelsAlign: VueTypes.oneOf(['left', 'right']),
-  title: VueTypes.oneOfType([VueTypes.string, VueTypes.any]),
+  title: VueTypes.oneOfType([VueTypes.string, VueTypes.nullable]),
   tooltipTrigger: VueTypes.oneOf(['always', 'none', 'hover']),
   location: VueTypes.custom(validateLocation),
   unit: VueTypes.oneOf(['mi', 'miles', 'yd', 'yards', 'ft', 'feet', 'in', 'inch', 'km', 'kilometers', 'm', 'meters', 'cm', 'centimeters', 'mm', 'millimeters', 'NM', 'nmi', 'nauticalmiles']),

package/dist/es/Button-ebafa3d6.js

@@ -0,0 +1,52 @@
+import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ded08042.js';
+import { styled } from '@appbaseio/vue-emotion';
+import { css } from 'emotion';
+import { darken, rgba, lighten } from 'polished';
+
+var _templateObject, _templateObject2;
+var filters = function filters(_ref) {
+  var borderColor = _ref.colors.borderColor;
+  return "\n\tmargin: 0 -3px;\n\tmax-width: 100%;\n\n\tbutton {\n\t\tmargin: 2px 3px;\n\t\tpadding: 5px 8px;\n\t\tfont-size: 0.85rem;\n\t\tposition: relative;\n\n\t\tspan:first-child {\n\t\t\tmax-width: 260px;\n\t\t\twhite-space: nowrap;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t\tmargin-right: 26px;\n\t\t}\n\n\t\tspan:last-child {\n\t\t\tdisplay: flex;\n\t\t\theight: 100%;\n\t\t\ttop: 0;\n\t\t\tright: 8px;\n\t\t\tposition: absolute;\n\t\t\talign-items: center;\n\t\t\tborder-left: 1px solid " + (borderColor || '#fff') + ";\n\t\t\tpadding-left: 8px;\n\t\t\tmargin-left: 8px;\n\t\t}\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tspan:first-child {\n\t\t\t\ttext-decoration: line-through;\n\t\t\t}\n\t\t}\n\t}\n";
+};
+var pagination = css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\tmargin: 10px -3px;\n\tmax-width: 100%;\n\ttext-align: center;\n\n\tbutton {\n\t\tmargin: 0 3px;\n\t}\n"])));
+var toggleButtons = "\n\tmargin: 0 -3px;\n\tmax-width: 100%;\n\n\tbutton {\n\t\tmargin: 3px 3px;\n\t}\n";
+var primary = function primary(_ref2) {
+  var theme = _ref2.theme;
+  return "\n\tbackground-color: " + theme.colors.primaryColor + ";\n\tcolor: " + theme.colors.primaryTextColor + ";\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: " + darken(0.1, theme.colors.primaryColor) + ";\n\t}\n";
+};
+var large = function large() {
+  return "\n\tmin-height: 40px;\n\tpadding: 10px 20px;\n";
+};
+var disabled = function disabled(_ref3) {
+  var theme = _ref3.theme;
+  return "\n\tbackground-color: " + (theme.colors.backgroundColor ? lighten(0.1, theme.colors.backgroundColor) : '#fafafa') + ";\n\tcolor: #ccc;\n\tcursor: not-allowed;\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: " + (theme.colors.backgroundColor ? lighten(0.2, theme.colors.backgroundColor) : '#fafafa') + ";\n\t}\n";
+};
+var Button = styled('button')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tborder-radius: 3px;\n\tborder: 1px solid transparent;\n\tmin-height: 30px;\n\tword-wrap: break-word;\n\tpadding: 5px 12px;\n\tline-height: 1.2rem;\n\tbackground-color: ", ";\n\tcolor: ", ";\n\tcursor: pointer;\n\tuser-select: none;\n\ttransition: all 0.3s ease;\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: ", ";\n\t}\n\n\t&:focus {\n\t\toutline: 0;\n\t\tborder-color: ", ";\n\t\tbox-shadow: ", ";\n\t}\n\n\t", ";\n\t", ";\n\t", ";\n\n\t&.enter-btn {\n\t\tborder-top-left-radius: 0px;\n\t\tborder-bottom-left-radius: 0px;\n\t\theight: 100%;\n\t}\n"])), function (_ref4) {
+  var theme = _ref4.theme;
+  return theme.colors ? theme.colors.backgroundColor : '#eee';
+}, function (_ref5) {
+  var theme = _ref5.theme;
+  return theme.colors ? theme.colors.textColor : '';
+}, function (_ref6) {
+  var theme = _ref6.theme;
+  return theme.colors && theme.colors.backgroundColor ? darken(0.1, theme.colors.backgroundColor) : '#ccc';
+}, function (_ref7) {
+  var theme = _ref7.theme;
+  return theme.colors && theme.colors.primaryColor ? rgba(theme.colors.primaryColor, 0.6) : 'unset';
+}, function (_ref8) {
+  var theme = _ref8.theme;
+  return theme.colors && theme.colors.primaryColor ? "0 0 0 2px " + rgba(theme.colors.primaryColor, 0.3) : '';
+}, function (props) {
+  return props.primary ? primary : null;
+}, function (props) {
+  return props.disabled ? disabled : null;
+}, function (props) {
+  return props.large && large;
+});
+var loadMoreContainer = css({
+  margin: '5px 0',
+  display: 'flex',
+  justifyContent: 'center'
+});
+
+export { Button as B, filters as f, loadMoreContainer as l, pagination as p, toggleButtons as t };

package/dist/es/{CancelSvg-e40552a5.js → CancelSvg-14ebc9a1.js}

@@ -1,29 +1,32 @@
 import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
-import styled, { css } from '@appbaseio/vue-emotion';
+import { createVNode, createTextVNode } from 'vue';
+import { styled } from '@appbaseio/vue-emotion';
 import computeScrollIntoView from 'compute-scroll-into-view';
 
 var _templateObject;
 var InputWrapper = styled('span')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  flex: 1;\n  position: relative;\n"])));
 
-var _templateObject$1, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject$1;
 var IconGroup = styled('div')(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgrid-gap: 6px;\n\tmargin: 0 10px;\n\theight: 100%;\n\n\t", ";\n\n\t", ";\n"])), function (_ref) {
   var positionType = _ref.positionType;
   if (positionType === 'absolute') {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 50%;\n\t\t\t\ttransform: translateY(-50%);\n\t\t\t"])));
+    return "\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 50%;\n\t\t\t\ttransform: translateY(-50%);\n\t\t\t";
   }
   return null;
 }, function (_ref2) {
   var groupPosition = _ref2.groupPosition;
-  return groupPosition === 'right' ? css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\t\t\t\t\tright: 0;\n\t\t\t  "]))) : css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n\t\t\t\t\tleft: 0;\n\t\t\t  "])));
+  return groupPosition === 'right' ? "\n\t\t\t\t\tright: 0;\n\t\t\t  " : "\n\t\t\t\t\tleft: 0;\n\t\t\t  ";
 });
 
 var _templateObject$2;
-var IconWrapper = styled('div')(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmax-width: 23px;\n\twidth: max-content;\n\tcursor: pointer;\n\theight: 100%;min-width:20px;\n\n\tsvg.search-icon {\n\t\tfill: ", ";\n\t\ttransform:scale(1.5);\n\t}\n\n\tsvg.cancel-icon {\n\t\tfill: ", ";\n\t}\n"])), function (_ref) {
-  var theme = _ref.theme;
-  return theme.colors.primaryColor;
+var IconWrapper = styled('div')(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmax-width: 23px;\n\twidth: max-content;\n\tcursor: pointer;\n\theight: 100%;\n\tmin-width: 20px;\n\n\tsvg.search-icon {\n\t\tfill: ", ";\n\t\ttransform: scale(1.5);\n\t}\n\n\tsvg.cancel-icon {\n\t\tfill: ", ";\n\t}\n"])), function (_ref) {
+  var _ref$theme = _ref.theme,
+    theme = _ref$theme === void 0 ? {} : _ref$theme;
+  return theme.colors ? theme.colors.primaryColor : 'unset';
 }, function (_ref2) {
-  var theme = _ref2.theme;
-  return theme.colors.borderColor || '#000';
+  var _ref2$theme = _ref2.theme,
+    theme = _ref2$theme === void 0 ? {} : _ref2$theme;
+  return theme.colors ? theme.colors.borderColor : '#000';
 });
 
 /**
@@ -78,7 +81,7 @@ var Downshift = {
     window.addEventListener('mousedown', this.handleWindowMousedown);
     window.addEventListener('mouseup', this.handleWindowMouseup);
   },
-  beforeDestroy: function beforeDestroy() {
+  beforeUnmount: function beforeUnmount() {
     window.removeEventListener('mousedown', this.handleWindowMousedown);
     window.removeEventListener('mouseup', this.handleWindowMouseup);
   },
@@ -370,37 +373,27 @@ var Downshift = {
     }
   },
   render: function render() {
-    var h = arguments[0];
     this.items = [];
-    return h("div", {
+    return createVNode("div", {
       "ref": "rootNode"
-    }, [this.$scopedSlots["default"] && this.$scopedSlots["default"](_extends({}, this.getHelpersAndState()))]);
+    }, [this.$slots["default"] && this.$slots["default"](_extends({}, this.getHelpersAndState()))]);
   }
 };
 
-var CancelSvg = {
-  functional: true,
-  render: function render(h) {
-    return h("svg", {
-      "attrs": {
-        "alt": "Clear",
-        "xmlns": "http://www.w3.org/2000/svg",
-        "height": "20px",
-        "viewBox": "0 0 24 24",
-        "width": "20px"
-      },
-      "class": "cancel-icon"
-    }, [h("title", ["Clear"]), h("path", {
-      "attrs": {
-        "d": "M0 0h24v24H0V0z",
-        "fill": "none"
-      }
-    }), h("path", {
-      "attrs": {
-        "d": "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
-      }
-    })]);
-  }
-};
+var CancelSvg = (function () {
+  return createVNode("svg", {
+    "alt": "Clear",
+    "class": "cancel-icon",
+    "xmlns": "http://www.w3.org/2000/svg",
+    "height": "20px",
+    "viewBox": "0 0 24 24",
+    "width": "20px"
+  }, [createVNode("title", null, [createTextVNode("Clear")]), createVNode("path", {
+    "d": "M0 0h24v24H0V0z",
+    "fill": "none"
+  }, null), createVNode("path", {
+    "d": "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
+  }, null)]);
+});
 
 export { CancelSvg as C, Downshift as D, IconWrapper as I, IconGroup as a, InputWrapper as b };

package/dist/es/{Card-19ad6d90.js → Card-1951569e.js}

@@ -1,16 +1,15 @@
 import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ded08042.js';
-import { css } from 'emotion';
-import styled from '@appbaseio/vue-emotion';
+import { styled } from '@appbaseio/vue-emotion';
 import { lighten } from 'polished';
 import './Title-863dfa42.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"])));
-var Image = styled('div')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\twidth: calc(100% + 20px);\n\theight: 220px;\n\tmargin: -10px -10px 0;\n\tbackground-color: ", ";\n\tbackground-size: contain;\n\tbackground-position: center center;\n\tbackground-repeat: no-repeat;\n"])), function (_ref) {
+var _templateObject, _templateObject2;
+var container = "\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";
+var Image = styled('div')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\twidth: calc(100% + 20px);\n\theight: 220px;\n\tmargin: -10px -10px 0;\n\tbackground-color: ", ";\n\tbackground-size: contain;\n\tbackground-position: center center;\n\tbackground-repeat: no-repeat;\n"])), function (_ref) {
   var colors = _ref.theme.colors;
   return colors.backgroundColor || '#fcfcfc';
 });
-var Card = styled('a')(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\twidth: auto;\n\tflex-grow: 1;\n\toutline: none;\n\ttext-decoration: none;\n\tmin-width: 240px;\n\tmax-width: 250px;\n\tborder-radius: 0.25rem;\n\tbackground-color: ", ";\n\theight: 300px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\tmargin: 8px;\n\tpadding: 10px;\n\toverflow: hidden;\n\tbox-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);\n\tcolor: ", ";\n\t", ";\n\ttransition: all 0.3s ease;\n\n\th2 {\n\t\twidth: 100%;\n\t\tfont-size: 0.9rem;\n\t\tline-height: 1.2rem;\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\tmargin: 0;\n\t\tpadding: 10px 0 8px;\n\t}\n\n\tp {\n\t\tmargin: 0;\n\t}\n\n\tarticle {\n\t\tflex-grow: 1;\n\t\tfont-size: 0.9rem;\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\tbox-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.3);\n\t}\n\n\t@media (max-width: 420px) {\n\t\twidth: 50%;\n\t\tmin-width: 0;\n\t\theight: 210px;\n\t\tmargin: 0;\n\t\tborder-radius: 0;\n\t\tbox-shadow: none;\n\t\tborder: 1px solid #eee;\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tbox-shadow: 0;\n\t\t}\n\t}\n"])), function (_ref2) {
+var Card = styled('a')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\twidth: auto;\n\tflex-grow: 1;\n\toutline: none;\n\ttext-decoration: none;\n\tmin-width: 240px;\n\tmax-width: 250px;\n\tborder-radius: 0.25rem;\n\tbackground-color: ", ";\n\theight: 300px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\tmargin: 8px;\n\tpadding: 10px;\n\toverflow: hidden;\n\tbox-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);\n\tcolor: ", ";\n\t", ";\n\ttransition: all 0.3s ease;\n\n\th2 {\n\t\twidth: 100%;\n\t\tfont-size: 0.9rem;\n\t\tline-height: 1.2rem;\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\tmargin: 0;\n\t\tpadding: 10px 0 8px;\n\t}\n\n\tp {\n\t\tmargin: 0;\n\t}\n\n\tarticle {\n\t\tflex-grow: 1;\n\t\tfont-size: 0.9rem;\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\tbox-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.3);\n\t}\n\n\t@media (max-width: 420px) {\n\t\twidth: 50%;\n\t\tmin-width: 0;\n\t\theight: 210px;\n\t\tmargin: 0;\n\t\tborder-radius: 0;\n\t\tbox-shadow: none;\n\t\tborder: 1px solid #eee;\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tbox-shadow: 0;\n\t\t}\n\t}\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.backgroundColor ? lighten(0.1, theme.colors.backgroundColor) : '#fff';
 }, function (_ref3) {

package/dist/es/{ComponentWrapper-8042aa35.js → ComponentWrapper-bf443c0b.js}

@@ -1,9 +1,10 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import { a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
+import { h } from 'vue';
 import VueTypes from 'vue-types';
 import { getInternalComponentID } from '@appbaseio/reactivecore/lib/utils/transform';
-import { c as connect, b as getCamelCase, d as getValidPropsKeys } from './index-0444a498.js';
+import { c as connect, b as getCamelCase, d as getValidPropsKeys } from './index-285a43a6.js';
 
 var addComponent = Actions.addComponent,
   removeComponent = Actions.removeComponent,
@@ -148,11 +149,10 @@ var ComponentWrapper = function ComponentWrapper(component, options) {
         }
       }
     },
-    render: function render(h) {
+    render: function render() {
       return h(component, {
         attrs: this.$attrs,
-        on: this.$listeners,
-        scopedSlots: this.$scopedSlots,
+        on: this.$attrs,
         slots: this.$slots
       });
     }

package/dist/es/Container-d00219f7.js

@@ -1,5 +1,5 @@
 import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-ded08042.js';
-import styled from '@appbaseio/vue-emotion';
+import { styled } from '@appbaseio/vue-emotion';
 
 var _templateObject;
 var Container = styled('div')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\t", ";\n"])), function (_ref) {