@fluentui/react-charts 9.2.2 → 9.2.4

package/lib/components/CommonComponents/CartesianChart.js

@@ -38,10 +38,12 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
     const [containerHeight, setContainerHeight] = React.useState(0);
     const [startFromX, setStartFromX] = React.useState(0);
     const [prevProps, setPrevProps] = React.useState(null);
-    const chartTypesToCheck = [
+    const chartTypesWithStringYAxis = [
         ChartTypes.HorizontalBarChartWithAxis,
         ChartTypes.HeatMapChart,
-        ChartTypes.GanttChart
+        ChartTypes.VerticalStackedBarChart,
+        ChartTypes.GanttChart,
+        ChartTypes.ScatterChart
     ];
     var _props_margins_top, _props_margins_bottom, _props_margins_left, _props_margins_right, _props_margins_right1, _props_margins_left1;
     /**
@@ -56,17 +58,35 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
         right: _useRtl ? (_props_margins_left = (_props_margins2 = props.margins) === null || _props_margins2 === void 0 ? void 0 : _props_margins2.left) !== null && _props_margins_left !== void 0 ? _props_margins_left : 40 : ((_props_margins_right = (_props_margins3 = props.margins) === null || _props_margins3 === void 0 ? void 0 : _props_margins3.right) !== null && _props_margins_right !== void 0 ? _props_margins_right : props === null || props === void 0 ? void 0 : props.secondaryYScaleOptions) ? 40 : 20,
         left: _useRtl ? ((_props_margins_right1 = (_props_margins4 = props.margins) === null || _props_margins4 === void 0 ? void 0 : _props_margins4.right) !== null && _props_margins_right1 !== void 0 ? _props_margins_right1 : props === null || props === void 0 ? void 0 : props.secondaryYScaleOptions) ? 40 : 20 : (_props_margins_left1 = (_props_margins5 = props.margins) === null || _props_margins5 === void 0 ? void 0 : _props_margins5.left) !== null && _props_margins_left1 !== void 0 ? _props_margins_left1 : 40
     };
+    const TITLE_MARGIN_HORIZONTAL = 24;
+    const TITLE_MARGIN_VERTICAL = 20;
     if (props.xAxisTitle !== undefined && props.xAxisTitle !== '') {
         var _props_margins6;
         var _props_margins_bottom1;
-        margins.bottom = (_props_margins_bottom1 = (_props_margins6 = props.margins) === null || _props_margins6 === void 0 ? void 0 : _props_margins6.bottom) !== null && _props_margins_bottom1 !== void 0 ? _props_margins_bottom1 : 55;
+        margins.bottom = (_props_margins_bottom1 = (_props_margins6 = props.margins) === null || _props_margins6 === void 0 ? void 0 : _props_margins6.bottom) !== null && _props_margins_bottom1 !== void 0 ? _props_margins_bottom1 : margins.bottom + TITLE_MARGIN_VERTICAL;
     }
     if (props.yAxisTitle !== undefined && props.yAxisTitle !== '') {
         var _props_margins7, _props_margins8, _props_margins9, _props_margins10;
         var _props_margins_right2, _props_margins_left2;
-        margins.left = _useRtl ? ((_props_margins_right2 = (_props_margins7 = props.margins) === null || _props_margins7 === void 0 ? void 0 : _props_margins7.right) !== null && _props_margins_right2 !== void 0 ? _props_margins_right2 : props === null || props === void 0 ? void 0 : props.secondaryYAxistitle) ? 80 : 40 : (_props_margins_left2 = (_props_margins8 = props.margins) === null || _props_margins8 === void 0 ? void 0 : _props_margins8.left) !== null && _props_margins_left2 !== void 0 ? _props_margins_left2 : 60;
+        margins.left = _useRtl ? ((_props_margins_right2 = (_props_margins7 = props.margins) === null || _props_margins7 === void 0 ? void 0 : _props_margins7.right) !== null && _props_margins_right2 !== void 0 ? _props_margins_right2 : props === null || props === void 0 ? void 0 : props.secondaryYAxistitle) ? margins.right + 2 * TITLE_MARGIN_HORIZONTAL : margins.right + TITLE_MARGIN_HORIZONTAL : (_props_margins_left2 = (_props_margins8 = props.margins) === null || _props_margins8 === void 0 ? void 0 : _props_margins8.left) !== null && _props_margins_left2 !== void 0 ? _props_margins_left2 : margins.left + TITLE_MARGIN_HORIZONTAL;
         var _props_margins_left3, _props_margins_right3;
-        margins.right = _useRtl ? (_props_margins_left3 = (_props_margins9 = props.margins) === null || _props_margins9 === void 0 ? void 0 : _props_margins9.left) !== null && _props_margins_left3 !== void 0 ? _props_margins_left3 : 60 : ((_props_margins_right3 = (_props_margins10 = props.margins) === null || _props_margins10 === void 0 ? void 0 : _props_margins10.right) !== null && _props_margins_right3 !== void 0 ? _props_margins_right3 : props === null || props === void 0 ? void 0 : props.secondaryYAxistitle) ? 80 : 40;
+        margins.right = _useRtl ? (_props_margins_left3 = (_props_margins9 = props.margins) === null || _props_margins9 === void 0 ? void 0 : _props_margins9.left) !== null && _props_margins_left3 !== void 0 ? _props_margins_left3 : margins.left + TITLE_MARGIN_HORIZONTAL : ((_props_margins_right3 = (_props_margins10 = props.margins) === null || _props_margins10 === void 0 ? void 0 : _props_margins10.right) !== null && _props_margins_right3 !== void 0 ? _props_margins_right3 : props === null || props === void 0 ? void 0 : props.secondaryYAxistitle) ? margins.right + 2 * TITLE_MARGIN_HORIZONTAL : margins.right + TITLE_MARGIN_HORIZONTAL;
+    }
+    if (props.xAxisAnnotation !== undefined && props.xAxisAnnotation !== '') {
+        var _props_margins11;
+        var _props_margins_top1;
+        margins.top = (_props_margins_top1 = (_props_margins11 = props.margins) === null || _props_margins11 === void 0 ? void 0 : _props_margins11.top) !== null && _props_margins_top1 !== void 0 ? _props_margins_top1 : margins.top + TITLE_MARGIN_VERTICAL;
+    }
+    if (props.yAxisAnnotation !== undefined && props.yAxisAnnotation !== '' && (props.secondaryYAxistitle === undefined || props.secondaryYAxistitle === '')) {
+        if (_useRtl) {
+            var _props_margins12;
+            var _props_margins_right4;
+            margins.left = (_props_margins_right4 = (_props_margins12 = props.margins) === null || _props_margins12 === void 0 ? void 0 : _props_margins12.right) !== null && _props_margins_right4 !== void 0 ? _props_margins_right4 : margins.right + TITLE_MARGIN_HORIZONTAL;
+        } else {
+            var _props_margins13;
+            var _props_margins_right5;
+            margins.right = (_props_margins_right5 = (_props_margins13 = props.margins) === null || _props_margins13 === void 0 ? void 0 : _props_margins13.right) !== null && _props_margins_right5 !== void 0 ? _props_margins_right5 : margins.right + TITLE_MARGIN_HORIZONTAL;
+        }
     }
     const classes = useCartesianChartStyles(props);
     const focusAttributes = useFocusableGroup();
@@ -79,8 +99,8 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
         if (props !== null) {
             setPrevProps(props);
         }
-        if (chartTypesToCheck.includes(props.chartType) && props.showYAxisLables && yAxisElement) {
-            const maxYAxisLabelLength = calculateMaxYAxisLabelLength(props.chartType, props.points, classes.yAxis);
+        if (chartTypesWithStringYAxis.includes(props.chartType) && props.showYAxisLables && yAxisElement && props.yAxisType === YAxisType.StringAxis) {
+            const maxYAxisLabelLength = calculateMaxYAxisLabelLength(classes.yAxis);
             if (startFromX !== maxYAxisLabelLength) {
                 setStartFromX(maxYAxisLabelLength);
             }
@@ -102,8 +122,8 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
                 _fitParentContainer();
             }
         }
-        if (chartTypesToCheck.includes(props.chartType) && props.showYAxisLables && yAxisElement) {
-            const maxYAxisLabelLength = calculateMaxYAxisLabelLength(props.chartType, props.points, classes.yAxis);
+        if (chartTypesWithStringYAxis.includes(props.chartType) && props.showYAxisLables && yAxisElement && props.yAxisType === YAxisType.StringAxis) {
+            const maxYAxisLabelLength = calculateMaxYAxisLabelLength(classes.yAxis);
             if (startFromX !== maxYAxisLabelLength) {
                 setStartFromX(maxYAxisLabelLength);
             }
@@ -134,20 +154,14 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
     function _generateCallout(calloutProps) {
         return /*#__PURE__*/ React.createElement(ChartPopover, calloutProps);
     }
