@vizzly/dashboard 0.14.4-dev-125bf775444301efad7fc0dd44a48d3ff789043d → 0.14.4-dev-d73f29b3b6ca549def0e91cbf6ffb96cc4b133a2

package/dist/dashboard.esm.js

@@ -1,6 +1,6 @@
 import React__default, { Fragment, useEffect, useState, useContext, createContext, forwardRef, isValidElement, cloneElement, createElement, useLayoutEffect, useRef, useMemo, useReducer, createRef, useCallback, memo, useImperativeHandle, Suspense } from 'react';
 import isEmpty$3 from 'lodash-es/isEmpty';
-import _, { isArray, capitalize, isEmpty as isEmpty$2, replace, isObject, isNumber, every, some, mergeWith, remove as remove$2, cloneDeep, findIndex, reduce, merge, sumBy, mapValues, maxBy, zipObject, isFunction, isDate, omit as omit$1, reject, defaultsDeep, isString, flatMap, filter, uniq, uniqBy, debounce as debounce$1, orderBy, minBy, throttle, get as get$1, min, max, groupBy, intersection, isEqual } from 'lodash-es';
+import _, { isArray, capitalize, isEmpty as isEmpty$2, replace, isObject, isNumber, every, some, mergeWith, remove as remove$2, cloneDeep, findIndex, reduce, merge, sumBy, mapValues, zipObject, isFunction, isDate, omit as omit$1, maxBy, reject, defaultsDeep, isString, flatMap, filter, uniq, uniqBy, debounce as debounce$1, orderBy, minBy, throttle, get as get$1, min, max, groupBy, intersection, isEqual } from 'lodash-es';
 import { QueryEngineConfig } from '@vizzly/semantic-layer-public';
 import { v4 } from 'uuid';
 import Joi from '@vizzly/joi';
@@ -9955,169 +9955,6 @@ var to100PercentResultSet = function to100PercentResultSet(resultSet) {
   });
 };
 
