@appbaseio/reactivesearch-vue 3.0.0-rc.9 → 3.0.0

package/dist/components/result/ReactiveList.d.ts

@@ -0,0 +1,55 @@
+import { VNode } from 'vue';
+import type { CommonProps } from '../../index.d.ts';
+import * as types from '../../types.ts';
+
+interface ReactiveListProps extends CommonProps {
+	children?: (data: any) => any;
+	dataField: string;
+	aggregationField?: string;
+	aggregationSize?: number;
+	defaultQuery?: (...args: any[]) => any;
+	defaultSortOption?: string;
+	excludeFields?: Array<string>;
+	innerClass?: types.style;
+	infiniteScroll?: boolean;
+	includeFields?: Array<string>;
+	loader?: types.title;
+	render?: (data: any) => VNode[];
+	renderItem?: (data: any) => VNode[];
+	renderResultStats?: (...args: any[]) => any;
+	renderPagination?: (data: any) => any;
+	renderError?: types.title;
+	onError?: (...args: any[]) => any;
+	onNoResults?: types.title;
+	pages?: number;
+	pagination?: boolean;
+	paginationAt?: types.paginationAt;
+	showEndPage?: boolean;
+	react?: types.react;
+	showResultStats?: boolean;
+	showLoader?: boolean;
+	size?: number;
+	sortBy?: types.sortBy;
+	sortOptions?: types.sortOption[];
+	onPageChange?: (...args: any[]) => any;
+	onPageClick?: (...args: any[]) => any;
+	defaultPage?: number;
+	listClass?: string;
+	scrollTarget?: string | Element | HTMLDocument;
+	onData?: (...args: any[]) => any;
+	renderNoResults?: types.title;
+	scrollOnChange?: boolean;
+	distinctField?: string;
+	distinctFieldConfig?: object;
+	index?: string;
+	preferencesPath?: string;
+	showExport?: boolean;
+	renderExport?: (paramObj?: object) => any;
+	endpoint?: types.endpointConfig;
+	highlight?: boolean;
+	highlightConfig?: Object;
+}
+
+declare function ReactiveList(props: ReactiveListProps): JSX.Element;
+
+export default ReactiveList;

package/dist/components/result/ResultCard.d.ts

@@ -0,0 +1,10 @@
+export interface ResultCardProps {
+	target?: string;
+	children: JSX.Element;
+	href?: string;
+	id?: string|number;
+}
+
+declare function ResultCard(props: ResultCardProps): JSX.Element;
+
+export default ResultCard;

package/dist/components/result/ResultList.d.ts

@@ -0,0 +1,11 @@
+export interface ResultListProps {
+		target?: string;
+		href?: string;
+		children: JSX.Element;
+		small?: boolean;
+		id?: string|number;
+	}
+
+declare function ResultList(props: ResultListProps): JSX.Element
+
+export default ResultList;

package/dist/components/search/AIAnswer.d.ts

@@ -0,0 +1,44 @@
+/* eslint-disable no-undef */
+import { VNode } from 'vue';
+import type { CommonProps } from '../..';
+import * as types from '../../types.ts';
+
+export interface AIAnswerProps extends CommonProps {
+	showVoiceInput?: boolean;
+	showFeedback?: boolean;
+	showIcon?: boolean;
+	onData?: (...args: any[]) => any;
+	react?: types.react;
+	enableAI?: boolean;
+	AIConfig?: types.AIConfig;
+	icon?: types.children;
+	iconURL?: string;
+	iconPosition?: types.iconPosition;
+	theme?: types.style;
+	themePreset?: types.themePreset;
+	renderMic?: (...args: any[]) => any;
+	getMicInstance?: (...args: any[]) => any;
+	innerClass?: types.style;
+	title?: types.title;
+	AIResponse?: types.style;
+	isAIResponseLoading?: boolean;
+	AIResponseError?: types.style;
+	enterButton?: boolean;
+	renderEnterButton?: (onClick: any) => types.children;
+	showInput?: boolean;
+	clearSessionOnDestroy?: boolean;
+	render?: (data: object) => VNode[];
+	onError?: (...args: any[]) => any;
+	renderError?: (data: object) => VNode[];
+	isLoading?: boolean;
+	style?: types.style;
+	showSourceDocuments?: boolean;
+	triggerOn?: 'manual' | 'question';
+	renderTriggerMessage?: types.children | string;
+	renderSourceDocument?: (obj: any) => types.children;
+	onSourceClick?: (sourceObject: object) => void;
+}
+
+declare function AIAnswer(props: AIAnswerProps): JSX.Element;
+
+export default AIAnswer;

package/dist/components/search/SearchBox.d.ts

