@appbaseio/reactivesearch-vue 1.26.0 → 1.27.0

package/dist/@appbaseio/reactivesearch-vue.umd.js

@@ -4861,7 +4861,7 @@
 	  Object.defineProperty(exports, "__esModule", {
 	    value: true
 	  });
-	  exports.suggestionTypes = exports.getTopSuggestions = exports.withClickIds = exports.getCompositeAggsQuery = exports.getAggsQuery = exports.extractQueryFromDefaultQuery = exports.updateInternalQuery = exports.getSearchState = exports.getOptionsFromQuery = exports.parseHits = exports.handleA11yAction = exports.getInnerKey = exports.getClassName = exports.checkSomePropChange = exports.checkPropChange = exports.updateDefaultQuery = exports.updateCustomQuery = undefined;
+	  exports.getCalendarIntervalErrorMessage = exports.queryFormatMillisecondsMap = exports.suggestionTypes = exports.getTopSuggestions = exports.withClickIds = exports.getCompositeAggsQuery = exports.getAggsQuery = exports.extractQueryFromDefaultQuery = exports.updateInternalQuery = exports.getSearchState = exports.getOptionsFromQuery = exports.parseHits = exports.handleA11yAction = exports.getInnerKey = exports.getClassName = exports.checkSomePropChange = exports.checkPropChange = exports.updateDefaultQuery = exports.updateCustomQuery = undefined;
 
 	  var _extends = Object.assign || function (target) {
 	    for (var i = 1; i < arguments.length; i++) {
@@ -5682,38 +5682,78 @@
 	    Recent: 'recent',
 	    Promoted: 'promoted'
 	  };
+	  var queryFormatMillisecondsMap = exports.queryFormatMillisecondsMap = {
+	    minute: 60000,
+	    hour: 3600000,
+	    day: 86400000,
+	    week: 604800000,
+	    month: 2629746000,
+	    quarter: 7889238000,
+	    year: 31556952000
+	  };
+
+	  var getCalendarIntervalErrorMessage = exports.getCalendarIntervalErrorMessage = function getCalendarIntervalErrorMessage(totalRange) {
+	    var calendarInterval = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'minute';
+	    var queryFormatMillisecondsMapKeys = Object.keys(queryFormatMillisecondsMap);
+	    var indexOfCurrentCalendarInterval = queryFormatMillisecondsMapKeys.indexOf(calendarInterval);
+
+	    if (indexOfCurrentCalendarInterval === -1) {
+	      console.error('Invalid calendarInterval Passed');
+	    }
+
+	    if (calendarInterval === 'year') {
+	      return 'Try using a shorter range of values.';
+	    }
+
+	    for (var index = indexOfCurrentCalendarInterval + 1; index < queryFormatMillisecondsMapKeys.length; index += 1) {
+	      if (totalRange / Object.values(queryFormatMillisecondsMap)[index] <= 100) {
+	        var calendarIntervalKey = queryFormatMillisecondsMapKeys[index];
+	        return {
+	          errorMessage: 'Please pass calendarInterval prop with value greater than or equal to a `' + calendarIntervalKey + '` for a meaningful resolution of histogram.',
+	          calculatedCalendarInterval: calendarIntervalKey
+	        };
+	      }
+	    }
+
+	    return {
+	      errorMessage: 'Try using a shorter range of values.',
+	      calculatedCalendarInterval: 'year'
+	    };
+	  };
 	});
 	unwrapExports(helper);
