@fluentui/react-charts 9.2.1 → 9.2.2

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

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

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { LegendsProps } from '../Legends/index';\nimport {\n  AccessibilityProps,\n  Chart,\n  Margins,\n  DataPoint,\n  HorizontalBarChartWithAxisDataPoint,\n  GroupedVerticalBarChartData,\n  HeatMapChartDataPoint,\n  LineChartPoints,\n  VerticalBarChartDataPoint,\n  VerticalStackedBarDataPoint,\n  ScatterChartDataPoint,\n  GanttChartDataPoint,\n  AxisCategoryOrder,\n} from '../../types/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\nimport { ChartTypes, IAxisData, IDomainNRange, IYAxisParams, XAxisTypes, YAxisType } from '../../utilities/utilities';\nimport { ScaleBand, ScaleLinear } from 'd3-scale';\n/**\n * Cartesian Chart style properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyleProps {\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Width of the chart.\n   */\n  width?: number;\n\n  /**\n   * Height of the chart.\n   */\n  height?: number;\n\n  /**\n   * Color of the chart.\n   */\n  color?: string;\n\n  /**\n   * Link to redirect if click action for graph\n   */\n  href?: string;\n\n  /**\n   * prop to check if the chart is selected or hovered upon to determine opacity\n   */\n  shouldHighlight?: boolean;\n\n  /**\n   * prop to check if the Page is in Rtl\n   */\n  useRtl?: boolean;\n\n  /**\n   * color of the line\n   */\n  lineColor?: string;\n\n  /**\n   * boolean flag which determines if shape is drawn in callout\n   */\n  toDrawShape?: boolean;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n}\n\n/**\n * Cartesian Chart styles\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyles {\n  /**\n   *  Style for the root element.\n   */\n  root?: string;\n\n  /**\n   * Style for the element containing the x-axis.\n   */\n  xAxis?: string;\n\n  /**\n   * Style for the element containing the y-axis.\n   */\n  yAxis?: string;\n\n  /**\n   * Style for legend container\n   */\n  legendContainer?: string;\n\n  /**\n   * line hover box css\n   */\n  hover?: string;\n\n  /**\n   * styles for description message\n   */\n  descriptionMessage?: string;\n\n  /**\n   * styles for tooltip\n   */\n  tooltip?: string;\n\n  /**\n   * styles for tooltip\n   */\n  axisTitle?: string;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle?: string;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover?: string;\n\n  /**\n   * styles for the shape object in the callout\n   */\n  shapeStyles?: string;\n\n  /**\n   * Styles for the chart wrapper div\n   */\n  chartWrapper?: string;\n\n  /**\n   * Styles for the svg tooltip\n   */\n  svgTooltip?: string;\n\n  /**\n   * Styles for the chart svg element\n   */\n  chart?: string;\n}\n\n/**\n * Cartesian Chart properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartProps {\n  /**\n   * Below height used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  height?: number;\n\n  /**\n   * Below width used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  width?: number;\n\n  /**\n   * this prop takes its parent as a HTML element to define the width and height of the chart\n   */\n  parentRef?: HTMLElement | null;\n\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Margins for the chart\n   * @default `{ top: 20, bottom: 35, left: 40, right: 20 }`\n   * To avoid edge cuttings to the chart, we recommend you use default values or greater then default values\n   */\n  margins?: Margins;\n\n  /** decides wether to show/hide legends\n   * @defaultvalue false\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Do not show tooltips in chart\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * this prop takes values that you want the chart to render on x-axis\n   * This is a optional parameter if not specified D3 will decide which values appear on the x-axis for you\n   * Please look at https://github.com/d3/d3-scale for more information on how D3 decides what data to appear on the axis of chart\n   */\n  tickValues?: number[] | Date[] | string[] | undefined;\n\n  /**\n   * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'\n   * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis\n   * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.\n   */\n  tickFormat?: string;\n\n  /**\n   * Width of line stroke\n   */\n  strokeWidth?: number;\n\n  /**\n   * x Axis labels tick padding. This defines the gap between tick labels and tick lines.\n   * @default 10\n   */\n  xAxisTickPadding?: number;\n\n  /**\n   * the format in for the data on y-axis. For data object this can be specified to your requirement.\n   *  Eg: d3.format(\".0%\")(0.123),d3.format(\"+20\")(42);\n   * Please look at https://github.com/d3/d3-format for all the formats supported\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yAxisTickFormat?: any;\n\n  /**\n   * Secondary y-scale options\n   * By default this is not defined, meaning there will be no secondary y-scale.\n   */\n  secondaryYScaleOptions?: {\n    /** Minimum value (0 by default) */\n    yMinValue?: number;\n    /** Maximum value (100 by default) */\n    yMaxValue?: number;\n  };\n\n  /**\n   * minimum  data value point in y-axis\n   */\n  yMinValue?: number;\n\n  /**\n   * maximum data value point in y-axis\n   */\n  yMaxValue?: number;\n\n  /**\n   * maximum data value point in x-axis\n   */\n  xMaxValue?: number;\n\n  /**\n   * Number of ticks on the y-axis.\n   * Tick count should be factor of difference between (yMinValue, yMaxValue)?\n   * @default 4\n   */\n  yAxisTickCount?: number;\n\n  /**\n   * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.\n   * Does not work for string axis.\n   * @default 6\n   */\n  xAxisTickCount?: number;\n\n  /**\n   * define the size of the tick lines on the x-axis\n   * @default 10\n   */\n  xAxistickSize?: number;\n\n  /**\n   * defines the space between the tick line and the data label\n   * @default 10\n   */\n  tickPadding?: number;\n\n  /**\n   * Url that the data-viz needs to redirect to upon clicking on it\n   */\n  href?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /**\n   * Enable the legends to wrap lines if there is not enough space to show all legends on a single line\n   */\n  enabledLegendsWrapLines?: boolean;\n\n  /*\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<LegendsProps>;\n\n  /**\n   *@default false\n   *Used for to elipse x axis labes and show tooltip on x axis labels\n   */\n  showXAxisLablesTooltip?: boolean;\n\n  /**\n   * @default 4\n   * Used for X axis labels\n   * While Giving showXAxisLablesTooltip prop, need to define after how many chars, we need to truncate the word.\n   */\n  noOfCharsToTruncate?: number;\n\n  /**\n   * @default false\n   * Used to wrap x axis labels values (whole value)\n   */\n  wrapXAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to rotate x axis labels by 45 degrees\n   */\n  rotateXAxisLables?: boolean;\n\n  /**\n   * The prop used to define the date time localization options\n   */\n  dateLocalizeOptions?: Intl.DateTimeFormatOptions;\n\n  /**\n   * The prop used to define a custom locale for the date time format.\n   */\n  timeFormatLocale?: TimeLocaleDefinition;\n\n  /**\n   * The prop used to define a custom datetime formatter for date axis.\n   */\n  customDateTimeFormatter?: (dateTime: Date) => string;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: CartesianChartStyles;\n\n  /**\n   * Callout customization props\n   */\n  calloutProps?: Partial<ChartPopoverProps>;\n\n  /**\n   * props for the svg; use this to include aria-* or other attributes on the tag\n   */\n  svgProps?: React.SVGProps<SVGSVGElement>;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n\n  /**\n   * Props related to reflow behavior of the chart\n   */\n  reflowProps?: {\n    /**\n     * Determines the reflow behavior of the chart.\n     * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.\n     * @default 'none'\n     */\n    mode: 'none' | 'min-width';\n  };\n\n  /**\n   * Prop to set the x axis title\n   * @default undefined\n   * Minimum bottom margin required for x axis title is 55px\n   */\n\n  xAxisTitle?: string;\n\n  /**\n   * Prop to set the y axis title\n   * @default undefined\n   * Minimum left margin required for y axis title is 60px and for RTL is 40px\n   * Minimum right margin required for y axis title is 40px and for RTL is 60px\n   */\n  yAxisTitle?: string;\n\n  /**\n   * Prop to set the secondary y axis title\n   * @default undefined\n   * If RTL is enabled, minimum left and right margins required for secondary y axis title is 60px\n   */\n  secondaryYAxistitle?: string;\n\n  /**\n   * Whether to use UTC time for axis scale, ticks, and the time display in callouts.\n   * When set to `true`, time is displayed equally, regardless of the user's timezone settings.\n   * @default true\n   */\n  useUTC?: string | boolean;\n\n  /**\n   * @default false\n   * The prop used to decide rounded ticks on y axis\n   */\n  roundedTicks?: boolean;\n\n  /**\n   * Determines whether overlapping x-axis tick labels should be hidden.\n   * @default true\n   */\n  hideTickOverlap?: boolean;\n\n  /**\n   * Define a custom callout props override\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  calloutPropsPerDataPoint?: (dataPointCalloutProps: any) => ChartPopoverProps;\n\n  /**\n   * Optional callback to access the Chart interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.RefObject<Chart>;\n\n  /**\n   * Prop to set the x axis annotation. Used to display additional information on the x-axis.\n   * This is shown on the top of the chart.\n   * @default undefined\n   */\n  xAxisAnnotation?: string;\n\n  /**\n   * Prop to set the y axis annotation. Used to display additional information on the y-axis.\n   * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.\n   * @default undefined\n   */\n  yAxisAnnotation?: string;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the x-axis.\n   * @default 'default'\n   */\n  xAxisCategoryOrder?: AxisCategoryOrder;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the y-axis.\n   * @default 'default'\n   */\n  yAxisCategoryOrder?: AxisCategoryOrder;\n}\n\nexport interface YValueHover {\n  legend?: string;\n  y?: number;\n  color?: string;\n  data?: string | number;\n  shouldDrawBorderBottom?: boolean;\n  yAxisCalloutData?: string | { [id: string]: number };\n  index?: number;\n  callOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface ChildProps {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  xScale?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScalePrimary?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScaleSecondary?: any;\n  containerHeight?: number;\n  containerWidth?: number;\n  optimizeLargeData?: boolean;\n}\n\n// Only used for Cartesian chart base\nexport interface ModifiedCartesianChartProps extends CartesianChartProps {\n  /**\n   * Define the chart title\n   */\n  chartTitle?: string;\n\n  /**\n   * Only used for Area chart\n   * Value used to draw y axis of that chart.\n   */\n  maxOfYVal?: number;\n\n  /**\n   * Data of the chart\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  points: any;\n\n  /**\n   * Define type of the chart\n   */\n  chartType: ChartTypes;\n\n  /** X axis type */\n  xAxisType: XAxisTypes;\n\n  /** Y axis type */\n  yAxisType?: YAxisType;\n\n  /**\n   * Legends of the chart.\n   */\n  legendBars: JSX.Element | null;\n\n  /**\n   * Callout props\n   */\n  calloutProps?: ChartPopoverProps;\n\n  /**\n   * Callback method used for to get margins to the chart.\n   */\n  getmargins?: (margins: Margins) => void;\n\n  /**\n   * This is a call back method to the chart from cartesian chart.\n   * params are xScale, yScale, containerHeight, containerWidth. These values were used to draw the graph.\n   * It also contians an optional param xAxisElement - defines as x axis scale element.\n   * This param used to enable feature word wrap of Xaxis.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getGraphData?: any;\n\n  /**\n   * Used for bar chart graphs.\n   * To define width of the bar\n   */\n  barwidth?: number;\n\n  /**\n   * Used for tick styles of the x axis of the chart\n   * Tick params are applicable for date axis only.\n   */\n  tickParams?: {\n    tickValues?: number[] | Date[] | string[];\n    tickFormat?: string;\n  };\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  xAxisPadding?: number;\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  yAxisPadding?: number;\n\n  /**\n   * Children elements specific to derived chart types.\n   */\n  children(props: ChildProps): React.ReactNode;\n\n  /**\n   * To enable callout for individual bar or complete stack. Using for only Vertical stacked bar chart.\n   * @default false\n   * @type \\{boolean \\}\n   */\n  isCalloutForStack?: boolean;\n\n  /** dataset values to find out domain of the String axis\n   * Present using for only vertical stacked bar chart and grouped vertical bar chart\n   */\n  datasetForXAxisDomain?: string[];\n\n  /** Own callout design */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  customizedCallout?: any;\n\n  /**\n   * if the data points for the y-axis is of type string, then we need to give this\n   * prop to construct the y-axis\n   */\n  stringDatasetForYAxisDomain?: string[];\n\n  /**\n   * The prop used to define the culture to localize the numbers and date\n   */\n  culture?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getAxisData?: any;\n\n  /**\n   * Callback method used when mouse leaves the chart boundary.\n   */\n  onChartMouseLeave?: () => void;\n\n  /** Callback method to get extra margins for domain */\n  getDomainMargins?: (containerWidth: number) => Margins;\n\n  /** Callback method to get extra margins for Y-axis domain */\n  getYDomainMargins?: (containerHeight: number) => Margins;\n\n  /** Padding between each bar/line-point */\n  xAxisInnerPadding?: number;\n\n  /** Padding before first bar/line-point and after last bar/line-point */\n  xAxisOuterPadding?: number;\n\n  /**\n   *@default false\n   *Used for to elipse y axis labes and show tooltip on x axis labels\n   */\n  showYAxisLablesTooltip?: boolean;\n\n  /**\n   *@default false\n   *Used for showing complete y axis lables   */\n  showYAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to control the first render cycle Performance optimization code.\n   */\n  enableFirstRenderOptimization?: boolean;\n\n  /**\n   * Get the min and max values of the y-axis\n   */\n  getMinMaxOfYAxis: (\n    points:\n      | LineChartPoints[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | VerticalBarChartDataPoint[]\n      | DataPoint[]\n      | ScatterChartDataPoint[]\n      | GanttChartDataPoint[],\n    yAxisType: YAxisType | undefined,\n    useSecondaryYScale?: boolean,\n  ) => { startValue: number; endValue: number };\n\n  /**\n   * Create the y-axis\n   */\n  createYAxis: (\n    yAxisParams: IYAxisParams,\n    isRtl: boolean,\n    axisData: IAxisData,\n    isIntegralDataset: boolean,\n    chartType: ChartTypes,\n    useSecondaryYScale?: boolean,\n    roundedTicks?: boolean,\n  ) => ScaleLinear<number, number, never>;\n\n  /**\n   * Get the domain and range values\n   */\n  getDomainNRangeValues: (\n    points:\n      | LineChartPoints[]\n      | VerticalBarChartDataPoint[]\n      | VerticalStackedBarDataPoint[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | GroupedVerticalBarChartData[]\n      | HeatMapChartDataPoint[]\n      | GanttChartDataPoint[],\n    margins: Margins,\n    width: number,\n    chartType: ChartTypes,\n    isRTL: boolean,\n    xAxisType: XAxisTypes,\n    barWidth: number,\n    tickValues: Date[] | number[] | string[] | undefined,\n    shiftX: number,\n  ) => IDomainNRange;\n\n  /**\n   * Create the string y-axis\n   */\n  createStringYAxis: (\n    yAxisParams: IYAxisParams,\n    dataPoints: string[],\n    isRtl: boolean,\n    barWidth: number | undefined,\n    chartType?: ChartTypes,\n  ) => ScaleBand<string>;\n\n  /**\n   * Controls whether the numeric x-axis domain should be extended to start and end at nice rounded values.\n   * @default true\n   */\n  showRoundOffXTickValues?: boolean;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { LegendsProps } from '../Legends/index';\nimport {\n  AccessibilityProps,\n  Chart,\n  Margins,\n  DataPoint,\n  HorizontalBarChartWithAxisDataPoint,\n  GroupedVerticalBarChartData,\n  HeatMapChartDataPoint,\n  LineChartPoints,\n  VerticalBarChartDataPoint,\n  VerticalStackedBarDataPoint,\n  ScatterChartDataPoint,\n  GanttChartDataPoint,\n  AxisCategoryOrder,\n} from '../../types/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\nimport { ChartTypes, IAxisData, IDomainNRange, IYAxisParams, XAxisTypes, YAxisType } from '../../utilities/utilities';\nimport { ScaleBand, ScaleLinear } from 'd3-scale';\n/**\n * Cartesian Chart style properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyleProps {\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Width of the chart.\n   */\n  width?: number;\n\n  /**\n   * Height of the chart.\n   */\n  height?: number;\n\n  /**\n   * Color of the chart.\n   */\n  color?: string;\n\n  /**\n   * Link to redirect if click action for graph\n   */\n  href?: string;\n\n  /**\n   * prop to check if the chart is selected or hovered upon to determine opacity\n   */\n  shouldHighlight?: boolean;\n\n  /**\n   * prop to check if the Page is in Rtl\n   */\n  useRtl?: boolean;\n\n  /**\n   * color of the line\n   */\n  lineColor?: string;\n\n  /**\n   * boolean flag which determines if shape is drawn in callout\n   */\n  toDrawShape?: boolean;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n}\n\n/**\n * Cartesian Chart styles\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyles {\n  /**\n   *  Style for the root element.\n   */\n  root?: string;\n\n  /**\n   * Style for the element containing the x-axis.\n   */\n  xAxis?: string;\n\n  /**\n   * Style for the element containing the y-axis.\n   */\n  yAxis?: string;\n\n  /**\n   * Style for legend container\n   */\n  legendContainer?: string;\n\n  /**\n   * line hover box css\n   */\n  hover?: string;\n\n  /**\n   * styles for description message\n   */\n  descriptionMessage?: string;\n\n  /**\n   * styles for tooltip\n   */\n  tooltip?: string;\n\n  /**\n   * styles for tooltip\n   */\n  axisTitle?: string;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle?: string;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover?: string;\n\n  /**\n   * styles for the shape object in the callout\n   */\n  shapeStyles?: string;\n\n  /**\n   * Styles for the chart wrapper div\n   */\n  chartWrapper?: string;\n\n  /**\n   * Styles for the svg tooltip\n   */\n  svgTooltip?: string;\n\n  /**\n   * Styles for the chart svg element\n   */\n  chart?: string;\n}\n\n/**\n * Cartesian Chart properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartProps {\n  /**\n   * Below height used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  height?: number;\n\n  /**\n   * Below width used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  width?: number;\n\n  /**\n   * this prop takes its parent as a HTML element to define the width and height of the chart\n   */\n  parentRef?: HTMLElement | null;\n\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Margins for the chart\n   * @default `{ top: 20, bottom: 35, left: 40, right: 20 }`\n   * To avoid edge cuttings to the chart, we recommend you use default values or greater then default values\n   */\n  margins?: Margins;\n\n  /** decides wether to show/hide legends\n   * @defaultvalue false\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Do not show tooltips in chart\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * this prop takes values that you want the chart to render on x-axis\n   * This is a optional parameter if not specified D3 will decide which values appear on the x-axis for you\n   * Please look at https://github.com/d3/d3-scale for more information on how D3 decides what data to appear on the axis of chart\n   */\n  tickValues?: number[] | Date[] | string[] | undefined;\n\n  /**\n   * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'\n   * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis\n   * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.\n   */\n  tickFormat?: string;\n\n  /**\n   * Width of line stroke\n   */\n  strokeWidth?: number;\n\n  /**\n   * x Axis labels tick padding. This defines the gap between tick labels and tick lines.\n   * @default 10\n   */\n  xAxisTickPadding?: number;\n\n  /**\n   * the format in for the data on y-axis. For data object this can be specified to your requirement.\n   *  Eg: d3.format(\".0%\")(0.123),d3.format(\"+20\")(42);\n   * Please look at https://github.com/d3/d3-format for all the formats supported\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yAxisTickFormat?: any;\n\n  /**\n   * Secondary y-scale options\n   * By default this is not defined, meaning there will be no secondary y-scale.\n   */\n  secondaryYScaleOptions?: {\n    /** Minimum value (0 by default) */\n    yMinValue?: number;\n    /** Maximum value (100 by default) */\n    yMaxValue?: number;\n  };\n\n  /**\n   * minimum  data value point in y-axis\n   */\n  yMinValue?: number;\n\n  /**\n   * maximum data value point in y-axis\n   */\n  yMaxValue?: number;\n\n  /**\n   * maximum data value point in x-axis\n   */\n  xMaxValue?: number;\n\n  /**\n   * Number of ticks on the y-axis.\n   * Tick count should be factor of difference between (yMinValue, yMaxValue)?\n   * @default 4\n   */\n  yAxisTickCount?: number;\n\n  /**\n   * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.\n   * Does not work for string axis.\n   * @default 6\n   */\n  xAxisTickCount?: number;\n\n  /**\n   * define the size of the tick lines on the x-axis\n   * @default 10\n   */\n  xAxistickSize?: number;\n\n  /**\n   * defines the space between the tick line and the data label\n   * @default 10\n   */\n  tickPadding?: number;\n\n  /**\n   * Url that the data-viz needs to redirect to upon clicking on it\n   */\n  href?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /**\n   * Enable the legends to wrap lines if there is not enough space to show all legends on a single line\n   */\n  enabledLegendsWrapLines?: boolean;\n\n  /*\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<LegendsProps>;\n\n  /**\n   *@default false\n   *Used for to elipse x axis labes and show tooltip on x axis labels\n   */\n  showXAxisLablesTooltip?: boolean;\n\n  /**\n   * @default 4\n   * Used for X axis labels\n   * While Giving showXAxisLablesTooltip prop, need to define after how many chars, we need to truncate the word.\n   */\n  noOfCharsToTruncate?: number;\n\n  /**\n   * @default false\n   * Used to wrap x axis labels values (whole value)\n   */\n  wrapXAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to rotate x axis labels by 45 degrees\n   */\n  rotateXAxisLables?: boolean;\n\n  /**\n   * The prop used to define the date time localization options\n   */\n  dateLocalizeOptions?: Intl.DateTimeFormatOptions;\n\n  /**\n   * The prop used to define a custom locale for the date time format.\n   */\n  timeFormatLocale?: TimeLocaleDefinition;\n\n  /**\n   * The prop used to define a custom datetime formatter for date axis.\n   */\n  customDateTimeFormatter?: (dateTime: Date) => string;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: CartesianChartStyles;\n\n  /**\n   * Callout customization props\n   */\n  calloutProps?: Partial<ChartPopoverProps>;\n\n  /**\n   * props for the svg; use this to include aria-* or other attributes on the tag\n   */\n  svgProps?: React.SVGProps<SVGSVGElement>;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n\n  /**\n   * Props related to reflow behavior of the chart\n   */\n  reflowProps?: {\n    /**\n     * Determines the reflow behavior of the chart.\n     * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.\n     * @default 'none'\n     */\n    mode: 'none' | 'min-width';\n  };\n\n  /**\n   * Prop to set the x axis title\n   * @default undefined\n   * Minimum bottom margin required for x axis title is 55px\n   */\n\n  xAxisTitle?: string;\n\n  /**\n   * Prop to set the y axis title\n   * @default undefined\n   * Minimum left margin required for y axis title is 60px and for RTL is 40px\n   * Minimum right margin required for y axis title is 40px and for RTL is 60px\n   */\n  yAxisTitle?: string;\n\n  /**\n   * Prop to set the secondary y axis title\n   * @default undefined\n   * If RTL is enabled, minimum left and right margins required for secondary y axis title is 60px\n   */\n  secondaryYAxistitle?: string;\n\n  /**\n   * Whether to use UTC time for axis scale, ticks, and the time display in callouts.\n   * When set to `true`, time is displayed equally, regardless of the user's timezone settings.\n   * @default true\n   */\n  useUTC?: string | boolean;\n\n  /**\n   * @default false\n   * The prop used to decide rounded ticks on y axis\n   */\n  roundedTicks?: boolean;\n\n  /**\n   * Determines whether overlapping x-axis tick labels should be hidden.\n   * @default true\n   */\n  hideTickOverlap?: boolean;\n\n  /**\n   * Define a custom callout props override\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  calloutPropsPerDataPoint?: (dataPointCalloutProps: any) => ChartPopoverProps;\n\n  /**\n   * Optional callback to access the Chart interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.RefObject<Chart>;\n\n  /**\n   * Prop to set the x axis annotation. Used to display additional information on the x-axis.\n   * This is shown on the top of the chart.\n   * @default undefined\n   */\n  xAxisAnnotation?: string;\n\n  /**\n   * Prop to set the y axis annotation. Used to display additional information on the y-axis.\n   * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.\n   * @default undefined\n   */\n  yAxisAnnotation?: string;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the x-axis.\n   * @default 'default'\n   */\n  xAxisCategoryOrder?: AxisCategoryOrder;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the y-axis.\n   * @default 'default'\n   */\n  yAxisCategoryOrder?: AxisCategoryOrder;\n}\n\nexport interface YValueHover {\n  legend?: string;\n  y?: number;\n  color?: string;\n  data?: string | number;\n  shouldDrawBorderBottom?: boolean;\n  yAxisCalloutData?: string | { [id: string]: number };\n  index?: number;\n  callOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface ChildProps {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  xScale?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScalePrimary?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScaleSecondary?: any;\n  containerHeight?: number;\n  containerWidth?: number;\n  optimizeLargeData?: boolean;\n}\n\n// Only used for Cartesian chart base\nexport interface ModifiedCartesianChartProps extends CartesianChartProps {\n  /**\n   * Define the chart title\n   */\n  chartTitle?: string;\n\n  /**\n   * Only used for Area chart\n   * Value used to draw y axis of that chart.\n   */\n  maxOfYVal?: number;\n\n  /**\n   * Data of the chart\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  points: any;\n\n  /**\n   * Define type of the chart\n   */\n  chartType: ChartTypes;\n\n  /** X axis type */\n  xAxisType: XAxisTypes;\n\n  /** Y axis type */\n  yAxisType?: YAxisType;\n\n  /**\n   * Legends of the chart.\n   */\n  legendBars: JSXElement | null;\n\n  /**\n   * Callout props\n   */\n  calloutProps?: ChartPopoverProps;\n\n  /**\n   * Callback method used for to get margins to the chart.\n   */\n  getmargins?: (margins: Margins) => void;\n\n  /**\n   * This is a call back method to the chart from cartesian chart.\n   * params are xScale, yScale, containerHeight, containerWidth. These values were used to draw the graph.\n   * It also contians an optional param xAxisElement - defines as x axis scale element.\n   * This param used to enable feature word wrap of Xaxis.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getGraphData?: any;\n\n  /**\n   * Used for bar chart graphs.\n   * To define width of the bar\n   */\n  barwidth?: number;\n\n  /**\n   * Used for tick styles of the x axis of the chart\n   * Tick params are applicable for date axis only.\n   */\n  tickParams?: {\n    tickValues?: number[] | Date[] | string[];\n    tickFormat?: string;\n  };\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  xAxisPadding?: number;\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  yAxisPadding?: number;\n\n  /**\n   * Children elements specific to derived chart types.\n   */\n  children(props: ChildProps): React.ReactNode;\n\n  /**\n   * To enable callout for individual bar or complete stack. Using for only Vertical stacked bar chart.\n   * @default false\n   * @type \\{boolean \\}\n   */\n  isCalloutForStack?: boolean;\n\n  /** dataset values to find out domain of the String axis\n   * Present using for only vertical stacked bar chart and grouped vertical bar chart\n   */\n  datasetForXAxisDomain?: string[];\n\n  /** Own callout design */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  customizedCallout?: any;\n\n  /**\n   * if the data points for the y-axis is of type string, then we need to give this\n   * prop to construct the y-axis\n   */\n  stringDatasetForYAxisDomain?: string[];\n\n  /**\n   * The prop used to define the culture to localize the numbers and date\n   */\n  culture?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getAxisData?: any;\n\n  /**\n   * Callback method used when mouse leaves the chart boundary.\n   */\n  onChartMouseLeave?: () => void;\n\n  /** Callback method to get extra margins for domain */\n  getDomainMargins?: (containerWidth: number) => Margins;\n\n  /** Callback method to get extra margins for Y-axis domain */\n  getYDomainMargins?: (containerHeight: number) => Margins;\n\n  /** Padding between each bar/line-point */\n  xAxisInnerPadding?: number;\n\n  /** Padding before first bar/line-point and after last bar/line-point */\n  xAxisOuterPadding?: number;\n\n  /**\n   *@default false\n   *Used for to elipse y axis labes and show tooltip on x axis labels\n   */\n  showYAxisLablesTooltip?: boolean;\n\n  /**\n   *@default false\n   *Used for showing complete y axis lables   */\n  showYAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to control the first render cycle Performance optimization code.\n   */\n  enableFirstRenderOptimization?: boolean;\n\n  /**\n   * Get the min and max values of the y-axis\n   */\n  getMinMaxOfYAxis: (\n    points:\n      | LineChartPoints[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | VerticalBarChartDataPoint[]\n      | DataPoint[]\n      | ScatterChartDataPoint[]\n      | GanttChartDataPoint[],\n    yAxisType: YAxisType | undefined,\n    useSecondaryYScale?: boolean,\n  ) => { startValue: number; endValue: number };\n\n  /**\n   * Create the y-axis\n   */\n  createYAxis: (\n    yAxisParams: IYAxisParams,\n    isRtl: boolean,\n    axisData: IAxisData,\n    isIntegralDataset: boolean,\n    chartType: ChartTypes,\n    useSecondaryYScale?: boolean,\n    roundedTicks?: boolean,\n  ) => ScaleLinear<number, number, never>;\n\n  /**\n   * Get the domain and range values\n   */\n  getDomainNRangeValues: (\n    points:\n      | LineChartPoints[]\n      | VerticalBarChartDataPoint[]\n      | VerticalStackedBarDataPoint[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | GroupedVerticalBarChartData[]\n      | HeatMapChartDataPoint[]\n      | GanttChartDataPoint[],\n    margins: Margins,\n    width: number,\n    chartType: ChartTypes,\n    isRTL: boolean,\n    xAxisType: XAxisTypes,\n    barWidth: number,\n    tickValues: Date[] | number[] | string[] | undefined,\n    shiftX: number,\n  ) => IDomainNRange;\n\n  /**\n   * Create the string y-axis\n   */\n  createStringYAxis: (\n    yAxisParams: IYAxisParams,\n    dataPoints: string[],\n    isRtl: boolean,\n    barWidth: number | undefined,\n    chartType?: ChartTypes,\n  ) => ScaleBand<string>;\n\n  /**\n   * Controls whether the numeric x-axis domain should be extended to start and end at nice rounded values.\n   * @default true\n   */\n  showRoundOffXTickValues?: boolean;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/ChartPopover.types.ts"],"sourcesContent":["import { 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?: JSX.Element;\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":"AA0BA,WAgBC"}
+{"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"}

package/lib/components/DeclarativeChart/DeclarativeChart.js

@@ -4,7 +4,7 @@ import { tokens } from '@fluentui/react-theme';
 import { ThemeContext_unstable as V9ThemeContext } from '@fluentui/react-shared-contexts';
 import { webLightTheme } from '@fluentui/tokens';
 import * as d3Color from 'd3-color';
-import { correctYearMonth, transformPlotlyJsonToDonutProps, transformPlotlyJsonToVSBCProps, transformPlotlyJsonToScatterChartProps, transformPlotlyJsonToHorizontalBarWithAxisProps, transformPlotlyJsonToHeatmapProps, transformPlotlyJsonToSankeyProps, transformPlotlyJsonToGaugeProps, transformPlotlyJsonToGVBCProps, transformPlotlyJsonToVBCProps, projectPolarToCartesian } from './PlotlySchemaAdapter';
+import { correctYearMonth, transformPlotlyJsonToDonutProps, transformPlotlyJsonToVSBCProps, transformPlotlyJsonToScatterChartProps, transformPlotlyJsonToHorizontalBarWithAxisProps, transformPlotlyJsonToHeatmapProps, transformPlotlyJsonToSankeyProps, transformPlotlyJsonToGaugeProps, transformPlotlyJsonToGVBCProps, transformPlotlyJsonToVBCProps, transformPlotlyJsonToChartTableProps, projectPolarToCartesian } from './PlotlySchemaAdapter';
 import { DonutChart } from '../DonutChart/index';
 import { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';
 import { LineChart } from '../LineChart/index';
@@ -17,6 +17,7 @@ import { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';
 import { VerticalBarChart } from '../VerticalBarChart/index';
 import { ScatterChart } from '../ScatterChart/index';
 import { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';
+import { ChartTable } from '../ChartTable/index';
 const ResponsiveDonutChart = withResponsiveContainer(DonutChart);
 const ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);
 const ResponsiveLineChart = withResponsiveContainer(LineChart);
@@ -28,6 +29,7 @@ const ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);
 const ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);
 const ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);
 const ResponsiveScatterChart = withResponsiveContainer(ScatterChart);