@@ -0,0 +1,107 @@
+import { VNode } from 'vue';
+import type { CommonProps } from '../..';
+import * as types from '../../types.ts';
+
+export interface SearchBoxProps extends CommonProps {
+	autoFocus?: boolean;
+	autosuggest?: boolean;
+	beforeValueChange?: (...args: any[]) => any;
+	children?: (data: any) => any;
+	customHighlight?: (...args: any[]) => any;
+	highlightConfig?: Object;
+	customQuery?: (...args: any[]) => any;
+	defaultQuery?: (...args: any[]) => any;
+	excludeFields?: Array<string>;
+	getMicInstance?: (...args: any[]) => any;
+	renderMic?: (...args: any[]) => any;
+	dataField?: types.dataFieldArray;
+	enableSynonyms?: boolean;
+	queryString?: boolean;
+	enablePopularSuggestions?: boolean;
+	enableRecentSuggestions?: boolean;
+	aggregationField?: string;
+	aggregationSize?: number;
+	size?: number;
+	debounce?: number;
+	defaultValue?: types.date;
+	value?: types.date;
+	defaultSuggestions?: types.suggestions;
+	downShiftProps?: types.props;
+	fieldWeights?: types.fieldWeights;
+	filterLabel?: string;
+	fuzziness?: types.fuzziness;
+	highlight?: boolean;
+	highlightField?: types.stringOrArray;
+	icon?: types.children;
+	iconURL?: string;
+	iconPosition?: types.iconPosition;
+	includeFields?: Array<string>;
+	innerClass?: types.style;
+	nestedField?: string;
+	onBlur?: (...args: any[]) => any;
+	onError?: (...args: any[]) => any;
+	onFocus?: (...args: any[]) => any;
+	onKeyDown?: (...args: any[]) => any;
+	onKeyPress?: (...args: any[]) => any;
+	onKeyUp?: (...args: any[]) => any;
+	onData?: (...args: any[]) => any;
+	onValueChange?: (...args: any[]) => any;
+	onChange?: (...args: any[]) => any;
+	onValueSelected?: (...args: any[]) => any;
+	placeholder?: string;
+	queryFormat?: types.queryFormatSearch;
+	react?: types.react;
+	render?: (data: object) => VNode[];
+	renderNoSuggestion?: types.title;
+	renderError?: types.title;
+	showFilter?: boolean;
+	showIcon?: boolean;
+	title?: types.title;
+	theme?: types.style;
+	type?: string;
+	themePreset?: types.themePreset;
+	clearIcon?: types.children;
+	showClear?: boolean;
+	strictSelection?: boolean;
+	searchOperators?: boolean;
+	showVoiceSearch?: boolean;
+	showDistinctSuggestions?: boolean;
+	enablePredictiveSuggestions?: boolean;
+	distinctField?: string;
+	distinctFieldConfig?: object;
+	focusShortcuts?: types.focusShortcuts;
+	showFocusShortcutsIcon?: boolean;
+	addonBefore?: types.children;
+	addonAfter?: types.children;
+	expandSuggestionsContainer?: boolean;
+	index?: string;
+	preferencesPath?: string;
+	popularSuggestionsConfig?: types.popularSuggestionsConfig;
+	recentSuggestionsConfig?: types.recentSuggestionsConfig;
+	indexSuggestionsConfig?: types.indexSuggestionsConfig;
+	featuredSuggestionsConfig?: types.featuredSuggestionsConfig;
+	enableIndexSuggestions?: boolean;
+	enableFeaturedSuggestions?: boolean;
+	showSuggestionsFooter?: boolean;
+	renderSuggestionsFooter?: () => types.children;
+	applyStopwords?: boolean;
+	customStopwords?: string[];
+	enterButton?: boolean;
+	renderEnterButton?: (onClick: any) => types.children;
+	searchboxId?: string;
+	endpoint?: types.endpointConfig;
+	mode?: string;
+	renderSelectedTags?: (paramObject: {
+		values: Array<string>;
+		handleClear: (val: string) => void;
+		handleClearAll: () => void;
+	}) => any;
+	enableAI?: boolean;
+	AIConfig?: types.AIConfig;
+	AIUIConfig?: types.AIUIConfig;
+	renderAIAnswer?: (data: any) => types.children | string | any;
+}
+
+declare function SearchBox(props: SearchBoxProps): JSX.Element;
+
+export default SearchBox;

package/dist/es/{ComponentWrapper-a2635cfc.js → ComponentWrapper-46d04344.js}