-var DEFAULT_ROW_HEIGHT = 350;
-var HEADER_ROW_HEIGHT = 52;
-var linearScale = function linearScale(colors, colorCount) {
-  return chroma.scale(colors).colors(colorCount);
-};
-var themeToColorScale = function themeToColorScale(colors, colorCount) {
-  var _colors$length;
-  if ((colorCount != null ? colorCount : 0) <= ((_colors$length = colors == null ? void 0 : colors.length) != null ? _colors$length : 0)) {
-    return colors;
-  }
-  return shuffle(linearScale(colors, colorCount));
-};
-var vizzlyDefaultTheme = {
-  colors: ['#feae4a', '#5fbaff', '#e15e9d'],
-  detail: 'minimal',
-  fontFamily: 'Inter, sans-serif',
-  rowLimit: 6,
-  fontSize: '0.65rem'
-};
-var darkerColor = function darkerColor(color, darkenBy, opacity) {
-  var newColor = chroma(color).darken(darkenBy);
-  if (opacity) newColor = setOpacity(newColor, opacity);
-  return newColor.hex();
-};
-var darkenListOfColors = function darkenListOfColors(colors, darkenBy) {
-  if (darkenBy === void 0) {
-    darkenBy = 1;
-  }
-  return [].concat(colors).map(function (color) {
-    return darkerColor(color, darkenBy);
-  });
-};
-var setOpacity = function setOpacity(color, opacity) {
-  return chroma(color).alpha(opacity);
-};
-var highestContrast = function highestContrast(baseColor, colorOptions) {
-  return maxBy(colorOptions, function (potentialTextColour) {
-    return chroma.contrast(potentialTextColour, baseColor);
-  }) || baseColor;
-};
-
-// Typically anything over 4.5 is high enough contrast.
-var pickBestTextColor = function pickBestTextColor(backgroundColour, possibleTextColours) {
-  return highestContrast(backgroundColour, possibleTextColours);
-};
-
-// ------------------------------------------------------------------------------------
-// ------------------------------------------------------------------------------------
-// ------------------------------------------------------------------------------------
-// ------------------------------------------------------------------------------------
-// https://stackoverflow.com/questions/16801687/javascript-random-ordering-with-seed
-
-var random = function random(seed) {
-  var x = Math.sin(seed++) * 10000;
-  return x - Math.floor(x);
-};
-var DEFAULT_RANDOM_SEED = 5;
-var shuffle = function shuffle(array, seed) {
-  if (seed === void 0) {
-    seed = DEFAULT_RANDOM_SEED;
-  }
-  var m = array.length,
-    t,
-    i;
-
-  // While there remain elements to shuffle…
-  while (m) {
-    // Pick a remaining element…
-    i = Math.floor(random(seed) * m--);
-
-    // And swap it with the current element.
-    t = array[m];
-    array[m] = array[i];
-    array[i] = t;
-    ++seed;
-  }
-  return array;
-};
-// ------------------------------------------------------------------------------------
-// ------------------------------------------------------------------------------------
-// ------------------------------------------------------------------------------------
-// ------------------------------------------------------------------------------------
-
-function getFormattedByRule(_ref) {
-  var type = _ref.type,
-    value = _ref.value;
-  var fontColor = pickBestTextColor(value != null ? value : '', ['white', 'black']);
-  switch (type) {
-    case 'fontColor':
-      {
-        return {
-          color: value
-        };
-      }
-    case 'backgroundColor':
-      {
-        return {
-          backgroundColor: value,
-          color: fontColor
-        };
-      }
-  }
-  return {};
-}
-var unsupportedNullComparisons = ['contains_substring', 'does_not_contain_substring', 'ends_with', 'starts_with', '<', '<=', '>', '>='];
-var compare = function compare(filter, recordValue) {
-  if (recordValue == null && unsupportedNullComparisons.includes(filter.op)) return false;
-  switch (filter.op) {
-    case 'starts_with':
-      return ("" + recordValue).startsWith(filter.value);
-    case 'ends_with':
-      return ("" + recordValue).endsWith(filter.value);
-    case 'is_one_of':
-      return filter.value.includes(recordValue);
-    case 'is_not_one_of':
-      return !filter.value.includes(recordValue);
-    case 'contains_substring':
-      return ("" + recordValue).includes(filter.value);
-    case 'does_not_contain_substring':
-      return !("" + recordValue).includes(filter.value);
-    case '<':
-      return recordValue < filter.value;
-    case '>':
-      return recordValue > filter.value;
-    case '=':
-      return recordValue == filter.value;
-    case '!=':
-      return recordValue != filter.value;
-    case '>=':
-      return recordValue >= filter.value;
-    case '<=':
-      return recordValue <= filter.value;
-    case 'array_contains':
-      // For some reason a datumKey being passed as the recordValue in certain situations here? // isDatumKey but don't implement yet
-      if (!isArray(recordValue)) return false;
-      return recordValue.some(function (v) {
-        return filter.value.includes(v);
-      });
-    case 'array_does_not_contain':
-      // For some reason a datumKey being passed as the recordValue in certain situations here?
-      if (!isArray(recordValue)) return false;
-      return !recordValue.some(function (v) {
-        return filter.value.includes(v);
-      });
-    case 'array_contains_any_of':
-      if (!isArray(recordValue)) return false;
-      return recordValue.some(function (v) {
-        return filter.value.includes(v);
-      });
-    case 'array_contains_all_of':
-      if (!isArray(recordValue)) return false;
-      // write a function to check if all elements in filter.value are in recordValue
-      return recordValue.every(function (v) {
-        return filter.value.includes(v);
-      });
-  }
-  console.log('Unsupported comparison op.', filter.op);
-  throw 'Unsupported comparison op.';
-};
-var conditionIsMet = function conditionIsMet(filter, value) {
-  return compare(filter, value);
-};
-
 var defaultNumberFormatOptions = function defaultNumberFormatOptions(textOverride) {
   var noValue = textOverride('number_format_option.noValueReplacement', 'No value');
   var formattingError = textOverride('number_format_option.formattingError', 'Formatting error');
@@ -10474,6 +10311,65 @@ var acceptedTimeDimensions = function acceptedTimeDimensions(timeDimension) {
   return ['week', 'month', 'quarter', 'year'].includes(timeDimension.truncate);
 };
 
+var unsupportedNullComparisons = ['contains_substring', 'does_not_contain_substring', 'ends_with', 'starts_with', '<', '<=', '>', '>='];
+var compare = function compare(filter, recordValue) {
+  if (recordValue == null && unsupportedNullComparisons.includes(filter.op)) return false;
+  switch (filter.op) {
+    case 'starts_with':
+      return ("" + recordValue).startsWith(filter.value);
+    case 'ends_with':
+      return ("" + recordValue).endsWith(filter.value);
+    case 'is_one_of':
+      return filter.value.includes(recordValue);
+    case 'is_not_one_of':
+      return !filter.value.includes(recordValue);
+    case 'contains_substring':
+      return ("" + recordValue).includes(filter.value);
+    case 'does_not_contain_substring':
+      return !("" + recordValue).includes(filter.value);
+    case '<':
+      return recordValue < filter.value;
+    case '>':
+      return recordValue > filter.value;
+    case '=':
+      return recordValue == filter.value;
+    case '!=':
+      return recordValue != filter.value;
+    case '>=':
+      return recordValue >= filter.value;
+    case '<=':
+      return recordValue <= filter.value;
+    case 'array_contains':
+      // For some reason a datumKey being passed as the recordValue in certain situations here? // isDatumKey but don't implement yet
+      if (!isArray(recordValue)) return false;
+      return recordValue.some(function (v) {
+        return filter.value.includes(v);
+      });
+    case 'array_does_not_contain':
+      // For some reason a datumKey being passed as the recordValue in certain situations here?
+      if (!isArray(recordValue)) return false;
+      return !recordValue.some(function (v) {
+        return filter.value.includes(v);
+      });
+    case 'array_contains_any_of':
+      if (!isArray(recordValue)) return false;
+      return recordValue.some(function (v) {
+        return filter.value.includes(v);
+      });
+    case 'array_contains_all_of':
+      if (!isArray(recordValue)) return false;
+      // write a function to check if all elements in filter.value are in recordValue
+      return recordValue.every(function (v) {
+        return filter.value.includes(v);
+      });
+  }
+  console.log('Unsupported comparison op.', filter.op);
+  throw 'Unsupported comparison op.';
+};
+var conditionIsMet = function conditionIsMet(filter, value) {
+  return compare(filter, value);
+};
+
 var mergeProps = function mergeProps(explicitProps, remoteProps, defaultProps) {
   var devDefined = merge({}, remoteProps, explicitProps);
   return merge({}, defaultProps, devDefined);
@@ -11178,6 +11074,89 @@ var TableLibraryWrapper = function TableLibraryWrapper(props) {
   });
 };
 