+const ResponsiveChartTable = withResponsiveContainer(ChartTable);
 const useColorMapping = ()=>{
     const colorMap = React.useRef(new Map());
     return colorMap;
@@ -104,7 +106,7 @@ const useIsDarkTheme = ()=>{
             ...transformPlotlyJsonToScatterChartProps({
                 data: plotlyData,
                 layout: plotlyInput.layout
-            }, isAreaChart, colorMap, isDarkTheme),
+            }, isAreaChart, isScatterMarkers, colorMap, props.colorwayType, isDarkTheme),
             ...commonProps
         };
         if (isAreaChart) {
@@ -138,7 +140,7 @@ const useIsDarkTheme = ()=>{
         // Unsupported schema, render as VerticalStackedBarChart
         fallbackVSBC = true;
         return /*#__PURE__*/ React.createElement(ResponsiveVerticalStackedBarChart, {
-            ...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme, fallbackVSBC),
+            ...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme, fallbackVSBC),
             ...commonProps
         });
     };
@@ -163,22 +165,22 @@ const useIsDarkTheme = ()=>{
     switch(chart.type){
         case 'donut':
             return /*#__PURE__*/ React.createElement(ResponsiveDonutChart, {
-                ...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, isDarkTheme),
+                ...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
                 ...commonProps
             });
         case 'horizontalbar':
             return /*#__PURE__*/ React.createElement(ResponsiveHorizontalBarChartWithAxis, {
-                ...transformPlotlyJsonToHorizontalBarWithAxisProps(plotlyInputWithValidData, colorMap, isDarkTheme),
+                ...transformPlotlyJsonToHorizontalBarWithAxisProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
                 ...commonProps
             });
         case 'groupedverticalbar':
             return /*#__PURE__*/ React.createElement(ResponsiveGroupedVerticalBarChart, {
-                ...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme),
+                ...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
                 ...commonProps
             });
         case 'verticalstackedbar':
             return /*#__PURE__*/ React.createElement(ResponsiveVerticalStackedBarChart, {
-                ...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme),
+                ...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
                 ...commonProps
             });
         case 'heatmap':
