@appbaseio/reactivesearch-vue 3.0.0-rc.5.alpha.2 → 3.0.0-rc.5.alpha.3

package/dist/es/install-ff8b0750.js

@@ -0,0 +1,868 @@
+import { Actions } from '@appbaseio/reactivecore';
+import { TREELIST_VALUES_PATH_SEPARATOR, componentTypes } from '@appbaseio/reactivecore/lib/utils/constants';
+import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
+import { createVNode, createTextVNode, mergeProps, isVNode, h } from 'vue';
+import VueTypes from 'vue-types';
+import { recLookup, getClassName, updateCustomQuery, updateDefaultQuery, transformTreeListLocalStateIntoQueryComptaibleFormat, isEqual, transformRawTreeListData, setDeep, getComponent, getOptionsFromQuery, checkValueChange, getQueryOptions, getAggsQuery, updateInternalQuery, isFunction } from '@appbaseio/reactivecore/lib/utils/helper';
+import { styled } from '@appbaseio/vue-emotion';
+import { t as types$1 } from './vueTypes-f1923c72.js';
+import { RLConnected as ReactiveList } from './ReactiveList.js';
+import { getInternalComponentID } from '@appbaseio/reactivecore/lib/utils/transform';
+import { h as hasCustomRenderer, c as connect } from './index-882489e1.js';
+import { C as ComponentWrapper } from './ComponentWrapper-8a3c388d.js';
+import { P as PreferencesConsumer } from './PreferencesConsumer-b058d14e.js';
+import { T as Title } from './Title-863dfa42.js';
+import { L as ListItem } from './ListItem-e3c6acf4.js';
+import { F as Flex } from './Flex-25792bc3.js';
+import ReactiveBase from './ReactiveBase.js';
+import { SBConnected as SearchBox } from './SearchBox.js';
+import { I as Input } from './Input-f7499ef8.js';
+import { C as Container } from './Container-d00219f7.js';
+import { replaceDiacritics } from '@appbaseio/reactivecore/lib/utils/suggestions';
+import { C as Checkbox, R as Radio } from './FormControlList-fe6eaee4.js';
+import { s as sanitizeObject } from './utils-d7dd4f4e.js';
+import { ListConnected as SingleList } from './SingleList.js';
+import { ListConnected as MultiList } from './MultiList.js';
+import types from '@appbaseio/reactivecore/lib/utils/types';
+import { ListConnected as SingleDropdownList } from './SingleDropdownList.js';
+import { ListConnected as MultiDropdownList } from './MultiDropdownList.js';
+import { TBConnected as ToggleButton } from './ToggleButton.js';
+import ReactiveComponent from './ReactiveComponent.js';
+import { RangeConnected as DynamicRangeSlider } from './DynamicRangeSlider.js';
+import { RangeConnected as SingleRange } from './SingleRange.js';
+import { RangeConnected as MultiRange } from './MultiRange.js';
+import { RangeConnected as RangeSlider } from './RangeSlider.js';
+import { RangeConnected as RangeInput } from './RangeInput.js';
+import SelectedFilters from './SelectedFilters.js';
+import ResultCard from './ResultCard.js';
+import ResultList from './ResultList.js';
+import StateProvider from './StateProvider.js';
+
+var _templateObject, _templateObject2;
+var HierarchicalMenuList = styled('ul')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\tlist-style: none;\n\tpadding: 0;\n\tmargin: 0;\n\tmax-height: 0;\n\toverflow: hidden;\n\n\t&.--open {\n\t\tmax-height: 100%;\n\t}\n"])));
+var HierarchicalMenuListItem = styled('li')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\tfont-weight: 400;\n\tline-height: 1.5;\n\tbox-sizing: border-box;\n\n\ta {\n\t\tcolor: #424242;\n\t\ttext-decoration: none;\n\t\tgap: 5px;\n\t\t.--leaf-icon,\n\t\t.--folder-icon {\n\t\t\tline-height: 15px;\n\t\t\tsvg {\n\t\t\t\theight: 15px;\n\t\t\t}\n\t\t}\n\n\t\tinput {\n\t\t\tmargin: 0;\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n\n\t.--switcher-icon {\n\t\ttransition: all 0.2s ease-in;\n\t\tmargin-right: 2px;\n\t}\n\t.--list-child {\n\t\tpadding-left: 1rem;\n\t\tposition: relative;\n\t\t&:before {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\tborder-left: 1px solid #787878;\n\t\t\twidth: 0;\n\t\t\tleft: 19px;\n\t\t\t", ";\n\t\t}\n\n\t\t&.--show-switcher-icon {\n\t\t\tpadding-left: 36px;\n\t\t}\n\t}\n\t.--list-item-label {\n\t\tline-height: 100%;\n\t}\n\t.--list-item-count {\n\t\tmargin-left: 10px;\n\t\tpadding: 0.1rem 0.4rem;\n\t\tfont-size: 0.8rem;\n\t\tcolor: #424242;\n\t\tbackground-color: #dee1e6;\n\t\tborder-radius: 8px;\n\t}\n\t&.-selected-item {\n\t\tfont-weight: 700 !important;\n\t}\n\t&.-expanded-item {\n\t\t& > a {\n\t\t\t& div > .--switcher-icon {\n\t\t\t\ttransform: rotate(90deg);\n\t\t\t}\n\t\t}\n\t}\n\t.--list-item-label-count-wrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t&:hover {\n\t\t\t.--list-item-count,\n\t\t\t.--list-item-label {\n\t\t\t\tfont-weight: 700;\n\t\t\t}\n\t\t}\n\t}\n"])), function (props) {
+  return !props.showLine && "\n\t\t\t\t\tdisplay: none;\n\t\t\t\t";
+});
+
+var HierarchicalMenuListItemComponent = {
+  name: 'HierarchicalMenuListItemComponent',
+  data: function data() {
+    return {
+      isExpanded: false,
+      newParentPath: ''
+    };
+  },
+  created: function created() {
+    var listItemLabel = this.listItem.key;
+    var newParentPath = listItemLabel;
+    if (this.parentPath) {
+      newParentPath = "" + this.parentPath + TREELIST_VALUES_PATH_SEPARATOR + listItemLabel;
+    }
+    this.newParentPath = newParentPath;
+    this.isExpanded = !!recLookup(this.selectedValues, newParentPath, TREELIST_VALUES_PATH_SEPARATOR);
+  },
+  watch: {
+    listItem: function listItem(newVal) {
+      if (newVal.initiallyExpanded) {
+        this.isExpanded = newVal.initiallyExpanded;
+      }
+    },
+    selectedValues: function selectedValues(newVal) {
+      this.isExpanded = !!recLookup(newVal, this.newParentPath, TREELIST_VALUES_PATH_SEPARATOR);
+    }
+  },
+  props: {
+    parentPath: types.string,
+    selectedValues: types.rawData,
+    mode: types.string,
+    searchTerm: types.string,
+    listItem: types.rawData,
+    showLine: types.bool,
+    renderItem: types.func,
+    handleListItemClick: types.func,
+    renderSwitcherIcon: types.func,
+    showCheckbox: VueTypes.bool,
+    innerClass: types.style,
+    showRadio: VueTypes.bool,
+    renderIcon: types.func,
+    showCount: VueTypes.bool,
+    showSwitcherIcon: types.bool,
+    switcherIcon: types.children
+  },
+  render: function render() {
+    var _this = this;
+    var _this$$props = this.$props,
+      selectedValues = _this$$props.selectedValues,
+      mode = _this$$props.mode,
+      searchTerm = _this$$props.searchTerm,
+      listItem = _this$$props.listItem,
+      parentPath = _this$$props.parentPath,
+      showLine = _this$$props.showLine,
+      renderItem = _this$$props.renderItem,
+      handleListItemClick = _this$$props.handleListItemClick,
+      showCheckbox = _this$$props.showCheckbox,
+      innerClass = _this$$props.innerClass,
+      showRadio = _this$$props.showRadio,
+      renderIcon = _this$$props.renderIcon,
+      showCount = _this$$props.showCount,
+      showSwitcherIcon = _this$$props.showSwitcherIcon;
+    if (!(listItem instanceof Object) || Object.keys(listItem).length === 0) {
+      return null;
+    }
+    var listItemLabel = listItem.key;
+    var listItemCount = listItem.count;
+    var isLeafNode = !(Array.isArray(listItem.list) && listItem.list.length > 0);
+    var renderSwitcherIcon = function renderSwitcherIcon(isExpandedProp) {
+      if (showSwitcherIcon === false) {
+        return null;
+      }
+      var switcherIcon = _this.$props.switcherIcon;
+      if (switcherIcon) return switcherIcon(isExpandedProp);
+      return (
+        /* eslint-disable jsx-a11y/click-events-have-key-events
+        , jsx-a11y/no-static-element-interactions,jsx-a11y/no-noninteractive-tabindex */
+        createVNode("span", {
+          "tabIndex": "0",
+          "onClick": function onClick(e) {
+            e.stopPropagation();
+            _this.isExpanded = !_this.isExpanded;
+          },
+          "class": "--switcher-icon"
+        }, [createTextVNode("\u27A4")])
+      );
+    };
+    var isSelected = false;
+    if (mode === 'single') {
+      if (recLookup(selectedValues, this.newParentPath, TREELIST_VALUES_PATH_SEPARATOR) === true) {
+        isSelected = true;
+      }
+    } else {
+      isSelected = !!recLookup(selectedValues, this.newParentPath, TREELIST_VALUES_PATH_SEPARATOR);
+    }
+    return createVNode(HierarchicalMenuListItem, {
+      "class": (isSelected ? '-selected-item' : '') + " " + (this.isExpanded ? '-expanded-item' : ''),
+      "key": this.newParentPath,
+      "showLine": showLine
+    }, {
+      "default": function _default() {
+        return [createVNode(ListItem, {
+          "isTreeListItem": true,
+          "onClick": function onClick() {
+            handleListItemClick(listItemLabel, parentPath);
+          },
+          "style": {
+            textDecoration: 'none'
+          }
+        }, {
+          "default": function _default() {
+            return [renderItem ? renderItem(listItemLabel, listItemCount, isSelected) : createVNode(Flex, {
+              "alignItems": "center",
+              "gap": "5px"
+            }, {
+              "default": function _default() {
+                return [!isLeafNode && renderSwitcherIcon(isSelected), mode === 'multiple' && showCheckbox && createVNode(Flex, {
+                  "alignItems": "center",
+                  "gap": "5px"
+                }, {
+                  "default": function _default() {
+                    return [createVNode(Checkbox, {
+                      "type": "checkbox",
+                      "class": getClassName(innerClass, 'checkbox') || null,
+                      "checked": isSelected,
+                      "id": listItemLabel + "-checkbox-" + _this.newParentPath,
+                      "name": listItemLabel + "-checkbox-" + _this.newParentPath,
+                      "show": true,
+                      "readOnly": true
+                    }, null), createVNode("label", {
+                      "style": {
+                        width: '26px',
+                        marginTop: 0,
+                        marginBottom: 0,
+                        marginRight: '-9px',
+                        left: '-3px'
+                      },
+                      "htmlFor": listItemLabel + "-checkbox-" + _this.newParentPath,
+                      "onClick": function onClick(e) {
+                        e.stopPropagation();
+                      }
+                    }, null)];
+                  }
+                }), mode === 'single' && showRadio && createVNode(Flex, {
+                  "alignItems": "center",
+                  "gap": "5px"
+                }, {
+                  "default": function _default() {
+                    return [createVNode(Radio, {
+                      "checked": isSelected,
+                      "class": getClassName(innerClass, 'radio') || null,
+                      "id": listItemLabel + "-radio-" + _this.newParentPath,
+                      "name": listItemLabel + "-radio-" + _this.newParentPath,
+                      "show": true,
+                      "readOnly": true,
+                      "type": "radio"
+                    }, null), createVNode("label", {
+                      "style": {
+                        width: '26px',
+                        marginTop: 0,
+                        marginBottom: 0,
+                        marginRight: '-9px',
+                        left: '-3px'
+                      },
+                      "htmlFor": listItemLabel + "-radio-" + _this.newParentPath,
+                      "onClick": function onClick(e) {
+                        e.stopPropagation();
+                      }
+                    }, null)];
+                  }
+                }), ' ', renderIcon(isLeafNode), createVNode("div", {
+                  "class": "--list-item-label-count-wrapper"
+                }, [createVNode("span", {
+                  "class": "--list-item-label " + (getClassName(innerClass, 'label') || '')
+                }, [listItemLabel]), showCount && createVNode("span", {
+                  "class": "--list-item-count " + (getClassName(innerClass, 'count') || '')
+                }, [listItemCount])])];
+              }
+            })];
+          }
+        }), isLeafNode === false && createVNode("div", {
+          "class": "--list-child " + (showSwitcherIcon ? ' --show-switcher-icon' : '')
+        }, [createVNode(HierarchicalMenuComponent, {
+          "key": _this.newParentPath + "-" + listItemLabel + "-" + listItemCount,
+          "listArray": listItem.list,
+          "parentPath": _this.newParentPath,
+          "isExpanded": _this.isExpanded,
+          "listItemProps": {
+            mode: mode,
+            selectedValues: selectedValues,
+            searchTerm: searchTerm,
+            showLine: showLine,
+            renderItem: renderItem,
+            handleListItemClick: handleListItemClick,
+            renderSwitcherIcon: renderSwitcherIcon,
+            showCheckbox: showCheckbox,
+            innerClass: innerClass,
+            showRadio: showRadio,
+            renderIcon: renderIcon,
+            showCount: showCount,
+            showSwitcherIcon: showSwitcherIcon,
+            switcherIcon: _this.$props.switcherIcon
+          }
+        }, null)])];
+      }
+    });
+  }
+};
+
+function _isSlot(s) {
+  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
+}
+var HierarchicalMenuComponent = {
+  name: 'HierarchicalMenuComponent',
+  props: {
+    listArray: VueTypes.arrayOf(VueTypes.object),
+    // array of objects
+    parentPath: VueTypes.string.def(''),
+    isExpanded: VueTypes.bool.def(false),
+    listItemProps: types.rawData
+  },
+  render: function render() {
+    var _slot;
+    var _this$$props = this.$props,
+      listArray = _this$$props.listArray,
+      isExpanded = _this$$props.isExpanded,
+      parentPath = _this$$props.parentPath,
+      listItemProps = _this$$props.listItemProps;
+    if (!Array.isArray(listArray) || listArray.length === 0) {
+      return null;
+    }
+    return createVNode(HierarchicalMenuList, {
+      "class": "" + (isExpanded ? '--open' : ''),
+      "isSelected": isExpanded
+    }, _isSlot(_slot = listArray.map(function (listItem) {
+      return createVNode(HierarchicalMenuListItemComponent, mergeProps({
+        "key": parentPath + "__" + JSON.stringify(listItem),
+        "parentPath": parentPath,
+        "listItem": listItem
+      }, listItemProps), null);
+    })) ? _slot : {
+      "default": function _default() {
+        return [_slot];
+      }
+    });
+  }
+};
+
+function _isSlot$1(s) {
+  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
+}
+var updateQueryAction = Actions.updateQuery,
+  setQueryOptions = Actions.setQueryOptions;
+var transformValueIntoLocalState = function transformValueIntoLocalState(valueArray) {
+  var valueToSet = {};
+  if (valueArray.length) {
+    var newSelectedValues = {};
+    valueArray.forEach(function (valueItem) {
+      setDeep(newSelectedValues, valueItem.split(' > '), !recLookup(newSelectedValues, valueItem.split(' > '), TREELIST_VALUES_PATH_SEPARATOR), true);
+    });
+    valueToSet = newSelectedValues;
+  }
+  return valueToSet;
+};
+var TreeList = {
+  name: 'TreeList',
+  props: {
+    selectedValue: types$1.selectedValue,
+    error: types$1.title,
+    rawData: types$1.rawData,
+    aggregationData: types$1.rawData,
+    themePreset: types$1.themePreset,
+    updateQueryAction: types$1.funcRequired,
+    setQueryOptions: types$1.funcRequired,
+    // component props
+    componentId: types$1.string.isRequired,
+    className: types$1.string,
+    style: types$1.style,
+    showRadio: VueTypes.bool.def(false),
+    showCheckbox: types$1.bool.def(false),
+    mode: VueTypes.oneOf(['single', 'multiple']).def('multiple'),
+    showCount: VueTypes.bool.def(false),
+    showSearch: VueTypes.bool.def(false),
+    showIcon: VueTypes.bool.def(false),
+    icon: types$1.children,
+    showLeafIcon: VueTypes.bool.def(false),
+    leafIcon: types$1.children,
+    showLine: VueTypes.bool.def(false),
+    switcherIcon: types$1.func,
+    render: types$1.func,
+    renderItem: types$1.func,
+    innerClass: types$1.style,
+    placeholder: types$1.string,
+    title: types$1.title,
+    isLoading: types$1.bool,
+    dataField: types$1.stringArray.isRequired,
+    onQueryChange: types$1.func,
+    defaultValue: types$1.stringArray,
+    value: types$1.stringArray,
+    customQuery: types$1.func,
+    defaultQuery: types$1.func,
+    enableAppbase: types$1.bool,
+    index: types$1.string,
+    showFilter: types$1.bool,
+    URLParams: types$1.bool,
+    filterLabel: types$1.string,
+    onChange: types$1.func,
+    onValueChange: types$1.func,
+    beforeValueChange: types$1.func,
+    sortBy: types$1.sortByWithCount.def('count'),
+    onError: types$1.func,
+    showSwitcherIcon: types$1.bool.def(true),
+    renderError: types$1.title,
+    renderNoResults: types$1.func,
+    loader: types$1.title,
+    aggergationSize: types$1.number,
+    endpoint: types$1.endpoint,
+    queryFormat: types$1.queryFormatSearch.def('or'),
+    size: types$1.number.def(100),
+    nestedField: types$1.string,
+    react: types$1.react,
+    transformData: types$1.func,
+    selectAllLabel: types$1.string,
+    showMissing: VueTypes.bool.def(false),
+    missingLabel: VueTypes.string.def('N/A')
+  },
+  data: function data() {
+    var props = this.$props;
+    this.__state = {
+      selectedValues: {},
+      searchTerm: '',
+      aggregationData: []
+    };
+    this.internalComponent = props.componentId + "__internal";
+    return this.__state;
+  },
+  created: function created() {
+    var props = this.$props;
+    var componentId = props.componentId;
+    var defaultValue = this.defaultValue || this.value;
+    var currentValueArray = this.selectedValue || defaultValue || [];
+    // update local state for selected values
+    if (currentValueArray.length) {
+      var newSelectedValues = transformValueIntoLocalState(currentValueArray);
+      this.setValue(newSelectedValues, true);
+    }
+
+    // Set custom and default queries in store
+    updateCustomQuery(componentId, props, currentValueArray);
+    updateDefaultQuery(componentId, props, currentValueArray);
+    this.updateQueryOptions();
+  },
+  mounted: function mounted() {
+    var _this$$props = this.$props,
+      enableAppbase = _this$$props.enableAppbase,
+      index = _this$$props.index;
+    if (!enableAppbase && index) {
+      console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
+    }
+  },
+  watch: {
+    defaultQuery: function defaultQuery() {
+      this.updateDefaultQuery();
+      this.updateQuery([]);
+    },
+    customQuery: function customQuery() {
+      var valueArray = transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues) || [];
+      this.updateQuery(valueArray);
+    },
+    sortBy: function sortBy() {
+      this.updateQueryOptions();
+    },
+    dataField: function dataField() {
+      var valueArray = transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues) || [];
+      this.updateQueryOptions();
+      this.updateQuery(valueArray);
+    },
+    value: function value(newVal, oldVal) {
+      if (!isEqual(newVal, oldVal)) {
+        this.setValue(newVal);
+      }
+    },
+    selectedValue: function selectedValue(newVal) {
+      if (!isEqual(transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues), newVal)) {
+        var _this$$props2 = this.$props,
+          value = _this$$props2.value,
+          onChange = _this$$props2.onChange;
+        var valueToSet = [];
+        if (Array.isArray(newVal) && newVal.length) {
+          valueToSet = newVal;
+        }
+        if (value === undefined) {
+          this.setValue(valueToSet);
+        } else if (onChange && !isEqual(value, valueToSet)) {
+          onChange(valueToSet);
+        }
+      }
+    },
+    aggregationData: function aggregationData(newVal, oldVal) {
+      if (newVal && !isEqual(newVal, oldVal)) {
+        this.$data.aggregationData = newVal;
+      }
+    }
+  },
+  computed: {
+    hasCustomRenderer: function hasCustomRenderer$1() {
+      return hasCustomRenderer(this);
+    }
+  },
+  methods: {
+    renderIcon: function renderIcon(isLeafNode) {
+      var _this$$props3 = this.$props,
+        showIcon = _this$$props3.showIcon,
+        showLeafIcon = _this$$props3.showLeafIcon,
+        icon = _this$$props3.icon;
+      if (isLeafNode) {
+        if (!showLeafIcon) return null;
+        var _ref = this.$slots || this.$props,
+          leafIcon = _ref.leafIcon;
+        if (leafIcon) return leafIcon();
+        return createVNode("span", {
+          "role": "img",
+          "aria-label": "file",
+          "class": "--leaf-icon"
+        }, [createVNode("svg", {
+          "viewBox": "64 64 896 896",
+          "focusable": "false",
+          "data-icon": "file",
+          "width": "1em",
+          "height": "1em",
+          "fill": "currentColor",
+          "aria-hidden": "true"
+        }, [createVNode("path", {
+          "d": "M854.6 288.6L639.4 73.4c-6-6-14.1-9.4-22.6-9.4H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V311.3c0-8.5-3.4-16.7-9.4-22.7zM790.2 326H602V137.8L790.2 326zm1.8 562H232V136h302v216a42 42 0 0042 42h216v494z"
+        }, null)])]);
+      }
+      if (!showIcon) return null;
+      if (icon) {
+        return icon;
+      }
+      if (this.$slots.icon) {
+        return this.$slots.icon();
+      }
+      return createVNode("span", {
+        "role": "img",
+        "aria-label": "folder-open",
+        "class": "--folder-icon"
+      }, [createVNode("svg", {
+        "viewBox": "64 64 896 896",
+        "focusable": "false",
+        "data-icon": "folder-open",
+        "width": "1em",
+        "height": "1em",
+        "fill": "currentColor",
+        "aria-hidden": "true"
+      }, [createVNode("path", {
+        "d": "M928 444H820V330.4c0-17.7-14.3-32-32-32H473L355.7 186.2a8.15 8.15 0 00-5.5-2.2H96c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h698c13 0 24.8-7.9 29.7-20l134-332c1.5-3.8 2.3-7.9 2.3-12 0-17.7-14.3-32-32-32zM136 256h188.5l119.6 114.4H748V444H238c-13 0-24.8 7.9-29.7 20L136 643.2V256zm635.3 512H159l103.3-256h612.4L771.3 768z"
+      }, null)])]);
+    },
+    getTransformedData: function getTransformedData() {
+      var _this$$props4 = this.$props,
+        dataField = _this$$props4.dataField,
+        showSearch = _this$$props4.showSearch;
+      var transformedData = transformRawTreeListData(this.$data.aggregationData, dataField);
+      var filteredData = [];
+      if (showSearch && this.searchTerm) {
+        filteredData = this.filterDataBasedOnSearchTerm(transformedData, '');
+      }
+      return filteredData.length ? filteredData : transformedData;
+    },
+    handleInputChange: function handleInputChange(e) {
+      var value = e.target.value;
+      this.searchTerm = value;
+    },
+    renderSearch: function renderSearch() {
+      var _this$$props5 = this.$props,
+        showSearch = _this$$props5.showSearch,
+        innerClass = _this$$props5.innerClass,
+        placeholder = _this$$props5.placeholder,
+        componentId = _this$$props5.componentId,
+        themePreset = _this$$props5.themePreset;
+      if (showSearch) {
+        return createVNode(Input, {
+          "class": getClassName(innerClass, 'input') || null,
+          "onInput": this.handleInputChange,
+          "value": this.searchTerm,
+          "placeholder": placeholder || 'Search',
+          "style": {
+            margin: '0 0 8px'
+          },
+          "aria-label": componentId + "-search",
+          "themePreset": themePreset
+        }, null);
+      }
+      return null;
+    },
+    handleListItemClick: function handleListItemClick(key, parentPath) {
+      var path = key;
+      if (parentPath) {
+        path = "" + parentPath + TREELIST_VALUES_PATH_SEPARATOR + key;
+      }
+      var newSelectedValues = _extends({}, this.selectedValues);
+      if (this.$props.mode === 'single') {
+        newSelectedValues = {};
+        setDeep(newSelectedValues, path.split(TREELIST_VALUES_PATH_SEPARATOR), true, true);
+      } else {
+        var newValue = !recLookup(newSelectedValues, path, TREELIST_VALUES_PATH_SEPARATOR);
+        setDeep(newSelectedValues, path.split(TREELIST_VALUES_PATH_SEPARATOR), newValue, true);
+      }
+      newSelectedValues = sanitizeObject(_extends({}, newSelectedValues));
+      if (this.$props.value === undefined) {
+        this.setValue(newSelectedValues);
+      } else if (this.$props.onChange) {
+        var valueToSet = transformTreeListLocalStateIntoQueryComptaibleFormat(newSelectedValues);
+        this.$props.onChange(valueToSet);
+      }
+    },
+    filterDataBasedOnSearchTerm: function filterDataBasedOnSearchTerm(listArray, parentPath) {
+      var _this = this;
+      if (!(listArray && Array.isArray(listArray) && listArray.length)) {
+        return null;
+      }
+      var result = [];
+      listArray.forEach(function (ele) {
+        var isLeafItem = !ele.list;
+        var newParentPath = ele.key;
+        if (parentPath) {
+          newParentPath = parentPath + "." + ele.key;
+        }
+        var keyHasSearchTerm = replaceDiacritics(ele.key).toLowerCase().includes(replaceDiacritics(_this.$data.searchTerm).toLowerCase()) || recLookup(_this.$data.selectedValues, newParentPath, TREELIST_VALUES_PATH_SEPARATOR);
+        if (isLeafItem && keyHasSearchTerm) {
+          result.push(_extends({}, ele, {
+            initiallyExpanded: keyHasSearchTerm
+          }));
+        } else if (!isLeafItem) {
+          var filteredChildrenItems = _this.filterDataBasedOnSearchTerm(ele.list, newParentPath);
+          if (keyHasSearchTerm || !!filteredChildrenItems.length) {
+            result.push(_extends({}, ele, {
+              initiallyExpanded: keyHasSearchTerm || !!filteredChildrenItems.length,
+              list: filteredChildrenItems
+            }));
+          }
+        }
+      });
+      return result;
+    },
+    getComponent: function getComponent$1() {
+      var _this$$props6 = this.$props,
+        rawData = _this$$props6.rawData,
+        error = _this$$props6.error,
+        isLoading = _this$$props6.isLoading;
+      var data = {
+        data: this.getTransformedData(),
+        rawData: rawData,
+        error: error,
+        handleClick: this.handleListItemClick,
+        value: this.$data.selectedValues,
+        loading: isLoading,
+        PATH_SEPARATOR: TREELIST_VALUES_PATH_SEPARATOR
+      };
+      return this.$slots.render(data) || getComponent(data, this.$props);
+    },
+    getDefaultQuery: function getDefaultQuery(value) {
+      var _this2 = this;
+      var query = null;
+      var type = 'term';
+      var booleanAggregator = this.$props.queryFormat === 'or' ? 'should' : 'must';
+      if (!Array.isArray(value) || value.length === 0) {
+        return null;
+      }
+      if (value) {
+        var _bool;
+        // adds a sub-query with must as an array of objects for each term/value
+        var queryArray = value.map(function (item) {
+          return {
+            bool: {
+              must: item.split(' > ').map(function (subItem, i) {
+                var _type, _ref2;
+                return _ref2 = {}, _ref2[type] = (_type = {}, _type[_this2.$props.dataField[i]] = subItem, _type), _ref2;
+              })
+            }
+          };
+        });
+        var listQuery = {
+          bool: (_bool = {}, _bool[booleanAggregator] = queryArray, _bool)
+        };
+        query = value.length ? listQuery : null;
+      }
+      if (query && this.$props.nestedField) {
+        return {
+          nested: {
+            path: this.$props.nestedField,
+            query: query
+          }
+        };
+      }
+      return query;
+    },
+    updateQuery: function updateQuery(value) {
+      var customQuery = this.$props.customQuery;
+      var query = this.getDefaultQuery(value);
+      var customQueryOptions;
+      if (customQuery) {
+        var _ref3 = customQuery(value, this.$props) || {};
+        query = _ref3.query;
+        customQueryOptions = getOptionsFromQuery(customQuery(value, this.$props));
+        updateCustomQuery(this.$props.componentId, this.$props, value);
+      }
+      this.setQueryOptions(this.$props.componentId, _extends({}, this.generateQueryOptions(), customQueryOptions));
+      this.updateQueryAction({
+        componentId: this.$props.componentId,
+        query: query,
+        value: value,
+        label: this.$props.filterLabel,
+        showFilter: this.$props.showFilter,
+        URLParams: this.$props.URLParams,
+        componentType: componentTypes.treeList
+      });
+    },
+    setValue: function setValue(value, hasMountedParam) {
+      var _this3 = this;
+      if (hasMountedParam === void 0) {
+        hasMountedParam = true;
+      }
+      var finalValues = Array.isArray(value) === false ? transformTreeListLocalStateIntoQueryComptaibleFormat(value) : value;
+      var performUpdate = function performUpdate() {
+        var handleUpdates = function handleUpdates() {
+          _this3.updateQuery(finalValues);
+          if (_this3.$props.onValueChange) _this3.$props.onValueChange(finalValues);
+        };
+        if (hasMountedParam) {
+          _this3.selectedValues = Array.isArray(value) ? transformValueIntoLocalState(value) : value;
+          handleUpdates();
+        } else {
+          handleUpdates();
+        }
+      };
+      checkValueChange(this.$props.componentId, finalValues, this.$props.beforeValueChange, performUpdate);
+    },
+    generateQueryOptions: function generateQueryOptions() {
+      var queryOptions = getQueryOptions(this.$props);
+      var valueArray = transformTreeListLocalStateIntoQueryComptaibleFormat(this.selectedValues);
+      return getAggsQuery(valueArray, queryOptions, this.$props);
+    },
+    updateDefaultQuery: function updateDefaultQuery$1(queryOptions) {
+      var value = transformTreeListLocalStateIntoQueryComptaibleFormat(this.selectedValues);
+      // Update default query for RS API
+      updateDefaultQuery(this.$props.componentId, this.$props, value);
+      updateInternalQuery(getInternalComponentID(this.$props.componentId), queryOptions, value, this.$props, this.generateQueryOptions(), null);
+    },
+    updateQueryOptions: function updateQueryOptions() {
+      // for a new query due to other changes don't append after to get fresh results
+      var queryOptions = this.generateQueryOptions(this.$props, {}, transformTreeListLocalStateIntoQueryComptaibleFormat(this.$data.selectedValues));
+      if (this.$props.defaultQuery) {
+        // eslint-disable-next-line no-use-before-define
+        this.updateDefaultQuery(queryOptions);
+      } else {
+        this.setQueryOptions(getInternalComponentID(this.$props.componentId), queryOptions);
+      }
+    }
+  },
+  render: function render() {
+    var _this4 = this;
+    var props = this.$props;
+    var style = props.style,
+      className = props.className,
+      mode = props.mode,
+      showLine = props.showLine,
+      renderItem = props.renderItem,
+      showCheckbox = props.showCheckbox,
+      innerClass = props.innerClass,
+      showRadio = props.showRadio,
+      showCount = props.showCount,
+      showSwitcherIcon = props.showSwitcherIcon,
+      switcherIcon = props.switcherIcon,
+      title = props.title,
+      loader = props.loader,
+      renderError = props.renderError;
+    if (this.isLoading) {
+      return (this.$slots.loader ? this.$slots.loader() : loader) || null;
+    }
+    if (this.error) {
+      if (this.$slots.renderError) {
+        return this.$slots.renderError(this.error);
+      }
+      return isFunction(renderError) ? renderError(this.error) : renderError;
+    }
+    var transformedData = this.getTransformedData();
+    if (!transformedData || transformedData.length === 0) {
+      return this.$slots.renderNoResults ? this.$slots.renderNoResults() : null;
+    }
+    return createVNode(Container, {
+      "style": style,
+      "class": className
+    }, {
+      "default": function _default() {
+        return [props.title && createVNode(Title, {
+          "class": getClassName(innerClass, 'title') || null
+        }, _isSlot$1(title) ? title : {
+          "default": function _default() {
+            return [title];
+          }
+        }), _this4.renderSearch(), _this4.hasCustomRenderer ? _this4.getComponent() : createVNode(HierarchicalMenuComponent, {
+          "key": "initial-node",
+          "listArray": transformedData,
+          "parentPath": "",
+          "isExpanded": true,
+          "listItemProps": {
+            mode: mode,
+            selectedValues: _this4.selectedValues,
+            searchTerm: _this4.searchTerm,
+            showLine: showLine,
+            renderItem: renderItem != null ? renderItem : _this4.$slots.renderItem,
+            handleListItemClick: _this4.handleListItemClick,
+            showCheckbox: showCheckbox,
+            innerClass: innerClass,
+            showRadio: showRadio,
+            renderIcon: _this4.renderIcon,
+            showCount: showCount,
+            showSwitcherIcon: showSwitcherIcon,
+            switcherIcon: switcherIcon != null ? switcherIcon : _this4.$slots.switcherIcon
+          }
+        }, null)];
+      }
+    });
+  }
+};
+var mapStateToProps = function mapStateToProps(state, props) {
+  return {
+    selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
+    rawData: state.rawData[props.componentId] || {},
+    aggregationData: props.nestedField && state.aggregations[props.componentId] ? state.aggregations[props.componentId].reactivesearch_nested : state.aggregations[props.componentId] || {},
+    themePreset: state.config.themePreset,
+    error: state.error[props.componentId],
+    isLoading: state.isLoading[props.componentId],
+    enableAppbase: state.config.enableAppbase
+  };
+};
+var mapDispatchtoProps = {
+  setQueryOptions: setQueryOptions,
+  updateQueryAction: updateQueryAction
+};
+TreeList.hasInternalComponent = function () {
+  return true;
+};
+var TreeListConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps, mapDispatchtoProps)(TreeList), {
+  componentType: componentTypes.treeList,
+  internalComponent: TreeList.hasInternalComponent()
+}));
+TreeListConnected.name = TreeList.name;
+TreeListConnected.install = function (Vue) {
+  Vue.component(TreeListConnected.name, TreeListConnected);
+};
+
+// Add componentType for SSR
+TreeListConnected.componentType = componentTypes.treeList;
+
+var RcConnected = PreferencesConsumer({
+  name: 'RcConnected',
+  render: function render() {
+    var component = ReactiveComponent;
+    switch (this.$attrs.componentType) {
+      case componentTypes.reactiveList:
+        component = ReactiveList;
+        break;
+      case componentTypes.searchBox:
+        component = SearchBox;
+        break;
+      // list components
+      case componentTypes.singleList:
+        component = SingleList;
+        break;
+      case componentTypes.multiList:
+        component = MultiList;
+        break;
+      case componentTypes.singleDropdownList:
+        component = SingleDropdownList;
+        break;
+      case componentTypes.multiDropdownList:
+        component = MultiDropdownList;
+        break;
+      // basic components
+      case componentTypes.toggleButton:
+        component = ToggleButton;
+        break;
+      // range components
+      case componentTypes.dynamicRangeSlider:
+        component = DynamicRangeSlider;
+        break;
+      case componentTypes.singleRange:
+        component = SingleRange;
+        break;
+      case componentTypes.multiRange:
+        component = MultiRange;
+        break;
+      case componentTypes.rangeSlider:
+        component = RangeSlider;
+        break;
+      case componentTypes.rangeInput:
+        component = RangeInput;
+        break;
+    }
+    return h(component, null, this.$slots);
+  }
+});
+RcConnected.name = ReactiveComponent.name;
+RcConnected.hasInternalComponent = ReactiveComponent.hasInternalComponent;
+// Add componentType for SSR
+RcConnected.componentType = componentTypes.reactiveComponent;
+RcConnected.install = function (Vue) {
+  Vue.component(RcConnected.name, RcConnected);
+};
+
+var components = [ReactiveList, ResultCard, ResultList, ReactiveBase, SearchBox, SingleList, MultiList, SingleRange, MultiRange, RangeSlider, DynamicRangeSlider, ReactiveComponent, RcConnected, SelectedFilters, ToggleButton, SingleDropdownList, MultiDropdownList, StateProvider, RangeInput, TreeListConnected];
+function install (Vue) {
+  components.map(function (component) {
+    Vue.use(component);
+    return null;
+  });
+}
+
+export { RcConnected as R, TreeListConnected as T, install as i };