@fluentui/react-charts 9.3.2 → 9.3.4

package/lib/components/ChartTable/useChartTableStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ChartTable/useChartTableStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { ChartTableProps, ChartTableStyles } from './ChartTable.types';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\n/**\n * @internal\n */\nexport const chartTableClassNames: SlotClassNames<ChartTableStyles> = {\n  root: 'fui-ChartTable__root',\n  table: 'fui-ChartTable__table',\n  headerCell: 'fui-ChartTable__headerCell',\n  bodyCell: 'fui-ChartTable__bodyCell',\n  chart: 'fui-ChartTable__chart',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    width: '100%',\n    overflowX: 'auto',\n  },\n  table: {\n    borderCollapse: 'collapse',\n  },\n  headerCell: {\n    ...typographyStyles.caption1,\n    fontWeight: tokens.fontWeightSemibold,\n    backgroundColor: tokens.colorNeutralBackground3,\n    color: 'black',\n    ...shorthands.padding(tokens.spacingHorizontalS),\n    textAlign: 'left',\n    ...shorthands.border(tokens.strokeWidthThick, 'solid', tokens.colorNeutralStroke2),\n    '@media (forced-colors: active)': {\n      backgroundColor: 'Window',\n      color: 'WindowText',\n    },\n  },\n  bodyCell: {\n    ...typographyStyles.caption1,\n    ...shorthands.padding(tokens.spacingHorizontalS),\n    ...shorthands.border(tokens.strokeWidthThick, 'solid', tokens.colorNeutralStroke2),\n    color: 'black',\n    textAlign: 'left',\n    '@media (forced-colors: active)': {\n      color: 'WindowText',\n    },\n  },\n});\n\n/**\n * Apply styling to the ChartTable slots based on the state\n */\nexport const useChartTableStyles = (props: ChartTableProps): ChartTableStyles => {\n  const baseStyles = useStyles();\n\n  return {\n    root: mergeClasses(chartTableClassNames.root, baseStyles.root /*props.styles?.root*/),\n    table: mergeClasses(chartTableClassNames.table, baseStyles.table /*props.styles?.table*/),\n    headerCell: mergeClasses(chartTableClassNames.headerCell, baseStyles.headerCell /*props.styles?.headerCell*/),\n    bodyCell: mergeClasses(chartTableClassNames.bodyCell, baseStyles.bodyCell /*props.styles?.bodyCell*/),\n    chart: mergeClasses(chartTableClassNames.chart /*props.styles?.chart*/),\n  };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","typographyStyles","chartTableClassNames","root","table","headerCell","bodyCell","chart","useStyles","width","overflowX","borderCollapse","caption1","fontWeight","fontWeightSemibold","backgroundColor","colorNeutralBackground3","color","padding","spacingHorizontalS","textAlign","border","strokeWidthThick","colorNeutralStroke2","useChartTableStyles","props","baseStyles"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAEjE;;CAEC,GACD,OAAO,MAAMC,uBAAyD;IACpEC,MAAM;IACNC,OAAO;IACPC,YAAY;IACZC,UAAU;IACVC,OAAO;AACT,EAAE;AAEF,MAAMC,YAAYX,WAAW;IAC3BM,MAAM;QACJM,OAAO;QACPC,WAAW;IACb;IACAN,OAAO;QACLO,gBAAgB;IAClB;IACAN,YAAY;QACV,GAAGJ,iBAAiBW,QAAQ;QAC5BC,YAAYb,OAAOc,kBAAkB;QACrCC,iBAAiBf,OAAOgB,uBAAuB;QAC/CC,OAAO;QACP,GAAGlB,WAAWmB,OAAO,CAAClB,OAAOmB,kBAAkB,CAAC;QAChDC,WAAW;QACX,GAAGrB,WAAWsB,MAAM,CAACrB,OAAOsB,gBAAgB,EAAE,SAAStB,OAAOuB,mBAAmB,CAAC;QAClF,kCAAkC;YAChCR,iBAAiB;YACjBE,OAAO;QACT;IACF;IACAX,UAAU;QACR,GAAGL,iBAAiBW,QAAQ;QAC5B,GAAGb,WAAWmB,OAAO,CAAClB,OAAOmB,kBAAkB,CAAC;QAChD,GAAGpB,WAAWsB,MAAM,CAACrB,OAAOsB,gBAAgB,EAAE,SAAStB,OAAOuB,mBAAmB,CAAC;QAClFN,OAAO;QACPG,WAAW;QACX,kCAAkC;YAChCH,OAAO;QACT;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMO,sBAAsB,CAACC;IAClC,MAAMC,aAAalB;IAEnB,OAAO;QACLL,MAAML,aAAaI,qBAAqBC,IAAI,EAAEuB,WAAWvB,IAAI,CAAC,oBAAoB;QAClFC,OAAON,aAAaI,qBAAqBE,KAAK,EAAEsB,WAAWtB,KAAK,CAAC,qBAAqB;QACtFC,YAAYP,aAAaI,qBAAqBG,UAAU,EAAEqB,WAAWrB,UAAU,CAAC,0BAA0B;QAC1GC,UAAUR,aAAaI,qBAAqBI,QAAQ,EAAEoB,WAAWpB,QAAQ,CAAC,wBAAwB;QAClGC,OAAOT,aAAaI,qBAAqBK,KAAK,CAAC,qBAAqB;IACtE;AACF,EAAE"}
+{"version":3,"sources":["../src/components/ChartTable/useChartTableStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { ChartTableProps, ChartTableStyles } from './ChartTable.types';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\n/**\n * @internal\n */\nexport const chartTableClassNames: SlotClassNames<ChartTableStyles> = {\n  root: 'fui-ChartTable__root',\n  table: 'fui-ChartTable__table',\n  headerCell: 'fui-ChartTable__headerCell',\n  bodyCell: 'fui-ChartTable__bodyCell',\n  chart: 'fui-ChartTable__chart',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    width: '100%',\n    overflowX: 'auto',\n  },\n  table: {\n    borderCollapse: 'collapse',\n  },\n  headerCell: {\n    ...typographyStyles.caption1,\n    fontWeight: tokens.fontWeightSemibold,\n    backgroundColor: tokens.colorNeutralBackground3,\n    color: tokens.colorNeutralForeground1,\n    ...shorthands.padding(tokens.spacingHorizontalS),\n    textAlign: 'left',\n    ...shorthands.border(tokens.strokeWidthThick, 'solid', tokens.colorNeutralStroke2),\n    '@media (forced-colors: active)': {\n      backgroundColor: 'Window',\n      color: 'WindowText',\n    },\n  },\n  bodyCell: {\n    ...typographyStyles.caption1,\n    ...shorthands.padding(tokens.spacingHorizontalS),\n    ...shorthands.border(tokens.strokeWidthThick, 'solid', tokens.colorNeutralStroke2),\n    color: tokens.colorNeutralForeground1,\n    textAlign: 'left',\n    '@media (forced-colors: active)': {\n      color: 'WindowText',\n    },\n  },\n});\n\n/**\n * Apply styling to the ChartTable slots based on the state\n */\nexport const useChartTableStyles = (props: ChartTableProps): ChartTableStyles => {\n  const baseStyles = useStyles();\n\n  return {\n    root: mergeClasses(chartTableClassNames.root, baseStyles.root /*props.styles?.root*/),\n    table: mergeClasses(chartTableClassNames.table, baseStyles.table /*props.styles?.table*/),\n    headerCell: mergeClasses(chartTableClassNames.headerCell, baseStyles.headerCell /*props.styles?.headerCell*/),\n    bodyCell: mergeClasses(chartTableClassNames.bodyCell, baseStyles.bodyCell /*props.styles?.bodyCell*/),\n    chart: mergeClasses(chartTableClassNames.chart /*props.styles?.chart*/),\n  };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","typographyStyles","chartTableClassNames","root","table","headerCell","bodyCell","chart","useStyles","width","overflowX","borderCollapse","caption1","fontWeight","fontWeightSemibold","backgroundColor","colorNeutralBackground3","color","colorNeutralForeground1","padding","spacingHorizontalS","textAlign","border","strokeWidthThick","colorNeutralStroke2","useChartTableStyles","props","baseStyles"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAEjE;;CAEC,GACD,OAAO,MAAMC,uBAAyD;IACpEC,MAAM;IACNC,OAAO;IACPC,YAAY;IACZC,UAAU;IACVC,OAAO;AACT,EAAE;AAEF,MAAMC,YAAYX,WAAW;IAC3BM,MAAM;QACJM,OAAO;QACPC,WAAW;IACb;IACAN,OAAO;QACLO,gBAAgB;IAClB;IACAN,YAAY;QACV,GAAGJ,iBAAiBW,QAAQ;QAC5BC,YAAYb,OAAOc,kBAAkB;QACrCC,iBAAiBf,OAAOgB,uBAAuB;QAC/CC,OAAOjB,OAAOkB,uBAAuB;QACrC,GAAGnB,WAAWoB,OAAO,CAACnB,OAAOoB,kBAAkB,CAAC;QAChDC,WAAW;QACX,GAAGtB,WAAWuB,MAAM,CAACtB,OAAOuB,gBAAgB,EAAE,SAASvB,OAAOwB,mBAAmB,CAAC;QAClF,kCAAkC;YAChCT,iBAAiB;YACjBE,OAAO;QACT;IACF;IACAX,UAAU;QACR,GAAGL,iBAAiBW,QAAQ;QAC5B,GAAGb,WAAWoB,OAAO,CAACnB,OAAOoB,kBAAkB,CAAC;QAChD,GAAGrB,WAAWuB,MAAM,CAACtB,OAAOuB,gBAAgB,EAAE,SAASvB,OAAOwB,mBAAmB,CAAC;QAClFP,OAAOjB,OAAOkB,uBAAuB;QACrCG,WAAW;QACX,kCAAkC;YAChCJ,OAAO;QACT;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMQ,sBAAsB,CAACC;IAClC,MAAMC,aAAanB;IAEnB,OAAO;QACLL,MAAML,aAAaI,qBAAqBC,IAAI,EAAEwB,WAAWxB,IAAI,CAAC,oBAAoB;QAClFC,OAAON,aAAaI,qBAAqBE,KAAK,EAAEuB,WAAWvB,KAAK,CAAC,qBAAqB;QACtFC,YAAYP,aAAaI,qBAAqBG,UAAU,EAAEsB,WAAWtB,UAAU,CAAC,0BAA0B;QAC1GC,UAAUR,aAAaI,qBAAqBI,QAAQ,EAAEqB,WAAWrB,QAAQ,CAAC,wBAAwB;QAClGC,OAAOT,aAAaI,qBAAqBK,KAAK,CAAC,qBAAqB;IACtE;AACF,EAAE"}

package/lib/components/CommonComponents/CartesianChart.js

@@ -113,7 +113,9 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
             setStartFromX(0);
         }
         return ()=>{
-            cancelAnimationFrame(_reqID);
+            if (_reqID !== undefined) {
+                cancelAnimationFrame(_reqID);
+            }
         };
     }, [
         props
@@ -182,7 +184,6 @@ 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 = {
@@ -207,8 +208,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
             containerWidth: containerWidth,
             hideTickOverlap: props.rotateXAxisLables ? false : props.hideTickOverlap,
             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
+            ...props.xAxis
         };
         /**
      * These scales used for 2 purposes.
@@ -251,8 +251,7 @@ import { useFocusableGroup, useArrowNavigationGroup } from '@fluentui/react-tabs
             // http://using-d3js.com/04_07_ordinal_scales.html
             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
+            ...props.yAxis
         };
         /**
      * These scales used for 2 purposes.

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.tsx"],"sourcesContent":["'use client';\n\nimport * 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  const isIntegralDataset = React.useMemo(() => {\n    return !props.points.some((point: { y: number }) => point.y % 1 !== 0);\n  }, [props.points]);\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    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  }, [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          _useRtl,\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          _useRtl,\n        ));\n        break;\n      default:\n        ({ xScale, tickValues } = createNumericXAxis(\n          XAxisParams,\n          props.tickParams!,\n          props.chartType,\n          culture,\n          props.xScaleType,\n          _useRtl,\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          _useRtl,\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        _useRtl,\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","useMemo","points","some","point","y","_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","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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"}
+{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.tsx"],"sourcesContent":["'use client';\n\nimport * 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 | undefined;\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  const isIntegralDataset = React.useMemo(() => {\n    return !props.points.some((point: { y: number }) => point.y % 1 !== 0);\n  }, [props.points]);\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    return () => {\n      if (_reqID !== undefined) {\n        cancelAnimationFrame(_reqID);\n      }\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  }, [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      ...props.xAxis,\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          _useRtl,\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          _useRtl,\n        ));\n        break;\n      default:\n        ({ xScale, tickValues } = createNumericXAxis(\n          XAxisParams,\n          props.tickParams!,\n          props.chartType,\n          culture,\n          props.xScaleType,\n          _useRtl,\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      ...props.yAxis,\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          _useRtl,\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        _useRtl,\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","useMemo","points","some","point","y","_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","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","xAxis","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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"}

package/lib/components/CommonComponents/ChartPopover.js

@@ -23,6 +23,7 @@ combining the logic for Callout and ChartHoverCard in v8 charts. */ export const
                 height: 0
             })
     };