@@ -4,7 +4,7 @@ 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-882489e1.js';
+import { c as connect, b as getCamelCase, d as getValidPropsKeys } from './index-104f1dfb.js';
 
 var addComponent = Actions.addComponent,
   removeComponent = Actions.removeComponent,

package/dist/es/{DropDown-39fedff8.js → DropDown-48045fde.js}

@@ -4,9 +4,9 @@ import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPlugin
 import { createVNode, createTextVNode, mergeProps } from 'vue';
 import VueTypes from 'vue-types';
 import { styled } from '@appbaseio/vue-emotion';
-import { t as types } from './vueTypes-09cab4d3.js';
-import { a as isFunction } from './index-882489e1.js';
-import { s as suggestionsContainer, a as suggestions, I as Input } from './Input-11d211d2.js';
+import { t as types } from './vueTypes-f503e267.js';
+import { a as isFunction } from './index-104f1dfb.js';
+import { s as suggestionsContainer, a as suggestions, I as Input } from './Input-83dee8c5.js';
 import computeScrollIntoView from 'compute-scroll-into-view';
 import { replaceDiacritics } from '@appbaseio/reactivecore/lib/utils/suggestions';
 
@@ -28,7 +28,7 @@ var IconGroup = styled('div')(_templateObject$1 || (_templateObject$1 = _taggedT
   return enableAI ? "\n\t\ttop: 0%;\n\t    transform: translateY(0);\n    \theight: 42px;\n\t" : '';
 });
 
-var _templateObject$2;
+var _templateObject$2, _templateObject2;
 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;
@@ -38,6 +38,13 @@ var IconWrapper = styled('div')(_templateObject$2 || (_templateObject$2 = _tagge
     theme = _ref2$theme === void 0 ? {} : _ref2$theme;
   return theme.colors ? theme.colors.borderColor : '#000';
 });
