@vizzly/dashboard 0.15.0-dev-65c3e5d7491389a56cc8409b046f92683dd4725f → 0.15.0

package/dist/dashboard.esm.js

@@ -33,7 +33,7 @@ import { LegendItem as LegendItem$1, LegendLabel } from '@visx/legend';
 import { scaleOrdinal, scaleQuantize, scaleLinear, scalePoint, scaleTime, scaleBand } from '@visx/scale';
 import Ordinal from '@visx/legend/lib/legends/Ordinal';
 import { curveNatural, curveMonotoneX, curveMonotoneY, curveLinear, curveStep, curveStepBefore, curveStepAfter } from '@visx/curve';
-import { Line as Line$1, LinePath, BarGroup as BarGroup$2, BarStack as BarStack$1, AreaStack as AreaStack$1, AreaClosed, LineRadial } from '@visx/shape';
+import { Line as Line$1, LinePath, BarStack as BarStack$1, BarGroup as BarGroup$2, AreaStack as AreaStack$1, AreaClosed, LineRadial } from '@visx/shape';
 import { Mercator, Graticule } from '@visx/geo';
 import { feature } from 'topojson-client';
 import ParentSize$1 from '@visx/responsive/lib/components/ParentSize';
@@ -1108,6 +1108,33 @@ var FieldNotFoundInDataSet = /*#__PURE__*/function (_ValidationError) {
   return FieldNotFoundInDataSet;
 }(ValidationError);
 
