@appbaseio/reactivesearch-vue 1.16.0-alpha.34 → 1.16.0-alpha.37

package/dist/es/Pagination-b3e4054a.js

@@ -0,0 +1,172 @@
+import { helper } from '@appbaseio/reactivecore';
+import VueTypes from 'vue-types';
+import { p as pagination, B as Button } from './Button-799185e2.js';
+import { t as types } from './vueTypes-9326e0be.js';
+
+var getClassName = helper.getClassName,
+    handleA11yAction = helper.handleA11yAction;
+
+function getStartPage(totalPages, currentPage, showEndPage) {
+  var midValue = parseInt(totalPages / 2, 10);
+  var start = currentPage - (showEndPage ? Math.ceil(midValue / 2) - 1 : midValue);
+  return start > 1 ? start : 2;
+}
+
+var Pagination = {
+  name: 'Pagination',
+  functional: true,
+  props: {
+    currentPage: types.number,
+    innerClass: types.style,
+    pages: types.number,
+    setPage: types.func,
+    totalPages: types.number,
+    showEndPage: VueTypes.bool,
+    prevLabel: types.string,
+    nextLabel: types.string
+  },
+  render: function render(createElement, context) {
+    var h = arguments[0];
+    var props = context.props;
+
+    var onPrevPage = function onPrevPage() {
+      if (props.currentPage) {
+        props.setPage(props.currentPage - 1);
+      }
+    };
+
+    var onNextPage = function onNextPage() {
+      if (props.currentPage < props.totalPages - 1) {
+        props.setPage(props.currentPage + 1);
+      }
+    };
+
+    if (!props.totalPages) {
+      return null;
+    }
+
+    var innerClassName = getClassName(props.innerClass, 'button');
+    var primary = props.currentPage === 0;
+    var className = innerClassName || primary ? innerClassName + " " + (primary ? 'active' : '') : '';
+
+    var buildPaginationDOM = function buildPaginationDOM(position) {
+      var pages = props.pages,
+          currentPage = props.currentPage,
+          totalPages = props.totalPages,
+          setPage = props.setPage,
+          showEndPage = props.showEndPage;
+      var start = position === 'start' ? getStartPage(pages, currentPage, showEndPage) : Math.max(2, Math.ceil(totalPages - (pages - 1) / 2 + 1));
+      var paginationButtons = [];
+
+      if (start <= totalPages) {
+        var totalPagesToShow = pages < totalPages ? start + (pages - 1) : totalPages + 1;
+
+        if (showEndPage) {
+          totalPagesToShow = position === 'start' ? start + (Math.ceil(pages / 2) - pages % 2) : totalPages + 1;
+        }
+
+        if (currentPage > totalPages - pages + 2) {
+          start = Math.max(2, totalPages - pages + 2);
+          totalPagesToShow = start + pages;
+        }
+
+        var _loop = function _loop(i) {
+          var activeButton = currentPage === i - 1;
+          var classNameBtn = innerClassName || activeButton ? innerClassName + " " + (activeButton ? 'active' : '') : '';
+          var pageBtn = h(Button, {
+            "class": classNameBtn,
+            "attrs": {
+              "primary": activeButton,
+              "tabIndex": "0",
+              "alt": "page-" + i
+            },
+            "on": {
+              "keyPress": function keyPress(event) {
+                return handleA11yAction(event, function () {
+                  return setPage(i - 1);
+                });
+              },
+              "click": function click() {
+                return setPage(i - 1);
+              }
+            }
+          }, [i]);
+
+          if (i <= totalPages + 1) {
+            paginationButtons.push(pageBtn);
+          }
+        };
+
+        for (var i = start; i < Math.min(totalPages + 1, totalPagesToShow); i += 1) {
+          _loop(i);
+        }
+      }
+
+      return paginationButtons;
+    };
+
+    var buildIntermediatePaginationDom = function buildIntermediatePaginationDom() {
+      var showEndPage = props.showEndPage,
+          currentPage = props.currentPage,
+          totalPages = props.totalPages,
+          pages = props.pages;
+      if (!showEndPage) return buildPaginationDOM('start');
+
+      if (currentPage <= totalPages - pages + 2 || totalPages <= pages) {
+        return buildPaginationDOM('start');
+      }
+
+      return null;
+    };
+
+    return h("div", {
+      "class": pagination + " " + getClassName(props.innerClass, 'pagination')
+    }, [h(Button, {
+      "class": getClassName(props.innerClass, 'button') || '',
+      "attrs": {
+        "disabled": props.currentPage === 0,
+        "tabIndex": "0"
+      },
+      "on": {
+        "keyPress": function keyPress(event) {
+          return handleA11yAction(event, onPrevPage);
+        },
+        "click": onPrevPage
+      }
+    }, [props.prevLabel || 'Prev']), h(Button, {
+      "class": className,
+      "attrs": {
+        "primary": primary,
+        "tabIndex": "0"
+      },
+      "on": {
+        "keyPress": function keyPress(event) {
+          return handleA11yAction(event, function () {
+            return props.setPage(0);
+          });
+        },
+        "click": function click() {
+          return props.setPage(0);
+        }
+      }
+    }, ["1"]), props.showEndPage && props.currentPage >= Math.floor(props.pages / 2) + !!(props.pages % 2) ? h("span", ["..."]) : null, buildIntermediatePaginationDom(), props.showEndPage && props.pages > 2 && props.currentPage <= props.totalPages - Math.ceil(props.pages * 0.75) ? h("span", ["..."]) : null, props.showEndPage && props.totalPages >= props.pages && buildPaginationDOM('end'), h(Button, {
+      "class": getClassName(props.innerClass, 'button') || '',
+      "attrs": {
+        "disabled": props.currentPage >= props.totalPages - 1,
+        "tabIndex": "0"
+      },
+      "on": {
+        "keyPress": function keyPress(event) {
+          return handleA11yAction(event, onNextPage);
+        },
+        "click": onNextPage
+      }
+    }, [props.nextLabel || 'Next'])]);
+  }
+};
+
+Pagination.install = function (Vue) {
+  Vue.component(Pagination.name, Pagination);
+};
+
+export { Pagination as P };

