@cubejs-client/vue3 0.34.60 → 0.35.23

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

@@ -16,7 +16,7 @@ var QueryRenderer = {
     loadSql: {
       required: false
     },
-    cubejsApi: {
+    cubeApi: {
       type: Object,
       required: true
     },
@@ -30,7 +30,6 @@ var QueryRenderer = {
       required: false
     }
   },
-
   data() {
     return {
       mutexObj: {},
@@ -40,20 +39,17 @@ var QueryRenderer = {
       sqlQuery: undefined
     };
   },
-
   async mounted() {
     const {
       query,
       queries
     } = this;
-
     if (isQueryPresent(query)) {
       await this.load();
     } else if (isQueryPresent(queries)) {
       await this.loadQueries(queries);
     }
   },
-
   render() {
     const {
       $slots,
@@ -66,19 +62,17 @@ var QueryRenderer = {
     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({ ...this.builderProps
+      controls = $slots.builder({
+        ...this.builderProps
       });
     }
-
     if (!loading && resultSet && !error || onlyDefault) {
       let slotProps = {
         resultSet,
         sqlQuery,
         query: this.builderProps.query || this.query
       };
-
       if (onlyDefault) {
         slotProps = {
           loading,
@@ -88,7 +82,6 @@ var QueryRenderer = {
           ...slotProps
         };
       }
-
       slot = $slots.default ? $slots.default(slotProps) : slot;
     } else if (error) {
       slot = $slots.error ? $slots.error({
@@ -96,46 +89,40 @@ var QueryRenderer = {
         sqlQuery
       }) : slot;
     }
-
     return h('div', {}, [controls, slot]);
   },
-
   methods: {
     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, {
+          this.sqlQuery = await this.cubeApi.sql(query, {
             mutexObj: this.mutexObj,
             mutexKey: 'sql'
           });
         } else if (this.loadSql) {
-          this.sqlQuery = await this.cubejsApi.sql(query, {
+          this.sqlQuery = await this.cubeApi.sql(query, {
             mutexObj: this.mutexObj,
             mutexKey: 'sql'
           });
-          this.resultSet = await this.cubejsApi.load(query, {
+          this.resultSet = await this.cubeApi.load(query, {
             mutexObj: this.mutexObj,
             mutexKey: 'query'
           });
         } else {
-          this.resultSet = await this.cubejsApi.load(query, {
+          this.resultSet = await this.cubeApi.load(query, {
             mutexObj: this.mutexObj,
             mutexKey: 'query'
           });
         }
-
         this.loading = false;
       } catch (error) {
         this.error = error;
@@ -143,16 +130,14 @@ var QueryRenderer = {
         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, {
+        const resultPromises = Promise.all(toPairs(queries).map(([name, query]) => this.cubeApi.load(query, {
           mutexObj: this.mutexObj,
           mutexKey: name
         }).then(r => [name, r])));
@@ -163,7 +148,6 @@ var QueryRenderer = {
         this.loading = false;
       }
     }
-
   },
   watch: {
     loading(loading) {
@@ -179,24 +163,19 @@ var QueryRenderer = {
         });
       }
     },
-
-    cubejsApi() {
+    cubeApi() {
       this.load();
     },
-
     chartType() {
       this.load();
     },
-
     query: {
       deep: true,
-
       handler(query, prevQuery) {
         if (!areQueriesEqual(query, prevQuery)) {
           this.load();
         }
       }
-
     },
     queries: {
       handler(val) {
@@ -204,65 +183,54 @@ var QueryRenderer = {
           this.loadQueries();
         }
       },
-
       deep: true
     }
   }
 };
 
 const QUERY_ELEMENTS = ['measures', 'dimensions', 'segments', 'timeDimensions', 'filters'];
-
 const toOrderMember = member => ({
   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,
+      return {
+        ...acc,
         [operator]: booleanFilters
       };
     }
-
     return acc;
   }, {});
-
   if (operators.some(operator => validBooleanFilter[operator])) {
     return [...acc, validBooleanFilter];
   }
-
   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,
+  return {
+    ...e,
     member: getDimensionOrMeasure(meta, e),
     index,
     and: resolveMembers(meta, e.and),
     or: resolveMembers(meta, e.or)
   };
 });
-
 var QueryBuilder = {
   components: {
     QueryRenderer
@@ -272,7 +240,7 @@ var QueryBuilder = {
       type: Object,
       default: () => ({})
     },
-    cubejsApi: {
+    cubeApi: {
       type: Object,
       required: true
     },
@@ -291,7 +259,6 @@ var QueryBuilder = {
       default: () => ({})
     }
   },
-
   data() {
     const {
       query = this.query,
@@ -322,11 +289,10 @@ var QueryBuilder = {
       pivotConfig: ResultSet.getNormalizedPivotConfig(query || {}, pivotConfig)
     };
   },
-
   render() {
     const {
       chartType,
-      cubejsApi,
+      cubeApi,
       dimensions,
       filters,
       measures,
@@ -351,7 +317,6 @@ var QueryBuilder = {
       orderMembers
     } = this;
     let builderProps = {};
-
     if (meta) {
       builderProps = {
         query,
@@ -381,7 +346,8 @@ var QueryBuilder = {
         pivotConfig: this.pivotConfig,
         updateOrder: {
           set: (memberId, newOrder) => {
-            this.order = reduceOrderMembers(orderMembers.map(orderMember => ({ ...orderMember,
+            this.order = reduceOrderMembers(orderMembers.map(orderMember => ({
+              ...orderMember,
               order: orderMember.id === memberId ? newOrder : orderMember.order
             })));
           },
@@ -411,28 +377,23 @@ var QueryBuilder = {
       };
       QUERY_ELEMENTS.forEach(elementName => {
         const name = elementName.charAt(0).toUpperCase() + elementName.slice(1);
-
         builderProps[`add${name}`] = member => {
           this.addMember(elementName, member);
         };
-
         builderProps[`update${name}`] = (member, updateWith) => {
           this.updateMember(elementName, member, updateWith);
         };
-
         builderProps[`remove${name}`] = member => {
           this.removeMember(elementName, member);
         };
-
         builderProps[`set${name}`] = members => {
           this.setMembers(elementName, members);
         };
       });
     }
-
     return h(QueryRenderer, {
       query: this.validatedQuery,
-      cubejsApi,
+      cubeApi,
       builderProps,
       slots: this.$slots,
       on: {
@@ -442,7 +403,6 @@ var QueryBuilder = {
       }
     }, this.$slots);
   },
-
   computed: {
     isQueryPresent() {
       const {
@@ -450,7 +410,6 @@ var QueryBuilder = {
       } = this;
       return isQueryPresent(validatedQuery);
     },
-
     orderMembers() {
       return getOrderMembersFromOrder([...this.measures, ...this.dimensions, ...this.timeDimensions.reduce((acc, {
         dimension,
@@ -459,15 +418,12 @@ var QueryBuilder = {
         if (granularity !== undefined) {
           acc.push(toOrderMember(dimension));
         }
-
         return acc;
       }, [])].map((member, index) => {
         const id = member.name || member.id;
-
         if (!id) {
           return false;
         }
-
         return {
           index,
           id,
@@ -475,7 +431,6 @@ var QueryBuilder = {
         };
       }).filter(Boolean), this.order);
     },
-
     vizState() {
       return {
         query: this.validatedQuery,
@@ -483,12 +438,10 @@ var QueryBuilder = {
         pivotConfig: this.pivotConfig
       };
     },
-
     validatedQuery() {
       let validatedQuery = {};
-
-      let toQuery = member => member.name; // TODO: implement timezone
-
+      let toQuery = member => member.name;
+      // TODO: implement timezone
 
       let hasElements = false;
       QUERY_ELEMENTS.forEach(element => {
@@ -507,37 +460,31 @@ var QueryBuilder = {
             or: member.or && member.or.map(toQuery)
           });
         }
-
         if (this[element].length > 0) {
           validatedQuery[element] = this[element].map(x => toQuery(x));
           hasElements = true;
         }
       });
-
       if (validatedQuery.filters) {
         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.
-
+      }
 
+      // 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.
       if (hasElements) {
         if (this.limit) {
           validatedQuery.limit = this.limit;
         }
-
         if (this.offset) {
           validatedQuery.offset = this.offset;
         }
-
         if (this.order) {
           validatedQuery.order = this.order;
         }
-
         if (this.renewQuery) {
           validatedQuery.renewQuery = this.renewQuery;
         }
       }
-
       if (!this.skipHeuristics && !this.disableHeuristics && isQueryPresent(validatedQuery) && this.meta) {
         const heuristicsFn = this.stateChangeHeuristics || defaultHeuristics;
         const {
@@ -552,7 +499,8 @@ var QueryBuilder = {
           meta: this.meta,
           sessionGranularity: validatedQuery?.timeDimensions?.[0]?.granularity
         });
-        validatedQuery = { ...validatedQuery,
+        validatedQuery = {
+          ...validatedQuery,
           ...query,
           ...(shouldApplyHeuristicOrder ? {
             order: defaultOrder(query)
@@ -561,29 +509,24 @@ var QueryBuilder = {
         this.chartType = chartType || this.chartType;
         this.pivotConfig = ResultSet.getNormalizedPivotConfig(validatedQuery, pivotConfig !== undefined ? pivotConfig : this.pivotConfig);
         this.copyQueryFromProps(validatedQuery);
-      } // query heuristics should only apply on query change (not applied to the initial query)
-
+      }
 
+      // query heuristics should only apply on query change (not applied to the initial query)
       if (this.prevValidatedQuery !== null) {
         this.skipHeuristics = false;
       }
-
       this.prevValidatedQuery = validatedQuery;
       return validatedQuery;
     }
-
   },
-
   async mounted() {
-    this.meta = await this.cubejsApi.meta();
+    this.meta = await this.cubeApi.meta();
     this.copyQueryFromProps();
-
     if (isQueryPresent(this.initialQuery)) {
-      const dryRunResponse = await this.cubejsApi.dryRun(this.initialQuery);
+      const dryRunResponse = await this.cubeApi.dryRun(this.initialQuery);
       this.pivotConfig = ResultSet.getNormalizedPivotConfig(dryRunResponse?.pivotQuery || {}, this.pivotConfig);
     }
   },
-
   methods: {
     copyQueryFromProps(query) {
       const {
@@ -609,8 +552,10 @@ var QueryBuilder = {
         index,
         ...this.meta.resolveMember(m, 'segments')
       }));
-      this.timeDimensions = timeDimensions.map((m, index) => ({ ...m,
-        dimension: { ...this.meta.resolveMember(m.dimension, 'dimensions'),
+      this.timeDimensions = timeDimensions.map((m, index) => ({
+        ...m,
+        dimension: {
+          ...this.meta.resolveMember(m.dimension, 'dimensions'),
           granularities: this.granularities
         },
         index
@@ -618,7 +563,8 @@ var QueryBuilder = {
       const memberTypes = ['dimensions', 'measures'];
       this.filters = filters.map((m, index) => {
         const memberName = m.member || m.dimension;
-        return { ...m,
+        return {
+          ...m,
           member: memberName && this.meta.resolveMember(memberName, memberTypes),
           operators: memberName && this.meta.filterOperatorsForMember(memberName, memberTypes),
           and: resolveMembers(this.meta, m.and),
@@ -635,19 +581,18 @@ var QueryBuilder = {
       this.renewQuery = renewQuery || false;
       this.order = order || null;
     },
-
     addMember(element, member) {
       const name = element.charAt(0).toUpperCase() + element.slice(1);
       let mem;
-
       if (element === 'timeDimensions') {
         mem = this[`available${name}`].find(m => m.name === member.dimension);
-
         if (mem) {
-          const dimension = { ...this.meta.resolveMember(mem.name, 'dimensions'),
+          const dimension = {
+            ...this.meta.resolveMember(mem.name, 'dimensions'),
             granularities: this.granularities
           };
-          mem = { ...mem,
+          mem = {
+            ...mem,
             granularity: member.granularity,
             dateRange: member.dateRange,
             dimension,
@@ -655,7 +600,8 @@ var QueryBuilder = {
           };
         }
       } else if (element === 'filters') {
-        mem = { ...member,
+        mem = {
+          ...member,
           and: resolveMembers(this.meta, member.and),
           or: resolveMembers(this.meta, member.or),
           member: getDimensionOrMeasure(this.meta, member)
@@ -663,16 +609,13 @@ var QueryBuilder = {
       } else {
         mem = this[`available${name}`].find(m => m.name === member);
       }
-
       if (mem) {
         this[element].push(mem);
       }
     },
-
     removeMember(element, member) {
       const name = element.charAt(0).toUpperCase() + element.slice(1);
       let mem;
-
       if (element === 'timeDimensions') {
         mem = this[`available${name}`].find(x => x.name === member);
       } else if (element === 'filters') {
@@ -680,27 +623,25 @@ var QueryBuilder = {
       } else {
         mem = this[`available${name}`].find(m => m.name === member);
       }
-
       if (mem) {
         const index = this[element].findIndex(x => x.name === mem);
         this[element].splice(index, 1);
       }
     },
-
     updateMember(element, old, member) {
       const name = element.charAt(0).toUpperCase() + element.slice(1);
       let mem;
       let index;
-
       if (element === 'timeDimensions') {
         index = this[element].findIndex(x => x.dimension.name === old.dimension);
         mem = this[`available${name}`].find(m => m.name === member.dimension);
-
         if (mem) {
-          const dimension = { ...this.meta.resolveMember(mem.name, 'dimensions'),
+          const dimension = {
+            ...this.meta.resolveMember(mem.name, 'dimensions'),
             granularities: this.granularities
           };
-          mem = { ...mem,
+          mem = {
+            ...mem,
             dimension,
             granularity: member.granularity,
             dateRange: member.dateRange,
@@ -709,7 +650,8 @@ var QueryBuilder = {
         }
       } else if (element === 'filters') {
         index = this[element].findIndex(x => x.dimension === old);
-        mem = { ...member,
+        mem = {
+          ...member,
           and: resolveMembers(this.meta, member.and),
           or: resolveMembers(this.meta, member.or),
           member: getDimensionOrMeasure(this.meta, member)
@@ -718,12 +660,10 @@ var QueryBuilder = {
         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(element, members) {
       const name = element.charAt(0).toUpperCase() + element.slice(1);
       let mem;
@@ -731,12 +671,13 @@ var QueryBuilder = {
       members.filter(Boolean).forEach(m => {
         if (element === 'timeDimensions') {
           mem = this[`available${name}`].find(x => x.name === m.dimension);
-
           if (mem) {
-            const dimension = { ...this.meta.resolveMember(mem.name, 'dimensions'),
+            const dimension = {
+              ...this.meta.resolveMember(mem.name, 'dimensions'),
               granularities: this.granularities
             };
-            mem = { ...mem,
+            mem = {
+              ...mem,
               granularity: m.granularity,
               dateRange: m.dateRange,
               dimension,
@@ -744,7 +685,8 @@ var QueryBuilder = {
             };
           }
         } else if (element === 'filters') {
-          mem = { ...m,
+          mem = {
+            ...m,
             and: resolveMembers(this.meta, m.and),
             or: resolveMembers(this.meta, m.or),
             member: getDimensionOrMeasure(this.meta, m)
@@ -752,77 +694,63 @@ var QueryBuilder = {
         } else {
           mem = this[`available${name}`].find(x => x.name === m);
         }
-
         if (mem) {
           elements.push(mem);
         }
       });
       this[element] = elements;
     },
-
     setLimit(limit) {
       this.limit = limit;
     },
-
     removeLimit() {
       this.limit = null;
     },
-
     setOffset(offset) {
       this.offset = offset;
     },
-
     removeOffset() {
       this.offset = null;
     },
-
     updateChart(chartType) {
       this.chartType = chartType;
     },
-
     setOrder(order = {}) {
       this.order = order;
     },
-
     emitVizStateChange(partialVizState) {
-      this.$emit('vizStateChange', clone({ ...this.vizState,
+      this.$emit('vizStateChange', clone({
+        ...this.vizState,
         ...partialVizState
       }));
     }
-
   },
   watch: {
     validatedQuery: {
       deep: true,
-
       handler(query, prevQuery) {
         const hasQueryChanged = !areQueriesEqual(query, prevQuery);
-
         if (hasQueryChanged) {
           this.emitVizStateChange({
             query
           });
         }
-
         if (isQueryPresent(query) && hasQueryChanged) {
-          this.cubejsApi.dryRun(query, {
+          this.cubeApi.dryRun(query, {
             mutexObj: this.mutex
           }).then(({
             pivotQuery
           }) => {
             const pivotConfig = ResultSet.getNormalizedPivotConfig(pivotQuery, this.pivotConfig);
-
             if (!equals(pivotConfig, this.pivotConfig)) {
               this.pivotConfig = pivotConfig;
             }
           }).catch(error => console.error(error));
         }
       }
-
     },
     query: {
       deep: true,
-
       handler(query) {
         if (!this.meta) {
           // this is ok as if meta has not been loaded by the time query prop has changed,
@@ -830,14 +758,11 @@ var QueryBuilder = {
           // copyQueryFromProps and will therefore update anyway.
           return;
         }
-
         this.copyQueryFromProps(query);
       }
-
     },
     pivotConfig: {
       deep: true,
-
       handler(pivotConfig, prevPivotConfig) {
         if (!equals(pivotConfig, prevPivotConfig)) {
           this.emitVizStateChange({
@@ -845,15 +770,12 @@ var QueryBuilder = {
           });
         }
       }
-
     },
-
     chartType(value) {
       this.emitVizStateChange({
         chartType: value
       });
     }
-
   }
 };