+    const target = typeof props.positioning === 'object' && 'target' in props.positioning ? props.positioning.target !== null ? props.positioning.target : virtualElement : virtualElement;
     props = {
         ...props,
         ...(_props_customCallout = props.customCallout) === null || _props_customCallout === void 0 ? void 0 : _props_customCallout.customCalloutProps
@@ -36,7 +37,7 @@ combining the logic for Callout and ChartHoverCard in v8 charts. */ export const
         className: classes.calloutContainer
     }, /*#__PURE__*/ React.createElement(Popover, {
         positioning: {
-            target: virtualElement,
+            target: target,
             autoSize: 'always',
             offset: 20,
             coverTarget: false

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/ChartPopover.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { mergeClasses } from '@griffel/react';\nimport type { PositioningVirtualElement } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { useId } from '@fluentui/react-utilities';\nimport { getAccessibleDataObject, Points, pointTypes } from '../../utilities/index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { Shape } from '../Legends/shape';\nimport { usePopoverStyles_unstable } from './useChartPopoverStyles.styles';\nimport { YValueHover } from './CartesianChart.types';\nimport { LegendShape } from '../Legends/Legends.types';\nimport { ChartPopoverProps } from './ChartPopover.types';\n\n/* This component is a wrapper over Popover component which implements the logic for rendering popovers for any chart\ncombining the logic for Callout and ChartHoverCard in v8 charts. */\nexport const ChartPopover: React.FunctionComponent<ChartPopoverProps> = React.forwardRef<\n  HTMLDivElement,\n  ChartPopoverProps\n>((props, forwardedRef) => {\n  const virtualElement: PositioningVirtualElement = {\n    getBoundingClientRect: () => ({\n      top: props.clickPosition!.y,\n      left: props.clickPosition!.x,\n      right: props.clickPosition!.x,\n      bottom: props.clickPosition!.y,\n      x: props.clickPosition!.x,\n      y: props.clickPosition!.y,\n      width: 0,\n      height: 0,\n    }),\n  };\n  props = { ...props, ...props.customCallout?.customCalloutProps };\n  const classes = usePopoverStyles_unstable(props);\n  const legend = props.xCalloutValue ? props.xCalloutValue : props.legend;\n  const YValue = props.yCalloutValue ? props.yCalloutValue : props.YValue;\n  return (\n    <div id={useId('callout')} ref={forwardedRef} className={classes.calloutContainer}>\n      <Popover\n        positioning={{ target: virtualElement, autoSize: 'always', offset: 20, coverTarget: false }}\n        open={props.isPopoverOpen}\n        inline\n      >\n        <PopoverSurface>\n          {/** Given custom callout, then it will render */}\n          {props.customCallout && props.customCallout.customizedCallout && props.customCallout.customizedCallout}\n          {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) &&\n            props.isCalloutForStack &&\n            _multiValueCallout()}\n          {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) && !props.isCalloutForStack && (\n            <div className={classes.calloutContentRoot}>\n              <div className={classes.calloutDateTimeContainer}>\n                <div className={classes.calloutContentX}>{props.XValue} </div>\n                {/*TO DO  if we add time for callout then will use this */}\n                {/* <div className={classNames.calloutContentX}>07:00am</div> */}\n              </div>\n              <div\n                className={classes.calloutInfoContainer}\n                style={{\n                  ...(props.ratio && {\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                  }),\n                  borderInlineStart: `4px solid ${props.color}`,\n                  marginTop: '11px',\n                }}\n              >\n                <div className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>\n                    {formatToLocaleString(legend, props.culture) as React.ReactNode}\n                  </div>\n                  <div\n                    className={classes.calloutContentY}\n                    style={{\n                      color: props.color ? props.color : tokens.colorNeutralForeground1,\n                      fontSize: tokens.fontSizeHero700,\n                    }}\n                  >\n                    {formatToLocaleString(YValue, props.culture) as React.ReactNode}\n                  </div>\n                </div>\n                {!!props.ratio && (\n                  <div className={classes.ratio}>\n                    <>\n                      <span className={classes.numerator}>\n                        {formatToLocaleString(props.ratio[0], props.culture) as React.ReactNode}\n                      </span>\n                      /\n                      <span className={classes.denominator}>\n                        {formatToLocaleString(props.ratio[1], props.culture) as React.ReactNode}\n                      </span>\n                    </>\n                  </div>\n                )}\n              </div>\n              {!!props.descriptionMessage && (\n                <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>\n              )}\n            </div>\n          )}\n        </PopoverSurface>\n      </Popover>\n    </div>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _multiValueCallout() {\n    const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(props.YValueHover) ?? false;\n    return (\n      <div className={classes.calloutContentRoot}>\n        <div\n          className={classes.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={classes.calloutContentX}\n            {...getAccessibleDataObject(props!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {formatToLocaleString(props!.hoverXValue, props.culture) as React.ReactNode}\n          </div>\n        </div>\n        <div style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n          {props!.YValueHover &&\n            props!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n              const isLast: boolean = index + 1 === yValues.length;\n              const shouldDrawBorderBottom = isLast ? false : yValue.shouldDrawBorderBottom ?? false;\n              return (\n                <div\n                  {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                  key={`callout-content-${index}`}\n                  style={\n                    yValueHoverSubCountsExists\n                      ? {\n                          display: 'inline-block',\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!props.descriptionMessage && <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>}\n        </div>\n      </div>\n    );\n  }\n\n  function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]): boolean | undefined {\n    return (\n      yValueHover &&\n      yValueHover.some(\n        (yValue: {\n          legend?: string;\n          y?: number;\n          color?: string;\n          yAxisCalloutData?: string | { [id: string]: number };\n        }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n      )\n    );\n  }\n\n  function _getCalloutContent(\n    xValue: YValueHover,\n    index: number,\n    yValueHoverSubCountsExists: boolean,\n    isLast: boolean,\n  ): React.ReactNode {\n    const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n    const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n    const { culture } = props;\n    const yValue = formatToLocaleString(xValue.y, culture) as React.ReactNode;\n    if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n      return (\n        <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n          {yValueHoverSubCountsExists && (\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n          )}\n          <div\n            id={`${index}_${xValue.y}`}\n            className={classes.calloutBlockContainer}\n            style={{\n              ...(!toDrawShape\n                ? {\n                    borderInlineStart: `4px solid ${xValue.color}`,\n                  }\n                : {}),\n            }}\n          >\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: classes.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div\n              className={mergeClasses(\n                classes.calloutBlockContainer,\n                toDrawShape\n                  ? classes.calloutBlockContainertoDrawShapetrue\n                  : classes.calloutBlockContainertoDrawShapefalse,\n              )}\n              style={{ marginTop: xValue ? '13px' : 'unset' }}\n            >\n              <div className={classes.calloutlegendText}> {xValue.legend}</div>\n              <div className={classes.calloutContentY} style={{ direction: 'ltr', unicodeBidi: 'isolate' }}>\n                {\n                  formatToLocaleString(\n                    xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y ?? xValue.data,\n                    culture,\n                  ) as React.ReactNode\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      );\n    } else {\n      const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n      return (\n        <div style={marginStyle}>\n          <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n            {xValue.legend!} ({yValue})\n          </div>\n          {Object.keys(subcounts).map((subcountName: string) => {\n            return (\n              <div key={subcountName} className={classes.calloutBlockContainer}>\n                <div className={classes.calloutlegendText}>\n                  {' '}\n                  {formatToLocaleString(subcountName, culture) as React.ReactNode}\n                </div>\n                <div\n                  className={classes.calloutContentY}\n                  style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                >\n                  {formatToLocaleString(subcounts[subcountName], culture) as React.ReactNode}\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      );\n    }\n  }\n});\nChartPopover.displayName = 'ChartPopover';\n"],"names":["React","Popover","PopoverSurface","mergeClasses","tokens","useId","getAccessibleDataObject","Points","pointTypes","formatToLocaleString","Shape","usePopoverStyles_unstable","ChartPopover","forwardRef","props","forwardedRef","virtualElement","getBoundingClientRect","top","clickPosition","y","left","x","right","bottom","width","height","customCallout","customCalloutProps","classes","legend","xCalloutValue","YValue","yCalloutValue","div","id","ref","className","calloutContainer","positioning","target","autoSize","offset","coverTarget","open","isPopoverOpen","inline","customizedCallout","isCalloutForStack","_multiValueCallout","calloutContentRoot","calloutDateTimeContainer","calloutContentX","XValue","calloutInfoContainer","style","ratio","display","alignItems","borderInlineStart","color","marginTop","calloutBlockContainer","calloutlegendText","culture","calloutContentY","colorNeutralForeground1","fontSize","fontSizeHero700","span","numerator","denominator","descriptionMessage","_yValueHoverSubCountsExists","yValueHoverSubCountsExists","YValueHover","marginBottom","xAxisCalloutAccessibilityData","hoverXValue","map","yValue","index","yValues","isLast","length","shouldDrawBorderBottom","callOutAccessibilityData","key","borderBottom","colorNeutralStroke2","paddingBottom","_getCalloutContent","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","svgProps","shapeStyles","pathProps","fill","shape","Object","keys","calloutBlockContainertoDrawShapetrue","calloutBlockContainertoDrawShapefalse","direction","unicodeBidi","data","subcounts","subcountName","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/CommonComponents/ChartPopover.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { mergeClasses } from '@griffel/react';\nimport type { PositioningVirtualElement } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { useId } from '@fluentui/react-utilities';\nimport { getAccessibleDataObject, Points, pointTypes } from '../../utilities/index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { Shape } from '../Legends/shape';\nimport { usePopoverStyles_unstable } from './useChartPopoverStyles.styles';\nimport { YValueHover } from './CartesianChart.types';\nimport { LegendShape } from '../Legends/Legends.types';\nimport { ChartPopoverProps } from './ChartPopover.types';\n\n/* This component is a wrapper over Popover component which implements the logic for rendering popovers for any chart\ncombining the logic for Callout and ChartHoverCard in v8 charts. */\nexport const ChartPopover: React.FunctionComponent<ChartPopoverProps> = React.forwardRef<\n  HTMLDivElement,\n  ChartPopoverProps\n>((props, forwardedRef) => {\n  const virtualElement: PositioningVirtualElement = {\n    getBoundingClientRect: () => ({\n      top: props.clickPosition!.y,\n      left: props.clickPosition!.x,\n      right: props.clickPosition!.x,\n      bottom: props.clickPosition!.y,\n      x: props.clickPosition!.x,\n      y: props.clickPosition!.y,\n      width: 0,\n      height: 0,\n    }),\n  };\n  const target =\n    typeof props.positioning === 'object' && 'target' in props.positioning\n      ? props.positioning.target !== null\n        ? props.positioning.target\n        : virtualElement\n      : virtualElement;\n  props = { ...props, ...props.customCallout?.customCalloutProps };\n  const classes = usePopoverStyles_unstable(props);\n  const legend = props.xCalloutValue ? props.xCalloutValue : props.legend;\n  const YValue = props.yCalloutValue ? props.yCalloutValue : props.YValue;\n  return (\n    <div id={useId('callout')} ref={forwardedRef} className={classes.calloutContainer}>\n      <Popover\n        positioning={{ target: target, autoSize: 'always', offset: 20, coverTarget: false }}\n        open={props.isPopoverOpen}\n        inline\n      >\n        <PopoverSurface>\n          {/** Given custom callout, then it will render */}\n          {props.customCallout && props.customCallout.customizedCallout && props.customCallout.customizedCallout}\n          {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) &&\n            props.isCalloutForStack &&\n            _multiValueCallout()}\n          {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) && !props.isCalloutForStack && (\n            <div className={classes.calloutContentRoot}>\n              <div className={classes.calloutDateTimeContainer}>\n                <div className={classes.calloutContentX}>{props.XValue} </div>\n                {/*TO DO  if we add time for callout then will use this */}\n                {/* <div className={classNames.calloutContentX}>07:00am</div> */}\n              </div>\n              <div\n                className={classes.calloutInfoContainer}\n                style={{\n                  ...(props.ratio && {\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                  }),\n                  borderInlineStart: `4px solid ${props.color}`,\n                  marginTop: '11px',\n                }}\n              >\n                <div className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>\n                    {formatToLocaleString(legend, props.culture) as React.ReactNode}\n                  </div>\n                  <div\n                    className={classes.calloutContentY}\n                    style={{\n                      color: props.color ? props.color : tokens.colorNeutralForeground1,\n                      fontSize: tokens.fontSizeHero700,\n                    }}\n                  >\n                    {formatToLocaleString(YValue, props.culture) as React.ReactNode}\n                  </div>\n                </div>\n                {!!props.ratio && (\n                  <div className={classes.ratio}>\n                    <>\n                      <span className={classes.numerator}>\n                        {formatToLocaleString(props.ratio[0], props.culture) as React.ReactNode}\n                      </span>\n                      /\n                      <span className={classes.denominator}>\n                        {formatToLocaleString(props.ratio[1], props.culture) as React.ReactNode}\n                      </span>\n                    </>\n                  </div>\n                )}\n              </div>\n              {!!props.descriptionMessage && (\n                <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>\n              )}\n            </div>\n          )}\n        </PopoverSurface>\n      </Popover>\n    </div>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _multiValueCallout() {\n    const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(props.YValueHover) ?? false;\n    return (\n      <div className={classes.calloutContentRoot}>\n        <div\n          className={classes.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={classes.calloutContentX}\n            {...getAccessibleDataObject(props!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {formatToLocaleString(props!.hoverXValue, props.culture) as React.ReactNode}\n          </div>\n        </div>\n        <div style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n          {props!.YValueHover &&\n            props!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n              const isLast: boolean = index + 1 === yValues.length;\n              const shouldDrawBorderBottom = isLast ? false : yValue.shouldDrawBorderBottom ?? false;\n              return (\n                <div\n                  {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                  key={`callout-content-${index}`}\n                  style={\n                    yValueHoverSubCountsExists\n                      ? {\n                          display: 'inline-block',\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!props.descriptionMessage && <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>}\n        </div>\n      </div>\n    );\n  }\n\n  function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]): boolean | undefined {\n    return (\n      yValueHover &&\n      yValueHover.some(\n        (yValue: {\n          legend?: string;\n          y?: number;\n          color?: string;\n          yAxisCalloutData?: string | { [id: string]: number };\n        }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n      )\n    );\n  }\n\n  function _getCalloutContent(\n    xValue: YValueHover,\n    index: number,\n    yValueHoverSubCountsExists: boolean,\n    isLast: boolean,\n  ): React.ReactNode {\n    const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n    const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n    const { culture } = props;\n    const yValue = formatToLocaleString(xValue.y, culture) as React.ReactNode;\n    if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n      return (\n        <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n          {yValueHoverSubCountsExists && (\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n          )}\n          <div\n            id={`${index}_${xValue.y}`}\n            className={classes.calloutBlockContainer}\n            style={{\n              ...(!toDrawShape\n                ? {\n                    borderInlineStart: `4px solid ${xValue.color}`,\n                  }\n                : {}),\n            }}\n          >\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: classes.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div\n              className={mergeClasses(\n                classes.calloutBlockContainer,\n                toDrawShape\n                  ? classes.calloutBlockContainertoDrawShapetrue\n                  : classes.calloutBlockContainertoDrawShapefalse,\n              )}\n              style={{ marginTop: xValue ? '13px' : 'unset' }}\n            >\n              <div className={classes.calloutlegendText}> {xValue.legend}</div>\n              <div className={classes.calloutContentY} style={{ direction: 'ltr', unicodeBidi: 'isolate' }}>\n                {\n                  formatToLocaleString(\n                    xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y ?? xValue.data,\n                    culture,\n                  ) as React.ReactNode\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      );\n    } else {\n      const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n      return (\n        <div style={marginStyle}>\n          <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n            {xValue.legend!} ({yValue})\n          </div>\n          {Object.keys(subcounts).map((subcountName: string) => {\n            return (\n              <div key={subcountName} className={classes.calloutBlockContainer}>\n                <div className={classes.calloutlegendText}>\n                  {' '}\n                  {formatToLocaleString(subcountName, culture) as React.ReactNode}\n                </div>\n                <div\n                  className={classes.calloutContentY}\n                  style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                >\n                  {formatToLocaleString(subcounts[subcountName], culture) as React.ReactNode}\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      );\n    }\n  }\n});\nChartPopover.displayName = 'ChartPopover';\n"],"names":["React","Popover","PopoverSurface","mergeClasses","tokens","useId","getAccessibleDataObject","Points","pointTypes","formatToLocaleString","Shape","usePopoverStyles_unstable","ChartPopover","forwardRef","props","forwardedRef","virtualElement","getBoundingClientRect","top","clickPosition","y","left","x","right","bottom","width","height","target","positioning","customCallout","customCalloutProps","classes","legend","xCalloutValue","YValue","yCalloutValue","div","id","ref","className","calloutContainer","autoSize","offset","coverTarget","open","isPopoverOpen","inline","customizedCallout","isCalloutForStack","_multiValueCallout","calloutContentRoot","calloutDateTimeContainer","calloutContentX","XValue","calloutInfoContainer","style","ratio","display","alignItems","borderInlineStart","color","marginTop","calloutBlockContainer","calloutlegendText","culture","calloutContentY","colorNeutralForeground1","fontSize","fontSizeHero700","span","numerator","denominator","descriptionMessage","_yValueHoverSubCountsExists","yValueHoverSubCountsExists","YValueHover","marginBottom","xAxisCalloutAccessibilityData","hoverXValue","map","yValue","index","yValues","isLast","length","shouldDrawBorderBottom","callOutAccessibilityData","key","borderBottom","colorNeutralStroke2","paddingBottom","_getCalloutContent","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","svgProps","shapeStyles","pathProps","fill","shape","Object","keys","calloutBlockContainertoDrawShapetrue","calloutBlockContainertoDrawShapefalse","direction","unicodeBidi","data","subcounts","subcountName","displayName"],"mappings":"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"}

package/lib/components/CommonComponents/ChartPopover.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/ChartPopover.types.ts"],"sourcesContent":["import type { JSXElement } from '@fluentui/react-utilities';\nimport { YValueHover } from '../../index';\n\nexport interface ChartPopoverProps {\n  clickPosition?: { x: number; y: number };\n  isPopoverOpen?: boolean;\n  xCalloutValue?: string;\n  legend?: string | number | Date;\n  yCalloutValue?: string;\n  YValue?: string | number | Date;\n  XValue?: string;\n  color?: string;\n  culture?: string;\n  customCallout?: {\n    customizedCallout?: JSXElement;\n    customCalloutProps?: ChartPopoverProps;\n  };\n  isCalloutForStack?: boolean;\n  xAxisCalloutAccessibilityData?: { ariaLabel?: string; data?: string };\n  hoverXValue?: string | number;\n  YValueHover?: YValueHover[];\n  descriptionMessage?: string;\n  ratio?: [number, number];\n  isCartesian?: boolean;\n  styles?: Partial<PopoverComponentStyles>;\n}\n\nexport interface PopoverComponentStyles {\n  calloutContentRoot: string;\n  calloutDateTimeContainer: string;\n  calloutContentX: string;\n  calloutBlockContainer: string;\n  calloutBlockContainertoDrawShapefalse: string;\n  calloutBlockContainertoDrawShapetrue: string;\n  shapeStyles: string;\n  calloutlegendText: string;\n  calloutContentY: string;\n  descriptionMessage: string;\n  ratio: string;\n  numerator: string;\n  denominator: string;\n  calloutInfoContainer: string;\n  calloutContainer: string;\n}\n"],"names":[],"mappings":"AA2BA,WAgBC"}
+{"version":3,"sources":["../src/components/CommonComponents/ChartPopover.types.ts"],"sourcesContent":["import type { JSXElement } from '@fluentui/react-utilities';\nimport { YValueHover } from '../../index';\nimport { PositioningShorthand } from '@fluentui/react-positioning';\n\nexport interface ChartPopoverProps {\n  clickPosition?: { x: number; y: number };\n  isPopoverOpen?: boolean;\n  xCalloutValue?: string;\n  legend?: string | number | Date;\n  yCalloutValue?: string;\n  YValue?: string | number | Date;\n  XValue?: string;\n  color?: string;\n  culture?: string;\n  customCallout?: {\n    customizedCallout?: JSXElement;\n    customCalloutProps?: ChartPopoverProps;\n  };\n  isCalloutForStack?: boolean;\n  xAxisCalloutAccessibilityData?: { ariaLabel?: string; data?: string };\n  hoverXValue?: string | number;\n  YValueHover?: YValueHover[];\n  descriptionMessage?: string;\n  ratio?: [number, number];\n  isCartesian?: boolean;\n  styles?: Partial<PopoverComponentStyles>;\n  positioning?: PositioningShorthand;\n}\n\nexport interface PopoverComponentStyles {\n  calloutContentRoot: string;\n  calloutDateTimeContainer: string;\n  calloutContentX: string;\n  calloutBlockContainer: string;\n  calloutBlockContainertoDrawShapefalse: string;\n  calloutBlockContainertoDrawShapetrue: string;\n  shapeStyles: string;\n  calloutlegendText: string;\n  calloutContentY: string;\n  descriptionMessage: string;\n  ratio: string;\n  numerator: string;\n  denominator: string;\n  calloutInfoContainer: string;\n  calloutContainer: string;\n}\n"],"names":[],"mappings":"AA6BA,WAgBC"}

package/lib/components/CommonComponents/useCartesianChartStyles.styles.js

@@ -39,7 +39,8 @@ const useStyles = /*#__PURE__*/__styles({
     Beiy3e4: "f1vx9l62",
     B68tc82: 0,
     Bmxbyg5: 0,
-    Bpg54ce: "f1a3p1vp"
+    Bpg54ce: "f1a3p1vp",
+    fsow6f: ["f1o700av", "fes3tcz"]
   },
   chartWrapper: {
     B68tc82: 0,
@@ -135,7 +136,7 @@ const useStyles = /*#__PURE__*/__styles({
 }, {
   d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f22iagw{display:flex;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f1vx9l62{flex-direction:column;}", [".f1a3p1vp{overflow:hidden;}", {
     p: -1
-  }], [".f1enuhaj{overflow:auto;}", {
+  }], ".f1o700av{text-align:left;}", ".fes3tcz{text-align:right;}", [".f1enuhaj{overflow:auto;}", {
     p: -1
   }], ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fcpl73t{line-height:var(--lineHeightBase100);}", ".fmd4ok8{font-style:normal;}", ".f17mccla{text-align:center;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".fhuob2q{fill:var(--colorNeutralForeground1);}", ".fk6onyz text{fill:var(--colorNeutralForeground1);}", ".f17odlr9 text{font-family:var(--fontFamilyBase);}", ".f1wvrikb text{font-size:var(--fontSizeBase100);}", ".fidmvdy text{font-weight:var(--fontWeightSemibold);}", ".f1noc3f3 text{line-height:var(--lineHeightBase100);}", ".f44ebzg text{forced-color-adjust:auto;}", ".fkuun line{opacity:0.2;}", ".f1u7a78k line{stroke:var(--colorNeutralForeground1);}", ".f1myyn02 line{width:1px;}", ".f1oca6e6 line{forced-color-adjust:auto;}", ".f1x8lysa path{display:none;}", ".f1j2g1si g{text-anchor:end;}", ".f9das1l{opacity:0.1;}", ".f158kwzp{cursor:default;}", ".frnwi6n{margin-top:var(--spacingVerticalS);}", ".ff3wqvv{margin-left:var(--spacingHorizontalXL);}", ".f1l2akhw{margin-right:var(--spacingHorizontalXL);}", ".f5q6cfr{fill:var(--colorNeutralBackground1);}", ".f17mpqex{padding-top:var(--spacingHorizontalS);}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".fdvome7{padding-bottom:var(--spacingHorizontalS);}", ".f1euv43f{position:absolute;}", ".fr6rvge{top:var(--spacingVerticalNone);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", [".fq9zq91{border-radius:var(--borderRadiusSmall);}", {
     p: -1

package/lib/components/CommonComponents/useCartesianChartStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","tokens","typographyStyles","HighContrastSelector","useRtl","getAxisTitleStyle","getTooltipStyle","cartesianchartClassNames","root","chartWrapper","axisTitle","xAxis","yAxis","opacityChangeOnHover","legendContainer","svgTooltip","shapeStyles","descriptionMessage","hover","tooltip","axisAnnotation","chartTitle","chart","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","a9b677","Bqenvij","Beiy3e4","B68tc82","Bmxbyg5","Bpg54ce","B80ckks","fsow6f","sj55zd","Bkfmm31","a6j6cd","Bifops1","lr70ht","D01gh","vxuu72","lclgl4","zp1vxd","jxu3ei","B3i31d3","Bhcy8il","z3m6do","se2xxg","rtl","Bkw34lo","ltr","abs64n","Bceei9c","B6of3ja","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","Bhzewxz","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","d","p","m","useCartesianChartStyles","props","_props_styles","_props_reflowProps","_props_styles1","_props_styles2","_props_styles3","_useRtl","baseStyles","styles","reflowProps","mode"],"sources":["useCartesianChartStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { HighContrastSelector, useRtl } from '../../utilities/utilities';\nimport { getAxisTitleStyle, getTooltipStyle } from '../../utilities/index';\n/**\n * @internal\n */ export const cartesianchartClassNames = {\n    root: 'fui-cart__root',\n    chartWrapper: 'fui-cart__chartWrapper',\n    axisTitle: 'fui-cart__axisTitle',\n    xAxis: 'fui-cart__xAxis',\n    yAxis: 'fui-cart__yAxis',\n    opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',\n    legendContainer: 'fui-cart__legendContainer',\n    svgTooltip: 'fui-cart_svgTooltip',\n    shapeStyles: 'fui-cart__shapeStyles',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    hover: 'fui-cart__hover',\n    tooltip: 'fui-cart__tooltip',\n    axisAnnotation: 'fui-cart__axisAnnotation',\n    chartTitle: 'fui-cart__chartTitle',\n    chart: 'fui-cart__chart'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        ...typographyStyles.body1,\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden'\n    },\n    chartWrapper: {\n        overflow: 'auto'\n    },\n    axisTitle: getAxisTitleStyle(),\n    axisAnnotation: getAxisTitleStyle(),\n    xAxis: {\n        '& text': {\n            fill: tokens.colorNeutralForeground1,\n            ...typographyStyles.caption2Strong,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            width: '1px',\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    yAxis: {\n        '& text': {\n            ...typographyStyles.caption2Strong,\n            fill: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    rtl: {\n        '& g': {\n            textAnchor: 'end'\n        }\n    },\n    ltr: {},\n    opacityChangeOnHover: {\n        opacity: '0.1',\n        cursor: 'default'\n    },\n    legendContainer: {\n        marginTop: tokens.spacingVerticalS,\n        marginLeft: tokens.spacingHorizontalXL\n    },\n    svgTooltip: {\n        fill: tokens.colorNeutralBackground1,\n        [HighContrastSelector]: {\n            fill: 'Canvas'\n        }\n    },\n    tooltip: getTooltipStyle()\n});\n/**\n *\n * Apply styling to the Carousel slots based on the state\n */ export const useCartesianChartStyles = (props)=>{\n    var _props_styles, _props_reflowProps, _props_styles1, _props_styles2, _props_styles3;\n    const _useRtl = useRtl();\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(cartesianchartClassNames.root, baseStyles.root, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        chartWrapper: mergeClasses(cartesianchartClassNames.chartWrapper, ((_props_reflowProps = props.reflowProps) === null || _props_reflowProps === void 0 ? void 0 : _props_reflowProps.mode) === 'min-width' ? baseStyles.chartWrapper : '', (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.chartWrapper),\n        axisTitle: mergeClasses(cartesianchartClassNames.axisTitle, baseStyles.axisTitle /*props.styles?.axisTitle*/ ),\n        xAxis: mergeClasses(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),\n        yAxis: mergeClasses(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),\n        opacityChangeOnHover: mergeClasses(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n        legendContainer: mergeClasses(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ ),\n        svgTooltip: mergeClasses(cartesianchartClassNames.svgTooltip, baseStyles.svgTooltip, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.svgTooltip),\n        tooltip: mergeClasses(cartesianchartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n        axisAnnotation: mergeClasses(cartesianchartClassNames.axisAnnotation, baseStyles.axisAnnotation),\n        chart: mergeClasses(cartesianchartClassNames.chart, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chart)\n    };\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__styles","mergeClasses","tokens","typographyStyles","HighContrastSelector","useRtl","getAxisTitleStyle","getTooltipStyle","cartesianchartClassNames","root","chartWrapper","axisTitle","xAxis","yAxis","opacityChangeOnHover","legendContainer","svgTooltip","shapeStyles","descriptionMessage","hover","tooltip","axisAnnotation","chartTitle","chart","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","a9b677","Bqenvij","Beiy3e4","B68tc82","Bmxbyg5","Bpg54ce","fsow6f","B80ckks","sj55zd","Bkfmm31","a6j6cd","Bifops1","lr70ht","D01gh","vxuu72","lclgl4","zp1vxd","jxu3ei","B3i31d3","Bhcy8il","z3m6do","se2xxg","rtl","Bkw34lo","ltr","abs64n","Bceei9c","B6of3ja","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","qhf8xq","Bhzewxz","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bkecrkj","d","p","m","useCartesianChartStyles","props","_props_styles","_props_reflowProps","_props_styles1","_props_styles2","_props_styles3","_useRtl","baseStyles","styles","reflowProps","mode"],"sources":["useCartesianChartStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { HighContrastSelector, useRtl } from '../../utilities/utilities';\nimport { getAxisTitleStyle, getTooltipStyle } from '../../utilities/index';\n/**\n * @internal\n */ export const cartesianchartClassNames = {\n    root: 'fui-cart__root',\n    chartWrapper: 'fui-cart__chartWrapper',\n    axisTitle: 'fui-cart__axisTitle',\n    xAxis: 'fui-cart__xAxis',\n    yAxis: 'fui-cart__yAxis',\n    opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',\n    legendContainer: 'fui-cart__legendContainer',\n    svgTooltip: 'fui-cart_svgTooltip',\n    shapeStyles: 'fui-cart__shapeStyles',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    hover: 'fui-cart__hover',\n    tooltip: 'fui-cart__tooltip',\n    axisAnnotation: 'fui-cart__axisAnnotation',\n    chartTitle: 'fui-cart__chartTitle',\n    chart: 'fui-cart__chart'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        ...typographyStyles.body1,\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden',\n        textAlign: 'left'\n    },\n    chartWrapper: {\n        overflow: 'auto'\n    },\n    axisTitle: getAxisTitleStyle(),\n    axisAnnotation: getAxisTitleStyle(),\n    xAxis: {\n        '& text': {\n            fill: tokens.colorNeutralForeground1,\n            ...typographyStyles.caption2Strong,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            width: '1px',\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    yAxis: {\n        '& text': {\n            ...typographyStyles.caption2Strong,\n            fill: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    rtl: {\n        '& g': {\n            textAnchor: 'end'\n        }\n    },\n    ltr: {},\n    opacityChangeOnHover: {\n        opacity: '0.1',\n        cursor: 'default'\n    },\n    legendContainer: {\n        marginTop: tokens.spacingVerticalS,\n        marginLeft: tokens.spacingHorizontalXL\n    },\n    svgTooltip: {\n        fill: tokens.colorNeutralBackground1,\n        [HighContrastSelector]: {\n            fill: 'Canvas'\n        }\n    },\n    tooltip: getTooltipStyle()\n});\n/**\n *\n * Apply styling to the Carousel slots based on the state\n */ export const useCartesianChartStyles = (props)=>{\n    var _props_styles, _props_reflowProps, _props_styles1, _props_styles2, _props_styles3;\n    const _useRtl = useRtl();\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(cartesianchartClassNames.root, baseStyles.root, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        chartWrapper: mergeClasses(cartesianchartClassNames.chartWrapper, ((_props_reflowProps = props.reflowProps) === null || _props_reflowProps === void 0 ? void 0 : _props_reflowProps.mode) === 'min-width' ? baseStyles.chartWrapper : '', (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.chartWrapper),\n        axisTitle: mergeClasses(cartesianchartClassNames.axisTitle, baseStyles.axisTitle /*props.styles?.axisTitle*/ ),\n        xAxis: mergeClasses(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),\n        yAxis: mergeClasses(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),\n        opacityChangeOnHover: mergeClasses(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n        legendContainer: mergeClasses(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ ),\n        svgTooltip: mergeClasses(cartesianchartClassNames.svgTooltip, baseStyles.svgTooltip, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.svgTooltip),\n        tooltip: mergeClasses(cartesianchartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),\n        axisAnnotation: mergeClasses(cartesianchartClassNames.axisAnnotation, baseStyles.axisAnnotation),\n        chart: mergeClasses(cartesianchartClassNames.chart, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chart)\n    };\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js

@@ -31,7 +31,8 @@ import { getAxisTitleStyle, getTooltipStyle } from '../../utilities/index';
         width: '100%',
         height: '100%',
         flexDirection: 'column',
-        overflow: 'hidden'
+        overflow: 'hidden',
+        textAlign: 'left'
     },
     chartWrapper: {
         overflow: 'auto'