package/dist/es/RangeInput.js

@@ -1,21 +1,21 @@
 import { helper } from '@appbaseio/reactivecore';
-import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-0f24d612.js';
+import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
 import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import { css } from 'emotion';
 import styled from '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-687b2304.js';
+import { t as types } from './vueTypes-9326e0be.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { c as connect } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
-import './Title-3522ff56.js';
-import { F as Flex } from './Flex-8770345d.js';
-import { I as Input } from './Input-08bb1bcf.js';
-import { C as Container } from './Container-18b03fde.js';
+import { c as connect } from './index-5daa8276.js';
+import { C as ComponentWrapper } from './ComponentWrapper-bbb717bc.js';
+import './Title-579f8d6c.js';
+import { F as Flex } from './Flex-aac91505.js';
+import { I as Input } from './Input-d8519224.js';
+import { C as Container } from './Container-4383c6f0.js';
 import 'vue-no-ssr';
-import './ssr-a41dfea9.js';
+import './ssr-e3196de1.js';
 import { RangeConnected as RangeConnected$1 } from './RangeSlider.js';
 
 var _templateObject, _templateObject2;
@@ -193,6 +193,10 @@ var RangeInput = {
     if (this.$props.defaultValue && this.$props.defaultValue.start && this.$props.defaultValue.end) {
       this.handleChange(this.$props.defaultValue);
     }
+
+    if (this.isControlled()) {
+      this.handleChange(this.$props.value, 'change');
+    }
   },
   render: function render() {
     var h = arguments[0];

package/dist/es/RangeSlider.js

@@ -1,17 +1,17 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
-import { a as _extends } from './_rollupPluginBabelHelpers-0f24d612.js';
+import { a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
 import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import '@appbaseio/vue-emotion';
-import { t as types } from './vueTypes-687b2304.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-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
-import { T as Title } from './Title-3522ff56.js';
-import { C as Container } from './Container-18b03fde.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 NoSSR from 'vue-no-ssr';
-import { g as getComponents, S as Slider } from './ssr-a41dfea9.js';
+import { g as getComponents, S as Slider } from './ssr-e3196de1.js';
 
 var updateQuery = Actions.updateQuery,
     setQueryOptions = Actions.setQueryOptions,

package/dist/es/ReactiveBase.js

@@ -1,12 +1,12 @@
 import configureStore, { Actions, helper } from '@appbaseio/reactivecore';
-import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-0f24d612.js';
+import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-ecf6c03c.js';
 import VueTypes from 'vue-types';
 import '@appbaseio/reactivecore/lib/utils/constants';
 import { isEqual as isEqual$1 } from '@appbaseio/reactivecore/lib/utils/helper';
 import styled from '@appbaseio/vue-emotion';
-import { t as types } from './vueTypes-687b2304.js';
+import { t as types } from './vueTypes-9326e0be.js';
 import 'redux';
-import { c as connect, e as composeThemeObject, X as X_SEARCH_CLIENT } from './index-cb1950b6.js';
+import { c as connect, e as composeThemeObject, X as X_SEARCH_CLIENT } from './index-5daa8276.js';
 import _mergeJSXProps from '@vue/babel-helper-vue-jsx-merge-props';
 import { updateAnalyticsConfig } from '@appbaseio/reactivecore/lib/actions/analytics';
 import Appbase from 'appbase-js';

package/dist/es/ReactiveComponent.js

@@ -1,17 +1,14 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
-import { a as _extends, b as _objectWithoutPropertiesLoose } from './_rollupPluginBabelHelpers-0f24d612.js';
+import { a as _extends, b as _objectWithoutPropertiesLoose } from './_rollupPluginBabelHelpers-ecf6c03c.js';
 import VueTypes from 'vue-types';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
-import { t as types } from './vueTypes-687b2304.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, c as connect } from './index-cb1950b6.js';
-import { C as ComponentWrapper } from './ComponentWrapper-4f85a67e.js';
+import { f as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, c as connect } from './index-5daa8276.js';
+import { C as ComponentWrapper } from './ComponentWrapper-bbb717bc.js';
 
-var _excluded = ["options"],
-    _excluded2 = ["query"],
-    _excluded3 = ["query"],
-    _excluded4 = ["query"];
+var _excluded = ["options"];
 var updateQuery = Actions.updateQuery,
     setQueryOptions = Actions.setQueryOptions,
     setCustomQuery = Actions.setCustomQuery,
@@ -19,8 +16,9 @@ var updateQuery = Actions.updateQuery,
 var parseHits = helper.parseHits,
     isEqual = helper.isEqual,
     getCompositeAggsQuery = helper.getCompositeAggsQuery,
-    getOptionsFromQuery = helper.getOptionsFromQuery,
-    getResultStats = helper.getResultStats;
+    getResultStats = helper.getResultStats,
+    extractQueryFromCustomQuery = helper.extractQueryFromCustomQuery,
+    getOptionsForCustomQuery = helper.getOptionsForCustomQuery;
 var ReactiveComponent = {
   name: 'ReactiveComponent',
   props: {
@@ -69,25 +67,16 @@ var ReactiveComponent = {
 
     if (customQuery) {
       var calcCustomQuery = customQuery(this.selectedValue, props);
-
-      var _ref = calcCustomQuery || {},
-          query = _ref.query;
-
-      var customQueryOptions = calcCustomQuery ? getOptionsFromQuery(calcCustomQuery) : null;
+      var query = extractQueryFromCustomQuery(calcCustomQuery);
+      var customQueryOptions = calcCustomQuery ? getOptionsForCustomQuery(calcCustomQuery) : null;
 
       if (customQueryOptions) {
         this.setQueryOptions(componentId, _extends({}, customQueryOptions, this.getAggsQuery()), false);
       } else this.setQueryOptions(componentId, this.getAggsQuery(), false);
 
-      var queryToSet = query || null;
-
-      if (calcCustomQuery && calcCustomQuery.id) {
-        queryToSet = calcCustomQuery;
-      }
-
       this.updateQuery({
         componentId: componentId,
-        query: queryToSet,
+        query: query,
         value: this.selectedValue || null,
         label: filterLabel,
         showFilter: showFilter,
@@ -95,9 +84,9 @@ var ReactiveComponent = {
       });
     }
 
-    this.setQuery = function (_ref2) {
-      var options = _ref2.options,
-          obj = _objectWithoutPropertiesLoose(_ref2, _excluded);
+    this.setQuery = function (_ref) {
+      var options = _ref.options,
+          obj = _objectWithoutPropertiesLoose(_ref, _excluded);
 
       if (options) {
         _this.setQueryOptions(props.componentId, _extends({}, options, _this.getAggsQuery()), false);
@@ -107,17 +96,17 @@ var ReactiveComponent = {
 
       if (obj && obj.query && obj.query.query) {
         queryToBeSet = obj.query.query;
-      } // Update customQuery field for RS API
+      }
 
+      var customQueryCalc = _extends({}, options); // Update customQuery field for RS API
 
-      if (obj && obj.query || options) {
-        var customQueryCalc = _extends({}, options);
 
-        if (obj && obj.query) {
-          if (obj.query.id) {
+      if (queryToBeSet || options) {
+        if (queryToBeSet.query) {
+          if (queryToBeSet.id) {
             customQueryCalc = queryToBeSet;
           } else {
-            customQueryCalc.query = obj.query;
+            customQueryCalc.query = queryToBeSet;
           }
         }
 
@@ -125,6 +114,7 @@ var ReactiveComponent = {
       }
 
       _this.updateQuery(_extends({}, obj, {
+        query: customQueryCalc,
         componentId: props.componentId,
         label: props.filterLabel,
         showFilter: props.showFilter,
@@ -140,24 +130,16 @@ var ReactiveComponent = {
     if (this.internalComponent && this.$props.defaultQuery) {
       updateDefaultQuery(this.componentId, this.setDefaultQuery, this.$props, this.selectedValue);
       this.$defaultQuery = this.$props.defaultQuery(this.selectedValue, this.$props);
-
-      var _ref3 = this.$defaultQuery || {},
-          query = _ref3.query,
-          queryOptions = _objectWithoutPropertiesLoose(_ref3, _excluded2);
+      var query = extractQueryFromCustomQuery(this.$defaultQuery);
+      var queryOptions = getOptionsForCustomQuery(this.$defaultQuery);
 
       if (queryOptions) {
         this.setQueryOptions(this.internalComponent, _extends({}, queryOptions, this.getAggsQuery()), false);
       } else this.setQueryOptions(this.internalComponent, this.getAggsQuery(), false);
 
-      var queryToSet = query || null;
-
-      if (!queryToSet && this.$defaultQuery && this.$defaultQuery.id) {
-        queryToSet = this.$defaultQuery;
-      }
-
       this.updateQuery({
         componentId: this.internalComponent,
-        query: queryToSet
+        query: query
       });
     }
   },
@@ -205,10 +187,8 @@ var ReactiveComponent = {
     defaultQuery: function defaultQuery(newVal, oldVal) {
       if (newVal && !isQueryIdentical(newVal, oldVal, this.selectedValue, this.$props)) {
         this.$defaultQuery = newVal(this.selectedValue, this.$props);
-
-        var _ref4 = this.$defaultQuery || {},
-            query = _ref4.query,
-            queryOptions = _objectWithoutPropertiesLoose(_ref4, _excluded3);
+        var query = extractQueryFromCustomQuery(this.$defaultQuery);
+        var queryOptions = getOptionsForCustomQuery(this.$defaultQuery);
 
         if (queryOptions) {
           this.setQueryOptions(this.internalComponent, _extends({}, queryOptions, this.getAggsQuery()), false);
@@ -216,15 +196,9 @@ var ReactiveComponent = {
 
 
         updateDefaultQuery(this.componentId, this.setDefaultQuery, this.$props, this.selectedValue);
-        var queryToSet = query || null;
-
-        if (!queryToSet && this.$defaultQuery && this.$defaultQuery.id) {
-          queryToSet = this.$defaultQuery;
-        }
-
         this.updateQuery({
           componentId: this.internalComponent,
-          query: queryToSet
+          query: query
         });
       }
     },
@@ -232,10 +206,8 @@ var ReactiveComponent = {
       if (newVal && !isQueryIdentical(newVal, oldVal, this.selectedValue, this.$props)) {
         var componentId = this.$props.componentId;
         this.$customQuery = newVal(this.selectedValue, this.$props);
-
-        var _ref5 = this.$customQuery || {},
-            query = _ref5.query,
-            queryOptions = _objectWithoutPropertiesLoose(_ref5, _excluded4);
+        var query = extractQueryFromCustomQuery(this.$customQuery);
+        var queryOptions = getOptionsForCustomQuery(this.$customQuery);
 
         if (queryOptions) {
           this.setQueryOptions(componentId, _extends({}, queryOptions, this.getAggsQuery()), false);
@@ -243,15 +215,9 @@ var ReactiveComponent = {
 
 
         updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.selectedValue);
-        var queryToSet = query || null;
-
-        if (this.$customQuery && this.$customQuery.id) {
-          queryToSet = this.$customQuery;
-        }
-
         this.updateQuery({
           componentId: componentId,
-          query: queryToSet
+          query: query
         });
       }
     }
@@ -331,6 +297,10 @@ var ReactiveComponent = {
   }
 };
 
+ReactiveComponent.hasInternalComponent = function (props) {
+  return !!props.defaultQuery;
+};
+
 var mapStateToProps = function mapStateToProps(state, props) {
   return {
     aggregations: state.aggregations[props.componentId] && state.aggregations[props.componentId] || null,