-    function calculateMaxYAxisLabelLength(chartType, // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    points, className) {
+    function calculateMaxYAxisLabelLength(className) {
         const formatTickLabel = (str)=>{
             if (props.showYAxisLablesTooltip) {
                 return truncateString(str, props.noOfCharsToTruncate || 4);
             }
             return str;
         };
-        if (chartType === ChartTypes.HeatMapChart) {
-            var _points__data, _points_;
-            return calculateLongestLabelWidth((_points_ = points[0]) === null || _points_ === void 0 ? void 0 : (_points__data = _points_.data) === null || _points__data === void 0 ? void 0 : _points__data.map((point)=>formatTickLabel(`${point.y}`)), `.${className} text`);
-        } else {
-            return calculateLongestLabelWidth(points === null || points === void 0 ? void 0 : points.map((point)=>formatTickLabel(`${point.y}`)), `.${className} text`);
-        }
+        return calculateLongestLabelWidth(props.stringDatasetForYAxisDomain.map((label)=>formatTickLabel(label)), `.${className} text`);
     }
     const { calloutProps, points, chartType, svgProps, culture, dateLocalizeOptions, timeFormatLocale, customDateTimeFormatter } = props;
     if (props.parentRef) {
@@ -156,7 +170,8 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
     const margin = {
         ...margins
     };
-    if (chartTypesToCheck.includes(props.chartType)) {
+    // Note: This check is unnecessary since startFromX is only set for charts with string y-axis.
+    if (chartTypesWithStringYAxis.includes(props.chartType)) {
         if (!_useRtl) {
             margin.left += startFromX;
         } else {
@@ -168,6 +183,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
     let callout = null;
     let children = null;
     if (props.enableFirstRenderOptimization && chartContainer.current || !props.enableFirstRenderOptimization) {
+        var _props_xAxis, _props_xAxis1, _props_yAxis, _props_yAxis1;
         _isFirstRender.current = false;
         var _props_showRoundOffXTickValues;
         const XAxisParams = {
@@ -191,7 +207,9 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
             xAxisOuterPadding: props.xAxisOuterPadding,
             containerWidth: containerWidth,
             hideTickOverlap: props.rotateXAxisLables ? false : props.hideTickOverlap,
-            calcMaxLabelWidth: _calcMaxLabelWidthWithTransform
+            calcMaxLabelWidth: _calcMaxLabelWidthWithTransform,
+            tickStep: (_props_xAxis = props.xAxis) === null || _props_xAxis === void 0 ? void 0 : _props_xAxis.tickStep,
+            tick0: (_props_xAxis1 = props.xAxis) === null || _props_xAxis1 === void 0 ? void 0 : _props_xAxis1.tick0
         };
         /**
      * These scales used for 2 purposes.
@@ -203,7 +221,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
         let tickValues;
         switch(props.xAxisType){
             case XAxisTypes.NumericAxis:
-                ({ xScale, tickValues } = createNumericXAxis(XAxisParams, props.tickParams, props.chartType, culture));
+                ({ xScale, tickValues } = createNumericXAxis(XAxisParams, props.tickParams, props.chartType, culture, props.xScaleType));
                 break;
             case XAxisTypes.DateAxis:
                 ({ xScale, tickValues } = createDateXAxis(XAxisParams, props.tickParams, culture, dateLocalizeOptions, timeFormatLocale, customDateTimeFormatter, props.useUTC, props.chartType));
@@ -212,7 +230,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
                 ({ xScale, tickValues } = createStringXAxis(XAxisParams, props.tickParams, props.datasetForXAxisDomain, culture));
                 break;
             default:
-                ({ xScale, tickValues } = createNumericXAxis(XAxisParams, props.tickParams, props.chartType, culture));
+                ({ xScale, tickValues } = createNumericXAxis(XAxisParams, props.tickParams, props.chartType, culture, props.xScaleType));
         }
         _xScale = xScale;
         _tickValues = tickValues;
@@ -232,7 +250,10 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
             // please note these padding default values must be consistent in here
             // and the parent chart(HBWA/Vertical etc..) for more details refer example
             // http://using-d3js.com/04_07_ordinal_scales.html
-            yAxisPadding: props.yAxisPadding || 0
+            yAxisPadding: props.yAxisPadding || 0,
+            tickValues: props.yAxisTickValues,
+            tickStep: (_props_yAxis = props.yAxis) === null || _props_yAxis === void 0 ? void 0 : _props_yAxis.tickStep,
+            tick0: (_props_yAxis1 = props.yAxis) === null || _props_yAxis1 === void 0 ? void 0 : _props_yAxis1.tick0
         };
         /**
      * These scales used for 2 purposes.
@@ -247,7 +268,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
             yAxisDomainValues: []
         };
         if (props.yAxisType && props.yAxisType === YAxisType.StringAxis) {
-            yScalePrimary = props.createStringYAxis(YAxisParams, props.stringDatasetForYAxisDomain, _useRtl, props.barwidth);
+            yScalePrimary = props.createStringYAxis(YAxisParams, props.stringDatasetForYAxisDomain, _useRtl, props.barwidth, props.chartType);
         } else {
             // TODO: Since the scale domain values are now computed independently for both the primary and
             // secondary y-axes, the yMinValue and yMaxValue props are no longer necessary for accurately
@@ -270,11 +291,11 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
                     yMinMaxValues: props.getMinMaxOfYAxis(points, props.yAxisType, true),
                     yAxisPadding: props.yAxisPadding
                 };
-                yScaleSecondary = props.createYAxis(YAxisParamsSecondary, _useRtl, axisData, isIntegralDataset, chartType, true, props.roundedTicks);
+                yScaleSecondary = props.createYAxis(YAxisParamsSecondary, _useRtl, axisData, isIntegralDataset, chartType, true, props.roundedTicks, props.secondaryYScaleType);
             }
-            yScalePrimary = props.createYAxis(YAxisParams, _useRtl, axisData, isIntegralDataset, chartType, false, props.roundedTicks);
+            yScalePrimary = props.createYAxis(YAxisParams, _useRtl, axisData, isIntegralDataset, chartType, false, props.roundedTicks, props.yScaleType);
         }
-        if (chartTypesToCheck.includes(props.chartType)) {
+        if (chartTypesWithStringYAxis.includes(props.chartType) && props.yAxisType === YAxisType.StringAxis) {
             // Removing un wanted tooltip div from DOM, when prop not provided, for proper cleanup
             // of unwanted DOM elements, to prevent flacky behaviour in tooltips , that might occur
             // in creating tooltips when tooltips are enabled( as we try to recreate a tspan with _tooltipId)
@@ -329,6 +350,12 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
     };
     const xAxisTitleMaximumAllowedWidth = svgDimensions.width - margins.left - margins.right - startFromX;
     const yAxisTitleMaximumAllowedHeight = svgDimensions.height - margins.bottom - margins.top - _removalValueForTextTuncate - titleMargin;
+    const commonSvgToolTipProps = {
+        wrapContent,
+        showBackground: true,
+        className: classes.svgTooltip,
+        content: ''
+    };
     /**
    * When screen resizes, along with screen, chart also auto adjusted.
    * This method used to adjust height and width of the charts.
@@ -488,6 +515,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
         transform: `translate(0, ${svgDimensions.height - margins.bottom - _removalValueForTextTuncate})`,
         className: classes.xAxis
     }), props.xAxisTitle !== undefined && props.xAxisTitle !== '' && /*#__PURE__*/ React.createElement(SVGTooltipText, {
+        ...commonSvgToolTipProps,
         content: props.xAxisTitle,
         textProps: {
             x: margins.left + startFromX + xAxisTitleMaximumAllowedWidth / 2,
@@ -495,10 +523,18 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
             className: classes.axisTitle,
             textAnchor: 'middle'
         },
-        maxWidth: xAxisTitleMaximumAllowedWidth,
-        wrapContent: wrapContent,
-        showBackground: true,
-        className: classes.svgTooltip
+        maxWidth: xAxisTitleMaximumAllowedWidth
+    }), props.xAxisAnnotation !== undefined && props.xAxisAnnotation !== '' && /*#__PURE__*/ React.createElement(SVGTooltipText, {
+        ...commonSvgToolTipProps,
+        content: props.xAxisAnnotation,
+        textProps: {
+            x: margins.left + startFromX + xAxisTitleMaximumAllowedWidth / 2,
+            y: titleMargin + 3,
+            className: classes.axisAnnotation,
+            textAnchor: 'middle',
+            'aria-hidden': true
+        },
+        maxWidth: xAxisTitleMaximumAllowedWidth
     }), /*#__PURE__*/ React.createElement("g", {
         ref: (e)=>{
             yAxisElement.current = e;
@@ -514,6 +550,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
         transform: `translate(${_useRtl ? margins.left + startFromX : svgDimensions.width - margins.right - startFromX}, 0)`,
         className: classes.yAxis
     }), props.secondaryYAxistitle !== undefined && props.secondaryYAxistitle !== '' && /*#__PURE__*/ React.createElement(SVGTooltipText, {
+        ...commonSvgToolTipProps,
         content: props.secondaryYAxistitle,
         textProps: {
             x: (yAxisTitleMaximumAllowedHeight - margins.bottom) / 2 + _removalValueForTextTuncate,
@@ -523,11 +560,9 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
                  ${svgDimensions.height - margins.bottom - margins.top - titleMargin})rotate(-90)`,
             className: classes.axisTitle
         },
-        maxWidth: yAxisTitleMaximumAllowedHeight,
-        wrapContent: wrapContent,
-        showBackground: true,
-        className: classes.svgTooltip
+        maxWidth: yAxisTitleMaximumAllowedHeight
     })), children, props.yAxisTitle !== undefined && props.yAxisTitle !== '' && /*#__PURE__*/ React.createElement(SVGTooltipText, {
+        ...commonSvgToolTipProps,
         content: props.yAxisTitle,
         textProps: {
             x: (yAxisTitleMaximumAllowedHeight - margins.bottom) / 2 + _removalValueForTextTuncate,
@@ -537,10 +572,20 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
                  ${svgDimensions.height - margins.bottom - margins.top - titleMargin})rotate(-90)`,
             className: classes.axisTitle
         },
-        maxWidth: yAxisTitleMaximumAllowedHeight,
-        wrapContent: wrapContent,
-        showBackground: true,
-        className: classes.svgTooltip
+        maxWidth: yAxisTitleMaximumAllowedHeight
+    }), props.yAxisAnnotation !== undefined && props.yAxisAnnotation !== '' && (props.secondaryYAxistitle === undefined || props.secondaryYAxistitle === '') && /*#__PURE__*/ React.createElement(SVGTooltipText, {
+        ...commonSvgToolTipProps,
+        content: props.yAxisAnnotation,
+        textProps: {
+            x: (yAxisTitleMaximumAllowedHeight - margins.bottom) / 2 + _removalValueForTextTuncate,
+            y: _useRtl ? startFromX - titleMargin : svgDimensions.width - margins.right,
+            textAnchor: 'middle',
+            transform: `translate(${_useRtl ? margins.right / 2 - titleMargin : margins.right / 2 + titleMargin},
+                   ${svgDimensions.height - margins.bottom - margins.top - titleMargin})rotate(-90)`,
+            className: classes.axisAnnotation,
+            'aria-hidden': true
+        },
+        maxWidth: yAxisTitleMaximumAllowedHeight
     }))), !props.hideLegend && /*#__PURE__*/ React.createElement("div", {
         ref: (e)=>legendContainer = e,
         className: classes.legendContainer

package/lib/components/CommonComponents/CartesianChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.tsx"],"sourcesContent":["import * as React from 'react';\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport { ModifiedCartesianChartProps, HorizontalBarChartWithAxisDataPoint, HeatMapChartDataPoint } from '../../index';\nimport { useCartesianChartStyles } from './useCartesianChartStyles.styles';\nimport { select as d3Select } from 'd3-selection';\nimport {\n  createNumericXAxis,\n  createStringXAxis,\n  IAxisData,\n  createDateXAxis,\n  IMargins,\n  XAxisTypes,\n  YAxisType,\n  createWrapOfXLabels,\n  rotateXAxisLabels,\n  calculateLongestLabelWidth,\n  createYAxisLabels,\n  ChartTypes,\n  wrapContent,\n  useRtl,\n  truncateString,\n  tooltipOfAxislabels,\n  getSecureProps,\n  DEFAULT_WRAP_WIDTH,\n} from '../../utilities/index';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SVGTooltipText } from '../../utilities/SVGTooltipText';\nimport { ChartPopover } from './ChartPopover';\nimport { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabster';\n\n/**\n * Cartesian Chart component\n * {@docCategory CartesianChart}\n */\nexport const CartesianChart: React.FunctionComponent<ModifiedCartesianChartProps> = React.forwardRef<\n  HTMLDivElement,\n  ModifiedCartesianChartProps\n>((props, forwardedRef) => {\n  const chartContainer = React.useRef<HTMLDivElement>();\n  let legendContainer: HTMLDivElement;\n  const minLegendContainerHeight: number = 40;\n  const xAxisElement = React.useRef<SVGSVGElement>();\n  const yAxisElement = React.useRef<SVGSVGElement>();\n  const yAxisElementSecondary = React.useRef<SVGSVGElement>();\n  let margins: IMargins;\n  const idForGraph: string = 'chart_';\n  let _reqID: number;\n  const _useRtl: boolean = useRtl();\n  let _tickValues: (string | number)[];\n  const titleMargin: number = 8;\n  const _isFirstRender = React.useRef<boolean>(true);\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  let _xScale: any;\n  let isIntegralDataset: boolean = true;\n  let _tooltipId: string = useId('tooltip_');\n  /* Used for when WrapXAxisLabels props appeared.\n   * To display the total word (space separated words), Need to have more space than usual.\n   * This height will get total height need to disaply total word.\n   * These value need to be removed from actual svg height/graph height.\n   * Defalut value is 0. And this values calculted when 'wrapXAxisLables' or 'showXAxisLablesTooltip' is true.\n   */\n  let _removalValueForTextTuncate: number = 0;\n\n  const [containerWidth, setContainerWidth] = React.useState<number>(0);\n  const [containerHeight, setContainerHeight] = React.useState<number>(0);\n  const [startFromX, setStartFromX] = React.useState<number>(0);\n  const [prevProps, setPrevProps] = React.useState<ModifiedCartesianChartProps | null>(null);\n\n  const chartTypesToCheck = [ChartTypes.HorizontalBarChartWithAxis, ChartTypes.HeatMapChart, ChartTypes.GanttChart];\n  /**\n   * In RTL mode, Only graph will be rendered left/right. We need to provide left and right margins manually.\n   * So that, in RTL, left margins becomes right margins and viceversa.\n   * As graph needs to be drawn perfecty, these values consider as default values.\n   * Same margins using for all other cartesian charts. Can be accessible through 'getMargins' call back method.\n   */\n  // eslint-disable-next-line prefer-const\n  margins = {\n    top: props.margins?.top ?? 20,\n    bottom: props.margins?.bottom ?? 35,\n    right: _useRtl ? props.margins?.left ?? 40 : props.margins?.right ?? props?.secondaryYScaleOptions ? 40 : 20,\n    left: _useRtl ? (props.margins?.right ?? props?.secondaryYScaleOptions ? 40 : 20) : props.margins?.left ?? 40,\n  };\n  if (props.xAxisTitle !== undefined && props.xAxisTitle !== '') {\n    margins.bottom! = props.margins?.bottom ?? 55;\n  }\n  if (props.yAxisTitle !== undefined && props.yAxisTitle !== '') {\n    margins.left! = _useRtl\n      ? props.margins?.right ?? props?.secondaryYAxistitle\n        ? 80\n        : 40\n      : props.margins?.left ?? 60;\n    margins.right! = _useRtl ? props.margins?.left ?? 60 : props.margins?.right ?? props?.secondaryYAxistitle ? 80 : 40;\n  }\n\n  const classes = useCartesianChartStyles(props);\n  const focusAttributes = useFocusableGroup();\n  const arrowAttributes = useArrowNavigationGroup({ axis: 'horizontal' });\n  // ComponentdidMount and Componentwillunmount logic\n  React.useEffect(() => {\n    _fitParentContainer();\n    if (props !== null) {\n      setPrevProps(props);\n    }\n    if (chartTypesToCheck.includes(props.chartType) && props.showYAxisLables && yAxisElement) {\n      const maxYAxisLabelLength = calculateMaxYAxisLabelLength(props.chartType, props.points, classes.yAxis!);\n      if (startFromX !== maxYAxisLabelLength) {\n        setStartFromX(maxYAxisLabelLength);\n      }\n    } else if (startFromX !== 0) {\n      setStartFromX(0);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    isIntegralDataset = !props.points.some((point: { y: number }) => point.y % 1 !== 0);\n    return () => {\n      cancelAnimationFrame(_reqID);\n    };\n  }, [props]);\n\n  // ComponentDidUpdate logic\n  React.useEffect(() => {\n    if (prevProps) {\n      if (prevProps.height !== props.height || prevProps.width !== props.width) {\n        _fitParentContainer();\n      }\n    }\n    if (chartTypesToCheck.includes(props.chartType) && props.showYAxisLables && yAxisElement) {\n      const maxYAxisLabelLength = calculateMaxYAxisLabelLength(props.chartType, props.points, classes.yAxis!);\n      if (startFromX !== maxYAxisLabelLength) {\n        setStartFromX(maxYAxisLabelLength);\n      }\n    } else if (startFromX !== 0) {\n      setStartFromX(0);\n    }\n    if (prevProps !== null && prevProps.points !== props.points) {\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      isIntegralDataset = !props.points.some((point: { y: number }) => point.y % 1 !== 0);\n    }\n  }, [props, prevProps]);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      chartContainer: chartContainer.current ?? null,\n    }),\n    [],\n  );\n\n  /**\n   * Dedicated function to return the Callout JSX Element , which can further be used to only call this when\n   * only the calloutprops and charthover props changes.\n   * @param calloutProps\n   * @param chartHoverProps\n   * @returns\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _generateCallout(calloutProps: any): JSXElement {\n    return <ChartPopover {...calloutProps} />;\n  }\n\n  function calculateMaxYAxisLabelLength(\n    chartType: ChartTypes,\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    points: any[],\n    className: string,\n  ): number {\n    const formatTickLabel = (str: string) => {\n      if (props.showYAxisLablesTooltip) {\n        return truncateString(str, props.noOfCharsToTruncate || 4);\n      }\n\n      return str;\n    };\n    if (chartType === ChartTypes.HeatMapChart) {\n      return calculateLongestLabelWidth(\n        points[0]?.data?.map((point: HeatMapChartDataPoint) => formatTickLabel(`${point.y}`)),\n        `.${className} text`,\n      );\n    } else {\n      return calculateLongestLabelWidth(\n        points?.map((point: HorizontalBarChartWithAxisDataPoint) => formatTickLabel(`${point.y}`)),\n        `.${className} text`,\n      );\n    }\n  }\n\n  const {\n    calloutProps,\n    points,\n    chartType,\n    svgProps,\n    culture,\n    dateLocalizeOptions,\n    timeFormatLocale,\n    customDateTimeFormatter,\n  } = props;\n  if (props.parentRef) {\n    _fitParentContainer();\n  }\n  const margin = { ...margins };\n  if (chartTypesToCheck.includes(props.chartType)) {\n    if (!_useRtl) {\n      margin.left! += startFromX;\n    } else {\n      margin.right! += startFromX;\n    }\n  }\n  // Callback for margins to the chart\n  props.getmargins && props.getmargins(margin);\n\n  let callout: JSXElement | null = null;\n\n  let children = null;\n  if ((props.enableFirstRenderOptimization && chartContainer.current) || !props.enableFirstRenderOptimization) {\n    _isFirstRender.current = false;\n    const XAxisParams = {\n      domainNRangeValues: props.getDomainNRangeValues(\n        points,\n        props.getDomainMargins ? props.getDomainMargins(containerWidth) : margins,\n        containerWidth,\n        chartType,\n        _useRtl,\n        props.xAxisType,\n        props.barwidth!,\n        props.tickValues!,\n        // This is only used for Horizontal Bar Chart with Axis for y as string axis\n        startFromX,\n      ),\n      // FIXME: In XAxisParams, containerHeight is used by HBWA to generate vertical gridlines.\n      // Since the x-axis in HBWA is numeric, it typically doesn't require transformation.\n      // However, if transformation props are enabled, the updated _removalValueForTextTuncate\n      // will only be available in the next render, as it's set after the axis is created.\n      // Solution: Delay the creation of gridlines until after the transformation has been applied,\n      // or precompute the required height for transformed labels (_removalValueForTextTuncate).\n      containerHeight: containerHeight - _removalValueForTextTuncate,\n      margins: margins,\n      xAxisElement: xAxisElement.current!,\n      showRoundOffXTickValues: props.showRoundOffXTickValues ?? true,\n      xAxisCount: props.xAxisTickCount,\n      xAxistickSize: props.xAxistickSize,\n      tickPadding: props.tickPadding || props.showXAxisLablesTooltip ? 5 : 10,\n      xAxisPadding: props.xAxisPadding,\n      xAxisInnerPadding: props.xAxisInnerPadding,\n      xAxisOuterPadding: props.xAxisOuterPadding,\n      containerWidth: containerWidth,\n      hideTickOverlap: props.rotateXAxisLables ? false : props.hideTickOverlap,\n      calcMaxLabelWidth: _calcMaxLabelWidthWithTransform,\n    };\n\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let xScale: any;\n    let tickValues: (string | number)[];\n    switch (props.xAxisType!) {\n      case XAxisTypes.NumericAxis:\n        ({ xScale, tickValues } = createNumericXAxis(XAxisParams, props.tickParams!, props.chartType, culture));\n        break;\n      case XAxisTypes.DateAxis:\n        ({ xScale, tickValues } = createDateXAxis(\n          XAxisParams,\n          props.tickParams!,\n          culture,\n          dateLocalizeOptions,\n          timeFormatLocale,\n          customDateTimeFormatter,\n          props.useUTC,\n          props.chartType,\n        ));\n        break;\n      case XAxisTypes.StringAxis:\n        ({ xScale, tickValues } = createStringXAxis(\n          XAxisParams,\n          props.tickParams!,\n          props.datasetForXAxisDomain!,\n          culture,\n        ));\n        break;\n      default:\n        ({ xScale, tickValues } = createNumericXAxis(XAxisParams, props.tickParams!, props.chartType, culture));\n    }\n    _xScale = xScale;\n    _tickValues = tickValues;\n\n    _transformXAxisLabels();\n\n    const YAxisParams = {\n      margins: props.getYDomainMargins ? props.getYDomainMargins(containerHeight) : margins,\n      containerWidth: containerWidth,\n      containerHeight: containerHeight - _removalValueForTextTuncate,\n      yAxisElement: yAxisElement.current!,\n      yAxisTickFormat: props.yAxisTickFormat!,\n      yAxisTickCount: props.yAxisTickCount!,\n      yMinValue: props.yMinValue || 0,\n      yMaxValue: props.yMaxValue || 0,\n      tickPadding: 10,\n      maxOfYVal: props.maxOfYVal,\n      yMinMaxValues: props.getMinMaxOfYAxis(points, props.yAxisType),\n      // please note these padding default values must be consistent in here\n      // and the parent chart(HBWA/Vertical etc..) for more details refer example\n      // http://using-d3js.com/04_07_ordinal_scales.html\n      yAxisPadding: props.yAxisPadding || 0,\n    };\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let yScalePrimary: any;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let yScaleSecondary: any;\n    const axisData: IAxisData = { yAxisDomainValues: [] };\n    if (props.yAxisType && props.yAxisType === YAxisType.StringAxis) {\n      yScalePrimary = props.createStringYAxis(YAxisParams, props.stringDatasetForYAxisDomain!, _useRtl, props.barwidth);\n    } else {\n      // TODO: Since the scale domain values are now computed independently for both the primary and\n      // secondary y-axes, the yMinValue and yMaxValue props are no longer necessary for accurately\n      // rendering the secondary y-axis. Therefore, rather than checking the secondaryYScaleOptions\n      // prop to determine whether to create a secondary y-axis, it's more appropriate to check if any\n      // data points are assigned to use the secondary y-scale.\n      if (props?.secondaryYScaleOptions) {\n        const YAxisParamsSecondary = {\n          margins: margins,\n          containerWidth: containerWidth,\n          containerHeight: containerHeight - _removalValueForTextTuncate!,\n          yAxisElement: yAxisElementSecondary.current,\n          yAxisTickFormat: props.yAxisTickFormat!,\n          yAxisTickCount: props.yAxisTickCount!,\n          yMinValue: props.secondaryYScaleOptions?.yMinValue || 0,\n          yMaxValue: props.secondaryYScaleOptions?.yMaxValue ?? 100,\n          tickPadding: 10,\n          yMinMaxValues: props.getMinMaxOfYAxis(points, props.yAxisType, true),\n          yAxisPadding: props.yAxisPadding,\n        };\n\n        yScaleSecondary = props.createYAxis(\n          YAxisParamsSecondary,\n          _useRtl,\n          axisData,\n          isIntegralDataset,\n          chartType,\n          true,\n          props.roundedTicks!,\n        );\n      }\n      yScalePrimary = props.createYAxis(\n        YAxisParams,\n        _useRtl,\n        axisData,\n        isIntegralDataset,\n        chartType,\n        false,\n        props.roundedTicks!,\n      );\n    }\n\n    if (chartTypesToCheck.includes(props.chartType)) {\n      // Removing un wanted tooltip div from DOM, when prop not provided, for proper cleanup\n      // of unwanted DOM elements, to prevent flacky behaviour in tooltips , that might occur\n      // in creating tooltips when tooltips are enabled( as we try to recreate a tspan with _tooltipId)\n      if (!props.showYAxisLablesTooltip) {\n        try {\n          document.getElementById(_tooltipId) && document.getElementById(_tooltipId)!.remove();\n          //eslint-disable-next-line no-empty\n        } catch (e) {}\n      }\n      // Used to display tooltip at y axis labels.\n      if (props.showYAxisLablesTooltip) {\n        // To create y axis tick values by if specified truncating the rest of the text\n        // and showing elipsis or showing the whole string,\n        yScalePrimary &&\n          // Note: This function should be invoked within the showYAxisLablesTooltip check,\n          // as its sole purpose is to truncate labels that exceed the noOfCharsToTruncate limit.\n          createYAxisLabels(\n            yAxisElement.current!,\n            yScalePrimary,\n            props.noOfCharsToTruncate || 4,\n            props.showYAxisLablesTooltip || false,\n            _useRtl,\n          );\n        const _yAxisElement = d3Select(yAxisElement.current!).call(yScalePrimary);\n        try {\n          document.getElementById(_tooltipId) && document.getElementById(_tooltipId)!.remove();\n          //eslint-disable-next-line no-empty\n        } catch (e) {}\n        const ytooltipProps = {\n          tooltipCls: classes.tooltip!,\n          id: _tooltipId,\n          axis: _yAxisElement,\n        };\n        _yAxisElement && tooltipOfAxislabels(ytooltipProps);\n      }\n    }\n\n    // Call back to the chart.\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const _getData = (xScale: any, yScalePrimary: any, yScaleSecondary: any) => {\n      props.getGraphData &&\n        props.getGraphData(\n          xScale,\n          yScalePrimary,\n          containerHeight - _removalValueForTextTuncate!,\n          containerWidth,\n          xAxisElement.current,\n          yAxisElement.current,\n          yScaleSecondary,\n        );\n    };\n\n    props.getAxisData && props.getAxisData(axisData);\n    // Callback function for chart, returns axis\n    _getData(xScale, yScalePrimary, yScaleSecondary);\n\n    children = props.children({\n      xScale,\n      yScalePrimary,\n      yScaleSecondary,\n      containerHeight,\n      containerWidth,\n    });\n\n    if (!props.hideTooltip && calloutProps!.isPopoverOpen) {\n      callout = _generateCallout(calloutProps);\n    }\n  }\n  const svgDimensions = {\n    width: containerWidth,\n    height: containerHeight,\n  };\n\n  const xAxisTitleMaximumAllowedWidth = svgDimensions.width - margins.left! - margins.right! - startFromX!;\n  const yAxisTitleMaximumAllowedHeight =\n    svgDimensions.height - margins.bottom! - margins.top! - _removalValueForTextTuncate! - titleMargin;\n  /**\n   * When screen resizes, along with screen, chart also auto adjusted.\n   * This method used to adjust height and width of the charts.\n   */\n  function _fitParentContainer(): void {\n    //_reqID = requestAnimationFrame(() => {\n    let legendContainerHeight;\n    if (props.hideLegend) {\n      // If there is no legend, need not to allocate some space from total chart space.\n      legendContainerHeight = 0;\n    } else {\n      const legendContainerComputedStyles = legendContainer && getComputedStyle(legendContainer);\n      legendContainerHeight =\n        ((legendContainer && legendContainer.getBoundingClientRect().height) || minLegendContainerHeight) +\n        parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginTop) || '0') +\n        parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginBottom) || '0');\n    }\n    if (props.parentRef || chartContainer.current) {\n      const container = props.parentRef ? props.parentRef : chartContainer.current!;\n      const currentContainerWidth =\n        props.reflowProps?.mode === 'min-width' && !_isFirstRender.current\n          ? Math.max(container.getBoundingClientRect().width, _calculateChartMinWidth())\n          : container.getBoundingClientRect().width;\n      const currentContainerHeight =\n        container.getBoundingClientRect().height > legendContainerHeight\n          ? container.getBoundingClientRect().height\n          : 350;\n      const shouldResize =\n        containerWidth !== currentContainerWidth || containerHeight !== currentContainerHeight - legendContainerHeight;\n      if (shouldResize) {\n        setContainerWidth(currentContainerWidth);\n        setContainerHeight(currentContainerHeight - legendContainerHeight);\n      }\n    }\n    //});\n  }\n\n  function _onChartLeave(): void {\n    props.onChartMouseLeave && props.onChartMouseLeave();\n  }\n\n  function _calculateChartMinWidth(): number {\n    // Adding 10px for padding on both sides\n    const labelWidth = _calcMaxLabelWidthWithTransform(_tickValues) + 10;\n\n    let minChartWidth = margins.left! + margins.right! + labelWidth * (_tickValues.length - 1);\n\n    if (\n      [ChartTypes.GroupedVerticalBarChart, ChartTypes.VerticalBarChart, ChartTypes.VerticalStackedBarChart].includes(\n        props.chartType,\n      )\n    ) {\n      const minDomainMargin = 8;\n      minChartWidth += minDomainMargin * 2;\n    }\n\n    return minChartWidth;\n  }\n\n  function _calcMaxLabelWidthWithTransform(x: (string | number)[]) {\n    // Case: rotated labels\n    if (!props.wrapXAxisLables && props.rotateXAxisLables && props.xAxisType! === XAxisTypes.StringAxis) {\n      const longestLabelWidth = calculateLongestLabelWidth(x, `.${classes.xAxis} text`);\n      return Math.ceil(longestLabelWidth * Math.cos(Math.PI / 4));\n    }\n\n    // Case: truncated labels\n    if (props.showXAxisLablesTooltip) {\n      const tickValues = x.map(val => {\n        const numChars = props.noOfCharsToTruncate || 4;\n        return val.toString().length > numChars ? `${val.toString().slice(0, numChars)}...` : val;\n      });\n\n      const longestLabelWidth = calculateLongestLabelWidth(tickValues, `.${classes.xAxis} text`);\n      return Math.ceil(longestLabelWidth);\n    }\n\n    // Case: wrapped labels\n    if (props.wrapXAxisLables) {\n      // FIXME: Calculate the max width of lines instead of words. This requires applying\n      // the wrapping transformation earlier to obtain the actual rendered lines.\n      const words: string[] = [];\n      x.forEach((val: string) => {\n        words.push(...val.toString().split(/\\s+/));\n      });\n\n      // This approach works well in most cases, since overflow typically occurs only when\n      // a single word exceeds the specified width — otherwise, the text will wrap as expected.\n      const longestLabelWidth = calculateLongestLabelWidth(words, `.${classes.xAxis} text`);\n      return Math.max(Math.ceil(longestLabelWidth), DEFAULT_WRAP_WIDTH);\n    }\n\n    // Default case\n    const longestLabelWidth = calculateLongestLabelWidth(x, `.${classes.xAxis} text`);\n    return Math.ceil(longestLabelWidth);\n  }\n\n  function _transformXAxisLabels() {\n    _removalValueForTextTuncate = 0;\n\n    /*\n     * To enable wrapping of x axis tick values or to display complete x axis tick values,\n     * we need to calculate how much space it needed to render the text.\n     * No need to re-calculate every time the chart renders and same time need to get an update. So using setState.\n     * Required space will be calculated first time chart rendering and if any width/height of chart updated.\n     * */\n    if (props.wrapXAxisLables || props.showXAxisLablesTooltip) {\n      let maxXAxisLabelWidth: number | undefined;\n      if (props.xAxisType === XAxisTypes.StringAxis) {\n        if ((props.datasetForXAxisDomain?.length || 0) > 1) {\n          maxXAxisLabelWidth = _xScale.step();\n        } else {\n          maxXAxisLabelWidth = containerWidth;\n        }\n      }\n\n      const wrapLabelProps = {\n        node: xAxisElement.current!,\n        xAxis: _xScale,\n        showXAxisLablesTooltip: props.showXAxisLablesTooltip || false,\n        noOfCharsToTruncate: props.noOfCharsToTruncate || 4,\n        width: maxXAxisLabelWidth,\n      };\n      _removalValueForTextTuncate = createWrapOfXLabels(wrapLabelProps) ?? 0;\n    }\n\n    if (!props.wrapXAxisLables && props.rotateXAxisLables && props.xAxisType! === XAxisTypes.StringAxis) {\n      const rotateLabelProps = {\n        node: xAxisElement.current!,\n        xAxis: _xScale,\n      };\n      const rotatedHeight = rotateXAxisLabels(rotateLabelProps) ?? 0;\n      // margins.bottom is used as padding here\n      _removalValueForTextTuncate = rotatedHeight + margins.bottom!;\n    }\n  }\n\n  /**\n   * We have use the {@link defaultTabbableElement } to fix\n   * the Focus not landing on chart while tabbing, instead  goes to legend.\n   * This issue is observed in Area, line chart after performance optimization done in the PR {@link https://github.com/microsoft/fluentui/pull/27721 }\n   * This issue is observed in Bar charts after the changes done by FocusZone team in the PR: {@link https://github.com/microsoft/fluentui/pull/24175 }\n   * The issue in Bar Charts(VB and VSB) is due to a {@link FocusZone } update where previously an event listener was\n   * attached on keydown to the window, so that whenever the tab key is pressed all outer FocusZone's\n   * tab-indexes are updated (an outer FocusZone is a FocusZone that is not within another one).\n   * But now after the above PR : they are attaching the\n   * listeners to the FocusZone elements instead of the window. So in the first render cycle in Bar charts\n   * bars are not created as in the first render cycle the size of the chart container is not known( or is 0)\n   * which creates bars of height 0 so instead we do not create any bars  and instead return empty fragments.\n   *\n   * We have tried 2 Approaches to fix the issue:\n   * 1. Using the {@link elementRef} property of FocusZone where we dispatch event for tab keydown\n   *    after the second render cycle which triggers an update of the tab index in FocusZone.\n   *    But this is a hacky solution and not a proper fix and also elementRef is deprecated.\n   * 2. Using the default tabbable element to fix the issue.\n   */\n\n  return (\n    <div\n      id={idForGraph}\n      className={classes.root}\n      role={'presentation'}\n      ref={(rootElem: HTMLDivElement) => (chartContainer.current = rootElem)}\n      onMouseLeave={_onChartLeave}\n    >\n      <div className={classes.chartWrapper} {...focusAttributes} {...arrowAttributes}>\n        {_isFirstRender.current}\n        <svg\n          width={svgDimensions.width}\n          height={svgDimensions.height}\n          aria-label={props.chartTitle}\n          style={{ display: 'block' }}\n          className={classes.chart}\n          {...getSecureProps(svgProps)}\n        >\n          <g\n            ref={(e: SVGSVGElement | null) => {\n              xAxisElement.current = e!;\n            }}\n            id={`xAxisGElement${idForGraph}`}\n            // To add wrap of x axis lables feature, need to remove word height from svg height.\n            transform={`translate(0, ${svgDimensions.height - margins.bottom! - _removalValueForTextTuncate!})`}\n            className={classes.xAxis}\n          />\n          {props.xAxisTitle !== undefined && props.xAxisTitle !== '' && (\n            <SVGTooltipText\n              content={props.xAxisTitle}\n              textProps={{\n                x: margins.left! + startFromX + xAxisTitleMaximumAllowedWidth / 2,\n                y: svgDimensions.height - titleMargin,\n                className: classes.axisTitle!,\n                textAnchor: 'middle',\n              }}\n              maxWidth={xAxisTitleMaximumAllowedWidth}\n              wrapContent={wrapContent}\n              showBackground={true}\n              className={classes.svgTooltip}\n            />\n          )}\n          <g\n            ref={(e: SVGSVGElement | null) => {\n              yAxisElement.current = e!;\n            }}\n            id={`yAxisGElement${idForGraph}`}\n            transform={`translate(${\n              _useRtl ? svgDimensions.width - margins.right! - startFromX : margins.left! + startFromX\n            }, 0)`}\n            className={classes.yAxis}\n          />\n          {props.secondaryYScaleOptions && (\n            <g>\n              <g\n                ref={(e: SVGSVGElement | null) => {\n                  yAxisElementSecondary.current = e!;\n                }}\n                id={`yAxisGElementSecondary${idForGraph}`}\n                transform={`translate(${\n                  _useRtl ? margins.left! + startFromX : svgDimensions.width - margins.right! - startFromX\n                }, 0)`}\n                className={classes.yAxis}\n              />\n              {props.secondaryYAxistitle !== undefined && props.secondaryYAxistitle !== '' && (\n                <SVGTooltipText\n                  content={props.secondaryYAxistitle}\n                  textProps={{\n                    x: (yAxisTitleMaximumAllowedHeight - margins.bottom!) / 2 + _removalValueForTextTuncate!,\n                    y: _useRtl ? startFromX - titleMargin : svgDimensions.width - margins.right!,\n                    textAnchor: 'middle',\n                    transform: `translate(${\n                      _useRtl ? margins.right! / 2 - titleMargin : margins.right! / 2 + titleMargin\n                    },\n                 ${svgDimensions.height - margins.bottom! - margins.top! - titleMargin})rotate(-90)`,\n                    className: classes.axisTitle!,\n                  }}\n                  maxWidth={yAxisTitleMaximumAllowedHeight}\n                  wrapContent={wrapContent}\n                  showBackground={true}\n                  className={classes.svgTooltip}\n                />\n              )}\n            </g>\n          )}\n          {children}\n          {props.yAxisTitle !== undefined && props.yAxisTitle !== '' && (\n            <SVGTooltipText\n              content={props.yAxisTitle}\n              textProps={{\n                x: (yAxisTitleMaximumAllowedHeight - margins.bottom!) / 2 + _removalValueForTextTuncate!,\n                y: _useRtl ? svgDimensions.width - margins.right! / 2 + titleMargin : margins.left! / 2 - titleMargin,\n                textAnchor: 'middle',\n                transform: `translate(0,\n                 ${svgDimensions.height - margins.bottom! - margins.top! - titleMargin})rotate(-90)`,\n                className: classes.axisTitle!,\n              }}\n              maxWidth={yAxisTitleMaximumAllowedHeight}\n              wrapContent={wrapContent}\n              showBackground={true}\n              className={classes.svgTooltip}\n            />\n          )}\n        </svg>\n      </div>\n\n      {!props.hideLegend && (\n        <div ref={(e: HTMLDivElement) => (legendContainer = e)} className={classes.legendContainer}>\n          {props.legendBars}\n        </div>\n      )}\n      {/** The callout is used for narration, so keep it mounted on the DOM */}\n      {callout && <React.Suspense fallback={<div>Loading...</div>}>{callout}</React.Suspense>}\n    </div>\n  );\n});\nCartesianChart.displayName = 'CartesianChart';\nCartesianChart.defaultProps = {\n  hideTickOverlap: true,\n};\n"],"names":["React","useCartesianChartStyles","select","d3Select","createNumericXAxis","createStringXAxis","createDateXAxis","XAxisTypes","YAxisType","createWrapOfXLabels","rotateXAxisLabels","calculateLongestLabelWidth","createYAxisLabels","ChartTypes","wrapContent","useRtl","truncateString","tooltipOfAxislabels","getSecureProps","DEFAULT_WRAP_WIDTH","useId","SVGTooltipText","ChartPopover","useFocusableGroup","useArrowNavigationGroup","CartesianChart","forwardRef","props","forwardedRef","chartContainer","useRef","legendContainer","minLegendContainerHeight","xAxisElement","yAxisElement","yAxisElementSecondary","margins","idForGraph","_reqID","_useRtl","_tickValues","titleMargin","_isFirstRender","_xScale","isIntegralDataset","_tooltipId","_removalValueForTextTuncate","containerWidth","setContainerWidth","useState","containerHeight","setContainerHeight","startFromX","setStartFromX","prevProps","setPrevProps","chartTypesToCheck","HorizontalBarChartWithAxis","HeatMapChart","GanttChart","top","bottom","right","left","secondaryYScaleOptions","xAxisTitle","undefined","yAxisTitle","secondaryYAxistitle","classes","focusAttributes","arrowAttributes","axis","useEffect","_fitParentContainer","includes","chartType","showYAxisLables","maxYAxisLabelLength","calculateMaxYAxisLabelLength","points","yAxis","some","point","y","cancelAnimationFrame","height","width","useImperativeHandle","componentRef","current","_generateCallout","calloutProps","className","formatTickLabel","str","showYAxisLablesTooltip","noOfCharsToTruncate","data","map","svgProps","culture","dateLocalizeOptions","timeFormatLocale","customDateTimeFormatter","parentRef","margin","getmargins","callout","children","enableFirstRenderOptimization","XAxisParams","domainNRangeValues","getDomainNRangeValues","getDomainMargins","xAxisType","barwidth","tickValues","showRoundOffXTickValues","xAxisCount","xAxisTickCount","xAxistickSize","tickPadding","showXAxisLablesTooltip","xAxisPadding","xAxisInnerPadding","xAxisOuterPadding","hideTickOverlap","rotateXAxisLables","calcMaxLabelWidth","_calcMaxLabelWidthWithTransform","xScale","NumericAxis","tickParams","DateAxis","useUTC","StringAxis","datasetForXAxisDomain","_transformXAxisLabels","YAxisParams","getYDomainMargins","yAxisTickFormat","yAxisTickCount","yMinValue","yMaxValue","maxOfYVal","yMinMaxValues","getMinMaxOfYAxis","yAxisType","yAxisPadding","yScalePrimary","yScaleSecondary","axisData","yAxisDomainValues","createStringYAxis","stringDatasetForYAxisDomain","YAxisParamsSecondary","createYAxis","roundedTicks","document","getElementById","remove","e","_yAxisElement","call","ytooltipProps","tooltipCls","tooltip","id","_getData","getGraphData","getAxisData","hideTooltip","isPopoverOpen","svgDimensions","xAxisTitleMaximumAllowedWidth","yAxisTitleMaximumAllowedHeight","legendContainerHeight","hideLegend","legendContainerComputedStyles","getComputedStyle","getBoundingClientRect","parseFloat","marginTop","marginBottom","container","currentContainerWidth","reflowProps","mode","Math","max","_calculateChartMinWidth","currentContainerHeight","shouldResize","_onChartLeave","onChartMouseLeave","labelWidth","minChartWidth","length","GroupedVerticalBarChart","VerticalBarChart","VerticalStackedBarChart","minDomainMargin","x","wrapXAxisLables","longestLabelWidth","xAxis","ceil","cos","PI","val","numChars","toString","slice","words","forEach","push","split","maxXAxisLabelWidth","step","wrapLabelProps","node","rotateLabelProps","rotatedHeight","div","root","role","ref","rootElem","onMouseLeave","chartWrapper","svg","aria-label","chartTitle","style","display","chart","g","transform","content","textProps","axisTitle","textAnchor","maxWidth","showBackground","svgTooltip","legendBars","Suspense","fallback","displayName","defaultProps"],"mappings":"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"}
+{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.tsx"],"sourcesContent":["import * as React from 'react';\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport { ModifiedCartesianChartProps } from '../../index';\nimport { useCartesianChartStyles } from './useCartesianChartStyles.styles';\nimport { select as d3Select } from 'd3-selection';\nimport {\n  createNumericXAxis,\n  createStringXAxis,\n  IAxisData,\n  createDateXAxis,\n  IMargins,\n  XAxisTypes,\n  YAxisType,\n  createWrapOfXLabels,\n  rotateXAxisLabels,\n  calculateLongestLabelWidth,\n  createYAxisLabels,\n  ChartTypes,\n  wrapContent,\n  useRtl,\n  truncateString,\n  tooltipOfAxislabels,\n  getSecureProps,\n  DEFAULT_WRAP_WIDTH,\n} from '../../utilities/index';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SVGTooltipText, SVGTooltipTextProps } from '../../utilities/SVGTooltipText';\nimport { ChartPopover } from './ChartPopover';\nimport { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabster';\n\n/**\n * Cartesian Chart component\n * {@docCategory CartesianChart}\n */\nexport const CartesianChart: React.FunctionComponent<ModifiedCartesianChartProps> = React.forwardRef<\n  HTMLDivElement,\n  ModifiedCartesianChartProps\n>((props, forwardedRef) => {\n  const chartContainer = React.useRef<HTMLDivElement>();\n  let legendContainer: HTMLDivElement;\n  const minLegendContainerHeight: number = 40;\n  const xAxisElement = React.useRef<SVGSVGElement>();\n  const yAxisElement = React.useRef<SVGSVGElement>();\n  const yAxisElementSecondary = React.useRef<SVGSVGElement>();\n  let margins: IMargins;\n  const idForGraph: string = 'chart_';\n  let _reqID: number;\n  const _useRtl: boolean = useRtl();\n  let _tickValues: (string | number)[];\n  const titleMargin: number = 8;\n  const _isFirstRender = React.useRef<boolean>(true);\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  let _xScale: any;\n  let isIntegralDataset: boolean = true;\n  let _tooltipId: string = useId('tooltip_');\n  /* Used for when WrapXAxisLabels props appeared.\n   * To display the total word (space separated words), Need to have more space than usual.\n   * This height will get total height need to disaply total word.\n   * These value need to be removed from actual svg height/graph height.\n   * Defalut value is 0. And this values calculted when 'wrapXAxisLables' or 'showXAxisLablesTooltip' is true.\n   */\n  let _removalValueForTextTuncate: number = 0;\n\n  const [containerWidth, setContainerWidth] = React.useState<number>(0);\n  const [containerHeight, setContainerHeight] = React.useState<number>(0);\n  const [startFromX, setStartFromX] = React.useState<number>(0);\n  const [prevProps, setPrevProps] = React.useState<ModifiedCartesianChartProps | null>(null);\n\n  const chartTypesWithStringYAxis = [\n    ChartTypes.HorizontalBarChartWithAxis,\n    ChartTypes.HeatMapChart,\n    ChartTypes.VerticalStackedBarChart,\n    ChartTypes.GanttChart,\n    ChartTypes.ScatterChart,\n  ];\n  /**\n   * In RTL mode, Only graph will be rendered left/right. We need to provide left and right margins manually.\n   * So that, in RTL, left margins becomes right margins and viceversa.\n   * As graph needs to be drawn perfecty, these values consider as default values.\n   * Same margins using for all other cartesian charts. Can be accessible through 'getMargins' call back method.\n   */\n  // eslint-disable-next-line prefer-const\n  margins = {\n    top: props.margins?.top ?? 20,\n    bottom: props.margins?.bottom ?? 35,\n    right: _useRtl ? props.margins?.left ?? 40 : props.margins?.right ?? props?.secondaryYScaleOptions ? 40 : 20,\n    left: _useRtl ? (props.margins?.right ?? props?.secondaryYScaleOptions ? 40 : 20) : props.margins?.left ?? 40,\n  };\n  const TITLE_MARGIN_HORIZONTAL = 24;\n  const TITLE_MARGIN_VERTICAL = 20;\n  if (props.xAxisTitle !== undefined && props.xAxisTitle !== '') {\n    margins.bottom! = props.margins?.bottom ?? margins.bottom! + TITLE_MARGIN_VERTICAL;\n  }\n  if (props.yAxisTitle !== undefined && props.yAxisTitle !== '') {\n    margins.left! = _useRtl\n      ? props.margins?.right ?? props?.secondaryYAxistitle\n        ? margins.right! + 2 * TITLE_MARGIN_HORIZONTAL\n        : margins.right! + TITLE_MARGIN_HORIZONTAL\n      : props.margins?.left ?? margins.left! + TITLE_MARGIN_HORIZONTAL;\n    margins.right! = _useRtl\n      ? props.margins?.left ?? margins.left! + TITLE_MARGIN_HORIZONTAL\n      : props.margins?.right ?? props?.secondaryYAxistitle\n      ? margins.right! + 2 * TITLE_MARGIN_HORIZONTAL\n      : margins.right! + TITLE_MARGIN_HORIZONTAL;\n  }\n  if (props.xAxisAnnotation !== undefined && props.xAxisAnnotation !== '') {\n    margins.top! = props.margins?.top ?? margins.top! + TITLE_MARGIN_VERTICAL;\n  }\n  if (\n    props.yAxisAnnotation !== undefined &&\n    props.yAxisAnnotation !== '' &&\n    (props.secondaryYAxistitle === undefined || props.secondaryYAxistitle === '')\n  ) {\n    if (_useRtl) {\n      margins.left! = props.margins?.right ?? margins.right! + TITLE_MARGIN_HORIZONTAL;\n    } else {\n      margins.right! = props.margins?.right ?? margins.right! + TITLE_MARGIN_HORIZONTAL;\n    }\n  }\n\n  const classes = useCartesianChartStyles(props);\n  const focusAttributes = useFocusableGroup();\n  const arrowAttributes = useArrowNavigationGroup({ axis: 'horizontal' });\n  // ComponentdidMount and Componentwillunmount logic\n  React.useEffect(() => {\n    _fitParentContainer();\n    if (props !== null) {\n      setPrevProps(props);\n    }\n    if (\n      chartTypesWithStringYAxis.includes(props.chartType) &&\n      props.showYAxisLables &&\n      yAxisElement &&\n      props.yAxisType === YAxisType.StringAxis\n    ) {\n      const maxYAxisLabelLength = calculateMaxYAxisLabelLength(classes.yAxis!);\n      if (startFromX !== maxYAxisLabelLength) {\n        setStartFromX(maxYAxisLabelLength);\n      }\n    } else if (startFromX !== 0) {\n      setStartFromX(0);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    isIntegralDataset = !props.points.some((point: { y: number }) => point.y % 1 !== 0);\n    return () => {\n      cancelAnimationFrame(_reqID);\n    };\n  }, [props]);\n\n  // ComponentDidUpdate logic\n  React.useEffect(() => {\n    if (prevProps) {\n      if (prevProps.height !== props.height || prevProps.width !== props.width) {\n        _fitParentContainer();\n      }\n    }\n    if (\n      chartTypesWithStringYAxis.includes(props.chartType) &&\n      props.showYAxisLables &&\n      yAxisElement &&\n      props.yAxisType === YAxisType.StringAxis\n    ) {\n      const maxYAxisLabelLength = calculateMaxYAxisLabelLength(classes.yAxis!);\n      if (startFromX !== maxYAxisLabelLength) {\n        setStartFromX(maxYAxisLabelLength);\n      }\n    } else if (startFromX !== 0) {\n      setStartFromX(0);\n    }\n    if (prevProps !== null && prevProps.points !== props.points) {\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      isIntegralDataset = !props.points.some((point: { y: number }) => point.y % 1 !== 0);\n    }\n  }, [props, prevProps]);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      chartContainer: chartContainer.current ?? null,\n    }),\n    [],\n  );\n\n  /**\n   * Dedicated function to return the Callout JSX Element , which can further be used to only call this when\n   * only the calloutprops and charthover props changes.\n   * @param calloutProps\n   * @param chartHoverProps\n   * @returns\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _generateCallout(calloutProps: any): JSXElement {\n    return <ChartPopover {...calloutProps} />;\n  }\n\n  function calculateMaxYAxisLabelLength(className: string): number {\n    const formatTickLabel = (str: string) => {\n      if (props.showYAxisLablesTooltip) {\n        return truncateString(str, props.noOfCharsToTruncate || 4);\n      }\n\n      return str;\n    };\n    return calculateLongestLabelWidth(\n      props.stringDatasetForYAxisDomain!.map(label => formatTickLabel(label)),\n      `.${className} text`,\n    );\n  }\n\n  const {\n    calloutProps,\n    points,\n    chartType,\n    svgProps,\n    culture,\n    dateLocalizeOptions,\n    timeFormatLocale,\n    customDateTimeFormatter,\n  } = props;\n  if (props.parentRef) {\n    _fitParentContainer();\n  }\n  const margin = { ...margins };\n  // Note: This check is unnecessary since startFromX is only set for charts with string y-axis.\n  if (chartTypesWithStringYAxis.includes(props.chartType)) {\n    if (!_useRtl) {\n      margin.left! += startFromX;\n    } else {\n      margin.right! += startFromX;\n    }\n  }\n  // Callback for margins to the chart\n  props.getmargins && props.getmargins(margin);\n\n  let callout: JSXElement | null = null;\n\n  let children = null;\n  if ((props.enableFirstRenderOptimization && chartContainer.current) || !props.enableFirstRenderOptimization) {\n    _isFirstRender.current = false;\n    const XAxisParams = {\n      domainNRangeValues: props.getDomainNRangeValues(\n        points,\n        props.getDomainMargins ? props.getDomainMargins(containerWidth) : margins,\n        containerWidth,\n        chartType,\n        _useRtl,\n        props.xAxisType,\n        props.barwidth!,\n        props.tickValues!,\n        // This is only used for Horizontal Bar Chart with Axis for y as string axis\n        startFromX,\n      ),\n      // FIXME: In XAxisParams, containerHeight is used by HBWA to generate vertical gridlines.\n      // Since the x-axis in HBWA is numeric, it typically doesn't require transformation.\n      // However, if transformation props are enabled, the updated _removalValueForTextTuncate\n      // will only be available in the next render, as it's set after the axis is created.\n      // Solution: Delay the creation of gridlines until after the transformation has been applied,\n      // or precompute the required height for transformed labels (_removalValueForTextTuncate).\n      containerHeight: containerHeight - _removalValueForTextTuncate,\n      margins: margins,\n      xAxisElement: xAxisElement.current!,\n      showRoundOffXTickValues: props.showRoundOffXTickValues ?? true,\n      xAxisCount: props.xAxisTickCount,\n      xAxistickSize: props.xAxistickSize,\n      tickPadding: props.tickPadding || props.showXAxisLablesTooltip ? 5 : 10,\n      xAxisPadding: props.xAxisPadding,\n      xAxisInnerPadding: props.xAxisInnerPadding,\n      xAxisOuterPadding: props.xAxisOuterPadding,\n      containerWidth: containerWidth,\n      hideTickOverlap: props.rotateXAxisLables ? false : props.hideTickOverlap,\n      calcMaxLabelWidth: _calcMaxLabelWidthWithTransform,\n      tickStep: props.xAxis?.tickStep,\n      tick0: props.xAxis?.tick0,\n    };\n\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let xScale: any;\n    let tickValues: (string | number)[];\n    switch (props.xAxisType!) {\n      case XAxisTypes.NumericAxis:\n        ({ xScale, tickValues } = createNumericXAxis(\n          XAxisParams,\n          props.tickParams!,\n          props.chartType,\n          culture,\n          props.xScaleType,\n        ));\n        break;\n      case XAxisTypes.DateAxis:\n        ({ xScale, tickValues } = createDateXAxis(\n          XAxisParams,\n          props.tickParams!,\n          culture,\n          dateLocalizeOptions,\n          timeFormatLocale,\n          customDateTimeFormatter,\n          props.useUTC,\n          props.chartType,\n        ));\n        break;\n      case XAxisTypes.StringAxis:\n        ({ xScale, tickValues } = createStringXAxis(\n          XAxisParams,\n          props.tickParams!,\n          props.datasetForXAxisDomain!,\n          culture,\n        ));\n        break;\n      default:\n        ({ xScale, tickValues } = createNumericXAxis(\n          XAxisParams,\n          props.tickParams!,\n          props.chartType,\n          culture,\n          props.xScaleType,\n        ));\n    }\n    _xScale = xScale;\n    _tickValues = tickValues;\n\n    _transformXAxisLabels();\n\n    const YAxisParams = {\n      margins: props.getYDomainMargins ? props.getYDomainMargins(containerHeight) : margins,\n      containerWidth: containerWidth,\n      containerHeight: containerHeight - _removalValueForTextTuncate,\n      yAxisElement: yAxisElement.current!,\n      yAxisTickFormat: props.yAxisTickFormat!,\n      yAxisTickCount: props.yAxisTickCount!,\n      yMinValue: props.yMinValue || 0,\n      yMaxValue: props.yMaxValue || 0,\n      tickPadding: 10,\n      maxOfYVal: props.maxOfYVal,\n      yMinMaxValues: props.getMinMaxOfYAxis(points, props.yAxisType),\n      // please note these padding default values must be consistent in here\n      // and the parent chart(HBWA/Vertical etc..) for more details refer example\n      // http://using-d3js.com/04_07_ordinal_scales.html\n      yAxisPadding: props.yAxisPadding || 0,\n      tickValues: props.yAxisTickValues,\n      tickStep: props.yAxis?.tickStep,\n      tick0: props.yAxis?.tick0,\n    };\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let yScalePrimary: any;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let yScaleSecondary: any;\n    const axisData: IAxisData = { yAxisDomainValues: [] };\n    if (props.yAxisType && props.yAxisType === YAxisType.StringAxis) {\n      yScalePrimary = props.createStringYAxis(\n        YAxisParams,\n        props.stringDatasetForYAxisDomain!,\n        _useRtl,\n        props.barwidth,\n        props.chartType,\n      );\n    } else {\n      // TODO: Since the scale domain values are now computed independently for both the primary and\n      // secondary y-axes, the yMinValue and yMaxValue props are no longer necessary for accurately\n      // rendering the secondary y-axis. Therefore, rather than checking the secondaryYScaleOptions\n      // prop to determine whether to create a secondary y-axis, it's more appropriate to check if any\n      // data points are assigned to use the secondary y-scale.\n      if (props?.secondaryYScaleOptions) {\n        const YAxisParamsSecondary = {\n          margins: margins,\n          containerWidth: containerWidth,\n          containerHeight: containerHeight - _removalValueForTextTuncate!,\n          yAxisElement: yAxisElementSecondary.current,\n          yAxisTickFormat: props.yAxisTickFormat!,\n          yAxisTickCount: props.yAxisTickCount!,\n          yMinValue: props.secondaryYScaleOptions?.yMinValue || 0,\n          yMaxValue: props.secondaryYScaleOptions?.yMaxValue ?? 100,\n          tickPadding: 10,\n          yMinMaxValues: props.getMinMaxOfYAxis(points, props.yAxisType, true),\n          yAxisPadding: props.yAxisPadding,\n        };\n\n        yScaleSecondary = props.createYAxis(\n          YAxisParamsSecondary,\n          _useRtl,\n          axisData,\n          isIntegralDataset,\n          chartType,\n          true,\n          props.roundedTicks!,\n          props.secondaryYScaleType,\n        );\n      }\n      yScalePrimary = props.createYAxis(\n        YAxisParams,\n        _useRtl,\n        axisData,\n        isIntegralDataset,\n        chartType,\n        false,\n        props.roundedTicks!,\n        props.yScaleType,\n      );\n    }\n\n    if (chartTypesWithStringYAxis.includes(props.chartType) && props.yAxisType === YAxisType.StringAxis) {\n      // Removing un wanted tooltip div from DOM, when prop not provided, for proper cleanup\n      // of unwanted DOM elements, to prevent flacky behaviour in tooltips , that might occur\n      // in creating tooltips when tooltips are enabled( as we try to recreate a tspan with _tooltipId)\n      if (!props.showYAxisLablesTooltip) {\n        try {\n          document.getElementById(_tooltipId) && document.getElementById(_tooltipId)!.remove();\n          //eslint-disable-next-line no-empty\n        } catch (e) {}\n      }\n      // Used to display tooltip at y axis labels.\n      if (props.showYAxisLablesTooltip) {\n        // To create y axis tick values by if specified truncating the rest of the text\n        // and showing elipsis or showing the whole string,\n        yScalePrimary &&\n          // Note: This function should be invoked within the showYAxisLablesTooltip check,\n          // as its sole purpose is to truncate labels that exceed the noOfCharsToTruncate limit.\n          createYAxisLabels(\n            yAxisElement.current!,\n            yScalePrimary,\n            props.noOfCharsToTruncate || 4,\n            props.showYAxisLablesTooltip || false,\n            _useRtl,\n          );\n        const _yAxisElement = d3Select(yAxisElement.current!).call(yScalePrimary);\n        try {\n          document.getElementById(_tooltipId) && document.getElementById(_tooltipId)!.remove();\n          //eslint-disable-next-line no-empty\n        } catch (e) {}\n        const ytooltipProps = {\n          tooltipCls: classes.tooltip!,\n          id: _tooltipId,\n          axis: _yAxisElement,\n        };\n        _yAxisElement && tooltipOfAxislabels(ytooltipProps);\n      }\n    }\n\n    // Call back to the chart.\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const _getData = (xScale: any, yScalePrimary: any, yScaleSecondary: any) => {\n      props.getGraphData &&\n        props.getGraphData(\n          xScale,\n          yScalePrimary,\n          containerHeight - _removalValueForTextTuncate!,\n          containerWidth,\n          xAxisElement.current,\n          yAxisElement.current,\n          yScaleSecondary,\n        );\n    };\n\n    props.getAxisData && props.getAxisData(axisData);\n    // Callback function for chart, returns axis\n    _getData(xScale, yScalePrimary, yScaleSecondary);\n\n    children = props.children({\n      xScale,\n      yScalePrimary,\n      yScaleSecondary,\n      containerHeight,\n      containerWidth,\n    });\n\n    if (!props.hideTooltip && calloutProps!.isPopoverOpen) {\n      callout = _generateCallout(calloutProps);\n    }\n  }\n  const svgDimensions = {\n    width: containerWidth,\n    height: containerHeight,\n  };\n\n  const xAxisTitleMaximumAllowedWidth = svgDimensions.width - margins.left! - margins.right! - startFromX!;\n  const yAxisTitleMaximumAllowedHeight =\n    svgDimensions.height - margins.bottom! - margins.top! - _removalValueForTextTuncate! - titleMargin;\n\n  const commonSvgToolTipProps: SVGTooltipTextProps = {\n    wrapContent,\n    showBackground: true,\n    className: classes.svgTooltip,\n    content: '',\n  };\n  /**\n   * When screen resizes, along with screen, chart also auto adjusted.\n   * This method used to adjust height and width of the charts.\n   */\n  function _fitParentContainer(): void {\n    //_reqID = requestAnimationFrame(() => {\n    let legendContainerHeight;\n    if (props.hideLegend) {\n      // If there is no legend, need not to allocate some space from total chart space.\n      legendContainerHeight = 0;\n    } else {\n      const legendContainerComputedStyles = legendContainer && getComputedStyle(legendContainer);\n      legendContainerHeight =\n        ((legendContainer && legendContainer.getBoundingClientRect().height) || minLegendContainerHeight) +\n        parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginTop) || '0') +\n        parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginBottom) || '0');\n    }\n    if (props.parentRef || chartContainer.current) {\n      const container = props.parentRef ? props.parentRef : chartContainer.current!;\n      const currentContainerWidth =\n        props.reflowProps?.mode === 'min-width' && !_isFirstRender.current\n          ? Math.max(container.getBoundingClientRect().width, _calculateChartMinWidth())\n          : container.getBoundingClientRect().width;\n      const currentContainerHeight =\n        container.getBoundingClientRect().height > legendContainerHeight\n          ? container.getBoundingClientRect().height\n          : 350;\n      const shouldResize =\n        containerWidth !== currentContainerWidth || containerHeight !== currentContainerHeight - legendContainerHeight;\n      if (shouldResize) {\n        setContainerWidth(currentContainerWidth);\n        setContainerHeight(currentContainerHeight - legendContainerHeight);\n      }\n    }\n    //});\n  }\n\n  function _onChartLeave(): void {\n    props.onChartMouseLeave && props.onChartMouseLeave();\n  }\n\n  function _calculateChartMinWidth(): number {\n    // Adding 10px for padding on both sides\n    const labelWidth = _calcMaxLabelWidthWithTransform(_tickValues) + 10;\n\n    let minChartWidth = margins.left! + margins.right! + labelWidth * (_tickValues.length - 1);\n\n    if (\n      [ChartTypes.GroupedVerticalBarChart, ChartTypes.VerticalBarChart, ChartTypes.VerticalStackedBarChart].includes(\n        props.chartType,\n      )\n    ) {\n      const minDomainMargin = 8;\n      minChartWidth += minDomainMargin * 2;\n    }\n\n    return minChartWidth;\n  }\n\n  function _calcMaxLabelWidthWithTransform(x: (string | number)[]) {\n    // Case: rotated labels\n    if (!props.wrapXAxisLables && props.rotateXAxisLables && props.xAxisType! === XAxisTypes.StringAxis) {\n      const longestLabelWidth = calculateLongestLabelWidth(x, `.${classes.xAxis} text`);\n      return Math.ceil(longestLabelWidth * Math.cos(Math.PI / 4));\n    }\n\n    // Case: truncated labels\n    if (props.showXAxisLablesTooltip) {\n      const tickValues = x.map(val => {\n        const numChars = props.noOfCharsToTruncate || 4;\n        return val.toString().length > numChars ? `${val.toString().slice(0, numChars)}...` : val;\n      });\n\n      const longestLabelWidth = calculateLongestLabelWidth(tickValues, `.${classes.xAxis} text`);\n      return Math.ceil(longestLabelWidth);\n    }\n\n    // Case: wrapped labels\n    if (props.wrapXAxisLables) {\n      // FIXME: Calculate the max width of lines instead of words. This requires applying\n      // the wrapping transformation earlier to obtain the actual rendered lines.\n      const words: string[] = [];\n      x.forEach((val: string) => {\n        words.push(...val.toString().split(/\\s+/));\n      });\n\n      // This approach works well in most cases, since overflow typically occurs only when\n      // a single word exceeds the specified width — otherwise, the text will wrap as expected.\n      const longestLabelWidth = calculateLongestLabelWidth(words, `.${classes.xAxis} text`);\n      return Math.max(Math.ceil(longestLabelWidth), DEFAULT_WRAP_WIDTH);\n    }\n\n    // Default case\n    const longestLabelWidth = calculateLongestLabelWidth(x, `.${classes.xAxis} text`);\n    return Math.ceil(longestLabelWidth);\n  }\n\n  function _transformXAxisLabels() {\n    _removalValueForTextTuncate = 0;\n\n    /*\n     * To enable wrapping of x axis tick values or to display complete x axis tick values,\n     * we need to calculate how much space it needed to render the text.\n     * No need to re-calculate every time the chart renders and same time need to get an update. So using setState.\n     * Required space will be calculated first time chart rendering and if any width/height of chart updated.\n     * */\n    if (props.wrapXAxisLables || props.showXAxisLablesTooltip) {\n      let maxXAxisLabelWidth: number | undefined;\n      if (props.xAxisType === XAxisTypes.StringAxis) {\n        if ((props.datasetForXAxisDomain?.length || 0) > 1) {\n          maxXAxisLabelWidth = _xScale.step();\n        } else {\n          maxXAxisLabelWidth = containerWidth;\n        }\n      }\n\n      const wrapLabelProps = {\n        node: xAxisElement.current!,\n        xAxis: _xScale,\n        showXAxisLablesTooltip: props.showXAxisLablesTooltip || false,\n        noOfCharsToTruncate: props.noOfCharsToTruncate || 4,\n        width: maxXAxisLabelWidth,\n      };\n      _removalValueForTextTuncate = createWrapOfXLabels(wrapLabelProps) ?? 0;\n    }\n\n    if (!props.wrapXAxisLables && props.rotateXAxisLables && props.xAxisType! === XAxisTypes.StringAxis) {\n      const rotateLabelProps = {\n        node: xAxisElement.current!,\n        xAxis: _xScale,\n      };\n      const rotatedHeight = rotateXAxisLabels(rotateLabelProps) ?? 0;\n      // margins.bottom is used as padding here\n      _removalValueForTextTuncate = rotatedHeight + margins.bottom!;\n    }\n  }\n\n  /**\n   * We have use the {@link defaultTabbableElement } to fix\n   * the Focus not landing on chart while tabbing, instead  goes to legend.\n   * This issue is observed in Area, line chart after performance optimization done in the PR {@link https://github.com/microsoft/fluentui/pull/27721 }\n   * This issue is observed in Bar charts after the changes done by FocusZone team in the PR: {@link https://github.com/microsoft/fluentui/pull/24175 }\n   * The issue in Bar Charts(VB and VSB) is due to a {@link FocusZone } update where previously an event listener was\n   * attached on keydown to the window, so that whenever the tab key is pressed all outer FocusZone's\n   * tab-indexes are updated (an outer FocusZone is a FocusZone that is not within another one).\n   * But now after the above PR : they are attaching the\n   * listeners to the FocusZone elements instead of the window. So in the first render cycle in Bar charts\n   * bars are not created as in the first render cycle the size of the chart container is not known( or is 0)\n   * which creates bars of height 0 so instead we do not create any bars  and instead return empty fragments.\n   *\n   * We have tried 2 Approaches to fix the issue:\n   * 1. Using the {@link elementRef} property of FocusZone where we dispatch event for tab keydown\n   *    after the second render cycle which triggers an update of the tab index in FocusZone.\n   *    But this is a hacky solution and not a proper fix and also elementRef is deprecated.\n   * 2. Using the default tabbable element to fix the issue.\n   */\n\n  return (\n    <div\n      id={idForGraph}\n      className={classes.root}\n      role={'presentation'}\n      ref={(rootElem: HTMLDivElement) => (chartContainer.current = rootElem)}\n      onMouseLeave={_onChartLeave}\n    >\n      <div className={classes.chartWrapper} {...focusAttributes} {...arrowAttributes}>\n        {_isFirstRender.current}\n        <svg\n          width={svgDimensions.width}\n          height={svgDimensions.height}\n          aria-label={props.chartTitle}\n          style={{ display: 'block' }}\n          className={classes.chart}\n          {...getSecureProps(svgProps)}\n        >\n          <g\n            ref={(e: SVGSVGElement | null) => {\n              xAxisElement.current = e!;\n            }}\n            id={`xAxisGElement${idForGraph}`}\n            // To add wrap of x axis lables feature, need to remove word height from svg height.\n            transform={`translate(0, ${svgDimensions.height - margins.bottom! - _removalValueForTextTuncate!})`}\n            className={classes.xAxis}\n          />\n          {props.xAxisTitle !== undefined && props.xAxisTitle !== '' && (\n            <SVGTooltipText\n              {...commonSvgToolTipProps}\n              content={props.xAxisTitle}\n              textProps={{\n                x: margins.left! + startFromX + xAxisTitleMaximumAllowedWidth / 2,\n                y: svgDimensions.height - titleMargin,\n                className: classes.axisTitle!,\n                textAnchor: 'middle',\n              }}\n              maxWidth={xAxisTitleMaximumAllowedWidth}\n            />\n          )}\n          {props.xAxisAnnotation !== undefined && props.xAxisAnnotation !== '' && (\n            <SVGTooltipText\n              {...commonSvgToolTipProps}\n              content={props.xAxisAnnotation}\n              textProps={{\n                x: margins.left! + startFromX + xAxisTitleMaximumAllowedWidth / 2,\n                y: titleMargin + 3,\n                className: classes.axisAnnotation!,\n                textAnchor: 'middle',\n                'aria-hidden': true,\n              }}\n              maxWidth={xAxisTitleMaximumAllowedWidth}\n            />\n          )}\n          <g\n            ref={(e: SVGSVGElement | null) => {\n              yAxisElement.current = e!;\n            }}\n            id={`yAxisGElement${idForGraph}`}\n            transform={`translate(${\n              _useRtl ? svgDimensions.width - margins.right! - startFromX : margins.left! + startFromX\n            }, 0)`}\n            className={classes.yAxis}\n          />\n          {props.secondaryYScaleOptions && (\n            <g>\n              <g\n                ref={(e: SVGSVGElement | null) => {\n                  yAxisElementSecondary.current = e!;\n                }}\n                id={`yAxisGElementSecondary${idForGraph}`}\n                transform={`translate(${\n                  _useRtl ? margins.left! + startFromX : svgDimensions.width - margins.right! - startFromX\n                }, 0)`}\n                className={classes.yAxis}\n              />\n              {props.secondaryYAxistitle !== undefined && props.secondaryYAxistitle !== '' && (\n                <SVGTooltipText\n                  {...commonSvgToolTipProps}\n                  content={props.secondaryYAxistitle}\n                  textProps={{\n                    x: (yAxisTitleMaximumAllowedHeight - margins.bottom!) / 2 + _removalValueForTextTuncate!,\n                    y: _useRtl ? startFromX - titleMargin : svgDimensions.width - margins.right!,\n                    textAnchor: 'middle',\n                    transform: `translate(${\n                      _useRtl ? margins.right! / 2 - titleMargin : margins.right! / 2 + titleMargin\n                    },\n                 ${svgDimensions.height - margins.bottom! - margins.top! - titleMargin})rotate(-90)`,\n                    className: classes.axisTitle!,\n                  }}\n                  maxWidth={yAxisTitleMaximumAllowedHeight}\n                />\n              )}\n            </g>\n          )}\n          {children}\n          {props.yAxisTitle !== undefined && props.yAxisTitle !== '' && (\n            <SVGTooltipText\n              {...commonSvgToolTipProps}\n              content={props.yAxisTitle}\n              textProps={{\n                x: (yAxisTitleMaximumAllowedHeight - margins.bottom!) / 2 + _removalValueForTextTuncate!,\n                y: _useRtl ? svgDimensions.width - margins.right! / 2 + titleMargin : margins.left! / 2 - titleMargin,\n                textAnchor: 'middle',\n                transform: `translate(0,\n                 ${svgDimensions.height - margins.bottom! - margins.top! - titleMargin})rotate(-90)`,\n                className: classes.axisTitle!,\n              }}\n              maxWidth={yAxisTitleMaximumAllowedHeight}\n            />\n          )}\n          {props.yAxisAnnotation !== undefined &&\n            props.yAxisAnnotation !== '' &&\n            (props.secondaryYAxistitle === undefined || props.secondaryYAxistitle === '') && (\n              <SVGTooltipText\n                {...commonSvgToolTipProps}\n                content={props.yAxisAnnotation}\n                textProps={{\n                  x: (yAxisTitleMaximumAllowedHeight - margins.bottom!) / 2 + _removalValueForTextTuncate!,\n                  y: _useRtl ? startFromX - titleMargin : svgDimensions.width - margins.right!,\n                  textAnchor: 'middle',\n                  transform: `translate(${\n                    _useRtl ? margins.right! / 2 - titleMargin : margins.right! / 2 + titleMargin\n                  },\n                   ${svgDimensions.height - margins.bottom! - margins.top! - titleMargin})rotate(-90)`,\n                  className: classes.axisAnnotation!,\n                  'aria-hidden': true,\n                }}\n                maxWidth={yAxisTitleMaximumAllowedHeight}\n              />\n            )}\n        </svg>\n      </div>\n\n      {!props.hideLegend && (\n        <div ref={(e: HTMLDivElement) => (legendContainer = e)} className={classes.legendContainer}>\n          {props.legendBars}\n        </div>\n      )}\n      {/** The callout is used for narration, so keep it mounted on the DOM */}\n      {callout && <React.Suspense fallback={<div>Loading...</div>}>{callout}</React.Suspense>}\n    </div>\n  );\n});\nCartesianChart.displayName = 'CartesianChart';\nCartesianChart.defaultProps = {\n  hideTickOverlap: true,\n};\n"],"names":["React","useCartesianChartStyles","select","d3Select","createNumericXAxis","createStringXAxis","createDateXAxis","XAxisTypes","YAxisType","createWrapOfXLabels","rotateXAxisLabels","calculateLongestLabelWidth","createYAxisLabels","ChartTypes","wrapContent","useRtl","truncateString","tooltipOfAxislabels","getSecureProps","DEFAULT_WRAP_WIDTH","useId","SVGTooltipText","ChartPopover","useFocusableGroup","useArrowNavigationGroup","CartesianChart","forwardRef","props","forwardedRef","chartContainer","useRef","legendContainer","minLegendContainerHeight","xAxisElement","yAxisElement","yAxisElementSecondary","margins","idForGraph","_reqID","_useRtl","_tickValues","titleMargin","_isFirstRender","_xScale","isIntegralDataset","_tooltipId","_removalValueForTextTuncate","containerWidth","setContainerWidth","useState","containerHeight","setContainerHeight","startFromX","setStartFromX","prevProps","setPrevProps","chartTypesWithStringYAxis","HorizontalBarChartWithAxis","HeatMapChart","VerticalStackedBarChart","GanttChart","ScatterChart","top","bottom","right","left","secondaryYScaleOptions","TITLE_MARGIN_HORIZONTAL","TITLE_MARGIN_VERTICAL","xAxisTitle","undefined","yAxisTitle","secondaryYAxistitle","xAxisAnnotation","yAxisAnnotation","classes","focusAttributes","arrowAttributes","axis","useEffect","_fitParentContainer","includes","chartType","showYAxisLables","yAxisType","StringAxis","maxYAxisLabelLength","calculateMaxYAxisLabelLength","yAxis","points","some","point","y","cancelAnimationFrame","height","width","useImperativeHandle","componentRef","current","_generateCallout","calloutProps","className","formatTickLabel","str","showYAxisLablesTooltip","noOfCharsToTruncate","stringDatasetForYAxisDomain","map","label","svgProps","culture","dateLocalizeOptions","timeFormatLocale","customDateTimeFormatter","parentRef","margin","getmargins","callout","children","enableFirstRenderOptimization","XAxisParams","domainNRangeValues","getDomainNRangeValues","getDomainMargins","xAxisType","barwidth","tickValues","showRoundOffXTickValues","xAxisCount","xAxisTickCount","xAxistickSize","tickPadding","showXAxisLablesTooltip","xAxisPadding","xAxisInnerPadding","xAxisOuterPadding","hideTickOverlap","rotateXAxisLables","calcMaxLabelWidth","_calcMaxLabelWidthWithTransform","tickStep","xAxis","tick0","xScale","NumericAxis","tickParams","xScaleType","DateAxis","useUTC","datasetForXAxisDomain","_transformXAxisLabels","YAxisParams","getYDomainMargins","yAxisTickFormat","yAxisTickCount","yMinValue","yMaxValue","maxOfYVal","yMinMaxValues","getMinMaxOfYAxis","yAxisPadding","yAxisTickValues","yScalePrimary","yScaleSecondary","axisData","yAxisDomainValues","createStringYAxis","YAxisParamsSecondary","createYAxis","roundedTicks","secondaryYScaleType","yScaleType","document","getElementById","remove","e","_yAxisElement","call","ytooltipProps","tooltipCls","tooltip","id","_getData","getGraphData","getAxisData","hideTooltip","isPopoverOpen","svgDimensions","xAxisTitleMaximumAllowedWidth","yAxisTitleMaximumAllowedHeight","commonSvgToolTipProps","showBackground","svgTooltip","content","legendContainerHeight","hideLegend","legendContainerComputedStyles","getComputedStyle","getBoundingClientRect","parseFloat","marginTop","marginBottom","container","currentContainerWidth","reflowProps","mode","Math","max","_calculateChartMinWidth","currentContainerHeight","shouldResize","_onChartLeave","onChartMouseLeave","labelWidth","minChartWidth","length","GroupedVerticalBarChart","VerticalBarChart","minDomainMargin","x","wrapXAxisLables","longestLabelWidth","ceil","cos","PI","val","numChars","toString","slice","words","forEach","push","split","maxXAxisLabelWidth","step","wrapLabelProps","node","rotateLabelProps","rotatedHeight","div","root","role","ref","rootElem","onMouseLeave","chartWrapper","svg","aria-label","chartTitle","style","display","chart","g","transform","textProps","axisTitle","textAnchor","maxWidth","axisAnnotation","legendBars","Suspense","fallback","displayName","defaultProps"],"mappings":"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"}