@cubejs-client/vue3 0.30.46 → 0.30.64

package/dist/cubejs-client-vue3.esm.js

@@ -1,45 +1,13 @@
 import { isQueryPresent, areQueriesEqual, GRANULARITIES, ResultSet, moveItemInArray, movePivotItem, getOrderMembersFromOrder, defaultHeuristics, defaultOrder } from '@cubejs-client/core';
 export { GRANULARITIES } from '@cubejs-client/core';
-import 'core-js/modules/es.object.keys.js';
-import 'core-js/modules/es.symbol.js';
-import 'core-js/modules/es.array.filter.js';
-import 'core-js/modules/es.object.get-own-property-descriptor.js';
-import 'core-js/modules/es.array.for-each.js';
-import 'core-js/modules/web.dom-collections.for-each.js';
-import 'core-js/modules/es.object.get-own-property-descriptors.js';
-import 'core-js/modules/es.object.define-properties.js';
-import 'core-js/modules/es.object.define-property.js';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
-import 'core-js/modules/es.array.iterator.js';
-import 'core-js/modules/es.object.to-string.js';
-import 'core-js/modules/es.promise.js';
-import 'core-js/modules/es.string.iterator.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
-import 'core-js/modules/es.array.map.js';
-import _regeneratorRuntime from '@babel/runtime/regenerator';
 import { toPairs, fromPairs, clone, equals } from 'ramda';
 import { h } from 'vue';
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import 'core-js/modules/es.function.name.js';
-import 'core-js/modules/es.array.reduce.js';
-import 'core-js/modules/es.array.concat.js';
-import 'core-js/modules/es.array.slice.js';
-import 'core-js/modules/es.array.find.js';
-import 'core-js/modules/es.array.find-index.js';
-import 'core-js/modules/es.array.splice.js';
-
-function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 var QueryRenderer = {
   props: {
     query: {
       type: [Object, Array],
-      "default": function _default() {
-        return {};
-      }
+      default: () => ({})
     },
     // TODO: validate with current react implementation
     queries: {
@@ -55,16 +23,15 @@ var QueryRenderer = {
     builderProps: {
       type: Object,
       required: false,
-      "default": function _default() {
-        return {};
-      }
+      default: () => ({})
     },
     chartType: {
       type: String,
       required: false
     }
   },
-  data: function data() {
+
+  data() {
     return {
       mutexObj: {},
       error: undefined,
@@ -73,236 +40,134 @@ var QueryRenderer = {
       sqlQuery: undefined
     };
   },
-  mounted: function mounted() {
-    var _this = this;
-
-    return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var query, queries;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              query = _this.query, queries = _this.queries;
-
-              if (!isQueryPresent(query)) {
-                _context.next = 6;
-                break;
-              }
-
-              _context.next = 4;
-              return _this.load();
-
-            case 4:
-              _context.next = 9;
-              break;
-
-            case 6:
-              if (!isQueryPresent(queries)) {
-                _context.next = 9;
-                break;
-              }
-
-              _context.next = 9;
-              return _this.loadQueries(queries);
-
-            case 9:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }))();
+
+  async mounted() {
+    const {
+      query,
+      queries
+    } = this;
+
+    if (isQueryPresent(query)) {
+      await this.load();
+    } else if (isQueryPresent(queries)) {
+      await this.loadQueries(queries);
+    }
   },
-  render: function render() {
-    var $slots = this.$slots,
-        resultSet = this.resultSet,
-        error = this.error,
-        loading = this.loading,
-        sqlQuery = this.sqlQuery;
-    var empty = h('div', {});
-    var slot = this.$slots.empty ? this.$slots.empty() : empty;
-    var controls = h('div', {});
-    var onlyDefault = !('empty' in this.$slots) && !('error' in this.$slots);
+
+  render() {
+    const {
+      $slots,
+      resultSet,
+      error,
+      loading,
+      sqlQuery
+    } = this;
+    const empty = h('div', {});
+    let slot = this.$slots.empty ? this.$slots.empty() : empty;
+    let controls = h('div', {});
+    const onlyDefault = !('empty' in this.$slots) && !('error' in this.$slots);
 
     if ($slots.builder && this.builderProps.measures) {
-      controls = $slots.builder(_objectSpread$1({}, this.builderProps));
+      controls = $slots.builder({ ...this.builderProps
+      });
     }
 
     if (!loading && resultSet && !error || onlyDefault) {
-      var slotProps = {
-        resultSet: resultSet,
-        sqlQuery: sqlQuery,
+      let slotProps = {
+        resultSet,
+        sqlQuery,
         query: this.builderProps.query || this.query
       };
 
       if (onlyDefault) {
-        slotProps = _objectSpread$1(_objectSpread$1({
-          loading: loading,
-          error: error,
-          refetch: this.load
-        }, this.builderProps), slotProps);
+        slotProps = {
+          loading,
+          error,
+          refetch: this.load,
+          ...this.builderProps,
+          ...slotProps
+        };
       }
 
-      slot = $slots["default"] ? $slots["default"](slotProps) : slot;
+      slot = $slots.default ? $slots.default(slotProps) : slot;
     } else if (error) {
       slot = $slots.error ? $slots.error({
-        error: error,
-        sqlQuery: sqlQuery
+        error,
+        sqlQuery
       }) : slot;
     }
 
     return h('div', {}, [controls, slot]);
   },
+
   methods: {
-    load: function load() {
-      var _this2 = this;
-
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-        var query;
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                query = _this2.query;
-
-                if (isQueryPresent(query)) {
-                  _context2.next = 3;
-                  break;
-                }
-
-                return _context2.abrupt("return");
-
-              case 3:
-                _context2.prev = 3;
-                _this2.loading = true;
-                _this2.error = null;
-                _this2.resultSet = null;
-
-                if (!(_this2.loadSql === 'only')) {
-                  _context2.next = 13;
-                  break;
-                }
-
-                _context2.next = 10;
-                return _this2.cubejsApi.sql(query, {
-                  mutexObj: _this2.mutexObj,
-                  mutexKey: 'sql'
-                });
-
-              case 10:
-                _this2.sqlQuery = _context2.sent;
-                _context2.next = 25;
-                break;
-
-              case 13:
-                if (!_this2.loadSql) {
-                  _context2.next = 22;
-                  break;
-                }
-
-                _context2.next = 16;
-                return _this2.cubejsApi.sql(query, {
-                  mutexObj: _this2.mutexObj,
-                  mutexKey: 'sql'
-                });
-
-              case 16:
-                _this2.sqlQuery = _context2.sent;
-                _context2.next = 19;
-                return _this2.cubejsApi.load(query, {
-                  mutexObj: _this2.mutexObj,
-                  mutexKey: 'query'
-                });
-
-              case 19:
-                _this2.resultSet = _context2.sent;
-                _context2.next = 25;
-                break;
-
-              case 22:
-                _context2.next = 24;
-                return _this2.cubejsApi.load(query, {
-                  mutexObj: _this2.mutexObj,
-                  mutexKey: 'query'
-                });
-
-              case 24:
-                _this2.resultSet = _context2.sent;
-
-              case 25:
-                _this2.loading = false;
-                _context2.next = 33;
-                break;
-
-              case 28:
-                _context2.prev = 28;
-                _context2.t0 = _context2["catch"](3);
-                _this2.error = _context2.t0;
-                _this2.resultSet = undefined;
-                _this2.loading = false;
-
-              case 33:
-              case "end":
-                return _context2.stop();
-            }
-          }
-        }, _callee2, null, [[3, 28]]);
-      }))();
-    },
-    loadQueries: function loadQueries() {
-      var _this3 = this;
-
-      return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-        var queries, resultPromises;
-        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-          while (1) {
-            switch (_context3.prev = _context3.next) {
-              case 0:
-                queries = _this3.queries;
-                _context3.prev = 1;
-                _this3.error = undefined;
-                _this3.loading = true;
-                resultPromises = Promise.all(toPairs(queries).map(function (_ref) {
-                  var _ref2 = _slicedToArray(_ref, 2),
-                      name = _ref2[0],
-                      query = _ref2[1];
-
-                  return _this3.cubejsApi.load(query, {
-                    mutexObj: _this3.mutexObj,
-                    mutexKey: name
-                  }).then(function (r) {
-                    return [name, r];
-                  });
-                }));
-                _context3.t0 = fromPairs;
-                _context3.next = 8;
-                return resultPromises;
-
-              case 8:
-                _context3.t1 = _context3.sent;
-                _this3.resultSet = (0, _context3.t0)(_context3.t1);
-                _this3.loading = false;
-                _context3.next = 17;
-                break;
-
-              case 13:
-                _context3.prev = 13;
-                _context3.t2 = _context3["catch"](1);
-                _this3.error = _context3.t2;
-                _this3.loading = false;
-
-              case 17:
-              case "end":
-                return _context3.stop();
-            }
-          }
-        }, _callee3, null, [[1, 13]]);
-      }))();
+    async load() {
+      const {
+        query
+      } = this;
+
+      if (!isQueryPresent(query)) {
+        return;
+      }
+
+      try {
+        this.loading = true;
+        this.error = null;
+        this.resultSet = null;
+
+        if (this.loadSql === 'only') {
+          this.sqlQuery = await this.cubejsApi.sql(query, {
+            mutexObj: this.mutexObj,
+            mutexKey: 'sql'
+          });
+        } else if (this.loadSql) {
+          this.sqlQuery = await this.cubejsApi.sql(query, {
+            mutexObj: this.mutexObj,
+            mutexKey: 'sql'
+          });
+          this.resultSet = await this.cubejsApi.load(query, {
+            mutexObj: this.mutexObj,
+            mutexKey: 'query'
+          });
+        } else {
+          this.resultSet = await this.cubejsApi.load(query, {
+            mutexObj: this.mutexObj,
+            mutexKey: 'query'
+          });
+        }
+
+        this.loading = false;
+      } catch (error) {
+        this.error = error;
+        this.resultSet = undefined;
+        this.loading = false;
+      }
+    },
+
+    async loadQueries() {
+      const {
+        queries
+      } = this;
+
+      try {
+        this.error = undefined;
+        this.loading = true;
+        const resultPromises = Promise.all(toPairs(queries).map(([name, query]) => this.cubejsApi.load(query, {
+          mutexObj: this.mutexObj,
+          mutexKey: name
+        }).then(r => [name, r])));
+        this.resultSet = fromPairs(await resultPromises);
+        this.loading = false;
+      } catch (error) {
+        this.error = error;
+        this.loading = false;
+      }
     }