@@ -189,17 +191,22 @@ const useIsDarkTheme = ()=>{
             });
         case 'sankey':
             return /*#__PURE__*/ React.createElement(ResponsiveSankeyChart, {
-                ...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, isDarkTheme),
+                ...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
                 ...commonProps
             });
         case 'gauge':
             return /*#__PURE__*/ React.createElement(ResponsiveGaugeChart, {
-                ...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, isDarkTheme),
+                ...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
                 ...commonProps
             });
         case 'verticalbar':
             return /*#__PURE__*/ React.createElement(ResponsiveVerticalBarChart, {
-                ...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme),
+                ...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
+                ...commonProps
+            });
+        case 'table':
+            return /*#__PURE__*/ React.createElement(ResponsiveChartTable, {
+                ...transformPlotlyJsonToChartTableProps(plotlyInputWithValidData, colorMap, isDarkTheme),
                 ...commonProps
             });
         // TODO: Add 'scatter' as a separate chart type
@@ -220,3 +227,6 @@ const useIsDarkTheme = ()=>{
     }
 });
 DeclarativeChart.displayName = 'DeclarativeChart';
+DeclarativeChart.defaultProps = {
+    colorwayType: 'default'
+};

package/lib/components/DeclarativeChart/DeclarativeChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DeclarativeChart/DeclarativeChart.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport type { Data, PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport {\n  decodeBase64Fields,\n  isArrayOrTypedArray,\n  isDateArray,\n  isMonthArray,\n  isNumberArray,\n  isYearArray,\n  mapFluentChart,\n  sanitizeJson,\n} from '@fluentui/chart-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { ThemeContext_unstable as V9ThemeContext } from '@fluentui/react-shared-contexts';\nimport { Theme, webLightTheme } from '@fluentui/tokens';\nimport * as d3Color from 'd3-color';\n\nimport {\n  correctYearMonth,\n  transformPlotlyJsonToDonutProps,\n  transformPlotlyJsonToVSBCProps,\n  transformPlotlyJsonToScatterChartProps,\n  transformPlotlyJsonToHorizontalBarWithAxisProps,\n  transformPlotlyJsonToHeatmapProps,\n  transformPlotlyJsonToSankeyProps,\n  transformPlotlyJsonToGaugeProps,\n  transformPlotlyJsonToGVBCProps,\n  transformPlotlyJsonToVBCProps,\n  projectPolarToCartesian,\n} from './PlotlySchemaAdapter';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { LineChart, LineChartProps } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart, AreaChartProps } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { Chart, ImageExportOptions } from '../../types/index';\nimport { ScatterChart } from '../ScatterChart/index';\n\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\nconst ResponsiveScatterChart = withResponsiveContainer(ScatterChart);\n\n/**\n * DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n */\nexport interface Schema {\n  /**\n   * Plotly schema represented as JSON object\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  plotlySchema: any;\n}\n\n/**\n * DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n */\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n  /**\n   * The schema representing the chart data, layout and configuration\n   */\n  chartSchema: Schema;\n\n  /**\n   * Callback when an event occurs\n   */\n  onSchemaChange?: (eventData: Schema) => void;\n\n  /**\n   * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.RefObject<IDeclarativeChart>;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n  exportAsImage: (opts?: ImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n  const colorMap = React.useRef(new Map<string, string>());\n  return colorMap;\n};\n\nconst useIsDarkTheme = (): boolean => {\n  const parentV9Theme = React.useContext(V9ThemeContext) as Theme;\n  const v9Theme: Theme = parentV9Theme ? parentV9Theme : webLightTheme;\n\n  // Get background and foreground colors\n  const backgroundColor = d3Color.hsl(v9Theme.colorNeutralBackground1);\n  const foregroundColor = d3Color.hsl(v9Theme.colorNeutralForeground1);\n\n  const isDarkTheme = backgroundColor.l < foregroundColor.l;\n\n  return isDarkTheme;\n};\n\n/**\n * DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n  HTMLDivElement,\n  DeclarativeChartProps\n>((props, forwardedRef) => {\n  const { plotlySchema } = sanitizeJson(props.chartSchema);\n  const chart: OutputChartType = mapFluentChart(plotlySchema);\n  if (!chart.isValid) {\n    throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n  }\n  let plotlyInput = plotlySchema as PlotlySchema;\n  try {\n    plotlyInput = decodeBase64Fields(plotlyInput);\n  } catch (error) {\n    throw new Error(`Failed to decode plotly schema: ${error}`);\n  }\n  const plotlyInputWithValidData: PlotlySchema = {\n    ...plotlyInput,\n    data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace.index]),\n  };\n\n  let { selectedLegends } = plotlySchema;\n  const colorMap = useColorMapping();\n  const isDarkTheme = useIsDarkTheme();\n  const chartRef = React.useRef<Chart>(null);\n\n  if (!isArrayOrTypedArray(selectedLegends)) {\n    selectedLegends = [];\n  }\n\n  const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n  const onActiveLegendsChange = (keys: string[]) => {\n    setActiveLegends(keys);\n    if (props.onSchemaChange) {\n      props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n    }\n  };\n\n  React.useEffect(() => {\n    // eslint-disable-next-line @typescript-eslint/no-shadow\n    const { plotlySchema } = sanitizeJson(props.chartSchema);\n    // eslint-disable-next-line @typescript-eslint/no-shadow\n    const { selectedLegends } = plotlySchema;\n    setActiveLegends(selectedLegends ?? []);\n  }, [props.chartSchema]);\n\n  const multiSelectLegendProps = {\n    canSelectMultipleLegends: true,\n    onChange: onActiveLegendsChange,\n    selectedLegends: activeLegends,\n  };\n\n  const commonProps = {\n    legendProps: multiSelectLegendProps,\n    componentRef: chartRef,\n  };\n\n  const renderLineAreaScatter = (plotlyData: Data[], isAreaChart: boolean): JSX.Element => {\n    const isScatterMarkers = (plotlyData[0] as PlotData)?.mode === 'markers';\n    const chartProps: LineChartProps | AreaChartProps = {\n      ...transformPlotlyJsonToScatterChartProps(\n        { data: plotlyData, layout: plotlyInput.layout },\n        isAreaChart,\n        colorMap,\n        isDarkTheme,\n      ),\n      ...commonProps,\n    };\n    if (isAreaChart) {\n      return <ResponsiveAreaChart {...chartProps} />;\n    }\n    if (isScatterMarkers) {\n      return <ResponsiveScatterChart {...chartProps} />;\n    }\n    return <ResponsiveLineChart {...chartProps} />;\n  };\n\n  const checkAndRenderChart = (isAreaChart: boolean = false) => {\n    let fallbackVSBC = false;\n    const xValues = (plotlyInputWithValidData.data[0] as PlotData).x;\n    const isXDate = isDateArray(xValues);\n    const isXNumber = isNumberArray(xValues);\n    const isXMonth = isMonthArray(xValues);\n\n    // Consider year as categorical variable not numeric continuous variable\n    // Also year is not considered a date variable as it is represented as a point\n    // in time and brings additional complexity of handling timezone and locale\n    // formatting given the current design of the charting library\n    const isXYear = isYearArray(xValues);\n\n    if ((isXDate || isXNumber) && !isXYear) {\n      return renderLineAreaScatter(plotlyInputWithValidData.data, isAreaChart);\n    } else if (isXMonth) {\n      const updatedData = plotlyInputWithValidData.data.map((dataPoint: PlotData) => ({\n        ...dataPoint,\n        x: correctYearMonth(dataPoint.x),\n      }));\n      return renderLineAreaScatter(updatedData, isAreaChart);\n    }\n    // Unsupported schema, render as VerticalStackedBarChart\n    fallbackVSBC = true;\n    return (\n      <ResponsiveVerticalStackedBarChart\n        {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme, fallbackVSBC)}\n        {...commonProps}\n      />\n    );\n  };\n\n  // TODO\n  const exportAsImage = React.useCallback((opts?: ImageExportOptions): Promise<string> => {\n    return new Promise((resolve, reject) => {\n      if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {\n        return reject(Error('Chart cannot be exported as image'));\n      }\n\n      chartRef.current\n        .toImage({\n          background: tokens.colorNeutralBackground1,\n          scale: 5,\n          ...opts,\n        })\n        .then(resolve)\n        .catch(reject);\n    });\n  }, []);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      exportAsImage,\n    }),\n    [exportAsImage],\n  );\n\n  switch (chart.type) {\n    case 'donut':\n      return (\n        <ResponsiveDonutChart\n          {...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'horizontalbar':\n      return (\n        <ResponsiveHorizontalBarChartWithAxis\n          {...transformPlotlyJsonToHorizontalBarWithAxisProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'groupedverticalbar':\n      return (\n        <ResponsiveGroupedVerticalBarChart\n          {...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'verticalstackedbar':\n      return (\n        <ResponsiveVerticalStackedBarChart\n          {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'heatmap':\n      return (\n        <ResponsiveHeatMapChart\n          {...transformPlotlyJsonToHeatmapProps(plotlyInputWithValidData)}\n          {...commonProps}\n          legendProps={{}}\n        />\n      );\n    case 'sankey':\n      return (\n        <ResponsiveSankeyChart\n          {...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'gauge':\n      return (\n        <ResponsiveGaugeChart\n          {...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'verticalbar':\n      return (\n        <ResponsiveVerticalBarChart\n          {...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    // TODO: Add 'scatter' as a separate chart type\n    case 'area':\n    case 'line':\n    case 'fallback':\n    case 'scatterpolar':\n      if (chart.type === 'scatterpolar') {\n        const cartesianProjection = projectPolarToCartesian(plotlyInputWithValidData);\n        plotlyInputWithValidData.data = cartesianProjection.data;\n      }\n      // Need recheck for area chart as we don't have ability to check for valid months in previous step\n      const isAreaChart = plotlyInputWithValidData.data.some(\n        (series: PlotData) => series.fill === 'tonexty' || series.fill === 'tozeroy' || !!series.stackgroup,\n      );\n      return checkAndRenderChart(isAreaChart);\n    default:\n      throw new Error(`Unsupported chart type :${plotlyInputWithValidData.data[0]?.type}`);\n  }\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\n"],"names":["React","decodeBase64Fields","isArrayOrTypedArray","isDateArray","isMonthArray","isNumberArray","isYearArray","mapFluentChart","sanitizeJson","tokens","ThemeContext_unstable","V9ThemeContext","webLightTheme","d3Color","correctYearMonth","transformPlotlyJsonToDonutProps","transformPlotlyJsonToVSBCProps","transformPlotlyJsonToScatterChartProps","transformPlotlyJsonToHorizontalBarWithAxisProps","transformPlotlyJsonToHeatmapProps","transformPlotlyJsonToSankeyProps","transformPlotlyJsonToGaugeProps","transformPlotlyJsonToGVBCProps","transformPlotlyJsonToVBCProps","projectPolarToCartesian","DonutChart","VerticalStackedBarChart","LineChart","HorizontalBarChartWithAxis","AreaChart","HeatMapChart","SankeyChart","GaugeChart","GroupedVerticalBarChart","VerticalBarChart","ScatterChart","withResponsiveContainer","ResponsiveDonutChart","ResponsiveVerticalStackedBarChart","ResponsiveLineChart","ResponsiveHorizontalBarChartWithAxis","ResponsiveAreaChart","ResponsiveHeatMapChart","ResponsiveSankeyChart","ResponsiveGaugeChart","ResponsiveGroupedVerticalBarChart","ResponsiveVerticalBarChart","ResponsiveScatterChart","useColorMapping","colorMap","useRef","Map","useIsDarkTheme","parentV9Theme","useContext","v9Theme","backgroundColor","hsl","colorNeutralBackground1","foregroundColor","colorNeutralForeground1","isDarkTheme","l","DeclarativeChart","forwardRef","props","forwardedRef","plotlySchema","chartSchema","chart","isValid","Error","errorMessage","plotlyInput","error","plotlyInputWithValidData","data","validTracesInfo","map","trace","index","selectedLegends","chartRef","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","commonProps","legendProps","componentRef","renderLineAreaScatter","plotlyData","isAreaChart","isScatterMarkers","mode","chartProps","layout","checkAndRenderChart","fallbackVSBC","xValues","x","isXDate","isXNumber","isXMonth","isXYear","updatedData","dataPoint","exportAsImage","useCallback","opts","Promise","resolve","reject","current","toImage","background","scale","then","catch","useImperativeHandle","type","cartesianProjection","some","series","fill","stackgroup","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/DeclarativeChart/DeclarativeChart.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { Data, PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport {\n  decodeBase64Fields,\n  isArrayOrTypedArray,\n  isDateArray,\n  isMonthArray,\n  isNumberArray,\n  isYearArray,\n  mapFluentChart,\n  sanitizeJson,\n} from '@fluentui/chart-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { ThemeContext_unstable as V9ThemeContext } from '@fluentui/react-shared-contexts';\nimport { Theme, webLightTheme } from '@fluentui/tokens';\nimport * as d3Color from 'd3-color';\n\nimport {\n  correctYearMonth,\n  transformPlotlyJsonToDonutProps,\n  transformPlotlyJsonToVSBCProps,\n  transformPlotlyJsonToScatterChartProps,\n  transformPlotlyJsonToHorizontalBarWithAxisProps,\n  transformPlotlyJsonToHeatmapProps,\n  transformPlotlyJsonToSankeyProps,\n  transformPlotlyJsonToGaugeProps,\n  transformPlotlyJsonToGVBCProps,\n  transformPlotlyJsonToVBCProps,\n  transformPlotlyJsonToChartTableProps,\n  projectPolarToCartesian,\n} from './PlotlySchemaAdapter';\nimport type { ColorwayType } from './PlotlyColorAdapter';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { LineChart, LineChartProps } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart, AreaChartProps } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { Chart, ImageExportOptions } from '../../types/index';\nimport { ScatterChart } from '../ScatterChart/index';\n\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\nimport { ChartTable } from '../ChartTable/index';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\nconst ResponsiveScatterChart = withResponsiveContainer(ScatterChart);\nconst ResponsiveChartTable = withResponsiveContainer(ChartTable);\n\n/**\n * DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n */\nexport interface Schema {\n  /**\n   * Plotly schema represented as JSON object\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  plotlySchema: any;\n}\n\n/**\n * DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n */\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n  /**\n   * The schema representing the chart data, layout and configuration\n   */\n  chartSchema: Schema;\n\n  /**\n   * Callback when an event occurs\n   */\n  onSchemaChange?: (eventData: Schema) => void;\n\n  /**\n   * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.RefObject<IDeclarativeChart>;\n\n  /**\n   * Optional prop to specify the colorway type of the chart.\n   * - 'default': Use Fluent UI color palette aligning with plotly colorway.\n   * - 'builtin': Use Fluent UI colorway.\n   * - 'others': Reserved for future colorways.\n   * @default 'default'\n   */\n  colorwayType?: ColorwayType;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n  exportAsImage: (opts?: ImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n  const colorMap = React.useRef(new Map<string, string>());\n  return colorMap;\n};\n\nconst useIsDarkTheme = (): boolean => {\n  const parentV9Theme = React.useContext(V9ThemeContext) as Theme;\n  const v9Theme: Theme = parentV9Theme ? parentV9Theme : webLightTheme;\n\n  // Get background and foreground colors\n  const backgroundColor = d3Color.hsl(v9Theme.colorNeutralBackground1);\n  const foregroundColor = d3Color.hsl(v9Theme.colorNeutralForeground1);\n\n  const isDarkTheme = backgroundColor.l < foregroundColor.l;\n\n  return isDarkTheme;\n};\n\n/**\n * DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n  HTMLDivElement,\n  DeclarativeChartProps\n>((props, forwardedRef) => {\n  const { plotlySchema } = sanitizeJson(props.chartSchema);\n  const chart: OutputChartType = mapFluentChart(plotlySchema);\n  if (!chart.isValid) {\n    throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n  }\n  let plotlyInput = plotlySchema as PlotlySchema;\n  try {\n    plotlyInput = decodeBase64Fields(plotlyInput);\n  } catch (error) {\n    throw new Error(`Failed to decode plotly schema: ${error}`);\n  }\n  const plotlyInputWithValidData: PlotlySchema = {\n    ...plotlyInput,\n    data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace.index]),\n  };\n\n  let { selectedLegends } = plotlySchema;\n  const colorMap = useColorMapping();\n  const isDarkTheme = useIsDarkTheme();\n  const chartRef = React.useRef<Chart>(null);\n\n  if (!isArrayOrTypedArray(selectedLegends)) {\n    selectedLegends = [];\n  }\n\n  const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n  const onActiveLegendsChange = (keys: string[]) => {\n    setActiveLegends(keys);\n    if (props.onSchemaChange) {\n      props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n    }\n  };\n\n  React.useEffect(() => {\n    // eslint-disable-next-line @typescript-eslint/no-shadow\n    const { plotlySchema } = sanitizeJson(props.chartSchema);\n    // eslint-disable-next-line @typescript-eslint/no-shadow\n    const { selectedLegends } = plotlySchema;\n    setActiveLegends(selectedLegends ?? []);\n  }, [props.chartSchema]);\n\n  const multiSelectLegendProps = {\n    canSelectMultipleLegends: true,\n    onChange: onActiveLegendsChange,\n    selectedLegends: activeLegends,\n  };\n\n  const commonProps = {\n    legendProps: multiSelectLegendProps,\n    componentRef: chartRef,\n  };\n\n  const renderLineAreaScatter = (plotlyData: Data[], isAreaChart: boolean): JSXElement => {\n    const isScatterMarkers = (plotlyData[0] as PlotData)?.mode === 'markers';\n    const chartProps: LineChartProps | AreaChartProps = {\n      ...transformPlotlyJsonToScatterChartProps(\n        { data: plotlyData, layout: plotlyInput.layout },\n        isAreaChart,\n        isScatterMarkers,\n        colorMap,\n        props.colorwayType,\n        isDarkTheme,\n      ),\n      ...commonProps,\n    };\n    if (isAreaChart) {\n      return <ResponsiveAreaChart {...chartProps} />;\n    }\n    if (isScatterMarkers) {\n      return <ResponsiveScatterChart {...chartProps} />;\n    }\n    return <ResponsiveLineChart {...chartProps} />;\n  };\n\n  const checkAndRenderChart = (isAreaChart: boolean = false) => {\n    let fallbackVSBC = false;\n    const xValues = (plotlyInputWithValidData.data[0] as PlotData).x;\n    const isXDate = isDateArray(xValues);\n    const isXNumber = isNumberArray(xValues);\n    const isXMonth = isMonthArray(xValues);\n\n    // Consider year as categorical variable not numeric continuous variable\n    // Also year is not considered a date variable as it is represented as a point\n    // in time and brings additional complexity of handling timezone and locale\n    // formatting given the current design of the charting library\n    const isXYear = isYearArray(xValues);\n\n    if ((isXDate || isXNumber) && !isXYear) {\n      return renderLineAreaScatter(plotlyInputWithValidData.data, isAreaChart);\n    } else if (isXMonth) {\n      const updatedData = plotlyInputWithValidData.data.map((dataPoint: PlotData) => ({\n        ...dataPoint,\n        x: correctYearMonth(dataPoint.x),\n      }));\n      return renderLineAreaScatter(updatedData, isAreaChart);\n    }\n    // Unsupported schema, render as VerticalStackedBarChart\n    fallbackVSBC = true;\n    return (\n      <ResponsiveVerticalStackedBarChart\n        {...transformPlotlyJsonToVSBCProps(\n          plotlyInputWithValidData,\n          colorMap,\n          props.colorwayType,\n          isDarkTheme,\n          fallbackVSBC,\n        )}\n        {...commonProps}\n      />\n    );\n  };\n\n  // TODO\n  const exportAsImage = React.useCallback((opts?: ImageExportOptions): Promise<string> => {\n    return new Promise((resolve, reject) => {\n      if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {\n        return reject(Error('Chart cannot be exported as image'));\n      }\n\n      chartRef.current\n        .toImage({\n          background: tokens.colorNeutralBackground1,\n          scale: 5,\n          ...opts,\n        })\n        .then(resolve)\n        .catch(reject);\n    });\n  }, []);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      exportAsImage,\n    }),\n    [exportAsImage],\n  );\n\n  switch (chart.type) {\n    case 'donut':\n      return (\n        <ResponsiveDonutChart\n          {...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'horizontalbar':\n      return (\n        <ResponsiveHorizontalBarChartWithAxis\n          {...transformPlotlyJsonToHorizontalBarWithAxisProps(\n            plotlyInputWithValidData,\n            colorMap,\n            props.colorwayType,\n            isDarkTheme,\n          )}\n          {...commonProps}\n        />\n      );\n    case 'groupedverticalbar':\n      return (\n        <ResponsiveGroupedVerticalBarChart\n          {...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'verticalstackedbar':\n      return (\n        <ResponsiveVerticalStackedBarChart\n          {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'heatmap':\n      return (\n        <ResponsiveHeatMapChart\n          {...transformPlotlyJsonToHeatmapProps(plotlyInputWithValidData)}\n          {...commonProps}\n          legendProps={{}}\n        />\n      );\n    case 'sankey':\n      return (\n        <ResponsiveSankeyChart\n          {...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'gauge':\n      return (\n        <ResponsiveGaugeChart\n          {...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'verticalbar':\n      return (\n        <ResponsiveVerticalBarChart\n          {...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'table':\n      return (\n        <ResponsiveChartTable\n          {...transformPlotlyJsonToChartTableProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    // TODO: Add 'scatter' as a separate chart type\n    case 'area':\n    case 'line':\n    case 'fallback':\n    case 'scatterpolar':\n      if (chart.type === 'scatterpolar') {\n        const cartesianProjection = projectPolarToCartesian(plotlyInputWithValidData);\n        plotlyInputWithValidData.data = cartesianProjection.data;\n      }\n      // Need recheck for area chart as we don't have ability to check for valid months in previous step\n      const isAreaChart = plotlyInputWithValidData.data.some(\n        (series: PlotData) => series.fill === 'tonexty' || series.fill === 'tozeroy' || !!series.stackgroup,\n      );\n      return checkAndRenderChart(isAreaChart);\n    default:\n      throw new Error(`Unsupported chart type :${plotlyInputWithValidData.data[0]?.type}`);\n  }\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\nDeclarativeChart.defaultProps = {\n  colorwayType: 'default',\n};\n"],"names":["React","decodeBase64Fields","isArrayOrTypedArray","isDateArray","isMonthArray","isNumberArray","isYearArray","mapFluentChart","sanitizeJson","tokens","ThemeContext_unstable","V9ThemeContext","webLightTheme","d3Color","correctYearMonth","transformPlotlyJsonToDonutProps","transformPlotlyJsonToVSBCProps","transformPlotlyJsonToScatterChartProps","transformPlotlyJsonToHorizontalBarWithAxisProps","transformPlotlyJsonToHeatmapProps","transformPlotlyJsonToSankeyProps","transformPlotlyJsonToGaugeProps","transformPlotlyJsonToGVBCProps","transformPlotlyJsonToVBCProps","transformPlotlyJsonToChartTableProps","projectPolarToCartesian","DonutChart","VerticalStackedBarChart","LineChart","HorizontalBarChartWithAxis","AreaChart","HeatMapChart","SankeyChart","GaugeChart","GroupedVerticalBarChart","VerticalBarChart","ScatterChart","withResponsiveContainer","ChartTable","ResponsiveDonutChart","ResponsiveVerticalStackedBarChart","ResponsiveLineChart","ResponsiveHorizontalBarChartWithAxis","ResponsiveAreaChart","ResponsiveHeatMapChart","ResponsiveSankeyChart","ResponsiveGaugeChart","ResponsiveGroupedVerticalBarChart","ResponsiveVerticalBarChart","ResponsiveScatterChart","ResponsiveChartTable","useColorMapping","colorMap","useRef","Map","useIsDarkTheme","parentV9Theme","useContext","v9Theme","backgroundColor","hsl","colorNeutralBackground1","foregroundColor","colorNeutralForeground1","isDarkTheme","l","DeclarativeChart","forwardRef","props","forwardedRef","plotlySchema","chartSchema","chart","isValid","Error","errorMessage","plotlyInput","error","plotlyInputWithValidData","data","validTracesInfo","map","trace","index","selectedLegends","chartRef","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","commonProps","legendProps","componentRef","renderLineAreaScatter","plotlyData","isAreaChart","isScatterMarkers","mode","chartProps","layout","colorwayType","checkAndRenderChart","fallbackVSBC","xValues","x","isXDate","isXNumber","isXMonth","isXYear","updatedData","dataPoint","exportAsImage","useCallback","opts","Promise","resolve","reject","current","toImage","background","scale","then","catch","useImperativeHandle","type","cartesianProjection","some","series","fill","stackgroup","displayName","defaultProps"],"mappings":"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"}