+var ButtonIconWrapper = styled(IconWrapper)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\tborder-radius: 4px;\n\tvertical-align: middle;\n\theight: 25px;\n\tfont-size: 12px;\n\tborder: 1px solid ", ";\n\tcolor: ", ";\n\tmax-width: unset;\n\tpadding: 5px;\n"])), function (_ref3) {
+  var theme = _ref3.theme;
+  return theme.colors ? theme.colors.primaryColor : '#000';
+}, function (_ref4) {
+  var theme = _ref4.theme;
+  return theme.colors ? theme.colors.primaryColor : '#000';
+});
 
 /**
  * Scroll node into view if necessary
@@ -408,7 +415,7 @@ var CancelSvg = (function () {
   }, null)]);
 });
 
-var _templateObject$3, _templateObject2;
+var _templateObject$3, _templateObject2$1;
 var small = "\n\tmin-height: 0;\n\theight: 30px;\n\tborder: 0;\n\tbox-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;\n\tborder-radius: 2px;\n";
 var dark = function dark(_ref) {
   var theme = _ref.theme;
@@ -420,7 +427,7 @@ var Select = styled('button')(_templateObject$3 || (_templateObject$3 = _taggedT
   var themePreset = _ref2.themePreset;
   return themePreset === 'dark' && dark;
 });
-var Tick = styled('span')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\twidth: 16px;\n\theight: 16px;\n\tdisplay: inline-block;\n\tposition: relative;\n\tuser-select: none;\n\talign-items: center;\n\n\t&::after {\n\t\tbox-sizing: content-box;\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tbackground-color: transparent;\n\t\ttop: 50%;\n\t\tleft: 0;\n\t\twidth: 8px;\n\t\theight: 4px;\n\t\tmargin-top: -4px;\n\t\tborder-style: solid;\n\t\tborder-color: ", ";\n\t\tborder-width: 0 0 2px 2px;\n\t\tborder-radius: 0;\n\t\tborder-image: none;\n\t\ttransform: rotate(-45deg) scale(1);\n\t\ttransition: all 200ms ease-out;\n\t}\n"])), function (_ref3) {
+var Tick = styled('span')(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n\twidth: 16px;\n\theight: 16px;\n\tdisplay: inline-block;\n\tposition: relative;\n\tuser-select: none;\n\talign-items: center;\n\n\t&::after {\n\t\tbox-sizing: content-box;\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tbackground-color: transparent;\n\t\ttop: 50%;\n\t\tleft: 0;\n\t\twidth: 8px;\n\t\theight: 4px;\n\t\tmargin-top: -4px;\n\t\tborder-style: solid;\n\t\tborder-color: ", ";\n\t\tborder-width: 0 0 2px 2px;\n\t\tborder-radius: 0;\n\t\tborder-image: none;\n\t\ttransform: rotate(-45deg) scale(1);\n\t\ttransition: all 200ms ease-out;\n\t}\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.primaryColor;
 });
@@ -690,4 +697,4 @@ var Dropdown = {
   }
 };
 
-export { CancelSvg as C, Downshift as D, IconWrapper as I, IconGroup as a, InputWrapper as b, Dropdown as c };
+export { ButtonIconWrapper as B, CancelSvg as C, Downshift as D, IconWrapper as I, IconGroup as a, InputWrapper as b, Dropdown as c };

package/dist/es/DynamicRangeSlider.js

@@ -1,15 +1,17 @@
 import { Actions, helper } from '@appbaseio/reactivecore';
 import { componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
 import './_rollupPluginBabelHelpers-ded08042.js';
-import { createVNode, resolveComponent, mergeProps } from 'vue';
+import { createVNode, mergeProps } from 'vue';
 import VueTypes from 'vue-types';
 import '@appbaseio/vue-emotion';
-import { t as types } from './vueTypes-09cab4d3.js';
+import { t as types } from './vueTypes-f503e267.js';
 import 'redux';
-import { j as updateCustomQuery, d as getValidPropsKeys, i as isQueryIdentical, c as connect } from './index-882489e1.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-b058d14e.js';
+import { j as updateCustomQuery, d as getValidPropsKeys, i as isQueryIdentical, c as connect } from './index-104f1dfb.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-0856ed43.js';
 import { T as Title } from './Title-863dfa42.js';
 import { C as Container } from './Container-d00219f7.js';
+import VueSlider from 'vue-slider-component';
+import 'vue-slider-component/theme/antd.css';
 import { g as getComponents, N as NoSSR, S as Slider } from './ssr-c630ccb9.js';
 
 var addComponent = Actions.addComponent,
@@ -35,6 +37,7 @@ var DynamicRangeSlider = {
     className: VueTypes.string.def(''),
     rangeLabels: types.func,
     componentId: types.stringRequired,
+    compoundClause: types.compoundClause,
     customQuery: types.func,
     data: types.data,
     dataField: types.stringRequired,
@@ -317,7 +320,7 @@ var DynamicRangeSlider = {
               "class": getClassName(_this4.$props.innerClass, 'slider')
             }, {
               "default": function _default() {
-                return [createVNode(resolveComponent("vue-slider-component"), mergeProps({
+                return [createVNode(VueSlider, mergeProps({
                   "ref": "slider",
                   "modelValue": [Math.floor(Math.max(start, _this4.currentValue[0])), Math.ceil(Math.min(end, _this4.currentValue[1]))],
                   "min": Math.floor(Math.min(start, _this4.currentValue[0])),

package/dist/es/{Input-11d211d2.js → Input-83dee8c5.js}

@@ -2,12 +2,14 @@ import { _ as _taggedTemplateLiteralLoose } from './_rollupPluginBabelHelpers-de
 import { styled } from '@appbaseio/vue-emotion';
 import { css } from '@emotion/css';
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
 var alertBorder = function alertBorder(_ref) {
   var theme = _ref.theme;
   return "\n\tborder: 1px solid " + theme.colors.alertColor + ";\n";
 };
-var input = "\n\twidth: 100%;\n\tline-height: 1.5;\n\tmin-height: 42px;\n\tpadding: 8px 12px;\n\tborder: 1px solid #ccc;\n\tbackground-color: #fafafa;\n\tfont-size: 0.9rem;\n\toutline: none;\n\theight: 100%;\n\n\t&:focus {\n\t\tbackground-color: #fff;\n\t}\n";
+var input = function input(searchBox) {
+  return "\nwidth: 100%;\nline-height: 1.5;\nmin-height: 42px;\npadding: 8px 12px;\nborder: 1px solid #ccc;\nbackground-color: #fafafa;\nfont-size: 0.9rem;\noutline: none;\n&:focus {\n\tbackground-color: #fff;\n}\n" + (searchBox && "\n\tpadding: 8px 12px 9px;\n\tborder: 1px solid transparent;\n\tborder-radius: 6px;\n\tmin-height: unset;\n") + ";\n";
+};
 var dark = function dark(theme) {
   return "\n\tborder-color: " + theme.colors.borderColor + ";\n";
 };
@@ -15,12 +17,11 @@ var darkInput = function darkInput(_ref2) {
   var theme = _ref2.theme;
   return "\n\tbackground-color: " + theme.colors.backgroundColor + ";\n\tcolor: " + theme.colors.textColor + ";\n\t" + dark(theme) + ";\n\n\t&:focus {\n\t\tbackground-color: " + theme.colors.backgroundColor + ";\n\t}\n";
 };
-var Input = styled('input')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\t", ";\n\n\t&:focus {\n\t\tbackground-color: #fff;\n\t}\n\t", ";\n\n\t", ";\n\n\t", ";\n\n\t", ";\n\t", ";\n\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n"])), input, function (_ref3) {
-  var themePreset = _ref3.themePreset,
-    theme = _ref3.theme;
-  return themePreset === 'dark' && darkInput({
-    theme: theme
-  });
+var Input = styled('input')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\t", ";\n\t", ";\n\n\t", ";\n\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n\n\t", ";\n\n\t&[type='search']::-webkit-search-decoration,\n\t&[type='search']::-webkit-search-cancel-button,\n\t&[type='search']::-webkit-search-results-button,\n\t&[type='search']::-webkit-search-results-decoration {\n\t\tdisplay: none;\n\t}\n"])), function (props) {
+  return input(props.searchBox);
+}, function (_ref3) {
+  var themePreset = _ref3.themePreset;
+  return themePreset === 'dark' && darkInput;
 }, function (props) {
   return props.showIcon && props.iconPosition === 'left' && "\n\t\t\tpadding-left: 36px;\n\t\t";
 }, function (props) {
@@ -42,13 +43,13 @@ var Input = styled('input')(_templateObject || (_templateObject = _taggedTemplat
   );
 }, function (props) {
   return (
-    // for voice search icon with search icon
-    props.showVoiceSearch && props.showIcon && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 66px;\n\t\t"
+    // for voice search icon with clear icon
+    props.showVoiceSearch && props.showIcon && "\n\t\t\tpadding-right: 66px;\n\t\t"
   );
 }, function (props) {
   return (
-    // for voice search icon with clear icon
-    props.showVoiceSearch && props.showIcon && "\n\t\t\tpadding-right: 66px;\n\t\t"
+    // for voice search icon with search icon
+    props.showVoiceSearch && props.showIcon && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 66px;\n\t\t"
   );
 }, function (props) {
   return (
@@ -57,82 +58,32 @@ var Input = styled('input')(_templateObject || (_templateObject = _taggedTemplat
   );
 }, function (props) {
   return props.alert && alertBorder;
+}, function (props) {
+  return props.isOpen && "\n\t\t\tborder-bottom-left-radius: 0;\n\t\t\tborder-bottom-right-radius: 0;\n\t\t";
 });
 var suggestions = function suggestions(themePreset, theme) {
   return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\tdisplay: block;\n\twidth: 100%;\n\tborder: 1px solid #ccc;\n\tborder-top: none;\n\tbackground-color: #fff;\n\tfont-size: 0.9rem;\n\tz-index: 3;\n\tposition: absolute;\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tmax-height: min(100vh, 402px);\n\toverflow-y: auto;\n\n\t&.small {\n\t\ttop: 30px;\n\t}\n\n\tli {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tcursor: pointer;\n\t\tpadding: 10px;\n\t\tuser-select: none;\n\n\t\t& > .trim {\n\t\t\tdisplay: -webkit-box;\n\t\t\tdisplay: flex;\n\t\t\twidth: 100%;\n\t\t\tmax-height: 2.3rem;\n\t\t\tline-height: 1.2rem;\n\t\t\t-webkit-line-clamp: 2;\n\t\t\t-webkit-box-orient: vertical;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t\twhite-space: nowrap;\n\t\t}\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tbackground-color: #eee;\n\t\t}\n\t}\n\n\t", ";\n"])), themePreset === 'dark' && theme && dark(theme));
 };
-var suggestionsContainer = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\tposition: relative;\n\t.cancel-icon {\n\t\tcursor: pointer;\n\t}\n"])));
+var searchboxSuggestions = function searchboxSuggestions(themePreset, theme) {
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\t", ";\n\n\tmax-height: min(100vh, 401px);\n\tborder: none;\n\tborder-radius: 6px;\n\tborder-top-left-radius: 0;\n\tborder-top-right-radius: 0;\n\tbox-shadow: rgb(0 0 0 / 20%) 0px 10px 15px;\n\tborder-top: 1px solid #f2f0f0;\n\tli {\n\t\ttransition: all 0.3s ease-in;\n\t\tposition: relative;\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tbackground-color: unset;\n\t\t}\n\t\t.trim {\n\t\t\tline-height: 20px;\n\t\t}\n\t\t&.li-item {\n\t\t\tbackground-color: ", ";\n\n\t\t\t", "\n\t\t}\n\t\t&.active-li-item {\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: #fff;\n\t\t\tsvg {\n\t\t\t\ttransition: fill 0.3s ease-in;\n\t\t\t\tfill: #fff !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t.section-container {\n\t\tpadding-bottom: 5px;\n\t\tborder-bottom: 1px solid #f2f0f0;\n\t\t", ";\n\t\t.section-header {\n\t\t\tpadding: 10px;\n\t\t\tfont-size: 12px;\n\t\t\tcolor: #7f7c7c;\n\t\t\tbackground: #f9f9f9;\n\t\t\t", ";\n\t\t}\n\n\t\t.section-list {\n\t\t\tpadding-left: 0;\n\t\t}\n\t\t.section-list-item {\n\t\t\t&__label,\n\t\t\t&__description {\n\t\t\t\toverflow: hidden;\n\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\twhite-space: nowrap;\n\n\t\t\t\t* {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&__label {\n\t\t\t}\n\t\t\t&__description {\n\t\t\t\tmargin-top: 5px;\n\t\t\t\topacity: 0.7;\n\t\t\t\tfont-size: 12px;\n\t\t\t}\n\t\t}\n\t}\n"])), suggestions(themePreset, theme), themePreset === 'dark' ? '#424242' : '#fff', themePreset && theme && "svg {\n\t\t\t\tfill: " + (theme.colors ? theme.colors.primaryColor : '#707070') + ";\n\t\t\t}", themePreset === 'dark' ? '#555' : '#2d84f6', themePreset === 'dark' && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n\t\t\tbackground: #161616;\n\t\t"]))), themePreset === 'dark' && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n\t\t\t\tcolor: #218fe7;\n\t\t\t\tbackground: #161616;\n\t\t\t"]))));
+};
+var suggestionsContainer = css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n\tposition: relative;\n\t.cancel-icon {\n\t\tcursor: pointer;\n\t}\n"])));
 var noSuggestions = function noSuggestions(themePreset, theme) {
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n\tdisplay: block;\n\twidth: 100%;\n\tborder: 1px solid #ccc;\n\tborder-top: none;\n\tbackground-color: #fff;\n\tfont-size: 0.9rem;\n\tz-index: 3;\n\tposition: absolute;\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\n\t&.small {\n\t\ttop: 30px;\n\t}\n\n\tli {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tpadding: 10px;\n\t\tuser-select: none;\n\n\t\t& > .trim {\n\t\t\tdisplay: -webkit-box;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\tmax-height: 2.3rem;\n\t\t\tline-height: 1.2rem;\n\t\t\t-webkit-line-clamp: 2;\n\t\t\t-webkit-box-orient: vertical;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t\twhite-space: nowrap;\n\t\t}\n\t}\n\n\t", "\n"])), themePreset === 'dark' && theme && dark(theme));
+  return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n\tdisplay: block;\n\twidth: 100%;\n\tborder: 1px solid #ccc;\n\tborder-top: none;\n\tbackground-color: #fff;\n\tfont-size: 0.9rem;\n\tz-index: 3;\n\tposition: absolute;\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\n\t&.small {\n\t\ttop: 30px;\n\t}\n\n\tli {\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tpadding: 10px;\n\t\tuser-select: none;\n\n\t\t& > .trim {\n\t\t\tdisplay: -webkit-box;\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t\tmax-height: 2.3rem;\n\t\t\tline-height: 1.2rem;\n\t\t\t-webkit-line-clamp: 2;\n\t\t\t-webkit-box-orient: vertical;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t\twhite-space: nowrap;\n\t\t}\n\t}\n\n\t", "\n"])), themePreset === 'dark' && theme && dark(theme));
 };
-var TextArea = styled('textarea')(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n\t", ";\n\n\t&:focus {\n\t\tbackground-color: #fff;\n\t}\n\t", ";\n\n\t", ";\n\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\t&::-webkit-search-decoration,\n\t&::-webkit-search-cancel-button,\n\t&::-webkit-search-results-button,\n\t&::-webkit-search-results-decoration {\n\t\tdisplay: none;\n\t}\n\tresize: none;\n\toverflow: hidden;\n\theight: 42px;\n"])), input, function (_ref4) {
+var TextArea = styled('textarea')(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n\t", ";\n\t", ";\n\n\t", ";\n\t", ";\n\t&::-webkit-search-decoration,\n\t&::-webkit-search-cancel-button,\n\t&::-webkit-search-results-button,\n\t&::-webkit-search-results-decoration {\n\t\tdisplay: none;\n\t}\n\tresize: none;\n\toverflow: hidden;\n\theight: 42px;\n\tpadding-left: 0;\n\tpadding-right: 0;\n"])), function (props) {
+  return input(props.searchBox);
+}, function (_ref4) {
   var themePreset = _ref4.themePreset,
     theme = _ref4.theme;
   return themePreset === 'dark' && darkInput({
     theme: theme
   });
-}, function (props) {
-  return props.showIcon && props.iconPosition === 'left' && "\n\t\t\tpadding-left: 36px;\n\t\t";
-}, function (props) {
-  return props.showIcon && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 36px;\n\t\t";
-}, function (props) {
-  return (
-    // for clear icon
-    props.showClear && "\n\t\t\tpadding-right: 36px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for voice search icon
-    props.showVoiceSearch && "\n\t\t\tpadding-right: 36px;\n\t\t"
-  );
-}, function (props) {
-  return props.showFocusShortcutsIcon && "\n\t\t\tpadding-right: 20px;\n\t\t";
-}, function (props) {
-  return props.showIcon && props.showFocusShortcutsIcon && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 66px;\n\t\t";
-}, function (props) {
-  return (
-    // for voice search icon with focusshortcut  icon
-    props.showVoiceSearch && props.showFocusShortcutsIcon && "\n\t\t\tpadding-right: 50px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for clear icon with search icon
-    props.showClear && props.showIcon && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 66px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for voice search icon with clear icon
-    props.showVoiceSearch && props.showIcon && "\n\t\t\tpadding-right: 66px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for voice search icon with search icon
-    props.showVoiceSearch && props.showIcon && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 66px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for voice search icon with focusshortcut  icon and clear icon
-    props.showVoiceSearch && props.showFocusShortcutsIcon && props.showClear && "\n\t\t\tpadding-right: 80px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for search icon with focusshortcut  icon
-    props.showIcon && props.showFocusShortcutsIcon && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 66px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for clear icon with search icon and voice search
-    props.showClear && props.showIcon && props.showVoiceSearch && props.iconPosition === 'right' && "\n\t\t\tpadding-right: 90px;\n\t\t"
-  );
-}, function (props) {
-  return (
-    // for clear icon with search icon, focusshortcut icon and voice search
-    props.showClear && props.showIcon && props.showVoiceSearch && props.iconPosition === 'right' && props.showFocusShortcutsIcon && "\n\t\t\tpadding-right: 106px;\n\t\t"
-  );
 }, function (props) {
   return props.alert && alertBorder;
 }, function (props) {
-  return props.isOpen && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n\t\t\tborder-bottom-left-radius: 0;\n\t\t\tborder-bottom-right-radius: 0;\n\t\t"])));
+  return props.isOpen && "\n\t\t\tborder-bottom-left-radius: 0;\n\t\t\tborder-bottom-right-radius: 0;\n\t\t";
 });
+var Actions = styled('div')(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n"])));
 
-export { Input as I, TextArea as T, suggestions as a, noSuggestions as n, suggestionsContainer as s };
+export { Actions as A, Input as I, TextArea as T, suggestions as a, searchboxSuggestions as b, noSuggestions as n, suggestionsContainer as s };

package/dist/es/MultiDropdownList.js

@@ -9,15 +9,15 @@ import '@appbaseio/vue-emotion';
 import '@emotion/css';
 import 'polished';
 import { l as loadMoreContainer, B as Button } from './Button-5c2cf399.js';
-import { t as types } from './vueTypes-09cab4d3.js';
+import { t as types } from './vueTypes-f503e267.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { j as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, n as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-882489e1.js';
-import { C as ComponentWrapper } from './ComponentWrapper-a2635cfc.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-b058d14e.js';
+import { j as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, n as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-104f1dfb.js';
+import { C as ComponentWrapper } from './ComponentWrapper-46d04344.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-0856ed43.js';
 import { T as Title } from './Title-863dfa42.js';
-import { c as Dropdown } from './DropDown-39fedff8.js';
-import './Input-11d211d2.js';
+import { c as Dropdown } from './DropDown-48045fde.js';
+import './Input-83dee8c5.js';
 import 'compute-scroll-into-view';
 import { C as Container } from './Container-d00219f7.js';
 import '@appbaseio/reactivecore/lib/utils/suggestions';
@@ -56,6 +56,7 @@ var MultiDropdownList = {
     beforeValueChange: types.func,
     className: VueTypes.string.def(''),
     componentId: types.stringRequired,
+    compoundClause: types.compoundClause,
     customQuery: types.func,
     dataField: types.stringRequired,
     defaultValue: types.stringArray,

package/dist/es/MultiList.js

@@ -6,14 +6,14 @@ import VueTypes from 'vue-types';
 import '@appbaseio/vue-emotion';
 import '@emotion/css';
 import 'polished';
-import { t as types } from './vueTypes-09cab4d3.js';
+import { t as types } from './vueTypes-f503e267.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { j as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, m as isEvent, n as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-882489e1.js';
-import { C as ComponentWrapper } from './ComponentWrapper-a2635cfc.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-b058d14e.js';
+import { j as updateCustomQuery, u as updateDefaultQuery, i as isQueryIdentical, a as isFunction, m as isEvent, n as parseValueArray, g as getComponent, h as hasCustomRenderer, c as connect } from './index-104f1dfb.js';
+import { C as ComponentWrapper } from './ComponentWrapper-46d04344.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-0856ed43.js';
 import { T as Title } from './Title-863dfa42.js';
-import { I as Input } from './Input-11d211d2.js';
+import { I as Input } from './Input-83dee8c5.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-fe6eaee4.js';
@@ -39,6 +39,7 @@ var MultiList = {
     beforeValueChange: types.func,
     className: VueTypes.string.def(''),
     componentId: types.stringRequired,
+    compoundClause: types.compoundClause,
     customQuery: types.func,
     dataField: types.stringRequired,
     defaultQuery: types.func,

package/dist/es/MultiRange.js

@@ -6,12 +6,12 @@ import { createVNode, mergeProps, isVNode } from 'vue';
 import VueTypes from 'vue-types';
 import '@appbaseio/vue-emotion';
 import 'polished';
-import { t as types } from './vueTypes-09cab4d3.js';
+import { t as types } from './vueTypes-f503e267.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { n as parseValueArray, j as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-882489e1.js';
-import { C as ComponentWrapper } from './ComponentWrapper-a2635cfc.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-b058d14e.js';
+import { n as parseValueArray, j as updateCustomQuery, i as isQueryIdentical, c as connect } from './index-104f1dfb.js';
+import { C as ComponentWrapper } from './ComponentWrapper-46d04344.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-0856ed43.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-fe6eaee4.js';
@@ -41,6 +41,7 @@ var MultiRange = {
     beforeValueChange: types.func,
     className: VueTypes.string.def(''),
     componentId: types.stringRequired,
+    compoundClause: types.compoundClause,
     customQuery: types.func,
     data: types.data,
     dataField: types.stringRequired,

package/dist/es/{Pagination-50fc3ef5.js → Pagination-591fdb79.js}

@@ -3,7 +3,7 @@ import _transformOn from '@vue/babel-helper-vue-transform-on';
 import { createVNode, mergeProps, createTextVNode, isVNode } from 'vue';
 import VueTypes from 'vue-types';
 import { p as pagination, B as Button } from './Button-5c2cf399.js';
-import { t as types } from './vueTypes-09cab4d3.js';
+import { t as types } from './vueTypes-f503e267.js';
 
 function _isSlot(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);

package/dist/es/{PreferencesConsumer-b058d14e.js → PreferencesConsumer-0856ed43.js}

@@ -1,6 +1,6 @@
 import { a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
 import { h } from 'vue';
-import { b as getCamelCase } from './index-882489e1.js';
+import { b as getCamelCase } from './index-104f1dfb.js';
 
 var deepValue = function deepValue(o, p) {
   return p.split('.').reduce(function (a, v) {

package/dist/es/RangeInput.js

@@ -7,16 +7,18 @@ import VueTypes from 'vue-types';
 import { styled } from '@appbaseio/vue-emotion';
 import '@emotion/css';
 import 'polished';
-import { t as types } from './vueTypes-09cab4d3.js';
+import { t as types } from './vueTypes-f503e267.js';
 import '@appbaseio/reactivecore/lib/utils/transform';
 import 'redux';
-import { c as connect } from './index-882489e1.js';
-import { C as ComponentWrapper } from './ComponentWrapper-a2635cfc.js';
-import { P as PreferencesConsumer } from './PreferencesConsumer-b058d14e.js';
+import { c as connect } from './index-104f1dfb.js';
+import { C as ComponentWrapper } from './ComponentWrapper-46d04344.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-0856ed43.js';
 import './Title-863dfa42.js';
 import { F as Flex } from './Flex-25792bc3.js';
-import { I as Input } from './Input-11d211d2.js';
+import { I as Input } from './Input-83dee8c5.js';
 import { C as Container } from './Container-d00219f7.js';
+import 'vue-slider-component';
+import 'vue-slider-component/theme/antd.css';
 import './ssr-c630ccb9.js';
 import { RangeConnected as RangeConnected$1 } from './RangeSlider.js';
 
@@ -75,6 +77,7 @@ var RangeInput = {
     stepValue: types.number,
     componentStyle: types.style,
     componentId: types.stringRequired,
+    compoundClause: types.compoundClause,
     includeNullValues: VueTypes.bool,
     beforeValueChange: types.func,
     customQuery: types.func,