pace-chart-lib 1.0.29 → 1.0.31

package/dist/Components/Charts/ChartsWithAxis/ChartsWithAxisFunctions.d.ts

@@ -417,33 +417,7 @@ export declare function setChartTitle(svg: any, formatOptions: TDefaultChartForm
  * @returns The appropriate D3 curve function based on the interpolation and smoothing settings.
  */
 export declare function getCurveType(formatOptions: TDefaultChartFormatOptionsType): d3.CurveFactory;
-/**
- * @param {TSeries[]} chartData - Array of data series for the chart.
- * @param {any} xScale - D3 scale function for the X axis.
- * @param {any} yScaleLeft - D3 scale function for the left Y axis.
- * @param {any} yScaleRight - D3 scale function for the right Y axis.
- * @param {TMargin} margin - Margin object defining chart margins.
- * @param {any} d3Annotation - D3 annotation library or object.
- * @param {string[]} labelExcludeList - List of labels to exclude from annotations.
- * @param {any[]} individualLabelColor - Array of colors for individual labels.
- * @param {any[]} oldAnnotationList - List of existing annotations to update or remove.
- * @param {TDefaultChartFormatOptionsType} formatOptions - Formatting options for the chart.
- * @param {string} chartType - Type of the chart (e.g., "line", "area").
- * @param {number} height - Total height of the SVG container.
- * @param {number} width - Total width of the SVG container.
- * @param {number} innerWidth - Inner width of the chart area.
- * @param {string[]} dimensionList - List of dimensions present in the chart data.
- * @param {number} innerHeight - Inner height of the chart area.
- * @param {string} widgetId - Unique identifier for the widget/chart instance.
- * @param {any} svg - D3 selection of the SVG element to render annotations.
- * @param {any} xScaleForLegends - D3 scale function for the X axis for legends.
- * @param {number} columnWidth - Column width for the chart.
- * @param {boolean} isSensitivityChart - Flag indicating if the chart is a sensitivity chart.
- * @param {boolean} barChart - Flag indicating if the chart is a barChart chart.
- *
- * @return {void} - This function does not return a value; it updates the SVG with annotations.
- */
-export declare function commonAnnotations(chartData: TSeries[], xScale: any, yScaleLeft: any, yScaleRight: any, margin: TMargin, d3Annotation: any, labelExcludeList: string[], individualLabelColor: any[], oldAnnotationList: any[], formatOptions: TDefaultChartFormatOptionsType, chartType: string, height: number, width: number, innerWidth: number, dimensionList: string[], innerHeight: number, widgetId: string, svg: any, xScaleForLegends?: any, columnWidth?: number, isReportEditable?: boolean, isSensitivityChart?: boolean, barChart?: boolean): void;
+export declare function commonAnnotations(chartData: TSeries[], xScale: any, yScaleLeft: any, yScaleRight: any, margin: TMargin, d3Annotation: any, labelExcludeList: string[], individualLabelColor: any[], oldAnnotationList: any[], formatOptions: TDefaultChartFormatOptionsType, chartType: string, height: number, width: number, innerWidth: number, dimensionList: string[], innerHeight: number, widgetId: string, svg: any, xScaleForLegends?: any, columnWidth?: number, isReportEditable?: boolean, isSensitivityChart?: boolean, barChart?: boolean, isAATornado?: boolean): void;
 /**
  * @param {Array} chartData - The main data used to render the chart.
  * @param {Function} xscale - D3 scale function for the x-axis.

package/dist/Components/Charts/ChartsWithAxis/ChartsWithAxisTypes.types.d.ts

@@ -53,6 +53,7 @@ export type TChartProps = {
     chartId?: string;
     formatOptions?: TDefaultChartFormatOptionsType;
     isReportEditable?: any;
+    isAdvancedAnalyticsWaterFall?: boolean;
 };
 export type TChartJSON = {
     dimensionList: string[];

package/dist/Components/Charts/Core/DefaultProperties.types.d.ts

@@ -566,6 +566,7 @@ export declare const defaultChartFormatOptions: {
         dataTableDecimalPrecision: string;
         dataTableDisplayUnits: string;
         dataTableLabelColor: commonColors;
+        dataTableAxisLabel: boolean;
     };
     dataTableOuterBorder: {
         borderButtonVisibility: boolean;

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

@@ -11443,7 +11443,8 @@ const defaultChartFormatOptions = {
     dataTableNumberFormat: ",",
     dataTableDecimalPrecision: "2",
     dataTableDisplayUnits: "None",
-    dataTableLabelColor: commonColors.black
+    dataTableLabelColor: commonColors.black,
+    dataTableAxisLabel: true
   },
   dataTableOuterBorder: {
     borderButtonVisibility: true,
@@ -11784,7 +11785,7 @@ function calculateVerticalMargins(windowWidth, windowHeight, maxNumberForPrimary
         bottom2 = xAxisRelatedMargin + 5 + scrollHeightConstant;
         break;
       case staticLegendPosition.bottom:
-        bottom2 = 40 + xAxisRelatedMargin + scrollHeightConstant;
+        bottom2 = 30 + xAxisRelatedMargin + scrollHeightConstant;
         top2 = metrics.chartTitleHeight + 5 + (isNormalizedChart ? 12 : 0);
         break;
       case staticLegendPosition.left:
@@ -12837,8 +12838,15 @@ function setChartTitle(svg, formatOptions, width, chartTitleHeight) {
     "visibility",
     formatOptions.chartTitle.chartTitleVisibility ? "visible" : "hidden"
   ).attr("transform", `translate(2,2)`).attr("class", "chartTitle").attr("width", width).attr("height", chartTitleHeight + "px");
+  const parseHTMLText = (html) => {
+    const temp = document.createElement("div");
+    temp.innerHTML = html;
+    return temp.textContent || temp.innerText || "";
+  };
+  const hasHTML = !!formatOptions.chartTitle.chartTitleHTML;
+  const titleText = hasHTML ? parseHTMLText(formatOptions.chartTitle.chartTitleHTML) : formatOptions.chartTitle.chartTitleText;
   if (formatOptions.chartTitle.dynamicTitleText.length !== 0) {
-    object2.append("xhtml:div").style("color", "rgba(119,119,119)").attr("title", formatOptions.chartTitle.chartTitleText).style("white-space", "pre").style("text-overflow", "ellipsis").html(
+    object2.append("xhtml:div").style("color", "rgba(119,119,119)").attr("title", titleText).style("white-space", "pre").style("text-overflow", "ellipsis").html(
       formatOptions.chartTitle.chartTitleHTML ? formatOptions.chartTitle.chartTitleHTML : formatOptions.chartTitle.chartTitleText
     );
   } else {
@@ -12865,7 +12873,8 @@ function getSlicedLegendForTornado(legend) {
   if (index2 == -1) return legend;
   return legend.slice(index2 + 3);
 }
-function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d3Annotation2, labelExcludeList, individualLabelColor, oldAnnotationList, formatOptions, chartType, height, width, innerWidth2, dimensionList, innerHeight2, widgetId, svg, xScaleForLegends, columnWidth, isReportEditable, isSensitivityChart, barChart) {
+const getHoverText = (d, isAATornado) => isAATornado ? d?.legend?.split(" - ")[0] : d?.properties?.alias || d?.properties?.name || "Legend";
+function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d3Annotation2, labelExcludeList, individualLabelColor, oldAnnotationList, formatOptions, chartType, height, width, innerWidth2, dimensionList, innerHeight2, widgetId, svg, xScaleForLegends, columnWidth, isReportEditable, isSensitivityChart, barChart, isAATornado) {
   try {
     const isTornadoChart = chartType === chartTypes.TornadoChart;
     let annotationType = formatOptions.annotation.annotationType ?? "1";
@@ -12905,6 +12914,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                   Legend: d.data[0].legend,
                   LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                   Labelcolor: d.properties[dataLabelColor],
+                  hoverText: getHoverText(d, isAATornado),
                   Axis: d.properties.axis
                 });
             }
@@ -12920,6 +12930,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                   Legend: d.data[d.data.length - 1].legend,
                   LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                   Labelcolor: d.properties[dataLabelColor],
+                  hoverText: getHoverText(d, isAATornado),
                   Axis: d.properties.axis
                 });
               }
@@ -12936,6 +12947,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                   Legend: d.data[0].legend,
                   LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                   Labelcolor: d.properties[dataLabelColor],
+                  hoverText: getHoverText(d, isAATornado),
                   Axis: d.properties.axis
                 });
             }
@@ -12949,6 +12961,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                   Legend: d.data[d.data.length - 1].legend,
                   LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                   Labelcolor: d.properties[dataLabelColor],
+                  hoverText: getHoverText(d, isAATornado),
                   Axis: d.properties.axis
                 });
             }
@@ -12965,6 +12978,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                     Legend: d.data[i].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
               }
@@ -12987,6 +13001,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                       Legend: d.data[i].legend,
                       LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                       Labelcolor: d.properties[dataLabelColor],
+                      hoverText: getHoverText(d, isAATornado),
                       Axis: d.properties.axis
                     });
                 }
@@ -13002,6 +13017,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                     Legend: d.data[0].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
                 break;
@@ -13013,6 +13029,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                     Legend: d.data[d.data.length - 1].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
                 break;
@@ -13024,6 +13041,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                     Legend: d.data[0].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
                 if (d.data[d.data.length - 1])
@@ -13033,6 +13051,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
                     Legend: d.data[d.data.length - 1].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
                 break;
@@ -13064,7 +13083,8 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
             position: parseInt(d.LabelPosition),
             currentLegend: d.Legend,
             //d.Legend.replaceAll(" ", "-"), need to check for this case by space replaced with -
-            isVisible: true
+            isVisible: true,
+            hoverId: d.hoverText.replace(/\s+/g, "-")
           } : {
             x: d.Dimension,
             y: { measure: d.Measure, axis: d.Axis },
@@ -13090,7 +13110,7 @@ function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d
         };
         if (barChart) {
           let requiredXScale = d.Axis === axisTypes.primary ? yScaleLeft : yScaleRight;
-          (responsiveXaxisLabel(dimensionList, innerWidth2).includes(d.Dimension) || chartType === chartTypes.TornadoChart) && !labelExcludeList.includes(d.Legend) && requiredXScale(d.Measure) <= innerWidth2 && requiredXScale(d.Measure) >= 0 ? annotationsList.push(singleAnnotation) : null;
+          (responsiveXaxisLabel(dimensionList, innerHeight2).includes(d.Dimension) || chartType === chartTypes.TornadoChart) && !labelExcludeList.includes(d.Legend) && requiredXScale(d.Measure) <= innerWidth2 && requiredXScale(d.Measure) >= 0 ? annotationsList.push(singleAnnotation) : null;
         } else {
           responsiveXaxisLabel(dimensionList, innerWidth2).includes(d.Dimension) && !labelExcludeList.includes(d.Legend) && (d.Axis == axisTypes.primary ? yScaleLeft(d.Measure) <= innerHeight2 && yScaleLeft(d.Measure) >= 0 : yScaleRight(d.Measure) <= innerHeight2 && yScaleRight(d.Measure) >= 0) ? annotationsList.push(singleAnnotation) : null;
         }
@@ -13744,7 +13764,7 @@ const dataTablePreCalculation = (formatOptions, yLabel, yTitle, seriesData, dime
     let dataTableHeight = 20;
     if (formatOptions.dataTableProperties && formatOptions.dataTableProperties.dataTable) {
       formatOptions.xAxisLabel.xAxisLabelVisibility = false;
-      let exactAvailableWidth = yLabel + yTitle - 36;
+      let exactAvailableWidth = yLabel + yTitle;
       seriesData.forEach((data, i) => {
         let tempObj = {
           "data": data.data.filter((data2) => dimensionList.includes(data2.dimension)),
@@ -13836,14 +13856,14 @@ function addDataTable(isFitChart, svg, currentTag, dataTable, colWidth, yAxis, x
     selectAll("#dataTableG" + chartId).remove();
     let tag = currentTag.append("g").attr("id", "dataTableG" + chartId);
     dataTable.forEach((data, i) => {
-      yCordinate = yCordinate + cellHeight;
+      yCordinate = yCordinate + (!formatOptions.dataTableProperties.dataTableAxisLabel && i === 0 ? 0 : cellHeight);
       cellHeight = data.properties.height;
       getLegendsAppended(tag, i, data, cellHeight);
       let parentTag = tag.append("g").attr("class", "dataTableBorder").selectAll("#scaling-svg" + chartId + " .foreignObject").data((d, pos) => data["data"]).enter().filter((d) => xAxis(d.dimension)).append("g").attr("fill", commonColors.transparent).attr(
         "transform",
         (d, index2) => `translate(${index2 === 0 ? 0 : xAxis(d.dimension) - cellWidth / 2},0)`
       );
-      if (i == 0) {
+      if (i == 0 && formatOptions.dataTableProperties.dataTableAxisLabel) {
         parentTag.append("foreignObject").attr("class", "dataTableColHeaders").attr("x", 0).attr("y", tableStartY).attr("id", (d, index2) => index2).attr("width", (d, index2) => index2 === 0 ? cellWidth + outerPadding + calWidthForSeriesNames / 2 : index2 === dimensionCount - 1 ? cellWidth + outerPadding - calWidthForSeriesNames / 2 : cellWidth).attr("height", "20px").append("xhtml:div").style("width", (d, index2) => index2 === 0 ? cellWidth + outerPadding + calWidthForSeriesNames / 2 : index2 === dimensionCount - 1 ? cellWidth + outerPadding - calWidthForSeriesNames / 2 : cellWidth).style("height", `${20}px`).style("border-width", (d, index2) => getBorderStyle(formatOptions, index2, void 0, dimensionCount, legendsCount, "width", "colHeaders")).style("border-style", (d, index2) => getBorderStyle(formatOptions, index2, void 0, dimensionCount, legendsCount, "style", "colHeaders")).style("border-color", (d, index2) => getBorderStyle(formatOptions, index2, void 0, dimensionCount, legendsCount, "color", "colHeaders")).style("text-align", "center").style("white-space", "nowrap").style("text-overflow", "ellipsis").style("overflow", "hidden").style("padding-left", "3px").style("font-size", formatOptions.dataTableProperties.dataTableFontSize + "px").style("font-family", formatOptions.dataTableProperties.dataTableFontFamily).style("font-style", fontStyle.includes("Italic") ? "Italic" : "").style(
           "text-decoration",
           fontStyle.includes("Underline") ? "Underline" : ""
@@ -14618,6 +14638,7 @@ function stacklineAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin
       let makeAnnotations = d3Annotation2.annotation();
       let connector = formatOptions.annotation.connectorType;
       let labelType = formatOptions.annotation.annotationVisibility;
+      let dataLabelColor = formatOptions?.annotation?.annotationSetLabelColor == "2" ? "color" : "labelColor";
       let fontStyle = formatOptions.annotation.annotationFontStyle;
       let connectorType = formatOptions.annotation.connectorType ? formatOptions.annotation.connectorType.toLowerCase() : "None";
       oldAnnotationList = conditionallyResetOldAnnotations(oldAnnotationList, formatOptions, chartType);
@@ -14725,7 +14746,7 @@ function stacklineAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin
             height: 15,
             width: 15
           },
-          color: d.properties.labelColor,
+          color: d.properties[dataLabelColor],
           type: annotationTypeforCharts(d3Annotation2, parseFloat(annotationType)),
           height,
           width
@@ -14863,7 +14884,7 @@ const initXaxisBar = (formatOptions, gTag, yLabel, innerHeight2, innerWidth2, xA
       formatOptions.yAxisLabel.yAxisLabelVisibility ? "visible" : "hidden"
     ).style("shape-rendering", "crispEdges").style(
       "stroke",
-      formatOptions.yAxisLabel.yAxisColorInverted
+      formatOptions.yAxisLabel.yAxisColor
     ).attr("stroke-width", formatOptions.yAxisLabel.yAxisWidth ? formatOptions.yAxisLabel.yAxisWidth : formatOptions.plotArea.plotAreaBorderThickness);
   } catch (error) {
     throw error;
@@ -14936,9 +14957,12 @@ const initYaxisBar = (formatOptions, gTag, xLabel, innerHeight2, innerWidth2, yA
       "visibility",
       formatOptions.yAxisLabel.yAxisLabelVisibility ? "visible" : formatOptions.plotArea.gridLinesVertical ? "visible" : "hidden"
     );
-    YaxisG.select(".domain").style("shape-rendering", "crispEdges").style(
+    YaxisG.select(".domain").style("shape-rendering", "crispEdges").attr(
+      "stroke-width",
+      formatOptions.xAxisLabel.xAxisWidth ?? formatOptions.plotArea.plotAreaBorderThickness
+    ).style(
       "stroke",
-      formatOptions.xAxisLabel.xAxisColorInverted
+      formatOptions.xAxisLabel.xAxisColor
     );
   } catch (e) {
     throw e;
@@ -15434,7 +15458,7 @@ function drawLegends(height, svg, maxLegendDimensions, chartTitleHeight, width,
             svg,
             seriesData,
             7,
-            height - 25,
+            height - 35,
             width - 10,
             30,
             position,
@@ -16911,10 +16935,10 @@ const ColumnChart = ({
         return yScale(0);
       }).attr("height", 0).attr("fill", data2.properties.color).attr(
         "stroke-dasharray",
-        (d) => d.stackBorderStyle === 2 ? "5,3" : "0"
-      ).attr("stroke-width", (d) => `${d.stackBorderWidth}px`).attr(
+        (d) => data2.properties.stackBorderStyle == 2 ? "5,3" : "0"
+      ).attr("stroke-width", (d) => `${data2.properties.stackBorderWidth}px`).attr(
         "stroke",
-        (d) => data2.properties.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderStyle : "none"
+        (d) => data2.properties.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderColor : "none"
       ).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr(
         "visibility",
         (d) => d.value === 0 && formatOptions.xAxisLabel.hideZeroValues ? "hidden" : "visible"
@@ -17622,9 +17646,9 @@ const CustomColumnChart = ({
     }).attr("height", (d) => {
       const yScale = data2.properties.axis === axisTypes.primary ? yScaleLeft : yScaleRight;
       return Math.abs(yScale(d.value) - yScale(0));
-    }).attr("fill", data2.properties.color).attr("stroke-dasharray", (d) => d.stackBorderStyle === 2 ? "5,3" : "0").attr("stroke-width", (d) => `${d.stackBorderWidth}px`).attr(
+    }).attr("fill", data2.properties.color).attr("stroke-dasharray", (d) => data2.properties.stackBorderStyle == 2 ? "5,3" : "0").attr("stroke-width", (d) => `${data2.properties.stackBorderWidth}px`).attr(
       "stroke",
-      (d) => data2.properties.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderStyle : "none"
+      (d) => data2.properties.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderColor : "none"
     ).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr(
       "visibility",
       (d) => d.value === 0 && formatOptions.xAxisLabel.hideZeroValues ? "hidden" : "visible"
@@ -17886,12 +17910,12 @@ const CustomColumnChart = ({
         (sdata) => sdata.legend === d.key
       );
       const props = seriesData[seriesIndex]?.properties;
-      return props?.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
+      return props?.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
     }).attr("stroke-dasharray", (d, i, nodes) => {
       const seriesIndex = Array.from(seriesData).findIndex(
         (sdata) => sdata.legend === d.key
       );
-      return seriesData[seriesIndex]?.properties.stackBorderStyle === 2 ? "5,3" : "0";
+      return seriesData[seriesIndex]?.properties.stackBorderStyle == 2 ? "5,3" : "0";
     }).attr("stroke-width", (d, i, nodes) => {
       const seriesIndex = Array.from(seriesData).findIndex(
         (sdata) => sdata.legend === d.key
@@ -18495,10 +18519,10 @@ const LayeredColumnChart = ({
         return Math.abs(yScale(d.value) - yScale(0));
       }).attr("fill", data2.properties.color).attr(
         "stroke-dasharray",
-        (d) => d.stackBorderStyle === 2 ? "5,3" : "0"
-      ).attr("stroke-width", (d) => `${d.stackBorderWidth}px`).attr(
+        (d) => data2.properties.stackBorderStyle == 2 ? "5,3" : "0"
+      ).attr("stroke-width", () => `${data2.properties.stackBorderWidth}px`).attr(
         "stroke",
-        (d) => data2.properties.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderStyle : "none"
+        () => data2.properties.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderColor : "none"
       ).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr("opacity", 0.7).attr(
         "visibility",
         (d) => d.value === 0 && formatOptions.xAxisLabel.hideZeroValues ? "hidden" : "visible"
@@ -18978,16 +19002,16 @@ const StackColumnChart = ({
       return props?.color || "gray";
     }).attr("stroke", (d, i, nodes) => {
       const { props } = getPropsForRect(nodes, i);
-      return props?.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
+      return props?.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
     }).attr("stroke-dasharray", (d, i, nodes) => {
       const { props } = getPropsForRect(nodes, i);
-      return props?.stackBorderStyle === 2 ? "5,3" : "0";
+      return props?.stackBorderStyle == 2 ? "5,3" : "0";
     }).attr("stroke-width", (d, i, nodes) => {
       const { props } = getPropsForRect(nodes, i);
       return (props?.stackBorderWidth || 0) + "px";
     }).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr("visibility", (d, i, nodes) => {
       const { props } = getPropsForRect(nodes, i);
-      return d.data[d.key] === 0 && props?.hideZeroValues ? "hidden" : "visible";
+      return d.data[d.key] == 0 && props?.hideZeroValues ? "hidden" : "visible";
     }).on("mousemove", (event2, d) => {
       showTooltipOnMouseMove(
         [
@@ -21357,7 +21381,7 @@ const LineChart = ({
       xAxis,
       dimensionHeightWidthArray,
       height,
-      barWidth,
+      innerWidth2 / xScale.length,
       isDateType,
       innerWidth2,
       innerHeight2,
@@ -22986,6 +23010,9 @@ const HorizontalBarChart = ({
     filteredDimension = fDimension;
     visibleBars = fVisibleBars;
     createTotalMeasureValueMap(data, totalValueMap, filteredDimension);
+    if (formatOptions.xAxisLabel.hideZeroValues) {
+      filteredDimension = filteredDimension.filter((d) => totalValueMap.get(d) !== 0);
+    }
     drawColumnChart();
   };
   const drawColumnChart = () => {
@@ -53976,14 +54003,15 @@ const ScatterChart = ({
 const WaterfallChart = ({
   isDateType,
   formatOptions,
-  data
+  data,
+  isAdvancedAnalyticsWaterFall = false
 }) => {
   const chartId = crypto.randomUUID?.();
   let columnWidth = 0;
   let colorScale;
   const chartType = chartTypes.WaterfallChart;
   const svgRef = useRef();
-  const isAdvancedWaterfall = Array.isArray(data) && data.length > 0 && data[0]?.hasOwnProperty("Column1") && data[0]?.hasOwnProperty("Column6");
+  const isAdvancedWaterfall = isAdvancedAnalyticsWaterFall ?? false;
   const seriesData = isAdvancedWaterfall ? [] : generalizedChartData(data.ChartData, data.DimensionList);
   const dimensionList = data.DimensionList;
   const barChart = false;
@@ -54639,13 +54667,14 @@ const WaterfallChart = ({
   };
   const toNumber = (v) => v === null || v === void 0 || v === "" ? 0 : Number(v);
   const mapAdvancedWaterfallData = (rawData) => {
-    return rawData.filter((d) => d.Column1 && d.Column1 !== "*").map((d) => ({
-      xKey: d.Column1,
-      base: toNumber(d.Column3),
-      up: toNumber(d.Column4),
-      down: toNumber(d.Column5),
-      total: toNumber(d.Column6),
-      dimensionTotal: toNumber(d.Column2)
+    const tempRawDataForAAWaterfallChart = rawData[0].Column1 == "" ? rawData.filter((d) => d.Column1 && d.Column1 !== "*") : rawData;
+    return tempRawDataForAAWaterfallChart.map((d) => ({
+      xKey: d.Column1 || (d.Dimension || d.Legend),
+      base: toNumber(d.Column3 || d.Total),
+      up: toNumber(d.Column4 || d.Up),
+      down: toNumber(d.Column5 || d.Down),
+      total: toNumber(d.Column6 || d.total),
+      dimensionTotal: toNumber(d.Column2 || d.Base)
     }));
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -55200,7 +55229,8 @@ const TornadoChart = ({
       columnWidth,
       isReportEditable,
       isAdvanceAnalyticsChart,
-      barChart
+      barChart,
+      isAdvanceAnalyticsChart
     );
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(

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

@@ -11446,7 +11446,8 @@
       dataTableNumberFormat: ",",
       dataTableDecimalPrecision: "2",
       dataTableDisplayUnits: "None",
-      dataTableLabelColor: commonColors.black
+      dataTableLabelColor: commonColors.black,
+      dataTableAxisLabel: true
     },
     dataTableOuterBorder: {
       borderButtonVisibility: true,
@@ -11787,7 +11788,7 @@
           bottom2 = xAxisRelatedMargin + 5 + scrollHeightConstant;
           break;
         case staticLegendPosition.bottom:
-          bottom2 = 40 + xAxisRelatedMargin + scrollHeightConstant;
+          bottom2 = 30 + xAxisRelatedMargin + scrollHeightConstant;
           top2 = metrics.chartTitleHeight + 5 + (isNormalizedChart ? 12 : 0);
           break;
         case staticLegendPosition.left:
@@ -12840,8 +12841,15 @@
       "visibility",
       formatOptions.chartTitle.chartTitleVisibility ? "visible" : "hidden"
     ).attr("transform", `translate(2,2)`).attr("class", "chartTitle").attr("width", width).attr("height", chartTitleHeight + "px");
+    const parseHTMLText = (html) => {
+      const temp = document.createElement("div");
+      temp.innerHTML = html;
+      return temp.textContent || temp.innerText || "";
+    };
+    const hasHTML = !!formatOptions.chartTitle.chartTitleHTML;
+    const titleText = hasHTML ? parseHTMLText(formatOptions.chartTitle.chartTitleHTML) : formatOptions.chartTitle.chartTitleText;
     if (formatOptions.chartTitle.dynamicTitleText.length !== 0) {
-      object2.append("xhtml:div").style("color", "rgba(119,119,119)").attr("title", formatOptions.chartTitle.chartTitleText).style("white-space", "pre").style("text-overflow", "ellipsis").html(
+      object2.append("xhtml:div").style("color", "rgba(119,119,119)").attr("title", titleText).style("white-space", "pre").style("text-overflow", "ellipsis").html(
         formatOptions.chartTitle.chartTitleHTML ? formatOptions.chartTitle.chartTitleHTML : formatOptions.chartTitle.chartTitleText
       );
     } else {
@@ -12868,7 +12876,8 @@
     if (index2 == -1) return legend;
     return legend.slice(index2 + 3);
   }
-  function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d3Annotation2, labelExcludeList, individualLabelColor, oldAnnotationList, formatOptions, chartType, height, width, innerWidth2, dimensionList, innerHeight2, widgetId, svg, xScaleForLegends, columnWidth, isReportEditable, isSensitivityChart, barChart) {
+  const getHoverText = (d, isAATornado) => isAATornado ? d?.legend?.split(" - ")[0] : d?.properties?.alias || d?.properties?.name || "Legend";
+  function commonAnnotations(chartData, xScale, yScaleLeft, yScaleRight, margin, d3Annotation2, labelExcludeList, individualLabelColor, oldAnnotationList, formatOptions, chartType, height, width, innerWidth2, dimensionList, innerHeight2, widgetId, svg, xScaleForLegends, columnWidth, isReportEditable, isSensitivityChart, barChart, isAATornado) {
     try {
       const isTornadoChart = chartType === chartTypes.TornadoChart;
       let annotationType = formatOptions.annotation.annotationType ?? "1";
@@ -12908,6 +12917,7 @@
                     Legend: d.data[0].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
               }
@@ -12923,6 +12933,7 @@
                     Legend: d.data[d.data.length - 1].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
                 }
@@ -12939,6 +12950,7 @@
                     Legend: d.data[0].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
               }
@@ -12952,6 +12964,7 @@
                     Legend: d.data[d.data.length - 1].legend,
                     LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                     Labelcolor: d.properties[dataLabelColor],
+                    hoverText: getHoverText(d, isAATornado),
                     Axis: d.properties.axis
                   });
               }
@@ -12968,6 +12981,7 @@
                       Legend: d.data[i].legend,
                       LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                       Labelcolor: d.properties[dataLabelColor],
+                      hoverText: getHoverText(d, isAATornado),
                       Axis: d.properties.axis
                     });
                 }
@@ -12990,6 +13004,7 @@
                         Legend: d.data[i].legend,
                         LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                         Labelcolor: d.properties[dataLabelColor],
+                        hoverText: getHoverText(d, isAATornado),
                         Axis: d.properties.axis
                       });
                   }
@@ -13005,6 +13020,7 @@
                       Legend: d.data[0].legend,
                       LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                       Labelcolor: d.properties[dataLabelColor],
+                      hoverText: getHoverText(d, isAATornado),
                       Axis: d.properties.axis
                     });
                   break;
@@ -13016,6 +13032,7 @@
                       Legend: d.data[d.data.length - 1].legend,
                       LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                       Labelcolor: d.properties[dataLabelColor],
+                      hoverText: getHoverText(d, isAATornado),
                       Axis: d.properties.axis
                     });
                   break;
@@ -13027,6 +13044,7 @@
                       Legend: d.data[0].legend,
                       LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                       Labelcolor: d.properties[dataLabelColor],
+                      hoverText: getHoverText(d, isAATornado),
                       Axis: d.properties.axis
                     });
                   if (d.data[d.data.length - 1])
@@ -13036,6 +13054,7 @@
                       Legend: d.data[d.data.length - 1].legend,
                       LabelPosition: annotationPosition ? annotationPosition : d.properties.annotationPosition,
                       Labelcolor: d.properties[dataLabelColor],
+                      hoverText: getHoverText(d, isAATornado),
                       Axis: d.properties.axis
                     });
                   break;
@@ -13067,7 +13086,8 @@
               position: parseInt(d.LabelPosition),
               currentLegend: d.Legend,
               //d.Legend.replaceAll(" ", "-"), need to check for this case by space replaced with -
-              isVisible: true
+              isVisible: true,
+              hoverId: d.hoverText.replace(/\s+/g, "-")
             } : {
               x: d.Dimension,
               y: { measure: d.Measure, axis: d.Axis },
@@ -13093,7 +13113,7 @@
           };
           if (barChart) {
             let requiredXScale = d.Axis === axisTypes.primary ? yScaleLeft : yScaleRight;
-            (responsiveXaxisLabel(dimensionList, innerWidth2).includes(d.Dimension) || chartType === chartTypes.TornadoChart) && !labelExcludeList.includes(d.Legend) && requiredXScale(d.Measure) <= innerWidth2 && requiredXScale(d.Measure) >= 0 ? annotationsList.push(singleAnnotation) : null;
+            (responsiveXaxisLabel(dimensionList, innerHeight2).includes(d.Dimension) || chartType === chartTypes.TornadoChart) && !labelExcludeList.includes(d.Legend) && requiredXScale(d.Measure) <= innerWidth2 && requiredXScale(d.Measure) >= 0 ? annotationsList.push(singleAnnotation) : null;
           } else {
             responsiveXaxisLabel(dimensionList, innerWidth2).includes(d.Dimension) && !labelExcludeList.includes(d.Legend) && (d.Axis == axisTypes.primary ? yScaleLeft(d.Measure) <= innerHeight2 && yScaleLeft(d.Measure) >= 0 : yScaleRight(d.Measure) <= innerHeight2 && yScaleRight(d.Measure) >= 0) ? annotationsList.push(singleAnnotation) : null;
           }
@@ -13747,7 +13767,7 @@
       let dataTableHeight = 20;
       if (formatOptions.dataTableProperties && formatOptions.dataTableProperties.dataTable) {
         formatOptions.xAxisLabel.xAxisLabelVisibility = false;
-        let exactAvailableWidth = yLabel + yTitle - 36;
+        let exactAvailableWidth = yLabel + yTitle;
         seriesData.forEach((data, i) => {
           let tempObj = {
             "data": data.data.filter((data2) => dimensionList.includes(data2.dimension)),
@@ -13839,14 +13859,14 @@
       selectAll("#dataTableG" + chartId).remove();
       let tag = currentTag.append("g").attr("id", "dataTableG" + chartId);
       dataTable.forEach((data, i) => {
-        yCordinate = yCordinate + cellHeight;
+        yCordinate = yCordinate + (!formatOptions.dataTableProperties.dataTableAxisLabel && i === 0 ? 0 : cellHeight);
         cellHeight = data.properties.height;
         getLegendsAppended(tag, i, data, cellHeight);
         let parentTag = tag.append("g").attr("class", "dataTableBorder").selectAll("#scaling-svg" + chartId + " .foreignObject").data((d, pos) => data["data"]).enter().filter((d) => xAxis(d.dimension)).append("g").attr("fill", commonColors.transparent).attr(
           "transform",
           (d, index2) => `translate(${index2 === 0 ? 0 : xAxis(d.dimension) - cellWidth / 2},0)`
         );
-        if (i == 0) {
+        if (i == 0 && formatOptions.dataTableProperties.dataTableAxisLabel) {
           parentTag.append("foreignObject").attr("class", "dataTableColHeaders").attr("x", 0).attr("y", tableStartY).attr("id", (d, index2) => index2).attr("width", (d, index2) => index2 === 0 ? cellWidth + outerPadding + calWidthForSeriesNames / 2 : index2 === dimensionCount - 1 ? cellWidth + outerPadding - calWidthForSeriesNames / 2 : cellWidth).attr("height", "20px").append("xhtml:div").style("width", (d, index2) => index2 === 0 ? cellWidth + outerPadding + calWidthForSeriesNames / 2 : index2 === dimensionCount - 1 ? cellWidth + outerPadding - calWidthForSeriesNames / 2 : cellWidth).style("height", `${20}px`).style("border-width", (d, index2) => getBorderStyle(formatOptions, index2, void 0, dimensionCount, legendsCount, "width", "colHeaders")).style("border-style", (d, index2) => getBorderStyle(formatOptions, index2, void 0, dimensionCount, legendsCount, "style", "colHeaders")).style("border-color", (d, index2) => getBorderStyle(formatOptions, index2, void 0, dimensionCount, legendsCount, "color", "colHeaders")).style("text-align", "center").style("white-space", "nowrap").style("text-overflow", "ellipsis").style("overflow", "hidden").style("padding-left", "3px").style("font-size", formatOptions.dataTableProperties.dataTableFontSize + "px").style("font-family", formatOptions.dataTableProperties.dataTableFontFamily).style("font-style", fontStyle.includes("Italic") ? "Italic" : "").style(
             "text-decoration",
             fontStyle.includes("Underline") ? "Underline" : ""
@@ -14621,6 +14641,7 @@
         let makeAnnotations = d3Annotation2.annotation();
         let connector = formatOptions.annotation.connectorType;
         let labelType = formatOptions.annotation.annotationVisibility;
+        let dataLabelColor = formatOptions?.annotation?.annotationSetLabelColor == "2" ? "color" : "labelColor";
         let fontStyle = formatOptions.annotation.annotationFontStyle;
         let connectorType = formatOptions.annotation.connectorType ? formatOptions.annotation.connectorType.toLowerCase() : "None";
         oldAnnotationList = conditionallyResetOldAnnotations(oldAnnotationList, formatOptions, chartType);
@@ -14728,7 +14749,7 @@
               height: 15,
               width: 15
             },
-            color: d.properties.labelColor,
+            color: d.properties[dataLabelColor],
             type: annotationTypeforCharts(d3Annotation2, parseFloat(annotationType)),
             height,
             width
@@ -14866,7 +14887,7 @@
         formatOptions.yAxisLabel.yAxisLabelVisibility ? "visible" : "hidden"
       ).style("shape-rendering", "crispEdges").style(
         "stroke",
-        formatOptions.yAxisLabel.yAxisColorInverted
+        formatOptions.yAxisLabel.yAxisColor
       ).attr("stroke-width", formatOptions.yAxisLabel.yAxisWidth ? formatOptions.yAxisLabel.yAxisWidth : formatOptions.plotArea.plotAreaBorderThickness);
     } catch (error) {
       throw error;
@@ -14939,9 +14960,12 @@
         "visibility",
         formatOptions.yAxisLabel.yAxisLabelVisibility ? "visible" : formatOptions.plotArea.gridLinesVertical ? "visible" : "hidden"
       );
-      YaxisG.select(".domain").style("shape-rendering", "crispEdges").style(
+      YaxisG.select(".domain").style("shape-rendering", "crispEdges").attr(
+        "stroke-width",
+        formatOptions.xAxisLabel.xAxisWidth ?? formatOptions.plotArea.plotAreaBorderThickness
+      ).style(
         "stroke",
-        formatOptions.xAxisLabel.xAxisColorInverted
+        formatOptions.xAxisLabel.xAxisColor
       );
     } catch (e) {
       throw e;
@@ -15437,7 +15461,7 @@
               svg,
               seriesData,
               7,
-              height - 25,
+              height - 35,
               width - 10,
               30,
               position,
@@ -16914,10 +16938,10 @@
           return yScale(0);
         }).attr("height", 0).attr("fill", data2.properties.color).attr(
           "stroke-dasharray",
-          (d) => d.stackBorderStyle === 2 ? "5,3" : "0"
-        ).attr("stroke-width", (d) => `${d.stackBorderWidth}px`).attr(
+          (d) => data2.properties.stackBorderStyle == 2 ? "5,3" : "0"
+        ).attr("stroke-width", (d) => `${data2.properties.stackBorderWidth}px`).attr(
           "stroke",
-          (d) => data2.properties.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderStyle : "none"
+          (d) => data2.properties.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderColor : "none"
         ).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr(
           "visibility",
           (d) => d.value === 0 && formatOptions.xAxisLabel.hideZeroValues ? "hidden" : "visible"
@@ -17625,9 +17649,9 @@
       }).attr("height", (d) => {
         const yScale = data2.properties.axis === axisTypes.primary ? yScaleLeft : yScaleRight;
         return Math.abs(yScale(d.value) - yScale(0));
-      }).attr("fill", data2.properties.color).attr("stroke-dasharray", (d) => d.stackBorderStyle === 2 ? "5,3" : "0").attr("stroke-width", (d) => `${d.stackBorderWidth}px`).attr(
+      }).attr("fill", data2.properties.color).attr("stroke-dasharray", (d) => data2.properties.stackBorderStyle == 2 ? "5,3" : "0").attr("stroke-width", (d) => `${data2.properties.stackBorderWidth}px`).attr(
         "stroke",
-        (d) => data2.properties.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderStyle : "none"
+        (d) => data2.properties.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderColor : "none"
       ).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr(
         "visibility",
         (d) => d.value === 0 && formatOptions.xAxisLabel.hideZeroValues ? "hidden" : "visible"
@@ -17889,12 +17913,12 @@
           (sdata) => sdata.legend === d.key
         );
         const props = seriesData[seriesIndex]?.properties;
-        return props?.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
+        return props?.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
       }).attr("stroke-dasharray", (d, i, nodes) => {
         const seriesIndex = Array.from(seriesData).findIndex(
           (sdata) => sdata.legend === d.key
         );
-        return seriesData[seriesIndex]?.properties.stackBorderStyle === 2 ? "5,3" : "0";
+        return seriesData[seriesIndex]?.properties.stackBorderStyle == 2 ? "5,3" : "0";
       }).attr("stroke-width", (d, i, nodes) => {
         const seriesIndex = Array.from(seriesData).findIndex(
           (sdata) => sdata.legend === d.key
@@ -18498,10 +18522,10 @@
           return Math.abs(yScale(d.value) - yScale(0));
         }).attr("fill", data2.properties.color).attr(
           "stroke-dasharray",
-          (d) => d.stackBorderStyle === 2 ? "5,3" : "0"
-        ).attr("stroke-width", (d) => `${d.stackBorderWidth}px`).attr(
+          (d) => data2.properties.stackBorderStyle == 2 ? "5,3" : "0"
+        ).attr("stroke-width", () => `${data2.properties.stackBorderWidth}px`).attr(
           "stroke",
-          (d) => data2.properties.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderStyle : "none"
+          () => data2.properties.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? data2.properties.stackBorderColor : "none"
         ).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr("opacity", 0.7).attr(
           "visibility",
           (d) => d.value === 0 && formatOptions.xAxisLabel.hideZeroValues ? "hidden" : "visible"
@@ -18981,16 +19005,16 @@
         return props?.color || "gray";
       }).attr("stroke", (d, i, nodes) => {
         const { props } = getPropsForRect(nodes, i);
-        return props?.stackBorderStyle === 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
+        return props?.stackBorderStyle == 0 ? "none" : formatOptions.column.stackBorderVisibility ? props.stackBorderColor : "none";
       }).attr("stroke-dasharray", (d, i, nodes) => {
         const { props } = getPropsForRect(nodes, i);
-        return props?.stackBorderStyle === 2 ? "5,3" : "0";
+        return props?.stackBorderStyle == 2 ? "5,3" : "0";
       }).attr("stroke-width", (d, i, nodes) => {
         const { props } = getPropsForRect(nodes, i);
         return (props?.stackBorderWidth || 0) + "px";
       }).style("clip-path", "inset(0px) fill-box").style("shape-rendering", "crispEdges").attr("visibility", (d, i, nodes) => {
         const { props } = getPropsForRect(nodes, i);
-        return d.data[d.key] === 0 && props?.hideZeroValues ? "hidden" : "visible";
+        return d.data[d.key] == 0 && props?.hideZeroValues ? "hidden" : "visible";
       }).on("mousemove", (event2, d) => {
         showTooltipOnMouseMove(
           [
@@ -21360,7 +21384,7 @@
         xAxis,
         dimensionHeightWidthArray,
         height,
-        barWidth,
+        innerWidth2 / xScale.length,
         isDateType,
         innerWidth2,
         innerHeight2,
@@ -22989,6 +23013,9 @@
       filteredDimension = fDimension;
       visibleBars = fVisibleBars;
       createTotalMeasureValueMap(data, totalValueMap, filteredDimension);
+      if (formatOptions.xAxisLabel.hideZeroValues) {
+        filteredDimension = filteredDimension.filter((d) => totalValueMap.get(d) !== 0);
+      }
       drawColumnChart();
     };
     const drawColumnChart = () => {
@@ -53979,14 +54006,15 @@
   const WaterfallChart = ({
     isDateType,
     formatOptions,
-    data
+    data,
+    isAdvancedAnalyticsWaterFall = false
   }) => {
     const chartId = crypto.randomUUID?.();
     let columnWidth = 0;
     let colorScale;
     const chartType = chartTypes.WaterfallChart;
     const svgRef = require$$0$1.useRef();
-    const isAdvancedWaterfall = Array.isArray(data) && data.length > 0 && data[0]?.hasOwnProperty("Column1") && data[0]?.hasOwnProperty("Column6");
+    const isAdvancedWaterfall = isAdvancedAnalyticsWaterFall ?? false;
     const seriesData = isAdvancedWaterfall ? [] : generalizedChartData(data.ChartData, data.DimensionList);
     const dimensionList = data.DimensionList;
     const barChart = false;
@@ -54642,13 +54670,14 @@
     };
     const toNumber = (v) => v === null || v === void 0 || v === "" ? 0 : Number(v);
     const mapAdvancedWaterfallData = (rawData) => {
-      return rawData.filter((d) => d.Column1 && d.Column1 !== "*").map((d) => ({
-        xKey: d.Column1,
-        base: toNumber(d.Column3),
-        up: toNumber(d.Column4),
-        down: toNumber(d.Column5),
-        total: toNumber(d.Column6),
-        dimensionTotal: toNumber(d.Column2)
+      const tempRawDataForAAWaterfallChart = rawData[0].Column1 == "" ? rawData.filter((d) => d.Column1 && d.Column1 !== "*") : rawData;
+      return tempRawDataForAAWaterfallChart.map((d) => ({
+        xKey: d.Column1 || (d.Dimension || d.Legend),
+        base: toNumber(d.Column3 || d.Total),
+        up: toNumber(d.Column4 || d.Up),
+        down: toNumber(d.Column5 || d.Down),
+        total: toNumber(d.Column6 || d.total),
+        dimensionTotal: toNumber(d.Column2 || d.Base)
       }));
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -55203,7 +55232,8 @@
         columnWidth,
         isReportEditable,
         isAdvanceAnalyticsChart,
-        barChart
+        barChart,
+        isAdvanceAnalyticsChart
       );
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { width: "100%", height: "100%" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pace-chart-lib",
-  "version": "1.0.29",
+  "version": "1.0.31",
   "description": "A simple React + Vite + TS UI library with a Button using custom fonts via SCSS.",
   "license": "MIT",
   "type": "module",