+var DEFAULT_ROW_HEIGHT = 350;
+var HEADER_ROW_HEIGHT = 52;
+var linearScale = function linearScale(colors, colorCount) {
+  return chroma.scale(colors).colors(colorCount);
+};
+var themeToColorScale = function themeToColorScale(colors, colorCount) {
+  var _colors$length;
+  if ((colorCount != null ? colorCount : 0) <= ((_colors$length = colors == null ? void 0 : colors.length) != null ? _colors$length : 0)) {
+    return colors;
+  }
+  return shuffle(linearScale(colors, colorCount));
+};
+var vizzlyDefaultTheme = {
+  colors: ['#feae4a', '#5fbaff', '#e15e9d'],
+  detail: 'minimal',
+  fontFamily: 'Inter, sans-serif',
+  rowLimit: 6,
+  fontSize: '0.65rem'
+};
+var darkerColor = function darkerColor(color, darkenBy, opacity) {
+  var newColor = chroma(color).darken(darkenBy);
+  if (opacity) newColor = setOpacity(newColor, opacity);
+  return newColor.hex();
+};
+var darkenListOfColors = function darkenListOfColors(colors, darkenBy) {
+  if (darkenBy === void 0) {
+    darkenBy = 1;
+  }
+  return [].concat(colors).map(function (color) {
+    return darkerColor(color, darkenBy);
+  });
+};
+var setOpacity = function setOpacity(color, opacity) {
+  return chroma(color).alpha(opacity);
+};
+var highestContrast = function highestContrast(baseColor, colorOptions) {
+  return maxBy(colorOptions, function (potentialTextColour) {
+    return chroma.contrast(potentialTextColour, baseColor);
+  }) || baseColor;
+};
+
+// Typically anything over 4.5 is high enough contrast.
+var pickBestTextColor = function pickBestTextColor(backgroundColour, possibleTextColours) {
+  return highestContrast(backgroundColour, possibleTextColours);
+};
+
+// ------------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------------
+// https://stackoverflow.com/questions/16801687/javascript-random-ordering-with-seed
+
+var random = function random(seed) {
+  var x = Math.sin(seed++) * 10000;
+  return x - Math.floor(x);
+};
+var DEFAULT_RANDOM_SEED = 5;
+var shuffle = function shuffle(array, seed) {
+  if (seed === void 0) {
+    seed = DEFAULT_RANDOM_SEED;
+  }
+  var m = array.length,
+    t,
+    i;
+
+  // While there remain elements to shuffle…
+  while (m) {
+    // Pick a remaining element…
+    i = Math.floor(random(seed) * m--);
+
+    // And swap it with the current element.
+    t = array[m];
+    array[m] = array[i];
+    array[i] = t;
+    ++seed;
+  }
+  return array;
+};
+// ------------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------------
+
 var _excluded$1 = ["fill", "width", "height"],
   _excluded2 = ["fill", "width", "height"],
   _excluded3 = ["fill", "gradient"],
