autoql-fe-utils 1.0.39 → 1.0.41

package/dist/index.js

@@ -1047,6 +1047,7 @@ __export(src_exports, {
   DAYJS_PRECISION_FORMATS: () => DAYJS_PRECISION_FORMATS,
   DEFAULT_AGG_TYPE: () => DEFAULT_AGG_TYPE,
   DEFAULT_CHART_CONFIG: () => DEFAULT_CHART_CONFIG,
+  DEFAULT_CSS_PREFIX: () => DEFAULT_CSS_PREFIX,
   DEFAULT_DATA_PAGE_SIZE: () => DEFAULT_DATA_PAGE_SIZE,
   DEFAULT_EVALUATION_FREQUENCY: () => DEFAULT_EVALUATION_FREQUENCY,
   DEFAULT_LEGEND_PADDING_BOTTOM: () => DEFAULT_LEGEND_PADDING_BOTTOM,
@@ -1075,6 +1076,7 @@ __export(src_exports, {
   LEGEND_SHAPE_SIZE: () => LEGEND_SHAPE_SIZE,
   LEGEND_TOP_ADJUSTMENT: () => LEGEND_TOP_ADJUSTMENT,
   LOAD_MORE_DROPDOWN_PADDING_BOTTOM: () => LOAD_MORE_DROPDOWN_PADDING_BOTTOM,
+  MAX_CATEGORIES: () => MAX_CATEGORIES,
   MAX_DATA_PAGE_SIZE: () => MAX_DATA_PAGE_SIZE,
   MAX_LEGEND_LABELS: () => MAX_LEGEND_LABELS,
   MAX_ROWS_FOR_PIE_CHART: () => MAX_ROWS_FOR_PIE_CHART,
@@ -1111,6 +1113,7 @@ __export(src_exports, {
   adjustTopTitleToFit: () => adjustTopTitleToFit,
   adjustVerticalTitleToFit: () => adjustVerticalTitleToFit,
   aggregateData: () => aggregateData,
+  aggregateOtherCategory: () => aggregateOtherCategory,
   animateInputText: () => animateInputText,
   applyLegendTitleStyles: () => applyLegendTitleStyles,
   applyStylesForHiddenSeries: () => applyStylesForHiddenSeries,
@@ -2745,6 +2748,7 @@ var COLUMN_TYPES = {
 var DEFAULT_SOURCE = "widgets";
 
 // src/Constants/defaults.ts
+var DEFAULT_CSS_PREFIX = "react-autoql";
 var authenticationDefault = {
   token: void 0,
   apiKey: void 0,
@@ -4777,8 +4781,8 @@ var LIGHT_THEME = {
   "mask-color": "#0000000F",
   "mobile-mask-color": "#00000059",
   "scrollbar-color": "#aeaeae",
-  "box-shadow-1": "0px 1px 2px 1px var(--react-autoql-box-shadow-color)",
-  "box-shadow-2": "0px 1px 2px 0px var(--react-autoql-box-shadow-color)"
+  "box-shadow-1": "0px 1px 2px 1px #85858528",
+  "box-shadow-2": "0px 1px 2px 0px #85858528"
 };
 var DARK_THEME = {
   "accent-color": "#193a48",
@@ -4812,8 +4816,8 @@ var DARK_THEME = {
   "mask-color": "#00000021",
   "mobile-mask-color": "#00000059",
   "scrollbar-color": "#727477",
-  "box-shadow-1": "0px 1px 1px 0px var(--react-autoql-box-shadow-color)",
-  "box-shadow-2": "0px 1px 2px 0px var(--react-autoql-box-shadow-color)"
+  "box-shadow-1": "0px 1px 1px 0px #00000066",
+  "box-shadow-2": "0px 1px 2px 0px #00000066"
 };
 
 // src/theme/configureTheme.ts
@@ -4883,7 +4887,7 @@ var lightenDarkenColor = (col, amt) => {
   const string = "000000" + (g | b << 8 | r << 16).toString(16);
   return (usePound ? "#" : "") + string.substring(string.length - 6);
 };
-var getThemeValue = (property, prefix = "react-autoql") => {
+var getThemeValue = (property, prefix = DEFAULT_CSS_PREFIX) => {
   return document.documentElement.style.getPropertyValue(`--${prefix}-${property}`);
 };
 var getThemeType = () => {
@@ -4946,7 +4950,7 @@ var setChartColors = (providedChartColors, themeStyles) => {
     themeStyles[`chart-color-dark-${i}`] = darkerColor;
   });
 };
-var configureTheme = (customThemeConfig = {}, prefix = "react-autoql") => {
+var configureTheme = (customThemeConfig = {}, prefix = DEFAULT_CSS_PREFIX) => {
   const {
     theme,
     textColor,
@@ -5247,6 +5251,26 @@ var aggregateData = ({ data, aggColIndex, columns, numberIndices, dataFormatting
   });
   return aggregatedData;
 };
+var MAX_CATEGORIES = 10;
+var aggregateOtherCategory = (sortedData, columnIndexConfig) => {
+  if (!columnIndexConfig) {
+    return sortedData;
+  }
+  const clonedSortedData = (0, import_lodash5.default)(sortedData);
+  const sortedDataWithOther = [];
+  clonedSortedData.forEach((row, i) => {
+    var _a, _b, _c;
+    if (i === MAX_CATEGORIES) {
+      sortedDataWithOther[MAX_CATEGORIES] = row;
+      sortedDataWithOther[MAX_CATEGORIES][columnIndexConfig.stringColumnIndex] = "Other";
+    } else if (i > MAX_CATEGORIES && ((_a = sortedDataWithOther[MAX_CATEGORIES]) == null ? void 0 : _a[columnIndexConfig.numberColumnIndex])) {
+      sortedDataWithOther[MAX_CATEGORIES][columnIndexConfig.numberColumnIndex] += (_c = (_b = sortedData[i]) == null ? void 0 : _b[columnIndexConfig.numberColumnIndex]) != null ? _c : 0;
+    } else {
+      sortedDataWithOther[i] = row;
+    }
+  });
+  return sortedDataWithOther;
+};
 var generatePivotTableData = ({
   isFirstGeneration = false,
   rows,
@@ -5974,7 +5998,7 @@ var getLegendLabelsForSingleColumn = ({ data, columns, colorScale, columnIndexCo
       label: legendString.trim(),
       color: colorScale == null ? void 0 : colorScale(i),
       hidden: false,
-      columnIndex: i,
+      dataIndex: i,
       column
     };
   });
@@ -7169,17 +7193,13 @@ var getLegendScale = (legendLabels) => {
   const colorRange = legendLabels.map((obj) => {
     return obj.color;
   });
-  return (0, import_d3_scale.scaleOrdinal)().domain(
-    legendLabels.map((obj) => {
-      return obj.label;
-    })
-  ).range(colorRange);
+  return (0, import_d3_scale.scaleOrdinal)().domain(legendLabels.map((obj) => JSON.stringify(obj))).range(colorRange);
 };
 var styleLegendTitleNoBorder = (legendElement, isFirstSection) => {
   (0, import_d3_selection2.select)(legendElement).select(".legendTitle").style("font-weight", "bold").attr("data-test", "legend-title").attr("fill-opacity", 0.9).style("transform", "translateY(-5px)");
 };
-var styleLegendTitleWithBorder = (legendElement) => {
-  (0, import_d3_selection2.select)(legendElement).select(".legendTitle").style("font-weight", "bold").attr("data-test", "legend-title").append("tspan").text("  \u25BC").style("font-size", "8px").style("opacity", 0).attr("class", "react-autoql-axis-selector-arrow");
+var styleLegendTitleWithBorder = (legendElement, cssPrefix = DEFAULT_CSS_PREFIX) => {
+  (0, import_d3_selection2.select)(legendElement).select(".legendTitle").style("font-weight", "bold").attr("data-test", "legend-title").append("tspan").text("  \u25BC").style("font-size", "8px").style("opacity", 0).attr("class", `${cssPrefix}-axis-selector-arrow`);
   var titleBBox = {};
   try {
     titleBBox = (0, import_d3_selection2.select)(legendElement).select(".legendTitle").node().getBBox();
@@ -7233,8 +7253,11 @@ var removeHiddenLegendLabels = ({ legendElement, legendBorder, chartTooltipID })
 };
 var applyStylesForHiddenSeries = ({ legendElement, legendLabels }) => {
   try {
-    (0, import_d3_selection2.select)(legendElement).selectAll(".cell").each(function(label) {
-      const legendLabel = legendLabels.find((l) => l.label === this["__data__"]);
+    console.log({ legendLabels });
+    (0, import_d3_selection2.select)(legendElement).selectAll(".cell").each(function() {
+      var _a, _b;
+      const cellData = JSON.parse((_b = (_a = (0, import_d3_selection2.select)(this)) == null ? void 0 : _a.data) == null ? void 0 : _b.call(_a));
+      const legendLabel = legendLabels == null ? void 0 : legendLabels.find((l) => l.label === (cellData == null ? void 0 : cellData.label));
       if (legendLabel) {
         (0, import_d3_selection2.select)(this).select(".swatch").attr("stroke", legendLabel.color).attr("stroke-location", "outside");
         if (legendLabel.hidden) {
@@ -7248,7 +7271,7 @@ var applyStylesForHiddenSeries = ({ legendElement, legendLabels }) => {
     console.error(error);
   }
 };
-var getPieChartData = ({ data, numberColumnIndex, legendLabels, chartColors }) => {
+var getPieChartData = ({ data, numberColumnIndex, legendLabels }) => {
   const pieChart = (0, import_d3_shape.pie)().value((d, i) => {
     return d.value[numberColumnIndex];
   });
@@ -7263,7 +7286,7 @@ var getPieChartData = ({ data, numberColumnIndex, legendLabels, chartColors }) =
       })
     )
   );
-  const legendScale = legendLabels ? (0, import_d3_scale.scaleOrdinal)().domain(legendLabels.map((obj) => JSON.stringify(obj))).range(chartColors) : null;
+  const legendScale = getLegendScale(legendLabels);
   return { pieChartFn, legendScale };
 };
 var getDefaultBucketConfig = (data, bucketSize) => {
@@ -7467,12 +7490,7 @@ var getAxis = ({
   return axis;
 };
 var getLabelsBBox = (axisElement) => {
-  let labelsBBox = {
-    left: null,
-    bottom: null,
-    right: null,
-    top: null
-  };
+  let labelsBBox = {};
   if (axisElement) {
     const axisBBox = axisElement.getBBox ? axisElement.getBBox() : void 0;
     const axisBoundingRect = axisElement.getBoundingClientRect ? axisElement.getBoundingClientRect() : void 0;
@@ -7494,12 +7512,7 @@ var getLabelsBBox = (axisElement) => {
     });
     if (labelBboxes) {
       const allLabelsBbox = mergeBoundingClientRects(labelBboxes);
-      labelsBBox = {
-        left: allLabelsBbox.x,
-        top: allLabelsBbox.y,
-        right: allLabelsBbox.x + allLabelsBbox.width,
-        bottom: allLabelsBbox.y + allLabelsBbox.height
-      };
+      labelsBBox = { ...allLabelsBbox };
     }
   }
   return labelsBBox;
@@ -7510,7 +7523,7 @@ var adjustBottomTitleToFit = (titleElement, {
   outerWidth,
   deltaX,
   chartPadding = 0
-} = {}, CSS_PREFIX = "react-autoql") => {
+} = {}, CSS_PREFIX = DEFAULT_CSS_PREFIX) => {
   var _a, _b, _c;
   if (!titleElement || !labelsBBox || !innerWidth || !outerWidth) {
     console.warn("Unable to adjust bottom title - one of the following were not provided", {
@@ -7561,7 +7574,7 @@ var adjustTopTitleToFit = (titleElement, {
 var adjustVerticalTitleToFit = (titleElement, {
   deltaY,
   chartPadding = 0
-} = {}, CSS_PREFIX = "react-autoql") => {
+} = {}, CSS_PREFIX = DEFAULT_CSS_PREFIX) => {
   var _a;
   if (deltaY === void 0 || !titleElement) {
     return;
@@ -8523,7 +8536,7 @@ var runDrilldown = ({
     cancelToken
   };
   const url = `${domain}/autoql/api/v1/query/${queryID}/drilldown?key=${apiKey}`;
-  return import_axios.default.post(url, requestData, config).then((response) => transformQueryResponse(response, queryID)).catch(formatErrorResponse);
+  return import_axios.default.post(url, requestData, config).then((response) => transformQueryResponse(response, queryID, true)).catch(formatErrorResponse);
 };
 var fetchTopics = ({
   domain,
@@ -10314,6 +10327,7 @@ function color() {
   DAYJS_PRECISION_FORMATS,
   DEFAULT_AGG_TYPE,
   DEFAULT_CHART_CONFIG,
+  DEFAULT_CSS_PREFIX,
   DEFAULT_DATA_PAGE_SIZE,
   DEFAULT_EVALUATION_FREQUENCY,
   DEFAULT_LEGEND_PADDING_BOTTOM,
@@ -10342,6 +10356,7 @@ function color() {
   LEGEND_SHAPE_SIZE,
   LEGEND_TOP_ADJUSTMENT,
   LOAD_MORE_DROPDOWN_PADDING_BOTTOM,
+  MAX_CATEGORIES,
   MAX_DATA_PAGE_SIZE,
   MAX_LEGEND_LABELS,
   MAX_ROWS_FOR_PIE_CHART,
@@ -10378,6 +10393,7 @@ function color() {
   adjustTopTitleToFit,
   adjustVerticalTitleToFit,
   aggregateData,
+  aggregateOtherCategory,
   animateInputText,
   applyLegendTitleStyles,
   applyStylesForHiddenSeries,