+var timeDimensionsConstants = QueryEngineConfig.Constants.timeDimensionsConstants;
+
+// All the aggregates Vizzly supports somewhere...
+// Not necessarily all the aggregates that are supported because each
+// integration could support different aggregates
+
+var id$1 = function id(metric) {
+  if (!(metric != null && metric.truncate) || (metric == null ? void 0 : metric.truncate) == 'none') return metric == null ? void 0 : metric.field;
+  return metric.field + "_" + metric.truncate;
+};
+var decodeId$1 = function decodeId(metric, supportedTimeTruncFunctions) {
+  var parts = metric.split('_');
+  var truncate = parts.pop();
+  if (truncate && !isSupportedTimeTruncFunction(supportedTimeTruncFunctions, truncate)) {
+    return null;
+  }
+  var field = parts.join('_');
+  return {
+    field: field,
+    truncate: truncate != null ? truncate : ''
+  };
+};
+var vizzlyManagedTimeDimensions = timeDimensionsConstants;
+var isSupportedTimeTruncFunction = function isSupportedTimeTruncFunction(supportedTimeFunctions, proposedFunction) {
+  return [].concat(Object.keys(supportedTimeFunctions), ['none']).includes(proposedFunction);
+};
+
 var filterIsDate = function filterIsDate(filter) {
   var isoDateRegex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z$/;
   if (!isoDateRegex.test(filter.value)) {
@@ -1342,6 +1369,103 @@ function extractValue(variables, key) {
   return variables[key].value;
 }
 
+var addAndFilters = function addAndFilters(filter, filterToAddToAll) {
+  if (!filter || isEmpty$2(filter)) filter = [[]];
+  return [].concat(filter).map(function (andFilter) {
+    return [].concat(andFilter, filterToAddToAll);
+  });
+};
+var filterAttributeToQueryFilter = function filterAttributeToQueryFilter(filters, queryEngineConfig, dataSet, params) {
+  return filters.map(function (andFilters) {
+    return [].concat(andFilters).flatMap(function (andFilter) {
+      var _andFilter$function;
+      // Stop unsupported time functions being used.
+      if (andFilter["function"] && !isSupportedTimeTruncFunction(queryEngineConfig.supportedTimeTruncFunctions, andFilter["function"])) {
+        throw "Query engine does not support the query function " + andFilter["function"] + ".";
+      }
+      var dataSetField = findField(dataSet, andFilter.field);
+      var field = {
+        type: 'field',
+        value: andFilter.field,
+        "function": (_andFilter$function = andFilter["function"]) != null ? _andFilter$function : 'none'
+      };
+      if (isCustomField(dataSetField)) {
+        var _andFilter$function2;
+        field = toQueryMeasure({
+          field: dataSetField.id,
+          "function": (_andFilter$function2 = andFilter["function"]) != null ? _andFilter$function2 : 'none'
+        }, dataSetField, queryEngineConfig, dataSet, false, params);
+      }
+      // If `array_contains` operation has multiple. Then split these out into individual
+      // checks.
+      if ((andFilter.op == 'array_contains' || andFilter.op == 'array_does_not_contain') && Array.isArray(andFilter.value)) {
+        return [].concat(andFilter.value).map(function (value) {
+          return {
+            field: field,
+            op: andFilter.op,
+            value: value
+          };
+        });
+      }
+      var value = useValue(andFilter.value, params.variables);
+      if (isRelativeDateDefined(andFilter.value)) {
+        value = calculateRelativeDate(andFilter.value);
+      }
+      if (filterIsDate(andFilter)) {
+        value = getUTCDate(andFilter.value);
+      }
+      return [{
+        field: field,
+        op: andFilter.op,
+        value: value
+      }];
+    });
+  });
+};
+var isAvailable = function isAvailable(filter) {
+  return filter && isArray(filter) && isArray(filter[0]);
+};
+var isAdditionalFilter = function isAdditionalFilter(value) {
+  return value && isArray(value) && isArray(value[0]) && 'field' in value[0][0] && 'op' in value[0][0] && 'value' in value[0][0];
+};
+
+var combineFilters = function combineFilters(array1, array2) {
+  var validArray1 = array1.length > 0 && array1[0] ? array1 : [[]];
+  var validArray2 = array2.length > 0 && array2[0] ? array2 : [[]];
+
+  // If array1 has more than one sub-array, loop through each sub-array in array1
+  if (validArray1.length > 1) {
+    return validArray1.map(function (subArray) {
+      return [].concat(validArray2[0] || [], subArray || []);
+    });
+  }
+  // Otherwise, if array2 has more than one sub-array, loop through array2
+  else if (validArray2.length > 1) {
+    return validArray2.map(function (subArray) {
+      return [].concat(validArray1[0] || [], subArray || []);
+    });
+  }
+  // Default: merge both single sub-arrays
+  else {
+    return [[].concat(validArray1[0] || [], validArray2[0] || [])];
+  }
+};
+function combineForCustomMetricFilters(filters, customFilters) {
+  var combinedFilters = [];
+  if (customFilters && isAvailable(customFilters)) {
+    customFilters.forEach(function (orFilterGroup) {
+      combinedFilters = [].concat(combinedFilters, addAndFilters(filters != null ? filters : [], orFilterGroup));
+    });
+  } else {
+    combinedFilters = filters != null ? filters : [];
+  }
+  return combinedFilters;
+}
+
+var generateId = function generateId() {
+  return v4().replace(/-/g, '');
+};
+
 /** Upcasts from an old global filter, to a new "additional filter" */
 var upcastToAdditionalFilter = function upcastToAdditionalFilter(globalFilter) {
   if (globalFilter.type == 'globalSelectFilter') {
@@ -1771,125 +1895,6 @@ var fromFilterConfig = function fromFilterConfig(filterConfig, dataSet, timeRang
   return filters;
 };
 
-var addAndFilters = function addAndFilters(filter, filterToAddToAll) {
-  if (isEmpty$2(filterToAddToAll)) return [].concat(filter);
-  if (!filter || isEmpty$2(filter)) filter = [[]];
-  return [].concat(filter).map(function (andFilter) {
-    return [].concat(andFilter, filterToAddToAll);
-  });
-};
-var filterAttributeToQueryFilter = function filterAttributeToQueryFilter(filterAttrs, queryEngineConfig, dataSet, params) {
-  var _params$filterConfig;
-  // Either build using the filter attributes passed in, or take the viewFilters in the filter config.
-  // They represent the same thing, however some view-filters are passed around in the filter config
-  // to reduce custom metrics arguments being passed around.
-  var filter = filterAttrs.length > 0 ? filterAttrs : ((_params$filterConfig = params.filterConfig) == null ? void 0 : _params$filterConfig.viewFilters) || [];
-  var extraFilters = fromFilterConfig(params.filterConfig, dataSet, params.timeRangeOptions);
-  var combinedFilters = addAndFilters(filter, extraFilters);
-  if (Array.isArray(filter)) {
-    return {
-      type: 'orWhere',
-      value: combinedFilters.map(function (andFilters) {
-        return {
-          type: 'andWhere',
-          value: andFilters.map(function (filter) {
-            var dataSetField = findField(dataSet, filter.field);
-            var field = {
-              type: 'field',
-              value: filter.field,
-              "function": filter["function"] || 'none'
-            };
-            if (isCustomField(dataSetField)) {
-              var _filter$function;
-              field = toQueryMeasure({
-                field: dataSetField.id,
-                "function": (_filter$function = filter["function"]) != null ? _filter$function : 'none'
-              }, dataSetField, queryEngineConfig, dataSet, false, params);
-            }
-
-            // If the value is an array, and we're checking that all values ARE or ARE NOT in a field, then we need to split
-            // out this check into multiple filters, as a value in a filter cannot be an array.
-            if ((filter.op == 'array_contains' || filter.op == 'array_does_not_contain') && Array.isArray(filter.value)) {
-              return {
-                type: 'andWhere',
-                value: [].concat(filter.value).map(function (value) {
-                  return {
-                    type: 'where',
-                    value: {
-                      field: field,
-                      op: filter.op,
-                      value: value
-                    }
-                  };
-                })
-              };
-            }
-            var value = useValue(filter.value, params.variables);
-            if (isRelativeDateDefined(filter.value)) {
-              value = calculateRelativeDate(filter.value);
-            }
-            if (filterIsDate(filter)) {
-              value = getUTCDate(filter.value);
-            }
-            return {
-              type: 'where',
-              value: {
-                field: field,
-                op: filter.op,
-                value: value
-              }
-            };
-          })
-        };
-      })
-    };
-  }
-  return filter;
-};
-var isAvailable = function isAvailable(filter) {
-  return filter && isArray(filter) && isArray(filter[0]);
-};
-var isAdditionalFilter = function isAdditionalFilter(value) {
-  return value && isArray(value) && isArray(value[0]) && 'field' in value[0][0] && 'op' in value[0][0] && 'value' in value[0][0];
-};
-
-var combineFilters = function combineFilters(array1, array2) {
-  var validArray1 = array1.length > 0 && array1[0] ? array1 : [[]];
-  var validArray2 = array2.length > 0 && array2[0] ? array2 : [[]];
-
-  // If array1 has more than one sub-array, loop through each sub-array in array1
-  if (validArray1.length > 1) {
-    return validArray1.map(function (subArray) {
-      return [].concat(validArray2[0] || [], subArray || []);
-    });
-  }
-  // Otherwise, if array2 has more than one sub-array, loop through array2
-  else if (validArray2.length > 1) {
-    return validArray2.map(function (subArray) {
-      return [].concat(validArray1[0] || [], subArray || []);
-    });
-  }
-  // Default: merge both single sub-arrays
-  else {
-    return [[].concat(validArray1[0] || [], validArray2[0] || [])];
-  }
-};
-function combineForCustomMetricFilters(filters, customFilters) {
-  var combinedFilters = [];
-  if (customFilters && isAvailable(customFilters)) {
-    customFilters.forEach(function (orFilterGroup) {
-      combinedFilters = [].concat(combinedFilters, addAndFilters(filters != null ? filters : [], orFilterGroup));
-    });
-  } else {
-    combinedFilters = filters != null ? filters : [];
-  }
-  return combinedFilters;
-}
-
-var generateId = function generateId() {
-  return v4().replace(/-/g, '');
-};
-
 /**
  * Creates a new custom percentage field.
  */
@@ -1916,7 +1921,7 @@ var init$1 = function init(publicName, denominatorFieldId, denominatorAggregate,
 var build$2 = function build(customField, queryEngineConfig, dataSet, _queryHasDimension, params) {
   var _params$filterConfig$, _params$filterConfig, _customField$numerato, _customField$numerato2, _customField$denomina, _customField$denomina2;
   var localAndDashboardFilters = fromFilterConfig(params.filterConfig, dataSet, params.timeRangeOptions);
-  var _buildPercentageFilte = buildPercentageFilters(addAndFilters((_params$filterConfig$ = params == null || (_params$filterConfig = params.filterConfig) == null ? void 0 : _params$filterConfig.viewFilters) != null ? _params$filterConfig$ : [], localAndDashboardFilters), customField),
+  var _buildPercentageFilte = buildPercentageFilters(addAndFilters((_params$filterConfig$ = params == null || (_params$filterConfig = params.filterConfig) == null ? void 0 : _params$filterConfig.advancedFilter) != null ? _params$filterConfig$ : [], localAndDashboardFilters), customField),
     combinedNominatorFilters = _buildPercentageFilte.combinedNominatorFilters,
     combinedDenominatorFilters = _buildPercentageFilte.combinedDenominatorFilters;
   var left = {
@@ -1938,36 +1943,24 @@ var build$2 = function build(customField, queryEngineConfig, dataSet, _queryHasD
       filter: filterAttributeToQueryFilter(combinedDenominatorFilters || [], queryEngineConfig, dataSet, params)
     }
   };
-  var denominatorForWithinGroupingScope = buildSide(right, isAvailable(customField.denominatorFilter) ? filterAttributeToQueryFilter(combinedDenominatorFilters, queryEngineConfig, dataSet, params) : {
-    type: 'andWhere',
-    value: []
-  });
+  var denominatorForWithinGroupingScope = buildSide(right, isAvailable(customField.denominatorFilter) ? filterAttributeToQueryFilter(combinedDenominatorFilters, queryEngineConfig, dataSet, params) : []);
   return {
     type: 'maths',
-    left: buildSide(left, isAvailable(customField.numeratorFilter) ? filterAttributeToQueryFilter(combinedNominatorFilters, queryEngineConfig, dataSet, params) : {
-      type: 'andWhere',
-      value: []
-    }),
+    left: buildSide(left, isAvailable(customField.numeratorFilter) ? filterAttributeToQueryFilter(combinedNominatorFilters, queryEngineConfig, dataSet, params) : []),
     op: '/',
     right: customField.denominatorScope === 'withinGrouping' ? denominatorForWithinGroupingScope : denominatorForAllScope
   };
 };
 var buildSide = function buildSide(field, filter) {
-  var alwaysTrueFilter = {
-    type: 'andWhere',
-    value: [{
-      type: 'where',
-      value: {
-        field: {
-          type: 'number',
-          value: 2
-        },
-        op: '=',
-        value: 2
-      }
-    }]
-  };
-  var hasNumeratorFilter = filter.type === 'where' || filter.value.length > 0;
+  var alwaysTrueFilter = [[{
+    value: 1,
+    op: '=',
+    field: {
+      type: 'number',
+      value: 1
+    }
+  }]];
+  var hasNumeratorFilter = filter.length > 0 && filter[0].length > 0;
   if (!hasNumeratorFilter) {
     return {
       type: 'field',
@@ -2341,7 +2334,7 @@ var buildIfLogic = function buildIfLogic(ifLogic, dataSet, localAndDashboardFilt
   var cases = function () {
     var thenCases = ifLogic.cases.map(function (c) {
       var _params$filterConfig$, _params$filterConfig;
-      var customMetricFilter = combineForCustomMetricFilters(addAndFilters((_params$filterConfig$ = params == null || (_params$filterConfig = params.filterConfig) == null ? void 0 : _params$filterConfig.viewFilters) != null ? _params$filterConfig$ : [], localAndDashboardFilters), c.filter);
+      var customMetricFilter = combineForCustomMetricFilters(addAndFilters((_params$filterConfig$ = params == null || (_params$filterConfig = params.filterConfig) == null ? void 0 : _params$filterConfig.advancedFilter) != null ? _params$filterConfig$ : [], localAndDashboardFilters), c.filter);
       return {
         returns: buildMetric(c.returns, dataSet, params, measureAttribute),
         filter: filterAttributeToQueryFilter(customMetricFilter, queryEngineConfig, dataSet, params)
@@ -2649,33 +2642,6 @@ var mergeAttributes = function mergeAttributes(partial, existingProps) {
   return _doMerge(existingProps, partial);
 };
 
-var timeDimensionsConstants = QueryEngineConfig.Constants.timeDimensionsConstants;
-
-// All the aggregates Vizzly supports somewhere...
-// Not necessarily all the aggregates that are supported because each
-// integration could support different aggregates
-
-var id$1 = function id(metric) {
-  if (!(metric != null && metric.truncate) || (metric == null ? void 0 : metric.truncate) == 'none') return metric == null ? void 0 : metric.field;
-  return metric.field + "_" + metric.truncate;
-};
-var decodeId$1 = function decodeId(metric, supportedTimeTruncFunctions) {
-  var parts = metric.split('_');
-  var truncate = parts.pop();
-  if (truncate && !isSupportedTimeTruncFunction(supportedTimeTruncFunctions, truncate)) {
-    return null;
-  }
-  var field = parts.join('_');
-  return {
-    field: field,
-    truncate: truncate != null ? truncate : ''
-  };
-};
-var vizzlyManagedTimeDimensions = timeDimensionsConstants;
-var isSupportedTimeTruncFunction = function isSupportedTimeTruncFunction(supportedTimeFunctions, proposedFunction) {
-  return [].concat(Object.keys(supportedTimeFunctions), ['none']).includes(proposedFunction);
-};
-
 var id$2 = id;
 var decodeId$2 = decodeId;
 var hasAggregate = function hasAggregate(metric) {
@@ -10553,7 +10519,7 @@ var WaterfallChart = function WaterfallChart(config) {
       return removeField$1(attrs, fieldId, config.queryEngineConfig);
     },
     isRunnable: function isRunnable(hydrated) {
-      return hydrated.measure.length > 0 && (hydrated.dimension.length > 0 || hydrated.timeDimension !== null);
+      return hydrated.measure.length > 0;
     },
     autoGenerate: function autoGenerate(dataSet) {
       var _DataSet$buildQueryAt = buildQueryAttributes(dataSet, config.queryEngineConfig, 'waterfallChart'),
@@ -10578,8 +10544,7 @@ var WaterfallChart = function WaterfallChart(config) {
         getValues: function getValues(attrs) {
           return attrs.measure;
         },
-        testId: 'metric-input',
-        maxAllowed: 1
+        testId: 'metric-input'
       }), _extends({}, namespace(CONSTANTS$l, 'field_x_axis'), {
         fieldFilterOptions: {
           forComponent: 'waterfallChart',
@@ -10592,7 +10557,7 @@ var WaterfallChart = function WaterfallChart(config) {
         getValues: function getValues(attrs) {
           return getGroupingWithTimeDimension(attrs);
         },
-        maxAllowed: 1,
+        maxAllowed: 2,
         testId: 'add-dimension'
       }), namespace(CONSTANTS$l, 'sort'), namespace(CONSTANTS$l, 'filter'), namespace(CONSTANTS$l, 'custom_metrics'), namespace(CONSTANTS$l, 'limit')];
     },
@@ -14553,7 +14518,7 @@ var buildDefaults = function buildDefaults(partialFeatureToggles) {
   };
 };
 
-var ALL_COMPONENT_TYPES = ['barChart', 'barChartV2', 'horizontalBarChart', 'funnelChart', 'areaChart', 'areaChartV2', 'lineChart', 'lineChartV2', 'comboChartV2', 'scatterChart', 'bubbleChart', 'bubbleChartV2', 'pieChart', 'sunburstChart', 'singleStat', 'dataTable', 'basicTable', 'comboChart', 'mercatorMap', 'progress', 'richText', 'custom', 'waterfallChart', 'radarChart'];
+var ALL_COMPONENT_TYPES = ['barChart', 'bubbleChart', 'bubbleChartV2', 'horizontalBarChart', 'funnelChart', 'areaChart', 'areaChartV2', 'lineChart', 'lineChartV2', 'barChartV2', 'comboChartV2', 'scatterChart', 'pieChart', 'sunburstChart', 'singleStat', 'dataTable', 'basicTable', 'comboChart', 'mercatorMap', 'progress', 'richText', 'custom', 'waterfallChart', 'radarChart'];
 var ALL_VIZZLY_COMPONENT_TYPES = /*#__PURE__*/[].concat(ALL_COMPONENT_TYPES).filter(function (type) {
   return type != 'custom';
 });
@@ -14563,6 +14528,7 @@ var initial = function initial(attributes) {
   return {
     attributes: attributes,
     localFilters: [],
+    results: [],
     colSpan: POPULATE_ONE_CELL,
     reports: []
   };
@@ -15006,12 +14972,10 @@ var load$2 = function load$1(dumped, componentInterfaceConfig) {
   delete dumped['addOns'];
   // @ts-ignore
   delete attributes['addOns'];
-
-  // @ts-ignore
-  delete attributes['results'];
   return _extends({}, dumped, {
     localFilters: localFilters,
-    attributes: attributes
+    attributes: attributes,
+    results: []
   });
 };
 var dump$2 = function dump$1(hydrated) {
@@ -15038,6 +15002,7 @@ var saveable = function saveable(component, protectedComponent) {
     }),
     localFilters: (_component$localFilte = component.localFilters) != null ? _component$localFilte : [],
     colSpan: 1,
+    results: [],
     reports: []
   };
 };
@@ -15513,6 +15478,8 @@ var init$b = function init(overrides, includeComponentTypes, excludeComponentTyp
     var temporaryExcludedComponentTypes = [];
     // TODO: Remove this once RichText is supported in the UI
     temporaryExcludedComponentTypes.push('richText');
+    // TODO: Remove this once representation charts (aka v2 charts) are finished and working as expected
+    temporaryExcludedComponentTypes.push('areaChartV2', 'barChartV2', 'bubbleChartV2', 'comboChartV2', 'lineChartV2', 'radarChart', 'waterfallChart');
     var allowedView = filterIncludedAndExcludedViews(ALL_VIZZLY_COMPONENT_TYPES, includeComponentTypes, excludeComponentTypes ? [].concat(excludeComponentTypes, temporaryExcludedComponentTypes) : [].concat(temporaryExcludedComponentTypes));
     return allowedView.filter(function (view) {
       var hasSupportForPreAggregatedDataSets = !!getComponentInterface(view).setDataAttributesFromPreAggregatedDataSet;
@@ -23104,6 +23071,18 @@ var pickComponentFromLibraryForDisplay = function pickComponentFromLibraryForDis
     pickFromComponentLibrary: null
   });
 };
+var setResultsForComponentInDisplay = function setResultsForComponentInDisplay(state, action) {
+  var results = action.results,
+    rowIndex = action.rowIndex,
+    cellIndex = action.cellIndex;
+  var currentComponent = state.dashboard.display[rowIndex].components[cellIndex];
+  if (!currentComponent) throw 'We can only set results on an existing component on the dashboard.';
+  var newComponent = _extends({}, currentComponent, {
+    results: results
+  });
+  var newState = _setComponentInDisplayHelper(state, newComponent, rowIndex, cellIndex);
+  return _extends({}, newState);
+};
 var updateComponentLibraryAttributes = function updateComponentLibraryAttributes(state, action) {
   var libraryIndex = action.libraryIndex,
     attributes = action.attributes;
@@ -23117,6 +23096,31 @@ var updateComponentLibraryAttributes = function updateComponentLibraryAttributes
     })
   });
 };
+var setResultsForComponentInEditor = function setResultsForComponentInEditor(state, action) {
+  if (!state.componentEditor) throw 'Cannot set results for a closed editor.';
+  if (!state.componentEditor.component) throw 'Cannot set results for a non-existant component in editor.';
+  var results = action.results;
+  return _extends({}, state, {
+    componentEditor: _extends({}, state.componentEditor, {
+      component: _extends({}, state.componentEditor.component, {
+        results: results
+      })
+    })
+  });
+};
+var setResultsForComponentInLibrary = function setResultsForComponentInLibrary(state, action) {
+  var libraryIndex = action.libraryIndex,
+    results = action.results;
+  var componentLibrary = [].concat(state.dashboard.componentLibrary);
+  componentLibrary[libraryIndex] = _extends({}, componentLibrary[libraryIndex], {
+    results: results
+  });
+  return _extends({}, state, {
+    dashboard: _extends({}, state.dashboard, {
+      componentLibrary: componentLibrary
+    })
+  });
+};
 var clearModal = function clearModal(state, _action) {
   return _extends({}, state, {
     pickFromComponentLibrary: null,
@@ -23512,6 +23516,12 @@ var reducer = function reducer(pipelineTransformationOptions) {
           return clearModal(state);
         case 'updateEditorComponent':
           return updateEditorComponent(state, action);
+        case 'setResultsForComponentInDisplay':
+          return setResultsForComponentInDisplay(state, action);
+        case 'setResultsForComponentInLibrary':
+          return setResultsForComponentInLibrary(state, action);
+        case 'setResultsForComponentInEditor':
+          return setResultsForComponentInEditor(state, action);
         case 'pickComponentFromLibraryForDisplay':
           return pickComponentFromLibraryForDisplay(state, action);
         case 'setDashboard':
@@ -25900,15 +25910,149 @@ var filterStyles = /*#__PURE__*/Object.assign(function () {
   complete: complete
 });
 
+var Clause = /*#__PURE__*/function (Clause) {
+  Clause["AND_WHERE"] = "andWhere";
+  Clause["OR_WHERE"] = "orWhere";
+  Clause["WHERE"] = "where";
+  return Clause;
+}({});
+
+// export type WhereClause = SqlAST.MultiWhereToken<any>;
+
+var filterConfigToWhere = function filterConfigToWhere(dataSet, queryEngineConfig, params) {
+  if (!params) return undefined;
+  var filterConfig = params.filterConfig;
+  if (!params || !filterConfig || (!filterConfig.globalFilters || filterConfig.globalFilters.length === 0) && (!filterConfig.localFilters || filterConfig.localFilters.length === 0) && (!filterConfig.advancedFilter || filterConfig.advancedFilter.length === 0 || filterConfig.advancedFilter.every(function (arr) {
+    return arr.length === 0;
+  }))) {
+    return undefined;
+  }
+  var dash = buildAndWhere(dataSet, queryEngineConfig, params, filterConfig.globalFilters);
+  var local = buildAndWhere(dataSet, queryEngineConfig, params, filterConfig.localFilters);
+  var advancedFilters = buildFromFiltersArray(dataSet, queryEngineConfig, params, filterConfig.advancedFilter);
+  var combinedAndWhere = [dash, local, advancedFilters].filter(Boolean).filter(function (whereClause) {
+    return whereClause && whereClause.value.length > 0;
+  });
+  if (combinedAndWhere.length === 0) return undefined;
+  return {
+    type: Clause.AND_WHERE,
+    value: combinedAndWhere
+  };
+};
+var buildAndWhere = function buildAndWhere(dataSet, queryEngineConfig, params, additionalFilters) {
+  if (!additionalFilters || additionalFilters.length === 0) return undefined;
+  var whereClauses = [];
+  additionalFilters.forEach(function (additionalFilter) {
+    if (additionalFilter.type === DATE_AND_TIME_FILTER || additionalFilter.type === DATE_FILTER) {
+      toRelativeQueryAttributesFilters(additionalFilter, dataSet).forEach(function (f) {
+        whereClauses.push(buildWhereFromSingleFilter(dataSet, f, queryEngineConfig, params));
+      });
+    }
+    if (Array.isArray(additionalFilter.value) && additionalFilter.value.length > 1 && isAdditionalFilter(additionalFilter.value)) {
+      additionalFilter.appliesToFields.flatMap(function (field) {
+        if (field.dataSetId != dataSet.id) return [];
+        var convertedToWhere = buildFromFiltersArray(dataSet, queryEngineConfig, params, additionalFilter.value);
+        if (convertedToWhere) {
+          whereClauses.push(convertedToWhere);
+        }
+        return;
+      });
+    } else {
+      toQueryAttributesFilter(dataSet, additionalFilter, params.timeRangeOptions).forEach(function (f) {
+        whereClauses.push(buildWhereFromSingleFilter(dataSet, f, queryEngineConfig, params));
+      });
+    }
+  });
+  return {
+    type: Clause.AND_WHERE,
+    value: whereClauses
+  };
+};
+var buildWhereFromSingleFilter = function buildWhereFromSingleFilter(dataSet, f, queryEngineConfig, params) {
+  var field;
+  if (f["function"] && !isSupportedTimeTruncFunction(queryEngineConfig.supportedTimeTruncFunctions, f["function"])) {
+    throw "Query engine does not support the query function " + f["function"] + ".";
+  }
+  var dataSetField = findField(dataSet, f.field);
+  if (isCustomField(dataSetField)) {
+    var _f$function;
+    field = toQueryMeasure({
+      field: dataSetField.id,
+      "function": (_f$function = f["function"]) != null ? _f$function : 'none'
+    }, dataSetField, queryEngineConfig, dataSet, false, params);
+  } else {
+    var _decodedField$functio;
+    var decodedField = decodeId(f.field, queryEngineConfig);
+    field = {
+      type: 'field',
+      value: decodedField.field,
+      "function": (_decodedField$functio = decodedField["function"]) != null ? _decodedField$functio : 'none'
+    };
+  }
+  if ((f.op == 'array_contains' || f.op == 'array_does_not_contain') && Array.isArray(f.value)) {
+    return arrayContainsFilters(f, dataSet, queryEngineConfig, params);
+  }
+  var value = useValue(f.value, params.variables);
+  if (isRelativeDateDefined(f.value)) {
+    value = calculateRelativeDate(f.value);
+  }
+  if (filterIsDate(f)) {
+    value = getUTCDate(f.value);
+  }
+  return {
+    type: Clause.WHERE,
+    value: {
+      op: f.op,
+      value: value,
+      field: field
+    }
+  };
+};
+var buildFromFiltersArray = function buildFromFiltersArray(dataSet, queryEngineConfig, params, filters) {
+  if (!filters || filters.length === 0 || filters.every(function (arr) {
+    return arr.length === 0;
+  })) {
+    return undefined;
+  }
+  if (filters.length === 1) return buildFromFilters(filters[0], dataSet, queryEngineConfig, params);
+  return {
+    type: Clause.OR_WHERE,
+    value: filters.map(function (filter) {
+      return buildFromFilters(filter, dataSet, queryEngineConfig, params);
+    })
+  };
+};
+var buildFromFilters = function buildFromFilters(filter, dataSet, queryEngineConfig, params) {
+  return {
+    type: Clause.AND_WHERE,
+    value: filter.map(function (filter) {
+      if ((filter.op == 'array_contains' || filter.op == 'array_does_not_contain') && Array.isArray(filter.value)) {
+        return arrayContainsFilters(filter, dataSet, queryEngineConfig, params);
+      }
+      return buildWhereFromSingleFilter(dataSet, filter, queryEngineConfig, params);
+    })
+  };
+};
+var arrayContainsFilters = function arrayContainsFilters(filter, dataSet, queryEngineConfig, params) {
+  return {
+    type: Clause.AND_WHERE,
+    value: [].concat(filter.value).map(function (value) {
+      return buildWhereFromSingleFilter(dataSet, _extends({}, filter, {
+        value: value
+      }), queryEngineConfig, params);
+    })
+  };
+};
+
 var addMeasure = function addMeasure(current, toAdd) {
   return [[].concat(current, [toAdd]), current.length];
 };
-var buildFromQueryAttributes = function buildFromQueryAttributes(dataSet, measureAttr, filterAttr, orderAttr, dimensionAttr, timeDimensionAttr, limitAttr, offsetAttr, queryEngineConfig, params) {
+var buildFromQueryAttributes = function buildFromQueryAttributes(dataSet, measureAttr, orderAttr, dimensionAttr, timeDimensionAttr, limitAttr, offsetAttr, queryEngineConfig, params, prebuiltFilters) {
   var measureDescription = [];
   var measure = [];
   var group = [];
   var order = [];
-  var filters = filterAttributeToQueryFilter(filterAttr, queryEngineConfig, dataSet, params);
+  var filters = buildFilters(dataSet, queryEngineConfig, params, prebuiltFilters);
   if (timeDimensionAttr) {
     // Add the measure for the time field.
     var addedAt = undefined;
@@ -25966,19 +26110,24 @@ var buildFromQueryAttributes = function buildFromQueryAttributes(dataSet, measur
       field: findField(dataSet, individualMeasure.field)
     }]);
   });
-  orderAttr.forEach(function (orderItem) {
+  orderAttr.forEach(function (apiQueryOrderItem) {
     var index = measure.findIndex(function (individualMeasure) {
       if (individualMeasure.type == 'field') {
-        var sameFunction = individualMeasure["function"] == orderItem["function"];
-        var sameField = individualMeasure.value == orderItem.field;
+        var sameFunction = individualMeasure["function"] == apiQueryOrderItem["function"];
+        // const isTimeFunc = Object.keys(queryEngineConfig.supportedTimeTruncFunctions).includes(
+        //   individualMeasure.function
+        // );
+        var sameField = individualMeasure.value == apiQueryOrderItem.field;
         return sameField && sameFunction;
+
+        // return found;
       }
       return false;
     });
     if (index >= 0) {
       order = [].concat(order, [{
         index: index,
-        direction: orderItem.direction
+        direction: apiQueryOrderItem.direction
       }]);
     }
   });
@@ -26003,6 +26152,7 @@ var buildFromQueryAttributes = function buildFromQueryAttributes(dataSet, measur
       dataSetId: dataSet.id,
       measure: measure,
       group: group,
+      // TODO: Fix this type
       filter: filters,
       order: order,
       limit: limitAttr,
@@ -26011,6 +26161,19 @@ var buildFromQueryAttributes = function buildFromQueryAttributes(dataSet, measur
     measureDescription: measureDescription
   };
 };
+var buildFilters = function buildFilters(dataSet, queryEngineConfig, params, prebuiltFilters) {
+  if (prebuiltFilters && prebuiltFilters.length > 0) {
+    var filter = [];
+    prebuiltFilters.forEach(function (andFilters) {
+      var newAndFilters = filterAttributeToQueryFilter([andFilters], queryEngineConfig, dataSet, params);
+      filter = [].concat(filter, [newAndFilters[0]]);
+    });
+    return filter;
+  }
+  var whereClause = filterConfigToWhere(dataSet, queryEngineConfig, params);
+  if (whereClause) return whereClause;
+  return [];
+};
 
 var build$c = buildFromQueryAttributes;
 var hasDimensions = function hasDimensions(query) {
@@ -26038,10 +26201,7 @@ var buildUniqueArrayValuesPreparedQuery = function buildUniqueArrayValuesPrepare
       preparedQueryType: 'uniqueArrayValues',
       dataSetId: dataSetId,
       fieldId: dataSetField.id,
-      filter: optionsFilters || {
-        type: 'andWhere',
-        value: []
-      }
+      filter: optionsFilters || []
     },
     resultFields: [{
       id: dataSetField.id,
@@ -26088,16 +26248,9 @@ var watchDataSetFieldChanges = function watchDataSetFieldChanges(dataSet, querya
     // Custom fields are the only ones that can have their definition changed. So
     // we only need to watch them.
     var watchedCustomFields = watchFields.flatMap(function (fieldId) {
-      try {
-        var dataSetField = findField(dataSet, fieldId);
-        if (isCustomField(dataSetField)) return [dataSetField];
-        return [];
-      } catch (err) {
-        if (err instanceof FieldNotFoundInDataSet) {
-          return [];
-        }
-        throw err;
-      }
+      var dataSetField = findField(dataSet, fieldId);
+      if (isCustomField(dataSetField)) return [dataSetField];
+      return [];
     });
     return JSON.stringify(watchedCustomFields);
   } else {
@@ -26257,70 +26410,78 @@ var useVariablesInDataSet = function useVariablesInDataSet(dataSet, queryable, v
 // How to make sure the queries run when a field in a data set has been changed.
 // need to pass in the data sets here
 
-var useQueryEffect = function useQueryEffect(queries, runQueriesCallback, filterConfig, dataSet, componentType, variables) {
-  var _useState = useState([]),
-    results = _useState[0],
-    setResults = _useState[1];
-  var _useState2 = useState(false),
-    queriesAreChanging = _useState2[0],
-    setQueriesAreChanging = _useState2[1];
+var useQueryEffect = function useQueryEffect(queries, runQueriesCallback, onResultsCallback, filterConfig, dataSet, componentType, variables) {
+  var _useState = useState(false),
+    queriesAreChanging = _useState[0],
+    setQueriesAreChanging = _useState[1];
   var _useVariablesInDataSe = useVariablesInDataSet(dataSet, queries, variables),
     noOfVariableChanges = _useVariablesInDataSe.noOfVariableChanges;
-  var watchCustomFieldChangesKey = watchDataSetFieldChanges(dataSet, queries);
-  useEffect(function () {
-    var abortController = new AbortController();
-    var fetch$1 = /*#__PURE__*/function () {
-      var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-        var hasResults;
-        return _regeneratorRuntime().wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              setQueriesAreChanging(true);
-              _context.next = 3;
-              return fetch(queries, runQueriesCallback, abortController.signal, filterConfig);
-            case 3:
-              hasResults = _context.sent;
-              if (hasResults) {
-                setQueriesAreChanging(false);
-                if (!abortController.signal.aborted) {
-                  // Only set the results if the signal was not aborted...
-                  setResults(hasResults);
-                }
-              } else {
-                if (Array.isArray(queries)) {
-                  setResults(queries.map(function (_q) {
-                    return null;
-                  }));
+  try {
+    var watchCustomFieldChangesKey = watchDataSetFieldChanges(dataSet, queries);
+    useEffect(function () {
+      var abortController = new AbortController();
+      var fetch$1 = /*#__PURE__*/function () {
+        var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+          var hasResults;
+          return _regeneratorRuntime().wrap(function _callee$(_context) {
+            while (1) switch (_context.prev = _context.next) {
+              case 0:
+                setQueriesAreChanging(true);
+                _context.next = 3;
+                return fetch(queries, runQueriesCallback, abortController.signal, filterConfig);
+              case 3:
+                hasResults = _context.sent;
+                if (hasResults) {
+                  setQueriesAreChanging(false);
+                  if (!abortController.signal.aborted) {
+                    // Only set the results if the signal was not aborted...
+                    onResultsCallback(hasResults);
+                  }
                 } else {
-                  setResults([null]);
+                  if (Array.isArray(queries)) {
+                    onResultsCallback(queries.map(function (_q) {
+                      return null;
+                    }));
+                  } else {
+                    onResultsCallback([null]);
+                  }
                 }
-              }
-            case 5:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function fetch() {
-        return _ref.apply(this, arguments);
+              case 5:
+              case "end":
+                return _context.stop();
+            }
+          }, _callee);
+        }));
+        return function fetch() {
+          return _ref.apply(this, arguments);
+        };
+      }();
+      fetch$1();
+      return function () {
+        abortController.abort('useQueryEffect unmounted');
       };
-    }();
-    fetch$1();
-    return function () {
-      abortController.abort('useQueryEffect unmounted');
+    }, [JSON.stringify({
+      componentType: componentType,
+      dataSetId: dataSet.id,
+      queries: queries,
+      filterConfig: filterConfig,
+      watchCustomFieldChangesKey: watchCustomFieldChangesKey,
+      noOfVariableChanges: noOfVariableChanges
+    })]);
+    return {
+      queriesAreChanging: queriesAreChanging
     };
-  }, [JSON.stringify({
-    componentType: componentType,
-    dataSetId: dataSet.id,
-    queries: queries,
-    filterConfig: filterConfig,
-    watchCustomFieldChangesKey: watchCustomFieldChangesKey,
-    noOfVariableChanges: noOfVariableChanges
-  })]);
-  return {
-    results: results,
-    queriesAreChanging: queriesAreChanging
-  };
+  } catch (err) {
+    setQueriesAreChanging(false);
+    if (err instanceof FieldNotFoundInDataSet) {
+      return {
+        queriesAreChanging: false
+      };
+    }
+
+    // Re-throw
+    throw err;
+  }
 };
 
 /** Fetches unique field values for a given field. */
@@ -26329,6 +26490,9 @@ var useUniqueFieldValues = function useUniqueFieldValues(dataSet, fieldId) {
     runQueriesCallback = _useDashboardContext.runQueriesCallback;
   var _useDashboardBehaviou = useDashboardBehaviourContext(),
     variables = _useDashboardBehaviou.variables;
+  var _useState = useState(undefined),
+    result = _useState[0],
+    setResult = _useState[1];
   var queries = [];
   var dataSetField = findField(dataSet, fieldId);
   if (dataSetField.dataType == 'string[]') {
@@ -26340,9 +26504,10 @@ var useUniqueFieldValues = function useUniqueFieldValues(dataSet, fieldId) {
     var filterQuery = buildFilterQuery(dataSet, fieldId);
     queries = [filterQuery];
   }
-  var _useQueryEffect = useQueryEffect(queries, runQueriesCallback, {}, dataSet, undefined, variables),
-    _useQueryEffect$resul = _useQueryEffect.results,
-    result = _useQueryEffect$resul[0];
+  useQueryEffect(queries, runQueriesCallback, function (results) {
+    if (results === null) setResult(null);
+    if (results) setResult(results[0]);
+  }, {}, dataSet, undefined, variables);
   return {
     result: result != null ? result : null,
     loading: result === undefined,
@@ -26764,7 +26929,7 @@ var useEditor = function useEditor() {
             /* Infinite re-render loop
               - When chaning dataset
               - If not using default metric / grouping
-              - Only when switching to 'Stock data' not to another dataset
+              - Only when switching to 'Stock data' not to another dataset 
             */
 
             dispatch({
@@ -26781,6 +26946,12 @@ var useEditor = function useEditor() {
       return _ref2.apply(this, arguments);
     };
   }();
+  var setResults = function setResults(results) {
+    dispatch({
+      type: 'setResultsForComponentInEditor',
+      results: results
+    });
+  };
   var setDataSets = function setDataSets(dataSets) {
     dispatch({
       type: 'setDataSets',
@@ -26852,6 +27023,7 @@ var useEditor = function useEditor() {
     numberFormatOptions: numberFormatOptions,
     setAttributes: setAttributes,
     setPartialAttributes: setPartialAttributes,
+    setResults: setResults,
     mode: mode,
     origin: origin,
     componentEditor: componentEditor,
@@ -33242,28 +33414,26 @@ var Legend = function Legend(props) {
   });
 };
 
-var useXAxisLabelCount = function useXAxisLabelCount(override, forceXAxisAsTime, horizontal) {
+var useXAxisLabelCount = function useXAxisLabelCount(override, forceXAxisAsTime) {
   var ref = useRef(null);
   var _useState = useState(0),
-    size = _useState[0],
-    setSize = _useState[1];
+    width = _useState[0],
+    setWidth = _useState[1];
   useEffect(function () {
     var handleResize = throttle(function () {
-      if (!ref.current) return;
-      var measurement = horizontal ? ref.current.clientHeight : ref.current.clientWidth;
-      setSize(measurement);
+      setWidth(ref.current ? ref.current.clientWidth : 0);
     }, 100);
     handleResize();
-    window.addEventListener('resize', handleResize);
+    window.addEventListener('resize', function () {
+      return handleResize;
+    });
     return function () {
       window.removeEventListener('resize', handleResize);
-      handleResize.cancel();
     };
   });
-  if (override !== 'auto') return [ref, override];
-  var approximateTickCount = Math.min(size < 1000 ? parseInt(("" + size)[0]) : 12, 12);
-  var multiplier = horizontal || forceXAxisAsTime ? 4 : 1;
-  return [ref, approximateTickCount * multiplier];
+  var approximateXTickCount = Math.min(width < 1000 ? parseInt(("" + width)[0]) : 12, 12);
+  if (override != 'auto') return [ref, override];
+  return [ref, approximateXTickCount * (forceXAxisAsTime ? 4 : 1)];
 };
 
 var buildTooltipStyles = function buildTooltipStyles(_ref) {
@@ -34005,7 +34175,7 @@ var VizzlyXYChart = function VizzlyXYChart(props) {
       scaleToFit: 'shrink-only'
     };
   };
-  var _useXAxisLabelCount = useXAxisLabelCount(approxXAxisLabelCount, props == null ? void 0 : props.forceXAxisAsTime, props == null ? void 0 : props.horizontal),
+  var _useXAxisLabelCount = useXAxisLabelCount(approxXAxisLabelCount, !(props != null && props.horizontal) && (props == null ? void 0 : props.forceXAxisAsTime)),
     widthRef = _useXAxisLabelCount[0],
     approximateXTickCount = _useXAxisLabelCount[1];
   var _useState = useState(undefined),
@@ -35247,6 +35417,9 @@ var HeadlineStats = function HeadlineStats(props) {
   var _props$component$attr, _props$component$attr2, _attributes$viewId, _props$dashboardBehav;
   var _useDashboardBehaviou = useDashboardBehaviourContext(),
     queryEngineConfig = _useDashboardBehaviou.queryEngineConfig;
+  var _useState = useState([]),
+    results = _useState[0],
+    setResults = _useState[1];
   var comparisonEnabled = Object.keys(props.component.attributes.timeDimension || {}).length !== 0 && ((_props$component$attr = props.component.attributes.headline) == null ? void 0 : _props$component$attr.func) === 'current';
   var deltaTimeDimension = function () {
     if (!comparisonEnabled) return null;
@@ -35268,12 +35441,11 @@ var HeadlineStats = function HeadlineStats(props) {
     measure: measure,
     filter: props.component.attributes.filter
   });
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, setResults, {
       localFilters: props.component.localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return jsx(View, {
     minHeight: comparisonEnabled ? 80 : 56,
     children: jsx(SingleStatView, _extends({}, attributes, {
@@ -35561,14 +35733,17 @@ var AreaChart$4 = function AreaChart(props) {
     onDrilldown = _useState[0],
     setOnDrilldown = _useState[1];
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: props.component.localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
+  var componentInterface = getComponentInterface(props.component.attributes.type, {
+    queryEngineConfig: props.dashboardBehaviour.queryEngineConfig
+  });
   return jsxs(Fragment, {
     children: [jsx(memoized, _extends({
       id: props.id
@@ -36801,18 +36976,16 @@ var usePreAggregatedDataSet = function usePreAggregatedDataSet(dataSet, attribut
   })]);
 };
 
-var useComponentEffect = function useComponentEffect(attributes, dataSet, queryEngineConfig, filterConfig, updateComponentAttributes, runQueriesCallback, variables) {
+var useComponentEffect = function useComponentEffect(attributes, dataSet, queryEngineConfig, filterConfig, updateComponentAttributes, runQueriesCallback, setResults, variables) {
   var queryable = attributes;
   if (dataSet.preAggregated) {
     queryable = [buildViewOnlyQuery(dataSet)];
   }
   usePreAggregatedDataSet(dataSet, attributes, queryEngineConfig, updateComponentAttributes);
-  var _useQueryEffect = useQueryEffect(queryable, runQueriesCallback, filterConfig, dataSet, attributes.type, variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+  var _useQueryEffect = useQueryEffect(queryable, runQueriesCallback, setResults, filterConfig, dataSet, attributes.type, variables),
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return {
-    queriesAreChanging: queriesAreChanging,
-    results: results
+    queriesAreChanging: queriesAreChanging
   };
 };
 
@@ -36864,7 +37037,9 @@ function useDrilldownSelection(results, attributes, setAttributes, dataSet, quer
 
 var BarChart$4 = function BarChart(props) {
   var _props$dashboardBehav;
-  var localFilters = props.component.localFilters;
+  var _props$component = props.component,
+    localFilters = _props$component.localFilters,
+    results = _props$component.results;
   var dashboardBehaviour = props.dashboardBehaviour;
   var _useState = useState(props.component.attributes),
     attributes = _useState[0],
@@ -36875,18 +37050,17 @@ var BarChart$4 = function BarChart(props) {
       setDrilldownSelections([]);
     }
   }, [JSON.stringify(props.component.attributes)]);
-  var _useComponentEffect = useComponentEffect(attributes, props.dataSet, props.dashboardBehaviour.queryEngineConfig, {
-      localFilters: localFilters,
-      globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
   var _useDrilldownSelectio = useDrilldownSelection(results, attributes, function (newAttributes) {
       return setAttributes(newAttributes);
     }, props.dataSet, dashboardBehaviour.queryEngineConfig),
     onDrilldownChange = _useDrilldownSelectio.onDrilldownChange,
     setDrilldownSelections = _useDrilldownSelectio.setDrilldownSelections,
     drilldownSelections = _useDrilldownSelectio.drilldownSelections;
+  var _useComponentEffect = useComponentEffect(drilldownSelections.length > 0 ? attributes : props.component.attributes, props.dataSet, props.dashboardBehaviour.queryEngineConfig, {
+      localFilters: localFilters,
+      globalFilters: props.globalFilters
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults, props.dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   var runViewClickQuery = /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(queries, existingField) {
       var filter, attributes, abortController, queryResults;
@@ -37193,14 +37367,14 @@ var LineChart$4 = function LineChart(props) {
     onDrilldown = _useState[0],
     setOnDrilldown = _useState[1];
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
   var _useComponentEffect = useComponentEffect(attributes, props.dataSet, props.dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults, props.dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   return jsxs(Fragment, {
     children: [jsx(memoized$1, _extends({
       id: props.id
@@ -37414,14 +37588,14 @@ var memoized$2 = /*#__PURE__*/memo(ScatterChartView, shouldUpdate);
 var ScatterChart$3 = function ScatterChart(props) {
   var _props$dashboardBehav;
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return jsx(memoized$2, _extends({
     id: props.id
   }, attributes, {
@@ -38797,7 +38971,9 @@ var memoized$3 = /*#__PURE__*/memo(PieChartView, shouldUpdate);
 
 var PieChart$3 = function PieChart(props) {
   var _props$dashboardBehav;
-  var localFilters = props.component.localFilters;
+  var _props$component = props.component,
+    results = _props$component.results,
+    localFilters = _props$component.localFilters;
   var dashboardBehaviour = props.dashboardBehaviour;
   var _useState = useState(props.component.attributes),
     attributes = _useState[0],
@@ -38808,18 +38984,17 @@ var PieChart$3 = function PieChart(props) {
       setDrilldownSelections([]);
     }
   }, [JSON.stringify(props.component.attributes)]);
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
-      localFilters: localFilters,
-      globalFilters: props.globalFilters
-    }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
   var _useDrilldownSelectio = useDrilldownSelection(results, attributes, function (newAttributes) {
       return setAttributes(newAttributes);
     }, props.dataSet, dashboardBehaviour.queryEngineConfig),
     onDrilldownChange = _useDrilldownSelectio.onDrilldownChange,
     setDrilldownSelections = _useDrilldownSelectio.setDrilldownSelections,
     drilldownSelections = _useDrilldownSelectio.drilldownSelections;
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
+      localFilters: localFilters,
+      globalFilters: props.globalFilters
+    }, props.dataSet, undefined, props.dashboardBehaviour.variables),
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   var runViewClickQuery = /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(queries, existingField) {
       var filter, attributes, abortController, queryResults;
@@ -42949,14 +43124,14 @@ var memoized$4 = /*#__PURE__*/memo(BubbleChartView, shouldUpdate);
 var BubbleChart$3 = function BubbleChart(props) {
   var _props$dashboardBehav;
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return jsx(memoized$4, _extends({
     id: props.id
   }, attributes, {
@@ -43319,9 +43494,7 @@ var Tooltip$1 = function Tooltip(_ref) {
     xKey = _ref.xKey,
     yKeys = _ref.yKeys,
     theme = _ref.theme,
-    items = _ref.items,
-    _ref$shouldShowColorL = _ref.shouldShowColorLegend,
-    shouldShowColorLegend = _ref$shouldShowColorL === void 0 ? true : _ref$shouldShowColorL;
+    items = _ref.items;
   var tooltipRef = useRef(null);
   var _useState = useState({
       left: tooltipLeft
@@ -43370,7 +43543,7 @@ var Tooltip$1 = function Tooltip(_ref) {
           fontSize: '15px',
           width: '100%',
           minWidth: MIN_TOOLTIP_WIDTH
-        }, process.env.NODE_ENV === "production" ? "" : ";label:Tooltip;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZGcUIiLCJmaWxlIjoiVG9vbHRpcC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgQ1NTUHJvcGVydGllcywgRnJhZ21lbnQsIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNyZWF0ZVBvcnRhbCB9IGZyb20gJ3JlYWN0LWRvbSc7XG5cbmltcG9ydCB7IGdldENvbG9yIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgTGVnZW5kSXRlbUJveCB9IGZyb20gJy4uL0xlZ2VuZC9MZWdlbmRJdGVtQm94JztcbmltcG9ydCB7IFNoYXBlRGVmaW5pdGlvbiwgQ29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZSwgRGF0YUl0ZW0sIEtleSB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQ2hhcnRzVjIvdHlwZXMnO1xuaW1wb3J0IHsgTGluZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvTGluZUNoYXJ0VjIvdHlwZXMnO1xuaW1wb3J0IHsgQmFyU3R5bGVzIH0gZnJvbSAnc2hhcmVkLWxvZ2ljL3NyYy9CYXJDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEFyZWFTdHlsZXMgfSBmcm9tICdzaGFyZWQtbG9naWMvc3JjL0FyZWFDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEJ1YmJsZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQnViYmxlQ2hhcnRWMi90eXBlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jc3MnO1xuXG5jb25zdCBNSU5fVE9PTFRJUF9XSURUSCA9IDE4MDtcbmNvbnN0IFRPT0xUSVBfT0ZGU0VUID0gMjA7XG5jb25zdCBTQ1JPTExCQVJfV0lEVEggPSA0MDtcblxuaW50ZXJmYWNlIFRvb2x0aXBQcm9wczxUPiB7XG4gIGtleXM6IHsgW2tleTogc3RyaW5nXTogS2V5IH07XG4gIHNob3dSb3VuZGVkVG90YWw6IGJvb2xlYW47XG4gIHRvb2x0aXBEYXRhOiB7XG4gICAgW2tleUlkOiBzdHJpbmddOiBEYXRhSXRlbTtcbiAgfTtcbiAgdG9vbHRpcExlZnQ6IG51bWJlcjtcbiAgdG9vbHRpcFRvcDogbnVtYmVyO1xuICB4S2V5OiBzdHJpbmc7XG4gIHlLZXlzPzogc3RyaW5nW107XG4gIGl0ZW1zOiB7XG4gICAgbGVnZW5kSXRlbXM6IEFycmF5PFNoYXBlRGVmaW5pdGlvbjxUPj47XG4gICAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IEFycmF5PENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGU+O1xuICAgIHZpc2libGVZS2V5czogc3RyaW5nW107XG4gIH1bXTtcbiAgdGhlbWU6IENTU1Byb3BlcnRpZXM7XG4gIHNob3VsZFNob3dDb2xvckxlZ2VuZD86IGJvb2xlYW47XG59XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gKHtcbiAga2V5cyxcbiAgc2hvd1JvdW5kZWRUb3RhbCxcbiAgdG9vbHRpcERhdGEsXG4gIHRvb2x0aXBMZWZ0LFxuICB0b29sdGlwVG9wLFxuICB4S2V5LFxuICB5S2V5cyxcbiAgdGhlbWUsXG4gIGl0ZW1zLFxuICBzaG91bGRTaG93Q29sb3JMZWdlbmQgPSB0cnVlLFxufTogVG9vbHRpcFByb3BzPExpbmVTdHlsZXMgfCBCYXJTdHlsZXMgfCBBcmVhU3R5bGVzIHwgQnViYmxlU3R5bGVzPikgPT4ge1xuICBjb25zdCB0b29sdGlwUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50PihudWxsKTtcbiAgY29uc3QgW3Bvc2l0aW9uLCBzZXRQb3NpdGlvbl0gPSB1c2VTdGF0ZTx7IGxlZnQ6IG51bWJlciB9Pih7XG4gICAgbGVmdDogdG9vbHRpcExlZnQsXG4gIH0pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgYWRqdXN0VG9vbHRpcFBvc2l0aW9uID0gKCkgPT4ge1xuICAgICAgY29uc3QgdG9vbHRpcEVsZW1lbnQgPSB0b29sdGlwUmVmLmN1cnJlbnQ7XG5cbiAgICAgIGlmICh0b29sdGlwRWxlbWVudCkge1xuICAgICAgICBjb25zdCBzY3JlZW5XaWR0aCA9IHdpbmRvdy5pbm5lcldpZHRoO1xuXG4gICAgICAgIGNvbnN0IHJlY3QgPSB0b29sdGlwRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcblxuICAgICAgICBsZXQgd2lkdGggPSByZWN0LndpZHRoO1xuXG4gICAgICAgIGlmICh3aWR0aCA8IE1JTl9UT09MVElQX1dJRFRIKSB7XG4gICAgICAgICAgd2lkdGggPSBNSU5fVE9PTFRJUF9XSURUSDtcbiAgICAgICAgfVxuXG4gICAgICAgIGxldCBsZWZ0ID0gdG9vbHRpcExlZnQgKyBUT09MVElQX09GRlNFVDtcblxuICAgICAgICBpZiAodG9vbHRpcExlZnQgKyB3aWR0aCA+IHNjcmVlbldpZHRoIC0gU0NST0xMQkFSX1dJRFRIKSB7XG4gICAgICAgICAgbGVmdCA9IHRvb2x0aXBMZWZ0IC0gd2lkdGggLSBUT09MVElQX09GRlNFVDtcbiAgICAgICAgfVxuXG4gICAgICAgIHNldFBvc2l0aW9uKHsgbGVmdCB9KTtcbiAgICAgIH1cbiAgICB9O1xuXG4gICAgYWRqdXN0VG9vbHRpcFBvc2l0aW9uKCk7XG4gIH0sIFt0b29sdGlwTGVmdF0pO1xuXG4gIHJldHVybiBjcmVhdGVQb3J0YWwoXG4gICAgPGRpdlxuICAgICAgcmVmPXt0b29sdGlwUmVmfVxuICAgICAgc3R5bGU9e3tcbiAgICAgICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgICAgIGxlZnQ6IHBvc2l0aW9uLmxlZnQsXG4gICAgICAgIHRvcDogdG9vbHRpcFRvcCxcbiAgICAgICAgekluZGV4OiAyMTQ3NDgzNjQ3ICogMTAsXG4gICAgICAgIC4uLnRoZW1lLFxuICAgICAgfX1cbiAgICA+XG4gICAgICA8ZGl2IHN0eWxlPXt7IHdvcmRCcmVhazogJ2JyZWFrLWFsbCcgfX0+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBmb250RmFtaWx5OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsaW5lSGVpZ2h0OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsZXR0ZXJTcGFjaW5nOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBmb250V2VpZ2h0OiAnYm9sZCcsXG4gICAgICAgICAgICBmb250U2l6ZTogJzE1cHgnLFxuICAgICAgICAgICAgd2lkdGg6ICcxMDAlJyxcbiAgICAgICAgICAgIG1pbldpZHRoOiBNSU5fVE9PTFRJUF9XSURUSCxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIHt0b29sdGlwRGF0YVt4S2V5XT8uZm9ybWF0dGVkVmFsdWUgPz8gdG9vbHRpcERhdGFbeEtleV0udmFsdWV9XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8dGFibGVcbiAgICAgICAgICBjZWxsUGFkZGluZz17MH1cbiAgICAgICAgICBjZWxsU3BhY2luZz17MH1cbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBtYXJnaW46ICcwJyxcbiAgICAgICAgICAgIGJvcmRlclNwYWNpbmc6ICcwJyxcbiAgICAgICAgICAgIGJvcmRlckNvbGxhcHNlOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBib3JkZXI6ICdub25lJyxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIDx0Ym9keT5cbiAgICAgICAgICAgIHtpdGVtcy5tYXAoKGl0ZW0sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgPEZyYWdtZW50IGtleT17aW5kZXh9PlxuICAgICAgICAgICAgICAgICAge2l0ZW0ubGVnZW5kSXRlbXM/Lm1hcCgobGVnZW5kSXRlbSwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgaWYgKCF0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldIHx8IHRvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWUgPT09IG51bGwpIHtcbiAgICAgICAgICAgICAgICAgICAgICAvLyB5S2V5IGNvdWxkIG5vdCBiZSBmb3VuZCBpbiB0b29sdGlwRGF0YVxuICAgICAgICAgICAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgICAgICAgaXRlbS52aXNpYmxlWUtleXM/LmluY2x1ZGVzKGxlZ2VuZEl0ZW0ueUtleSkgJiYgKFxuICAgICAgICAgICAgICAgICAgICAgICAgPHRyIGtleT17YCR7bGVnZW5kSXRlbS55S2V5fS0ke2luZGV4fS0ke3Rvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWV9YH0+XG4gICAgICAgICAgICAgICAgICAgICAgICAgIHtzaG91bGRTaG93Q29sb3JMZWdlbmQgJiYgKFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDx0ZFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e3tcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgdmVydGljYWxBbGlnbjogJ21pZGRsZScsXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHBhZGRpbmc6IGluZGV4ID09PSAwID8gJzEycHggOHB4IDAgMCcgOiAnOHB4IDhweCAwIDAnLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB3aWR0aDogJ2F1dG8nLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8TGVnZW5kSXRlbUJveFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb2xvcj17Z2V0Q29sb3Ioe1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGRlZmF1bHRDb2xvcjogbGVnZW5kSXRlbS5jb2xvcixcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB2YWx1ZTogdG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS52YWx1ZSxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB5S2V5OiBsZWdlbmRJdGVtLnlLZXksXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IGl0ZW0uY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXMgPz8gW10sXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBzdHlsZT17bGVnZW5kSXRlbS5zdHlsZSBhcyBMaW5lU3R5bGVzfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB5S2V5PXtsZWdlbmRJdGVtLnlLZXl9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvdGQ+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICl9XG4gICAgICAgICAgICAgICAgICAgICAgICAgIDx0ZCBzdHlsZT17eyBwYWRkaW5nOiAnOHB4IDAgMCAwJyB9fT57a2V5c1tsZWdlbmRJdGVtLnlLZXldLmtleUZvcm1hdHRlZH08L3RkPlxuICAgICAgICAgICAgICAgICAgICAgICAgICA8dGQgc3R5bGU9e3sgZm9udFdlaWdodDogJ2JvbGQnLCBwYWRkaW5nOiAnOHB4IDAgMCAxNnB4JyB9fT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB7dG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS5mb3JtYXR0ZWRWYWx1ZVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPyB0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldLmZvcm1hdHRlZFZhbHVlXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICA6IHRvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWV9XG4gICAgICAgICAgICAgICAgICAgICAgICAgIDwvdGQ+XG4gICAgICAgICAgICAgICAgICAgICAgICA8L3RyPlxuICAgICAgICAgICAgICAgICAgICAgIClcbiAgICAgICAgICAgICAgICAgICAgKTtcbiAgICAgICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgICAgIDwvRnJhZ21lbnQ+XG4gICAgICAgICAgICAgICk7XG4gICAgICAgICAgICB9KX1cblxuICAgICAgICAgICAge3Nob3dSb3VuZGVkVG90YWwgJiYgeUtleXMgJiYgKFxuICAgICAgICAgICAgICA8dHI+XG4gICAgICAgICAgICAgICAgPHRkIGNvbFNwYW49ezJ9IHN0eWxlPXt7IHBhZGRpbmc6ICcxMnB4IDAgMCAwJyB9fT5cbiAgICAgICAgICAgICAgICAgIFJvdW5kZWQgVG90YWxcbiAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICAgIDx0ZCBzdHlsZT17eyBmb250V2VpZ2h0OiAnYm9sZCcsIHBhZGRpbmc6ICcxMnB4IDAgMCAxNnB4JyB9fT5cbiAgICAgICAgICAgICAgICAgIHt5S2V5cy5yZWR1Y2UoKHRvdGFsLCBrZXkpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgcmV0dXJuIHRvdGFsICsgTWF0aC5yb3VuZCh0b29sdGlwRGF0YVtrZXldLnZhbHVlIGFzIG51bWJlcik7XG4gICAgICAgICAgICAgICAgICB9LCAwKX1cbiAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICA8L3RyPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgICA8L3Rib2R5PlxuICAgICAgICA8L3RhYmxlPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+LFxuICAgIGRvY3VtZW50LmJvZHksXG4gICk7XG59O1xuIl19 */"),
+        }, process.env.NODE_ENV === "production" ? "" : ";label:Tooltip;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJGcUIiLCJmaWxlIjoiVG9vbHRpcC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgQ1NTUHJvcGVydGllcywgRnJhZ21lbnQsIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNyZWF0ZVBvcnRhbCB9IGZyb20gJ3JlYWN0LWRvbSc7XG5cbmltcG9ydCB7IGdldENvbG9yIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgTGVnZW5kSXRlbUJveCB9IGZyb20gJy4uL0xlZ2VuZC9MZWdlbmRJdGVtQm94JztcbmltcG9ydCB7IFNoYXBlRGVmaW5pdGlvbiwgQ29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZSwgRGF0YUl0ZW0sIEtleSB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQ2hhcnRzVjIvdHlwZXMnO1xuaW1wb3J0IHsgTGluZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvTGluZUNoYXJ0VjIvdHlwZXMnO1xuaW1wb3J0IHsgQmFyU3R5bGVzIH0gZnJvbSAnc2hhcmVkLWxvZ2ljL3NyYy9CYXJDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEFyZWFTdHlsZXMgfSBmcm9tICdzaGFyZWQtbG9naWMvc3JjL0FyZWFDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEJ1YmJsZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQnViYmxlQ2hhcnRWMi90eXBlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jc3MnO1xuXG5jb25zdCBNSU5fVE9PTFRJUF9XSURUSCA9IDE4MDtcbmNvbnN0IFRPT0xUSVBfT0ZGU0VUID0gMjA7XG5jb25zdCBTQ1JPTExCQVJfV0lEVEggPSA0MDtcblxuaW50ZXJmYWNlIFRvb2x0aXBQcm9wczxUPiB7XG4gIGtleXM6IHsgW2tleTogc3RyaW5nXTogS2V5IH07XG4gIHNob3dSb3VuZGVkVG90YWw6IGJvb2xlYW47XG4gIHRvb2x0aXBEYXRhOiB7XG4gICAgW2tleUlkOiBzdHJpbmddOiBEYXRhSXRlbTtcbiAgfTtcbiAgdG9vbHRpcExlZnQ6IG51bWJlcjtcbiAgdG9vbHRpcFRvcDogbnVtYmVyO1xuICB4S2V5OiBzdHJpbmc7XG4gIHlLZXlzPzogc3RyaW5nW107XG4gIGl0ZW1zOiB7XG4gICAgbGVnZW5kSXRlbXM6IEFycmF5PFNoYXBlRGVmaW5pdGlvbjxUPj47XG4gICAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IEFycmF5PENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGU+O1xuICAgIHZpc2libGVZS2V5czogc3RyaW5nW107XG4gIH1bXTtcbiAgdGhlbWU6IENTU1Byb3BlcnRpZXM7XG59XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gKHtcbiAga2V5cyxcbiAgc2hvd1JvdW5kZWRUb3RhbCxcbiAgdG9vbHRpcERhdGEsXG4gIHRvb2x0aXBMZWZ0LFxuICB0b29sdGlwVG9wLFxuICB4S2V5LFxuICB5S2V5cyxcbiAgdGhlbWUsXG4gIGl0ZW1zLFxufTogVG9vbHRpcFByb3BzPExpbmVTdHlsZXMgfCBCYXJTdHlsZXMgfCBBcmVhU3R5bGVzIHwgQnViYmxlU3R5bGVzPikgPT4ge1xuICBjb25zdCB0b29sdGlwUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50PihudWxsKTtcbiAgY29uc3QgW3Bvc2l0aW9uLCBzZXRQb3NpdGlvbl0gPSB1c2VTdGF0ZTx7IGxlZnQ6IG51bWJlciB9Pih7XG4gICAgbGVmdDogdG9vbHRpcExlZnQsXG4gIH0pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgYWRqdXN0VG9vbHRpcFBvc2l0aW9uID0gKCkgPT4ge1xuICAgICAgY29uc3QgdG9vbHRpcEVsZW1lbnQgPSB0b29sdGlwUmVmLmN1cnJlbnQ7XG5cbiAgICAgIGlmICh0b29sdGlwRWxlbWVudCkge1xuICAgICAgICBjb25zdCBzY3JlZW5XaWR0aCA9IHdpbmRvdy5pbm5lcldpZHRoO1xuXG4gICAgICAgIGNvbnN0IHJlY3QgPSB0b29sdGlwRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcblxuICAgICAgICBsZXQgd2lkdGggPSByZWN0LndpZHRoO1xuXG4gICAgICAgIGlmICh3aWR0aCA8IE1JTl9UT09MVElQX1dJRFRIKSB7XG4gICAgICAgICAgd2lkdGggPSBNSU5fVE9PTFRJUF9XSURUSDtcbiAgICAgICAgfVxuXG4gICAgICAgIGxldCBsZWZ0ID0gdG9vbHRpcExlZnQgKyBUT09MVElQX09GRlNFVDtcblxuICAgICAgICBpZiAodG9vbHRpcExlZnQgKyB3aWR0aCA+IHNjcmVlbldpZHRoIC0gU0NST0xMQkFSX1dJRFRIKSB7XG4gICAgICAgICAgbGVmdCA9IHRvb2x0aXBMZWZ0IC0gd2lkdGggLSBUT09MVElQX09GRlNFVDtcbiAgICAgICAgfVxuXG4gICAgICAgIHNldFBvc2l0aW9uKHsgbGVmdCB9KTtcbiAgICAgIH1cbiAgICB9O1xuXG4gICAgYWRqdXN0VG9vbHRpcFBvc2l0aW9uKCk7XG4gIH0sIFt0b29sdGlwTGVmdF0pO1xuXG4gIHJldHVybiBjcmVhdGVQb3J0YWwoXG4gICAgPGRpdlxuICAgICAgcmVmPXt0b29sdGlwUmVmfVxuICAgICAgc3R5bGU9e3tcbiAgICAgICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgICAgIGxlZnQ6IHBvc2l0aW9uLmxlZnQsXG4gICAgICAgIHRvcDogdG9vbHRpcFRvcCxcbiAgICAgICAgekluZGV4OiAyMTQ3NDgzNjQ3ICogMTAsXG4gICAgICAgIC4uLnRoZW1lLFxuICAgICAgfX1cbiAgICA+XG4gICAgICA8ZGl2IHN0eWxlPXt7IHdvcmRCcmVhazogJ2JyZWFrLWFsbCcgfX0+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBmb250RmFtaWx5OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsaW5lSGVpZ2h0OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsZXR0ZXJTcGFjaW5nOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBmb250V2VpZ2h0OiAnYm9sZCcsXG4gICAgICAgICAgICBmb250U2l6ZTogJzE1cHgnLFxuICAgICAgICAgICAgd2lkdGg6ICcxMDAlJyxcbiAgICAgICAgICAgIG1pbldpZHRoOiBNSU5fVE9PTFRJUF9XSURUSCxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIHt0b29sdGlwRGF0YVt4S2V5XT8uZm9ybWF0dGVkVmFsdWUgPz8gdG9vbHRpcERhdGFbeEtleV0udmFsdWV9XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8dGFibGVcbiAgICAgICAgICBjZWxsUGFkZGluZz17MH1cbiAgICAgICAgICBjZWxsU3BhY2luZz17MH1cbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBtYXJnaW46ICcwJyxcbiAgICAgICAgICAgIGJvcmRlclNwYWNpbmc6ICcwJyxcbiAgICAgICAgICAgIGJvcmRlckNvbGxhcHNlOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBib3JkZXI6ICdub25lJyxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIDx0Ym9keT5cbiAgICAgICAgICAgIHtpdGVtcy5tYXAoKGl0ZW0sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgPEZyYWdtZW50IGtleT17aW5kZXh9PlxuICAgICAgICAgICAgICAgICAge2l0ZW0ubGVnZW5kSXRlbXM/Lm1hcCgobGVnZW5kSXRlbSwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgaWYgKCF0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldIHx8IHRvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWUgPT09IG51bGwpIHtcbiAgICAgICAgICAgICAgICAgICAgICAvLyB5S2V5IGNvdWxkIG5vdCBiZSBmb3VuZCBpbiB0b29sdGlwRGF0YVxuICAgICAgICAgICAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgICAgICAgaXRlbS52aXNpYmxlWUtleXM/LmluY2x1ZGVzKGxlZ2VuZEl0ZW0ueUtleSkgJiYgKFxuICAgICAgICAgICAgICAgICAgICAgICAgPHRyIGtleT17bGVnZW5kSXRlbS55S2V5fT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgPHRkXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e3tcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHZlcnRpY2FsQWxpZ246ICdtaWRkbGUnLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgcGFkZGluZzogaW5kZXggPT09IDAgPyAnMTJweCA4cHggMCAwJyA6ICc4cHggOHB4IDAgMCcsXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICB3aWR0aDogJ2F1dG8nLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8TGVnZW5kSXRlbUJveFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29sb3I9e2dldENvbG9yKHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgZGVmYXVsdENvbG9yOiBsZWdlbmRJdGVtLmNvbG9yLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB2YWx1ZTogdG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS52YWx1ZSxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgeUtleTogbGVnZW5kSXRlbS55S2V5LFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlczogaXRlbS5jb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlcyA/PyBbXSxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e2xlZ2VuZEl0ZW0uc3R5bGUgYXMgTGluZVN0eWxlc31cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHlLZXk9e2xlZ2VuZEl0ZW0ueUtleX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICAgICAgICAgICAgICA8dGQgc3R5bGU9e3sgcGFkZGluZzogJzhweCAwIDAgMCcgfX0+e2tleXNbbGVnZW5kSXRlbS55S2V5XS5rZXlGb3JtYXR0ZWR9PC90ZD5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgPHRkIHN0eWxlPXt7IGZvbnRXZWlnaHQ6ICdib2xkJywgcGFkZGluZzogJzhweCAwIDAgMTZweCcgfX0+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAge3Rvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0uZm9ybWF0dGVkVmFsdWVcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgID8gdG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS5mb3JtYXR0ZWRWYWx1ZVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgOiB0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldLnZhbHVlfVxuICAgICAgICAgICAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC90cj5cbiAgICAgICAgICAgICAgICAgICAgICApXG4gICAgICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgICB9KX1cbiAgICAgICAgICAgICAgICA8L0ZyYWdtZW50PlxuICAgICAgICAgICAgICApO1xuICAgICAgICAgICAgfSl9XG5cbiAgICAgICAgICAgIHtzaG93Um91bmRlZFRvdGFsICYmIHlLZXlzICYmIChcbiAgICAgICAgICAgICAgPHRyPlxuICAgICAgICAgICAgICAgIDx0ZCBjb2xTcGFuPXsyfSBzdHlsZT17eyBwYWRkaW5nOiAnMTJweCAwIDAgMCcgfX0+XG4gICAgICAgICAgICAgICAgICBSb3VuZGVkIFRvdGFsXG4gICAgICAgICAgICAgICAgPC90ZD5cbiAgICAgICAgICAgICAgICA8dGQgc3R5bGU9e3sgZm9udFdlaWdodDogJ2JvbGQnLCBwYWRkaW5nOiAnMTJweCAwIDAgMTZweCcgfX0+XG4gICAgICAgICAgICAgICAgICB7eUtleXMucmVkdWNlKCh0b3RhbCwga2V5KSA9PiB7XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiB0b3RhbCArIE1hdGgucm91bmQodG9vbHRpcERhdGFba2V5XS52YWx1ZSBhcyBudW1iZXIpO1xuICAgICAgICAgICAgICAgICAgfSwgMCl9XG4gICAgICAgICAgICAgICAgPC90ZD5cbiAgICAgICAgICAgICAgPC90cj5cbiAgICAgICAgICAgICl9XG4gICAgICAgICAgPC90Ym9keT5cbiAgICAgICAgPC90YWJsZT5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PixcbiAgICBkb2N1bWVudC5ib2R5XG4gICk7XG59O1xuIl19 */"),
         children: (_tooltipData$xKey$for = (_tooltipData$xKey = tooltipData[xKey]) == null ? void 0 : _tooltipData$xKey.formattedValue) != null ? _tooltipData$xKey$for : tooltipData[xKey].value
       }), jsx("table", {
         cellPadding: 0,
@@ -43381,7 +43554,7 @@ var Tooltip$1 = function Tooltip(_ref) {
         } : {
           name: "9a1sa-Tooltip",
           styles: "margin:0;border-spacing:0;border-collapse:inherit;border:none;label:Tooltip;",
-          map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTRHcUIiLCJmaWxlIjoiVG9vbHRpcC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgQ1NTUHJvcGVydGllcywgRnJhZ21lbnQsIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNyZWF0ZVBvcnRhbCB9IGZyb20gJ3JlYWN0LWRvbSc7XG5cbmltcG9ydCB7IGdldENvbG9yIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgTGVnZW5kSXRlbUJveCB9IGZyb20gJy4uL0xlZ2VuZC9MZWdlbmRJdGVtQm94JztcbmltcG9ydCB7IFNoYXBlRGVmaW5pdGlvbiwgQ29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZSwgRGF0YUl0ZW0sIEtleSB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQ2hhcnRzVjIvdHlwZXMnO1xuaW1wb3J0IHsgTGluZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvTGluZUNoYXJ0VjIvdHlwZXMnO1xuaW1wb3J0IHsgQmFyU3R5bGVzIH0gZnJvbSAnc2hhcmVkLWxvZ2ljL3NyYy9CYXJDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEFyZWFTdHlsZXMgfSBmcm9tICdzaGFyZWQtbG9naWMvc3JjL0FyZWFDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEJ1YmJsZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQnViYmxlQ2hhcnRWMi90eXBlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jc3MnO1xuXG5jb25zdCBNSU5fVE9PTFRJUF9XSURUSCA9IDE4MDtcbmNvbnN0IFRPT0xUSVBfT0ZGU0VUID0gMjA7XG5jb25zdCBTQ1JPTExCQVJfV0lEVEggPSA0MDtcblxuaW50ZXJmYWNlIFRvb2x0aXBQcm9wczxUPiB7XG4gIGtleXM6IHsgW2tleTogc3RyaW5nXTogS2V5IH07XG4gIHNob3dSb3VuZGVkVG90YWw6IGJvb2xlYW47XG4gIHRvb2x0aXBEYXRhOiB7XG4gICAgW2tleUlkOiBzdHJpbmddOiBEYXRhSXRlbTtcbiAgfTtcbiAgdG9vbHRpcExlZnQ6IG51bWJlcjtcbiAgdG9vbHRpcFRvcDogbnVtYmVyO1xuICB4S2V5OiBzdHJpbmc7XG4gIHlLZXlzPzogc3RyaW5nW107XG4gIGl0ZW1zOiB7XG4gICAgbGVnZW5kSXRlbXM6IEFycmF5PFNoYXBlRGVmaW5pdGlvbjxUPj47XG4gICAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IEFycmF5PENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGU+O1xuICAgIHZpc2libGVZS2V5czogc3RyaW5nW107XG4gIH1bXTtcbiAgdGhlbWU6IENTU1Byb3BlcnRpZXM7XG4gIHNob3VsZFNob3dDb2xvckxlZ2VuZD86IGJvb2xlYW47XG59XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gKHtcbiAga2V5cyxcbiAgc2hvd1JvdW5kZWRUb3RhbCxcbiAgdG9vbHRpcERhdGEsXG4gIHRvb2x0aXBMZWZ0LFxuICB0b29sdGlwVG9wLFxuICB4S2V5LFxuICB5S2V5cyxcbiAgdGhlbWUsXG4gIGl0ZW1zLFxuICBzaG91bGRTaG93Q29sb3JMZWdlbmQgPSB0cnVlLFxufTogVG9vbHRpcFByb3BzPExpbmVTdHlsZXMgfCBCYXJTdHlsZXMgfCBBcmVhU3R5bGVzIHwgQnViYmxlU3R5bGVzPikgPT4ge1xuICBjb25zdCB0b29sdGlwUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50PihudWxsKTtcbiAgY29uc3QgW3Bvc2l0aW9uLCBzZXRQb3NpdGlvbl0gPSB1c2VTdGF0ZTx7IGxlZnQ6IG51bWJlciB9Pih7XG4gICAgbGVmdDogdG9vbHRpcExlZnQsXG4gIH0pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgYWRqdXN0VG9vbHRpcFBvc2l0aW9uID0gKCkgPT4ge1xuICAgICAgY29uc3QgdG9vbHRpcEVsZW1lbnQgPSB0b29sdGlwUmVmLmN1cnJlbnQ7XG5cbiAgICAgIGlmICh0b29sdGlwRWxlbWVudCkge1xuICAgICAgICBjb25zdCBzY3JlZW5XaWR0aCA9IHdpbmRvdy5pbm5lcldpZHRoO1xuXG4gICAgICAgIGNvbnN0IHJlY3QgPSB0b29sdGlwRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcblxuICAgICAgICBsZXQgd2lkdGggPSByZWN0LndpZHRoO1xuXG4gICAgICAgIGlmICh3aWR0aCA8IE1JTl9UT09MVElQX1dJRFRIKSB7XG4gICAgICAgICAgd2lkdGggPSBNSU5fVE9PTFRJUF9XSURUSDtcbiAgICAgICAgfVxuXG4gICAgICAgIGxldCBsZWZ0ID0gdG9vbHRpcExlZnQgKyBUT09MVElQX09GRlNFVDtcblxuICAgICAgICBpZiAodG9vbHRpcExlZnQgKyB3aWR0aCA+IHNjcmVlbldpZHRoIC0gU0NST0xMQkFSX1dJRFRIKSB7XG4gICAgICAgICAgbGVmdCA9IHRvb2x0aXBMZWZ0IC0gd2lkdGggLSBUT09MVElQX09GRlNFVDtcbiAgICAgICAgfVxuXG4gICAgICAgIHNldFBvc2l0aW9uKHsgbGVmdCB9KTtcbiAgICAgIH1cbiAgICB9O1xuXG4gICAgYWRqdXN0VG9vbHRpcFBvc2l0aW9uKCk7XG4gIH0sIFt0b29sdGlwTGVmdF0pO1xuXG4gIHJldHVybiBjcmVhdGVQb3J0YWwoXG4gICAgPGRpdlxuICAgICAgcmVmPXt0b29sdGlwUmVmfVxuICAgICAgc3R5bGU9e3tcbiAgICAgICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgICAgIGxlZnQ6IHBvc2l0aW9uLmxlZnQsXG4gICAgICAgIHRvcDogdG9vbHRpcFRvcCxcbiAgICAgICAgekluZGV4OiAyMTQ3NDgzNjQ3ICogMTAsXG4gICAgICAgIC4uLnRoZW1lLFxuICAgICAgfX1cbiAgICA+XG4gICAgICA8ZGl2IHN0eWxlPXt7IHdvcmRCcmVhazogJ2JyZWFrLWFsbCcgfX0+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBmb250RmFtaWx5OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsaW5lSGVpZ2h0OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsZXR0ZXJTcGFjaW5nOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBmb250V2VpZ2h0OiAnYm9sZCcsXG4gICAgICAgICAgICBmb250U2l6ZTogJzE1cHgnLFxuICAgICAgICAgICAgd2lkdGg6ICcxMDAlJyxcbiAgICAgICAgICAgIG1pbldpZHRoOiBNSU5fVE9PTFRJUF9XSURUSCxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIHt0b29sdGlwRGF0YVt4S2V5XT8uZm9ybWF0dGVkVmFsdWUgPz8gdG9vbHRpcERhdGFbeEtleV0udmFsdWV9XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8dGFibGVcbiAgICAgICAgICBjZWxsUGFkZGluZz17MH1cbiAgICAgICAgICBjZWxsU3BhY2luZz17MH1cbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBtYXJnaW46ICcwJyxcbiAgICAgICAgICAgIGJvcmRlclNwYWNpbmc6ICcwJyxcbiAgICAgICAgICAgIGJvcmRlckNvbGxhcHNlOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBib3JkZXI6ICdub25lJyxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIDx0Ym9keT5cbiAgICAgICAgICAgIHtpdGVtcy5tYXAoKGl0ZW0sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgPEZyYWdtZW50IGtleT17aW5kZXh9PlxuICAgICAgICAgICAgICAgICAge2l0ZW0ubGVnZW5kSXRlbXM/Lm1hcCgobGVnZW5kSXRlbSwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgaWYgKCF0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldIHx8IHRvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWUgPT09IG51bGwpIHtcbiAgICAgICAgICAgICAgICAgICAgICAvLyB5S2V5IGNvdWxkIG5vdCBiZSBmb3VuZCBpbiB0b29sdGlwRGF0YVxuICAgICAgICAgICAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgICAgICAgaXRlbS52aXNpYmxlWUtleXM/LmluY2x1ZGVzKGxlZ2VuZEl0ZW0ueUtleSkgJiYgKFxuICAgICAgICAgICAgICAgICAgICAgICAgPHRyIGtleT17YCR7bGVnZW5kSXRlbS55S2V5fS0ke2luZGV4fS0ke3Rvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWV9YH0+XG4gICAgICAgICAgICAgICAgICAgICAgICAgIHtzaG91bGRTaG93Q29sb3JMZWdlbmQgJiYgKFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDx0ZFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e3tcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgdmVydGljYWxBbGlnbjogJ21pZGRsZScsXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHBhZGRpbmc6IGluZGV4ID09PSAwID8gJzEycHggOHB4IDAgMCcgOiAnOHB4IDhweCAwIDAnLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB3aWR0aDogJ2F1dG8nLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8TGVnZW5kSXRlbUJveFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb2xvcj17Z2V0Q29sb3Ioe1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGRlZmF1bHRDb2xvcjogbGVnZW5kSXRlbS5jb2xvcixcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB2YWx1ZTogdG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS52YWx1ZSxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB5S2V5OiBsZWdlbmRJdGVtLnlLZXksXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IGl0ZW0uY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXMgPz8gW10sXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBzdHlsZT17bGVnZW5kSXRlbS5zdHlsZSBhcyBMaW5lU3R5bGVzfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB5S2V5PXtsZWdlbmRJdGVtLnlLZXl9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvdGQ+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICl9XG4gICAgICAgICAgICAgICAgICAgICAgICAgIDx0ZCBzdHlsZT17eyBwYWRkaW5nOiAnOHB4IDAgMCAwJyB9fT57a2V5c1tsZWdlbmRJdGVtLnlLZXldLmtleUZvcm1hdHRlZH08L3RkPlxuICAgICAgICAgICAgICAgICAgICAgICAgICA8dGQgc3R5bGU9e3sgZm9udFdlaWdodDogJ2JvbGQnLCBwYWRkaW5nOiAnOHB4IDAgMCAxNnB4JyB9fT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB7dG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS5mb3JtYXR0ZWRWYWx1ZVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPyB0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldLmZvcm1hdHRlZFZhbHVlXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICA6IHRvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWV9XG4gICAgICAgICAgICAgICAgICAgICAgICAgIDwvdGQ+XG4gICAgICAgICAgICAgICAgICAgICAgICA8L3RyPlxuICAgICAgICAgICAgICAgICAgICAgIClcbiAgICAgICAgICAgICAgICAgICAgKTtcbiAgICAgICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgICAgIDwvRnJhZ21lbnQ+XG4gICAgICAgICAgICAgICk7XG4gICAgICAgICAgICB9KX1cblxuICAgICAgICAgICAge3Nob3dSb3VuZGVkVG90YWwgJiYgeUtleXMgJiYgKFxuICAgICAgICAgICAgICA8dHI+XG4gICAgICAgICAgICAgICAgPHRkIGNvbFNwYW49ezJ9IHN0eWxlPXt7IHBhZGRpbmc6ICcxMnB4IDAgMCAwJyB9fT5cbiAgICAgICAgICAgICAgICAgIFJvdW5kZWQgVG90YWxcbiAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICAgIDx0ZCBzdHlsZT17eyBmb250V2VpZ2h0OiAnYm9sZCcsIHBhZGRpbmc6ICcxMnB4IDAgMCAxNnB4JyB9fT5cbiAgICAgICAgICAgICAgICAgIHt5S2V5cy5yZWR1Y2UoKHRvdGFsLCBrZXkpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgcmV0dXJuIHRvdGFsICsgTWF0aC5yb3VuZCh0b29sdGlwRGF0YVtrZXldLnZhbHVlIGFzIG51bWJlcik7XG4gICAgICAgICAgICAgICAgICB9LCAwKX1cbiAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICA8L3RyPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgICA8L3Rib2R5PlxuICAgICAgICA8L3RhYmxlPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+LFxuICAgIGRvY3VtZW50LmJvZHksXG4gICk7XG59O1xuIl19 */",
+          map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBHcUIiLCJmaWxlIjoiVG9vbHRpcC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgQ1NTUHJvcGVydGllcywgRnJhZ21lbnQsIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNyZWF0ZVBvcnRhbCB9IGZyb20gJ3JlYWN0LWRvbSc7XG5cbmltcG9ydCB7IGdldENvbG9yIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgTGVnZW5kSXRlbUJveCB9IGZyb20gJy4uL0xlZ2VuZC9MZWdlbmRJdGVtQm94JztcbmltcG9ydCB7IFNoYXBlRGVmaW5pdGlvbiwgQ29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZSwgRGF0YUl0ZW0sIEtleSB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQ2hhcnRzVjIvdHlwZXMnO1xuaW1wb3J0IHsgTGluZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvTGluZUNoYXJ0VjIvdHlwZXMnO1xuaW1wb3J0IHsgQmFyU3R5bGVzIH0gZnJvbSAnc2hhcmVkLWxvZ2ljL3NyYy9CYXJDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEFyZWFTdHlsZXMgfSBmcm9tICdzaGFyZWQtbG9naWMvc3JjL0FyZWFDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IEJ1YmJsZVN0eWxlcyB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQnViYmxlQ2hhcnRWMi90eXBlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jc3MnO1xuXG5jb25zdCBNSU5fVE9PTFRJUF9XSURUSCA9IDE4MDtcbmNvbnN0IFRPT0xUSVBfT0ZGU0VUID0gMjA7XG5jb25zdCBTQ1JPTExCQVJfV0lEVEggPSA0MDtcblxuaW50ZXJmYWNlIFRvb2x0aXBQcm9wczxUPiB7XG4gIGtleXM6IHsgW2tleTogc3RyaW5nXTogS2V5IH07XG4gIHNob3dSb3VuZGVkVG90YWw6IGJvb2xlYW47XG4gIHRvb2x0aXBEYXRhOiB7XG4gICAgW2tleUlkOiBzdHJpbmddOiBEYXRhSXRlbTtcbiAgfTtcbiAgdG9vbHRpcExlZnQ6IG51bWJlcjtcbiAgdG9vbHRpcFRvcDogbnVtYmVyO1xuICB4S2V5OiBzdHJpbmc7XG4gIHlLZXlzPzogc3RyaW5nW107XG4gIGl0ZW1zOiB7XG4gICAgbGVnZW5kSXRlbXM6IEFycmF5PFNoYXBlRGVmaW5pdGlvbjxUPj47XG4gICAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IEFycmF5PENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGU+O1xuICAgIHZpc2libGVZS2V5czogc3RyaW5nW107XG4gIH1bXTtcbiAgdGhlbWU6IENTU1Byb3BlcnRpZXM7XG59XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gKHtcbiAga2V5cyxcbiAgc2hvd1JvdW5kZWRUb3RhbCxcbiAgdG9vbHRpcERhdGEsXG4gIHRvb2x0aXBMZWZ0LFxuICB0b29sdGlwVG9wLFxuICB4S2V5LFxuICB5S2V5cyxcbiAgdGhlbWUsXG4gIGl0ZW1zLFxufTogVG9vbHRpcFByb3BzPExpbmVTdHlsZXMgfCBCYXJTdHlsZXMgfCBBcmVhU3R5bGVzIHwgQnViYmxlU3R5bGVzPikgPT4ge1xuICBjb25zdCB0b29sdGlwUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50PihudWxsKTtcbiAgY29uc3QgW3Bvc2l0aW9uLCBzZXRQb3NpdGlvbl0gPSB1c2VTdGF0ZTx7IGxlZnQ6IG51bWJlciB9Pih7XG4gICAgbGVmdDogdG9vbHRpcExlZnQsXG4gIH0pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgYWRqdXN0VG9vbHRpcFBvc2l0aW9uID0gKCkgPT4ge1xuICAgICAgY29uc3QgdG9vbHRpcEVsZW1lbnQgPSB0b29sdGlwUmVmLmN1cnJlbnQ7XG5cbiAgICAgIGlmICh0b29sdGlwRWxlbWVudCkge1xuICAgICAgICBjb25zdCBzY3JlZW5XaWR0aCA9IHdpbmRvdy5pbm5lcldpZHRoO1xuXG4gICAgICAgIGNvbnN0IHJlY3QgPSB0b29sdGlwRWxlbWVudC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcblxuICAgICAgICBsZXQgd2lkdGggPSByZWN0LndpZHRoO1xuXG4gICAgICAgIGlmICh3aWR0aCA8IE1JTl9UT09MVElQX1dJRFRIKSB7XG4gICAgICAgICAgd2lkdGggPSBNSU5fVE9PTFRJUF9XSURUSDtcbiAgICAgICAgfVxuXG4gICAgICAgIGxldCBsZWZ0ID0gdG9vbHRpcExlZnQgKyBUT09MVElQX09GRlNFVDtcblxuICAgICAgICBpZiAodG9vbHRpcExlZnQgKyB3aWR0aCA+IHNjcmVlbldpZHRoIC0gU0NST0xMQkFSX1dJRFRIKSB7XG4gICAgICAgICAgbGVmdCA9IHRvb2x0aXBMZWZ0IC0gd2lkdGggLSBUT09MVElQX09GRlNFVDtcbiAgICAgICAgfVxuXG4gICAgICAgIHNldFBvc2l0aW9uKHsgbGVmdCB9KTtcbiAgICAgIH1cbiAgICB9O1xuXG4gICAgYWRqdXN0VG9vbHRpcFBvc2l0aW9uKCk7XG4gIH0sIFt0b29sdGlwTGVmdF0pO1xuXG4gIHJldHVybiBjcmVhdGVQb3J0YWwoXG4gICAgPGRpdlxuICAgICAgcmVmPXt0b29sdGlwUmVmfVxuICAgICAgc3R5bGU9e3tcbiAgICAgICAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gICAgICAgIGxlZnQ6IHBvc2l0aW9uLmxlZnQsXG4gICAgICAgIHRvcDogdG9vbHRpcFRvcCxcbiAgICAgICAgekluZGV4OiAyMTQ3NDgzNjQ3ICogMTAsXG4gICAgICAgIC4uLnRoZW1lLFxuICAgICAgfX1cbiAgICA+XG4gICAgICA8ZGl2IHN0eWxlPXt7IHdvcmRCcmVhazogJ2JyZWFrLWFsbCcgfX0+XG4gICAgICAgIDxkaXZcbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBmb250RmFtaWx5OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsaW5lSGVpZ2h0OiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBsZXR0ZXJTcGFjaW5nOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBmb250V2VpZ2h0OiAnYm9sZCcsXG4gICAgICAgICAgICBmb250U2l6ZTogJzE1cHgnLFxuICAgICAgICAgICAgd2lkdGg6ICcxMDAlJyxcbiAgICAgICAgICAgIG1pbldpZHRoOiBNSU5fVE9PTFRJUF9XSURUSCxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIHt0b29sdGlwRGF0YVt4S2V5XT8uZm9ybWF0dGVkVmFsdWUgPz8gdG9vbHRpcERhdGFbeEtleV0udmFsdWV9XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8dGFibGVcbiAgICAgICAgICBjZWxsUGFkZGluZz17MH1cbiAgICAgICAgICBjZWxsU3BhY2luZz17MH1cbiAgICAgICAgICBjbGFzc05hbWU9e2Nzcyh7XG4gICAgICAgICAgICBtYXJnaW46ICcwJyxcbiAgICAgICAgICAgIGJvcmRlclNwYWNpbmc6ICcwJyxcbiAgICAgICAgICAgIGJvcmRlckNvbGxhcHNlOiAnaW5oZXJpdCcsXG4gICAgICAgICAgICBib3JkZXI6ICdub25lJyxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIDx0Ym9keT5cbiAgICAgICAgICAgIHtpdGVtcy5tYXAoKGl0ZW0sIGluZGV4KSA9PiB7XG4gICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgPEZyYWdtZW50IGtleT17aW5kZXh9PlxuICAgICAgICAgICAgICAgICAge2l0ZW0ubGVnZW5kSXRlbXM/Lm1hcCgobGVnZW5kSXRlbSwgaW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgaWYgKCF0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldIHx8IHRvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0udmFsdWUgPT09IG51bGwpIHtcbiAgICAgICAgICAgICAgICAgICAgICAvLyB5S2V5IGNvdWxkIG5vdCBiZSBmb3VuZCBpbiB0b29sdGlwRGF0YVxuICAgICAgICAgICAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICAgICAgICAgICAgaXRlbS52aXNpYmxlWUtleXM/LmluY2x1ZGVzKGxlZ2VuZEl0ZW0ueUtleSkgJiYgKFxuICAgICAgICAgICAgICAgICAgICAgICAgPHRyIGtleT17bGVnZW5kSXRlbS55S2V5fT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgPHRkXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e3tcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHZlcnRpY2FsQWxpZ246ICdtaWRkbGUnLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgcGFkZGluZzogaW5kZXggPT09IDAgPyAnMTJweCA4cHggMCAwJyA6ICc4cHggOHB4IDAgMCcsXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICB3aWR0aDogJ2F1dG8nLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8TGVnZW5kSXRlbUJveFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29sb3I9e2dldENvbG9yKHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgZGVmYXVsdENvbG9yOiBsZWdlbmRJdGVtLmNvbG9yLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB2YWx1ZTogdG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS52YWx1ZSxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgeUtleTogbGVnZW5kSXRlbS55S2V5LFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlczogaXRlbS5jb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlcyA/PyBbXSxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgc3R5bGU9e2xlZ2VuZEl0ZW0uc3R5bGUgYXMgTGluZVN0eWxlc31cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHlLZXk9e2xlZ2VuZEl0ZW0ueUtleX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICAgICAgICAgICAgICA8dGQgc3R5bGU9e3sgcGFkZGluZzogJzhweCAwIDAgMCcgfX0+e2tleXNbbGVnZW5kSXRlbS55S2V5XS5rZXlGb3JtYXR0ZWR9PC90ZD5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgPHRkIHN0eWxlPXt7IGZvbnRXZWlnaHQ6ICdib2xkJywgcGFkZGluZzogJzhweCAwIDAgMTZweCcgfX0+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAge3Rvb2x0aXBEYXRhW2xlZ2VuZEl0ZW0ueUtleV0uZm9ybWF0dGVkVmFsdWVcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgID8gdG9vbHRpcERhdGFbbGVnZW5kSXRlbS55S2V5XS5mb3JtYXR0ZWRWYWx1ZVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgOiB0b29sdGlwRGF0YVtsZWdlbmRJdGVtLnlLZXldLnZhbHVlfVxuICAgICAgICAgICAgICAgICAgICAgICAgICA8L3RkPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC90cj5cbiAgICAgICAgICAgICAgICAgICAgICApXG4gICAgICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgICB9KX1cbiAgICAgICAgICAgICAgICA8L0ZyYWdtZW50PlxuICAgICAgICAgICAgICApO1xuICAgICAgICAgICAgfSl9XG5cbiAgICAgICAgICAgIHtzaG93Um91bmRlZFRvdGFsICYmIHlLZXlzICYmIChcbiAgICAgICAgICAgICAgPHRyPlxuICAgICAgICAgICAgICAgIDx0ZCBjb2xTcGFuPXsyfSBzdHlsZT17eyBwYWRkaW5nOiAnMTJweCAwIDAgMCcgfX0+XG4gICAgICAgICAgICAgICAgICBSb3VuZGVkIFRvdGFsXG4gICAgICAgICAgICAgICAgPC90ZD5cbiAgICAgICAgICAgICAgICA8dGQgc3R5bGU9e3sgZm9udFdlaWdodDogJ2JvbGQnLCBwYWRkaW5nOiAnMTJweCAwIDAgMTZweCcgfX0+XG4gICAgICAgICAgICAgICAgICB7eUtleXMucmVkdWNlKCh0b3RhbCwga2V5KSA9PiB7XG4gICAgICAgICAgICAgICAgICAgIHJldHVybiB0b3RhbCArIE1hdGgucm91bmQodG9vbHRpcERhdGFba2V5XS52YWx1ZSBhcyBudW1iZXIpO1xuICAgICAgICAgICAgICAgICAgfSwgMCl9XG4gICAgICAgICAgICAgICAgPC90ZD5cbiAgICAgICAgICAgICAgPC90cj5cbiAgICAgICAgICAgICl9XG4gICAgICAgICAgPC90Ym9keT5cbiAgICAgICAgPC90YWJsZT5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PixcbiAgICBkb2N1bWVudC5ib2R5XG4gICk7XG59O1xuIl19 */",
           toString: _EMOTION_STRINGIFIED_CSS_ERROR__$5
         }),
         children: jsxs("tbody", {
@@ -43395,7 +43568,7 @@ var Tooltip$1 = function Tooltip(_ref) {
                   return null;
                 }
                 return ((_item$visibleYKeys = item.visibleYKeys) == null ? void 0 : _item$visibleYKeys.includes(legendItem.yKey)) && jsxs("tr", {
-                  children: [shouldShowColorLegend && jsx("td", {
+                  children: [jsx("td", {
                     style: {
                       verticalAlign: 'middle',
                       padding: index === 0 ? '12px 8px 0 0' : '8px 8px 0 0',
@@ -43423,7 +43596,7 @@ var Tooltip$1 = function Tooltip(_ref) {
                     },
                     children: tooltipData[legendItem.yKey].formattedValue ? tooltipData[legendItem.yKey].formattedValue : tooltipData[legendItem.yKey].value
                   })]
-                }, legendItem.yKey + "-" + index + "-" + tooltipData[legendItem.yKey].value);
+                }, legendItem.yKey);
               })
             }, index);
           }), showRoundedTotal && yKeys && jsxs("tr", {
@@ -43608,64 +43781,33 @@ var Legend$1 = function Legend(_ref) {
   });
 };
 
-var ASSUMED_AVERAGE_CHAR_WIDTH = 7.1;
-
+var ASSUMED_AVERAGE_CHAR_WIDTH = 4;
 function calculateWordWidth(word, avgCharWidth) {
   return word.length * avgCharWidth;
 }
-function getTicksIntervals(numElements) {
-  var divisors = [];
-  for (var i = 1; i <= Math.sqrt(numElements - 1); i++) {
-    if ((numElements - 1) % i !== 0) {
-      continue;
-    }
-    divisors.push(i);
-    var divisor = (numElements - 1) / i;
-    if (i === divisor) {
-      continue;
-    }
-    divisors.push(divisor);
-  }
-  divisors.sort(function (a, b) {
-    return b - a;
-  });
-  return divisors;
-}
-function isTickIntervalValid(interval, maxWidth, wordWidths) {
-  var totalWidth = 0;
-  for (var i = 0; i < wordWidths.length; i += interval) {
-    var spacing = i > 0 ? 12 : 0; // Add spacing only after the first tick
-    totalWidth += wordWidths[i] + spacing;
-  }
-  return totalWidth <= maxWidth;
-}
+
+/** Reduce width proportionally to simulate spacing / padding between ticks. */
+var widthWithSpacing = function widthWithSpacing(width) {
+  var THIRTY_PERCENT = 0.3;
+  return width - width * THIRTY_PERCENT;
+};
 function howManyTicksFitInWidth(ticks, maxWidth, avgCharWidth) {
   if (avgCharWidth === void 0) {
     avgCharWidth = ASSUMED_AVERAGE_CHAR_WIDTH;
   }
-  var ticksIntervals = getTicksIntervals(ticks.length);
-  var ticksWidths = ticks.map(function (tick) {
-    var _tick$formattedValue;
-    return calculateWordWidth((_tick$formattedValue = tick == null ? void 0 : tick.formattedValue) != null ? _tick$formattedValue : '', avgCharWidth);
-  });
-  var optimalInterval = ticksIntervals[ticksIntervals.length - 1]; // Default to showing only first and last marks if none fit
-  var left = 0;
-  var right = ticksIntervals.length - 1;
-
-  // Binary search for the largest step that fits all elements
-  while (left <= right) {
-    var mid = Math.floor((left + right) / 2);
-    var step = ticksIntervals[mid];
-    if (isTickIntervalValid(step, maxWidth, ticksWidths)) {
-      optimalInterval = step; // Found a valid step, try to find a larger one
-      left = mid + 1;
+  var fittedTicks = [];
+  var currentWidth = 0;
+  for (var _iterator = _createForOfIteratorHelperLoose(ticks), _step; !(_step = _iterator()).done;) {
+    var tick = _step.value;
+    var word = (tick == null ? void 0 : tick.formattedValue) || '';
+    var wordWidth = calculateWordWidth(word, avgCharWidth);
+    if (currentWidth + wordWidth <= widthWithSpacing(maxWidth)) {
+      fittedTicks.push(tick);
+      currentWidth += wordWidth + avgCharWidth; // Add space between words
     } else {
-      right = mid - 1;
+      break; // Stop if adding the word exceeds maxWidth
     }
   }
-  var fittedTicks = ticks.filter(function (_, index) {
-    return index % optimalInterval === 0;
-  });
   return fittedTicks.length;
 }
 function determineYTicks(ticks, height) {
@@ -43702,14 +43844,16 @@ function pickEquallySpaced(arr, numPicks) {
   return result;
 }
 function adjustTicks(representation, width, height, xKeyField) {
-  var _representation$x$tic, _representation$y$tic;
   representation = cloneDeep(representation);
 
   // TODO; take this from the theme override...
   var averageCharacterWidth = ASSUMED_AVERAGE_CHAR_WIDTH;
-  var numberOfXTicksFittingIntoSpace = howManyTicksFitInWidth((_representation$x$tic = representation.x.ticks) != null ? _representation$x$tic : [], width, averageCharacterWidth);
+  var numberOfXTicksFittingIntoSpace = howManyTicksFitInWidth(representation.x.ticks || [], width, averageCharacterWidth);
+
+  // @ts-ignore
   representation.x.ticks = getEvenlySpacedTicks(representation.x.ticks, numberOfXTicksFittingIntoSpace, xKeyField);
-  representation.y.ticks = determineYTicks((_representation$y$tic = representation.y.ticks) != null ? _representation$y$tic : [], height);
+  // @ts-ignore
+  representation.y.ticks = determineYTicks(representation.y.ticks || [], height);
   return representation;
 }
 function toNumeric(value) {
@@ -43742,9 +43886,9 @@ function getEvenlySpacedNumericTicks(sorted, count) {
     var _toNumeric3;
     var closest = sorted[0];
     var minDiff = Math.abs(((_toNumeric3 = toNumeric(sorted[0].scaleValue)) != null ? _toNumeric3 : 0) - target);
-    for (var _iterator = _createForOfIteratorHelperLoose(sorted), _step; !(_step = _iterator()).done;) {
+    for (var _iterator2 = _createForOfIteratorHelperLoose(sorted), _step2; !(_step2 = _iterator2()).done;) {
       var _toNumeric4;
-      var tick = _step.value;
+      var tick = _step2.value;
       var numericVal = (_toNumeric4 = toNumeric(tick.scaleValue)) != null ? _toNumeric4 : 0;
       var diff = Math.abs(numericVal - target);
       if (diff < minDiff) {
@@ -43766,9 +43910,16 @@ function getEvenlySpacedStringTicks(ticks, count) {
   return result;
 }
 function getEvenlySpacedTicks(ticks, count, xKeyField) {
+  if (count === void 0) {
+    count = 4;
+  }
   if (ticks.length === 0) return [];
   if ((xKeyField == null ? void 0 : xKeyField.dataType) === 'number' || (xKeyField == null ? void 0 : xKeyField.dataType) === 'date_time') {
-    return getEvenlySpacedNumericTicks(ticks, count);
+    var sorted = [].concat(ticks).sort(function (a, b) {
+      var _toNumeric5, _toNumeric6;
+      return ((_toNumeric5 = toNumeric(a.scaleValue)) != null ? _toNumeric5 : 0) - ((_toNumeric6 = toNumeric(b.scaleValue)) != null ? _toNumeric6 : 0);
+    });
+    return getEvenlySpacedNumericTicks(sorted, count);
   } else {
     return getEvenlySpacedStringTicks(ticks, count);
   }
@@ -44049,33 +44200,24 @@ var GridRows = function GridRows(_ref) {
   });
 };
 
-var _excluded$g = ["children", "width", "height", "showLegend", "onMouseMove", "onMouseLeave"];
 function _EMOTION_STRINGIFIED_CSS_ERROR__$8() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-var ChartWrapper$1 = function ChartWrapper(_ref) {
-  var children = _ref.children,
-    width = _ref.width,
-    height = _ref.height,
-    showLegend = _ref.showLegend,
-    onMouseMove = _ref.onMouseMove,
-    onMouseLeave = _ref.onMouseLeave,
-    svgProps = _objectWithoutPropertiesLoose(_ref, _excluded$g);
-  return jsx("svg", _extends({
-    width: width,
-    height: height - (showLegend ? 40 : 0),
-    onMouseMove: onMouseMove,
-    onMouseLeave: onMouseLeave,
+var ChartWrapper$1 = function ChartWrapper(props) {
+  return jsx("svg", {
+    width: props.width,
+    height: props.height - (props.showLegend ? 40 : 0),
+    onMouseMove: props.onMouseMove,
+    onMouseLeave: props.onMouseLeave,
     className: /*#__PURE__*/css$1(process.env.NODE_ENV === "production" ? {
       name: "4zleql",
       styles: "display:block"
     } : {
       name: "fx4tbw-ChartWrapper",
       styles: "display:block;label:ChartWrapper;",
-      map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNoYXJ0V3JhcHBlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMEJpQiIsImZpbGUiOiJDaGFydFdyYXBwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY3NzJztcblxudHlwZSBDaGFydFdyYXBwZXJQcm9wcyA9IHtcbiAgY2hpbGRyZW46IFJlYWN0LlJlYWN0Tm9kZTtcbiAgd2lkdGg6IG51bWJlcjtcbiAgaGVpZ2h0OiBudW1iZXI7XG4gIHNob3dMZWdlbmQ6IGJvb2xlYW47XG4gIG9uTW91c2VNb3ZlPzogUmVhY3QuTW91c2VFdmVudEhhbmRsZXI8U1ZHU1ZHRWxlbWVudD47XG4gIG9uTW91c2VMZWF2ZT86IFJlYWN0Lk1vdXNlRXZlbnRIYW5kbGVyPFNWR1NWR0VsZW1lbnQ+O1xufSAmIFJlYWN0LlNWR1Byb3BzPFNWR1NWR0VsZW1lbnQ+O1xuXG5leHBvcnQgY29uc3QgQ2hhcnRXcmFwcGVyID0gKHtcbiAgY2hpbGRyZW4sXG4gIHdpZHRoLFxuICBoZWlnaHQsXG4gIHNob3dMZWdlbmQsXG4gIG9uTW91c2VNb3ZlLFxuICBvbk1vdXNlTGVhdmUsXG4gIC4uLnN2Z1Byb3BzXG59OiBDaGFydFdyYXBwZXJQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxzdmdcbiAgICAgIHdpZHRoPXt3aWR0aH1cbiAgICAgIGhlaWdodD17aGVpZ2h0IC0gKHNob3dMZWdlbmQgPyA0MCA6IDApfVxuICAgICAgb25Nb3VzZU1vdmU9e29uTW91c2VNb3ZlfVxuICAgICAgb25Nb3VzZUxlYXZlPXtvbk1vdXNlTGVhdmV9XG4gICAgICBjbGFzc05hbWU9e2Nzcyh7IGRpc3BsYXk6ICdibG9jaycgfSl9XG4gICAgICB7Li4uc3ZnUHJvcHN9XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvc3ZnPlxuICApO1xufTtcbiJdfQ== */",
+      map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNoYXJ0V3JhcHBlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0JpQiIsImZpbGUiOiJDaGFydFdyYXBwZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vY3NzJztcblxuZXhwb3J0IGNvbnN0IENoYXJ0V3JhcHBlciA9IChwcm9wczoge1xuICBjaGlsZHJlbjogUmVhY3QuUmVhY3ROb2RlO1xuICB3aWR0aDogbnVtYmVyO1xuICBoZWlnaHQ6IG51bWJlcjtcbiAgc2hvd0xlZ2VuZDogYm9vbGVhbjtcbiAgb25Nb3VzZU1vdmU/OiBSZWFjdC5Nb3VzZUV2ZW50SGFuZGxlcjxTVkdTVkdFbGVtZW50PjtcbiAgb25Nb3VzZUxlYXZlPzogUmVhY3QuTW91c2VFdmVudEhhbmRsZXI8U1ZHU1ZHRWxlbWVudD47XG59KSA9PiB7XG4gIHJldHVybiAoXG4gICAgPHN2Z1xuICAgICAgd2lkdGg9e3Byb3BzLndpZHRofVxuICAgICAgaGVpZ2h0PXtwcm9wcy5oZWlnaHQgLSAocHJvcHMuc2hvd0xlZ2VuZCA/IDQwIDogMCl9XG4gICAgICBvbk1vdXNlTW92ZT17cHJvcHMub25Nb3VzZU1vdmV9XG4gICAgICBvbk1vdXNlTGVhdmU9e3Byb3BzLm9uTW91c2VMZWF2ZX1cbiAgICAgIGNsYXNzTmFtZT17Y3NzKHsgZGlzcGxheTogJ2Jsb2NrJyB9KX1cbiAgICA+XG4gICAgICB7cHJvcHMuY2hpbGRyZW59XG4gICAgPC9zdmc+XG4gICk7XG59O1xuIl19 */",
       toString: _EMOTION_STRINGIFIED_CSS_ERROR__$8
-    })
-  }, svgProps, {
-    children: children
-  }));
+    }),
+    children: props.children
+  });
 };
 
 var CrosshairCircle = function CrosshairCircle(_ref) {
@@ -44140,7 +44282,7 @@ var Line = function Line(_ref) {
   });
 };
 
-var _excluded$h = ["tooltipOpen"];
+var _excluded$g = ["tooltipOpen"];
 function useTooltip$1(initialTooltipState) {
   var _useState = useState(_extends({
       tooltipOpen: false
@@ -44149,7 +44291,7 @@ function useTooltip$1(initialTooltipState) {
     setTooltipState = _useState[1];
   var showTooltip = useCallback(function (showArgs) {
     return setTooltipState(typeof showArgs === 'function' ? function (_ref) {
-      var show = _objectWithoutPropertiesLoose(_ref, _excluded$h);
+      var show = _objectWithoutPropertiesLoose(_ref, _excluded$g);
       return _extends({}, showArgs(show), {
         tooltipOpen: true
       });
@@ -44481,7 +44623,58 @@ function Lines(_ref2) {
   });
 }
 
-var BAR_RADIUS = 2;
+var PADDING = {
+  paddingOuter: 0.05,
+  paddingInner: 0.3
+};
+
+function useBarXScale(xScaleDataType, innerWidth, xScaleKey, data) {
+  return useMemo(function () {
+    if (xScaleDataType === 'string') {
+      return scaleBand(_extends({
+        range: [0, innerWidth],
+        domain: xScaleKey ? [].concat(data.map(function (d) {
+          return d[xScaleKey] && d[xScaleKey].value !== null ? String(d[xScaleKey].value) : '';
+        })) : []
+      }, PADDING));
+    }
+    if (xScaleDataType === 'date_time' && xScaleKey) {
+      return scaleBand(_extends({
+        range: [0, innerWidth],
+        domain: data.map(function (d) {
+          return new Date(d[xScaleKey].value);
+        })
+      }, PADDING));
+    }
+    if (xScaleDataType === 'number' && xScaleKey) {
+      return scaleBand(_extends({
+        range: [0, innerWidth],
+        domain: data.map(function (d) {
+          return d[xScaleKey] && d[xScaleKey].value !== null ? Number(d[xScaleKey].value) : 0;
+        })
+      }, PADDING));
+    }
+    return null;
+  }, [innerWidth, data]);
+}
+
+var useBottomAxisBaseLineShift = function useBottomAxisBaseLineShift(_ref) {
+  var showDetailedSubGroupingLabels = _ref.showDetailedSubGroupingLabels,
+    hasBottomTitle = _ref.hasBottomTitle,
+    hasLeftTitle = _ref.hasLeftTitle;
+  if (!showDetailedSubGroupingLabels) {
+    return {
+      bottomAxisBaselineShift: 0,
+      bottomOffset: 0,
+      leftOffset: 0
+    };
+  }
+  return {
+    bottomAxisBaselineShift: hasBottomTitle ? -65 : -60,
+    bottomOffset: hasBottomTitle ? -15 : 10,
+    leftOffset: hasLeftTitle ? -10 : 0
+  };
+};
 
 function getBarFill(bars, conditionalFormattingRules, barKey, barValues) {
   var _bars$find;
@@ -44507,6 +44700,73 @@ function getBarFill(bars, conditionalFormattingRules, barKey, barValues) {
   return fill;
 }
 
+var BAR_RADIUS = 2;
+
+var BarStacked = function BarStacked(_ref) {
+  var xScaleDataType = _ref.xScaleDataType,
+    data = _ref.data,
+    xScaleKey = _ref.xScaleKey,
+    yScale = _ref.yScale,
+    keys = _ref.keys,
+    bars = _ref.bars,
+    conditionalFormattingRules = _ref.conditionalFormattingRules,
+    xScale = _ref.xScale,
+    height = _ref.height,
+    width = _ref.width;
+  var handleGetXValue = function handleGetXValue(d) {
+    var xValue = d[xScaleKey];
+    if (xScaleDataType === 'string') return String(xValue);
+    if (xScaleDataType === 'date_time') {
+      return new Date(xValue);
+    }
+    if (xScaleDataType === 'number') {
+      return Number(xValue);
+    }
+    return String(xValue);
+  };
+  return jsx(BarStack$1, {
+    x: handleGetXValue,
+    xScale: xScale,
+    yScale: yScale,
+    data: data,
+    keys: keys,
+    color: function color() {
+      return '';
+    },
+    height: height,
+    width: width,
+    offset: "none",
+    children: function children(barStacks) {
+      return barStacks.map(function (barStack) {
+        return barStack.bars.map(function (bar) {
+          return jsx(Bar, {
+            bar: bar,
+            barStack: barStack,
+            bars: bars,
+            conditionalFormattingRules: conditionalFormattingRules
+          }, bar.key.toString());
+        });
+      });
+    }
+  });
+};
+var Bar = function Bar(_ref2) {
+  var bar = _ref2.bar,
+    barStack = _ref2.barStack,
+    bars = _ref2.bars,
+    conditionalFormattingRules = _ref2.conditionalFormattingRules;
+  var BAR_PADDING = 1.5;
+  if (bar.height < 3) return null;
+  return jsx("rect", {
+    x: bar.x,
+    y: bar.y,
+    width: bar.width,
+    height: bar.height - BAR_PADDING,
+    fill: getBarFill(bars, conditionalFormattingRules, bar.key, bar.bar.data),
+    rx: BAR_RADIUS
+  }, "bar-stack-" + barStack.index + "-" + bar.index);
+};
+
 function _EMOTION_STRINGIFIED_CSS_ERROR__$9() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 function BarGroup(_ref) {
   var data = _ref.data,
@@ -44556,7 +44816,7 @@ function BarGroup(_ref) {
         return jsx(Group$2, {
           left: barGroup.x0,
           children: barGroup.bars.map(function (bar) {
-            return jsx(Bar, {
+            return jsx(Bar$1, {
               bar: bar,
               barGroup: barGroup,
               bars: bars,
@@ -44574,7 +44834,7 @@ function BarGroup(_ref) {
     }
   });
 }
-var Bar = function Bar(_ref2) {
+var Bar$1 = function Bar(_ref2) {
   var bar = _ref2.bar,
     barGroup = _ref2.barGroup,
     bars = _ref2.bars,
@@ -44588,7 +44848,6 @@ var Bar = function Bar(_ref2) {
   var showBar = bar.value !== null && bar.height > 0 && bar.width > 0;
   return jsxs(Fragment, {
     children: [showBar && jsx(BarRect, {
-      barRectKey: "bar-group-bar-" + barGroup.index + "-" + bar.index + "-" + bar.value + "-" + String(bar.key),
       x: bar.x,
       y: bar.y,
       width: bar.width,
@@ -44598,7 +44857,7 @@ var Bar = function Bar(_ref2) {
         return _onClick(e, barGroup, bar);
       },
       enableHover: enableHover
-    }), jsx(BarLabel, {
+    }, "bar-group-bar-" + barGroup.index + "-" + bar.index + "-" + bar.value + "-" + String(bar.key)), jsx(BarLabel, {
       bar: bar,
       barGroup: barGroup,
       yLabelPosition: yLabelPosition,
@@ -44615,7 +44874,7 @@ var BarRect = function BarRect(_ref3) {
     y = _ref3.y,
     width = _ref3.width,
     height = _ref3.height,
-    barRectKey = _ref3.barRectKey,
+    key = _ref3.key,
     enableHover = _ref3.enableHover;
   var _useState = useState(fill),
     fillColor = _useState[0],
@@ -44626,7 +44885,7 @@ var BarRect = function BarRect(_ref3) {
   } : {
     name: "1ltmijl-classes",
     styles: "cursor:pointer;label:classes;",
-    map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJhckdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0S2dDIiwiZmlsZSI6IkJhckdyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL2Nzcyc7XG5pbXBvcnQgeyBHcm91cCB9IGZyb20gJ0B2aXN4L2dyb3VwJztcbmltcG9ydCB7IEJhckdyb3VwIGFzIFZpc3hCYXJHcm91cCB9IGZyb20gJ0B2aXN4L3NoYXBlJztcbmltcG9ydCB7IERhdHVtT2JqZWN0IH0gZnJvbSAnQHZpc3gvc2hhcGUvbGliL3R5cGVzJztcbmltcG9ydCB7IFNjYWxlQmFuZCwgU2NhbGVMaW5lYXIgfSBmcm9tICdAdmlzeC92ZW5kb3IvZDMtc2NhbGUnO1xuaW1wb3J0IHsgRnJhZ21lbnQsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgQmFyU3R5bGVzIH0gZnJvbSAnc2hhcmVkLWxvZ2ljL3NyYy9CYXJDaGFydFYyL3R5cGVzJztcbmltcG9ydCB7IENoYXJ0RGF0YURlZmluaXRpb24sIENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGUsIFNoYXBlRGVmaW5pdGlvbiB9IGZyb20gJ3NoYXJlZC1sb2dpYy9zcmMvQ2hhcnRzVjIvdHlwZXMnO1xuaW1wb3J0IHsgRGF0YVR5cGUgfSBmcm9tICdzaGFyZWQtbG9naWMvc3JjL0ZpZWxkL3R5cGVzJztcbmltcG9ydCB7IGxpZ2h0ZW5Db2xvciB9IGZyb20gJy4uLy4uLy4uL3N0eWxlcy9jb2xvci5mdW5jdGlvbnMnO1xuaW1wb3J0IHsgQkFSX1JBRElVUyB9IGZyb20gJy4uLy4uL2NvbnN0YW50cy9CT1JERVJfUkFESVVTJztcbmltcG9ydCB7IGdldEJhckZpbGwgfSBmcm9tICcuLi9nZXRCYXJGaWxsJztcblxuZXhwb3J0IHR5cGUgQmFyR3JvdXBQcm9wcyA9IHtcbiAgZGF0YTogQ2hhcnREYXRhRGVmaW5pdGlvbltdO1xuICBrZXlzOiBzdHJpbmdbXTtcbiAgaGVpZ2h0OiBudW1iZXI7XG4gIHhLZXk6IHN0cmluZztcbiAgeFNjYWxlRGF0YVR5cGU6IERhdGFUeXBlO1xuICB4U2NhbGU6IFNjYWxlQmFuZDxzdHJpbmc+IHwgU2NhbGVCYW5kPERhdGU+IHwgU2NhbGVCYW5kPG51bWJlcj4gfCBudWxsO1xuICBpbm5lclhTY2FsZTogU2NhbGVCYW5kPHN0cmluZz4gfCB1bmRlZmluZWQ7XG4gIHlTY2FsZTogU2NhbGVMaW5lYXI8bnVtYmVyLCBudW1iZXIsIG5ldmVyPjtcbiAgb25DbGljazogKGU6IFJlYWN0Lk1vdXNlRXZlbnQ8U1ZHUmVjdEVsZW1lbnQsIE1vdXNlRXZlbnQ+LCBiYXJHcm91cDogYW55LCBiYXI6IGFueSkgPT4gdm9pZDtcbiAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVbXTtcbiAgYmFyczogU2hhcGVEZWZpbml0aW9uPEJhclN0eWxlcz5bXTtcbiAgZW5hYmxlSG92ZXI/OiBib29sZWFuO1xuICB5QXhpc0xhYmVscz86IHN0cmluZ1tdO1xuICB5TGFiZWxQb3NpdGlvbj86IG51bWJlcjtcbiAgc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHM6IGJvb2xlYW47XG4gIGxhYmVsU3R5bGU/OiBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xufTtcblxuZXhwb3J0IGZ1bmN0aW9uIEJhckdyb3VwKHtcbiAgZGF0YSxcbiAga2V5cyxcbiAgaGVpZ2h0LFxuICB4S2V5LFxuICB4U2NhbGVEYXRhVHlwZSxcbiAgeFNjYWxlLFxuICBpbm5lclhTY2FsZSxcbiAgeVNjYWxlLFxuICBvbkNsaWNrLFxuICBjb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlcyxcbiAgYmFycyxcbiAgZW5hYmxlSG92ZXIsXG4gIHlBeGlzTGFiZWxzLFxuICB5TGFiZWxQb3NpdGlvbixcbiAgc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHMsXG4gIGxhYmVsU3R5bGUsXG59OiBCYXJHcm91cFByb3BzKSB7XG4gIGNvbnN0IGdldEdyb3VwUG9zaXRpb24gPSAoZDogRGF0dW1PYmplY3QpID0+IHtcbiAgICBjb25zdCB4VmFsdWUgPSBkW3hLZXkgYXMga2V5b2YgdHlwZW9mIGRdO1xuXG4gICAgaWYgKHhTY2FsZURhdGFUeXBlID09PSAnc3RyaW5nJykgcmV0dXJuIFN0cmluZyh4VmFsdWUpO1xuXG4gICAgaWYgKHhTY2FsZURhdGFUeXBlID09PSAnZGF0ZV90aW1lJykge1xuICAgICAgcmV0dXJuIG5ldyBEYXRlKFN0cmluZyh4VmFsdWUpKTtcbiAgICB9XG5cbiAgICBpZiAoeFNjYWxlRGF0YVR5cGUgPT09ICdudW1iZXInKSB7XG4gICAgICByZXR1cm4gTnVtYmVyKHhWYWx1ZSk7XG4gICAgfVxuXG4gICAgcmV0dXJuIFN0cmluZyh4VmFsdWUpO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPFZpc3hCYXJHcm91cDxEYXR1bU9iamVjdD5cbiAgICAgIGRhdGE9e2RhdGEgYXMgRGF0dW1PYmplY3RbXX1cbiAgICAgIGtleXM9e2tleXN9XG4gICAgICBoZWlnaHQ9e2hlaWdodH1cbiAgICAgIHgwPXtnZXRHcm91cFBvc2l0aW9ufVxuICAgICAgLy8gQHRzLWlnbm9yZVxuICAgICAgeDBTY2FsZT17eFNjYWxlfVxuICAgICAgLy8gQHRzLWlnbm9yZVxuICAgICAgeDFTY2FsZT17aW5uZXJYU2NhbGV9XG4gICAgICB5U2NhbGU9e3lTY2FsZX1cbiAgICAgIGNvbG9yPXsoKSA9PiAnJ31cbiAgICA+XG4gICAgICB7KGJhckdyb3VwcykgPT4ge1xuICAgICAgICByZXR1cm4gYmFyR3JvdXBzLm1hcCgoYmFyR3JvdXApID0+IChcbiAgICAgICAgICA8R3JvdXAga2V5PXtgYmFyLWdyb3VwLSR7YmFyR3JvdXAuaW5kZXh9LSR7YmFyR3JvdXAueDB9YH0gbGVmdD17YmFyR3JvdXAueDB9PlxuICAgICAgICAgICAge2Jhckdyb3VwLmJhcnMubWFwKChiYXIpID0+IChcbiAgICAgICAgICAgICAgPEJhclxuICAgICAgICAgICAgICAgIGtleT17YGJhci0ke2Jhci5pbmRleH0tJHtiYXIueH1gfVxuICAgICAgICAgICAgICAgIGJhcj17YmFyfVxuICAgICAgICAgICAgICAgIGJhckdyb3VwPXtiYXJHcm91cH1cbiAgICAgICAgICAgICAgICBiYXJzPXtiYXJzfVxuICAgICAgICAgICAgICAgIGNvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVzPXtjb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlc31cbiAgICAgICAgICAgICAgICBlbmFibGVIb3Zlcj17ZW5hYmxlSG92ZXJ9XG4gICAgICAgICAgICAgICAgbGFiZWxTdHlsZT17bGFiZWxTdHlsZX1cbiAgICAgICAgICAgICAgICBvbkNsaWNrPXtvbkNsaWNrfVxuICAgICAgICAgICAgICAgIHNob3dEZXRhaWxlZFN1Ykdyb3VwaW5nTGFiZWxzPXtzaG93RGV0YWlsZWRTdWJHcm91cGluZ0xhYmVsc31cbiAgICAgICAgICAgICAgICB5QXhpc0xhYmVscz17eUF4aXNMYWJlbHN9XG4gICAgICAgICAgICAgICAgeUxhYmVsUG9zaXRpb249e3lMYWJlbFBvc2l0aW9ufVxuICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgKSl9XG4gICAgICAgICAgPC9Hcm91cD5cbiAgICAgICAgKSk7XG4gICAgICB9fVxuICAgIDwvVmlzeEJhckdyb3VwPlxuICApO1xufVxuXG50eXBlIEJhclByb3BzID0ge1xuICBiYXI6IGFueTtcbiAgYmFyR3JvdXA6IGFueTtcbiAgYmFyczogU2hhcGVEZWZpbml0aW9uPEJhclN0eWxlcz5bXTtcbiAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVbXTtcbiAgZW5hYmxlSG92ZXI/OiBib29sZWFuO1xuICBvbkNsaWNrOiAoZTogUmVhY3QuTW91c2VFdmVudDxTVkdSZWN0RWxlbWVudCwgTW91c2VFdmVudD4sIGJhckdyb3VwOiBhbnksIGJhcjogYW55KSA9PiB2b2lkO1xuICBzaG93RGV0YWlsZWRTdWJHcm91cGluZ0xhYmVsczogYm9vbGVhbjtcbiAgbGFiZWxTdHlsZT86IFJlYWN0LkNTU1Byb3BlcnRpZXM7XG4gIHlBeGlzTGFiZWxzPzogc3RyaW5nW107XG4gIHlMYWJlbFBvc2l0aW9uPzogbnVtYmVyO1xufTtcblxuY29uc3QgQmFyID0gKHtcbiAgYmFyLFxuICBiYXJHcm91cCxcbiAgYmFycyxcbiAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXMsXG4gIGVuYWJsZUhvdmVyLFxuICBsYWJlbFN0eWxlLFxuICBvbkNsaWNrLFxuICBzaG93RGV0YWlsZWRTdWJHcm91cGluZ0xhYmVscyxcbiAgeUF4aXNMYWJlbHMsXG4gIHlMYWJlbFBvc2l0aW9uLFxufTogQmFyUHJvcHMpID0+IHtcbiAgY29uc3Qgc2hvd0JhciA9IGJhci52YWx1ZSAhPT0gbnVsbCAmJiBiYXIuaGVpZ2h0ID4gMCAmJiBiYXIud2lkdGggPiAwO1xuXG4gIHJldHVybiAoXG4gICAgPEZyYWdtZW50PlxuICAgICAge3Nob3dCYXIgJiYgKFxuICAgICAgICA8QmFyUmVjdFxuICAgICAgICAgIGJhclJlY3RLZXk9e2BiYXItZ3JvdXAtYmFyLSR7YmFyR3JvdXAuaW5kZXh9LSR7YmFyLmluZGV4fS0ke2Jhci52YWx1ZX0tJHtTdHJpbmcoYmFyLmtleSl9YH1cbiAgICAgICAgICB4PXtiYXIueH1cbiAgICAgICAgICB5PXtiYXIueX1cbiAgICAgICAgICB3aWR0aD17YmFyLndpZHRofVxuICAgICAgICAgIGhlaWdodD17YmFyLmhlaWdodH1cbiAgICAgICAgICBmaWxsPXtnZXRCYXJGaWxsKGJhcnMsIGNvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVzLCBTdHJpbmcoYmFyLmtleSksIGJhci52YWx1ZSl9XG4gICAgICAgICAgb25DbGljaz17KGUpID0+IG9uQ2xpY2soZSwgYmFyR3JvdXAsIGJhcil9XG4gICAgICAgICAgZW5hYmxlSG92ZXI9e2VuYWJsZUhvdmVyfVxuICAgICAgICAvPlxuICAgICAgKX1cblxuICAgICAgPEJhckxhYmVsXG4gICAgICAgIGJhcj17YmFyfVxuICAgICAgICBiYXJHcm91cD17YmFyR3JvdXB9XG4gICAgICAgIHlMYWJlbFBvc2l0aW9uPXt5TGFiZWxQb3NpdGlvbn1cbiAgICAgICAgeUF4aXNMYWJlbHM9e3lBeGlzTGFiZWxzfVxuICAgICAgICBzaG93RGV0YWlsZWRTdWJHcm91cGluZ0xhYmVscz17c2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHN9XG4gICAgICAgIGxhYmVsU3R5bGU9e2xhYmVsU3R5bGV9XG4gICAgICAvPlxuICAgIDwvRnJhZ21lbnQ+XG4gICk7XG59O1xuXG50eXBlIEJhclJlY3RQcm9wcyA9IHtcbiAgb25DbGljazogKGU6IFJlYWN0Lk1vdXNlRXZlbnQ8U1ZHUmVjdEVsZW1lbnQsIE1vdXNlRXZlbnQ+KSA9PiB2b2lkO1xuICBmaWxsPzogc3RyaW5nO1xuICB4OiBudW1iZXI7XG4gIHk6IG51bWJlcjtcbiAgd2lkdGg6IG51bWJlcjtcbiAgaGVpZ2h0OiBudW1iZXI7XG4gIGJhclJlY3RLZXk6IHN0cmluZztcbiAgZW5hYmxlSG92ZXI/OiBib29sZWFuO1xufTtcblxuY29uc3QgQmFyUmVjdCA9ICh7IG9uQ2xpY2ssIGZpbGwsIHgsIHksIHdpZHRoLCBoZWlnaHQsIGJhclJlY3RLZXksIGVuYWJsZUhvdmVyIH06IEJhclJlY3RQcm9wcykgPT4ge1xuICBjb25zdCBbZmlsbENvbG9yLCBzZXRGaWxsQ29sb3JdID0gdXNlU3RhdGUoZmlsbCk7XG5cbiAgY29uc3QgY2xhc3NlcyA9IGVuYWJsZUhvdmVyID8gY3NzKHsgY3Vyc29yOiAncG9pbnRlcicgfSkgOiAnJztcblxuICBjb25zdCBoYW5kbGVPbk1vdXNlRW50ZXIgPSAoKSA9PiB7XG4gICAgaWYgKGVuYWJsZUhvdmVyKSB7XG4gICAgICBzZXRGaWxsQ29sb3IobGlnaHRlbkNvbG9yKGZpbGwsIDAuOCkpO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVPbk1vdXNlTGVhdmUgPSAoKSA9PiB7XG4gICAgaWYgKGVuYWJsZUhvdmVyKSB7XG4gICAgICBzZXRGaWxsQ29sb3IoZmlsbCk7XG4gICAgfVxuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPHJlY3RcbiAgICAgIGtleT17YmFyUmVjdEtleX1cbiAgICAgIHg9e3h9XG4gICAgICB5PXt5fVxuICAgICAgd2lkdGg9e3dpZHRofVxuICAgICAgaGVpZ2h0PXtoZWlnaHR9XG4gICAgICBmaWxsPXtmaWxsQ29sb3J9XG4gICAgICByeD17QkFSX1JBRElVU31cbiAgICAgIG9uQ2xpY2s9e29uQ2xpY2t9XG4gICAgICBvbk1vdXNlRW50ZXI9e2hhbmRsZU9uTW91c2VFbnRlcn1cbiAgICAgIG9uTW91c2VMZWF2ZT17aGFuZGxlT25Nb3VzZUxlYXZlfVxuICAgICAgY2xhc3NOYW1lPXtjbGFzc2VzfVxuICAgIC8+XG4gICk7XG59O1xuXG50eXBlIEJhckxhYmVsUHJvcHMgPSB7XG4gIGJhcjogYW55O1xuICBiYXJHcm91cDogYW55O1xuICB5TGFiZWxQb3NpdGlvbj86IG51bWJlcjtcbiAgeUF4aXNMYWJlbHM/OiBzdHJpbmdbXTtcbiAgc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHM6IGJvb2xlYW47XG4gIGxhYmVsU3R5bGU/OiBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xufTtcblxuY29uc3QgQmFyTGFiZWwgPSAoe1xuICBiYXIsXG4gIGJhckdyb3VwLFxuICB5TGFiZWxQb3NpdGlvbixcbiAgeUF4aXNMYWJlbHMsXG4gIHNob3dEZXRhaWxlZFN1Ykdyb3VwaW5nTGFiZWxzLFxuICBsYWJlbFN0eWxlLFxufTogQmFyTGFiZWxQcm9wcykgPT4ge1xuICBpZiAoIXNob3dEZXRhaWxlZFN1Ykdyb3VwaW5nTGFiZWxzIHx8ICF5TGFiZWxQb3NpdGlvbiB8fCAheUF4aXNMYWJlbHMpIHJldHVybiBudWxsO1xuXG4gIGNvbnN0IGxhYmVsID0geUF4aXNMYWJlbHNbYmFyLmluZGV4XTtcbiAgY29uc3QgY29sdW1uTGFiZWwgPSBsYWJlbC5zcGxpdCgn4oCiJylbMF07XG5cbiAgbGV0IGZvcm1hdHRlZENvbHVtbkxhYmVsOiBzdHJpbmc7XG4gIGlmIChjb2x1bW5MYWJlbC5sZW5ndGggPj0gMTMpIHtcbiAgICBmb3JtYXR0ZWRDb2x1bW5MYWJlbCA9IGNvbHVtbkxhYmVsLnNsaWNlKDAsIDEwKSArICcuLi4nO1xuICB9IGVsc2Uge1xuICAgIGZvcm1hdHRlZENvbHVtbkxhYmVsID0gY29sdW1uTGFiZWwuc2xpY2UoMCwgMTMpO1xuICB9XG5cbiAgY29uc3QgbGFiZWxYR2FwID0gNDtcbiAgY29uc3QgbGFiZWxYUG9zaXRpb24gPSBiYXIueCArIGJhci53aWR0aCAvIDIgKyBsYWJlbFhHYXA7XG5cbiAgY29uc3QgbGFiZWxZR2FwID0gMTU7XG4gIGNvbnN0IGxhYmVsWVBvc2l0aW9uID0geUxhYmVsUG9zaXRpb24gKyBsYWJlbFlHYXA7XG5cbiAgY29uc3QgbGFiZWxLZXkgPSBgbGFiZWwtJHtiYXJHcm91cC5pbmRleH0tJHtiYXIuaW5kZXh9LSR7bGFiZWx9YDtcblxuICByZXR1cm4gKFxuICAgIDx0ZXh0XG4gICAgICBrZXk9e2xhYmVsS2V5fVxuICAgICAgeD17bGFiZWxYUG9zaXRpb259XG4gICAgICB5PXtsYWJlbFlQb3NpdGlvbn1cbiAgICAgIHN0eWxlPXtsYWJlbFN0eWxlfVxuICAgICAgdHJhbnNmb3JtPXtgcm90YXRlKC03MCwgJHtsYWJlbFhQb3NpdGlvbn0sICR7bGFiZWxZUG9zaXRpb259KWB9XG4gICAgICB0ZXh0QW5jaG9yPVwiZW5kXCJcbiAgICA+XG4gICAgICB7Zm9ybWF0dGVkQ29sdW1uTGFiZWx9XG4gICAgPC90ZXh0PlxuICApO1xufTtcbiJdfQ== */",
+    map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJhckdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtTGtDIiwiZmlsZSI6IkJhckdyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9jc3NcIjtcbmltcG9ydCB7IEZyYWdtZW50LCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgbGlnaHRlbkNvbG9yIH0gZnJvbSBcIi4uLy4uLy4uL3N0eWxlcy9jb2xvci5mdW5jdGlvbnNcIjtcbmltcG9ydCB7IEJBUl9SQURJVVMgfSBmcm9tICcuLi8uLi9jb25zdGFudHMvQk9SREVSX1JBRElVUydcbmltcG9ydCB7IGdldEJhckZpbGwgfSBmcm9tIFwiLi4vZ2V0QmFyRmlsbFwiO1xuaW1wb3J0IHsgQ2hhcnREYXRhRGVmaW5pdGlvbiwgQ29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZSwgU2hhcGVEZWZpbml0aW9uIH0gZnJvbSBcInNoYXJlZC1sb2dpYy9zcmMvQ2hhcnRzVjIvdHlwZXNcIjtcbmltcG9ydCB7IEJhclN0eWxlcyB9IGZyb20gXCJzaGFyZWQtbG9naWMvc3JjL0JhckNoYXJ0VjIvdHlwZXNcIjtcbmltcG9ydCB7IEJhckdyb3VwIGFzIFZpc3hCYXJHcm91cCB9IGZyb20gJ0B2aXN4L3NoYXBlJztcbmltcG9ydCB7IFNjYWxlTGluZWFyLCBTY2FsZUJhbmQgfSBmcm9tICdAdmlzeC92ZW5kb3IvZDMtc2NhbGUnO1xuaW1wb3J0IHsgRGF0YVR5cGUgfSBmcm9tIFwic2hhcmVkLWxvZ2ljL3NyYy9GaWVsZC90eXBlc1wiO1xuaW1wb3J0IHsgRGF0dW1PYmplY3QgfSBmcm9tICdAdmlzeC9zaGFwZS9saWIvdHlwZXMnO1xuaW1wb3J0IHsgR3JvdXAgfSBmcm9tICdAdmlzeC9ncm91cCc7XG5cbmV4cG9ydCB0eXBlIEJhckdyb3VwUHJvcHMgPSB7XG4gICAgZGF0YTogQ2hhcnREYXRhRGVmaW5pdGlvbltdO1xuICAgIGtleXM6IHN0cmluZ1tdO1xuICAgIGhlaWdodDogbnVtYmVyO1xuICAgIHhLZXk6IHN0cmluZztcbiAgICB4U2NhbGVEYXRhVHlwZTogRGF0YVR5cGU7XG4gICAgeFNjYWxlOiBTY2FsZUJhbmQ8c3RyaW5nPiB8IFNjYWxlQmFuZDxEYXRlPiB8IFNjYWxlQmFuZDxudW1iZXI+IHwgbnVsbDtcbiAgICBpbm5lclhTY2FsZTogU2NhbGVCYW5kPHN0cmluZz4gfCB1bmRlZmluZWQ7XG4gICAgeVNjYWxlOiBTY2FsZUxpbmVhcjxudW1iZXIsIG51bWJlciwgbmV2ZXI+O1xuICAgIG9uQ2xpY2s6IChlOiBSZWFjdC5Nb3VzZUV2ZW50PFNWR1JlY3RFbGVtZW50LCBNb3VzZUV2ZW50PiwgYmFyR3JvdXA6IGFueSwgYmFyOiBhbnkpID0+IHZvaWQ7XG4gICAgY29uZGl0aW9uYWxGb3JtYXR0aW5nUnVsZXM6IENvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVbXTtcbiAgICBiYXJzOiBTaGFwZURlZmluaXRpb248QmFyU3R5bGVzPltdO1xuICAgIGVuYWJsZUhvdmVyPzogYm9vbGVhbjtcbiAgICB5QXhpc0xhYmVscz86IHN0cmluZ1tdO1xuICAgIHlMYWJlbFBvc2l0aW9uPzogbnVtYmVyO1xuICAgIHNob3dEZXRhaWxlZFN1Ykdyb3VwaW5nTGFiZWxzOiBib29sZWFuO1xuICAgIGxhYmVsU3R5bGU/OiBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xufTtcblxuZXhwb3J0IGZ1bmN0aW9uIEJhckdyb3VwKHtcbiAgICBkYXRhLFxuICAgIGtleXMsXG4gICAgaGVpZ2h0LFxuICAgIHhLZXksXG4gICAgeFNjYWxlRGF0YVR5cGUsXG4gICAgeFNjYWxlLFxuICAgIGlubmVyWFNjYWxlLFxuICAgIHlTY2FsZSxcbiAgICBvbkNsaWNrLFxuICAgIGNvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVzLFxuICAgIGJhcnMsXG4gICAgZW5hYmxlSG92ZXIsXG4gICAgeUF4aXNMYWJlbHMsXG4gICAgeUxhYmVsUG9zaXRpb24sXG4gICAgc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHMsXG4gICAgbGFiZWxTdHlsZSxcbn06IEJhckdyb3VwUHJvcHMpIHtcbiAgICBjb25zdCBnZXRHcm91cFBvc2l0aW9uID0gKGQ6IERhdHVtT2JqZWN0KSA9PiB7XG4gICAgICAgIGNvbnN0IHhWYWx1ZSA9IGRbeEtleSBhcyBrZXlvZiB0eXBlb2YgZF07XG5cbiAgICAgICAgaWYgKHhTY2FsZURhdGFUeXBlID09PSAnc3RyaW5nJykgcmV0dXJuIFN0cmluZyh4VmFsdWUpO1xuXG4gICAgICAgIGlmICh4U2NhbGVEYXRhVHlwZSA9PT0gJ2RhdGVfdGltZScpIHtcbiAgICAgICAgICAgIHJldHVybiBuZXcgRGF0ZShTdHJpbmcoeFZhbHVlKSk7XG4gICAgICAgIH1cblxuICAgICAgICBpZiAoeFNjYWxlRGF0YVR5cGUgPT09ICdudW1iZXInKSB7XG4gICAgICAgICAgICByZXR1cm4gTnVtYmVyKHhWYWx1ZSk7XG4gICAgICAgIH1cblxuICAgICAgICByZXR1cm4gU3RyaW5nKHhWYWx1ZSk7XG4gICAgfTtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDxWaXN4QmFyR3JvdXA8RGF0dW1PYmplY3Q+XG4gICAgICAgICAgICBkYXRhPXtkYXRhIGFzIERhdHVtT2JqZWN0W119XG4gICAgICAgICAgICBrZXlzPXtrZXlzfVxuICAgICAgICAgICAgaGVpZ2h0PXtoZWlnaHR9XG4gICAgICAgICAgICB4MD17Z2V0R3JvdXBQb3NpdGlvbn1cbiAgICAgICAgICAgIC8vIEB0cy1pZ25vcmVcbiAgICAgICAgICAgIHgwU2NhbGU9e3hTY2FsZX1cbiAgICAgICAgICAgIC8vIEB0cy1pZ25vcmVcbiAgICAgICAgICAgIHgxU2NhbGU9e2lubmVyWFNjYWxlfVxuICAgICAgICAgICAgeVNjYWxlPXt5U2NhbGV9XG4gICAgICAgICAgICBjb2xvcj17KCkgPT4gJyd9XG4gICAgICAgID5cbiAgICAgICAgICAgIHtiYXJHcm91cHMgPT4ge1xuICAgICAgICAgICAgICAgIHJldHVybiBiYXJHcm91cHMubWFwKGJhckdyb3VwID0+IChcbiAgICAgICAgICAgICAgICAgICAgPEdyb3VwIGtleT17YGJhci1ncm91cC0ke2Jhckdyb3VwLmluZGV4fS0ke2Jhckdyb3VwLngwfWB9IGxlZnQ9e2Jhckdyb3VwLngwfT5cbiAgICAgICAgICAgICAgICAgICAgICAgIHtiYXJHcm91cC5iYXJzLm1hcChiYXIgPT4gKFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxCYXJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAga2V5PXtgYmFyLSR7YmFyLmluZGV4fS0ke2Jhci54fWB9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGJhcj17YmFyfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBiYXJHcm91cD17YmFyR3JvdXB9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGJhcnM9e2JhcnN9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVzPXtjb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlc31cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgZW5hYmxlSG92ZXI9e2VuYWJsZUhvdmVyfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBsYWJlbFN0eWxlPXtsYWJlbFN0eWxlfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBvbkNsaWNrPXtvbkNsaWNrfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBzaG93RGV0YWlsZWRTdWJHcm91cGluZ0xhYmVscz17c2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHN9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHlBeGlzTGFiZWxzPXt5QXhpc0xhYmVsc31cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgeUxhYmVsUG9zaXRpb249e3lMYWJlbFBvc2l0aW9ufVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICAgICAgICAgICAgICApKX1cbiAgICAgICAgICAgICAgICAgICAgPC9Hcm91cD5cbiAgICAgICAgICAgICAgICApKTtcbiAgICAgICAgICAgIH19XG4gICAgICAgIDwvVmlzeEJhckdyb3VwPlxuICAgICk7XG59XG5cbnR5cGUgQmFyUHJvcHMgPSB7XG4gICAgYmFyOiBhbnksXG4gICAgYmFyR3JvdXA6IGFueSxcbiAgICBiYXJzOiBTaGFwZURlZmluaXRpb248QmFyU3R5bGVzPltdO1xuICAgIGNvbmRpdGlvbmFsRm9ybWF0dGluZ1J1bGVzOiBDb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlW107XG4gICAgZW5hYmxlSG92ZXI/OiBib29sZWFuO1xuICAgIG9uQ2xpY2s6IChlOiBSZWFjdC5Nb3VzZUV2ZW50PFNWR1JlY3RFbGVtZW50LCBNb3VzZUV2ZW50PiwgYmFyR3JvdXA6IGFueSwgYmFyOiBhbnkpID0+IHZvaWQ7XG4gICAgc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHM6IGJvb2xlYW47XG4gICAgbGFiZWxTdHlsZT86IFJlYWN0LkNTU1Byb3BlcnRpZXM7XG4gICAgeUF4aXNMYWJlbHM/OiBzdHJpbmdbXTtcbiAgICB5TGFiZWxQb3NpdGlvbj86IG51bWJlcjtcbn1cblxuY29uc3QgQmFyID0gKHtcbiAgICBiYXIsXG4gICAgYmFyR3JvdXAsXG4gICAgYmFycyxcbiAgICBjb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlcyxcbiAgICBlbmFibGVIb3ZlcixcbiAgICBsYWJlbFN0eWxlLFxuICAgIG9uQ2xpY2ssXG4gICAgc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHMsXG4gICAgeUF4aXNMYWJlbHMsXG4gICAgeUxhYmVsUG9zaXRpb24sXG59OiBCYXJQcm9wcykgPT4ge1xuICAgIGNvbnN0IHNob3dCYXIgPSBiYXIudmFsdWUgIT09IG51bGwgJiYgYmFyLmhlaWdodCA+IDAgJiYgYmFyLndpZHRoID4gMDtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDxGcmFnbWVudD5cbiAgICAgICAgICAgIHtzaG93QmFyICYmIDxCYXJSZWN0XG4gICAgICAgICAgICAgICAga2V5PXtgYmFyLWdyb3VwLWJhci0ke2Jhckdyb3VwLmluZGV4fS0ke2Jhci5pbmRleH0tJHtiYXIudmFsdWV9LSR7U3RyaW5nKGJhci5rZXkpfWB9XG4gICAgICAgICAgICAgICAgeD17YmFyLnh9XG4gICAgICAgICAgICAgICAgeT17YmFyLnl9XG4gICAgICAgICAgICAgICAgd2lkdGg9e2Jhci53aWR0aH1cbiAgICAgICAgICAgICAgICBoZWlnaHQ9e2Jhci5oZWlnaHR9XG4gICAgICAgICAgICAgICAgZmlsbD17Z2V0QmFyRmlsbChiYXJzLCBjb25kaXRpb25hbEZvcm1hdHRpbmdSdWxlcywgU3RyaW5nKGJhci5rZXkpLCBiYXIudmFsdWUpfVxuICAgICAgICAgICAgICAgIG9uQ2xpY2s9e2UgPT4gb25DbGljayhlLCBiYXJHcm91cCwgYmFyKX1cbiAgICAgICAgICAgICAgICBlbmFibGVIb3Zlcj17ZW5hYmxlSG92ZXJ9XG4gICAgICAgICAgICAvPn1cbiAgICAgICAgICAgIFxuICAgICAgICAgICAgPEJhckxhYmVsXG4gICAgICAgICAgICAgICAgYmFyPXtiYXJ9XG4gICAgICAgICAgICAgICAgYmFyR3JvdXA9e2Jhckdyb3VwfVxuICAgICAgICAgICAgICAgIHlMYWJlbFBvc2l0aW9uPXt5TGFiZWxQb3NpdGlvbn1cbiAgICAgICAgICAgICAgICB5QXhpc0xhYmVscz17eUF4aXNMYWJlbHN9XG4gICAgICAgICAgICAgICAgc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHM9e3Nob3dEZXRhaWxlZFN1Ykdyb3VwaW5nTGFiZWxzfVxuICAgICAgICAgICAgICAgIGxhYmVsU3R5bGU9e2xhYmVsU3R5bGV9XG4gICAgICAgICAgICAvPlxuICAgICAgICA8L0ZyYWdtZW50PlxuICAgICk7XG59O1xuXG50eXBlIEJhclJlY3RQcm9wcyA9IHtcbiAgICBvbkNsaWNrOiAoZTogUmVhY3QuTW91c2VFdmVudDxTVkdSZWN0RWxlbWVudCwgTW91c2VFdmVudD4pID0+IHZvaWQ7XG4gICAgZmlsbD86IHN0cmluZztcbiAgICB4OiBudW1iZXI7XG4gICAgeTogbnVtYmVyO1xuICAgIHdpZHRoOiBudW1iZXI7XG4gICAgaGVpZ2h0OiBudW1iZXI7XG4gICAga2V5OiBzdHJpbmc7XG4gICAgZW5hYmxlSG92ZXI/OiBib29sZWFuO1xufTtcblxuY29uc3QgQmFyUmVjdCA9ICh7XG4gICAgb25DbGljayxcbiAgICBmaWxsLFxuICAgIHgsXG4gICAgeSxcbiAgICB3aWR0aCxcbiAgICBoZWlnaHQsXG4gICAga2V5LFxuICAgIGVuYWJsZUhvdmVyLFxufTogQmFyUmVjdFByb3BzKSA9PiB7XG4gICAgY29uc3QgW2ZpbGxDb2xvciwgc2V0RmlsbENvbG9yXSA9IHVzZVN0YXRlKGZpbGwpO1xuXG4gICAgY29uc3QgY2xhc3NlcyA9IGVuYWJsZUhvdmVyID8gY3NzKHsgY3Vyc29yOiAncG9pbnRlcicgfSkgOiAnJztcblxuICAgIGNvbnN0IGhhbmRsZU9uTW91c2VFbnRlciA9ICgpID0+IHtcbiAgICAgICAgaWYgKGVuYWJsZUhvdmVyKSB7XG4gICAgICAgICAgICBzZXRGaWxsQ29sb3IobGlnaHRlbkNvbG9yKGZpbGwsIDAuOCkpO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgY29uc3QgaGFuZGxlT25Nb3VzZUxlYXZlID0gKCkgPT4ge1xuICAgICAgICBpZiAoZW5hYmxlSG92ZXIpIHtcbiAgICAgICAgICAgIHNldEZpbGxDb2xvcihmaWxsKTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIHJldHVybiAoXG4gICAgICAgIDxyZWN0XG4gICAgICAgICAgICBrZXk9e2tleX1cbiAgICAgICAgICAgIHg9e3h9XG4gICAgICAgICAgICB5PXt5fVxuICAgICAgICAgICAgd2lkdGg9e3dpZHRofVxuICAgICAgICAgICAgaGVpZ2h0PXtoZWlnaHR9XG4gICAgICAgICAgICBmaWxsPXtmaWxsQ29sb3J9XG4gICAgICAgICAgICByeD17QkFSX1JBRElVU31cbiAgICAgICAgICAgIG9uQ2xpY2s9e29uQ2xpY2t9XG4gICAgICAgICAgICBvbk1vdXNlRW50ZXI9e2hhbmRsZU9uTW91c2VFbnRlcn1cbiAgICAgICAgICAgIG9uTW91c2VMZWF2ZT17aGFuZGxlT25Nb3VzZUxlYXZlfVxuICAgICAgICAgICAgY2xhc3NOYW1lPXtjbGFzc2VzfVxuICAgICAgICAvPlxuICAgICk7XG59O1xuXG50eXBlIEJhckxhYmVsUHJvcHMgPSB7XG4gICAgYmFyOiBhbnk7XG4gICAgYmFyR3JvdXA6IGFueTtcbiAgICB5TGFiZWxQb3NpdGlvbj86IG51bWJlcjtcbiAgICB5QXhpc0xhYmVscz86IHN0cmluZ1tdO1xuICAgIHNob3dEZXRhaWxlZFN1Ykdyb3VwaW5nTGFiZWxzOiBib29sZWFuO1xuICAgIGxhYmVsU3R5bGU/OiBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xufTtcblxuY29uc3QgQmFyTGFiZWwgPSAoe1xuICAgIGJhcixcbiAgICBiYXJHcm91cCxcbiAgICB5TGFiZWxQb3NpdGlvbixcbiAgICB5QXhpc0xhYmVscyxcbiAgICBzaG93RGV0YWlsZWRTdWJHcm91cGluZ0xhYmVscyxcbiAgICBsYWJlbFN0eWxlLFxufTogQmFyTGFiZWxQcm9wcykgPT4ge1xuICAgIGlmICghc2hvd0RldGFpbGVkU3ViR3JvdXBpbmdMYWJlbHMgfHwgIXlMYWJlbFBvc2l0aW9uIHx8ICF5QXhpc0xhYmVscykgcmV0dXJuIG51bGw7XG5cbiAgICBjb25zdCBsYWJlbCA9IHlBeGlzTGFiZWxzW2Jhci5pbmRleF07XG4gICAgY29uc3QgY29sdW1uTGFiZWwgPSBsYWJlbC5zcGxpdCgn4oCiJylbMF07XG5cbiAgICBsZXQgZm9ybWF0dGVkQ29sdW1uTGFiZWw6IHN0cmluZztcbiAgICBpZiAoY29sdW1uTGFiZWwubGVuZ3RoID49IDEzKSB7XG4gICAgICAgIGZvcm1hdHRlZENvbHVtbkxhYmVsID0gY29sdW1uTGFiZWwuc2xpY2UoMCwgMTApICsgJy4uLic7XG4gICAgfSBlbHNlIHtcbiAgICAgICAgZm9ybWF0dGVkQ29sdW1uTGFiZWwgPSBjb2x1bW5MYWJlbC5zbGljZSgwLCAxMyk7XG4gICAgfVxuXG4gICAgY29uc3QgbGFiZWxYR2FwID0gNDtcbiAgICBjb25zdCBsYWJlbFhQb3NpdGlvbiA9IGJhci54ICsgKGJhci53aWR0aCAvIDIpICsgbGFiZWxYR2FwO1xuXG4gICAgY29uc3QgbGFiZWxZR2FwID0gMTU7XG4gICAgY29uc3QgbGFiZWxZUG9zaXRpb24gPSB5TGFiZWxQb3NpdGlvbiArIGxhYmVsWUdhcDtcblxuICAgIGNvbnN0IGxhYmVsS2V5ID0gYGxhYmVsLSR7YmFyR3JvdXAuaW5kZXh9LSR7YmFyLmluZGV4fS0ke2xhYmVsfWA7XG5cbiAgICByZXR1cm4gPHRleHRcbiAgICAgICAga2V5PXtsYWJlbEtleX1cbiAgICAgICAgeD17bGFiZWxYUG9zaXRpb259XG4gICAgICAgIHk9e2xhYmVsWVBvc2l0aW9ufVxuICAgICAgICBzdHlsZT17bGFiZWxTdHlsZX1cbiAgICAgICAgdHJhbnNmb3JtPXtgcm90YXRlKC03MCwgJHtsYWJlbFhQb3NpdGlvbn0sICR7bGFiZWxZUG9zaXRpb259KWB9XG4gICAgICAgIHRleHRBbmNob3I9J2VuZCdcbiAgICA+XG4gICAgICAgIHtmb3JtYXR0ZWRDb2x1bW5MYWJlbH1cbiAgICA8L3RleHQ+XG59Il19 */",
     toString: _EMOTION_STRINGIFIED_CSS_ERROR__$9
   }) : '';
   var handleOnMouseEnter = function handleOnMouseEnter() {
@@ -44650,7 +44909,7 @@ var BarRect = function BarRect(_ref3) {
     onMouseEnter: handleOnMouseEnter,
     onMouseLeave: handleOnMouseLeave,
     className: classes
-  }, barRectKey);
+  }, key);
 };
 var BarLabel = function BarLabel(_ref4) {
   var bar = _ref4.bar,
@@ -44683,124 +44942,6 @@ var BarLabel = function BarLabel(_ref4) {
   }, labelKey);
 };
 
-var BarStacked = function BarStacked(_ref) {
-  var xScaleDataType = _ref.xScaleDataType,
-    data = _ref.data,
-    xScaleKey = _ref.xScaleKey,
-    yScale = _ref.yScale,
-    keys = _ref.keys,
-    bars = _ref.bars,
-    conditionalFormattingRules = _ref.conditionalFormattingRules,
-    xScale = _ref.xScale,
-    height = _ref.height,
-    width = _ref.width;
-  var handleGetXValue = function handleGetXValue(d) {
-    var xValue = d[xScaleKey];
-    if (xScaleDataType === 'string') return String(xValue);
-    if (xScaleDataType === 'date_time') {
-      return new Date(xValue);
-    }
-    if (xScaleDataType === 'number') {
-      return Number(xValue);
-    }
-    return String(xValue);
-  };
-  return jsx(BarStack$1, {
-    x: handleGetXValue,
-    xScale: xScale,
-    yScale: yScale,
-    data: data,
-    keys: keys,
-    color: function color() {
-      return '';
-    },
-    height: height,
-    width: width,
-    offset: "none",
-    children: function children(barStacks) {
-      return barStacks.map(function (barStack) {
-        return barStack.bars.map(function (bar) {
-          return jsx(Bar$1, {
-            bar: bar,
-            barStack: barStack,
-            bars: bars,
-            conditionalFormattingRules: conditionalFormattingRules
-          }, bar.key.toString() + "-" + bar.index + "-" + bar.x);
-        });
-      });
-    }
-  });
-};
-var Bar$1 = function Bar(_ref2) {
-  var bar = _ref2.bar,
-    barStack = _ref2.barStack,
-    bars = _ref2.bars,
-    conditionalFormattingRules = _ref2.conditionalFormattingRules;
-  var BAR_PADDING = 1.5;
-  if (bar.height < 3) return null;
-  return jsx("rect", {
-    x: bar.x,
-    y: bar.y,
-    width: bar.width,
-    height: bar.height - BAR_PADDING,
-    fill: getBarFill(bars, conditionalFormattingRules, bar.key, bar.bar.data),
-    rx: BAR_RADIUS
-  }, "bar-stack-" + barStack.index + "-" + bar.index);
-};
-
-var useBottomAxisBaseLineShift = function useBottomAxisBaseLineShift(_ref) {
-  var showDetailedSubGroupingLabels = _ref.showDetailedSubGroupingLabels,
-    hasBottomTitle = _ref.hasBottomTitle,
-    hasLeftTitle = _ref.hasLeftTitle;
-  if (!showDetailedSubGroupingLabels) {
-    return {
-      bottomAxisBaselineShift: 0,
-      bottomOffset: 0,
-      leftOffset: 0
-    };
-  }
-  return {
-    bottomAxisBaselineShift: hasBottomTitle ? -65 : -60,
-    bottomOffset: hasBottomTitle ? -15 : 10,
-    leftOffset: hasLeftTitle ? -10 : 0
-  };
-};
-
-var PADDING = {
-  paddingOuter: 0.05,
-  paddingInner: 0.3
-};
-
-function useBarXScale(xScaleDataType, innerWidth, xScaleKey, data) {
-  return useMemo(function () {
-    if (xScaleDataType === 'string') {
-      return scaleBand(_extends({
-        range: [0, innerWidth],
-        domain: xScaleKey ? [].concat(data.map(function (d) {
-          return d[xScaleKey] && d[xScaleKey].value !== null ? String(d[xScaleKey].value) : '';
-        })) : []
-      }, PADDING));
-    }
-    if (xScaleDataType === 'date_time' && xScaleKey) {
-      return scaleBand(_extends({
-        range: [0, innerWidth],
-        domain: data.map(function (d) {
-          return new Date(d[xScaleKey].value);
-        })
-      }, PADDING));
-    }
-    if (xScaleDataType === 'number' && xScaleKey) {
-      return scaleBand(_extends({
-        range: [0, innerWidth],
-        domain: data.map(function (d) {
-          return d[xScaleKey] && d[xScaleKey].value !== null ? Number(d[xScaleKey].value) : 0;
-        })
-      }, PADDING));
-    }
-    return null;
-  }, [innerWidth, data]);
-}
-
 var BarChart$5 = function BarChart(_ref) {
   var _theme$axis;
   var chart = _ref.chart,
@@ -44822,7 +44963,7 @@ var BarChart$5 = function BarChart(_ref) {
     tooltipData = _useTooltip.tooltipData,
     hideTooltip = _useTooltip.hideTooltip,
     showTooltip = _useTooltip.showTooltip;
-  var showDetailedSubGroupingLabels = !options.stacked && numberOfDimensions === 2 && width > 450;
+  var showDetailedSubGroupingLabels = numberOfDimensions === 2 && width > 450;
   var hasBottomTitle = chart.x.title != null;
   var hasLeftTitle = chart.y.title != null;
   var _useBottomAxisBaseLin = useBottomAxisBaseLineShift({
@@ -44835,7 +44976,7 @@ var BarChart$5 = function BarChart(_ref) {
     leftOffset = _useBottomAxisBaseLin.leftOffset;
   var margin = buildMargin(chart.y.ticks, options.axis.showYAxisLabels, hasLeftTitle, hasBottomTitle, showDetailedSubGroupingLabels);
   var innerWidth = width - margin.left - margin.right;
-  var innerHeight = height - margin.top - margin.bottom - (options.showLegend ? 50 : 0) - (showDetailedSubGroupingLabels ? 50 : 0) + (options.axis.showXAxisLabels ? 0 : 25);
+  var innerHeight = height - margin.top - margin.bottom - (options.showLegend ? 50 : 0) - (showDetailedSubGroupingLabels ? 50 : 0);
   var xKey = chart.x.key;
   var xScaleKey = chart.x.scale.key;
   var xScaleDataType = chart.x.scale.dataType;
@@ -45429,7 +45570,6 @@ function Area(_ref3) {
   });
 }
 
-var MAX_BUBBLE_RADIUS = 30;
 var BubbleChart$4 = function BubbleChart(_ref) {
   var _theme$axis;
   var chart = _ref.chart,
@@ -45451,34 +45591,25 @@ var BubbleChart$4 = function BubbleChart(_ref) {
   var zValues = chart.z ? chart.data.map(function (d) {
     return d[chart.z];
   }).map(function (d) {
-    return d == null ? void 0 : d.value;
+    return d.value;
   }) : [];
   var normaliseArray = function normaliseArray(array, min, max) {
     var arrayMin = Math.min.apply(Math, array);
     var arrayMax = Math.max.apply(Math, array);
-    if (arrayMin === arrayMax) {
-      return array.map(function () {
-        return min;
-      });
-    }
     return array.map(function (value) {
       return (value - arrayMin) / (arrayMax - arrayMin) * (max - min) + min;
     });
   };
-  var scaledSizeValues = normaliseArray(zValues, 5, MAX_BUBBLE_RADIUS);
+  var scaledSizeValues = normaliseArray(zValues, 5, 30);
   var margin = buildMargin(chart.y.ticks, options.axis.showYAxisLabels, chart.y.title != null, chart.x.title != null);
   var _useState = useState(chart.lines.map(function (legendItem) {
       return legendItem.yKey;
-    }).filter(function (yKey) {
-      return yKey !== chart.groupByKey;
     })),
     visibleYKeys = _useState[0],
     setVisibleYKeys = _useState[1];
   useEffect(function () {
     setVisibleYKeys(chart.lines.map(function (legendItem) {
       return legendItem.yKey;
-    }).filter(function (yKey) {
-      return yKey !== chart.groupByKey;
     }));
     return function () {
       setVisibleYKeys([]);
@@ -45504,13 +45635,13 @@ var BubbleChart$4 = function BubbleChart(_ref) {
     if (xScaleDataType === 'date_time') {
       return scaleTime({
         range: [0, innerWidth],
-        domain: chart.x.scale.ordering === 'desc' ? [chart.x.scale.max, chart.x.scale.min] : [chart.x.scale.min, chart.x.scale.max]
+        domain: chart.x.scale.ordering === 'asc' ? [chart.x.scale.min, chart.x.scale.max] : [chart.x.scale.max, chart.x.scale.min]
       });
     }
     if (xScaleDataType === 'number') {
       return scaleLinear({
         range: [0, innerWidth],
-        domain: chart.x.scale.ordering === 'desc' ? [chart.x.scale.max, chart.x.scale.min] : [chart.x.scale.min, chart.x.scale.max],
+        domain: chart.x.scale.ordering === 'asc' ? [chart.x.scale.min, chart.x.scale.max] : [chart.x.scale.max, chart.x.scale.min],
         nice: true
       });
     }
@@ -45549,18 +45680,11 @@ var BubbleChart$4 = function BubbleChart(_ref) {
   var yTickValues = chart.y.ticks.map(function (tick) {
     return Number(tick.value);
   });
-  var tooltipItems = [{
+  var legendTooltipItems = [{
     legendItems: chart.lines,
     visibleYKeys: visibleYKeys,
     conditionalFormattingRules: chart.conditionalFormattingRules
   }];
-  var legendItems = chart.legend.items.map(function (legendItem) {
-    return {
-      legendItems: [legendItem],
-      visibleYKeys: [legendItem.yKey],
-      conditionalFormattingRules: chart.conditionalFormattingRules
-    };
-  });
   return jsxs(React__default.Fragment, {
     children: [jsxs(ChartWrapper$1, {
       width: width,
@@ -45638,20 +45762,20 @@ var BubbleChart$4 = function BubbleChart(_ref) {
         width: innerWidth
       })]
     }), options.showLegend && jsx(Legend$1, {
-      items: legendItems,
-      keys: chart.legend.keys,
+      items: legendTooltipItems,
+      setVisibleYKeys: setVisibleYKeys,
+      keys: chart.keys,
       marginLeft: margin.left - margin.leftTitleOffset
     }), tooltipOpen && tooltipData && xKey && jsx(Tooltip$1, {
-      items: tooltipItems,
+      items: legendTooltipItems,
       tooltipData: tooltipData,
       tooltipLeft: tooltipLeft,
       tooltipTop: tooltipTop,
-      xKey: chart.groupByKey,
+      xKey: xKey,
       keys: chart.keys,
       yKeys: chart.y.keys,
       showRoundedTotal: options.showRoundedTotal,
-      theme: themeCSS.popoverMenus,
-      shouldShowColorLegend: false
+      theme: themeCSS.popoverMenus
     })]
   });
 };
@@ -45662,9 +45786,6 @@ function Bubbles(_ref2) {
     xScale = _ref2.xScale,
     yScale = _ref2.yScale,
     chart = _ref2.chart;
-  var getBubbleColor = function getBubbleColor(index) {
-    return chart.legend.items[index % chart.legend.items.length].color;
-  };
   return jsx(Fragment, {
     children: data.map(function (d, index) {
       var _ref3, _yScale2;
@@ -45672,7 +45793,10 @@ function Bubbles(_ref2) {
         r: d.bubbleSize,
         cx: (_ref3 = xScale(d[xScaleKey])) != null ? _ref3 : 0,
         cy: (_yScale2 = yScale(d[yKeys[0]])) != null ? _yScale2 : 0,
-        fill: getBubbleColor(index)
+        fill: chart.lines[0].color,
+        style: {
+          zIndex: -d.bubbleSize
+        }
       }, "bubble_chart_" + index);
     })
   });
@@ -45947,21 +46071,6 @@ var RadarChart$2 = function RadarChart(_ref) {
   });
 };
 
-var init$d = function init(xMeasure, yMeasure) {
-  return {
-    x: xMeasure.map(function (measure) {
-      return id(measure);
-    }),
-    y: yMeasure.map(function (measure) {
-      return id(measure);
-    }),
-    detailed: {
-      x: xMeasure,
-      y: yMeasure
-    }
-  };
-};
-
 var getStyleDefinition = function getStyleDefinition(_ref) {
   var colors = _ref.colors,
     yKeys = _ref.yKeys;
@@ -46040,7 +46149,7 @@ var getScaleAndTicks = function getScaleAndTicks(_ref) {
     yKeys = _ref.yKeys,
     xScaleDataType = _ref.xScaleDataType,
     nullValue = _ref.nullValue,
-    approxYAxisLabelCount = _ref.approxYAxisLabelCount,
+    tickCountYAxis = _ref.tickCountYAxis,
     formattingFunctionX = _ref.formattingFunctionX,
     formattingFunctionY = _ref.formattingFunctionY,
     order = _ref.order,
@@ -46057,18 +46166,32 @@ var getScaleAndTicks = function getScaleAndTicks(_ref) {
     keys: xScale.key === null ? [] : [xScale.key],
     dataType: xScale.dataType
   });
+  if (xKey) {
+    xTicks = data.map(function (dataItem) {
+      var _dataItem$xKey, _dataItem$xScale$key, _dataItem$xScale$key2;
+      var xValue = (_dataItem$xKey = dataItem[xKey]) != null && _dataItem$xKey.value ? dataItem[xKey].value : null;
+      var xformattedValue = formattingFunctionX(xValue, nullValue);
+      var xScaleValue = xScale.key !== null && (_dataItem$xScale$key = dataItem[xScale.key]) != null && _dataItem$xScale$key.value ? (_dataItem$xScale$key2 = dataItem[xScale.key]) == null ? void 0 : _dataItem$xScale$key2.value : '';
+      var xScaleValueAdjusted = xScale.dataType === 'date_time' ? new Date(xScaleValue) : xScale.dataType === 'string' ? String(xScaleValue) : xScale.dataType === 'number' ? Number(xScaleValue) : xScaleValue;
+      return {
+        value: xValue !== null ? xValue : '',
+        formattedValue: xformattedValue !== null ? "" + xformattedValue : null,
+        scaleValue: xScaleValueAdjusted
+      };
+    });
+  }
+  // ----- Y Axis ("number") -----
+
   var y = getMinAndMax({
     data: data,
     keys: yKeys,
     dataType: 'number',
     goalLines: goalLines
   });
-  var maxY = y.max ? y.max * 1.1 : y.max || 1;
+  var maxY = y.max || 0;
   var minY = Math.min(y.min || 0, 0);
-  var tickCountYAxis = approxYAxisLabelCount === 'auto' ? 10 : approxYAxisLabelCount;
   var yTickInterval = getNiceInterval((maxY - minY) / (tickCountYAxis - 1));
-  var i = 0;
-  while (yTickInterval * i <= maxY + yTickInterval) {
+  for (var i = 0; i < tickCountYAxis; i++) {
     var _value = yTickInterval * i;
     var formattedValue = formattingFunctionY(_value, nullValue);
     yTicks.push({
@@ -46076,29 +46199,14 @@ var getScaleAndTicks = function getScaleAndTicks(_ref) {
       formattedValue: formattedValue,
       scaleValue: _value
     });
-    i++;
-  }
-  var maxX = x.max ? x.max * 1.05 : x.max || 1;
-  var minX = Math.min(x.min || 0, 0);
-  var xTickInterval = getNiceInterval((maxX - minX) / (10 - 1));
-  i = 0;
-  while (xTickInterval * i <= maxX + xTickInterval) {
-    var _value2 = xTickInterval * i;
-    var _formattedValue = formattingFunctionX(_value2, nullValue);
-    xTicks.push({
-      value: _value2,
-      formattedValue: _formattedValue,
-      scaleValue: _value2
-    });
-    i++;
   }
   return {
     x: {
       ticks: xTicks,
       scale: {
         dataType: xScale.dataType,
-        max: maxX,
-        min: minX,
+        max: x.max,
+        min: x.min,
         key: xScale.key,
         ordering: xScale.ordering
       }
@@ -46107,7 +46215,7 @@ var getScaleAndTicks = function getScaleAndTicks(_ref) {
       ticks: yTicks,
       scale: {
         dataType: 'number',
-        key: yKeys[0],
+        key: null,
         ordering: 'asc',
         max: maxY,
         min: minY
@@ -46145,6 +46253,223 @@ var getGoalLines = function getGoalLines(_ref) {
   });
 };
 
+var buildTrendAndForecast = function buildTrendAndForecast(_ref) {
+  var data = _ref.data,
+    forecastUnits = _ref.forecastUnits,
+    xKey = _ref.xKey,
+    yKey = _ref.yKey,
+    timeUnit = _ref.timeUnit,
+    includeForecast = _ref.includeForecast;
+  var forecastKey = yKey + "_forecast";
+  var trendKey = yKey + "_trend";
+  var trendData = [];
+  var forecastData = [];
+  var values = data.map(function (point) {
+    return Number(point[yKey].value);
+  });
+  var dates = data.map(function (point) {
+    return new Date(point[xKey].value);
+  });
+  var n = values.length;
+  var daysSinceStart = dates.map(function (date) {
+    return (date.getTime() - dates[0].getTime()) / 86400000;
+  });
+  var meanX = daysSinceStart.reduce(function (a, b) {
+    return a + b;
+  }, 0) / n;
+  var meanY = values.reduce(function (a, b) {
+    return a + b;
+  }, 0) / n;
+  var numerator = 0,
+    denominator = 0;
+  for (var i = 0; i < n; i++) {
+    numerator += (daysSinceStart[i] - meanX) * (values[i] - meanY);
+    denominator += Math.pow(daysSinceStart[i] - meanX, 2);
+  }
+  var slope = numerator / denominator;
+  var intercept = meanY - slope * meanX;
+  var forecastDate = new Date(dates[n - 1]); // Start from the last date in the data
+
+  for (var _i = 0; _i < n + (includeForecast ? forecastUnits : 0); _i++) {
+    var x = void 0;
+    if (_i < n) {
+      // Use existing dates for current trend values
+      x = dates[_i];
+    } else if (includeForecast) {
+      // Generate future dates for forecast values if includeForecast is true
+      switch (timeUnit) {
+        case 'week':
+          forecastDate.setDate(forecastDate.getDate() + 7);
+          break;
+        case 'month':
+          forecastDate.setMonth(forecastDate.getMonth() + 1);
+          break;
+        case 'quarter':
+          forecastDate.setMonth(forecastDate.getMonth() + 3);
+          break;
+        case 'year':
+          forecastDate.setFullYear(forecastDate.getFullYear() + 1);
+          break;
+      }
+      x = new Date(forecastDate);
+    } else {
+      continue; // Skip this iteration if forecasting is not included
+    }
+    var dayCount = (x.getTime() - dates[0].getTime()) / 86400000; // 1 day in milliseconds
+    var forecastedValue = slope * dayCount + intercept;
+    var currentValue = slope * dayCount + intercept;
+    if (_i >= n - 1) {
+      if (_i === n - 1) {
+        trendData.push({
+          date: x.toISOString(),
+          value: parseFloat(currentValue.toFixed(2))
+        });
+      }
+      if (includeForecast) {
+        forecastData.push({
+          date: x.toISOString(),
+          value: parseFloat(forecastedValue.toFixed(2))
+        });
+      }
+    } else {
+      trendData.push({
+        date: x.toISOString(),
+        value: parseFloat(currentValue.toFixed(2))
+      });
+    }
+  }
+  return {
+    trendData: trendData,
+    trendKey: trendKey,
+    forecastData: forecastData,
+    forecastKey: forecastKey
+  };
+};
+
+var getTrendsAndForecastsData = function getTrendsAndForecastsData(_ref) {
+  var _trendsAndForecasts$;
+  var chartData = _ref.chartData,
+    formattingFunctionX = _ref.formattingFunctionX,
+    formattingFunctionY = _ref.formattingFunctionY,
+    keys = _ref.keys,
+    nullValue = _ref.nullValue,
+    orderFunction = _ref.orderFunction,
+    trendsAndForecasts = _ref.trendsAndForecasts,
+    xAxisPostfix = _ref.xAxisPostfix,
+    xAxisPrefix = _ref.xAxisPrefix,
+    xKey = _ref.xKey,
+    xScaleDataType = _ref.xScaleDataType,
+    yAxisPostfix = _ref.yAxisPostfix,
+    yAxisPrefix = _ref.yAxisPrefix,
+    yKeys = _ref.yKeys;
+  if (!trendsAndForecasts || trendsAndForecasts.length === 0 || xScaleDataType !== 'date_time') return {
+    chartData: chartData
+  };
+  if (!orderFunction || !['week', 'month', 'quarter', 'year'].includes(orderFunction)) return {
+    chartData: chartData
+  };
+
+  // ----- Technically we should do a loop here but at the moment we'll only have one trend/forecast so use trendsAndForecasts[0] -----
+
+  var includeForecast = trendsAndForecasts[0].type === 'Forecast';
+  var forecastUnits = trendsAndForecasts[0].type === 'Forecast' ? (_trendsAndForecasts$ = trendsAndForecasts[0].value) != null ? _trendsAndForecasts$ : 0 : 0;
+  var yKey = yKeys[0];
+  var newKeys = cloneDeep(keys);
+  var _buildTrendAndForecas = buildTrendAndForecast({
+      data: chartData,
+      forecastUnits: forecastUnits,
+      xKey: xKey,
+      yKey: yKey,
+      timeUnit: orderFunction,
+      includeForecast: includeForecast
+    }),
+    trendData = _buildTrendAndForecas.trendData,
+    trendKey = _buildTrendAndForecas.trendKey,
+    forecastData = _buildTrendAndForecas.forecastData,
+    forecastKey = _buildTrendAndForecas.forecastKey;
+
+  // ----- Add Trend To Existing Data Array And Trend Key -----
+
+  var newData = chartData.map(function (dataItem) {
+    var date = dataItem[xKey].value;
+    var trend = trendData.find(function (trendItem) {
+      return trendItem.date === date;
+    });
+    if (trend) {
+      var trendDataItem = {
+        value: trend.value,
+        formattedValue: "" + yAxisPrefix + formattingFunctionY(trend.value, nullValue) + yAxisPostfix
+      };
+      if (includeForecast && forecastData.length > 0) {
+        var _extends2;
+        return _extends({}, dataItem, (_extends2 = {}, _extends2[trendKey] = trendDataItem, _extends2[forecastKey] = {
+          value: null,
+          formattedValue: null
+        }, _extends2));
+      } else {
+        var _extends3;
+        return _extends({}, dataItem, (_extends3 = {}, _extends3[trendKey] = trendDataItem, _extends3));
+      }
+    }
+    return null;
+  });
+
+  // ----- Add New Array Items For Forecast & Forecast Key -----
+
+  if (includeForecast && forecastData.length > 0) {
+    var _loop = function _loop() {
+      var _forecastIncrement;
+      var forecastDataItem = forecastData[index];
+      var forecastIncrement = (_forecastIncrement = {}, _forecastIncrement[xKey] = {
+        value: forecastDataItem.date,
+        formattedValue: "" + xAxisPrefix + formattingFunctionX(forecastDataItem.date, nullValue) + xAxisPostfix
+      }, _forecastIncrement[trendKey] = {
+        value: null,
+        formattedValue: null
+      }, _forecastIncrement[forecastKey] = {
+        value: forecastDataItem.value,
+        formattedValue: "" + yAxisPrefix + formattingFunctionY(forecastDataItem.value, nullValue) + yAxisPostfix
+      }, _forecastIncrement);
+      yKeys.forEach(function (key) {
+        forecastIncrement[key] = {
+          value: null,
+          formattedValue: null
+        };
+      });
+      newData.push(forecastIncrement);
+    };
+    for (var index = 0; index < forecastUnits; index++) {
+      _loop();
+    }
+  }
+
+  // ----- Update Keys -----
+
+  var newYKeys = includeForecast && forecastData.length > 0 ? [].concat(yKeys, [trendKey, forecastKey]) : [].concat(yKeys, [trendKey]);
+  newKeys[trendKey] = {
+    key: trendKey,
+    keyFormatted: newKeys[yKey].keyFormatted + " \u2022 Trend",
+    dataType: 'number'
+  };
+  if (includeForecast && forecastData.length > 0) {
+    newKeys[forecastKey] = {
+      key: forecastKey,
+      keyFormatted: newKeys[yKey].keyFormatted + " \u2022 Forecast",
+      dataType: 'number'
+    };
+  }
+
+  // ----- Create style definitions for trend and forecast in the form of legend items to append to getStyleDefinition() -----
+
+  // TODO
+
+  return {
+    newChartData: newData,
+    newYKeys: newYKeys,
+    newKeys: newKeys
+  };
+};
+
 /**
  * When provided with a result, and formatting parameters, it returns a
  * populated result including the formatted value to show.
@@ -46241,28 +46566,77 @@ var formatResult = function formatResult(result, params) {
   };
 };
 
-var formattedResultToSeries = function formattedResultToSeries(formattedResult, pivotConfig, zFieldId) {
+var formattedResultToSeries = function formattedResultToSeries(formattedResult, pivotConfig, seriesLabelFormatter, zFieldId) {
+  var _formattedResult$fiel, _formattedResult$fiel2;
   var keys = {};
-  formattedResult.fields.forEach(function (field) {
-    keys[field.id] = {
-      key: field.id,
-      dataType: field.dataType,
-      outputDataType: field.outputDataType,
-      keyFormatted: field["function"] === 'none' ? field.publicName : field.publicName + " (" + field["function"] + ")"
-    };
+
+  // Collect the result fields which are going to be used on the Y axis.
+  var yResultFields = formattedResult.fields.filter(function (resultField) {
+    var isNotXPivot = !pivotConfig.x.includes(resultField.id);
+    var isNotYPivot = !pivotConfig.y.includes(resultField.id);
+    return isNotXPivot && isNotYPivot;
   });
+  var xPivotFields = formattedResult.fields.filter(function (resultField) {
+    return pivotConfig.x.includes(resultField.id);
+  });
+  var yPivotFields = formattedResult.fields.filter(function (resultField) {
+    return pivotConfig.y.includes(resultField.id);
+  });
+  var pivotedData = {};
+  var xKeyOrdering = [];
+  var yKeys = {};
+  formattedResult.contentMapped.forEach(function (row) {
+    xPivotFields.forEach(function (xPivotField) {
+      var _extends2;
+      var uniqueXValue = xPivotField.id + ":" + row[xPivotField.id].value;
+      xKeyOrdering.push(uniqueXValue);
+
+      // Add any existing values, and the x key itself
+
+      var yPivotPrefix = yPivotFields.map(function (yPivotField) {
+        return yPivotField.id + ":" + row[yPivotField.id].value;
+      }).join('_');
+      pivotedData[uniqueXValue] = _extends({}, pivotedData[uniqueXValue] || {}, (_extends2 = {}, _extends2[xPivotField.id] = row[xPivotField.id], _extends2));
+      yResultFields.forEach(function (yResultField) {
+        var _extends3;
+        var key = yPivotFields.length > 0 ? [yPivotPrefix, yResultField.id].join('_') : yResultField.id;
+        yKeys[key] = true;
+        keys[key] = {
+          key: key,
+          dataType: yResultField.dataType,
+          outputDataType: yResultField.outputDataType,
+          keyFormatted: seriesLabelFormatter({
+            yResultField: yResultField,
+            yPivotFields: yPivotFields,
+            row: row
+          })
+        };
+        pivotedData[uniqueXValue] = _extends({}, pivotedData[uniqueXValue] || {}, (_extends3 = {}, _extends3[key] = row[yResultField.id], _extends3));
+      });
+    });
+  });
+  var seriesDataFlattened = uniq(xKeyOrdering).map(function (xKey) {
+    return pivotedData[xKey];
+  });
+  var mappedXKeys = xPivotFields.map(function (r) {
+    return r.id;
+  });
+  var mappedYKeys = Object.keys(yKeys);
+  var mappedZKey = (_formattedResult$fiel = (_formattedResult$fiel2 = formattedResult.fields.find(function (resultField) {
+    return resultField.fieldId === zFieldId;
+  })) == null ? void 0 : _formattedResult$fiel2.id) != null ? _formattedResult$fiel : '';
   var formattedResultReturn = {
-    xKeys: pivotConfig.x,
-    yKeys: pivotConfig.y,
-    zKey: zFieldId,
+    xKeys: mappedXKeys,
+    yKeys: mappedYKeys,
+    zKey: mappedZKey,
     keys: keys,
-    seriesData: formattedResult.contentMapped
+    seriesData: seriesDataFlattened
   };
   return formattedResultReturn;
 };
 
 var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_ref) {
-  var _pivotConfig$x$, _xKeys$, _formattedResult$fiel, _formattedResult$fiel2, _axisTitles$x, _axisTitles$y;
+  var _pivotConfig$x$, _xKeys$, _axisTitles$x, _axisTitles$y;
   var axisTitles = _ref.axisTitles,
     colors = _ref.colors,
     conditionalFormattingAttributes = _ref.conditionalFormattingAttributes,
@@ -46274,6 +46648,7 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
     order = _ref.order,
     pivotConfig = _ref.pivotConfig,
     result = _ref.result,
+    trendsAndForecasts = _ref.trendsAndForecasts,
     xAxisFormat = _ref.xAxisFormat,
     xAxisPostfix = _ref.xAxisPostfix,
     xAxisPrefix = _ref.xAxisPrefix,
@@ -46281,6 +46656,7 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
     yAxisPostfix = _ref.yAxisPostfix,
     yAxisPrefix = _ref.yAxisPrefix,
     approxYAxisLabelCount = _ref.approxYAxisLabelCount,
+    seriesLabelFormatter = _ref.seriesLabelFormatter,
     _valueAlias = _ref.valueAlias,
     zFieldId = _ref.zFieldId;
   var allPrefixes = {};
@@ -46363,6 +46739,7 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
   var xKeyField = result.fields.find(function (field) {
     return field.id === xKeyTemp;
   });
+  var orderFunction = order.length > 0 ? order[0]["function"] : undefined;
 
   // ----- Formatting -----
 
@@ -46379,7 +46756,7 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
   var formattingFunctionY = function formattingFunctionY(value) {
     // Use any y axis field as they are all formatted in the same way (for now...);
     var nonPivotField = formattedResult.fields.find(function (resultField) {
-      return pivotConfig.y.includes(resultField.id);
+      return ![].concat(pivotConfig.x, pivotConfig.y).includes(resultField.id);
     });
     if (!nonPivotField) return '';
     return formattedResult.formatterFunc(value, {
@@ -46391,23 +46768,33 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
 
   // ----- Keys & Prep -----
   var xScaleDataType = (xKeyField == null ? void 0 : xKeyField.outputDataType) || 'string';
-  var _formattedResultToSer = formattedResultToSeries(formattedResult, pivotConfig, zFieldId),
+  var _formattedResultToSer = formattedResultToSeries(formattedResult, pivotConfig, seriesLabelFormatter, zFieldId),
     keys = _formattedResultToSer.keys,
     yKeys = _formattedResultToSer.yKeys,
     xKeys = _formattedResultToSer.xKeys,
     zKey = _formattedResultToSer.zKey,
     chartData = _formattedResultToSer.seriesData;
-  var sortedChartData = chartData.sort(function (a, b) {
-    var _order$, _a$pivotConfig$x$, _b$pivotConfig$x$;
-    var isDescending = ((_order$ = order[0]) == null ? void 0 : _order$.direction) === 'desc';
-    var xValueA = (_a$pivotConfig$x$ = a[pivotConfig.x[0]]) == null ? void 0 : _a$pivotConfig$x$.value;
-    var xValueB = (_b$pivotConfig$x$ = b[pivotConfig.x[0]]) == null ? void 0 : _b$pivotConfig$x$.value;
-    if (xValueA < xValueB) return isDescending ? 1 : -1;
-    if (xValueA > xValueB) return isDescending ? -1 : 1;
-    return 0;
-  });
   var xKey = (_xKeys$ = xKeys[0]) != null ? _xKeys$ : null;
 
+  // ----- Trends & Forecasts -----
+
+  var trendsAndForecastData = getTrendsAndForecastsData({
+    chartData: chartData,
+    formattingFunctionX: formattingFunctionX,
+    formattingFunctionY: formattingFunctionY,
+    keys: keys,
+    nullValue: nullValue,
+    trendsAndForecasts: trendsAndForecasts,
+    xAxisPostfix: xAxisPostfix,
+    xKey: xKey,
+    yKeys: yKeys,
+    xAxisPrefix: xAxisPrefix,
+    xScaleDataType: xScaleDataType,
+    yAxisPostfix: yAxisPostfix,
+    yAxisPrefix: yAxisPrefix,
+    orderFunction: orderFunction
+  });
+
   // ----- Goal Lines -----
 
   var goalLines = getGoalLines({
@@ -46418,11 +46805,11 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
   // ----- Ticks -----
 
   var ticks = getScaleAndTicks({
-    data: sortedChartData,
+    data: chartData,
     xKey: xKey,
     xScaleDataType: xScaleDataType,
     yKeys: yKeys,
-    approxYAxisLabelCount: approxYAxisLabelCount,
+    tickCountYAxis: approxYAxisLabelCount,
     formattingFunctionX: formattingFunctionX,
     formattingFunctionY: formattingFunctionY,
     nullValue: nullValue,
@@ -46432,36 +46819,9 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
 
   // ----- Lines -----
 
-  var groupByKey = (_formattedResult$fiel = (_formattedResult$fiel2 = formattedResult.fields.find(function (field) {
-    return field["function"] === 'none';
-  })) == null ? void 0 : _formattedResult$fiel2.id) != null ? _formattedResult$fiel : '';
   var styleDefinition = getStyleDefinition({
-    colors: colors,
-    yKeys: [].concat(yKeys, [xKey, zKey])
-  });
-
-  // ----- Legend -----
-  var colorScale = themeToColorScale(colors, sortedChartData.length);
-  var legendItems = sortedChartData.map(function (d, index) {
-    var _d$groupByKey, _colorScale;
-    return {
-      yKey: (_d$groupByKey = d[groupByKey]) == null ? void 0 : _d$groupByKey.value,
-      color: (_colorScale = colorScale[index % colorScale.length]) != null ? _colorScale : '',
-      style: {
-        strokeWidth: 3,
-        strokeDasharray: null,
-        type: 'line'
-      }
-    };
-  });
-  var legendKeys = {};
-  sortedChartData.forEach(function (row) {
-    var _row$groupByKey, _row$groupByKey$value, _row$groupByKey2, _row$groupByKey$forma, _row$groupByKey3;
-    legendKeys[(_row$groupByKey = row[groupByKey]) == null ? void 0 : _row$groupByKey.value] = {
-      key: (_row$groupByKey$value = (_row$groupByKey2 = row[groupByKey]) == null ? void 0 : _row$groupByKey2.value) != null ? _row$groupByKey$value : '',
-      dataType: 'string',
-      keyFormatted: (_row$groupByKey$forma = (_row$groupByKey3 = row[groupByKey]) == null ? void 0 : _row$groupByKey3.formattedValue) != null ? _row$groupByKey$forma : ''
-    };
+    colors: colors != null ? colors : ['#feae4a', '#5fbaff', '#e15e9d'],
+    yKeys: yKeys
   });
 
   // ----- Conditional Formatting -----
@@ -46500,24 +46860,21 @@ var buildBubbleChartRepresentation = function buildBubbleChartRepresentation(_re
       title: (_axisTitles$y = axisTitles == null ? void 0 : axisTitles.y) != null ? _axisTitles$y : null
     },
     z: zKey,
-    data: sortedChartData,
+    data: chartData,
     lines: styleDefinition,
     conditionalFormattingRules: conditionalFormattingRules,
-    goalLines: goalLines,
-    groupByKey: groupByKey,
-    legend: {
-      keys: legendKeys,
-      items: legendItems
-    }
+    goalLines: goalLines
   };
   return chart;
 };
 
 var BubbleChartV2View = function BubbleChartV2View(props) {
-  var _props$library, _props$attributes$vie, _props$result, _props$result2, _props$result3;
+  var _props$library, _props$attributes$vie;
   var _useDashboardBehaviou = useDashboardBehaviourContext(),
     textOverride = _useDashboardBehaviou.textOverride,
-    valueAlias = _useDashboardBehaviou.valueAlias;
+    valueAlias = _useDashboardBehaviou.valueAlias,
+    labelFormat = _useDashboardBehaviou.labelFormat,
+    queryEngineConfig = _useDashboardBehaviou.queryEngineConfig;
   var headerProps = {
     displayTitle: props.attributes.displayTitle,
     displaySubject: props.attributes.displaySubject,
@@ -46538,12 +46895,12 @@ var BubbleChartV2View = function BubbleChartV2View(props) {
   var showHeadline = headlineAvailable(props.attributes.order, props.attributes.headline, null);
   var theme = useTheme();
   var BubbleChartV2Component = getComponentInterface(props.attributes.type);
-  var pivotConfig = init$d(props.attributes.xMeasure, props.attributes.measure);
+  var pivotConfig = init$c(props.attributes);
   var chartRepresentation = null;
   if (!isLoading(props.result) && !hasFailed(props.result) && !isEmpty(props.result) && BubbleChartV2Component.isRunnable(props.attributes)) {
     var _theme$charts$colors, _theme$charts, _props$attributes$goa;
     chartRepresentation = buildBubbleChartRepresentation({
-      zFieldId: id(props.attributes.zMeasure[0]),
+      zFieldId: props.attributes.zMeasure[0].field,
       axisTitles: props.attributes.axisTitles,
       xAxisPostfix: props.attributes.xAxisPostfix,
       xAxisPrefix: props.attributes.xAxisPrefix,
@@ -46551,7 +46908,7 @@ var BubbleChartV2View = function BubbleChartV2View(props) {
       yAxisPrefix: props.attributes.yAxisPrefix,
       yAxisFormat: props.attributes.yAxisFormat,
       xAxisFormat: props.attributes.xAxisFormat,
-      approxYAxisLabelCount: props.attributes.approxYAxisLabelCount,
+      approxYAxisLabelCount: props.attributes.approxYAxisLabelCount === 'auto' ? 10 : props.attributes.approxYAxisLabelCount,
       colors: (_theme$charts$colors = theme == null || (_theme$charts = theme.charts) == null ? void 0 : _theme$charts.colors) != null ? _theme$charts$colors : DEFAULT_CHART_COLORS,
       valueAlias: valueAlias,
       nullValue: checkForNullValue(props.attributes.dataSetId, props.attributes.dimension, props.attributes.timeDimension, textOverride, valueAlias),
@@ -46562,7 +46919,27 @@ var BubbleChartV2View = function BubbleChartV2View(props) {
       dateTimeFormatOptions: props.dateTimeFormatOptions,
       goalLineAttributes: (_props$attributes$goa = props.attributes.goalLines) != null ? _props$attributes$goa : [],
       conditionalFormattingAttributes: props.attributes.conditionalFormattingRules,
-      defaultFormats: props.defaultFormats
+      trendsAndForecasts: props.attributes.trends,
+      defaultFormats: props.defaultFormats,
+      seriesLabelFormatter: function seriesLabelFormatter(labelFormatParams) {
+        var _queryEngineConfig$su, _queryEngineConfig$su2, _queryEngineConfig$su3;
+        var yResultField = labelFormatParams.yResultField,
+          yPivotFields = labelFormatParams.yPivotFields,
+          row = labelFormatParams.row;
+        var formattedFunctionName = ((_queryEngineConfig$su = queryEngineConfig.supportedAggregates[yResultField["function"]]) == null ? void 0 : _queryEngineConfig$su.publicName) || ((_queryEngineConfig$su2 = queryEngineConfig.supportedTimeTruncFunctions[yResultField["function"]]) == null ? void 0 : _queryEngineConfig$su2.publicName) || ((_queryEngineConfig$su3 = queryEngineConfig.supportedTransformationFunctions[yResultField["function"]]) == null ? void 0 : _queryEngineConfig$su3.publicName);
+        var formattedFunction = yResultField["function"] === 'none' ? '' : " \u2022 " + formattedFunctionName;
+        var defaultLabelFormat = "" + yPivotFields.map(function (field) {
+          return row[field.id].formattedValue;
+        }).join(' • ') + (yPivotFields.length === 0 ? '' : ' • ') + yResultField.publicName + formattedFunction;
+        if (!labelFormat) return defaultLabelFormat;
+        return labelFormat({
+          viewId: props.attributes.viewId,
+          fieldId: yResultField.fieldId,
+          func: yResultField["function"],
+          type: 'bubbleChartV2',
+          defaultLabel: defaultLabelFormat
+        }) || defaultLabelFormat;
+      }
     });
   }
 
@@ -46572,16 +46949,6 @@ var BubbleChartV2View = function BubbleChartV2View(props) {
       title: "Missing parameters"
     });
   }
-  if (((_props$result = props.result) == null ? void 0 : _props$result.fields.filter(function (r) {
-    return pivotConfig.x.includes(r.id);
-  }).length) === 0) return jsx(LoadingComponent, {});
-  if (((_props$result2 = props.result) == null ? void 0 : _props$result2.fields.filter(function (r) {
-    return pivotConfig.y.includes(r.id);
-  }).length) === 0) return jsx(LoadingComponent, {});
-  if (((_props$result3 = props.result) == null ? void 0 : _props$result3.fields.filter(function (r) {
-    var _Field$id;
-    return (_Field$id = id(props.attributes.zMeasure[0])) == null ? void 0 : _Field$id.includes(r.id);
-  }).length) === 0) return jsx(LoadingComponent, {});
   if (isLoading(props.result)) return jsx(LoadingComponent, {});
   if (hasFailed(props.result)) return jsx(FailedToLoadDataNotice, {});
   if (isEmpty(props.result)) return jsx(NoResultContentToShowNotice, _extends({}, headerProps));
@@ -46631,15 +46998,15 @@ var BubbleChartV2View = function BubbleChartV2View(props) {
 
 var BubbleChartV2$1 = function BubbleChartV2(props) {
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
   var dashboardBehaviour = props.dashboardBehaviour;
   var _useComponentEffect = useComponentEffect(attributes, props.dataSet, dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback, dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults, dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   return jsx(BubbleChartV2View, {
     id: props.id,
     attributes: attributes,
@@ -46793,76 +47160,7 @@ function getStyleDefinition$1(_ref) {
   });
 }
 
-var formattedResultToSeries$1 = function formattedResultToSeries(formattedResult, pivotConfig, seriesLabelFormatter, zFieldId) {
-  var _formattedResult$fiel, _formattedResult$fiel2;
-  var keys = {};
-
-  // Collect the result fields which are going to be used on the Y axis.
-  var yResultFields = formattedResult.fields.filter(function (resultField) {
-    var isNotXPivot = !pivotConfig.x.includes(resultField.id);
-    var isNotYPivot = !pivotConfig.y.includes(resultField.id);
-    return isNotXPivot && isNotYPivot;
-  });
-  var xPivotFields = formattedResult.fields.filter(function (resultField) {
-    return pivotConfig.x.includes(resultField.id);
-  });
-  var yPivotFields = formattedResult.fields.filter(function (resultField) {
-    return pivotConfig.y.includes(resultField.id);
-  });
-  var pivotedData = {};
-  var xKeyOrdering = [];
-  var yKeys = {};
-  formattedResult.contentMapped.forEach(function (row) {
-    xPivotFields.forEach(function (xPivotField) {
-      var _extends2;
-      var uniqueXValue = xPivotField.id + ":" + row[xPivotField.id].value;
-      xKeyOrdering.push(uniqueXValue);
-
-      // Add any existing values, and the x key itself
-
-      var yPivotPrefix = yPivotFields.map(function (yPivotField) {
-        return yPivotField.id + ":" + row[yPivotField.id].value;
-      }).join('_');
-      pivotedData[uniqueXValue] = _extends({}, pivotedData[uniqueXValue] || {}, (_extends2 = {}, _extends2[xPivotField.id] = row[xPivotField.id], _extends2));
-      yResultFields.forEach(function (yResultField) {
-        var _extends3;
-        var key = yPivotFields.length > 0 ? [yPivotPrefix, yResultField.id].join('_') : yResultField.id;
-        yKeys[key] = true;
-        keys[key] = {
-          key: key,
-          dataType: yResultField.dataType,
-          outputDataType: yResultField.outputDataType,
-          keyFormatted: seriesLabelFormatter({
-            yResultField: yResultField,
-            yPivotFields: yPivotFields,
-            row: row
-          })
-        };
-        pivotedData[uniqueXValue] = _extends({}, pivotedData[uniqueXValue] || {}, (_extends3 = {}, _extends3[key] = row[yResultField.id], _extends3));
-      });
-    });
-  });
-  var seriesDataFlattened = uniq(xKeyOrdering).map(function (xKey) {
-    return pivotedData[xKey];
-  });
-  var mappedXKeys = xPivotFields.map(function (r) {
-    return r.id;
-  });
-  var mappedYKeys = Object.keys(yKeys);
-  var mappedZKey = (_formattedResult$fiel = (_formattedResult$fiel2 = formattedResult.fields.find(function (resultField) {
-    return resultField.fieldId === zFieldId;
-  })) == null ? void 0 : _formattedResult$fiel2.id) != null ? _formattedResult$fiel : '';
-  var formattedResultReturn = {
-    xKeys: mappedXKeys,
-    yKeys: mappedYKeys,
-    zKey: mappedZKey,
-    keys: keys,
-    seriesData: seriesDataFlattened
-  };
-  return formattedResultReturn;
-};
-
-var buildTrendAndForecast = function buildTrendAndForecast(_ref) {
+var buildTrendAndForecast$1 = function buildTrendAndForecast(_ref) {
   var data = _ref.data,
     forecastUnits = _ref.forecastUnits,
     xKey = _ref.xKey,
@@ -46955,7 +47253,7 @@ var buildTrendAndForecast = function buildTrendAndForecast(_ref) {
   };
 };
 
-var getTrendsAndForecastsData = function getTrendsAndForecastsData(_ref) {
+var getTrendsAndForecastsData$1 = function getTrendsAndForecastsData(_ref) {
   var _trendsAndForecasts$;
   var chartData = _ref.chartData,
     formattingFunctionX = _ref.formattingFunctionX,
@@ -46984,7 +47282,7 @@ var getTrendsAndForecastsData = function getTrendsAndForecastsData(_ref) {
   var forecastUnits = trendsAndForecasts[0].type === 'Forecast' ? (_trendsAndForecasts$ = trendsAndForecasts[0].value) != null ? _trendsAndForecasts$ : 0 : 0;
   var yKey = yKeys[0];
   var newKeys = cloneDeep(keys);
-  var _buildTrendAndForecas = buildTrendAndForecast({
+  var _buildTrendAndForecas = buildTrendAndForecast$1({
       data: chartData,
       forecastUnits: forecastUnits,
       xKey: xKey,
@@ -47423,7 +47721,7 @@ var buildLineChartRepresentation = function buildLineChartRepresentation(_ref) {
 
   // ----- Keys & Prep -----
   var xScaleDataType = (xKeyField == null ? void 0 : xKeyField.outputDataType) || 'string';
-  var _formattedResultToSer = formattedResultToSeries$1(formattedResult, pivotConfig, seriesLabelFormatter),
+  var _formattedResultToSer = formattedResultToSeries(formattedResult, pivotConfig, seriesLabelFormatter),
     keys = _formattedResultToSer.keys,
     yKeys = _formattedResultToSer.yKeys,
     xKeys = _formattedResultToSer.xKeys,
@@ -47433,7 +47731,7 @@ var buildLineChartRepresentation = function buildLineChartRepresentation(_ref) {
   // ----- Trends & Forecasts -----
 
   var orderFunction = order.length > 0 ? order[0]["function"] : undefined;
-  var trendsAndForecastData = getTrendsAndForecastsData({
+  var trendsAndForecastData = getTrendsAndForecastsData$1({
     chartData: chartData,
     formattingFunctionX: function formattingFunctionX$1(value) {
       return formattingFunctionX(value, formattedResult, xKeyField);
@@ -47665,15 +47963,15 @@ var LineChartV2View = function LineChartV2View(props) {
 
 var LineChartV2 = function LineChartV2(props) {
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
   var dashboardBehaviour = props.dashboardBehaviour;
   var _useComponentEffect = useComponentEffect(attributes, props.dataSet, dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback, dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults, dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   return jsx(LineChartV2View, {
     id: props.id,
     attributes: attributes,
@@ -47802,7 +48100,7 @@ var buildAreaChartRepresentation = function buildAreaChartRepresentation(_ref) {
 
   // ----- Keys & Prep -----
   var xScaleDataType = (xKeyField == null ? void 0 : xKeyField.outputDataType) || 'string';
-  var _formattedResultToSer = formattedResultToSeries$1(formattedResult, pivotConfig, seriesLabelFormatter),
+  var _formattedResultToSer = formattedResultToSeries(formattedResult, pivotConfig, seriesLabelFormatter),
     keys = _formattedResultToSer.keys,
     yKeys = _formattedResultToSer.yKeys,
     xKeys = _formattedResultToSer.xKeys,
@@ -48037,15 +48335,15 @@ var AreaChartV2View = function AreaChartV2View(props) {
 
 var AreaChartV2 = function AreaChartV2(props) {
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
   var dashboardBehaviour = props.dashboardBehaviour;
   var _useComponentEffect = useComponentEffect(attributes, props.dataSet, dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback, dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults, dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   return jsx(AreaChartV2View, {
     id: props.id,
     attributes: attributes,
@@ -48154,7 +48452,7 @@ var buildBarChartRepresentation = function buildBarChartRepresentation(_ref) {
 
   // ----- Keys & Prep -----
   var xScaleDataType = (xKeyField == null ? void 0 : xKeyField.outputDataType) || 'string';
-  var _formattedResultToSer = formattedResultToSeries$1(formattedResult, pivotConfig, seriesLabelFormatter),
+  var _formattedResultToSer = formattedResultToSeries(formattedResult, pivotConfig, seriesLabelFormatter),
     keys = _formattedResultToSer.keys,
     yKeys = _formattedResultToSer.yKeys,
     xKeys = _formattedResultToSer.xKeys,
@@ -48430,7 +48728,9 @@ var BarChartV2View = function BarChartV2View(props) {
 };
 
 var BarChartV2 = function BarChartV2(props) {
-  var localFilters = props.component.localFilters;
+  var _props$component = props.component,
+    results = _props$component.results,
+    localFilters = _props$component.localFilters;
   var dashboardBehaviour = props.dashboardBehaviour;
   var _useState = useState(props.component.attributes),
     attributes = _useState[0],
@@ -48441,18 +48741,17 @@ var BarChartV2 = function BarChartV2(props) {
       setDrilldownSelections([]);
     }
   }, [JSON.stringify(props.component.attributes)]);
-  var _useComponentEffect = useComponentEffect(attributes, props.dataSet, dashboardBehaviour.queryEngineConfig, {
-      localFilters: localFilters,
-      globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback, dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
   var _useDrilldownSelectio = useDrilldownSelection(results, attributes, function (newAttributes) {
       return setAttributes(newAttributes);
     }, props.dataSet, dashboardBehaviour.queryEngineConfig, props.component.attributes.type === 'barChartV2'),
     onDrilldownChange = _useDrilldownSelectio.onDrilldownChange,
     setDrilldownSelections = _useDrilldownSelectio.setDrilldownSelections,
     drilldownSelections = _useDrilldownSelectio.drilldownSelections;
+  var _useComponentEffect = useComponentEffect(attributes, props.dataSet, dashboardBehaviour.queryEngineConfig, {
+      localFilters: localFilters,
+      globalFilters: props.globalFilters
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults, dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   return jsx(BarChartV2View, {
     id: props.id,
     attributes: attributes,
@@ -48614,16 +48913,16 @@ var LINE_QUERY_INDEX = 0,
   BAR_QUERY_INDEX = 1;
 var ComboChart$3 = function ComboChart(props) {
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
   var _useDashboardContext = useDashboardContext(),
     dashboard = _useDashboardContext.dashboard;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return jsx(ComboChartView$1, _extends({
     id: props.id
   }, attributes, {
@@ -49124,16 +49423,16 @@ var LINE_QUERY_INDEX$1 = 0,
   BAR_QUERY_INDEX$1 = 1;
 var ComboChartV2$1 = function ComboChartV2(props) {
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
   var _useDashboardContext = useDashboardContext(),
     dashboard = _useDashboardContext.dashboard;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return jsx(ComboChartView$2, _extends({
     id: props.id
   }, attributes, {
@@ -50925,6 +51224,9 @@ var DataTableRow = function DataTableRow(props) {
   useEffect(function () {
     return setSelectedRow(undefined);
   }, [props.queriesAreChanging]);
+  var _useState = useState(),
+    results = _useState[0],
+    _setResults = _useState[1];
   var expanded = selectedRow !== undefined;
   var hasDrilldown = drilldown && (drilldown == null ? void 0 : drilldown.length) > 0;
   var _useDashboardBehaviou = useDashboardBehaviourContext(),
@@ -50950,7 +51252,13 @@ var DataTableRow = function DataTableRow(props) {
         renderTableCell: handleRenderTableCell
       }))
     }), (props == null ? void 0 : props.drilldownInputProps) && expanded && hasDrilldown && jsx(DrilldownRow, {
+      setResults: function setResults(value) {
+        return _setResults({
+          results: value
+        });
+      },
       dataSet: dataSet,
+      result: results == null ? void 0 : results.results[0],
       drilldownInputProps: props == null ? void 0 : props.drilldownInputProps,
       drilldown: drilldown,
       selectedRow: selectedRow,
@@ -50963,10 +51271,10 @@ var DataTableRow = function DataTableRow(props) {
   });
 };
 var DrilldownRow = function DrilldownRow(props) {
-  var _tableRepresentation$;
-  var _useState = useState(0),
-    offset = _useState[0],
-    setOffset = _useState[1];
+  var _props$result, _tableRepresentation$;
+  var _useState2 = useState(0),
+    offset = _useState2[0],
+    setOffset = _useState2[1];
   var _props$drilldownInput = props.drilldownInputProps,
     component = _props$drilldownInput.component,
     runQueriesCallback = _props$drilldownInput.runQueriesCallback;
@@ -50980,12 +51288,10 @@ var DrilldownRow = function DrilldownRow(props) {
     variables = _useDashboardBehaviou2.variables,
     valueAlias = _useDashboardBehaviou2.valueAlias;
   var updatedAttributes = buildDrilldownAttributes(component.attributes, decodeId(props.drilldown[0].subsetDimension, queryEngineConfig), props.dimension, props.selectedRow, offset);
-  var _useQueryEffect = useQueryEffect(updatedAttributes, runQueriesCallback, {
-      localFilters: component.localFilters,
-      globalFilters: props.drilldownInputProps.globalFilters
-    }, props.dataSet, undefined, variables),
-    _useQueryEffect$resul = _useQueryEffect.results,
-    result = _useQueryEffect$resul[0];
+  useQueryEffect(updatedAttributes, runQueriesCallback, props == null ? void 0 : props.setResults, {
+    localFilters: component.localFilters,
+    globalFilters: props.drilldownInputProps.globalFilters
+  }, props.dataSet, undefined, variables);
   var nullReplacementWithFieldId = function nullReplacementWithFieldId(fieldId) {
     return checkForNullValue(props.dataSet.id, [{
       field: fieldId,
@@ -50995,7 +51301,7 @@ var DrilldownRow = function DrilldownRow(props) {
   var tableRepresentation = useMemo(function () {
     return buildTableRepresentation({
       type: updatedAttributes.type,
-      result: result,
+      result: props.result,
       exportNames: updatedAttributes.exportNames,
       prefixes: updatedAttributes.prefixes,
       dateTimeFormat: updatedAttributes.dateTimeFormat,
@@ -51015,10 +51321,10 @@ var DrilldownRow = function DrilldownRow(props) {
       hiddenFields: updatedAttributes.hiddenFields,
       valueAlias: valueAlias
     });
-  }, [updatedAttributes.type, result, updatedAttributes.exportNames, updatedAttributes.prefixes, updatedAttributes.dateTimeFormat, dateTimeFormatOptions, updatedAttributes.numberFormat, numberFormatOptions, queryEngineConfig.supportedAggregates, queryEngineConfig.supportedTimeTruncFunctions, undefined, updatedAttributes.measure, updatedAttributes.xMeasure, updatedAttributes.yMeasure, updatedAttributes.dimension]);
+  }, [updatedAttributes.type, props.result, updatedAttributes.exportNames, updatedAttributes.prefixes, updatedAttributes.dateTimeFormat, dateTimeFormatOptions, updatedAttributes.numberFormat, numberFormatOptions, queryEngineConfig.supportedAggregates, queryEngineConfig.supportedTimeTruncFunctions, undefined, updatedAttributes.measure, updatedAttributes.xMeasure, updatedAttributes.yMeasure, updatedAttributes.dimension]);
   var TableFooter = useMemo(function () {
     return jsx(Fragment$1, {
-      children: result && jsx(Pagination, {
+      children: props.result && jsx(Pagination, {
         offset: offset,
         limit: limit,
         onNext: function onNext() {
@@ -51038,10 +51344,10 @@ var DrilldownRow = function DrilldownRow(props) {
         textOverride: textOverride
       })
     });
-  }, [offset, limit, result == null ? void 0 : result.content.length, setOffset, tableRepresentation == null ? void 0 : tableRepresentation.content.length]);
+  }, [offset, limit, (_props$result = props.result) == null ? void 0 : _props$result.content.length, setOffset, tableRepresentation == null ? void 0 : tableRepresentation.content.length]);
   var hidePaginations = offset === 0 && ((_tableRepresentation$ = tableRepresentation == null ? void 0 : tableRepresentation.content.length) != null ? _tableRepresentation$ : 0) < (limit != null ? limit : 0);
   var columnsNumber = props == null ? void 0 : props.tableRowProps.row.length;
-  if (isLoading(result)) return jsx(Table.TR, {
+  if (isLoading(props.result)) return jsx(Table.TR, {
     level: 2,
     children: jsx(Table.TH, {
       colSpan: columnsNumber,
@@ -51050,7 +51356,7 @@ var DrilldownRow = function DrilldownRow(props) {
       })
     })
   });
-  if (hasFailed(result)) return jsx(FailedToLoadDataNotice, {});
+  if (hasFailed(props.result)) return jsx(FailedToLoadDataNotice, {});
   return jsxs(Fragment, {
     children: [(tableRepresentation == null ? void 0 : tableRepresentation.content) && jsx(Fragment, {
       children: (tableRepresentation == null ? void 0 : tableRepresentation.content.length) > 0 ? jsx(Fragment, {
@@ -51506,14 +51812,14 @@ var DataTableView$1 = (function (props) {
 
 var DataTable$2 = function DataTable(props) {
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   var onNext = function onNext() {
     var _attributes$limit, _attributes$offset, _results$0$content$le, _results$;
     if (!hasNext({
@@ -51775,13 +52081,14 @@ var FunnelChart$2 = function FunnelChart(props) {
   var _useState = useState(props.component.attributes),
     attributes = _useState[0],
     setAttributes = _useState[1];
-  var localFilters = props.component.localFilters;
+  var _props$component = props.component,
+    localFilters = _props$component.localFilters,
+    results = _props$component.results;
   var _useComponentEffect = useComponentEffect(attributes, props.dataSet, props.dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   useEffect(function () {
     if (!queriesAreChanging) {
       setAttributes(props.component.attributes);
@@ -51891,14 +52198,14 @@ var View$2 = (function (props) {
 
 var MercatorMap$3 = function MercatorMap(props) {
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return jsx(View$2, _extends({}, attributes, {
     id: props.id,
     result: results && results[0],
@@ -52157,14 +52464,14 @@ ProgressView$1.defaultProps = defaultProps$9;
 var Progress$2 = function Progress(props) {
   var _props$dashboardBehav;
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
+  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
     }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useQueryEffect.queriesAreChanging,
-    results = _useQueryEffect.results;
+    queriesAreChanging = _useQueryEffect.queriesAreChanging;
   return jsx(ProgressView$1, _extends({}, attributes, {
     id: props.id,
     dataSet: props.dataSet,
@@ -52371,7 +52678,7 @@ var buildRadarChartRepresentation = function buildRadarChartRepresentation(_ref)
     }).formattedValue;
   };
   var xScaleDataType = (xKeyField == null ? void 0 : xKeyField.outputDataType) || 'string';
-  var _formattedResultToSer = formattedResultToSeries$1(formattedResult, pivotConfig, seriesLabelFormatter),
+  var _formattedResultToSer = formattedResultToSeries(formattedResult, pivotConfig, seriesLabelFormatter),
     keys = _formattedResultToSer.keys,
     yKeys = _formattedResultToSer.yKeys,
     xKeys = _formattedResultToSer.xKeys,
@@ -52653,17 +52960,18 @@ var RadarChart$3 = function RadarChart(_ref) {
     runQueriesCallback = _ref.runQueriesCallback,
     setLocalFilters = _ref.setLocalFilters,
     _setPartialAttributes = _ref.setPartialAttributes,
+    setResults = _ref.setResults,
     updateComponentAttributes = _ref.updateComponentAttributes;
-  var localFilters = component.localFilters;
+  var localFilters = component.localFilters,
+    results = component.results;
   var _useState = useState(component.attributes),
     attributes = _useState[0],
     setAttributes = _useState[1];
   var _useComponentEffect = useComponentEffect(component.attributes, dataSet, dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: globalFilters
-    }, updateComponentAttributes, runQueriesCallback, dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, updateComponentAttributes, runQueriesCallback, setResults, dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   useEffect(function () {
     if (!queriesAreChanging) {
       setAttributes(component.attributes);
@@ -52736,14 +53044,14 @@ var RichText$2 = function RichText(_props) {
 var SingleStat$2 = function SingleStat(props) {
   var _props$dashboardBehav;
   var _props$component = props.component,
+    results = _props$component.results,
     attributes = _props$component.attributes,
     localFilters = _props$component.localFilters;
   var _useComponentEffect = useComponentEffect(attributes, props.dataSet, props.dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: props.globalFilters
-    }, props.updateComponentAttributes, props.runQueriesCallback, props.dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, props.updateComponentAttributes, props.runQueriesCallback, props.setResults, props.dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   return jsx(SingleStatView, _extends({}, attributes, {
     id: props.id,
     dataSet: props.dataSet,
@@ -52902,10 +53210,8 @@ var SunburstChartView = function SunburstChartView(props) {
     setTooltipLabel = _useState5[1];
   var xScale = scaleLinear$1().domain(xDomain).range(xRange);
   var yScale = scaleSqrt().domain(yDomain).range(yRange);
-  var width = props.width * 3 / 6;
-  var height = props.height * 0.9;
-  var minDimension = Math.min(props.width, props.height);
-  var centeredRatio = minDimension / 2.5;
+  var width = props.width * 3 / 5;
+  var height = 500;
   var sunburstChartComponent = getComponentInterface(props.attributes.type);
   var headerProps = {
     displayTitle: props.attributes.displayTitle,
@@ -52925,8 +53231,8 @@ var SunburstChartView = function SunburstChartView(props) {
     order: props.attributes.order
   };
   useEffect(function () {
-    setYRange([yRange[0], centeredRatio]);
-  }, [centeredRatio]);
+    setYRange([yRange[0], width / 2]);
+  }, [width]);
   var arc$1 = arc().startAngle(function (d) {
     return Math.max(0, Math.min(2 * Math.PI, xScale(d.x0)));
   }).endAngle(function (d) {
@@ -52939,7 +53245,7 @@ var SunburstChartView = function SunburstChartView(props) {
   var handleClick = function handleClick(d) {
     setXDomain([d.x0, d.x1]);
     setYDomain([d.y0, 1]);
-    setYRange([d.y0 ? 20 : 0, centeredRatio]);
+    setYRange([d.y0 ? 20 : 0, width / 2]);
   };
   var handleUpdate = function handleUpdate(t, xd, yd, yr) {
     xScale.domain(xd(t));
@@ -53026,7 +53332,7 @@ var SunburstChartView = function SunburstChartView(props) {
         height: height,
         children: jsx(Partition, {
           top: 0,
-          left: centerX + DEFAULT_MARGINS.left,
+          left: centerX * 2 / 3,
           root: root,
           children: jsx(Spring, {
             reset: true,
@@ -53106,12 +53412,13 @@ var SunburstChartView = function SunburstChartView(props) {
 };
 
 var SunburstChart$2 = function SunburstChart(props) {
-  var attributes = props.component.attributes;
-  var _useQueryEffect = useQueryEffect(attributes, props.runQueriesCallback, {
-      localFilters: props.component.localFilters,
-      globalFilters: props.globalFilters
-    }, props.dataSet, undefined, props.dashboardBehaviour.variables),
-    results = _useQueryEffect.results;
+  var _props$component = props.component,
+    results = _props$component.results,
+    attributes = _props$component.attributes;
+  useQueryEffect(attributes, props.runQueriesCallback, props.setResults, {
+    localFilters: props.component.localFilters,
+    globalFilters: props.globalFilters
+  }, props.dataSet, undefined, props.dashboardBehaviour.variables);
   var params = {
     defaultFormats: props.dashboardBehaviour.defaultFormats,
     dateTimeFormatOptions: props.dashboardBehaviour.dateTimeFormatOptions,
@@ -53142,246 +53449,6 @@ var SunburstChart$2 = function SunburstChart(props) {
   });
 };
 
-function getNiceInterval$3(interval) {
-  // Round the interval to a "nice" value (1, 2, 5, etc.)
-  var exponent = Math.floor(Math.log10(interval));
-  var fraction = interval / Math.pow(10, exponent);
-  var niceFraction;
-  if (fraction <= 1.5) niceFraction = 1;else if (fraction <= 3) niceFraction = 2;else if (fraction <= 7) niceFraction = 5;else niceFraction = 10;
-  return niceFraction * Math.pow(10, exponent);
-}
-
-var getYTicks = function getYTicks(_ref) {
-  var yMinValue = _ref.yMinValue,
-    yMaxValue = _ref.yMaxValue,
-    approxYAxisLabelCount = _ref.approxYAxisLabelCount,
-    formattingFunctionY = _ref.formattingFunctionY;
-  var yTicks = [];
-  var yTickInterval = getNiceInterval$3((yMaxValue - yMinValue) / (approxYAxisLabelCount - 1));
-  for (var i = 0; i < approxYAxisLabelCount; i++) {
-    var value = (yMinValue + i) * yTickInterval;
-    var formattedValue = formattingFunctionY(value);
-    yTicks.push({
-      value: value,
-      formattedValue: formattedValue,
-      scaleValue: value
-    });
-  }
-  return yTicks;
-};
-
-var getRepresentationData = function getRepresentationData(_ref) {
-  var content = _ref.content,
-    xKey = _ref.xKey,
-    yKey = _ref.yKey,
-    approxYAxisLabelCount = _ref.approxYAxisLabelCount,
-    showTotalBar = _ref.showTotalBar,
-    formattingFunctionY = _ref.formattingFunctionY;
-  var data = [];
-  var steps = [];
-  var xTicks = [];
-  var yValueSum = 0;
-  var yMinValue = 0;
-  var yMaxValue = 0;
-  content.forEach(function (dataItem, index) {
-    var _dataItem$xValueIndex, _dataItem$xValueIndex2, _dataItem$yValueIndex, _dataItem$yValueIndex2, _data$push;
-    var xValueIndex = 0;
-    var yValueIndex = 1;
-    var xValue = (_dataItem$xValueIndex = dataItem[xValueIndex]) == null ? void 0 : _dataItem$xValueIndex.value;
-    var xFormattedValue = (_dataItem$xValueIndex2 = dataItem[xValueIndex]) == null ? void 0 : _dataItem$xValueIndex2.formattedValue;
-    var yValue = Number((_dataItem$yValueIndex = (_dataItem$yValueIndex2 = dataItem[yValueIndex]) == null ? void 0 : _dataItem$yValueIndex2.value) != null ? _dataItem$yValueIndex : 0);
-    var yValueDiff = yValue;
-    if (index > 0) {
-      var _content$yValueIndex;
-      var prevYValue = Number((_content$yValueIndex = content[index - 1][yValueIndex]) == null ? void 0 : _content$yValueIndex.value);
-      yValueDiff = yValue - prevYValue;
-    }
-    var prevYValueSum = yValueSum;
-    yValueSum += yValueDiff;
-    data.push((_data$push = {}, _data$push[xKey] = {
-      value: xValue,
-      formattedValue: xFormattedValue
-    }, _data$push[yKey] = {
-      value: yValueDiff,
-      formattedValue: formattingFunctionY(yValueDiff)
-    }, _data$push));
-    xTicks.push({
-      value: xValue,
-      formattedValue: xFormattedValue,
-      scaleValue: xValue
-    });
-    steps.push({
-      x: xValue,
-      y: yValue,
-      start: prevYValueSum,
-      end: yValueSum
-    });
-    yMinValue = Math.floor(Math.min(yMinValue, yValue));
-    yMaxValue = Math.ceil(Math.max(yMaxValue, yValue));
-  });
-  if (showTotalBar) {
-    var _data$push2;
-    var totalLabel = 'Total';
-    steps.push({
-      x: totalLabel,
-      y: yValueSum,
-      start: 0,
-      end: yValueSum
-    });
-    data.push((_data$push2 = {}, _data$push2[xKey] = {
-      value: totalLabel,
-      formattedValue: totalLabel
-    }, _data$push2[yKey] = {
-      value: yValueSum,
-      formattedValue: formattingFunctionY(yValueSum)
-    }, _data$push2));
-    xTicks.push({
-      value: totalLabel,
-      formattedValue: totalLabel,
-      scaleValue: totalLabel
-    });
-  }
-  var yTicks = getYTicks({
-    yMinValue: yMinValue,
-    yMaxValue: yMaxValue,
-    approxYAxisLabelCount: approxYAxisLabelCount,
-    formattingFunctionY: formattingFunctionY
-  });
-  return {
-    data: data,
-    steps: steps,
-    xTicks: xTicks,
-    yTicks: yTicks,
-    yMinValue: yMinValue,
-    yMaxValue: yMaxValue
-  };
-};
-
-var buildWaterfallChartRepresentation = function buildWaterfallChartRepresentation(_ref) {
-  var _formattedResult$fiel, _formattedResult$fiel2, _axisTitles$x, _axisTitles$y;
-  var approxYAxisLabelCount = _ref.approxYAxisLabelCount,
-    axisTitles = _ref.axisTitles,
-    dateTimeFormatOptions = _ref.dateTimeFormatOptions,
-    defaultFormats = _ref.defaultFormats,
-    nullValue = _ref.nullValue,
-    numberFormatOptions = _ref.numberFormatOptions,
-    pivotConfig = _ref.pivotConfig,
-    result = _ref.result,
-    showTotalBar = _ref.showTotalBar,
-    _valueAlias = _ref.valueAlias,
-    xAxisFormat = _ref.xAxisFormat,
-    xAxisPrefix = _ref.xAxisPrefix,
-    xAxisPostfix = _ref.xAxisPostfix,
-    yAxisFormat = _ref.yAxisFormat,
-    yAxisPrefix = _ref.yAxisPrefix,
-    yAxisPostfix = _ref.yAxisPostfix;
-  var activeDateTimeFormats = {};
-  var _buildFieldFormatMaps = buildFieldFormatMaps(result, pivotConfig, xAxisPrefix, xAxisPostfix, xAxisFormat, yAxisPrefix, yAxisPostfix, yAxisFormat, nullValue, numberFormatOptions),
-    allPrefixes = _buildFieldFormatMaps.allPrefixes,
-    allPostfixes = _buildFieldFormatMaps.allPostfixes,
-    nullValues = _buildFieldFormatMaps.nullValues,
-    activeNumberFormats = _buildFieldFormatMaps.activeNumberFormats;
-  var params = {
-    defaultFormats: defaultFormats,
-    dateTimeFormatOptions: dateTimeFormatOptions,
-    numberFormatOptions: numberFormatOptions,
-    valueAlias: function valueAlias(params) {
-      if (typeof _valueAlias === 'function') {
-        return String(_valueAlias({
-          fieldId: id({
-            field: params.fieldId,
-            "function": params["function"]
-          }),
-          value: params.value
-        }));
-      }
-      return undefined;
-    },
-    nullValue: nullValues,
-    prefixes: allPrefixes,
-    postfixes: allPostfixes,
-    activeNumberFormats: activeNumberFormats,
-    activeDateTimeFormats: activeDateTimeFormats
-  };
-  var formattedResult = formatResult(result, params);
-  var formattingFunctionY = function formattingFunctionY(value) {
-    // Use any y axis field as they are all formatted in the same way (for now...);
-    var nonPivotField = formattedResult.fields.find(function (resultField) {
-      return ![].concat(pivotConfig.x, pivotConfig.y).includes(resultField.id);
-    });
-    if (!nonPivotField) return '';
-    return formattedResult.formatterFunc(value, {
-      fieldId: nonPivotField.fieldId,
-      "function": nonPivotField["function"],
-      outputDataType: nonPivotField.outputDataType
-    }).formattedValue;
-  };
-  var keys = formattedResult.fields.map(function (field) {
-    var _ref2;
-    var key = field.fieldId;
-    var keyFormatted = field.publicName;
-    var dataType = field.dataType;
-    return _ref2 = {}, _ref2[key] = {
-      key: key,
-      keyFormatted: keyFormatted,
-      dataType: dataType
-    }, _ref2;
-  });
-  var xKey = (_formattedResult$fiel = formattedResult.fields[0]) == null ? void 0 : _formattedResult$fiel.fieldId;
-  var yKey = (_formattedResult$fiel2 = formattedResult.fields[1]) == null ? void 0 : _formattedResult$fiel2.fieldId;
-  var content = formattedResult.content;
-  var _getRepresentationDat = getRepresentationData({
-      content: content,
-      xKey: xKey,
-      yKey: yKey,
-      approxYAxisLabelCount: approxYAxisLabelCount,
-      showTotalBar: showTotalBar,
-      formattingFunctionY: formattingFunctionY
-    }),
-    data = _getRepresentationDat.data,
-    steps = _getRepresentationDat.steps,
-    xTicks = _getRepresentationDat.xTicks,
-    yTicks = _getRepresentationDat.yTicks,
-    yMinValue = _getRepresentationDat.yMinValue,
-    yMaxValue = _getRepresentationDat.yMaxValue;
-  var chartRepresentation = {
-    keys: _extends({}, keys[0], keys[1]),
-    x: {
-      title: (_axisTitles$x = axisTitles == null ? void 0 : axisTitles.x) != null ? _axisTitles$x : null,
-      ticks: xTicks,
-      prefix: xAxisPrefix,
-      postfix: xAxisPostfix,
-      key: xKey,
-      scale: {
-        dataType: 'string',
-        key: xKey,
-        ordering: null,
-        min: null,
-        max: null
-      }
-    },
-    y: {
-      title: (_axisTitles$y = axisTitles == null ? void 0 : axisTitles.y) != null ? _axisTitles$y : null,
-      ticks: yTicks,
-      key: yKey,
-      prefix: yAxisPrefix,
-      postfix: yAxisPostfix,
-      scale: {
-        dataType: 'number',
-        key: null,
-        ordering: 'asc',
-        min: yMinValue,
-        max: yMaxValue
-      }
-    },
-    data: data
-  };
-  return {
-    waterfallChartRepresentation: chartRepresentation,
-    waterfallChartSteps: steps
-  };
-};
-
 var ASSUMED_AVERAGE_CHAR_WIDTH$2 = 8.8;
 function calculateWordWidth$1(word, avgCharWidth) {
   if (avgCharWidth === void 0) {
@@ -53391,7 +53458,7 @@ function calculateWordWidth$1(word, avgCharWidth) {
 }
 
 /** Reduce width proportionally to simulate spacing / padding between ticks. */
-var widthWithSpacing = function widthWithSpacing(width) {
+var widthWithSpacing$1 = function widthWithSpacing(width) {
   var THIRTY_PERCENT = 0.3;
   return width - width * THIRTY_PERCENT;
 };
@@ -53405,7 +53472,7 @@ function howManyTicksFitInWidth$1(ticks, maxWidth, avgCharWidth) {
     var tick = _step.value;
     var word = (tick == null ? void 0 : tick.formattedValue) || '';
     var wordWidth = calculateWordWidth$1(word, avgCharWidth);
-    if (currentWidth + wordWidth <= widthWithSpacing(maxWidth)) {
+    if (currentWidth + wordWidth <= widthWithSpacing$1(maxWidth)) {
       fittedTicks.push(tick);
       currentWidth += wordWidth + avgCharWidth; // Add space between words
     } else {
@@ -53483,7 +53550,7 @@ var Tooltip$2 = function Tooltip(_ref) {
   if (!showTooltip || !tooltipData) return null;
   var value = tooltipData[yKey].value;
   var isPositiveValue = Number(value) > 0;
-  return /*#__PURE__*/createPortal(jsx(TooltipWithBounds, {
+  return jsx(TooltipWithBounds, {
     left: tooltipLeft,
     top: tooltipTop,
     style: theme,
@@ -53518,7 +53585,7 @@ var Tooltip$2 = function Tooltip(_ref) {
         })]
       })]
     })
-  }, Math.random()), document.body);
+  }, Math.random());
 };
 var IconNarrowRight$1 = function IconNarrowRight() {
   var style = {
@@ -53526,7 +53593,7 @@ var IconNarrowRight$1 = function IconNarrowRight() {
     height: 20,
     display: 'block'
   };
-  var fill = '#12B76A';
+  var fill = "#12B76A";
   return jsx("svg", {
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
@@ -53546,7 +53613,7 @@ var IconTrendingDown$1 = function IconTrendingDown() {
     height: 20,
     display: 'block'
   };
-  var fill = '#F04438';
+  var fill = "#F04438";
   return jsx("svg", {
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
@@ -53604,7 +53671,7 @@ var Legend$2 = function Legend(_ref) {
   });
 };
 
-var _excluded$i = ["formattedValue"],
+var _excluded$h = ["formattedValue"],
   _excluded2$4 = ["formattedValue"];
 var AXIS_TITLE_STYLES$1 = {
   opacity: '0.75',
@@ -53714,8 +53781,8 @@ var WaterfallChart$2 = function WaterfallChart(_ref) {
     return Number(tick.value);
   });
   var xTickValues = formattedChartDataForBarChart.x.ticks.length > 0 ? formattedChartDataForBarChart.x.ticks.map(function (tick) {
-    var _String;
-    return (_String = String(tick.scaleValue)) != null ? _String : '';
+    var _tick$scaleValue;
+    return (_tick$scaleValue = tick.scaleValue) != null ? _tick$scaleValue : 0;
   }) : undefined;
   var handleMouseMove = useCallback(function (event) {
     if (!xKey || !xScaleKey || xScale === null) return;
@@ -53748,7 +53815,7 @@ var WaterfallChart$2 = function WaterfallChart(_ref) {
       tick = matchingTickValue || null;
     } else {
       var _matchingTickValue = formattedChartDataForBarChart.x.ticks.find(function (tickValue) {
-        return String(tickValue.scaleValue) === value;
+        return tickValue.scaleValue === value;
       });
       tick = _matchingTickValue || null;
     }
@@ -53773,10 +53840,10 @@ var WaterfallChart$2 = function WaterfallChart(_ref) {
     return '';
   }, [formattedChartDataForBarChart.y.ticks]);
   var getBarGroupPosition = useCallback(function (d) {
-    if (xScaleKey == null || d == null) return '';
+    if (xScaleKey == null || d == null) return;
     var xValue = d[xScaleKey];
-    if (xScaleDataType === 'string') return String(xValue);
-    return '';
+    if (xScaleDataType === 'string') return xValue;
+    return;
   }, [xScaleKey, xScaleDataType]);
   if (width === 0 || height === 0 || xScale == null) return null;
   return jsxs(Fragment$1, {
@@ -53814,7 +53881,7 @@ var WaterfallChart$2 = function WaterfallChart(_ref) {
           tickValues: xTickValues,
           tickComponent: function tickComponent(_ref2) {
             var formattedValue = _ref2.formattedValue,
-              tickProps = _objectWithoutPropertiesLoose(_ref2, _excluded$i);
+              tickProps = _objectWithoutPropertiesLoose(_ref2, _excluded$h);
             return jsx(Text, _extends({
               style: themeCSS.labels
             }, tickProps, {
@@ -53926,6 +53993,245 @@ var Bar$2 = function Bar(_ref4) {
   });
 };
 
+function getNiceInterval$3(interval) {
+  // Round the interval to a "nice" value (1, 2, 5, etc.)
+  var exponent = Math.floor(Math.log10(interval));
+  var fraction = interval / Math.pow(10, exponent);
+  var niceFraction;
+  if (fraction <= 1.5) niceFraction = 1;else if (fraction <= 3) niceFraction = 2;else if (fraction <= 7) niceFraction = 5;else niceFraction = 10;
+  return niceFraction * Math.pow(10, exponent);
+}
+
+var getYTicks = function getYTicks(_ref) {
+  var yMinValue = _ref.yMinValue,
+    yMaxValue = _ref.yMaxValue,
+    approxYAxisLabelCount = _ref.approxYAxisLabelCount,
+    formattingFunctionY = _ref.formattingFunctionY;
+  var yTicks = [];
+  var yTickInterval = getNiceInterval$3((yMaxValue - yMinValue) / (approxYAxisLabelCount - 1));
+  for (var i = 0; i < approxYAxisLabelCount; i++) {
+    var value = (yMinValue + i) * yTickInterval;
+    var formattedValue = formattingFunctionY(value);
+    yTicks.push({
+      value: value,
+      formattedValue: formattedValue,
+      scaleValue: value
+    });
+  }
+  return yTicks;
+};
+
+var getRepresentationData = function getRepresentationData(_ref) {
+  var content = _ref.content,
+    xKey = _ref.xKey,
+    yKey = _ref.yKey,
+    approxYAxisLabelCount = _ref.approxYAxisLabelCount,
+    showTotalBar = _ref.showTotalBar,
+    formattingFunctionY = _ref.formattingFunctionY;
+  var data = [];
+  var steps = [];
+  var xTicks = [];
+  var yValueSum = 0;
+  var yMinValue = 0;
+  var yMaxValue = 0;
+  content.forEach(function (dataItem, index) {
+    var _data$push;
+    var xValueIndex = 0;
+    var yValueIndex = 1;
+    var xValue = dataItem[xValueIndex].value;
+    var xFormattedValue = dataItem[xValueIndex].formattedValue;
+    var yValue = Number(dataItem[yValueIndex].value);
+    var yValueDiff = yValue;
+    if (index > 0) {
+      var prevYValue = Number(content[index - 1][yValueIndex].value);
+      yValueDiff = yValue - prevYValue;
+    }
+    var prevYValueSum = yValueSum;
+    yValueSum += yValueDiff;
+    data.push((_data$push = {}, _data$push[xKey] = {
+      value: xValue,
+      formattedValue: xFormattedValue
+    }, _data$push[yKey] = {
+      value: yValueDiff,
+      formattedValue: formattingFunctionY(yValueDiff)
+    }, _data$push));
+    xTicks.push({
+      value: xValue,
+      formattedValue: xFormattedValue,
+      scaleValue: xValue
+    });
+    steps.push({
+      x: xValue,
+      y: yValue,
+      start: prevYValueSum,
+      end: yValueSum
+    });
+    yMinValue = Math.floor(Math.min(yMinValue, yValue));
+    yMaxValue = Math.ceil(Math.max(yMaxValue, yValue));
+  });
+  if (showTotalBar) {
+    var _data$push2;
+    var totalLabel = 'Total';
+    steps.push({
+      x: totalLabel,
+      y: yValueSum,
+      start: 0,
+      end: yValueSum
+    });
+    data.push((_data$push2 = {}, _data$push2[xKey] = {
+      value: totalLabel,
+      formattedValue: totalLabel
+    }, _data$push2[yKey] = {
+      value: yValueSum,
+      formattedValue: formattingFunctionY(yValueSum)
+    }, _data$push2));
+    xTicks.push({
+      value: totalLabel,
+      formattedValue: totalLabel,
+      scaleValue: totalLabel
+    });
+  }
+  var yTicks = getYTicks({
+    yMinValue: yMinValue,
+    yMaxValue: yMaxValue,
+    approxYAxisLabelCount: approxYAxisLabelCount,
+    formattingFunctionY: formattingFunctionY
+  });
+  return {
+    data: data,
+    steps: steps,
+    xTicks: xTicks,
+    yTicks: yTicks,
+    yMinValue: yMinValue,
+    yMaxValue: yMaxValue
+  };
+};
+
+var buildWaterfallChartRepresentation = function buildWaterfallChartRepresentation(_ref) {
+  var _formattedResult$fiel, _formattedResult$fiel2, _axisTitles$x, _axisTitles$y;
+  var approxYAxisLabelCount = _ref.approxYAxisLabelCount,
+    axisTitles = _ref.axisTitles,
+    dateTimeFormatOptions = _ref.dateTimeFormatOptions,
+    defaultFormats = _ref.defaultFormats,
+    nullValue = _ref.nullValue,
+    numberFormatOptions = _ref.numberFormatOptions,
+    pivotConfig = _ref.pivotConfig,
+    result = _ref.result,
+    showTotalBar = _ref.showTotalBar,
+    _valueAlias = _ref.valueAlias,
+    xAxisFormat = _ref.xAxisFormat,
+    xAxisPrefix = _ref.xAxisPrefix,
+    xAxisPostfix = _ref.xAxisPostfix,
+    yAxisFormat = _ref.yAxisFormat,
+    yAxisPrefix = _ref.yAxisPrefix,
+    yAxisPostfix = _ref.yAxisPostfix;
+  var activeDateTimeFormats = {};
+  var _buildFieldFormatMaps = buildFieldFormatMaps(result, pivotConfig, xAxisPrefix, xAxisPostfix, xAxisFormat, yAxisPrefix, yAxisPostfix, yAxisFormat, nullValue, numberFormatOptions),
+    allPrefixes = _buildFieldFormatMaps.allPrefixes,
+    allPostfixes = _buildFieldFormatMaps.allPostfixes,
+    nullValues = _buildFieldFormatMaps.nullValues,
+    activeNumberFormats = _buildFieldFormatMaps.activeNumberFormats;
+  var params = {
+    defaultFormats: defaultFormats,
+    dateTimeFormatOptions: dateTimeFormatOptions,
+    numberFormatOptions: numberFormatOptions,
+    valueAlias: function valueAlias(params) {
+      if (typeof _valueAlias === 'function') {
+        return String(_valueAlias({
+          fieldId: id({
+            field: params.fieldId,
+            "function": params["function"]
+          }),
+          value: params.value
+        }));
+      }
+      return undefined;
+    },
+    nullValue: nullValues,
+    prefixes: allPrefixes,
+    postfixes: allPostfixes,
+    activeNumberFormats: activeNumberFormats,
+    activeDateTimeFormats: activeDateTimeFormats
+  };
+  var formattedResult = formatResult(result, params);
+  var formattingFunctionY = function formattingFunctionY(value) {
+    // Use any y axis field as they are all formatted in the same way (for now...);
+    var nonPivotField = formattedResult.fields.find(function (resultField) {
+      return ![].concat(pivotConfig.x, pivotConfig.y).includes(resultField.id);
+    });
+    if (!nonPivotField) return '';
+    return formattedResult.formatterFunc(value, {
+      fieldId: nonPivotField.fieldId,
+      "function": nonPivotField["function"],
+      outputDataType: nonPivotField.outputDataType
+    }).formattedValue;
+  };
+  var keys = formattedResult.fields.map(function (field) {
+    var _ref2;
+    var key = field.fieldId;
+    var keyFormatted = field.publicName;
+    var dataType = field.dataType;
+    return _ref2 = {}, _ref2[key] = {
+      key: key,
+      keyFormatted: keyFormatted,
+      dataType: dataType
+    }, _ref2;
+  });
+  var xKey = (_formattedResult$fiel = formattedResult.fields[0]) == null ? void 0 : _formattedResult$fiel.fieldId;
+  var yKey = (_formattedResult$fiel2 = formattedResult.fields[1]) == null ? void 0 : _formattedResult$fiel2.fieldId;
+  var content = formattedResult.content;
+  var _getRepresentationDat = getRepresentationData({
+      content: content,
+      xKey: xKey,
+      yKey: yKey,
+      approxYAxisLabelCount: approxYAxisLabelCount,
+      showTotalBar: showTotalBar,
+      formattingFunctionY: formattingFunctionY
+    }),
+    data = _getRepresentationDat.data,
+    steps = _getRepresentationDat.steps,
+    xTicks = _getRepresentationDat.xTicks,
+    yTicks = _getRepresentationDat.yTicks,
+    yMinValue = _getRepresentationDat.yMinValue,
+    yMaxValue = _getRepresentationDat.yMaxValue;
+  var chartRepresentation = {
+    keys: _extends({}, keys[0], keys[1]),
+    x: {
+      title: (_axisTitles$x = axisTitles == null ? void 0 : axisTitles.x) != null ? _axisTitles$x : null,
+      ticks: xTicks,
+      prefix: xAxisPrefix,
+      postfix: xAxisPostfix,
+      key: xKey,
+      scale: {
+        dataType: 'string',
+        key: xKey,
+        ordering: null,
+        min: null,
+        max: null
+      }
+    },
+    y: {
+      title: (_axisTitles$y = axisTitles == null ? void 0 : axisTitles.y) != null ? _axisTitles$y : null,
+      ticks: yTicks,
+      key: yKey,
+      prefix: yAxisPrefix,
+      postfix: yAxisPostfix,
+      scale: {
+        dataType: 'number',
+        key: null,
+        ordering: 'asc',
+        min: yMinValue,
+        max: yMaxValue
+      }
+    },
+    data: data
+  };
+  return {
+    waterfallChartRepresentation: chartRepresentation,
+    waterfallChartSteps: steps
+  };
+};
+
 var WaterfallChartView = function WaterfallChartView(props) {
   var approxXAxisLabelCount = props.approxXAxisLabelCount,
     approxYAxisLabelCount = props.approxYAxisLabelCount,
@@ -53993,7 +54299,6 @@ var WaterfallChartView = function WaterfallChartView(props) {
     title: "Missing parameters"
   });
   if (isLoading(result)) return jsx(LoadingComponent, {});
-  if (isLoadingResult(result)) return jsx(LoadingComponent, {});
   if (hasFailed(result)) return jsx(FailedToLoadDataNotice, {});
   if (isEmpty(result)) return jsx(NoResultContentToShowNotice, _extends({}, headerProps));
   var showHeadline = headlineAvailable(order, headline, timeDimension);
@@ -54064,9 +54369,6 @@ var WaterfallChartView = function WaterfallChartView(props) {
     })
   });
 };
-function isLoadingResult(result) {
-  return result != null && result.content[0].length ? (result == null ? void 0 : result.content[0].length) < 2 : false;
-}
 var WaterfallChartView$1 = /*#__PURE__*/memo(WaterfallChartView, shouldUpdate);
 
 var WaterfallChart$3 = function WaterfallChart(_ref) {
@@ -54079,17 +54381,18 @@ var WaterfallChart$3 = function WaterfallChart(_ref) {
     runQueriesCallback = _ref.runQueriesCallback,
     setLocalFilters = _ref.setLocalFilters,
     _setPartialAttributes = _ref.setPartialAttributes,
+    setResults = _ref.setResults,
     updateComponentAttributes = _ref.updateComponentAttributes;
-  var localFilters = component.localFilters;
+  var localFilters = component.localFilters,
+    results = component.results;
   var _useState = useState(component.attributes),
     attributes = _useState[0],
     setAttributes = _useState[1];
   var _useComponentEffect = useComponentEffect(component.attributes, dataSet, dashboardBehaviour.queryEngineConfig, {
       localFilters: localFilters,
       globalFilters: globalFilters
-    }, updateComponentAttributes, runQueriesCallback, dashboardBehaviour.variables),
-    queriesAreChanging = _useComponentEffect.queriesAreChanging,
-    results = _useComponentEffect.results;
+    }, updateComponentAttributes, runQueriesCallback, setResults, dashboardBehaviour.variables),
+    queriesAreChanging = _useComponentEffect.queriesAreChanging;
   useEffect(function () {
     if (!queriesAreChanging) {
       setAttributes(component.attributes);
@@ -54188,6 +54491,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         sm: smallVersion,
@@ -54211,6 +54515,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         sm: smallVersion,
@@ -54237,6 +54542,7 @@ var Component = function Component(props) {
         },
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54262,6 +54568,7 @@ var Component = function Component(props) {
           return _updateComponentAttributes(newAttributes);
         },
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         sm: smallVersion,
@@ -54287,6 +54594,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         sm: smallVersion,
@@ -54316,6 +54624,7 @@ var Component = function Component(props) {
         },
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         sm: smallVersion,
@@ -54342,6 +54651,7 @@ var Component = function Component(props) {
         },
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54367,6 +54677,7 @@ var Component = function Component(props) {
         },
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54392,6 +54703,7 @@ var Component = function Component(props) {
         },
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54414,6 +54726,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54437,6 +54750,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54460,6 +54774,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54483,6 +54798,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54509,6 +54825,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54532,6 +54849,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         updateComponentAttributes: function updateComponentAttributes(newAttributes) {
           return _updateComponentAttributes(newAttributes);
@@ -54558,6 +54876,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         sm: smallVersion,
@@ -54605,6 +54924,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour
       })
@@ -54627,6 +54947,7 @@ var Component = function Component(props) {
           return _updateComponentAttributes(newAttributes);
         },
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         sm: smallVersion,
@@ -54653,6 +54974,7 @@ var Component = function Component(props) {
         dataSet: dataSet,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54680,6 +55002,7 @@ var Component = function Component(props) {
           return _updateComponentAttributes(newAttributes);
         },
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -54705,6 +55028,7 @@ var Component = function Component(props) {
           return _updateComponentAttributes(newAttributes);
         },
         component: props.component,
+        setResults: props.setResults,
         globalFilters: dashboard.globalFilters,
         dashboardBehaviour: dashboardBehaviour,
         library: props == null ? void 0 : props.library,
@@ -57510,6 +57834,18 @@ var ModalType = /*#__PURE__*/function (ModalType) {
   ----------------------------------------------
 */
 
+/*
+  ----------------------------------------------
+  ----------------------------------------------
+  ----------------------------------------------
+
+  Setting results
+
+  ----------------------------------------------
+  ----------------------------------------------
+  ----------------------------------------------
+*/
+
 /*
   ----------------------------------------------
   ----------------------------------------------
@@ -58547,6 +58883,65 @@ var ParametersModalView = function ParametersModalView(props) {
   });
 };
 
+var ViewRawResultsModal = function ViewRawResultsModal(props) {
+  var _useDashboardBehaviou = useDashboardBehaviourContext(),
+    textOverride = _useDashboardBehaviou.textOverride;
+  var _useToastContext = useToastContext(),
+    addToast = _useToastContext.addToast;
+  return jsxs(Modal, {
+    width: "4xl",
+    isOpen: props == null ? void 0 : props.show,
+    onClose: function onClose() {
+      return props == null ? void 0 : props.onClose(false);
+    },
+    children: [jsx(Modal.Header, {
+      title: textOverride('json_results', 'Data in raw JSON format'),
+      show: true
+    }), jsx(Modal.Content, {
+      children: jsx(View, {
+        maxHeight: "400px",
+        overflowY: "scroll",
+        children: jsx("pre", {
+          "data-testid": "raw-results-" + props.rowIndex + "-" + props.cellIndex,
+          children: JSON.stringify(props.results, null, 2)
+        })
+      })
+    }), jsx(Modal.Footer, {
+      buttons: "end",
+      children: jsxs(ButtonGroup, {
+        children: [jsx(Button, {
+          secondary: true,
+          testId: "modal-close-btn",
+          onClick: function onClick() {
+            return props == null ? void 0 : props.onClose(false);
+          },
+          children: textOverride('close', 'Close')
+        }), jsx(Button, {
+          primary: true,
+          testId: "modal-copy-json-results-btn",
+          onClick: function onClick() {
+            var copied = copy(JSON.stringify(props.results));
+            if (copied) {
+              addToast(function () {
+                return jsx(ToastSuccess, {
+                  message: "Copied results"
+                });
+              });
+            } else {
+              addToast(function () {
+                return jsx(ToastError, {
+                  message: "Failed to copy results"
+                });
+              });
+            }
+          },
+          children: textOverride('copy', 'Copy')
+        })]
+      })
+    })]
+  });
+};
+
 var ViewRawAttributesModal = function ViewRawAttributesModal(props) {
   var _useDashboardBehaviou = useDashboardBehaviourContext(),
     textOverride = _useDashboardBehaviou.textOverride;
@@ -58928,6 +59323,7 @@ var PopulatedCell = function PopulatedCell(props) {
     localFiltersModal = _useState2[0],
     showLocalFiltersModal = _useState2[1];
   var _useState3 = useState(false),
+    viewRawJSONResults = _useState3[0],
     showViewRawJSONResults = _useState3[1];
   var _useState4 = useState(false),
     viewRawAttributes = _useState4[0],
@@ -59102,6 +59498,7 @@ var PopulatedCell = function PopulatedCell(props) {
             isBeingSizeAdjusted: props.isBeingSizeAdjusted,
             runQueriesCallback: props.runQueriesCallback,
             component: props.component,
+            setResults: props.setResults,
             updateComponentAttributes: props.updateComponentAttributes,
             height: props.height
           }), !showComponent && jsx(LoadingComponent, {})]
@@ -59127,6 +59524,14 @@ var PopulatedCell = function PopulatedCell(props) {
       onClose: function onClose() {
         return showParametersModal(false);
       }
+    }), jsx(ViewRawResultsModal, {
+      cellIndex: props.cellIndex,
+      rowIndex: props.rowIndex,
+      show: viewRawJSONResults,
+      results: props.component.results,
+      onClose: function onClose() {
+        return showViewRawJSONResults(false);
+      }
     }), jsx(ViewRawAttributesModal, {
       cellIndex: props.cellIndex,
       rowIndex: props.rowIndex,
@@ -59156,6 +59561,7 @@ var PopulatedCell = function PopulatedCell(props) {
         isBeingSizeAdjusted: props.isBeingSizeAdjusted,
         runQueriesCallback: props.runQueriesCallback,
         component: props.component,
+        setResults: props.setResults,
         updateComponentAttributes: props.updateComponentAttributes,
         height: props.height
       })
@@ -59821,6 +60227,14 @@ var ResizableRowCell = function ResizableRowCell(props) {
         });
       },
       height: props.height,
+      setResults: function setResults(results) {
+        dispatch({
+          type: 'setResultsForComponentInDisplay',
+          rowIndex: rowIndex,
+          cellIndex: cellIndex,
+          results: results
+        });
+      },
       onEdit: function onEdit() {
         trackEvent('component.startEditing');
         dispatch({
@@ -61125,6 +61539,9 @@ var ComponentInLibrary = function ComponentInLibrary(props) {
               setLocalFilters: function setLocalFilters() {},
               runQueriesCallback: props.runQueriesCallback,
               component: component,
+              setResults: function setResults(results) {
+                return props.setResults(results, libraryIndex);
+              },
               updateComponentAttributes: props.updateComponentAttributes,
               library: true
             })]
@@ -61447,6 +61864,7 @@ var ViewsInLibrary = function ViewsInLibrary(props) {
                 refIndex = _ref.refIndex;
               return jsx(ComponentInLibrary, {
                 updateComponentAttributes: props.updateComponentAttributes,
+                setResults: props.setResults,
                 component: item.component,
                 libraryIndex: refIndex,
                 onSelectComponent: props == null ? void 0 : props.onSelectComponent,
@@ -61489,6 +61907,20 @@ var Library = function Library() {
     featureToggles = _useDashboardBehaviou.featureToggles,
     textOverride = _useDashboardBehaviou.textOverride;
   var canEditComponentLibrary = featureToggles.canEditComponentLibrary;
+  var setResults = function setResults(results, libraryIndex) {
+    dispatch({
+      type: 'setResultsForComponentInLibrary',
+      results: results,
+      libraryIndex: libraryIndex
+    });
+  };
+  var setFocussedComponentResults = function setFocussedComponentResults(results) {
+    dispatch({
+      type: 'setResultsForComponentInLibrary',
+      results: results,
+      libraryIndex: selectedLibraryIndex
+    });
+  };
   var selectComponentFromLibrary = function selectComponentFromLibrary() {
     dispatch({
       type: 'pickComponentFromLibraryForDisplay',
@@ -61556,8 +61988,10 @@ var Library = function Library() {
       onClose: clearModal,
       onSelect: selectComponentFromLibrary,
       updateComponentAttributes: updateComponentAttributes,
+      setFocussedComponentResults: setFocussedComponentResults,
       dashboard: dashboard,
       selectedLibraryIndex: selectedLibraryIndex,
+      setResults: setResults,
       canEditComponentLibrary: canEditComponentLibrary,
       onEdit: startEditingSelectedComponent,
       onDelete: setShowDeleteConfirmationModal,
@@ -61600,6 +62034,7 @@ var ViewLibraryDisplay = function ViewLibraryDisplay(props) {
       "data-component": "library-content",
       children: jsx(ViewsInLibrary, {
         runQueriesCallback: props == null ? void 0 : props.runQueriesCallback,
+        setResults: props == null ? void 0 : props.setResults,
         components: props.dashboard.componentLibrary,
         onSelectComponent: function onSelectComponent(index) {
           return props == null ? void 0 : props.onSelectComponent(index);
@@ -64851,12 +65286,14 @@ var handleFeedbackMessage = function handleFeedbackMessage(_ref) {
 
 // By using message ids we ensure there will only be 1 message of a type, and it can be easily removed
 var chartDimensionMessageId = 'grouping';
+var limitWarningMessageId = 'limit';
 var EditorComponent = function EditorComponent(props) {
   var _theme$editor$gap, _theme$editor, _theme$editor2, _props$usingBeta, _theme$editor3;
   var theme = useTheme();
   var editorFeedback = useEditorFeedback();
   var _props$editor = props.editor,
     setAttributes = _props$editor.setAttributes,
+    setResults = _props$editor.setResults,
     runQueriesCallback = _props$editor.runQueriesCallback,
     component = _props$editor.component,
     dataSet = _props$editor.dataSet,
@@ -64877,25 +65314,26 @@ var EditorComponent = function EditorComponent(props) {
       editorFeedback.removeFeedbackMessage(chartDimensionMessageId);
     };
   }, [component.attributes]);
-
-  // useEffect(() => {
-  //   handleFeedbackMessage({
-  //     message: {
-  //       id: limitWarningMessageId,
-  //       type: 'info',
-  //       children: `More data is available for this view. Increase 'Limit' (Advanced Options) to show all data.`,
-  //     },
-  //     showCondition: component.results.some((result) => result?.hasMoreResults),
-  //     hideCondition: !component.results.some((result) => result?.hasMoreResults),
-  //     addFeedbackMessage: editorFeedback.addFeedbackMessage,
-  //     removeFeedbackMessage: editorFeedback.removeFeedbackMessage,
-  //   });
-
-  //   return () => {
-  //     editorFeedback.removeFeedbackMessage(limitWarningMessageId);
-  //   };
-  // }, [component.results]);
-
+  useEffect(function () {
+    handleFeedbackMessage({
+      message: {
+        id: limitWarningMessageId,
+        type: 'info',
+        children: "More data is available for this view. Increase 'Limit' (Advanced Options) to show all data."
+      },
+      showCondition: component.results.some(function (result) {
+        return result == null ? void 0 : result.hasMoreResults;
+      }),
+      hideCondition: !component.results.some(function (result) {
+        return result == null ? void 0 : result.hasMoreResults;
+      }),
+      addFeedbackMessage: editorFeedback.addFeedbackMessage,
+      removeFeedbackMessage: editorFeedback.removeFeedbackMessage
+    });
+    return function () {
+      editorFeedback.removeFeedbackMessage(limitWarningMessageId);
+    };
+  }, [component.results]);
   return jsx(RichTextEditorContextProvider, {
     setContent: function setContent(content) {
       // @ts-ignore
@@ -64934,6 +65372,7 @@ var EditorComponent = function EditorComponent(props) {
               isBeingSizeAdjusted: false,
               setLocalFilters: props.editor.setLocalFilters,
               runQueriesCallback: runQueriesCallback,
+              setResults: setResults,
               component: component,
               updateComponentAttributes: setAttributes,
               editor: true
@@ -64947,10 +65386,10 @@ var EditorComponent = function EditorComponent(props) {
 
 var EditorModal = function EditorModal(props) {
   var _theme$modals, _theme$modals2;
+  var editor = useEditor();
   var _React$useState = React__default.useState(false),
     ai = _React$useState[0],
     openAI = _React$useState[1];
-  var editor = useEditor();
   var usingBeta = useBetaFeatures();
   var _useAIBehaviour = useAIBehaviour(),
     fetchSuggestions = _useAIBehaviour.fetchSuggestions;
@@ -69980,7 +70419,7 @@ var fromToken = function fromToken(token) {
   });
 };
 
-var init$e = function init(dashboardSessionToken, dataAccessToken, queryEngineAccessToken, dashboardAdminOverrideToken) {
+var init$d = function init(dashboardSessionToken, dataAccessToken, queryEngineAccessToken, dashboardAdminOverrideToken) {
   var dashboardAccessContent = fromToken(dashboardSessionToken);
   if (!('scope' in dashboardAccessContent)) {
     dashboardAccessContent.scope = 'read_write';
@@ -70046,7 +70485,7 @@ var fetchIdentityConfig = /*#__PURE__*/function () {
           throw new FailedToLoadIdentity('Failed to fetch identity config.');
         case 6:
           dashboardAdminOverride = isClientSide() ? getDashboardAdminOverride(window.location.href) : null;
-          identityConfig = init$e(tokens.dashboardAccessToken, tokens.dataAccessToken, tokens.queryEngineAccessToken, dashboardAdminOverride);
+          identityConfig = init$d(tokens.dashboardAccessToken, tokens.dataAccessToken, tokens.queryEngineAccessToken, dashboardAdminOverride);
           return _context.abrupt("return", {
             identityConfig: identityConfig,
             tokens: tokens
@@ -70854,6 +71293,7 @@ var buildComponentLibrary = function buildComponentLibrary(cells) {
       newComponentLibrary.push({
         attributes: cell.component.attributes,
         localFilters: (_cell$localFilters2 = cell.localFilters) != null ? _cell$localFilters2 : [],
+        results: [],
         colSpan: 1,
         reports: []
       });
@@ -71221,6 +71661,32 @@ var TimeoutWaitingForVizzlyInstance = /*#__PURE__*/function (_Error) {
   return TimeoutWaitingForVizzlyInstance;
 }( /*#__PURE__*/_wrapNativeSuper(Error));
 
+var joiOptions$1 = {
+  convert: false,
+  stripUnknown: false,
+  allowUnknown: true
+};
+var validateQuery = function validateQuery(params, queryEngineConfig) {
+  var validationResult = Joi.array().items(schema(queryEngineConfig)).validate(params, joiOptions$1);
+  if (validationResult.error) {
+    throw new ServicesValidationError(validationResult.error.message);
+  }
+};
+var filterSchema$1 = function filterSchema(queryEngineConfig) {
+  var _Joi$string;
+  return Joi.array().items(Joi.alternatives()["try"](Joi.object({
+    field: Joi.string().required().description('The ID of the field from the data set to reference.'),
+    op: (_Joi$string = Joi.string()).valid.apply(_Joi$string, Object.keys(queryEngineConfig.supportedOperators)).required(),
+    value: Joi.any().required()
+  }).description('A filter object to apply to the data set.'), Joi.array()));
+};
+var schema = function schema(queryEngineConfig) {
+  return Joi.object(_extends({}, querySchema(queryEngineConfig, {}), {
+    filter: filterSchema$1(queryEngineConfig),
+    timeDimension: Joi.alternatives(timeDimensionSchema(queryEngineConfig.supportedTimeTruncFunctions), Joi.valid(null))
+  }));
+};
+
 var validateDashboardJoiOptions = {
   convert: false,
   stripUnknown: false,
@@ -71298,7 +71764,7 @@ var toQueries = function toQueries(dataSets, queryAttributes, queryEngineConfig,
   var queries = queryAttributes.map(function (qA) {
     var dataSet = find(dataSets, qA.dataSetId);
     if (!dataSet) throw 'Data set not found for query attributes query';
-    return buildFromQueryAttributes(dataSet, qA.measure, qA.filter, qA.order, qA.dimension, qA.timeDimension, qA.limit, qA.offset, queryEngineConfig, params);
+    return buildFromQueryAttributes(dataSet, qA.measure, qA.order, qA.dimension, qA.timeDimension, qA.limit, qA.offset, queryEngineConfig, params, qA.filter);
   });
   return {
     queries: queries.map(function (q) {
@@ -71356,7 +71822,7 @@ function getOptionsOrders(dataSetField) {
 }
 
 var commonToQueries = function commonToQueries(attributes, dataSet, queryEngineConfig, params) {
-  var _Query$build = build$c(dataSet, attributes.measure, attributes.filter, attributes.order, attributes.dimension,
+  var _Query$build = build$c(dataSet, attributes.measure, attributes.order, attributes.dimension,
     // @ts-ignore
     attributes.timeDimension || null, attributes.limit, attributes.offset, queryEngineConfig, params),
     query = _Query$build.query,
@@ -71381,8 +71847,8 @@ var toQueries$6 = commonToQueries;
 var toQueries$7 = commonToQueries;
 
 var buildMainQueries = function buildMainQueries(attributes, dataSet, queryEngineConfig, params) {
-  var line = build$c(dataSet, attributes.lineMeasure, attributes.filter, attributes.order, attributes.lineDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
-  var bar = build$c(dataSet, attributes.barMeasure, attributes.filter, attributes.order, attributes.barDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
+  var line = build$c(dataSet, attributes.lineMeasure, attributes.order, attributes.lineDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
+  var bar = build$c(dataSet, attributes.barMeasure, attributes.order, attributes.barDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
   return {
     bar: bar,
     line: line
@@ -71409,8 +71875,8 @@ var toQueries$b = commonToQueries;
 var toQueries$c = commonToQueries;
 
 var buildMainQueries$1 = function buildMainQueries(attributes, dataSet, queryEngineConfig, params) {
-  var line = build$c(dataSet, attributes.lineMeasure, attributes.filter, attributes.order, attributes.lineDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
-  var bar = build$c(dataSet, attributes.barMeasure, attributes.filter, attributes.order, attributes.barDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
+  var line = build$c(dataSet, attributes.lineMeasure, attributes.order, attributes.lineDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
+  var bar = build$c(dataSet, attributes.barMeasure, attributes.order, attributes.barDimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params);
   return {
     bar: bar,
     line: line
@@ -71429,7 +71895,7 @@ var toQueries$d = function toQueries(attributes, dataSet, queryEngineConfig, par
 };
 
 var buildMainQuery = function buildMainQuery(attributes, dataSet, queryEngineConfig, params) {
-  var _Query$build = build$c(dataSet, attributes.measure, attributes.filter, [], [], null, 1, attributes.offset, queryEngineConfig, params),
+  var _Query$build = build$c(dataSet, attributes.measure, [], [], null, 1, attributes.offset, queryEngineConfig, params),
     query = _Query$build.query,
     measureDescription = _Query$build.measureDescription;
 
@@ -71457,7 +71923,7 @@ var buildMainQuery = function buildMainQuery(attributes, dataSet, queryEngineCon
 };
 var buildDeltaQuery = function buildDeltaQuery(dataSet, attributes, queryEngineConfig, params) {
   if (!attributes.deltaTimeDimension) return null;
-  return build$c(dataSet, attributes.measure, attributes.filter, [{
+  return build$c(dataSet, attributes.measure, [{
     field: attributes.deltaTimeDimension.field,
     direction: 'asc',
     "function": attributes.deltaTimeDimension.truncate
@@ -71489,7 +71955,7 @@ var toQueries$f = function toQueries(attributes, dataSet, queryEngineConfig, par
   var measures = [];
   attributes.xMeasure && measures.push(attributes.xMeasure);
   attributes.yMeasure && measures.push(attributes.yMeasure);
-  var _Query$build = build$c(dataSet, measures, attributes.filter, attributes.order, attributes.dimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params),
+  var _Query$build = build$c(dataSet, measures, attributes.order, attributes.dimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params),
     query = _Query$build.query,
     measureDescription = _Query$build.measureDescription;
   var resultFields = toResultFields([measureDescription], queryEngineConfig);
@@ -71503,7 +71969,7 @@ var toQueries$g = function toQueries(attributes, dataSet, queryEngineConfig, par
   var measures = [];
   attributes.xMeasure && measures.push(attributes.xMeasure);
   attributes.yMeasure && measures.push(attributes.yMeasure);
-  var _Query$build = build$c(dataSet, measures, attributes.filter, attributes.order, attributes.dimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params),
+  var _Query$build = build$c(dataSet, measures, attributes.order, attributes.dimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params),
     query = _Query$build.query,
     measureDescription = _Query$build.measureDescription;
   var resultFields = toResultFields([measureDescription], queryEngineConfig);
@@ -71515,7 +71981,7 @@ var toQueries$g = function toQueries(attributes, dataSet, queryEngineConfig, par
 
 var toQueries$h = function toQueries(attributes, dataSet, queryEngineConfig, params) {
   var measures = [].concat(attributes.measure || [], attributes.xMeasure || [], attributes.zMeasure || []);
-  var _Query$build = build$c(dataSet, measures, attributes.filter, attributes.order, attributes.dimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params),
+  var _Query$build = build$c(dataSet, measures, attributes.order, attributes.dimension, attributes.timeDimension, attributes.limit, attributes.offset, queryEngineConfig, params),
     query = _Query$build.query,
     measureDescription = _Query$build.measureDescription;
   var resultFields = toResultFields([measureDescription], queryEngineConfig);
@@ -71627,7 +72093,20 @@ var buildVizzlyQuery = function buildVizzlyQuery(thing, queryEngineConfig, param
     queriesToSend = [_query];
     resultFields = [_rF];
   } else if (Array.isArray(thing)) {
-    var _fromQueryAttributes = toQueries(params.dataSets, thing, queryEngineConfig, params),
+    var queriesInAttributesFormat = [].concat(thing).map(function (queryAttributes) {
+      var dataSet = find(params.dataSets, queryAttributes.dataSetId);
+      if (!dataSet) throw 'Data set not found for query-attributes query';
+      return _extends({}, queryAttributes, {
+        // TODO; this means that services queries that povide a query, cannot work... GTDEV-6947
+        filter: [],
+        whereClause: filterConfigToWhere(dataSet, queryEngineConfig, _extends({}, params, {
+          filterConfig: _extends({}, params.filterConfig, {
+            advancedFilter: queryAttributes.filter
+          })
+        }))
+      });
+    });
+    var _fromQueryAttributes = toQueries(params.dataSets, queriesInAttributesFormat, queryEngineConfig, params),
       q = _fromQueryAttributes.queries,
       _rF2 = _fromQueryAttributes.resultFields;
     queriesToSend = q;
@@ -71639,7 +72118,7 @@ var buildVizzlyQuery = function buildVizzlyQuery(thing, queryEngineConfig, param
     if (!_dataSet) throw 'Data set not found for view attributes query';
     var _buildVizzlyViewQueri = buildVizzlyViewQueries(thing, _dataSet, queryEngineConfig, _extends({}, params, {
         filterConfig: _extends({}, params.filterConfig, {
-          viewFilters: thing.filter
+          advancedFilter: thing.filter
         })
       })),
       _q = _buildVizzlyViewQueri.queries,
@@ -71676,7 +72155,7 @@ var set = function set(cacheKey, item, expiryInSeconds) {
   var key = JSON.stringify(cacheKey);
   var expires = new Date();
   expires.setSeconds(expires.getSeconds() + expiryInSeconds);
-  logDebug('Browser cache new object set.', key);
+  logDebug("Browser cache new object set.", key);
   cache$1[key] = {
     item: item,
     expires: expires
@@ -71686,10 +72165,10 @@ var get = function get(cacheKey) {
   var key = JSON.stringify(cacheKey);
   var retrieved = cache$1[key];
   if (!retrieved) {
-    logDebug('Browser cache miss.', cacheKey);
+    logDebug("Browser cache miss.", cacheKey);
     return null;
   }
-  logDebug('Browser cache hit.', cacheKey);
+  logDebug("Browser cache hit.", cacheKey);
   var item = retrieved.item,
     expires = retrieved.expires;
   var now = new Date();
@@ -71701,7 +72180,7 @@ var get = function get(cacheKey) {
   return null;
 };
 var clear$1 = function clear() {
-  logDebug('Browser cache cleared.');
+  logDebug("Browser cache cleared.");
   cache$1 = {};
 };
 
@@ -72865,6 +73344,7 @@ var VizzlyServices = /*#__PURE__*/function () {
               instanceId = params.instanceId;
             }
             service = VizzlyServices._instanceStore[instanceId];
+            validateQuery(queries, service.queryEngineConfig);
             queryEngineEndpoint = function () {
               if (params != null && params.queryEngineEndpoint) {
                 return params.queryEngineEndpoint;
@@ -72910,14 +73390,14 @@ var VizzlyServices = /*#__PURE__*/function () {
                 return _ref.apply(this, arguments);
               };
             }();
-            _context11.next = 9;
+            _context11.next = 10;
             return fetch();
-          case 9:
+          case 10:
             _context11.t0 = _context11.sent;
             return _context11.abrupt("return", {
               results: _context11.t0
             });
-          case 11:
+          case 12:
           case "end":
             return _context11.stop();
         }
@@ -73143,7 +73623,7 @@ VizzlyServices.HorizontalBarChart = HorizontalBarChart$2;
 VizzlyServices.MercatorMap = MercatorMap$4;
 VizzlyServices.SingleStat = SingleStat$3;
 VizzlyServices.Progress = Progress$3;
-VizzlyServices.WaterfallChart = WaterfallChart$4; // export type Query = Omit<SQLQuery, 'timeZone'> & { timeZone?: string };
+VizzlyServices.WaterfallChart = WaterfallChart$4;
 // @ts-ignore
 if (typeof window !== 'undefined' && !window.Vizzly) {
   // @ts-ignore
@@ -75997,7 +76477,7 @@ var GlobalProviderContents = function GlobalProviderContents(props) {
   });
 };
 
-var _excluded$j = ["view"];
+var _excluded$i = ["view"];
 var Dashboard$2 = function Dashboard(props) {
   var handleOnError = function handleOnError(error, errorInfo) {
     return (props == null ? void 0 : props.onError) && (props == null ? void 0 : props.onError(error, errorInfo));
@@ -76018,7 +76498,7 @@ var Editor$1 = function Editor(props) {
   var handleOnError = function handleOnError(error, errorInfo) {
     return (props == null ? void 0 : props.onError) && (props == null ? void 0 : props.onError(error, errorInfo));
   };
-  var resetProps = _objectWithoutPropertiesLoose(props, _excluded$j);
+  var resetProps = _objectWithoutPropertiesLoose(props, _excluded$i);
   return jsxs(ErrorBoundary, {
     renderOnError: function renderOnError() {
       return jsx("p", {