@@ -39914,7 +39893,8 @@ var getTooltipData = function getTooltipData(_ref) {
     xScaleKey = _ref.xScaleKey,
     xScaleDataType = _ref.xScaleDataType,
     xScale = _ref.xScale,
-    xOrdering = _ref.xOrdering;
+    xOrdering = _ref.xOrdering,
+    chartType = _ref.chartType;
   var descending = xOrdering === 'desc';
   var point = localPoint(event) || {
     x: 0,
@@ -39982,7 +39962,12 @@ var getTooltipData = function getTooltipData(_ref) {
       tooltipData = Math.abs(_x - _d0Value) > Math.abs(_d1Value - _x) ? _d2 : _d;
     }
   } else if (xScaleDataType === 'string' && 'step' in xScale) {
+    var barWidth = 0;
     // 1. Get the band width in pixels of the xScale so we can use it to determine how wide each column is
+
+    if (chartType === 'bar') {
+      barWidth = xScale.bandwidth();
+    }
     var scaleBandWidth = xScale.step();
     // 2. Get the horizontal x position by removing the margin.left value
     var _x2 = point.x - margin.left;
@@ -39994,7 +39979,7 @@ var getTooltipData = function getTooltipData(_ref) {
     tooltipData = _d3;
     if (_d4) {
       // If x is closer to scaleBandWidth * d0 or scaleBandWidth * d1, then use d0 or d1 respectively
-      tooltipData = Math.abs(_x2 - scaleBandWidth * _indexOfX2) > Math.abs(scaleBandWidth * (_indexOfX2 + 1) - _x2) ? _d4 : _d3;
+      tooltipData = Math.abs(_x2 - (scaleBandWidth + barWidth) * _indexOfX2) > Math.abs((scaleBandWidth + barWidth) * (_indexOfX2 + 1) - _x2) ? _d4 : _d3;
     }
   }
   return {
@@ -40177,7 +40162,7 @@ var LegendItem = function LegendItem(_ref) {
           color: rule.color,
           style: style,
           yKey: yKey
-        });
+        }, "rule-" + JSON.stringify(rule));
       })]
     }), jsx("span", {
       style: {
@@ -40306,69 +40291,13 @@ var GoalLine = function GoalLine(_ref) {
 */
 
 var ASSUMED_AVERAGE_CHAR_WIDTH = 8.8;
-function calculateWordWidth(word, avgCharWidth) {
-  if (avgCharWidth === void 0) {
-    avgCharWidth = ASSUMED_AVERAGE_CHAR_WIDTH;
-  }
-  return word.length * avgCharWidth;
-}
 
-/** 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 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 {
-      break; // Stop if adding the word exceeds maxWidth
-    }
-  }
-  return fittedTicks.length;
-}
-function pickEquallySpaced(arr, numPicks) {
-  if (numPicks >= arr.length) {
-    return arr; // If numPicks is greater than or equal to the array length, return the whole array
-  }
-  var result = [];
-  var interval = (arr.length - 1) / (numPicks - 1);
-  for (var i = 0; i < numPicks; i++) {
-    var index = Math.round(i * interval); // Calculate index and round it
-    result.push(arr[index]);
-  }
-  return result;
-}
-var adjustTicks = function adjustTicks(lineChartRepresentation, width) {
-  lineChartRepresentation = cloneDeep(lineChartRepresentation);
-
-  // TODO; take this from the theme override...
-  var averageCharacterWidth = ASSUMED_AVERAGE_CHAR_WIDTH;
-  var numberOfTicksFittingIntoSpace = howManyTicksFitInWidth(lineChartRepresentation.x.ticks || [], width, averageCharacterWidth);
-
-  // @ts-ignore
-  lineChartRepresentation.x.ticks = pickEquallySpaced(lineChartRepresentation.x.ticks, numberOfTicksFittingIntoSpace);
-  return lineChartRepresentation;
-};
-
-var buildMargin = function buildMargin(chart, showYAxisLabels) {
-  var maxWidth = max(chart.y.ticks.map(function (tick) {
+var buildMargin = function buildMargin(yTicks, showYAxisLabels, hasYAxisTitle, hasXAxisTitle) {
+  var maxWidth = max(yTicks.map(function (tick) {
     return (tick.formattedValue || '').length * ASSUMED_AVERAGE_CHAR_WIDTH;
   }));
-  var showYTicks = showYAxisLabels && chart.y.ticks.length > 0;
+  var showYTicks = showYAxisLabels && yTicks.length > 0;
   var MINIMUM_Y_AXIS_WIDTH = 40;
-  var hasYAxisTitle = !!chart.y.title;
-  var hasXAxisTitle = !!chart.x.title;
   var yAxisTitleOffset = hasYAxisTitle ? 40 : 0;
   var xAxisTitleOffset = hasXAxisTitle ? 40 : 0;
   var left = showYTicks ? max([maxWidth, MINIMUM_Y_AXIS_WIDTH]) : MINIMUM_Y_AXIS_WIDTH;
@@ -40415,7 +40344,7 @@ var LineChart$5 = function LineChart(_ref) {
     tooltipData = _useTooltip.tooltipData,
     hideTooltip = _useTooltip.hideTooltip,
     showTooltip = _useTooltip.showTooltip;
-  var margin = buildMargin(chart, options.axis.showYAxisLabels);
+  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;
     })),
@@ -40505,7 +40434,8 @@ var LineChart$5 = function LineChart(_ref) {
       xScaleKey: xScaleKey,
       xScaleDataType: xScaleDataType,
       xOrdering: chart.x.scale.ordering,
-      xScale: xScale
+      xScale: xScale,
+      chartType: 'lines'
     });
     showTooltip({
       tooltipLeft: tooltipData == null ? void 0 : tooltipData.tooltipLeft,
@@ -40804,11 +40734,6 @@ var getStyleDefinition = function getStyleDefinition(_ref) {
   });
 };
 
-/** Increase a value by a percentage, if it is not 0. */
-var addOnChartMargin = function addOnChartMargin(value) {
-  if (value === 0) return 0;
-  return value + value * 0.03;
-};
 var getMinAndMax = function getMinAndMax(_ref) {
   var data = _ref.data,
     keys = _ref.keys,
@@ -40825,8 +40750,8 @@ var getMinAndMax = function getMinAndMax(_ref) {
       });
     }));
     return {
-      max: addOnChartMargin(Math.max.apply(Math, dataToAnalyse)),
-      min: addOnChartMargin(Math.min.apply(Math, dataToAnalyse))
+      max: Math.max.apply(Math, dataToAnalyse),
+      min: Math.min.apply(Math, dataToAnalyse)
     };
   } else if (dataType === 'number') {
     var _dataToAnalyse = [].concat(data.flatMap(function (dataItem) {
@@ -40837,8 +40762,8 @@ var getMinAndMax = function getMinAndMax(_ref) {
       return gL.value;
     }) : []);
     return {
-      max: addOnChartMargin(Math.max.apply(Math, _dataToAnalyse)),
-      min: addOnChartMargin(Math.min.apply(Math, _dataToAnalyse))
+      max: Math.max.apply(Math, _dataToAnalyse),
+      min: Math.min.apply(Math, _dataToAnalyse)
     };
   } else {
     return {
@@ -41568,6 +41493,62 @@ var buildLineChartRepresentation = function buildLineChartRepresentation(_ref) {
   return chart;
 };
 
+var ASSUMED_AVERAGE_CHAR_WIDTH$1 = 8.8;
+function calculateWordWidth(word, avgCharWidth) {
+  if (avgCharWidth === void 0) {
+    avgCharWidth = ASSUMED_AVERAGE_CHAR_WIDTH$1;
+  }
+  return word.length * avgCharWidth;
+}
+
+/** 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$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 {
+      break; // Stop if adding the word exceeds maxWidth
+    }
+  }
+  return fittedTicks.length;
+}
+function pickEquallySpaced(arr, numPicks) {
+  if (numPicks >= arr.length) {
+    return arr; // If numPicks is greater than or equal to the array length, return the whole array
+  }
+  var result = [];
+  var interval = (arr.length - 1) / (numPicks - 1);
+  for (var i = 0; i < numPicks; i++) {
+    var index = Math.round(i * interval); // Calculate index and round it
+    result.push(arr[index]);
+  }
+  return result;
+}
+var adjustTicks = function adjustTicks(lineChartRepresentation, width) {
+  lineChartRepresentation = cloneDeep(lineChartRepresentation);
+
+  // TODO; take this from the theme override...
+  var averageCharacterWidth = ASSUMED_AVERAGE_CHAR_WIDTH$1;
+  var numberOfTicksFittingIntoSpace = howManyTicksFitInWidth(lineChartRepresentation.x.ticks || [], width, averageCharacterWidth);
+
+  // @ts-ignore
+  lineChartRepresentation.x.ticks = pickEquallySpaced(lineChartRepresentation.x.ticks, numberOfTicksFittingIntoSpace);
+  return lineChartRepresentation;
+};
+
 var LineChartV2View = function LineChartV2View(props) {
   var _props$library, _props$attributes$vie;
   var _useDashboardBehaviou = useDashboardBehaviourContext(),
@@ -43844,6 +43825,28 @@ function buildColumnWidth(datumKey, sizing, defaultColumnWidth, alternativeColum
   return (_sizing$width = (_sizing = sizing[datumKey]) == null ? void 0 : _sizing.width) != null ? _sizing$width : defaultColumnWidth;
 }
 
+function getFormattedByRule(_ref) {
+  var type = _ref.type,
+    value = _ref.value;
+  var fontColor = pickBestTextColor(value != null ? value : '', ['white', 'black']);
+  switch (type) {
+    case 'fontColor':
+      {
+        return {
+          color: value
+        };
+      }
+    case 'backgroundColor':
+      {
+        return {
+          backgroundColor: value,
+          color: fontColor
+        };
+      }
+  }
+  return {};
+}
+
 var DataTableTR = function DataTableTR(props) {
   var row = props.row,
     rowIndex = props.rowIndex,

package/dist/shared-logic/src/BarChartV2/adjustTicks.d.ts

@@ -0,0 +1 @@
+export declare const ASSUMED_AVERAGE_CHAR_WIDTH = 8.8;

package/dist/shared-logic/src/BarChartV2/types.d.ts

@@ -0,0 +1,74 @@
+import { Tick } from '../ChartsV2/types';
+import { DataType } from '../Field/types';
+export declare type KeyId = string;
+export declare type Operator = string;
+export declare type ConditionalFormattingRule = {
+    operator: Operator;
+    value: any;
+    color: string;
+    yKey: KeyId;
+};
+export declare type Axis<SupportedVizzlyDataTypes, AxisKeys> = {
+    ticks: Tick<SupportedVizzlyDataTypes>[];
+    scale: {
+        dataType: DataType;
+        key: KeyId | null;
+        ordering: 'asc' | 'desc' | null;
+        min: SupportedVizzlyDataTypes | null;
+        max: SupportedVizzlyDataTypes | null;
+    };
+    postfix: string;
+    prefix: string;
+    title: string | null;
+} & AxisKeys;
+export declare type LegendItemStyleLine = {
+    type: 'line';
+    strokeDasharray: string | number | null;
+    strokeWidth: number;
+};
+export declare type LegendItem = {
+    yKey: KeyId;
+    color: string;
+    style: LegendItemStyleLine;
+};
+export declare type Key = {
+    key: KeyId;
+    keyFormatted: string;
+    dataType: DataType;
+};
+export declare type BarChartRepresentation = {
+    keys: {
+        [key: KeyId]: Key;
+    };
+    x: Axis<Date | string | number, {
+        key: KeyId;
+    }>;
+    y: Axis<number, {
+        keys: KeyId[];
+    }>;
+    conditionalFormattingRules: ConditionalFormattingRule[];
+    goalLines: GoalLine[];
+    data: {
+        [keyId: string]: DataItem;
+    }[];
+    bars: LegendItem[];
+};
+export declare type DataItem = {
+    value: number | string | null;
+    formattedValue: string | null;
+};
+export declare type GoalLine = {
+    value: number;
+    formattedValue: string | null;
+    color: string;
+    strokeStyle?: 'dashed' | 'solid';
+    strokeWidth: number;
+};
+export declare type DateTimeFormatter = {
+    formatter: (date: Date) => string;
+    description: string;
+};
+export declare type NumberFormatter = {
+    formatter: (number: number | undefined | null, noValueReplacement?: string) => string;
+    description: string;
+};

package/dist/shared-logic/src/ChartsV2/types.d.ts

@@ -0,0 +1,5 @@
+export declare type Tick<DataType> = {
+    value: DataType;
+    formattedValue: string | null;
+    scaleValue: DataType | null;
+};

package/dist/shared-logic/src/ConditionalFormatting/utils.d.ts

@@ -0,0 +1,7 @@
+import { QueryAttributes } from '../QueryAttributes/types';
+export declare type ComparisonFilter = {
+    op: QueryAttributes.Operator;
+    value: QueryAttributes.Filter['value'];
+};
+export declare const compare: (filter: ComparisonFilter, recordValue: unknown) => any;
+export declare const conditionIsMet: (filter: ComparisonFilter, value: number | string | boolean) => boolean;

package/dist/shared-logic/src/LineChartV2/getScaleAndTicks.d.ts

@@ -1,7 +1,8 @@
-import { KeyId, Tick, GoalLine } from './types';
+import { KeyId, GoalLine } from './types';
 import { QueryAttributes } from '../QueryAttributes/types';
 import { DataType } from '../Field/types';
 import { FormattedResult } from '../Result/types';
+import { Tick } from '../ChartsV2/types';
 declare type FormattingFunction = (value: any, nullValueAlias?: string) => string;
 interface getScaleAndTicksArgs {
     data: FormattedResult['contentMapped'];