@appbaseio/reactivesearch-vue 2.0.0-alpha.4 → 3.0.0-alpha.0

package/dist/cjs/MultiList.js

@@ -6,34 +6,36 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var configureStore = require('@appbaseio/reactivecore');
 var configureStore__default = _interopDefault(configureStore);
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-c705cbe6.js');
-var VueTypes = _interopDefault(require('vue-types'));
 var constants = require('@appbaseio/reactivecore/lib/utils/constants');
-require('emotion');
+var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-f8b843f8.js');
+var vue = require('vue');
+var VueTypes = _interopDefault(require('vue-types'));
 require('@appbaseio/vue-emotion');
+require('emotion');
 require('polished');
-var vueTypes = require('./vueTypes-727b7c63.js');
+var vueTypes = require('./vueTypes-1bf00978.js');
 require('@appbaseio/reactivecore/lib/utils/transform');
 require('redux');
-var index = require('./index-6a167fe0.js');
-var ComponentWrapper = require('./ComponentWrapper-ad3dad02.js');
-var Title = require('./Title-1de7d0f4.js');
-var Input = require('./Input-e6603a7e.js');
-var Container = require('./Container-daf30918.js');
+var index = require('./index-d8d8f291.js');
+var ComponentWrapper = require('./ComponentWrapper-75f88599.js');
+var PreferencesConsumer = require('./PreferencesConsumer-eb265924.js');
+var Title = require('./Title-8802a218.js');
+var Input = require('./Input-4b434436.js');
+var Container = require('./Container-29f049b2.js');
 var suggestions = require('@appbaseio/reactivecore/lib/utils/suggestions');
-var FormControlList = require('./FormControlList-c195a592.js');
-var utils = require('./utils-d6a52588.js');
+var FormControlList = require('./FormControlList-fadd792f.js');
+var utils = require('./utils-83fd01e9.js');
 
 var updateQuery = configureStore.Actions.updateQuery,
-    setQueryOptions = configureStore.Actions.setQueryOptions,
-    setCustomQuery = configureStore.Actions.setCustomQuery,
-    setDefaultQuery = configureStore.Actions.setDefaultQuery;
+  setQueryOptions = configureStore.Actions.setQueryOptions,
+  setCustomQuery = configureStore.Actions.setCustomQuery,
+  setDefaultQuery = configureStore.Actions.setDefaultQuery;
 var isEqual = configureStore.helper.isEqual,
