pace-chart-lib 1.0.6 → 1.0.8

package/dist/pace-chart-lib.es.js

@@ -11602,6 +11602,7 @@ function computeMarginMetrics(windowWidth, windowHeight, maxNumberForPrimaryAxis
   )[1] : 0;
   yTitle = yTitle > width * 0.1 ? width * 0.1 : yTitle;
   let yLabel = formatOptions.yAxisLabel.yAxisLabelVisibility ? responsiveYaxisMargin(maxNumberForPrimaryAxis, yMaxLeft, formatOptions, false, isNormalizedChart) : getYAxisLabel(formatOptions, max$2(legendList, (d) => d?.length || 0) || 0);
+  yLabel += 8;
   let secondaryYLabel = formatOptions.secondaryYAxisLabel.secondaryYAxisLabelVisibility ? responsiveYaxisMargin(
     maxNumberForSecondaryAxis,
     yMaxRight,
@@ -12045,20 +12046,7 @@ function getNumberWithFormat(measureValue, displayUnits, numberFormat, decimalPr
     let decimalValues = decimalPrescision;
     let formatter;
     if (displayUnits === "Auto") {
-      if (Math.abs(measureValue) >= 1e9) {
-        Unit = 1e9;
-        displayUnitsPostFix = "B";
-      } else if (Math.abs(measureValue) >= 1e6) {
-        Unit = 1e6;
-        displayUnitsPostFix = "M";
-      } else if (Math.abs(measureValue) >= 1e3) {
-        Unit = 1e3;
-        displayUnitsPostFix = "K";
-      } else {
-        Unit = 1;
-        displayUnitsPostFix = "";
-      }
-      measureValue = measureValue / Unit;
+      return getAutoNumberWithFormat(measureValue);
     } else if (displayUnits != staticDisplayUnits.none) {
       displayUnits == staticDisplayUnits.thousands ? (Unit = 1e3, displayUnitsPostFix = "K") : null;
       displayUnits == staticDisplayUnits.millions ? (Unit = 1e6, displayUnitsPostFix = "M") : null;
@@ -12107,6 +12095,26 @@ function getNumberWithFormat(measureValue, displayUnits, numberFormat, decimalPr
     throw error;
   }
 }
+function getAutoNumberWithFormat(value2) {
+  if (value2 === null || value2 === void 0 || isNaN(value2)) return "-";
+  const absValue = Math.abs(value2);
+  if (absValue >= 1e9) {
+    return format(".2s")(value2).replace("G", "B");
+  } else if (absValue >= 1e6) {
+    return format(".2s")(value2);
+  } else if (absValue >= 1e3) {
+    return format(".2s")(value2);
+  } else if (absValue >= 1) {
+    const formatted = format(".2f")(value2);
+    return +formatted === Math.floor(value2) ? format(".0f")(value2) : formatted;
+  } else if (absValue >= 0.01) {
+    return format(".2f")(value2);
+  } else if (absValue > 0) {
+    return format(".2e")(value2);
+  } else {
+    return "0";
+  }
+}
 function responsiveYaxisMargin(maxNumber, yMax, formatOptions, isSecondaryAxis, isNormalizedChart) {
   try {
     {
@@ -12120,8 +12128,7 @@ function responsiveYaxisMargin(maxNumber, yMax, formatOptions, isSecondaryAxis,
       if (displayUnits != "None") {
         yMaxNumber = getNumberWithFormat(
           Math.floor(maxNumber) || Math.floor(yMax),
-          "Auto",
-          //displayUnits,
+          displayUnits,
           numberFormat,
           decimalPrecision ?? "2"
         ).toString();
@@ -12156,6 +12163,7 @@ function responsiveYaxisMargin(maxNumber, yMax, formatOptions, isSecondaryAxis,
 }
 function responsiveSecondaryYaxisLabel(secondaryYmax, secondaryYmin, formatOptions, chartJSON) {
   try {
+    let autoLabelFlag = false;
     let secondaryCustomYaxisIntervalValue = parseFloat(formatOptions.secondaryYAxisLabel.secondaryYAxisIntervalText);
     let secondaryCustomYaxisMinValue = parseFloat(formatOptions.secondaryYAxisLabel.secondaryYAxisMinText);
     let secondaryCustomYaxisMaxValue = parseFloat(formatOptions.secondaryYAxisLabel.secondaryYAxisMaxText);
@@ -12197,6 +12205,7 @@ function responsiveSecondaryYaxisLabel(secondaryYmax, secondaryYmin, formatOptio
         }
       }
     } else {
+      let autoLabelFlag2 = true;
       let labelWidthPx = calculateWidthHeightDynamically(
         (parseFloat(formatOptions.yAxisLabel.yAxisMaxText) || chartJSON.yMaxRight).toString(),
         formatOptions.yAxisLabel.yAxisLabelFontSize,
@@ -12210,7 +12219,7 @@ function responsiveSecondaryYaxisLabel(secondaryYmax, secondaryYmin, formatOptio
         labelWidthPx[0]
       );
     }
-    return { secondaryYAxisLabelArray, secondaryCustomTickValue };
+    return { secondaryYAxisLabelArray, secondaryCustomTickValue, autoLabelFlag };
   } catch (e) {
   }
 }
@@ -12252,11 +12261,17 @@ function isVerticallyOverlapping(obj1, obj2) {
 }
 function responsiveYaxisLabel$1(Ymax, Ymin, innerHeight2, formatOptions, chartJSON, customYaxisMinValue, customYaxisMaxValue, barChart, innerWidth2) {
   try {
+    let autoLabelFlag = false;
     let customYaxisIntervalValue = parseFloat(
       formatOptions.yAxisLabel.yAxisIntervalText
     );
     let yAxisLabelArray = [];
     let customTickValue;
+    if (!customYaxisMaxValue && Ymax > 0) {
+      const range2 = Ymax - Ymin;
+      const padding = range2 * 0.05;
+      Ymax = Ymax + padding;
+    }
     if (customYaxisIntervalValue && customYaxisIntervalValue !== 0 && customYaxisIntervalValue !== void 0) {
       let minValue = customYaxisMinValue || customYaxisMinValue == 0 ? customYaxisMinValue : Ymin;
       let maxValue = customYaxisMaxValue || customYaxisMaxValue == 0 ? customYaxisMaxValue : Ymax;
@@ -12296,6 +12311,7 @@ function responsiveYaxisLabel$1(Ymax, Ymin, innerHeight2, formatOptions, chartJS
         }
       }
     } else {
+      autoLabelFlag = true;
       let labelWidthPx = calculateWidthHeightDynamically(
         (customYaxisMaxValue || chartJSON.yMaxLeft).toString(),
         formatOptions.yAxisLabel.yAxisLabelFontSize,
@@ -12304,13 +12320,14 @@ function responsiveYaxisLabel$1(Ymax, Ymin, innerHeight2, formatOptions, chartJS
       );
       yAxisLabelArray = getLabelsFromAlgo(
         customYaxisMinValue || chartJSON.yMinLeft,
-        customYaxisMaxValue || chartJSON.yMaxLeft,
+        Ymax,
+        //Use updated Ymax with padding
         barChart ? innerWidth2 : innerHeight2,
         barChart ? labelWidthPx[1] : labelWidthPx[0]
       );
-      customTickValue = barChart ? innerWidth2 / 30 : innerHeight2 / 30;
+      customTickValue = barChart ? innerWidth2 / 80 : innerHeight2 / 80;
     }
-    return { yAxisLabelArray, customTickValue };
+    return { yAxisLabelArray, customTickValue, autoLabelFlag };
   } catch (e) {
     throw e;
   }
@@ -12343,9 +12360,7 @@ function getLabelsFromAlgo(dataMin, dataMax, axisLengthPx, labelWidthPx = 80) {
     labels.push(parseFloat(current.toFixed(10)));
     current += interval2;
   }
-  const reductionFactor = 4;
-  const reducedLabels = labels.filter((i) => i % reductionFactor === 0);
-  return reducedLabels;
+  return labels;
 }
 function initYaxis$1(gTag, formatOptions, dataTableHeight, yLabel, yAxisLeft, innerHeight2) {
   try {
@@ -16399,6 +16414,15 @@ const ColumnChart = ({
   };
   const initAxis = () => {
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -16408,27 +16432,7 @@ const ColumnChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
     if (isSecondaryAxisDrawn) {
       yAxisRight = axisRight(yScaleRight).tickFormat(
@@ -17133,6 +17137,15 @@ const CustomColumnChart = ({
   };
   const initAxis = () => {
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -17142,27 +17155,7 @@ const CustomColumnChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + 0 : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
     if (isSecondaryAxisDrawn) {
       yAxisRight = axisRight(yScaleRight).tickFormat(
@@ -17931,6 +17924,15 @@ const LayeredColumnChart = ({
   const initAxis = () => {
     getXAxis();
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -17940,27 +17942,7 @@ const LayeredColumnChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getXAxis = () => {
@@ -18458,9 +18440,7 @@ const StackColumnChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + 0 : 0 : 0
-      ).tickValues(respParams.yAxisLabelArray).ticks(
-        respParams.customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(respParams.autoLabelFlag ? void 0 : respParams.yAxisLabelArray).ticks(respParams.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getXAxis = () => {
@@ -19178,7 +19158,7 @@ const NormalizedStackColumnChart = ({
       yAxisLeft = axisLeft(yScaleLeft).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
       ).ticks(
-        dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30,
+        dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 80 : innerHeight2 / 80,
         "%"
       ).tickPadding(8).tickSizeOuter(0);
     }
@@ -20229,6 +20209,17 @@ const ColumnHistogramChart = ({
   const initAxis = () => {
     getXAxis();
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue,
+        false,
+        innerWidth2
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -20238,19 +20229,7 @@ const ColumnHistogramChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + 0 : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue,
-          false,
-          innerWidth2
-        ).yAxisLabelArray
-      ).ticks(innerHeight2 / 50).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getXAxis = () => {
@@ -20732,6 +20711,15 @@ const LineChart = ({
   };
   const initAxis = () => {
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -20741,29 +20729,15 @@ const LineChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
     if (isSecondaryAxisDrawn) {
+      let responsiveSecondaryLablesObj = responsiveSecondaryYaxisLabel(
+        secondaryCustomYaxisMaxValue ? secondaryCustomYaxisMaxValue : chartJSON.yMaxRight,
+        chartJSON.yMinRight,
+        formatOptions,
+        chartJSON
+      );
       yAxisRight = axisRight(yScaleRight).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -20771,21 +20745,7 @@ const LineChart = ({
           formatOptions.secondaryYAxisLabel.secondaryYAxisNumberFormat,
           formatOptions.secondaryYAxisLabel.secondaryYAxisLabelDecimalPrecision
         )
-      ).tickValues(
-        responsiveSecondaryYaxisLabel(
-          secondaryCustomYaxisMaxValue ? secondaryCustomYaxisMaxValue : chartJSON.yMaxRight,
-          chartJSON.yMinRight,
-          formatOptions,
-          chartJSON
-        ).secondaryYAxisLabelArray
-      ).ticks(
-        responsiveSecondaryYaxisLabel(
-          secondaryCustomYaxisMaxValue ? secondaryCustomYaxisMaxValue : chartJSON.yMaxRight,
-          chartJSON.yMinRight,
-          formatOptions,
-          chartJSON
-        ).secondaryCustomTickValue ?? innerHeight2 / 30
-      ).tickSize(
+      ).tickValues(responsiveSecondaryLablesObj.autoLabelFlag ? void 0 : responsiveSecondaryLablesObj.secondaryYAxisLabelArray).ticks(responsiveSecondaryLablesObj.secondaryCustomTickValue).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 : 0 : 0
       ).tickPadding(8).tickSizeOuter(0);
     }
@@ -21281,6 +21241,15 @@ const StackLineChart = ({
   const initAxis = () => {
     getXAxis();
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -21290,27 +21259,7 @@ const StackLineChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getXAxis = () => {
@@ -21797,7 +21746,7 @@ const NormalisedStackLineChart = ({
       yAxisLeft = axisLeft(yScaleLeft).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
       ).ticks(
-        dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30,
+        dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 80 : innerHeight2 / 80,
         "%"
       ).tickPadding(8).tickSizeOuter(0);
     }
@@ -22312,6 +22261,15 @@ const HorizontalBarChart = ({
   };
   const initAxis = () => {
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       xAxisBottom = axisBottom(xScaleBottom).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -22321,29 +22279,15 @@ const HorizontalBarChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesVertical ? -innerHeight2 : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? innerHeight2 / 30
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
     if (isSecondaryAxisDrawn) {
+      let responsiveSecondaryLablesObj = responsiveSecondaryYaxisLabel(
+        secondaryCustomYaxisMaxValue ? secondaryCustomYaxisMaxValue : chartJSON.yMaxRight,
+        chartJSON.yMinRight,
+        formatOptions,
+        chartJSON
+      );
       xAxisTop = axisTop(xScaleTop).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -22351,21 +22295,7 @@ const HorizontalBarChart = ({
           formatOptions.secondaryYAxisLabel.secondaryYAxisNumberFormat,
           formatOptions.secondaryYAxisLabel.secondaryYAxisLabelDecimalPrecision
         )
-      ).tickValues(
-        responsiveSecondaryYaxisLabel(
-          secondaryCustomYaxisMaxValue ? secondaryCustomYaxisMaxValue : chartJSON.yMaxRight,
-          chartJSON.yMinRight,
-          formatOptions,
-          chartJSON
-        ).secondaryYAxisLabelArray
-      ).ticks(
-        responsiveSecondaryYaxisLabel(
-          secondaryCustomYaxisMaxValue ? secondaryCustomYaxisMaxValue : chartJSON.yMaxRight,
-          chartJSON.yMinRight,
-          formatOptions,
-          chartJSON
-        ).secondaryCustomTickValue ?? innerHeight2 / 30
-      ).tickSize(
+      ).tickValues(responsiveSecondaryLablesObj.autoLabelFlag ? void 0 : responsiveSecondaryLablesObj.secondaryYAxisLabelArray).ticks(responsiveSecondaryLablesObj.secondaryCustomTickValue).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 : 0 : 0
       ).tickPadding(8).tickSizeOuter(0);
     }
@@ -22811,6 +22741,17 @@ const StackHorizontalChart = ({
   };
   const initAxis = () => {
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue,
+        barChart,
+        innerWidth2
+      );
       xAxisBottom = axisBottom(xScaleBottom).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -22820,31 +22761,7 @@ const StackHorizontalChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesVertical ? -innerHeight2 : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue,
-          barChart,
-          innerWidth2
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue,
-          barChart,
-          innerWidth2
-        ).customTickValue ?? innerHeight2 / 30
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getYAxis = () => {
@@ -23514,7 +23431,7 @@ const NormalizedStackHorizontalBarChart = ({
     {
       xAxisBottom = axisBottom(xScaleBottom).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesVertical ? -innerHeight2 : 0 : 0
-      ).ticks(innerWidth2 / 30, "%").tickPadding(8).tickSizeOuter(0);
+      ).ticks(innerWidth2 / 80, "%").tickPadding(8).tickSizeOuter(0);
     }
   };
   const getYAxis = () => {
@@ -23974,6 +23891,17 @@ const LayeredHorizontalBarChart = ({
   const initAxis = () => {
     getYAxis();
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue,
+        barChart,
+        innerWidth2
+      );
       xAxisBottom = axisBottom(xScaleBottom).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -23983,31 +23911,7 @@ const LayeredHorizontalBarChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerHeight2 : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue,
-          barChart,
-          innerWidth2
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue,
-          barChart,
-          innerWidth2
-        ).customTickValue ?? innerHeight2 / 30
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getYAxis = () => {
@@ -24741,6 +24645,15 @@ const HorizontalHistogramChart = ({
   const initAxis = () => {
     getYAxis();
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       xAxisBottom = axisBottom(xScaleBottom).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -24750,27 +24663,7 @@ const HorizontalHistogramChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerHeight2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
     if (isSecondaryAxisDrawn) {
       xAxisTop = axisTop(xScaleTop).tickFormat(
@@ -25306,6 +25199,15 @@ const AreaChart = ({
   const initAxis = () => {
     getXAxis();
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -25315,27 +25217,7 @@ const AreaChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getXAxis = () => {
@@ -25852,6 +25734,15 @@ const StackAreaChart = ({
   };
   const initAxis = () => {
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -25861,27 +25752,7 @@ const StackAreaChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
   };
   const getXAxis = () => {
@@ -26409,7 +26280,7 @@ const NormalizedStackAreaChart = ({
       yAxisLeft = axisLeft(yScaleLeft).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
       ).ticks(
-        dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30,
+        dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 80 : innerHeight2 / 80,
         "%"
       ).tickPadding(8).tickSizeOuter(0);
     }
@@ -53746,6 +53617,15 @@ const WaterfallChart = ({
   const initAxis = () => {
     getXAxis();
     {
+      let responsiveLablesObj = responsiveYaxisLabel$1(
+        customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
+        chartJSON.yMinLeft,
+        innerHeight2,
+        formatOptions,
+        chartJSON,
+        customYaxisMinValue,
+        customYaxisMaxValue
+      );
       yAxisLeft = axisLeft(yScaleLeft).tickFormat(
         (d) => getNumberWithFormat(
           d,
@@ -53755,27 +53635,7 @@ const WaterfallChart = ({
         )
       ).tickSize(
         formatOptions.plotArea.gridLinesVisibility ? formatOptions.plotArea.gridLinesHorizontal ? -innerWidth2 + (seriesLabelWidth ? seriesLabelWidth : 0) : 0 : 0
-      ).tickValues(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).yAxisLabelArray
-      ).ticks(
-        responsiveYaxisLabel$1(
-          customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft,
-          chartJSON.yMinLeft,
-          innerHeight2,
-          formatOptions,
-          chartJSON,
-          customYaxisMinValue,
-          customYaxisMaxValue
-        ).customTickValue ?? (dataTableHeight > 0 ? (innerHeight2 - dataTableHeight) / 30 : innerHeight2 / 30)
-      ).tickPadding(8).tickSizeOuter(0);
+      ).tickValues(responsiveLablesObj.autoLabelFlag ? void 0 : responsiveLablesObj.yAxisLabelArray).ticks(responsiveLablesObj.customTickValue).tickPadding(8).tickSizeOuter(0);
     }
     colorScale = ordinal().range([
       "#E25A42",