-	var helper_1 = helper.suggestionTypes;
-	var helper_2 = helper.getTopSuggestions;
-	var helper_3 = helper.withClickIds;
-	var helper_4 = helper.getCompositeAggsQuery;
-	var helper_5 = helper.getAggsQuery;
-	var helper_6 = helper.extractQueryFromDefaultQuery;
-	var helper_7 = helper.updateInternalQuery;
-	var helper_8 = helper.getSearchState;
-	var helper_9 = helper.getOptionsFromQuery;
-	var helper_10 = helper.parseHits;
-	var helper_11 = helper.handleA11yAction;
-	var helper_12 = helper.getInnerKey;
-	var helper_13 = helper.getClassName;
-	var helper_14 = helper.checkSomePropChange;
-	var helper_15 = helper.checkPropChange;
-	var helper_16 = helper.updateDefaultQuery;
-	var helper_17 = helper.updateCustomQuery;
-	var helper_18 = helper.isEqual;
-	var helper_19 = helper.debounce;
-	var helper_20 = helper.getQueryOptions;
-	var helper_21 = helper.buildQuery;
-	var helper_22 = helper.pushToAndClause;
-	var helper_23 = helper.checkValueChange;
-	var helper_24 = helper.getAggsOrder;
-	var helper_25 = helper.formatDate;
-	var helper_26 = helper.getResultStats;
-	var helper_27 = helper.extractFieldsFromSource;
-	var helper_28 = helper.normalizeDataField;
-	var helper_29 = helper.handleOnSuggestions;
-	var helper_30 = helper.isValidDateRangeQueryFormat;
+	var helper_1 = helper.getCalendarIntervalErrorMessage;
+	var helper_2 = helper.queryFormatMillisecondsMap;
+	var helper_3 = helper.suggestionTypes;
+	var helper_4 = helper.getTopSuggestions;
+	var helper_5 = helper.withClickIds;
+	var helper_6 = helper.getCompositeAggsQuery;
+	var helper_7 = helper.getAggsQuery;
+	var helper_8 = helper.extractQueryFromDefaultQuery;
+	var helper_9 = helper.updateInternalQuery;
+	var helper_10 = helper.getSearchState;
+	var helper_11 = helper.getOptionsFromQuery;
+	var helper_12 = helper.parseHits;
+	var helper_13 = helper.handleA11yAction;
+	var helper_14 = helper.getInnerKey;
+	var helper_15 = helper.getClassName;
+	var helper_16 = helper.checkSomePropChange;
+	var helper_17 = helper.checkPropChange;
+	var helper_18 = helper.updateDefaultQuery;
+	var helper_19 = helper.updateCustomQuery;
+	var helper_20 = helper.isEqual;
+	var helper_21 = helper.debounce;
+	var helper_22 = helper.getQueryOptions;
+	var helper_23 = helper.buildQuery;
+	var helper_24 = helper.pushToAndClause;
+	var helper_25 = helper.checkValueChange;
+	var helper_26 = helper.getAggsOrder;
+	var helper_27 = helper.formatDate;
+	var helper_28 = helper.getResultStats;
+	var helper_29 = helper.extractFieldsFromSource;
+	var helper_30 = helper.normalizeDataField;
+	var helper_31 = helper.handleOnSuggestions;
+	var helper_32 = helper.isValidDateRangeQueryFormat;
 
 	var value = createCommonjsModule(function (module, exports) {
 	  Object.defineProperty(exports, "__esModule", {
@@ -7205,7 +7245,7 @@
 	      }
 
 	      if (componentProps.componentType === constants$1.componentTypes.dynamicRangeSlider || componentProps.componentType === constants$1.componentTypes.rangeSlider) {
-	        calendarInterval = Object.keys(_dateFormats2["default"]).includes(queryFormat) ? componentProps.calendarInterval || 'month' : undefined;
+	        calendarInterval = Object.keys(_dateFormats2["default"]).includes(queryFormat) ? componentProps.calendarInterval : undefined;
 
 	        if (value) {
 	          if ((0, helper.isValidDateRangeQueryFormat)(componentProps.queryFormat)) {
@@ -13264,10 +13304,16 @@
 	}; // parses current array (i.e. this.$props.value) for `onChange` callback for multi-* components
 
 	function parseValueArray(objectValues, currentValue) {
-	  var keys = Object.keys(objectValues);
-	  var selectedValues = keys.map(function (key) {
-	    return objectValues[key] ? key : null;
-	  });
+	  var selectedValues;
+
+	  if (Array.isArray(objectValues)) {
+	    selectedValues = [].concat(objectValues);
+	  } else {
+	    var keys = Object.keys(objectValues);
+	    selectedValues = keys.map(function (key) {
+	      return objectValues[key] ? key : null;
+	    });
+	  }
 
 	  if (selectedValues.includes(currentValue)) {
 	    return selectedValues.filter(function (item) {
@@ -14082,6 +14128,12 @@
 	      });
 	    }
 
+	    if (this.urlSortOption) {
+	      this.sortOptionIndex = this.$props.sortOptions.findIndex(function (s) {
+	        return s.label === _this.urlSortOption;
+	      }) || 0;
+	    }
+
 	    this.updateComponentProps(this.componentId, {
 	      from: this.from
 	    }, constants_1$1.reactiveList);
@@ -14172,7 +14224,7 @@
 	        filteredResults = [].concat(parsedPromotedResults, filteredResults);
 	      }
 
-	      return helper_3(filteredResults);
+	      return helper_5(filteredResults);
 	    }
 	  },
 	  watch: {
@@ -14390,7 +14442,7 @@
 	        "labelPosition": this.sortOptions ? 'right' : 'left'
 	      },
 	      "class": getClassName$1(this.$props.innerClass, 'resultsInfo')
-	    }, [this.sortOptions ? this.renderSortOptions() : null, this.$props.showResultStats && results.length ? this.renderStats() : null]), !this.isLoading && results.length === 0 ? this.renderNoResult() : null, this.shouldRenderPagination && (this.$props.paginationAt === 'top' || this.$props.paginationAt === 'both') ? h(Pagination, {
+	    }, [this.sortOptions ? this.renderSortOptions() : null, this.$props.showResultStats && results.length ? this.renderStats() : null]), !this.isLoading && hits && hits.length === 0 ? this.renderNoResult() : null, this.shouldRenderPagination && (this.$props.paginationAt === 'top' || this.$props.paginationAt === 'both') ? h(Pagination, {
 	      "attrs": {
 	        "pages": this.$props.pages,
 	        "totalPages": this.totalPages,
@@ -14598,8 +14650,11 @@
 	          sortBy: sortBy
 	        }, constants_1$1.reactiveList);
 	        this.setQueryOptions(this.$props.componentId, options, true);
+	        this.setPage(0);
 	        this.currentPageState = 0;
 	        this.from = 0;
+	        var sortOption = this.$props.sortOptions[this.sortOptionIndex] ? this.$props.sortOptions[this.sortOptionIndex].label : null;
+	        this.setPageURL(this.$props.componentId + "sortOption", sortOption, this.$props.componentId + "sortOption", false, this.$props.URLParams);
 	      }
 	    },
 	    triggerClickAnalytics: function triggerClickAnalytics(searchPosition, documentId) {
@@ -14711,6 +14766,7 @@
 	var mapStateToProps$1 = function mapStateToProps(state, props) {
 	  return {
 	    defaultPage: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value - 1,
+	    urlSortOption: state.selectedValues[props.componentId + "sortOption"] && state.selectedValues[props.componentId + "sortOption"].value,
 	    hits: state.hits[props.componentId] && state.hits[props.componentId].hits,
 	    rawData: state.rawData[props.componentId],
 	    aggregationData: state.compositeAggregations[props.componentId],
@@ -14930,22 +14986,21 @@
 	var querystring_3 = querystring.encode;
 	var querystring_4 = querystring.stringify;
 
-	var browserPonyfill$1 = createCommonjsModule(function (module) {
-	  var __root__ = function (root) {
+	var browserPonyfill$1 = createCommonjsModule(function (module, exports) {
+	  var global = typeof self !== 'undefined' ? self : commonjsGlobal;
+
+	  var __self__ = function () {
 	    function F() {
 	      this.fetch = false;
+	      this.DOMException = global.DOMException;
 	    }
 
-	    F.prototype = root;
+	    F.prototype = global;
 	    return new F();
-	  }(typeof self !== 'undefined' ? self : commonjsGlobal);
+	  }();
 
 	  (function (self) {
-	    (function (self) {
-	      if (self.fetch) {
-	        return;
-	      }
-
+	    var irrelevant = function (exports) {
 	      var support = {
 	        searchParams: 'URLSearchParams' in self,
 	        iterable: 'Symbol' in self && 'iterator' in Symbol,
@@ -14961,13 +15016,13 @@
 	        arrayBuffer: 'ArrayBuffer' in self
 	      };
 
+	      function isDataView(obj) {
+	        return obj && DataView.prototype.isPrototypeOf(obj);
+	      }
+
 	      if (support.arrayBuffer) {
 	        var viewClasses = ['[object Int8Array]', '[object Uint8Array]', '[object Uint8ClampedArray]', '[object Int16Array]', '[object Uint16Array]', '[object Int32Array]', '[object Uint32Array]', '[object Float32Array]', '[object Float64Array]'];
 
-	        var isDataView = function isDataView(obj) {
-	          return obj && DataView.prototype.isPrototypeOf(obj);
-	        };
-
 	        var isArrayBufferView = ArrayBuffer.isView || function (obj) {
 	          return obj && viewClasses.indexOf(Object.prototype.toString.call(obj)) > -1;
 	        };
@@ -14978,7 +15033,7 @@
 	          name = String(name);
 	        }
 
-	        if (/[^a-z0-9\-#$%&'*+.\^_`|~]/i.test(name)) {
+	        if (/[^a-z0-9\-#$%&'*+.^_`|~]/i.test(name)) {
 	          throw new TypeError('Invalid character in header field name');
 	        }
 
@@ -15036,7 +15091,7 @@
 	        name = normalizeName(name);
 	        value = normalizeValue(value);
 	        var oldValue = this.map[name];
-	        this.map[name] = oldValue ? oldValue + ',' + value : value;
+	        this.map[name] = oldValue ? oldValue + ', ' + value : value;
 	      };
 
 	      Headers.prototype['delete'] = function (name) {
@@ -15170,7 +15225,7 @@
 	          } else if (support.arrayBuffer && (ArrayBuffer.prototype.isPrototypeOf(body) || isArrayBufferView(body))) {
 	            this._bodyArrayBuffer = bufferClone(body);
 	          } else {
-	            throw new Error('unsupported BodyInit type');
+	            this._bodyText = body = Object.prototype.toString.call(body);
 	          }
 
 	          if (!this.headers.get('content-type')) {
@@ -15269,6 +15324,7 @@
 
 	          this.method = input.method;
 	          this.mode = input.mode;
+	          this.signal = input.signal;
 
 	          if (!body && input._bodyInit != null) {
 	            body = input._bodyInit;
@@ -15278,7 +15334,7 @@
 	          this.url = String(input);
 	        }
 
-	        this.credentials = options.credentials || this.credentials || 'omit';
+	        this.credentials = options.credentials || this.credentials || 'same-origin';
 
 	        if (options.headers || !this.headers) {
 	          this.headers = new Headers(options.headers);
@@ -15286,6 +15342,7 @@
 
 	        this.method = normalizeMethod(options.method || this.method || 'GET');
 	        this.mode = options.mode || this.mode || null;
+	        this.signal = options.signal || this.signal;
 	        this.referrer = null;
 
 	        if ((this.method === 'GET' || this.method === 'HEAD') && body) {
@@ -15383,15 +15440,36 @@
 	        });
 	      };
 
-	      self.Headers = Headers;
-	      self.Request = Request;
-	      self.Response = Response;
+	      exports.DOMException = self.DOMException;
+
+	      try {
+	        new exports.DOMException();
+	      } catch (err) {
+	        exports.DOMException = function (message, name) {
+	          this.message = message;
+	          this.name = name;
+	          var error = Error(message);
+	          this.stack = error.stack;
+	        };
 
-	      self.fetch = function (input, init) {
+	        exports.DOMException.prototype = Object.create(Error.prototype);
+	        exports.DOMException.prototype.constructor = exports.DOMException;
+	      }
+
+	      function fetch(input, init) {
 	        return new Promise(function (resolve, reject) {
 	          var request = new Request(input, init);
+
+	          if (request.signal && request.signal.aborted) {
+	            return reject(new exports.DOMException('Aborted', 'AbortError'));
+	          }
+
 	          var xhr = new XMLHttpRequest();
 
+	          function abortXhr() {
+	            xhr.abort();
+	          }
+
 	          xhr.onload = function () {
 	            var options = {
 	              status: xhr.status,
@@ -15411,6 +15489,10 @@
 	            reject(new TypeError('Network request failed'));
 	          };
 
+	          xhr.onabort = function () {
+	            reject(new exports.DOMException('Aborted', 'AbortError'));
+	          };
+
 	          xhr.open(request.method, request.url, true);
 
 	          if (request.credentials === 'include') {
@@ -15426,24 +15508,65 @@
 	          request.headers.forEach(function (value, name) {
 	            xhr.setRequestHeader(name, value);
 	          });
+
+	          if (request.signal) {
+	            request.signal.addEventListener('abort', abortXhr);
+
+	            xhr.onreadystatechange = function () {
+	              // DONE (success or failure)
+	              if (xhr.readyState === 4) {
+	                request.signal.removeEventListener('abort', abortXhr);
+	              }
+	            };
+	          }
+
 	          xhr.send(typeof request._bodyInit === 'undefined' ? null : request._bodyInit);
 	        });
-	      };
+	      }
 
-	      self.fetch.polyfill = true;
-	    })(typeof self !== 'undefined' ? self : this);
-	  }).call(__root__, void 0);
-	  var fetch = __root__.fetch;
-	  var Response = fetch.Response = __root__.Response;
-	  var Request = fetch.Request = __root__.Request;
-	  var Headers = fetch.Headers = __root__.Headers;
+	      fetch.polyfill = true;
 
-	  if ( module.exports) {
-	    module.exports = fetch; // Needed for TypeScript consumers without esModuleInterop.
+	      if (!self.fetch) {
+	        self.fetch = fetch;
+	        self.Headers = Headers;
+	        self.Request = Request;
+	        self.Response = Response;
+	      }
 
-	    module.exports["default"] = fetch;
-	  }
+	      exports.Headers = Headers;
+	      exports.Request = Request;
+	      exports.Response = Response;
+	      exports.fetch = fetch;
+	      Object.defineProperty(exports, '__esModule', {
+	        value: true
+	      });
+	      return exports;
+	    }({});
+	  })(__self__);
+
+	  __self__.fetch.ponyfill = true; // Remove "polyfill" property added by whatwg-fetch
+
+	  delete __self__.fetch.polyfill; // Choose between native implementation (global) or custom implementation (__self__)
+	  // var ctx = global.fetch ? global : __self__;
+
+	  var ctx = __self__; // this line disable service worker support temporarily
+
+	  exports = ctx.fetch; // To enable: import fetch from 'cross-fetch'
+
+	  exports["default"] = ctx.fetch; // For TypeScript consumers without esModuleInterop.
+
+	  exports.fetch = ctx.fetch; // To enable: import {fetch} from 'cross-fetch'
+
+	  exports.Headers = ctx.Headers;
+	  exports.Request = ctx.Request;
+	  exports.Response = ctx.Response;
+	  module.exports = exports;
 	});
+	var fetch$1 = unwrapExports(browserPonyfill$1);
+	var browserPonyfill_1$1 = browserPonyfill$1.fetch;
+	var browserPonyfill_2$1 = browserPonyfill$1.Headers;
+	var browserPonyfill_3$1 = browserPonyfill$1.Request;
+	var browserPonyfill_4$1 = browserPonyfill$1.Response;
 
 	var _typeof$1 = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
 	  return typeof obj;
@@ -15775,17 +15898,10 @@
 	  }
 
 	  var credentials = auth || null;
-
-	  if (!config.mongodb) {
-	    if (isAppbase(url) && credentials === null) {
-	      throw new Error('Authentication information is not present. Did you add credentials?');
-	    }
-	  }
 	  /**
 	   * Credentials can be provided as a part of the URL,
 	   * as username, password args or as a credentials argument directly */
 
-
 	  if (typeof config.credentials === 'string' && config.credentials !== '') {
 	    // eslint-disable-next-line
 	    credentials = config.credentials;
@@ -15793,6 +15909,12 @@
 	    credentials = config.username + ':' + config.password;
 	  }
 
+	  if (!config.mongodb) {
+	    if (isAppbase(url) && credentials === null) {
+	      throw new Error('Authentication information is not present. Did you add credentials?');
+	    }
+	  }
+
 	  this.url = url;
 	  this.protocol = protocol;
 	  this.app = config.app;
@@ -15890,7 +16012,7 @@
 	        var transformedRequest = Object.assign({}, ts);
 	        var url = transformedRequest.url;
 	        delete transformedRequest.url;
-	        return browserPonyfill$1(url || finalURL, Object.assign({}, transformedRequest, {
+	        return fetch$1(url || finalURL, Object.assign({}, transformedRequest, {
 	          // apply timestamp header for RS API
 	          headers: isRSAPI && !isMongoRequest ? Object.assign({}, transformedRequest.headers, {
 	            'x-timestamp': new Date().getTime()
@@ -17145,14 +17267,14 @@
 	      this.updateState(this.$props);
 	    },
 	    analyticsConfig: function analyticsConfig(newVal, oldVal) {
-	      if (!helper_18(newVal, oldVal)) {
+	      if (!helper_20(newVal, oldVal)) {
 	        if (this.store) {
 	          this.store.dispatch(analytics_3$1(newVal));
 	        }
 	      }
 	    },
 	    appbaseConfig: function appbaseConfig(newVal, oldVal) {
-	      if (!helper_18(newVal, oldVal)) {
+	      if (!helper_20(newVal, oldVal)) {
 	        if (this.store) {
 	          this.store.dispatch(analytics_3$1(newVal));
 	        }
@@ -20155,7 +20277,7 @@
 	    // returns size and aggs property
 	    getBasicQueryOptions: function getBasicQueryOptions() {
 	      var aggregationField = this.$props.aggregationField;
-	      var queryOptions = helper_20(this.$props);
+	      var queryOptions = helper_22(this.$props);
 
 	      if (aggregationField) {
 	        queryOptions.aggs = getCompositeAggsQuery$1({
@@ -21657,13 +21779,14 @@
 	  },
 	  beforeMount: function beforeMount() {
 	    this.updateQueryHandlerOptions(this.$props);
+	    var value = this.selectedValue || this.$props.value || this.$props.defaultValue;
+	    this.setValue(value, !this.selectedValue);
+	  },
+	  mounted: function mounted() {
+	    var currentValue = Object.keys(this.$data.currentValue);
 
-	    if (this.selectedValue) {
-	      this.setValue(this.selectedValue);
-	    } else if (this.$props.value) {
-	      this.setValue(this.$props.value, true);
-	    } else if (this.$props.defaultValue) {
-	      this.setValue(this.$props.defaultValue, true);
+	    if (this.$props.value !== undefined && !isEqual$6(this.$props.value, currentValue)) {
+	      this.$emit('change', currentValue);
 	    }
 	  },
 	  watch: {
@@ -21708,7 +21831,11 @@
 	      }
 
 	      if (!isEqual$6(selectedValue, newVal)) {
-	        this.setValue(newVal || [], true);
+	        if (this.value === undefined) {
+	          this.setValue(newVal, true);
+	        } else {
+	          this.$emit('change', newVal);
+	        }
 	      }
 	    },
 	    defaultQuery: function defaultQuery(newVal, oldVal) {
@@ -22007,7 +22134,7 @@
 	      if (value === undefined) {
 	        this.setValue(currentValue);
 	      } else {
-	        var values = parseValueArray(value, currentValue);
+	        var values = parseValueArray(value || [], currentValue);
 	        this.$emit('change', values);
 	      }
 	    },
@@ -22279,7 +22406,8 @@
 	              isOpen = _ref.isOpen,
 	              highlightedIndex = _ref.highlightedIndex,
 	              getButtonProps = _ref.getButtonProps,
-	              getItemEvents = _ref.getItemEvents;
+	              getItemEvents = _ref.getItemEvents,
+	              getInputEvents = _ref.getInputEvents;
 	          return h("div", {
 	            "class": suggestionsContainer
 	          }, [h(Select, {
@@ -22304,7 +22432,13 @@
 	            getItemEvents: getItemEvents
 	          }) : isOpen && itemsToRender.length ? h("ul", {
 	            "class": suggestions$1(themePreset, _this.theme) + " " + (_this.$props.small ? 'small' : '') + " " + getClassName$6(_this.$props.innerClass, 'list')
-	          }, [_this.$props.showSearch ? _this.renderSearchbox() : null, !hasCustomRenderer && filteredItemsToRender.length === 0 ? _this.renderNoResult() : filteredItemsToRender.map(function (item, index) {
+	          }, [_this.$props.showSearch ? _this.renderSearchbox({
+	            on: {
+	              input: getInputEvents({
+	                onInput: _this.handleInputChange
+	              }).input
+	            }
+	          }) : null, !hasCustomRenderer && filteredItemsToRender.length === 0 ? _this.renderNoResult() : filteredItemsToRender.map(function (item, index) {
 	            var selected = _this.$props.multi // MultiDropdownList
 	            && (selectedItem && !!selectedItem[item[keyField]] // MultiDropdownRange
 	            || Array.isArray(selectedItem) && selectedItem.find(function (value) {
@@ -22425,7 +22559,7 @@
 	        "class": getClassName$6(this.$props.innerClass, 'noResults') || null
 	      }, [isFunction$1(renderNoResults) ? renderNoResults() : renderNoResults]);
 	    },
-	    renderSearchbox: function renderSearchbox() {
+	    renderSearchbox: function renderSearchbox(eventObject) {
 	      var h = this.$createElement;
 	      var _this$$props2 = this.$props,
 	          componentId = _this$$props2.componentId,
@@ -22433,7 +22567,7 @@
 	          showClear = _this$$props2.showClear,
 	          themePreset = _this$$props2.themePreset,
 	          innerClass = _this$$props2.innerClass;
-	      var InputComponent = h(Input, {
+	      var InputComponent = h(Input, helper$1([{
 	        "attrs": {
 	          "id": componentId + "-input",
 	          "showIcon": false,
@@ -22446,11 +22580,8 @@
 	          border: 0,
 	          borderBottom: '1px solid #ddd'
 	        },
-	        "class": getClassName$6(innerClass, 'input'),
-	        "on": {
-	          "change": this.handleInputChange
-	        }
-	      });
+	        "class": getClassName$6(innerClass, 'input')
+	      }, eventObject]));
 
 	      if (showClear) {
 	        return h(InputWrapper, [InputComponent, this.searchTerm && h(IconGroup, {
@@ -23247,7 +23378,7 @@
 	      }
 
 	      var performUpdate = function performUpdate() {
-	        _this3.currentValue = currentValue;
+	        _this3.currentValue = _extends({}, currentValue);
 
 	        _this3.updateQueryHandler(finalValues, props);
 
@@ -25494,7 +25625,8 @@
 	    URLParams: VueTypes.bool.def(false),
 	    sliderOptions: VueTypes.object.def({}),
 	    nestedField: types.string,
-	    index: VueTypes.string
+	    index: VueTypes.string,
+	    value: types.range
 	  },
 	  data: function data() {
 	    this.internalRangeComponent = this.$props.componentId + "__range__internal";
@@ -25540,6 +25672,8 @@
 	      components = _this$$$store$getStat.components;
 	    }
 
+	    var value = this.$props.value;
+
 	    if (this.destroyOnUnmount || components.indexOf(this.componentId) === -1) {
 	      this.addComponent(this.componentId);
 	      this.addComponent(this.internalRangeComponent);
@@ -25548,6 +25682,8 @@
 	        this.handleChange(this.selectedValue);
 	      } else if (this.selectedValue) {
 	        this.handleChange(DynamicRangeSlider.parseValue(this.selectedValue, this.$props));
+	      } else if (value) {
+	        this.handleChange(DynamicRangeSlider.parseValue(value, this.$props));
 	      } // get range before executing other queries
 
 
@@ -25566,6 +25702,13 @@
 	    }
 	  },
 	  methods: {
+	    isControlled: function isControlled() {
+	      if (this.$props.value && this.$listeners) {
+	        return true;
+	      }
+
+	      return false;
+	    },
 	    setDefaultValue: function setDefaultValue(_ref) {
 	      var start = _ref.start,
 	          end = _ref.end;
@@ -25576,6 +25719,8 @@
 	            defaultEnd = _this$$props$defaultV.end;
 
 	        this.handleChange([defaultStart, defaultEnd]);
+	      } else if (this.isControlled()) {
+	        this.handleChange(DynamicRangeSlider.parseValue(this.$props.value), 'change');
 	      } else {
 	        this.currentValue = [start, end];
 	      }
@@ -25625,7 +25770,16 @@
 	    },
 	    handleSlider: function handleSlider() {
 	      var sliderValues = this.$refs.slider.getValue();
-	      this.handleChange(sliderValues);
+	      var value = this.$props.value;
+
+	      if (value === undefined) {
+	        this.handleChange(sliderValues);
+	      } else {
+	        this.$emit('change', {
+	          start: sliderValues[0],
+	          end: sliderValues[1]
+	        });
+	      }
 	    },
 	    handleChange: function handleChange(currentValue) {
 	      var _this2 = this;
@@ -25718,6 +25872,7 @@
 	        start: this.range.start,
 	        end: this.range.end
 	      };
+	      this.$emit('change', value);
 	      this.handleChange(DynamicRangeSlider.parseValue(value, this.$props));
 	    },
 	    range: function range(newValue, oldValue) {
@@ -25739,6 +25894,11 @@
 	      if (!isQueryIdentical(newVal, oldVal, this.$data.currentValue, this.$props)) {
 	        this.updateQueryHandler(this.$data.currentValue);
 	      }
+	    },
+	    value: function value(newVal, oldVal) {
+	      if (!isEqual$e(newVal, oldVal)) {
+	        this.handleChange(DynamicRangeSlider.parseValue(newVal, this.$props));
+	      }
 	    }
 	  },
 	  render: function render() {
@@ -25760,9 +25920,9 @@
 	    }, [h("vue-slider-component", {
 	      "ref": "slider",
 	      "attrs": {
-	        "value": [Math.max(start, this.currentValue[0]), Math.min(end, this.currentValue[1])],
-	        "min": Math.min(start, this.currentValue[0]),
-	        "max": Math.max(end, this.currentValue[1]),
+	        "value": [Math.floor(Math.max(start, this.currentValue[0])), Math.ceil(Math.min(end, this.currentValue[1]))],
+	        "min": Math.floor(Math.min(start, this.currentValue[0])),
+	        "max": Math.ceil(Math.max(end, this.currentValue[1])),
 	        "dotSize": 20,
 	        "height": 4,
 	        "enable-cross": false,
@@ -25812,7 +25972,11 @@
 	};
 
 	DynamicRangeSlider.parseValue = function (value) {
-	  return [value.start, value.end];
+	  if (value) {
+	    return Array.isArray(value) ? value : [value.start, value.end];
+	  }
+
+	  return [];
 	};
 
 	var mapStateToProps$e = function mapStateToProps(state, props) {
@@ -26255,7 +26419,7 @@
 	        var react = component.react;
 
 	        if (isInternalComponentPresent || isResultComponent) {
-	          react = helper_22(react, internalComponent);
+	          react = helper_24(react, internalComponent);
 	        }
 
 	        dependencyTree = dependencyTreeReducer(dependencyTree, {
@@ -26301,7 +26465,7 @@
 
 	    componentCollection.forEach(function (component) {
 	      // eslint-disable-next-line
-	      var _buildQuery = helper_21(component.componentId, dependencyTree, queryList, queryOptions),
+	      var _buildQuery = helper_23(component.componentId, dependencyTree, queryList, queryOptions),
 	          queryObj = _buildQuery.queryObj,
 	          options = _buildQuery.options;
 
@@ -26510,7 +26674,7 @@
 	  });
 	}
 
-	var version = "1.26.0";
+	var version = "1.27.0";
 
 	var _templateObject$n, _templateObject2$a;
 
@@ -26687,6 +26851,10 @@
 	    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];