-    getQueryOptions = configureStore.helper.getQueryOptions,
-    checkValueChange = configureStore.helper.checkValueChange,
-    getClassName = configureStore.helper.getClassName,
-    extractQueryFromCustomQuery = configureStore.helper.extractQueryFromCustomQuery,
-    getOptionsForCustomQuery = configureStore.helper.getOptionsForCustomQuery;
+  getQueryOptions = configureStore.helper.getQueryOptions,
+  checkValueChange = configureStore.helper.checkValueChange,
+  getClassName = configureStore.helper.getClassName,
+  extractQueryFromCustomQuery = configureStore.helper.extractQueryFromCustomQuery,
+  getOptionsForCustomQuery = configureStore.helper.getOptionsForCustomQuery;
 var MultiList = {
   name: 'MultiList',
   props: {
@@ -81,13 +83,9 @@ var MultiList = {
     return this.__state;
   },
   created: function created() {
-    if (!this.enableAppbase && this.$props.index) {
-      console.warn('Warning(ReactiveSearch): In order to use the `index` prop, the `enableAppbase` prop must be set to true in `ReactiveBase`.');
-    }
-
     var props = this.$props;
-    this.modifiedOptions = this.options && this.options[props.dataField] ? this.options[props.dataField].buckets : []; // Set custom and default queries in store
-
+    this.modifiedOptions = this.options && this.options[props.dataField] ? this.options[props.dataField].buckets : [];
+    // Set custom and default queries in store
     index.updateCustomQuery(this.componentId, this.setCustomQuery, this.$props, this.currentValue);
     index.updateDefaultQuery(this.componentId, this.setDefaultQuery, this.$props, this.currentValue);
   },
@@ -98,7 +96,6 @@ var MultiList = {
   },
   mounted: function mounted() {
     var currentValue = Object.keys(this.$data.currentValue);
-
     if (this.$props.value !== undefined && !isEqual(this.$props.value, currentValue)) {
       this.$emit('change', currentValue);
     }
@@ -131,19 +128,15 @@ var MultiList = {
     },
     selectedValue: function selectedValue(newVal) {
       var _this = this;
-
       var selectedValue = Object.keys(this.$data.currentValue);
-
       if (this.$props.selectAllLabel) {
         selectedValue = selectedValue.filter(function (val) {
           return val !== _this.$props.selectAllLabel;
         });
-
         if (this.$data.currentValue[this.$props.selectAllLabel]) {
           selectedValue = [this.$props.selectAllLabel];
         }
       }
-
       if (!isEqual(selectedValue, newVal)) {
         if (this.value === undefined) {
           this.setValue(newVal, true);
@@ -165,19 +158,15 @@ var MultiList = {
   },
   render: function render() {
     var _this2 = this;
-
-    var h = arguments[0];
     var _this$$props = this.$props,
-        selectAllLabel = _this$$props.selectAllLabel,
-        renderItem = _this$$props.renderItem,
-        renderError = _this$$props.renderError;
-    var renderItemCalc = this.$scopedSlots.renderItem || renderItem;
-    var renderErrorCalc = this.$scopedSlots.renderError || renderError;
-
+      selectAllLabel = _this$$props.selectAllLabel,
+      renderItem = _this$$props.renderItem,
+      renderError = _this$$props.renderError;
+    var renderItemCalc = this.$slots.renderItem || renderItem;
+    var renderErrorCalc = this.$slots.renderError || renderError;
     if (renderErrorCalc && this.error) {
       return index.isFunction(renderErrorCalc) ? renderErrorCalc(this.error) : renderErrorCalc;
     }
-
     if (!this.hasCustomRenderer && this.modifiedOptions.length === 0 && !this.isLoading) {
       if (this.renderNoResult) {
         this.renderNoResult();
@@ -185,102 +174,89 @@ var MultiList = {
         return null;
       }
     }
-
     var itemsToRender = this.$data.modifiedOptions;
-
     if (this.$props.transformData) {
       itemsToRender = this.$props.transformData(itemsToRender);
     }
-
     var filteredItemsToRender = itemsToRender.filter(function (item) {
       if (String(item.key).length) {
         if (_this2.$props.showSearch && _this2.$data.searchTerm) {
           return suggestions.replaceDiacritics(String(item.key)).toLowerCase().includes(suggestions.replaceDiacritics(_this2.$data.searchTerm).toLowerCase());
         }
-
         return true;
       }
-
       return false;
     });
-    return h(Container.Container, {
+    return vue.createVNode(Container.Container, {
       "class": this.$props.className
-    }, [this.$props.title && h(Title.Title, {
-      "class": getClassName(this.$props.innerClass, 'title')
-    }, [this.$props.title]), this.renderSearch(), this.hasCustomRenderer ? this.getComponent() : h(FormControlList.UL, {
-      "class": getClassName(this.$props.innerClass, 'list')
-    }, [selectAllLabel ? h("li", {
-      "key": selectAllLabel,
-      "class": "" + (this.currentValue[selectAllLabel] ? 'active' : '')
-    }, [h(FormControlList.Checkbox, {
-      "attrs": {
-        "type": "checkbox",
-        "id": this.$props.componentId + "-" + selectAllLabel,
-        "name": selectAllLabel,
-        "value": selectAllLabel,
-        "show": this.$props.showCheckbox
-      },
-      "class": getClassName(this.$props.innerClass, 'checkbox'),
-      "on": {
-        "click": this.handleClick
-      },
-      "domProps": _rollupPluginBabelHelpers._extends({}, {
-        checked: !!this.currentValue[selectAllLabel]
-      })
-    }), h("label", {
-      "class": getClassName(this.$props.innerClass, 'label'),
-      "attrs": {
-        "for": this.$props.componentId + "-" + selectAllLabel
+    }, {
+      "default": function _default() {
+        return [_this2.$props.title && vue.createVNode(Title.Title, {
+          "class": getClassName(_this2.$props.innerClass, 'title')
+        }, {
+          "default": function _default() {
+            return [_this2.$props.title];
+          }
+        }), _this2.renderSearch(), _this2.hasCustomRenderer ? _this2.getComponent() : vue.createVNode(FormControlList.UL, null, {
+          "default": function _default() {
+            return [selectAllLabel ? vue.createVNode("li", {
+              "key": selectAllLabel,
+              "class": "" + (_this2.currentValue[selectAllLabel] ? 'active' : '')
+            }, [vue.createVNode(FormControlList.Checkbox, {
+              "type": "checkbox",
+              "class": getClassName(_this2.$props.innerClass, 'checkbox'),
+              "id": _this2.$props.componentId + "-" + selectAllLabel,
+              "name": selectAllLabel,
+              "value": selectAllLabel,
+              "onClick": _this2.handleClick,
+              "checked": !!_this2.currentValue[selectAllLabel],
+              "show": _this2.$props.showCheckbox
+            }, null), vue.createVNode("label", {
+              "class": getClassName(_this2.$props.innerClass, 'label'),
+              "for": _this2.$props.componentId + "-" + selectAllLabel
+            }, [vue.createVNode("span", null, [selectAllLabel, _this2.$props.showCount && vue.createVNode("span", {
+              "class": getClassName(_this2.$props.innerClass, 'count')
+            }, [vue.createTextVNode("\xA0("), _this2.totalDocumentCount, vue.createTextVNode(")")])])])]) : null, !_this2.hasCustomRenderer && filteredItemsToRender.length === 0 && !_this2.isLoading ? _this2.renderNoResult() : filteredItemsToRender.map(function (item) {
+              return vue.createVNode("li", {
+                "key": item.key,
+                "class": "" + (_this2.$data.currentValue[item.key] ? 'active' : '')
+              }, [vue.createVNode(FormControlList.Checkbox, {
+                "type": "checkbox",
+                "class": getClassName(_this2.$props.innerClass, 'checkbox'),
+                "id": _this2.$props.componentId + "-" + item.key,
+                "name": _this2.$props.componentId,
+                "value": item.key,
+                "onClick": _this2.handleClick,
+                "show": _this2.$props.showCheckbox,
+                "checked": !!_this2.$data.currentValue[item.key]
+              }, null), vue.createVNode("label", {
+                "class": getClassName(_this2.$props.innerClass, 'label'),
+                "for": _this2.$props.componentId + "-" + item.key
+              }, [renderItemCalc ? renderItemCalc({
+                label: item.key,
+                count: item.doc_count,
+                isChecked: !!_this2.$data.currentValue[item.key]
+              }) : vue.createVNode("span", null, [item.key, _this2.$props.showCount && vue.createVNode("span", {
+                "class": getClassName(_this2.$props.innerClass, 'count')
+              }, [vue.createTextVNode("\xA0("), item.doc_count, vue.createTextVNode(")")])])])]);
+            })];
+          }
+        })];
       }
-    }, [selectAllLabel])]) : null, !this.hasCustomRenderer && filteredItemsToRender.length === 0 && !this.isLoading ? this.renderNoResult() : filteredItemsToRender.map(function (item) {
-      return h("li", {
-        "key": item.key,
-        "class": "" + (_this2.$data.currentValue[item.key] ? 'active' : '')
-      }, [h(FormControlList.Checkbox, {
-        "attrs": {
-          "type": "checkbox",
-          "id": _this2.$props.componentId + "-" + item.key,
-          "name": _this2.$props.componentId,
-          "value": item.key,
-          "show": _this2.$props.showCheckbox
-        },
-        "class": getClassName(_this2.$props.innerClass, 'checkbox'),
-        "on": {
-          "click": _this2.handleClick
-        },
-        "domProps": _rollupPluginBabelHelpers._extends({}, {
-          checked: !!_this2.$data.currentValue[item.key]
-        })
-      }), h("label", {
-        "class": getClassName(_this2.$props.innerClass, 'label'),
-        "attrs": {
-          "for": _this2.$props.componentId + "-" + item.key
-        }
-      }, [renderItemCalc ? renderItemCalc({
-        label: item.key,
-        count: item.doc_count,
-        isChecked: !!_this2.$data.currentValue[item.key]
-      }) : h("span", [item.key, _this2.$props.showCount && h("span", {
-        "class": getClassName(_this2.$props.innerClass, 'count')
-      }, ["\xA0(", item.doc_count, ")"])])])]);
-    })])]);
+    });
   },
   methods: {
     setValue: function setValue(value, isDefaultValue, props) {
       var _this3 = this;
-
       if (isDefaultValue === void 0) {
         isDefaultValue = false;
       }
-
       if (props === void 0) {
         props = this.$props;
       }
-
       var selectAllLabel = this.$props.selectAllLabel;
       var currentValue = this.$data.currentValue;
       var finalValues = null;
-
       if (selectAllLabel && (Array.isArray(value) && value.includes(selectAllLabel) || typeof value === 'string' && value === selectAllLabel)) {
         if (currentValue[selectAllLabel]) {
           currentValue = {};
@@ -295,26 +271,22 @@ var MultiList = {
       } else if (isDefaultValue) {
         finalValues = value;
         currentValue = {};
-
         if (value && value.length) {
           value.forEach(function (item) {
             currentValue[item] = true;
           });
         }
-
         if (selectAllLabel && selectAllLabel in currentValue) {
           var _currentValue = currentValue,
-              del = _currentValue[selectAllLabel],
-              obj = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_currentValue, [selectAllLabel].map(_rollupPluginBabelHelpers._toPropertyKey));
-
+            del = _currentValue[selectAllLabel],
+            obj = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_currentValue, [selectAllLabel].map(_rollupPluginBabelHelpers._toPropertyKey));
           currentValue = _rollupPluginBabelHelpers._extends({}, obj);
         }
       } else {
         if (currentValue[value]) {
           var _currentValue2 = currentValue,
-              _del = _currentValue2[value],
-              rest = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_currentValue2, [value].map(_rollupPluginBabelHelpers._toPropertyKey));
-
+            _del = _currentValue2[value],
+            rest = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_currentValue2, [value].map(_rollupPluginBabelHelpers._toPropertyKey));
           currentValue = _rollupPluginBabelHelpers._extends({}, rest);
         } else if (Array.isArray(value)) {
           value.forEach(function (val) {
@@ -323,47 +295,36 @@ var MultiList = {
         } else {
           currentValue[value] = true;
         }
-
         if (selectAllLabel && selectAllLabel in currentValue) {
           var _currentValue3 = currentValue,
-              _del2 = _currentValue3[selectAllLabel],
-              _obj = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_currentValue3, [selectAllLabel].map(_rollupPluginBabelHelpers._toPropertyKey));
-
+            _del2 = _currentValue3[selectAllLabel],
+            _obj = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(_currentValue3, [selectAllLabel].map(_rollupPluginBabelHelpers._toPropertyKey));
           currentValue = _rollupPluginBabelHelpers._extends({}, _obj);
         }
-
         finalValues = Object.keys(currentValue);
       }
-
       var performUpdate = function performUpdate() {
         _this3.currentValue = Object.assign({}, currentValue);
-
         _this3.updateQueryHandler(finalValues, props);
-
         _this3.$emit('valueChange', finalValues);
-
         _this3.$emit('value-change', finalValues);
       };
-
       checkValueChange(props.componentId, finalValues, props.beforeValueChange, performUpdate);
     },
     updateDefaultQueryHandler: function updateDefaultQueryHandler(value, props) {
       var query = MultiList.defaultQuery(value, props);
-
       if (this.defaultQuery) {
         var defaultQueryToBeSet = this.defaultQuery(value, props) || {};
         var defaultQueryObj = extractQueryFromCustomQuery(defaultQueryToBeSet);
-
         if (defaultQueryObj) {
           query = defaultQueryObj;
-        } // Update calculated default query in store
-
+        }
 
+        // Update calculated default query in store
         index.updateDefaultQuery(props.componentId, this.setDefaultQuery, props, value);
         var defaultQueryOptions = getOptionsForCustomQuery(defaultQueryToBeSet);
         this.setQueryOptions(this.internalComponent, defaultQueryOptions, false);
       }
-
       this.updateQuery({
         componentId: this.internalComponent,
         query: query,
@@ -374,7 +335,6 @@ var MultiList = {
     updateQueryHandler: function updateQueryHandler(value, props) {
       var customQuery = props.customQuery;
       var query = MultiList.defaultQuery(value, props);
-
       if (customQuery) {
         var customQueryCalc = customQuery(value, props);
         query = extractQueryFromCustomQuery(customQueryCalc);
@@ -382,7 +342,6 @@ var MultiList = {
         var customQueryOptions = getOptionsForCustomQuery(customQueryCalc);
         this.setQueryOptions(props.componentId, customQueryOptions, false);
       }
-
       this.updateQuery({
         componentId: props.componentId,
         query: query,
@@ -399,7 +358,6 @@ var MultiList = {
     },
     updateQueryHandlerOptions: function updateQueryHandlerOptions(props) {
       var queryOptions = MultiList.generateQueryOptions(props);
-
       if (props.defaultQuery) {
         var value = Object.keys(this.$data.currentValue);
         var defaultQueryOptions = getOptionsForCustomQuery(props.defaultQuery(value, props));
@@ -413,36 +371,26 @@ var MultiList = {
       this.searchTerm = value;
     },
     renderSearch: function renderSearch() {
-      var h = this.$createElement;
-
       if (this.$props.showSearch) {
-        return h(Input.Input, {
+        return vue.createVNode(Input.Input, {
           "class": getClassName(this.$props.innerClass, 'input') || '',
-          "on": {
-            "input": this.handleInputChange
-          },
-          "attrs": {
-            "value": this.$data.searchTerm,
-            "placeholder": this.$props.placeholder,
-            "themePreset": this.$props.themePreset
-          },
+          "onInput": this.handleInputChange,
+          "value": this.$data.searchTerm,
+          "placeholder": this.$props.placeholder,
           "style": {
             margin: '0 0 8px'
-          }
-        });
+          },
+          "themePreset": this.$props.themePreset
+        }, null);
       }
-
       return null;
     },
     handleClick: function handleClick(e) {
       var currentValue = e;
-
       if (index.isEvent(e)) {
         currentValue = e.target.value;
       }
-
       var value = this.$props.value;
-
       if (value === undefined) {
         this.setValue(currentValue);
       } else {
@@ -452,15 +400,13 @@ var MultiList = {
     },
     getComponent: function getComponent() {
       var _this$$data = this.$data,
-          currentValue = _this$$data.currentValue,
-          modifiedOptions = _this$$data.modifiedOptions;
+        currentValue = _this$$data.currentValue,
+        modifiedOptions = _this$$data.modifiedOptions;
       var transformData = this.$props.transformData;
       var itemsToRender = modifiedOptions;
-
       if (transformData) {
         itemsToRender = transformData(itemsToRender);
       }
-
       var data = {
         error: this.error,
         loading: this.isLoading,
@@ -472,9 +418,8 @@ var MultiList = {
       return index.getComponent(data, this);
     },
     renderNoResult: function renderNoResult() {
-      var h = this.$createElement;
-      var renderNoResults = this.$scopedSlots.renderNoResults || this.$props.renderNoResults;
-      return h("p", {
+      var renderNoResults = this.$slots.renderNoResults || this.$props.renderNoResults;
+      return vue.createVNode("p", {
         "class": getClassName(this.$props.innerClass, 'noResults') || null
       }, [index.isFunction(renderNoResults) ? renderNoResults() : renderNoResults]);
     }
@@ -485,103 +430,22 @@ var MultiList = {
     }
   }
 };
-
 MultiList.defaultQuery = function (value, props) {
-  var query = null;
-  var queryFormat = props.queryFormat;
-
-  if (queryFormat === undefined) {
-    queryFormat = 'or';
-  }
-
-  var type = queryFormat === 'or' ? 'terms' : 'term';
-
-  if (!Array.isArray(value) || value.length === 0) {
-    return null;
-  }
-
-  if (props.selectAllLabel && value.includes(props.selectAllLabel)) {
-    if (props.showMissing) {
-      query = {
-        match_all: {}
-      };
-    } else {
-      query = {
-        exists: {
-          field: props.dataField
-        }
-      };
-    }
-  } else if (value) {
-    var listQuery;
-
-    if (queryFormat === 'or') {
-      if (props.showMissing) {
-        var _type, _ref;
-
-        var hasMissingTerm = value.includes(props.missingLabel);
-        var should = [(_ref = {}, _ref[type] = (_type = {}, _type[props.dataField] = value.filter(function (item) {
-          return item !== props.missingLabel;
-        }), _type), _ref)];
-
-        if (hasMissingTerm) {
-          should = should.concat({
-            bool: {
-              must_not: {
-                exists: {
-                  field: props.dataField
-                }
-              }
-            }
-          });
-        }
-
-        listQuery = {
-          bool: {
-            should: should
-          }
-        };
-      } else {
-        var _type2, _listQuery;
-
-        listQuery = (_listQuery = {}, _listQuery[type] = (_type2 = {}, _type2[props.dataField] = value, _type2), _listQuery);
-      }
-    } else {
-      // adds a sub-query with must as an array of objects for each term/value
-      var queryArray = value.map(function (item) {
-        var _type3, _ref2;
-
-        return _ref2 = {}, _ref2[type] = (_type3 = {}, _type3[props.dataField] = item, _type3), _ref2;
-      });
-      listQuery = {
-        bool: {
-          must: queryArray
-        }
-      };
+  return {
+    query: {
+      queryFormat: props.queryFormat,
+      dataField: props.dataField,
+      value: value,
+      nestedField: props.nestedField,
+      selectAllLabel: props.selectAllLabel,
+      showMissing: props.showMissing
     }
-
-    query = value.length ? listQuery : null;
-  }
-
-  if (query && props.nestedField) {
-    query = {
-      query: {
-        nested: {
-          path: props.nestedField,
-          query: query
-        }
-      }
-    };
-  }
-
-  return query;
+  };
 };
-
 MultiList.generateQueryOptions = function (props) {
   var queryOptions = getQueryOptions(props);
   return utils.getAggsQuery(queryOptions, props);
 };
-
 var mapStateToProps = function mapStateToProps(state, props) {
   return {
     options: props.nestedField && state.aggregations[props.componentId] ? state.aggregations[props.componentId].reactivesearch_nested : state.aggregations[props.componentId],
@@ -589,33 +453,31 @@ var mapStateToProps = function mapStateToProps(state, props) {
     isLoading: state.isLoading[props.componentId],
     selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
     themePreset: state.config.themePreset,
+    totalDocumentCount: state.hits[props.componentId] && state.hits[props.componentId].total,
     error: state.error[props.componentId],
-    componentProps: state.props[props.componentId],
-    enableAppbase: state.config.enableAppbase
+    componentProps: state.props[props.componentId]
   };
 };
-
 var mapDispatchtoProps = {
   setQueryOptions: setQueryOptions,
   updateQuery: updateQuery,
   setCustomQuery: setCustomQuery,
   setDefaultQuery: setDefaultQuery
 };
-
 MultiList.hasInternalComponent = function () {
   return true;
 };
-
-var ListConnected = ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps, mapDispatchtoProps)(MultiList), {
+var ListConnected = PreferencesConsumer.PreferencesConsumer(ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps, mapDispatchtoProps)(MultiList), {
   componentType: constants.componentTypes.multiList,
   internalComponent: MultiList.hasInternalComponent()
-});
-
-MultiList.install = function (Vue) {
-  Vue.component(MultiList.name, ListConnected);
-}; // Add componentType for SSR
-
+}));
+ListConnected.name = MultiList.name;
+ListConnected.install = function (Vue) {
+  Vue.component(ListConnected.name, ListConnected);
+};
 
-MultiList.componentType = constants.componentTypes.multiList;
+// Add componentType for SSR
+ListConnected.componentType = constants.componentTypes.multiList;
 
-exports.default = MultiList;
+exports.ListConnected = ListConnected;
+exports.default = ListConnected;