+
   },
   watch: {
-    loading: function loading(_loading) {
-      if (_loading === false) {
+    loading(loading) {
+      if (loading === false) {
         this.$emit('queryStatus', {
           isLoading: false,
           error: this.error,
@@ -314,61 +179,98 @@ var QueryRenderer = {
         });
       }
     },
-    cubejsApi: function cubejsApi() {
+
+    cubejsApi() {
       this.load();
     },
-    chartType: function chartType() {
+
+    chartType() {
       this.load();
     },
+
     query: {
       deep: true,
-      handler: function handler(query, prevQuery) {
+
+      handler(query, prevQuery) {
         if (!areQueriesEqual(query, prevQuery)) {
           this.load();
         }
       }
+
     },
     queries: {
-      handler: function handler(val) {
+      handler(val) {
         if (val) {
           this.loadQueries();
         }
       },
+
       deep: true
     }
   }
 };
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+const QUERY_ELEMENTS = ['measures', 'dimensions', 'segments', 'timeDimensions', 'filters'];
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var QUERY_ELEMENTS = ['measures', 'dimensions', 'segments', 'timeDimensions', 'filters'];
+const toOrderMember = member => ({
+  id: member.name,
+  title: member.title
+});
 
-var toOrderMember = function toOrderMember(member) {
-  return {
-    id: member.name,
-    title: member.title
-  };
-};
+const reduceOrderMembers = array => array.reduce((acc, {
+  id,
+  order
+}) => order !== 'none' ? [...acc, [id, order]] : acc, []);
+
+const operators = ['and', 'or'];
+
+const validateFilters = filters => filters.reduce((acc, raw) => {
+  if (raw.operator) {
+    return [...acc, raw];
+  }
+
+  const validBooleanFilter = operators.reduce((acc, operator) => {
+    const filters = raw[operator];
+    const booleanFilters = validateFilters(filters || []);
+
+    if (booleanFilters.length) {
+      return { ...acc,
+        [operator]: booleanFilters
+      };
+    }
+
+    return acc;
+  }, {});
+
+  if (operators.some(operator => validBooleanFilter[operator])) {
+    return [...acc, validBooleanFilter];
+  }
 
-var reduceOrderMembers = function reduceOrderMembers(array) {
-  return array.reduce(function (acc, _ref) {
-    var id = _ref.id,
-        order = _ref.order;
-    return order !== 'none' ? [].concat(_toConsumableArray(acc), [[id, order]]) : acc;
-  }, []);
+  return acc;
+}, []);
+
+const getDimensionOrMeasure = (meta, m) => {
+  const memberName = m.member || m.dimension;
+  return memberName && meta.resolveMember(memberName, ['dimensions', 'measures']);
 };
 
+const resolveMembers = (meta, arr) => arr && arr.map((e, index) => {
+  return { ...e,
+    member: getDimensionOrMeasure(meta, e),
+    index,
+    and: resolveMembers(meta, e.and),
+    or: resolveMembers(meta, e.or)
+  };
+});
+
 var QueryBuilder = {
   components: {
-    QueryRenderer: QueryRenderer
+    QueryRenderer
   },
   props: {
     query: {
       type: Object,
-      "default": function _default() {
-        return {};
-      }
+      default: () => ({})
     },
     cubejsApi: {
       type: Object,
@@ -376,9 +278,7 @@ var QueryBuilder = {
     },
     initialChartType: {
       type: String,
-      "default": function _default() {
-        return 'line';
-      }
+      default: () => 'line'
     },
     disableHeuristics: {
       type: Boolean
@@ -388,24 +288,22 @@ var QueryBuilder = {
     },
     initialVizState: {
       type: Object,
-      "default": function _default() {
-        return {};
-      }
+      default: () => ({})
     }
   },
-  data: function data() {
-    var _this$initialVizState = this.initialVizState,
-        _this$initialVizState2 = _this$initialVizState.query,
-        query = _this$initialVizState2 === void 0 ? this.query : _this$initialVizState2,
-        _this$initialVizState3 = _this$initialVizState.chartType,
-        chartType = _this$initialVizState3 === void 0 ? this.initialChartType : _this$initialVizState3,
-        pivotConfig = _this$initialVizState.pivotConfig;
+
+  data() {
+    const {
+      query = this.query,
+      chartType = this.initialChartType,
+      pivotConfig
+    } = this.initialVizState;
     return {
       initialQuery: query,
       skipHeuristics: true,
       meta: undefined,
       mutex: {},
-      chartType: chartType,
+      chartType,
       measures: [],
       dimensions: [],
       segments: [],
@@ -424,199 +322,193 @@ var QueryBuilder = {
       pivotConfig: ResultSet.getNormalizedPivotConfig(query || {}, pivotConfig)
     };
   },
-  render: function render() {
-    var _this = this;
-
-    var chartType = this.chartType,
-        cubejsApi = this.cubejsApi,
-        dimensions = this.dimensions,
-        filters = this.filters,
-        measures = this.measures,
-        meta = this.meta,
-        query = this.query,
-        segments = this.segments,
-        timeDimensions = this.timeDimensions,
-        validatedQuery = this.validatedQuery,
-        isQueryPresent = this.isQueryPresent,
-        availableSegments = this.availableSegments,
-        availableTimeDimensions = this.availableTimeDimensions,
-        availableDimensions = this.availableDimensions,
-        availableMeasures = this.availableMeasures,
-        limit = this.limit,
-        offset = this.offset,
-        setLimit = this.setLimit,
-        removeLimit = this.removeLimit,
-        setOffset = this.setOffset,
-        removeOffset = this.removeOffset,
-        renewQuery = this.renewQuery,
-        order = this.order,
-        orderMembers = this.orderMembers;
-    var builderProps = {};
+
+  render() {
+    const {
+      chartType,
+      cubejsApi,
+      dimensions,
+      filters,
+      measures,
+      meta,
+      query,
+      segments,
+      timeDimensions,
+      validatedQuery,
+      isQueryPresent,
+      availableSegments,
+      availableTimeDimensions,
+      availableDimensions,
+      availableMeasures,
+      limit,
+      offset,
+      setLimit,
+      removeLimit,
+      setOffset,
+      removeOffset,
+      renewQuery,
+      order,
+      orderMembers
+    } = this;
+    let builderProps = {};
 
     if (meta) {
       builderProps = {
-        query: query,
-        validatedQuery: validatedQuery,
-        isQueryPresent: isQueryPresent,
-        chartType: chartType,
-        measures: measures,
-        dimensions: dimensions,
-        segments: segments,
-        timeDimensions: timeDimensions,
-        filters: filters,
-        availableSegments: availableSegments,
-        availableTimeDimensions: availableTimeDimensions,
-        availableDimensions: availableDimensions,
-        availableMeasures: availableMeasures,
+        query,
+        validatedQuery,
+        isQueryPresent,
+        chartType,
+        measures,
+        dimensions,
+        segments,
+        timeDimensions,
+        filters,
+        availableSegments,
+        availableTimeDimensions,
+        availableDimensions,
+        availableMeasures,
         updateChartType: this.updateChart,
-        limit: limit,
-        offset: offset,
-        setLimit: setLimit,
-        removeLimit: removeLimit,
-        setOffset: setOffset,
-        removeOffset: removeOffset,
-        renewQuery: renewQuery,
-        order: order,
-        orderMembers: orderMembers,
+        limit,
+        offset,
+        setLimit,
+        removeLimit,
+        setOffset,
+        removeOffset,
+        renewQuery,
+        order,
+        orderMembers,
         setOrder: this.setOrder,
-        setQuery: this.setQuery,
         pivotConfig: this.pivotConfig,
         updateOrder: {
-          set: function set(memberId, newOrder) {
-            _this.order = reduceOrderMembers(orderMembers.map(function (orderMember) {
-              return _objectSpread(_objectSpread({}, orderMember), {}, {
-                order: orderMember.id === memberId ? newOrder : orderMember.order
-              });
-            }));
+          set: (memberId, newOrder) => {
+            this.order = reduceOrderMembers(orderMembers.map(orderMember => ({ ...orderMember,
+              order: orderMember.id === memberId ? newOrder : orderMember.order
+            })));
           },
-          update: function update(newOrder) {
-            _this.order = newOrder;
+          update: newOrder => {
+            this.order = newOrder;
           },
-          reorder: function reorder(sourceIndex, destinationIndex) {
-            _this.order = reduceOrderMembers(moveItemInArray(orderMembers, sourceIndex, destinationIndex));
+          reorder: (sourceIndex, destinationIndex) => {
+            this.order = reduceOrderMembers(moveItemInArray(orderMembers, sourceIndex, destinationIndex));
           }
         },
         updatePivotConfig: {
-          moveItem: function moveItem(_ref2) {
-            var sourceIndex = _ref2.sourceIndex,
-                destinationIndex = _ref2.destinationIndex,
-                sourceAxis = _ref2.sourceAxis,
-                destinationAxis = _ref2.destinationAxis;
-            _this.pivotConfig = movePivotItem(_this.pivotConfig, sourceIndex, destinationIndex, sourceAxis, destinationAxis);
+          moveItem: ({
+            sourceIndex,
+            destinationIndex,
+            sourceAxis,
+            destinationAxis
+          }) => {
+            this.pivotConfig = movePivotItem(this.pivotConfig, sourceIndex, destinationIndex, sourceAxis, destinationAxis);
           },
-          update: function update(pivotConfig) {
-            _this.pivotConfig = {
-              x: pivotConfig.x || _this.pivotConfig.x,
-              y: pivotConfig.y || _this.pivotConfig.y
+          update: pivotConfig => {
+            this.pivotConfig = {
+              x: pivotConfig.x || this.pivotConfig.x,
+              y: pivotConfig.y || this.pivotConfig.y
             };
           }
         }
       };
-      QUERY_ELEMENTS.forEach(function (elementName) {
-        var name = elementName.charAt(0).toUpperCase() + elementName.slice(1);
+      QUERY_ELEMENTS.forEach(elementName => {
+        const name = elementName.charAt(0).toUpperCase() + elementName.slice(1);
 
-        builderProps["add".concat(name)] = function (member) {
-          _this.addMember(elementName, member);
+        builderProps[`add${name}`] = member => {
+          this.addMember(elementName, member);
         };
 
-        builderProps["update".concat(name)] = function (member, updateWith) {
-          _this.updateMember(elementName, member, updateWith);
+        builderProps[`update${name}`] = (member, updateWith) => {
+          this.updateMember(elementName, member, updateWith);
         };
 
-        builderProps["remove".concat(name)] = function (member) {
-          _this.removeMember(elementName, member);
+        builderProps[`remove${name}`] = member => {
+          this.removeMember(elementName, member);
         };
 
-        builderProps["set".concat(name)] = function (members) {
-          _this.setMembers(elementName, members);
+        builderProps[`set${name}`] = members => {
+          this.setMembers(elementName, members);
         };
       });
     }
 
     return h(QueryRenderer, {
       query: this.validatedQuery,
-      cubejsApi: cubejsApi,
-      builderProps: builderProps,
+      cubejsApi,
+      builderProps,
       slots: this.$slots,
       on: {
-        queryStatus: function queryStatus(event) {
-          _this.$emit('queryStatus', event);
+        queryStatus: event => {
+          this.$emit('queryStatus', event);
         }
       }
     }, this.$slots);
   },
+
   computed: {
-    isQueryPresent: function isQueryPresent$1() {
-      var validatedQuery = this.validatedQuery;
+    isQueryPresent() {
+      const {
+        validatedQuery
+      } = this;
       return isQueryPresent(validatedQuery);
     },
-    orderMembers: function orderMembers() {
-      return getOrderMembersFromOrder([].concat(_toConsumableArray(this.measures), _toConsumableArray(this.dimensions), _toConsumableArray(this.timeDimensions.map(function (_ref3) {
-        var dimension = _ref3.dimension;
-        return toOrderMember(dimension);
-      }))).map(function (member, index) {
-        var id = member.name || member.id;
+
+    orderMembers() {
+      return getOrderMembersFromOrder([...this.measures, ...this.dimensions, ...this.timeDimensions.map(({
+        dimension
+      }) => toOrderMember(dimension))].map((member, index) => {
+        const id = member.name || member.id;
 
         if (!id) {
           return false;
         }
 
         return {
-          index: index,
-          id: id,
+          index,
+          id,
           title: member.title
         };
       }).filter(Boolean), this.order);
     },
-    vizState: function vizState() {
+
+    vizState() {
       return {
         query: this.validatedQuery,
         chartType: this.chartType,
         pivotConfig: this.pivotConfig
       };
     },
-    validatedQuery: function validatedQuery() {
-      var _this2 = this;
 
-      var validatedQuery = {};
+    validatedQuery() {
+      let validatedQuery = {};
 
-      var toQuery = function toQuery(member) {
-        return member.name;
-      }; // TODO: implement timezone
+      let toQuery = member => member.name; // TODO: implement timezone
 
 
-      var hasElements = false;
-      QUERY_ELEMENTS.forEach(function (element) {
+      let hasElements = false;
+      QUERY_ELEMENTS.forEach(element => {
         if (element === 'timeDimensions') {
-          toQuery = function toQuery(member) {
-            return {
-              dimension: member.dimension.name,
-              granularity: member.granularity,
-              dateRange: member.dateRange
-            };
-          };
+          toQuery = member => ({
+            dimension: member.dimension.name,
+            granularity: member.granularity,
+            dateRange: member.dateRange
+          });
         } else if (element === 'filters') {
-          toQuery = function toQuery(member) {
-            return {
-              member: member.member.name,
-              operator: member.operator,
-              values: member.values
-            };
-          };
+          toQuery = member => ({
+            member: member.member && member.member.name,
+            operator: member.operator,
+            values: member.values,
+            and: member.and && member.and.map(toQuery),
+            or: member.or && member.or.map(toQuery)
+          });
         }
 
-        if (_this2[element].length > 0) {
-          validatedQuery[element] = _this2[element].map(function (x) {
-            return toQuery(x);
-          });
+        if (this[element].length > 0) {
+          validatedQuery[element] = this[element].map(x => toQuery(x));
           hasElements = true;
         }
       });
 
       if (validatedQuery.filters) {
-        validatedQuery.filters = validatedQuery.filters.filter(function (f) {
-          return f.operator;
-        });
+        validatedQuery.filters = validateFilters(validatedQuery.filters);
       } // only set limit and offset if there are elements otherwise an invalid request with just limit/offset
       // gets sent when the component is first mounted, but before the actual query is constructed.
 
@@ -640,25 +532,25 @@ var QueryBuilder = {
       }
 
       if (!this.skipHeuristics && !this.disableHeuristics && isQueryPresent(validatedQuery) && this.meta) {
-        var _validatedQuery, _validatedQuery$timeD, _validatedQuery$timeD2;
-
-        var heuristicsFn = this.stateChangeHeuristics || defaultHeuristics;
-
-        var _heuristicsFn = heuristicsFn({
+        const heuristicsFn = this.stateChangeHeuristics || defaultHeuristics;
+        const {
+          query,
+          chartType,
+          shouldApplyHeuristicOrder,
+          pivotConfig
+        } = heuristicsFn({
           query: validatedQuery,
           chartType: this.chartType
         }, this.prevValidatedQuery, {
           meta: this.meta,
-          sessionGranularity: (_validatedQuery = validatedQuery) === null || _validatedQuery === void 0 ? void 0 : (_validatedQuery$timeD = _validatedQuery.timeDimensions) === null || _validatedQuery$timeD === void 0 ? void 0 : (_validatedQuery$timeD2 = _validatedQuery$timeD[0]) === null || _validatedQuery$timeD2 === void 0 ? void 0 : _validatedQuery$timeD2.granularity
-        }),
-            query = _heuristicsFn.query,
-            chartType = _heuristicsFn.chartType,
-            shouldApplyHeuristicOrder = _heuristicsFn.shouldApplyHeuristicOrder,
-            pivotConfig = _heuristicsFn.pivotConfig;
-
-        validatedQuery = _objectSpread(_objectSpread(_objectSpread({}, validatedQuery), query), shouldApplyHeuristicOrder ? {
-          order: defaultOrder(query)
-        } : null);
+          sessionGranularity: validatedQuery?.timeDimensions?.[0]?.granularity
+        });
+        validatedQuery = { ...validatedQuery,
+          ...query,
+          ...(shouldApplyHeuristicOrder ? {
+            order: defaultOrder(query)
+          } : null)
+        };
         this.chartType = chartType || this.chartType;
         this.pivotConfig = ResultSet.getNormalizedPivotConfig(validatedQuery, pivotConfig || this.pivotConfig);
         this.copyQueryFromProps(validatedQuery);
@@ -672,247 +564,186 @@ var QueryBuilder = {
       this.prevValidatedQuery = validatedQuery;
       return validatedQuery;
     }
+
   },
-  mounted: function mounted() {
-    var _this3 = this;
-
-    return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var dryRunResponse;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              _context.next = 2;
-              return _this3.cubejsApi.meta();
-
-            case 2:
-              _this3.meta = _context.sent;
-
-              _this3.copyQueryFromProps();
-
-              if (!isQueryPresent(_this3.initialQuery)) {
-                _context.next = 9;
-                break;
-              }
-
-              _context.next = 7;
-              return _this3.cubejsApi.dryRun(_this3.initialQuery);
-
-            case 7:
-              dryRunResponse = _context.sent;
-              _this3.pivotConfig = ResultSet.getNormalizedPivotConfig((dryRunResponse === null || dryRunResponse === void 0 ? void 0 : dryRunResponse.pivotQuery) || {}, _this3.pivotConfig);
-
-            case 9:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }))();
+
+  async mounted() {
+    this.meta = await this.cubejsApi.meta();
+    this.copyQueryFromProps();
+
+    if (isQueryPresent(this.initialQuery)) {
+      const dryRunResponse = await this.cubejsApi.dryRun(this.initialQuery);
+      this.pivotConfig = ResultSet.getNormalizedPivotConfig(dryRunResponse?.pivotQuery || {}, this.pivotConfig);
+    }
   },
+
   methods: {
-    copyQueryFromProps: function copyQueryFromProps(query) {
-      var _this4 = this;
-
-      var _ref4 = query || this.initialQuery,
-          _ref4$measures = _ref4.measures,
-          measures = _ref4$measures === void 0 ? [] : _ref4$measures,
-          _ref4$dimensions = _ref4.dimensions,
-          dimensions = _ref4$dimensions === void 0 ? [] : _ref4$dimensions,
-          _ref4$segments = _ref4.segments,
-          segments = _ref4$segments === void 0 ? [] : _ref4$segments,
-          _ref4$timeDimensions = _ref4.timeDimensions,
-          timeDimensions = _ref4$timeDimensions === void 0 ? [] : _ref4$timeDimensions,
-          _ref4$filters = _ref4.filters,
-          filters = _ref4$filters === void 0 ? [] : _ref4$filters,
-          limit = _ref4.limit,
-          offset = _ref4.offset,
-          renewQuery = _ref4.renewQuery,
-          order = _ref4.order;
-
-      this.measures = measures.map(function (m, index) {
-        return _objectSpread({
-          index: index
-        }, _this4.meta.resolveMember(m, 'measures'));
-      });
-      this.dimensions = dimensions.map(function (m, index) {
-        return _objectSpread({
-          index: index
-        }, _this4.meta.resolveMember(m, 'dimensions'));
-      });
-      this.segments = segments.map(function (m, index) {
-        return _objectSpread({
-          index: index
-        }, _this4.meta.resolveMember(m, 'segments'));
-      });
-      this.timeDimensions = timeDimensions.map(function (m, index) {
-        return _objectSpread(_objectSpread({}, m), {}, {
-          dimension: _objectSpread(_objectSpread({}, _this4.meta.resolveMember(m.dimension, 'dimensions')), {}, {
-            granularities: _this4.granularities
-          }),
-          index: index
-        });
-      });
-      this.filters = filters.map(function (m, index) {
-        return _objectSpread(_objectSpread({}, m), {}, {
-          member: _this4.meta.resolveMember(m.member || m.dimension, ['dimensions', 'measures']),
-          operators: _this4.meta.filterOperatorsForMember(m.member || m.dimension, ['dimensions', 'measures']),
-          index: index
-        });
+    copyQueryFromProps(query) {
+      const {
+        measures = [],
+        dimensions = [],
+        segments = [],
+        timeDimensions = [],
+        filters = [],
+        limit,
+        offset,
+        renewQuery,
+        order
+      } = query || this.initialQuery;
+      this.measures = measures.map((m, index) => ({
+        index,
+        ...this.meta.resolveMember(m, 'measures')
+      }));
+      this.dimensions = dimensions.map((m, index) => ({
+        index,
+        ...this.meta.resolveMember(m, 'dimensions')
+      }));
+      this.segments = segments.map((m, index) => ({
+        index,
+        ...this.meta.resolveMember(m, 'segments')
+      }));
+      this.timeDimensions = timeDimensions.map((m, index) => ({ ...m,
+        dimension: { ...this.meta.resolveMember(m.dimension, 'dimensions'),
+          granularities: this.granularities
+        },
+        index
+      }));
+      const memberTypes = ['dimensions', 'measures'];
+      this.filters = filters.map((m, index) => {
+        const memberName = m.member || m.dimension;
+        return { ...m,
+          member: memberName && this.meta.resolveMember(memberName, memberTypes),
+          operators: memberName && this.meta.filterOperatorsForMember(memberName, memberTypes),
+          and: resolveMembers(this.meta, m.and),
+          or: resolveMembers(this.meta, m.or),
+          index
+        };
       });
       this.availableMeasures = this.meta.membersForQuery({}, 'measures') || [];
       this.availableDimensions = this.meta.membersForQuery({}, 'dimensions') || [];
-      this.availableTimeDimensions = (this.meta.membersForQuery({}, 'dimensions') || []).filter(function (m) {
-        return m.type === 'time';
-      });
+      this.availableTimeDimensions = (this.meta.membersForQuery({}, 'dimensions') || []).filter(m => m.type === 'time');
       this.availableSegments = this.meta.membersForQuery({}, 'segments') || [];
       this.limit = limit || 10000;
       this.offset = offset || null;
       this.renewQuery = renewQuery || false;
       this.order = order || null;
     },
-    addMember: function addMember(element, member) {
-      var name = element.charAt(0).toUpperCase() + element.slice(1);
-      var mem;
+
+    addMember(element, member) {
+      const name = element.charAt(0).toUpperCase() + element.slice(1);
+      let mem;
 
       if (element === 'timeDimensions') {
-        mem = this["available".concat(name)].find(function (m) {
-          return m.name === member.dimension;
-        });
+        mem = this[`available${name}`].find(m => m.name === member.dimension);
 
         if (mem) {
-          var dimension = _objectSpread(_objectSpread({}, this.meta.resolveMember(mem.name, 'dimensions')), {}, {
+          const dimension = { ...this.meta.resolveMember(mem.name, 'dimensions'),
             granularities: this.granularities
-          });
-
-          mem = _objectSpread(_objectSpread({}, mem), {}, {
+          };
+          mem = { ...mem,
             granularity: member.granularity,
             dateRange: member.dateRange,
-            dimension: dimension,
+            dimension,
             index: this[element].length
-          });
+          };
         }
       } else if (element === 'filters') {
-        var filterMember = _objectSpread({}, this.meta.resolveMember(member.member || member.dimension, ['dimensions', 'measures']));
-
-        mem = _objectSpread(_objectSpread({}, member), {}, {
-          member: filterMember
-        });
+        mem = { ...member,
+          and: resolveMembers(this.meta, member.and),
+          or: resolveMembers(this.meta, member.or),
+          member: getDimensionOrMeasure(this.meta, member)
+        };
       } else {
-        mem = this["available".concat(name)].find(function (m) {
-          return m.name === member;
-        });
+        mem = this[`available${name}`].find(m => m.name === member);
       }
 
       if (mem) {
         this[element].push(mem);
       }
     },
-    removeMember: function removeMember(element, member) {
-      var name = element.charAt(0).toUpperCase() + element.slice(1);
-      var mem;
+
+    removeMember(element, member) {
+      const name = element.charAt(0).toUpperCase() + element.slice(1);
+      let mem;
 
       if (element === 'timeDimensions') {
-        mem = this["available".concat(name)].find(function (x) {
-          return x.name === member;
-        });
+        mem = this[`available${name}`].find(x => x.name === member);
       } else if (element === 'filters') {
         mem = member;
       } else {
-        mem = this["available".concat(name)].find(function (m) {
-          return m.name === member;
-        });
+        mem = this[`available${name}`].find(m => m.name === member);
       }
 
       if (mem) {
-        var index = this[element].findIndex(function (x) {
-          return x.name === mem;
-        });
+        const index = this[element].findIndex(x => x.name === mem);
         this[element].splice(index, 1);
       }
     },
-    updateMember: function updateMember(element, old, member) {
-      var name = element.charAt(0).toUpperCase() + element.slice(1);
-      var mem;
-      var index;
+
+    updateMember(element, old, member) {
+      const name = element.charAt(0).toUpperCase() + element.slice(1);
+      let mem;
+      let index;
 
       if (element === 'timeDimensions') {
-        index = this[element].findIndex(function (x) {
-          return x.dimension.name === old.dimension;
-        });
-        mem = this["available".concat(name)].find(function (m) {
-          return m.name === member.dimension;
-        });
+        index = this[element].findIndex(x => x.dimension.name === old.dimension);
+        mem = this[`available${name}`].find(m => m.name === member.dimension);
 
         if (mem) {
-          var dimension = _objectSpread(_objectSpread({}, this.meta.resolveMember(mem.name, 'dimensions')), {}, {
+          const dimension = { ...this.meta.resolveMember(mem.name, 'dimensions'),
             granularities: this.granularities
-          });
-
-          mem = _objectSpread(_objectSpread({}, mem), {}, {
-            dimension: dimension,
+          };
+          mem = { ...mem,
+            dimension,
             granularity: member.granularity,
             dateRange: member.dateRange,
-            index: index
-          });
+            index
+          };
         }
       } else if (element === 'filters') {
-        index = this[element].findIndex(function (x) {
-          return x.dimension === old;
-        });
-
-        var filterMember = _objectSpread({}, this.meta.resolveMember(member.member || member.dimension, ['dimensions', 'measures']));
-
-        mem = _objectSpread(_objectSpread({}, member), {}, {
-          member: filterMember
-        });
+        index = this[element].findIndex(x => x.dimension === old);
+        mem = { ...member,
+          and: resolveMembers(this.meta, member.and),
+          or: resolveMembers(this.meta, member.or),
+          member: getDimensionOrMeasure(this.meta, member)
+        };
       } else {
-        index = this[element].findIndex(function (x) {
-          return x.name === old;
-        });
-        mem = this["available".concat(name)].find(function (m) {
-          return m.name === member;
-        });
+        index = this[element].findIndex(x => x.name === old);
+        mem = this[`available${name}`].find(m => m.name === member);
       }
 
       if (mem) {
         this[element].splice(index, 1, mem);
       }
     },
-    setMembers: function setMembers(element, members) {
-      var _this5 = this;
 
-      var name = element.charAt(0).toUpperCase() + element.slice(1);
-      var mem;
-      var elements = [];
-      members.filter(Boolean).forEach(function (m) {
+    setMembers(element, members) {
+      const name = element.charAt(0).toUpperCase() + element.slice(1);
+      let mem;
+      const elements = [];
+      members.filter(Boolean).forEach(m => {
         if (element === 'timeDimensions') {
-          mem = _this5["available".concat(name)].find(function (x) {
-            return x.name === m.dimension;
-          });
+          mem = this[`available${name}`].find(x => x.name === m.dimension);
 
           if (mem) {
-            var dimension = _objectSpread(_objectSpread({}, _this5.meta.resolveMember(mem.name, 'dimensions')), {}, {
-              granularities: _this5.granularities
-            });
-
-            mem = _objectSpread(_objectSpread({}, mem), {}, {
+            const dimension = { ...this.meta.resolveMember(mem.name, 'dimensions'),
+              granularities: this.granularities
+            };
+            mem = { ...mem,
               granularity: m.granularity,
               dateRange: m.dateRange,
-              dimension: dimension,
-              index: _this5[element].length
-            });
+              dimension,
+              index: this[element].length
+            };
           }
         } else if (element === 'filters') {
-          var member = _objectSpread({}, _this5.meta.resolveMember(m.member || m.dimension, ['dimensions', 'measures']));
-
-          mem = _objectSpread(_objectSpread({}, m), {}, {
-            member: member
-          });
+          mem = { ...m,
+            and: resolveMembers(this.meta, m.and),
+            or: resolveMembers(this.meta, m.or),
+            member: getDimensionOrMeasure(this.meta, m)
+          };
         } else {
-          mem = _this5["available".concat(name)].find(function (x) {
-            return x.name === m;
-          });
+          mem = this[`available${name}`].find(x => x.name === m);
         }
 
         if (mem) {
@@ -921,62 +752,71 @@ var QueryBuilder = {
       });
       this[element] = elements;
     },
-    setLimit: function setLimit(limit) {
+
+    setLimit(limit) {
       this.limit = limit;
     },
-    removeLimit: function removeLimit() {
+
+    removeLimit() {
       this.limit = null;
     },
-    setOffset: function setOffset(offset) {
+
+    setOffset(offset) {
       this.offset = offset;
     },
-    removeOffset: function removeOffset() {
+
+    removeOffset() {
       this.offset = null;
     },
-    updateChart: function updateChart(chartType) {
+
+    updateChart(chartType) {
       this.chartType = chartType;
     },
-    setOrder: function setOrder() {
-      var order = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+    setOrder(order = {}) {
       this.order = order;
     },
-    emitVizStateChange: function emitVizStateChange(partialVizState) {
-      this.$emit('vizStateChange', clone(_objectSpread(_objectSpread({}, this.vizState), partialVizState)));
+
+    emitVizStateChange(partialVizState) {
+      this.$emit('vizStateChange', clone({ ...this.vizState,
+        ...partialVizState
+      }));
     }
+
   },
   watch: {
     validatedQuery: {
       deep: true,
-      handler: function handler(query, prevQuery) {
-        var _this6 = this;
 
-        var hasQueryChanged = !areQueriesEqual(query, prevQuery);
+      handler(query, prevQuery) {
+        const hasQueryChanged = !areQueriesEqual(query, prevQuery);
 
         if (hasQueryChanged) {
           this.emitVizStateChange({
-            query: query
+            query
           });
         }
 
         if (isQueryPresent(query) && hasQueryChanged) {
           this.cubejsApi.dryRun(query, {
             mutexObj: this.mutex
-          }).then(function (_ref5) {
-            var pivotQuery = _ref5.pivotQuery;
-            var pivotConfig = ResultSet.getNormalizedPivotConfig(pivotQuery, _this6.pivotConfig);
+          }).then(({
+            pivotQuery
+          }) => {
+            const pivotConfig = ResultSet.getNormalizedPivotConfig(pivotQuery, this.pivotConfig);
 
-            if (!equals(pivotConfig, _this6.pivotConfig)) {
-              _this6.pivotConfig = pivotConfig;
+            if (!equals(pivotConfig, this.pivotConfig)) {
+              this.pivotConfig = pivotConfig;
             }
-          })["catch"](function (error) {
-            return console.error(error);
-          });
+          }).catch(error => console.error(error));
         }
       }
+
     },
     query: {
       deep: true,
-      handler: function handler(query) {
+
+      handler(query) {
         if (!this.meta) {
           // this is ok as if meta has not been loaded by the time query prop has changed,
           // then the promise for loading meta (found in mounted()) will call
@@ -986,22 +826,27 @@ var QueryBuilder = {
 
         this.copyQueryFromProps(query);
       }
+
     },
     pivotConfig: {
       deep: true,
-      handler: function handler(pivotConfig, prevPivotConfig) {
+
+      handler(pivotConfig, prevPivotConfig) {
         if (!equals(pivotConfig, prevPivotConfig)) {
           this.emitVizStateChange({
-            pivotConfig: pivotConfig
+            pivotConfig
           });
         }
       }
+
     },
-    chartType: function chartType(value) {
+
+    chartType(value) {
       this.emitVizStateChange({
         chartType: value
       });
     }
+
   }
 };