@fluentui/react-charts 9.1.9 → 9.1.10

package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useHeatMapChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const heatmapChartClassNames = {\n    root: 'fui-hmc__root',\n    text: 'fui-hmc__text',\n    calloutContentRoot: 'fui-hmc__calloutContentRoot',\n    xAxis: '',\n    yAxis: '',\n    legendContainer: '',\n    hover: '',\n    descriptionMessage: '',\n    tooltip: '',\n    axisTitle: '',\n    chartTitle: '',\n    opacityChangeOnHover: '',\n    shapeStyles: '',\n    chartWrapper: '',\n    svgTooltip: '',\n    chart: ''\n};\nconst useStyles = makeStyles({\n    root: {},\n    text: {\n        ...typographyStyles.body1Strong,\n        pointerEvents: 'none'\n    },\n    calloutContentRoot: {\n        maxWidth: '238px'\n    }\n});\nexport const useHeatMapChartStyles = (props)=>{\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/ ),\n        text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/ ),\n        calloutContentRoot: mergeClasses(heatmapChartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/ )\n    };\n};\n"],"names":["heatmapChartClassNames","useHeatMapChartStyles","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","__styles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkecrkj","B2u0y6b","d","props","baseStyles","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEaA,sBAAsB;eAAtBA;;IA4BAC,qBAAqB;eAArBA;;;uBA9B4B;AAElC,MAAMD,yBAAyB;IAClCE,MAAM;IACNC,MAAM;IACNC,oBAAoB;IACpBC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,SAAS;IACTC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;AACX;AACA,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAjB,MAAA,CAAA;IAAAC,MAAA;QAAAiB,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAApB,oBAAA;QAAAqB,SAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAUX,MAAMzB,wBAAyB0B,CAAAA;IAClC,MAAMC,aAAaV;IACnB,OAAO;QACHhB,MAAM2B,IAAAA,mBAAY,EAAC7B,uBAAuBE,IAAI,EAAE0B,WAAW1B,IAAI,CAAC,sBAAA;QAChEC,MAAM0B,IAAAA,mBAAY,EAAC7B,uBAAuBG,IAAI,EAAEyB,WAAWzB,IAAI,CAAC,sBAAA;QAChEC,oBAAoByB,IAAAA,mBAAY,EAAC7B,uBAAuBI,kBAAkB,EAAEwB,WAAWxB,kBAAkB,CAAC,oCAAA;IAC9G;AACJ"}
+{"version":3,"sources":["useHeatMapChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const heatmapChartClassNames = {\n    root: 'fui-hmc__root',\n    text: 'fui-hmc__text',\n    calloutContentRoot: 'fui-hmc__calloutContentRoot',\n    xAxis: '',\n    yAxis: '',\n    legendContainer: '',\n    hover: '',\n    descriptionMessage: '',\n    tooltip: '',\n    axisTitle: '',\n    chartTitle: '',\n    opacityChangeOnHover: '',\n    shapeStyles: '',\n    chartWrapper: '',\n    svgTooltip: '',\n    chart: ''\n};\nconst useStyles = makeStyles({\n    root: {},\n    text: {\n        ...typographyStyles.body1Strong,\n        pointerEvents: 'none'\n    },\n    calloutContentRoot: {\n        maxWidth: '238px'\n    }\n});\nexport const useHeatMapChartStyles = (props)=>{\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(heatmapChartClassNames.root, baseStyles.root /*, props.styles?.root*/ ),\n        text: mergeClasses(heatmapChartClassNames.text, baseStyles.text /*, props.styles?.text*/ ),\n        calloutContentRoot: mergeClasses(heatmapChartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*, props.styles?.calloutContentRoot*/ )\n    };\n};\n"],"names":["__styles","mergeClasses","typographyStyles","heatmapChartClassNames","root","text","calloutContentRoot","xAxis","yAxis","legendContainer","hover","descriptionMessage","tooltip","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bkecrkj","B2u0y6b","d","useHeatMapChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IAEaG,sBAAsB;;;yBA4BD;;;;uBA9BO,gBAAgB;AAElD,+BAA+B;IAClCC,IAAI,EAAE,eAAe;IACrBC,IAAI,EAAE,eAAe;IACrBC,kBAAkB,EAAE,6BAA6B;IACjDC,KAAK,EAAE,EAAE;IACTC,KAAK,EAAE,EAAE;IACTC,eAAe,EAAE,EAAE;IACnBC,KAAK,EAAE,EAAE;IACTC,kBAAkB,EAAE,EAAE;IACtBC,OAAO,EAAE,EAAE;IACXC,SAAS,EAAE,EAAE;IACbC,UAAU,EAAE,EAAE;IACdC,oBAAoB,EAAE,EAAE;IACxBC,WAAW,EAAE,EAAE;IACfC,YAAY,EAAE,EAAE;IAChBC,UAAU,EAAE,EAAE;IACdC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGpB,eAAA,EAAA;IAAAI,IAAA,EAAA,CAAA;IAAAC,IAAA,EAAA;QAAAgB,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAnB,kBAAA,EAAA;QAAAoB,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CASjB,CAAC;AACK,MAAMC,yBAAyBC,KAAK,IAAG;IAC1C,MAAMC,UAAU,GAAGV,SAAS,CAAC,CAAC;IAC9B,OAAO;QACHhB,IAAI,MAAEH,mBAAY,EAACE,sBAAsB,CAACC,IAAI,EAAE0B,UAAU,CAAC1B,IAAI,CAAC,sBAAA,EAAyB,CAAC;QAC1FC,IAAI,MAAEJ,mBAAY,EAACE,sBAAsB,CAACE,IAAI,EAAEyB,UAAU,CAACzB,IAAI,CAAC,sBAAA,EAAyB,CAAC;QAC1FC,kBAAkB,MAAEL,mBAAY,EAACE,sBAAsB,CAACG,kBAAkB,EAAEwB,UAAU,CAACxB,kBAAkB,CAAC,oCAAA,EAAuC;IACrJ,CAAC;AACL,CAAC"}

package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["HorizontalBarChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useHorizontalBarChartStyles } from './useHorizontalBarChartStyles.styles';\nimport { ChartProps, HorizontalBarChartProps, ChartDataPoint, RefArrayData, HorizontalBarChartVariant } from './index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { formatScientificLimitWidth, getAccessibleDataObject, useRtl } from '../../utilities/index';\nimport { useId } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { FocusableTooltipText } from '../../utilities/FocusableTooltipText';\nimport { Legend, Legends } from '../../index';\n\n/**\n * HorizontalBarChart is the context wrapper and container for all HorizontalBarChart content/controls,\n * It has no direct style or slot opinions.\n *\n * HorizontalBarChart also provides API interfaces for callbacks that will occur on navigation events.\n */\nexport const HorizontalBarChart: React.FunctionComponent<HorizontalBarChartProps> = React.forwardRef<\n  HTMLDivElement,\n  HorizontalBarChartProps\n>((props, forwardedRef) => {\n  const legendContainer = React.useRef<HTMLDivElement | null>(null);\n  const _uniqLineText: string = useId('_HorizontalLine_');\n  const _refArray: RefArrayData[] = [];\n  const _isRTL: boolean = useRtl();\n  const barChartSvgRef: React.RefObject<SVGSVGElement> = React.createRef<SVGSVGElement>();\n  const _emptyChartId: string = useId('_HBC_empty');\n  let _barHeight: number;\n  let _calloutAnchorPoint: ChartDataPoint | null;\n  let isSingleBar: boolean = true;\n\n  const [hoverValue, setHoverValue] = React.useState<string | number | Date | null>('');\n  const [lineColor, setLineColor] = React.useState<string>('');\n  const [legend, setLegend] = React.useState<string | null>('');\n  const [xCalloutValue, setXCalloutValue] = React.useState<string | undefined>('');\n  const [yCalloutValue, setYCalloutValue] = React.useState<string | undefined>('');\n  const [barCalloutProps, setBarCalloutProps] = React.useState<ChartDataPoint>();\n  const [barSpacingInPercent, setBarSpacingInPercent] = React.useState<number>(0);\n  const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n  const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n  const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n  const [activeLegend, setActiveLegend] = React.useState<string>('');\n\n  function _refCallback(element: SVGGElement, legendTitle: string | undefined): void {\n    _refArray.push({ index: legendTitle, refElement: element });\n  }\n\n  function _hoverOn(\n    event: React.FocusEvent<SVGRectElement> | React.MouseEvent<SVGRectElement>,\n    hoverVal: string | number | Date,\n    point: ChartDataPoint,\n  ): void {\n    if (\n      (!isPopoverOpen || legend !== point.legend!) &&\n      _calloutAnchorPoint !== point &&\n      (_legendHighlighted(point.legend) || _noLegendHighlighted())\n    ) {\n      _calloutAnchorPoint = point;\n      let x = 0;\n      let y = 0;\n\n      if ('clientX' in event && event.clientX && event.clientY) {\n        // Mouse event\n        x = event.clientX;\n        y = event.clientY;\n      } else {\n        // Focus event\n        const targetRect = (event.target as SVGRectElement).getBoundingClientRect();\n        x = targetRect.left + targetRect.width / 2;\n        y = targetRect.top + targetRect.height / 2;\n      }\n\n      updatePosition(x, y);\n      setHoverValue(hoverVal);\n      setLineColor(point.color!);\n      setLegend(point.legend!);\n      setXCalloutValue(point.xAxisCalloutData!);\n      setYCalloutValue(point.yAxisCalloutData!);\n      setBarCalloutProps(point);\n      // ToDo - Confirm setting multiple state variables like this is performant.\n    }\n  }\n\n  function _hoverOff(): void {\n    /*ToDo. To fix*/\n  }\n\n  const _handleChartMouseLeave = () => {\n    _calloutAnchorPoint = null;\n    if (isPopoverOpen) {\n      setPopoverOpen(false);\n      setHoverValue('');\n      setLineColor('');\n      setLegend('');\n    }\n  };\n\n  const _adjustProps = (): void => {\n    _barHeight = props.barHeight || 12;\n  };\n\n  const _getChartDataText = (data: ChartProps) => {\n    /* return props.barChartCustomData ? (\n        <div role=\"text\">{props.barChartCustomData(data)}</div>\n      ) : ( */\n    return _getDefaultTextData(data);\n    //)\n  };\n\n  function _createLegends(chartProps: ChartProps[]): JSX.Element {\n    const legendItems: Legend[] = [];\n    chartProps.forEach((point: ChartProps) => {\n      point.chartData!.forEach((dataPoint: ChartDataPoint) => {\n        const color: string = dataPoint.color!;\n        // mapping data to the format Legends component needs\n        const legendItem: Legend = {\n          title: dataPoint.legend!,\n          color,\n          action: () => {\n            if (selectedLegend === dataPoint.legend) {\n              setSelectedLegend('');\n            } else {\n              setSelectedLegend(dataPoint.legend!);\n            }\n          },\n          hoverAction: () => {\n            _handleChartMouseLeave();\n            setActiveLegend(dataPoint.legend!);\n          },\n          onMouseOutAction: () => {\n            setActiveLegend('');\n          },\n        };\n        legendItems.push(legendItem);\n      });\n    });\n    const legends = (\n      <Legends legends={legendItems} centerLegends overflowText={props.legendsOverflowText} {...props.legendProps} />\n    );\n    return legends;\n  }\n\n  function _getDefaultTextData(data: ChartProps): JSX.Element {\n    const { culture } = props;\n    const accessibilityData = getAccessibleDataObject(data.chartDataAccessibilityData!, 'text', false);\n    if (!isSingleBar) {\n      const total = data.chartData!.reduce(\n        (acc: number, point: ChartDataPoint) =>\n          acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n        0,\n      );\n      return (\n        <div className={classes.chartTitleRight} {...accessibilityData}>\n          {formatToLocaleString(total, culture) as React.ReactNode}\n        </div>\n      );\n    }\n    const chartDataMode = props.chartDataMode || 'default';\n    const chartData: ChartDataPoint = data!.chartData![0];\n    const x = chartData.horizontalBarChartdata!.x;\n    const y = chartData.horizontalBarChartdata!.total!;\n\n    switch (chartDataMode) {\n      case 'default':\n        return (\n          <div className={classes.chartTitleRight} {...accessibilityData}>\n            {formatToLocaleString(x, culture) as React.ReactNode}\n          </div>\n        );\n      case 'fraction':\n        return (\n          <div {...accessibilityData}>\n            <span className={classes.chartTitleRight}>{formatToLocaleString(x, culture) as React.ReactNode}</span>\n            <span className={classes.chartDataTextDenominator}>{' / ' + formatToLocaleString(y, culture)}</span>\n          </div>\n        );\n      case 'percentage':\n        const dataRatioPercentage = `${formatToLocaleString(Math.round((x / y) * 100), culture)}%`;\n        return (\n          <div className={classes.chartTitleRight} {...accessibilityData}>\n            {dataRatioPercentage}\n          </div>\n        );\n    }\n  }\n\n  function _createBenchmark(data: ChartProps): JSX.Element {\n    if (data.chartData![0].horizontalBarChartdata!.total === undefined) {\n      return <></>;\n    }\n    const totalData = data.chartData![0].horizontalBarChartdata!.total!;\n    const benchmarkData = data.chartData![0].data;\n    const benchmarkRatio = Math.round(((benchmarkData ? benchmarkData : 0) / totalData) * 100);\n\n    const benchmarkStyles = {\n      left: 'calc(' + benchmarkRatio + '% - 4px)',\n    };\n\n    return (\n      <div className={classes.benchmarkContainer}>\n        <div className={classes.triangle} style={benchmarkStyles} />\n      </div>\n    );\n  }\n\n  /**\n   * This functions returns an array of <rect> elements, which form the bars\n   * For each bar an x value, and a width needs to be specified\n   * The computations are done based on percentages\n   * Extra margin is also provided, in the x value to provide some spacing in between the bars\n   */\n\n  function _createBars(data: ChartProps): JSX.Element[] {\n    const noOfBars =\n      data.chartData?.reduce((count: number, point: ChartDataPoint) => (count += (point.data || 0) > 0 ? 1 : 0), 0) ||\n      1;\n    const totalMarginPercent = barSpacingInPercent * (noOfBars - 1);\n    const defaultColors: string[] = [\n      tokens.colorPaletteBlueForeground2,\n      tokens.colorPaletteCornflowerForeground2,\n      tokens.colorPaletteDarkGreenForeground2,\n      tokens.colorPaletteNavyForeground2,\n      tokens.colorPaletteDarkOrangeForeground2,\n    ];\n    // calculating starting point of each bar and it's range\n    const startingPoint: number[] = [];\n    const total = data.chartData!.reduce(\n      (acc: number, point: ChartDataPoint) =>\n        acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n      0,\n    );\n    let prevPosition = 0;\n    let value = 0;\n\n    let sumOfPercent = 0;\n    data.chartData!.map((point: ChartDataPoint, index: number) => {\n      const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n      value = (pointData / total) * 100;\n      if (value < 0) {\n        value = 0;\n      } else if (value < 1 && value !== 0) {\n        value = 1;\n      }\n      sumOfPercent += value;\n\n      return sumOfPercent;\n    });\n\n    /**\n     * The %age of the space occupied by the margin needs to subtracted\n     * while computing the scaling ratio, since the margins are not being\n     * scaled down, only the data is being scaled down from a higher percentage to lower percentage\n     * Eg: 95% of the space is taken by the bars, 5% by the margins\n     * Now if the sumOfPercent is 120% -> This needs to be scaled down to 95%, not 100%\n     * since that's only space available to the bars\n     */\n    const scalingRatio = sumOfPercent !== 0 ? (sumOfPercent - totalMarginPercent) / 100 : 1;\n\n    const bars = data.chartData!.map((point: ChartDataPoint, index: number) => {\n      const color: string = point.color ? point.color : defaultColors[Math.floor(Math.random() * 4 + 1)];\n      const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n      if (index > 0) {\n        prevPosition += value;\n      }\n      value = (pointData / total) * 100;\n      if (value < 0) {\n        value = 0;\n      } else if (value < 1 && value !== 0) {\n        value = 1 / scalingRatio;\n      } else {\n        value = value / scalingRatio;\n      }\n      startingPoint.push(prevPosition);\n\n      const xValue = point.horizontalBarChartdata!.x;\n      const placeholderIndex = 1;\n      const isLegendSelected: boolean = _legendHighlighted(point.legend) || _noLegendHighlighted();\n\n      // Render bar label instead of placeholder bar for absolute-scale variant\n      if (index === placeholderIndex && props.variant === HorizontalBarChartVariant.AbsoluteScale) {\n        if (props.hideLabels) {\n          return <text key={index} />;\n        }\n\n        const barValue = data.chartData![0].horizontalBarChartdata!.x;\n\n        return (\n          <text\n            key={index}\n            x={`${_isRTL ? 100 - startingPoint[index] : startingPoint[index]}%`}\n            y={_barHeight / 2}\n            dominantBaseline=\"central\"\n            transform={`translate(${_isRTL ? -4 : 4})`}\n            className={classes.barLabel}\n            aria-hidden={true}\n          >\n            {formatScientificLimitWidth(barValue)}\n          </text>\n        );\n      }\n\n      return (\n        <rect\n          key={index}\n          x={`${\n            _isRTL\n              ? 100 - startingPoint[index] - value - index * barSpacingInPercent\n              : startingPoint[index] + index * barSpacingInPercent\n          }%`}\n          y={0}\n          width={value + '%'}\n          height={_barHeight}\n          fill={color}\n          onMouseOver={point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined}\n          onFocus={point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined}\n          role=\"img\"\n          aria-label={_getAriaLabel(point)}\n          onBlur={_hoverOff}\n          onMouseLeave={_hoverOff}\n          className={classes.barWrapper}\n          opacity={isLegendSelected ? 1 : 0.1}\n          tabIndex={point.legend !== '' ? 0 : undefined}\n        />\n      );\n    });\n    return bars;\n  }\n\n  const _getAriaLabel = (point: ChartDataPoint): string => {\n    const legend = point.xAxisCalloutData || point.legend;\n    const yValue =\n      point.yAxisCalloutData ||\n      (point.horizontalBarChartdata\n        ? `${point.horizontalBarChartdata.x}/${point.horizontalBarChartdata.total ?? ''}`\n        : 0);\n    return point.callOutAccessibilityData?.ariaLabel || (legend ? `${legend}, ` : '') + `${yValue}.`;\n  };\n\n  function _isChartEmpty(): boolean {\n    return !(props.data && props.data.length > 0);\n  }\n\n  function updatePosition(newX: number, newY: number): void {\n    const threshold = 1; // Set a threshold for movement\n    const { x, y } = clickPosition;\n\n    // Calculate the distance moved\n    const distance = Math.sqrt(Math.pow(newX - x, 2) + Math.pow(newY - y, 2));\n    // Update the position only if the distance moved is greater than the threshold\n    if (distance > threshold) {\n      setClickPosition({ x: newX, y: newY });\n      setPopoverOpen(true);\n    }\n  }\n\n  React.useEffect(() => {\n    const svgWidth = barChartSvgRef?.current?.getBoundingClientRect().width || 0;\n    const MARGIN_WIDTH_IN_PX = 3;\n    if (svgWidth) {\n      const currentBarSpacing = (MARGIN_WIDTH_IN_PX / svgWidth) * 100;\n      setBarSpacingInPercent(currentBarSpacing);\n    }\n  }, [barChartSvgRef]);\n\n  function _legendHighlighted(barLegend?: string) {\n    if (barLegend === undefined) {\n      return false;\n    }\n    return selectedLegend === barLegend || (selectedLegend === '' && activeLegend === barLegend);\n  }\n\n  /**\n   * This function checks if none of the legends is selected or hovered.*/\n\n  function _noLegendHighlighted() {\n    return selectedLegend === '' && activeLegend === '';\n  }\n\n  const { data } = props;\n  _adjustProps();\n  const classes = useHorizontalBarChartStyles(props);\n  const focusAttributes = useFocusableGroup();\n  const legendButtons = _createLegends(data!);\n\n  let datapoint: number | undefined = 0;\n  return !_isChartEmpty() ? (\n    <div className={classes.root} onMouseLeave={_handleChartMouseLeave}>\n      {data!.map((points: ChartProps, index: number) => {\n        if (points.chartData && points.chartData![0] && points.chartData![0].horizontalBarChartdata!.x) {\n          datapoint = points.chartData![0].horizontalBarChartdata!.x;\n        } else {\n          datapoint = 0;\n        }\n        isSingleBar =\n          points.chartData!.length === 1 || (points.chartData!.length > 1 && points.chartData![1].legend === '');\n        if (isSingleBar) {\n          points.chartData![1] = {\n            legend: '',\n            horizontalBarChartdata: {\n              x: points.chartData![0].horizontalBarChartdata!.total! - datapoint!,\n              total: points.chartData![0].horizontalBarChartdata!.total!,\n            },\n            color: tokens.colorBackgroundOverlay,\n          };\n        }\n\n        // Hide right side text of chart title for absolute-scale variant\n        const chartDataText =\n          props.variant === HorizontalBarChartVariant.AbsoluteScale ? null : _getChartDataText(points!);\n        const bars = _createBars(points!);\n        const keyVal = _uniqLineText + '_' + index;\n        // ToDo - Showtriangle property is per data series. How to account for it in the new stylesheet\n        /*         const classes = useHorizontalBarChartStyles(props.styles!, {\n          width: props.width,\n          showTriangle: !!points!.chartData![0].data,\n          variant: props.variant,\n        }); */\n\n        return (\n          <div key={index}>\n            <div className={classes.items} {...focusAttributes}>\n              <div className={classes.chartTitle}>\n                {points!.chartTitle && (\n                  <FocusableTooltipText\n                    className={classes.chartTitleLeft}\n                    content={points!.chartTitle}\n                    accessibilityData={points!.chartTitleAccessibilityData}\n                  />\n                )}\n                {chartDataText}\n              </div>\n              {points!.chartData![0].data && _createBenchmark(points!)}\n              <svg ref={barChartSvgRef} className={classes.chart} aria-label={points!.chartTitle}>\n                <g\n                  id={keyVal}\n                  ref={(e: SVGGElement) => {\n                    _refCallback(e, points!.chartData![0].legend);\n                  }}\n                  // NOTE: points.chartData![0] contains current data value\n                  onClick={() => {\n                    const p = points!.chartData![0];\n                    if (p && p.onClick) {\n                      p.onClick();\n                    }\n                  }}\n                >\n                  {bars}\n                </g>\n              </svg>\n            </div>\n          </div>\n        );\n      })}\n      <ChartPopover\n        xCalloutValue={xCalloutValue}\n        yCalloutValue={yCalloutValue}\n        culture={props.culture ?? 'en-us'}\n        clickPosition={clickPosition}\n        isPopoverOpen={isPopoverOpen}\n        legend={legend!}\n        YValue={hoverValue!}\n        color={lineColor}\n        isCalloutForStack={false}\n        customCallout={{\n          customizedCallout: props.onRenderCalloutPerHorizontalBar\n            ? props.onRenderCalloutPerHorizontalBar(barCalloutProps!)\n            : undefined,\n          customCalloutProps: props.calloutPropsPerDataPoint\n            ? props.calloutPropsPerDataPoint(barCalloutProps!)\n            : undefined,\n        }}\n        isCartesian={false}\n      />\n      {!isSingleBar && (\n        <div ref={(e: HTMLDivElement) => (legendContainer.current = e)} className={classes.legendContainer}>\n          {legendButtons}\n        </div>\n      )}\n    </div>\n  ) : (\n    <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n  );\n  //TODO validate and fix focus border for issue for popover\n});\nHorizontalBarChart.displayName = 'HorizontalBarChart';\n"],"names":["HorizontalBarChart","React","forwardRef","props","forwardedRef","legendContainer","useRef","_uniqLineText","useId","_refArray","_isRTL","useRtl","barChartSvgRef","createRef","_emptyChartId","_barHeight","_calloutAnchorPoint","isSingleBar","hoverValue","setHoverValue","useState","lineColor","setLineColor","legend","setLegend","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","barCalloutProps","setBarCalloutProps","barSpacingInPercent","setBarSpacingInPercent","isPopoverOpen","setPopoverOpen","clickPosition","setClickPosition","x","y","selectedLegend","setSelectedLegend","activeLegend","setActiveLegend","_refCallback","element","legendTitle","push","index","refElement","_hoverOn","event","hoverVal","point","_legendHighlighted","_noLegendHighlighted","clientX","clientY","targetRect","target","getBoundingClientRect","left","width","top","height","updatePosition","color","xAxisCalloutData","yAxisCalloutData","_hoverOff","_handleChartMouseLeave","_adjustProps","barHeight","_getChartDataText","data","_getDefaultTextData","_createLegends","chartProps","legendItems","forEach","chartData","dataPoint","legendItem","title","action","hoverAction","onMouseOutAction","legends","createElement","Legends","centerLegends","overflowText","legendsOverflowText","legendProps","culture","accessibilityData","getAccessibleDataObject","chartDataAccessibilityData","total","reduce","acc","horizontalBarChartdata","div","className","classes","chartTitleRight","formatToLocaleString","chartDataMode","span","chartDataTextDenominator","dataRatioPercentage","Math","round","_createBenchmark","undefined","Fragment","totalData","benchmarkData","benchmarkRatio","benchmarkStyles","benchmarkContainer","triangle","style","_createBars","noOfBars","count","totalMarginPercent","defaultColors","tokens","colorPaletteBlueForeground2","colorPaletteCornflowerForeground2","colorPaletteDarkGreenForeground2","colorPaletteNavyForeground2","colorPaletteDarkOrangeForeground2","startingPoint","prevPosition","value","sumOfPercent","map","pointData","scalingRatio","bars","floor","random","xValue","placeholderIndex","isLegendSelected","variant","HorizontalBarChartVariant","AbsoluteScale","hideLabels","text","key","barValue","dominantBaseline","transform","barLabel","aria-hidden","formatScientificLimitWidth","rect","fill","onMouseOver","onFocus","role","aria-label","_getAriaLabel","onBlur","onMouseLeave","barWrapper","opacity","tabIndex","yValue","callOutAccessibilityData","ariaLabel","_isChartEmpty","length","newX","newY","threshold","distance","sqrt","pow","useEffect","svgWidth","current","MARGIN_WIDTH_IN_PX","currentBarSpacing","barLegend","useHorizontalBarChartStyles","focusAttributes","useFocusableGroup","legendButtons","datapoint","root","points","colorBackgroundOverlay","chartDataText","keyVal","items","chartTitle","FocusableTooltipText","chartTitleLeft","content","chartTitleAccessibilityData","svg","ref","chart","g","id","e","onClick","p","ChartPopover","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerHorizontalBar","customCalloutProps","calloutPropsPerDataPoint","isCartesian","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["HorizontalBarChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useHorizontalBarChartStyles } from './useHorizontalBarChartStyles.styles';\nimport { ChartProps, HorizontalBarChartProps, ChartDataPoint, RefArrayData, HorizontalBarChartVariant } from './index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { formatScientificLimitWidth, getAccessibleDataObject, useRtl } from '../../utilities/index';\nimport { useId } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { FocusableTooltipText } from '../../utilities/FocusableTooltipText';\nimport { Legend, Legends } from '../../index';\n\n/**\n * HorizontalBarChart is the context wrapper and container for all HorizontalBarChart content/controls,\n * It has no direct style or slot opinions.\n *\n * HorizontalBarChart also provides API interfaces for callbacks that will occur on navigation events.\n */\nexport const HorizontalBarChart: React.FunctionComponent<HorizontalBarChartProps> = React.forwardRef<\n  HTMLDivElement,\n  HorizontalBarChartProps\n>((props, forwardedRef) => {\n  const legendContainer = React.useRef<HTMLDivElement | null>(null);\n  const _uniqLineText: string = useId('_HorizontalLine_');\n  const _refArray: RefArrayData[] = [];\n  const _isRTL: boolean = useRtl();\n  const barChartSvgRef: React.RefObject<SVGSVGElement> = React.createRef<SVGSVGElement>();\n  const _emptyChartId: string = useId('_HBC_empty');\n  let _barHeight: number;\n  let _calloutAnchorPoint: ChartDataPoint | null;\n  let isSingleBar: boolean = true;\n\n  const [hoverValue, setHoverValue] = React.useState<string | number | Date | null>('');\n  const [lineColor, setLineColor] = React.useState<string>('');\n  const [legend, setLegend] = React.useState<string | null>('');\n  const [xCalloutValue, setXCalloutValue] = React.useState<string | undefined>('');\n  const [yCalloutValue, setYCalloutValue] = React.useState<string | undefined>('');\n  const [barCalloutProps, setBarCalloutProps] = React.useState<ChartDataPoint>();\n  const [barSpacingInPercent, setBarSpacingInPercent] = React.useState<number>(0);\n  const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n  const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n  const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n  const [activeLegend, setActiveLegend] = React.useState<string>('');\n\n  function _refCallback(element: SVGGElement, legendTitle: string | undefined): void {\n    _refArray.push({ index: legendTitle, refElement: element });\n  }\n\n  function _hoverOn(\n    event: React.FocusEvent<SVGRectElement> | React.MouseEvent<SVGRectElement>,\n    hoverVal: string | number | Date,\n    point: ChartDataPoint,\n  ): void {\n    if (\n      (!isPopoverOpen || legend !== point.legend!) &&\n      _calloutAnchorPoint !== point &&\n      (_legendHighlighted(point.legend) || _noLegendHighlighted())\n    ) {\n      _calloutAnchorPoint = point;\n      let x = 0;\n      let y = 0;\n\n      if ('clientX' in event && event.clientX && event.clientY) {\n        // Mouse event\n        x = event.clientX;\n        y = event.clientY;\n      } else {\n        // Focus event\n        const targetRect = (event.target as SVGRectElement).getBoundingClientRect();\n        x = targetRect.left + targetRect.width / 2;\n        y = targetRect.top + targetRect.height / 2;\n      }\n\n      updatePosition(x, y);\n      setHoverValue(hoverVal);\n      setLineColor(point.color!);\n      setLegend(point.legend!);\n      setXCalloutValue(point.xAxisCalloutData!);\n      setYCalloutValue(point.yAxisCalloutData!);\n      setBarCalloutProps(point);\n      // ToDo - Confirm setting multiple state variables like this is performant.\n    }\n  }\n\n  function _hoverOff(): void {\n    /*ToDo. To fix*/\n  }\n\n  const _handleChartMouseLeave = () => {\n    _calloutAnchorPoint = null;\n    if (isPopoverOpen) {\n      setPopoverOpen(false);\n      setHoverValue('');\n      setLineColor('');\n      setLegend('');\n    }\n  };\n\n  const _adjustProps = (): void => {\n    _barHeight = props.barHeight || 12;\n  };\n\n  const _getChartDataText = (data: ChartProps) => {\n    /* return props.barChartCustomData ? (\n        <div role=\"text\">{props.barChartCustomData(data)}</div>\n      ) : ( */\n    return _getDefaultTextData(data);\n    //)\n  };\n\n  function _createLegends(chartProps: ChartProps[]): JSX.Element {\n    const legendItems: Legend[] = [];\n    chartProps.forEach((point: ChartProps) => {\n      point.chartData!.forEach((dataPoint: ChartDataPoint) => {\n        const color: string = dataPoint.color!;\n        // mapping data to the format Legends component needs\n        const legendItem: Legend = {\n          title: dataPoint.legend!,\n          color,\n          action: () => {\n            if (selectedLegend === dataPoint.legend) {\n              setSelectedLegend('');\n            } else {\n              setSelectedLegend(dataPoint.legend!);\n            }\n          },\n          hoverAction: () => {\n            _handleChartMouseLeave();\n            setActiveLegend(dataPoint.legend!);\n          },\n          onMouseOutAction: () => {\n            setActiveLegend('');\n          },\n        };\n        legendItems.push(legendItem);\n      });\n    });\n    const legends = (\n      <Legends legends={legendItems} centerLegends overflowText={props.legendsOverflowText} {...props.legendProps} />\n    );\n    return legends;\n  }\n\n  function _getDefaultTextData(data: ChartProps): JSX.Element {\n    const { culture } = props;\n    const accessibilityData = getAccessibleDataObject(data.chartDataAccessibilityData!, 'text', false);\n    if (!isSingleBar) {\n      const total = data.chartData!.reduce(\n        (acc: number, point: ChartDataPoint) =>\n          acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n        0,\n      );\n      return (\n        <div className={classes.chartTitleRight} {...accessibilityData}>\n          {formatToLocaleString(total, culture) as React.ReactNode}\n        </div>\n      );\n    }\n    const chartDataMode = props.chartDataMode || 'default';\n    const chartData: ChartDataPoint = data!.chartData![0];\n    const x = chartData.horizontalBarChartdata!.x;\n    const y = chartData.horizontalBarChartdata!.total!;\n\n    switch (chartDataMode) {\n      case 'default':\n        return (\n          <div className={classes.chartTitleRight} {...accessibilityData}>\n            {formatToLocaleString(x, culture) as React.ReactNode}\n          </div>\n        );\n      case 'fraction':\n        return (\n          <div {...accessibilityData}>\n            <span className={classes.chartTitleRight}>{formatToLocaleString(x, culture) as React.ReactNode}</span>\n            <span className={classes.chartDataTextDenominator}>{' / ' + formatToLocaleString(y, culture)}</span>\n          </div>\n        );\n      case 'percentage':\n        const dataRatioPercentage = `${formatToLocaleString(Math.round((x / y) * 100), culture)}%`;\n        return (\n          <div className={classes.chartTitleRight} {...accessibilityData}>\n            {dataRatioPercentage}\n          </div>\n        );\n    }\n  }\n\n  function _createBenchmark(data: ChartProps): JSX.Element {\n    if (data.chartData![0].horizontalBarChartdata!.total === undefined) {\n      return <></>;\n    }\n    const totalData = data.chartData![0].horizontalBarChartdata!.total!;\n    const benchmarkData = data.chartData![0].data;\n    const benchmarkRatio = Math.round(((benchmarkData ? benchmarkData : 0) / totalData) * 100);\n\n    const benchmarkStyles = {\n      left: 'calc(' + benchmarkRatio + '% - 4px)',\n    };\n\n    return (\n      <div className={classes.benchmarkContainer}>\n        <div className={classes.triangle} style={benchmarkStyles} />\n      </div>\n    );\n  }\n\n  /**\n   * This functions returns an array of <rect> elements, which form the bars\n   * For each bar an x value, and a width needs to be specified\n   * The computations are done based on percentages\n   * Extra margin is also provided, in the x value to provide some spacing in between the bars\n   */\n\n  function _createBars(data: ChartProps): JSX.Element[] {\n    const noOfBars =\n      data.chartData?.reduce((count: number, point: ChartDataPoint) => (count += (point.data || 0) > 0 ? 1 : 0), 0) ||\n      1;\n    const totalMarginPercent = barSpacingInPercent * (noOfBars - 1);\n    const defaultColors: string[] = [\n      tokens.colorPaletteBlueForeground2,\n      tokens.colorPaletteCornflowerForeground2,\n      tokens.colorPaletteDarkGreenForeground2,\n      tokens.colorPaletteNavyForeground2,\n      tokens.colorPaletteDarkOrangeForeground2,\n    ];\n    // calculating starting point of each bar and it's range\n    const startingPoint: number[] = [];\n    const total = data.chartData!.reduce(\n      (acc: number, point: ChartDataPoint) =>\n        acc + (point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0),\n      0,\n    );\n    let prevPosition = 0;\n    let value = 0;\n\n    let sumOfPercent = 0;\n    data.chartData!.map((point: ChartDataPoint, index: number) => {\n      const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n      value = (pointData / total) * 100;\n      if (value < 0) {\n        value = 0;\n      } else if (value < 1 && value !== 0) {\n        value = 1;\n      }\n      sumOfPercent += value;\n\n      return sumOfPercent;\n    });\n\n    /**\n     * The %age of the space occupied by the margin needs to subtracted\n     * while computing the scaling ratio, since the margins are not being\n     * scaled down, only the data is being scaled down from a higher percentage to lower percentage\n     * Eg: 95% of the space is taken by the bars, 5% by the margins\n     * Now if the sumOfPercent is 120% -> This needs to be scaled down to 95%, not 100%\n     * since that's only space available to the bars\n     */\n    const scalingRatio = sumOfPercent !== 0 ? (sumOfPercent - totalMarginPercent) / 100 : 1;\n\n    const bars = data.chartData!.map((point: ChartDataPoint, index: number) => {\n      const color: string = point.color ? point.color : defaultColors[Math.floor(Math.random() * 4 + 1)];\n      const pointData = point.horizontalBarChartdata!.x ? point.horizontalBarChartdata!.x : 0;\n      if (index > 0) {\n        prevPosition += value;\n      }\n      value = (pointData / total) * 100;\n      if (value < 0) {\n        value = 0;\n      } else if (value < 1 && value !== 0) {\n        value = 1 / scalingRatio;\n      } else {\n        value = value / scalingRatio;\n      }\n      startingPoint.push(prevPosition);\n\n      const xValue = point.horizontalBarChartdata!.x;\n      const placeholderIndex = 1;\n      const isLegendSelected: boolean = _legendHighlighted(point.legend) || _noLegendHighlighted();\n\n      // Render bar label instead of placeholder bar for absolute-scale variant\n      if (index === placeholderIndex && props.variant === HorizontalBarChartVariant.AbsoluteScale) {\n        if (props.hideLabels) {\n          return <text key={index} />;\n        }\n\n        const barValue = data.chartData![0].horizontalBarChartdata!.x;\n\n        return (\n          <text\n            key={index}\n            x={`${_isRTL ? 100 - startingPoint[index] : startingPoint[index]}%`}\n            y={_barHeight / 2}\n            dominantBaseline=\"central\"\n            transform={`translate(${_isRTL ? -4 : 4})`}\n            className={classes.barLabel}\n            aria-hidden={true}\n          >\n            {formatScientificLimitWidth(barValue)}\n          </text>\n        );\n      }\n\n      return (\n        <rect\n          key={index}\n          x={`${\n            _isRTL\n              ? 100 - startingPoint[index] - value - index * barSpacingInPercent\n              : startingPoint[index] + index * barSpacingInPercent\n          }%`}\n          y={0}\n          width={value + '%'}\n          height={_barHeight}\n          fill={color}\n          onMouseOver={point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined}\n          onFocus={point.legend !== '' ? event => _hoverOn(event, xValue, point) : undefined}\n          role=\"img\"\n          aria-label={_getAriaLabel(point)}\n          onBlur={_hoverOff}\n          onMouseLeave={_hoverOff}\n          className={classes.barWrapper}\n          opacity={isLegendSelected ? 1 : 0.1}\n          tabIndex={point.legend !== '' ? 0 : undefined}\n        />\n      );\n    });\n    return bars;\n  }\n\n  const _getAriaLabel = (point: ChartDataPoint): string => {\n    const legend = point.xAxisCalloutData || point.legend;\n    const yValue =\n      point.yAxisCalloutData ||\n      (point.horizontalBarChartdata\n        ? `${point.horizontalBarChartdata.x}/${point.horizontalBarChartdata.total ?? ''}`\n        : 0);\n    return point.callOutAccessibilityData?.ariaLabel || (legend ? `${legend}, ` : '') + `${yValue}.`;\n  };\n\n  function _isChartEmpty(): boolean {\n    return !(props.data && props.data.length > 0);\n  }\n\n  function updatePosition(newX: number, newY: number): void {\n    const threshold = 1; // Set a threshold for movement\n    const { x, y } = clickPosition;\n\n    // Calculate the distance moved\n    const distance = Math.sqrt(Math.pow(newX - x, 2) + Math.pow(newY - y, 2));\n    // Update the position only if the distance moved is greater than the threshold\n    if (distance > threshold) {\n      setClickPosition({ x: newX, y: newY });\n      setPopoverOpen(true);\n    }\n  }\n\n  React.useEffect(() => {\n    const svgWidth = barChartSvgRef?.current?.getBoundingClientRect().width || 0;\n    const MARGIN_WIDTH_IN_PX = 3;\n    if (svgWidth) {\n      const currentBarSpacing = (MARGIN_WIDTH_IN_PX / svgWidth) * 100;\n      setBarSpacingInPercent(currentBarSpacing);\n    }\n  }, [barChartSvgRef]);\n\n  function _legendHighlighted(barLegend?: string) {\n    if (barLegend === undefined) {\n      return false;\n    }\n    return selectedLegend === barLegend || (selectedLegend === '' && activeLegend === barLegend);\n  }\n\n  /**\n   * This function checks if none of the legends is selected or hovered.*/\n\n  function _noLegendHighlighted() {\n    return selectedLegend === '' && activeLegend === '';\n  }\n\n  const { data } = props;\n  _adjustProps();\n  const classes = useHorizontalBarChartStyles(props);\n  const focusAttributes = useFocusableGroup();\n  const legendButtons = _createLegends(data!);\n\n  let datapoint: number | undefined = 0;\n  return !_isChartEmpty() ? (\n    <div className={classes.root} onMouseLeave={_handleChartMouseLeave}>\n      {data!.map((points: ChartProps, index: number) => {\n        if (points.chartData && points.chartData![0] && points.chartData![0].horizontalBarChartdata!.x) {\n          datapoint = points.chartData![0].horizontalBarChartdata!.x;\n        } else {\n          datapoint = 0;\n        }\n        isSingleBar =\n          points.chartData!.length === 1 || (points.chartData!.length > 1 && points.chartData![1].legend === '');\n        if (isSingleBar) {\n          points.chartData![1] = {\n            legend: '',\n            horizontalBarChartdata: {\n              x: points.chartData![0].horizontalBarChartdata!.total! - datapoint!,\n              total: points.chartData![0].horizontalBarChartdata!.total!,\n            },\n            color: tokens.colorBackgroundOverlay,\n          };\n        }\n\n        // Hide right side text of chart title for absolute-scale variant\n        const chartDataText =\n          props.variant === HorizontalBarChartVariant.AbsoluteScale ? null : _getChartDataText(points!);\n        const bars = _createBars(points!);\n        const keyVal = _uniqLineText + '_' + index;\n        // ToDo - Showtriangle property is per data series. How to account for it in the new stylesheet\n        /*         const classes = useHorizontalBarChartStyles(props.styles!, {\n          width: props.width,\n          showTriangle: !!points!.chartData![0].data,\n          variant: props.variant,\n        }); */\n\n        return (\n          <div key={index}>\n            <div className={classes.items} {...focusAttributes}>\n              <div className={classes.chartTitle}>\n                {points!.chartTitle && (\n                  <FocusableTooltipText\n                    className={classes.chartTitleLeft}\n                    content={points!.chartTitle}\n                    accessibilityData={points!.chartTitleAccessibilityData}\n                  />\n                )}\n                {chartDataText}\n              </div>\n              {points!.chartData![0].data && _createBenchmark(points!)}\n              <svg ref={barChartSvgRef} className={classes.chart} aria-label={points!.chartTitle}>\n                <g\n                  id={keyVal}\n                  ref={(e: SVGGElement) => {\n                    _refCallback(e, points!.chartData![0].legend);\n                  }}\n                  // NOTE: points.chartData![0] contains current data value\n                  onClick={() => {\n                    const p = points!.chartData![0];\n                    if (p && p.onClick) {\n                      p.onClick();\n                    }\n                  }}\n                >\n                  {bars}\n                </g>\n              </svg>\n            </div>\n          </div>\n        );\n      })}\n      <ChartPopover\n        xCalloutValue={xCalloutValue}\n        yCalloutValue={yCalloutValue}\n        culture={props.culture ?? 'en-us'}\n        clickPosition={clickPosition}\n        isPopoverOpen={isPopoverOpen}\n        legend={legend!}\n        YValue={hoverValue!}\n        color={lineColor}\n        isCalloutForStack={false}\n        customCallout={{\n          customizedCallout: props.onRenderCalloutPerHorizontalBar\n            ? props.onRenderCalloutPerHorizontalBar(barCalloutProps!)\n            : undefined,\n          customCalloutProps: props.calloutPropsPerDataPoint\n            ? props.calloutPropsPerDataPoint(barCalloutProps!)\n            : undefined,\n        }}\n        isCartesian={false}\n      />\n      {!isSingleBar && (\n        <div ref={(e: HTMLDivElement) => (legendContainer.current = e)} className={classes.legendContainer}>\n          {legendButtons}\n        </div>\n      )}\n    </div>\n  ) : (\n    <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n  );\n  //TODO validate and fix focus border for issue for popover\n});\nHorizontalBarChart.displayName = 'HorizontalBarChart';\n"],"names":["React","useHorizontalBarChartStyles","HorizontalBarChartVariant","formatToLocaleString","formatScientificLimitWidth","getAccessibleDataObject","useRtl","useId","tokens","useFocusableGroup","ChartPopover","FocusableTooltipText","Legends","HorizontalBarChart","forwardRef","props","forwardedRef","legendContainer","useRef","_uniqLineText","_refArray","_isRTL","barChartSvgRef","createRef","_emptyChartId","_barHeight","_calloutAnchorPoint","isSingleBar","hoverValue","setHoverValue","useState","lineColor","setLineColor","legend","setLegend","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","barCalloutProps","setBarCalloutProps","barSpacingInPercent","setBarSpacingInPercent","isPopoverOpen","setPopoverOpen","clickPosition","setClickPosition","x","y","selectedLegend","setSelectedLegend","activeLegend","setActiveLegend","_refCallback","element","legendTitle","push","index","refElement","_hoverOn","event","hoverVal","point","_legendHighlighted","_noLegendHighlighted","clientX","clientY","targetRect","target","getBoundingClientRect","left","width","top","height","updatePosition","color","xAxisCalloutData","yAxisCalloutData","_hoverOff","_handleChartMouseLeave","_adjustProps","barHeight","_getChartDataText","data","_getDefaultTextData","_createLegends","chartProps","legendItems","forEach","chartData","dataPoint","legendItem","title","action","hoverAction","onMouseOutAction","legends","centerLegends","overflowText","legendsOverflowText","legendProps","culture","accessibilityData","chartDataAccessibilityData","total","reduce","acc","horizontalBarChartdata","div","className","classes","chartTitleRight","chartDataMode","span","chartDataTextDenominator","dataRatioPercentage","Math","round","_createBenchmark","undefined","totalData","benchmarkData","benchmarkRatio","benchmarkStyles","benchmarkContainer","triangle","style","_createBars","noOfBars","count","totalMarginPercent","defaultColors","colorPaletteBlueForeground2","colorPaletteCornflowerForeground2","colorPaletteDarkGreenForeground2","colorPaletteNavyForeground2","colorPaletteDarkOrangeForeground2","startingPoint","prevPosition","value","sumOfPercent","map","pointData","scalingRatio","bars","floor","random","xValue","placeholderIndex","isLegendSelected","variant","AbsoluteScale","hideLabels","text","key","barValue","dominantBaseline","transform","barLabel","aria-hidden","rect","fill","onMouseOver","onFocus","role","aria-label","_getAriaLabel","onBlur","onMouseLeave","barWrapper","opacity","tabIndex","yValue","callOutAccessibilityData","ariaLabel","_isChartEmpty","length","newX","newY","threshold","distance","sqrt","pow","useEffect","svgWidth","current","MARGIN_WIDTH_IN_PX","currentBarSpacing","barLegend","focusAttributes","legendButtons","datapoint","root","points","colorBackgroundOverlay","chartDataText","keyVal","items","chartTitle","chartTitleLeft","content","chartTitleAccessibilityData","svg","ref","chart","g","id","e","onClick","p","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerHorizontalBar","customCalloutProps","calloutPropsPerDataPoint","isCartesian","displayName"],"mappings":"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"}

package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.types.js

@@ -10,8 +10,8 @@ Object.defineProperty(exports, "HorizontalBarChartVariant", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-var HorizontalBarChartVariant;
-(function(HorizontalBarChartVariant) {
+var HorizontalBarChartVariant = /*#__PURE__*/ function(HorizontalBarChartVariant) {
     HorizontalBarChartVariant["PartToWhole"] = "part-to-whole";
     HorizontalBarChartVariant["AbsoluteScale"] = "absolute-scale";
-})(HorizontalBarChartVariant || (HorizontalBarChartVariant = {}));
+    return HorizontalBarChartVariant;
+}({});

package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["HorizontalBarChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { ChartPopoverProps } from '../CommonComponents/ChartPopover.types';\nimport { ChartDataPoint, ChartProps } from './index';\nimport { LegendsProps } from '../Legends/index';\n\n/**\n * Horizontal Bar Chart properties\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartProps extends React.RefAttributes<HTMLDivElement> {\n  /**\n   * An array of chart data points for the Horizontal bar chart\n   */\n  data?: ChartProps[];\n\n  /**\n   * Width of bar chart\n   */\n  width?: number;\n\n  /**\n   * Height of bar chart\n   * @default 15\n   */\n  barHeight?: number;\n\n  /**\n   * Additional CSS class(es) to apply to the StackedBarChart.\n   */\n  className?: string;\n\n  /**\n   * This property tells whether to show ratio on top of stacked bar chart or not.\n   */\n  hideRatio?: boolean[];\n\n  /**\n   * Do not show tooltips in chart\n   *\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * This property tells how to show data text on top right of bar chart.\n   * If barChartCustomData props added, then this props will be overrided.\n   * @default 'default'\n   */\n  chartDataMode?: ChartDataMode;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: HorizontalBarChartStyles;\n\n  /**\n   * Define a custom callout renderer for a horizontal bar\n   */\n  // onRenderCalloutPerHorizontalBar?: IRenderFunction<IChartDataPoint>; ToDo - Need to use slots here.\n\n  /**\n   * props for the callout in the chart\n   */\n  calloutProps?: ChartPopoverProps;\n\n  /**\n   * Custom text to the chart (right side of the chart)\n   * IChartProps will be available as props to the method prop.\n   * If this method not given, default values (IHorizontalDataPoint \\{x,y\\})\n   * will be used to display the data/text based on given chartModeData prop.\n   */\n  // barChartCustomData?: IRenderFunction<IChartProps>; ToDo - Need to use slots here.\n\n  /**\n   * The prop used to define the culture to localized the numbers\n   */\n  culture?: string;\n\n  /**\n   * Prop to define the variant of HorizontalBarChart to render\n   * @default HorizontalBarChartVariant.PartToWhole\n   */\n  variant?: HorizontalBarChartVariant;\n\n  /**\n   * Prop to hide the bar labels\n   * @default false\n   */\n  hideLabels?: boolean;\n\n  /**\n   * line color for callout\n   */\n  color?: string;\n\n  /**\n   * prop to check if benchmark data is provided\n   */\n  showTriangle?: boolean;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /*\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<LegendsProps>;\n\n  /**\n   * prop to render the custom callout\n   */\n  onRenderCalloutPerHorizontalBar?: (props: ChartDataPoint) => JSX.Element | undefined;\n\n  /**\n   * Define a custom callout props override\n   */\n  calloutPropsPerDataPoint?: (dataPointCalloutProps: ChartDataPoint) => ChartPopoverProps;\n}\n\n/**\n * Horizontal Bar Chart styles\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartStyles {\n  /**\n   * Styling for the root container\n   */\n  root: string;\n\n  /**\n   * Styling for each item in the container\n   */\n  items: string;\n\n  /**\n   * Style for the chart.\n   */\n  chart: string;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle: string;\n\n  /**\n   * Style for the bars.\n   */\n  barWrapper: string;\n\n  /**\n   * Style for left side text of the chart title\n   */\n  chartTitleLeft: string;\n\n  /**\n   * Style for right side text of the chart title\n   */\n  chartTitleRight: string;\n\n  /**\n   * Style for the chart data text denominator.\n   */\n  chartDataTextDenominator: string;\n\n  /**\n   * Style for the benchmark container\n   */\n  benchmarkContainer: string;\n\n  /**\n   * Style for the benchmark triangle\n   */\n  triangle: string;\n\n  /**\n   * Style for the bar labels\n   */\n  barLabel: string;\n\n  /**\n   * Style for the div containing the chart\n   */\n  chartWrapper: string;\n\n  /**\n   * Style for the legend container.\n   */\n  legendContainer: string;\n}\n\n/**\n * Chart data mode for chart data text\n * default: show the datapoint.x value\n * fraction: show the fraction of datapoint.x/datapoint.y\n * percentage: show the percentage of (datapoint.x/datapoint.y)%\n * {@docCategory HorizontalBarChart}\n */\nexport type ChartDataMode = 'default' | 'fraction' | 'percentage';\n\n/**\n * {@docCategory HorizontalBarChart}\n */\nexport enum HorizontalBarChartVariant {\n  PartToWhole = 'part-to-whole',\n  AbsoluteScale = 'absolute-scale',\n}\n"],"names":["HorizontalBarChartVariant"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;iEAAuB;;UA0MXA,yBAAAA;;;GAAAA,6BAAAA,CAAAA,4BAAAA,CAAAA,CAAAA"}
+{"version":3,"sources":["HorizontalBarChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { ChartPopoverProps } from '../CommonComponents/ChartPopover.types';\nimport { ChartDataPoint, ChartProps } from './index';\nimport { LegendsProps } from '../Legends/index';\n\n/**\n * Horizontal Bar Chart properties\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartProps extends React.RefAttributes<HTMLDivElement> {\n  /**\n   * An array of chart data points for the Horizontal bar chart\n   */\n  data?: ChartProps[];\n\n  /**\n   * Width of bar chart\n   */\n  width?: number;\n\n  /**\n   * Height of bar chart\n   * @default 15\n   */\n  barHeight?: number;\n\n  /**\n   * Additional CSS class(es) to apply to the StackedBarChart.\n   */\n  className?: string;\n\n  /**\n   * This property tells whether to show ratio on top of stacked bar chart or not.\n   */\n  hideRatio?: boolean[];\n\n  /**\n   * Do not show tooltips in chart\n   *\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * This property tells how to show data text on top right of bar chart.\n   * If barChartCustomData props added, then this props will be overrided.\n   * @default 'default'\n   */\n  chartDataMode?: ChartDataMode;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: HorizontalBarChartStyles;\n\n  /**\n   * Define a custom callout renderer for a horizontal bar\n   */\n  // onRenderCalloutPerHorizontalBar?: IRenderFunction<IChartDataPoint>; ToDo - Need to use slots here.\n\n  /**\n   * props for the callout in the chart\n   */\n  calloutProps?: ChartPopoverProps;\n\n  /**\n   * Custom text to the chart (right side of the chart)\n   * IChartProps will be available as props to the method prop.\n   * If this method not given, default values (IHorizontalDataPoint \\{x,y\\})\n   * will be used to display the data/text based on given chartModeData prop.\n   */\n  // barChartCustomData?: IRenderFunction<IChartProps>; ToDo - Need to use slots here.\n\n  /**\n   * The prop used to define the culture to localized the numbers\n   */\n  culture?: string;\n\n  /**\n   * Prop to define the variant of HorizontalBarChart to render\n   * @default HorizontalBarChartVariant.PartToWhole\n   */\n  variant?: HorizontalBarChartVariant;\n\n  /**\n   * Prop to hide the bar labels\n   * @default false\n   */\n  hideLabels?: boolean;\n\n  /**\n   * line color for callout\n   */\n  color?: string;\n\n  /**\n   * prop to check if benchmark data is provided\n   */\n  showTriangle?: boolean;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /*\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<LegendsProps>;\n\n  /**\n   * prop to render the custom callout\n   */\n  onRenderCalloutPerHorizontalBar?: (props: ChartDataPoint) => JSX.Element | undefined;\n\n  /**\n   * Define a custom callout props override\n   */\n  calloutPropsPerDataPoint?: (dataPointCalloutProps: ChartDataPoint) => ChartPopoverProps;\n}\n\n/**\n * Horizontal Bar Chart styles\n * {@docCategory HorizontalBarChart}\n */\nexport interface HorizontalBarChartStyles {\n  /**\n   * Styling for the root container\n   */\n  root: string;\n\n  /**\n   * Styling for each item in the container\n   */\n  items: string;\n\n  /**\n   * Style for the chart.\n   */\n  chart: string;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle: string;\n\n  /**\n   * Style for the bars.\n   */\n  barWrapper: string;\n\n  /**\n   * Style for left side text of the chart title\n   */\n  chartTitleLeft: string;\n\n  /**\n   * Style for right side text of the chart title\n   */\n  chartTitleRight: string;\n\n  /**\n   * Style for the chart data text denominator.\n   */\n  chartDataTextDenominator: string;\n\n  /**\n   * Style for the benchmark container\n   */\n  benchmarkContainer: string;\n\n  /**\n   * Style for the benchmark triangle\n   */\n  triangle: string;\n\n  /**\n   * Style for the bar labels\n   */\n  barLabel: string;\n\n  /**\n   * Style for the div containing the chart\n   */\n  chartWrapper: string;\n\n  /**\n   * Style for the legend container.\n   */\n  legendContainer: string;\n}\n\n/**\n * Chart data mode for chart data text\n * default: show the datapoint.x value\n * fraction: show the fraction of datapoint.x/datapoint.y\n * percentage: show the percentage of (datapoint.x/datapoint.y)%\n * {@docCategory HorizontalBarChart}\n */\nexport type ChartDataMode = 'default' | 'fraction' | 'percentage';\n\n/**\n * {@docCategory HorizontalBarChart}\n */\nexport enum HorizontalBarChartVariant {\n  PartToWhole = 'part-to-whole',\n  AbsoluteScale = 'absolute-scale',\n}\n"],"names":["React","HorizontalBarChartVariant"],"mappings":";;;;;;;;;;;iEAAuB,QAAQ;AA0MxB,IAAKC,4BAAAA,WAAAA,GAAAA,SAAAA,yBAAAA;;;WAAAA;MAGX"}

package/lib-commonjs/components/HorizontalBarChart/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './HorizontalBarChart';\nexport * from './HorizontalBarChart.types';\nexport * from '../../types/index';\n"],"names":[],"rangeMappings":";;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './HorizontalBarChart';\nexport * from './HorizontalBarChart.types';\nexport * from '../../types/index';\n"],"names":[],"mappings":";;;;;uBAAc,uBAAuB;uBACvB,6BAA6B;uBAC7B,oBAAoB"}

package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useHorizontalBarChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { HorizontalBarChartVariant } from './index';\n/**\n * @internal\n */ export const hbcClassNames = {\n    root: 'fui-hbc__root',\n    items: 'fui-hbc__items',\n    chart: 'fui-hbc__chart',\n    chartTitle: 'fui-hbc__chartTitle',\n    barWrapper: 'fui-hbc__barWrapper',\n    chartTitleLeft: 'fui-hbc__chartTitleLeft',\n    chartTitleRight: 'fui-hbc__chartTitleRight',\n    chartDataTextDenominator: 'fui-hbc__textDenom',\n    benchmarkContainer: 'fui-hbc__benchmark',\n    triangle: 'fui-hbc__triangle',\n    barLabel: 'fui-hbc__barLabel',\n    chartWrapper: 'fui-hbc__chartWrapper',\n    legendContainer: 'fui-hbc__legendContainer'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        display: 'flex',\n        flexDirection: 'column',\n        width: '100%'\n    },\n    items10pMargin: {\n        marginBottom: tokens.spacingVerticalMNudge\n    },\n    items16pMargin: {\n        marginBottom: tokens.spacingVerticalL\n    },\n    chart: {\n        width: '100%',\n        height: '12px',\n        display: 'block',\n        overflow: 'visible'\n    },\n    barWrapper: {},\n    chartTitle: {\n        ...typographyStyles.caption1,\n        display: 'flex',\n        justifyContent: 'space-between'\n    },\n    chartTitleLeft: {\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n        whiteSpace: 'nowrap',\n        display: 'block',\n        color: tokens.colorNeutralForeground1\n    },\n    chartTitleLeft4pMargin: {\n        marginBottom: '4px'\n    },\n    chartTitleLeft5pMargin: {\n        marginBottom: '5px'\n    },\n    chartTitleRight: {\n        ...typographyStyles.body1Strong,\n        color: tokens.colorNeutralForeground1\n    },\n    chartDataTextDenominator: {\n        ...typographyStyles.body1,\n        color: tokens.colorNeutralForeground1\n    },\n    benchmarkContainer: {\n        position: 'relative',\n        height: '7px',\n        marginTop: '-3px',\n        marginBottom: '-1px'\n    },\n    triangle: {\n        width: '0',\n        height: '0',\n        ...shorthands.borderLeft('4px', 'solid', 'transparent'),\n        ...shorthands.borderRight('4px', 'solid', 'transparent'),\n        ...shorthands.borderTop('7px', 'solid'),\n        borderTopColor: tokens.colorPaletteBlueBorderActive,\n        marginBottom: tokens.spacingVerticalXS,\n        position: 'absolute'\n    },\n    barLabel: {\n        ...typographyStyles.caption1Strong,\n        fill: tokens.colorNeutralForeground1,\n        forcedColorAdjust: 'none'\n    },\n    chartWrapper40ppadding: {\n        paddingRight: '40p'\n    },\n    chartWrapper0ppadding: {\n        paddingRight: tokens.spacingHorizontalNone\n    },\n    legendContainer: {\n        paddingTop: tokens.spacingVerticalL\n    }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useHorizontalBarChartStyles = (props)=>{\n    var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6, _props_styles7, _props_styles8, _props_styles9, _props_styles10, _props_styles11, _props_styles12;\n    const { className, showTriangle, variant, hideLabels } = props; // ToDo - width, barHeight is non enumerable. Need to be used inline.\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(hbcClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        items: mergeClasses(hbcClassNames.items, showTriangle || variant === HorizontalBarChartVariant.AbsoluteScale ? baseStyles.items16pMargin : baseStyles.items10pMargin, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.items),\n        chart: mergeClasses(hbcClassNames.chart, baseStyles.chart, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.chart),\n        chartTitle: mergeClasses(hbcClassNames.chartTitle, baseStyles.chartTitle, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chartTitle),\n        barWrapper: mergeClasses(hbcClassNames.barWrapper, baseStyles.barWrapper, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.barWrapper),\n        chartTitleLeft: mergeClasses(hbcClassNames.chartTitleLeft, baseStyles.chartTitleLeft, variant === HorizontalBarChartVariant.AbsoluteScale ? baseStyles.chartTitleLeft4pMargin : baseStyles.chartTitleLeft5pMargin, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.chartTitleLeft),\n        chartTitleRight: mergeClasses(hbcClassNames.chartTitleRight, baseStyles.chartTitleRight, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.chartTitleRight),\n        chartDataTextDenominator: mergeClasses(hbcClassNames.chartDataTextDenominator, baseStyles.chartDataTextDenominator, (_props_styles7 = props.styles) === null || _props_styles7 === void 0 ? void 0 : _props_styles7.chartDataTextDenominator),\n        benchmarkContainer: mergeClasses(hbcClassNames.benchmarkContainer, baseStyles.benchmarkContainer, (_props_styles8 = props.styles) === null || _props_styles8 === void 0 ? void 0 : _props_styles8.benchmarkContainer),\n        triangle: mergeClasses(hbcClassNames.triangle, baseStyles.triangle, (_props_styles9 = props.styles) === null || _props_styles9 === void 0 ? void 0 : _props_styles9.triangle),\n        barLabel: mergeClasses(hbcClassNames.barLabel, baseStyles.barLabel, (_props_styles10 = props.styles) === null || _props_styles10 === void 0 ? void 0 : _props_styles10.barLabel),\n        chartWrapper: mergeClasses(hbcClassNames.chartWrapper, variant === HorizontalBarChartVariant.AbsoluteScale && !hideLabels ? baseStyles.chartWrapper40ppadding : baseStyles.chartWrapper0ppadding, (_props_styles11 = props.styles) === null || _props_styles11 === void 0 ? void 0 : _props_styles11.chartWrapper),\n        legendContainer: mergeClasses(hbcClassNames.legendContainer, baseStyles.legendContainer, (_props_styles12 = props.styles) === null || _props_styles12 === void 0 ? void 0 : _props_styles12.legendContainer)\n    };\n};\n"],"names":["hbcClassNames","useHorizontalBarChartStyles","root","items","chart","chartTitle","barWrapper","chartTitleLeft","chartTitleRight","chartDataTextDenominator","benchmarkContainer","triangle","barLabel","chartWrapper","legendContainer","useStyles","__styles","mc9l5x","Beiy3e4","a9b677","items10pMargin","jrapky","items16pMargin","Bqenvij","B68tc82","Bmxbyg5","Bpg54ce","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Brf1p80","ygn44y","Huce71","sj55zd","chartTitleLeft4pMargin","chartTitleLeft5pMargin","qhf8xq","B6of3ja","ibv6hh","wvpqe5","zhjwy3","Bekrc4i","vrafjx","h3c5rm","B4j52fo","icvyot","g2u3we","Bkfmm31","Bvjb7m6","chartWrapper40ppadding","z189sj","chartWrapper0ppadding","z8tnut","d","p","props","_props_styles","_props_styles1","_props_styles2","_props_styles3","_props_styles4","_props_styles5","_props_styles6","_props_styles7","_props_styles8","_props_styles9","_props_styles10","_props_styles11","_props_styles12","className","showTriangle","variant","hideLabels","baseStyles","mergeClasses","styles","HorizontalBarChartVariant","AbsoluteScale"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["useHorizontalBarChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { HorizontalBarChartVariant } from './index';\n/**\n * @internal\n */ export const hbcClassNames = {\n    root: 'fui-hbc__root',\n    items: 'fui-hbc__items',\n    chart: 'fui-hbc__chart',\n    chartTitle: 'fui-hbc__chartTitle',\n    barWrapper: 'fui-hbc__barWrapper',\n    chartTitleLeft: 'fui-hbc__chartTitleLeft',\n    chartTitleRight: 'fui-hbc__chartTitleRight',\n    chartDataTextDenominator: 'fui-hbc__textDenom',\n    benchmarkContainer: 'fui-hbc__benchmark',\n    triangle: 'fui-hbc__triangle',\n    barLabel: 'fui-hbc__barLabel',\n    chartWrapper: 'fui-hbc__chartWrapper',\n    legendContainer: 'fui-hbc__legendContainer'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        display: 'flex',\n        flexDirection: 'column',\n        width: '100%'\n    },\n    items10pMargin: {\n        marginBottom: tokens.spacingVerticalMNudge\n    },\n    items16pMargin: {\n        marginBottom: tokens.spacingVerticalL\n    },\n    chart: {\n        width: '100%',\n        height: '12px',\n        display: 'block',\n        overflow: 'visible'\n    },\n    barWrapper: {},\n    chartTitle: {\n        ...typographyStyles.caption1,\n        display: 'flex',\n        justifyContent: 'space-between'\n    },\n    chartTitleLeft: {\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n        whiteSpace: 'nowrap',\n        display: 'block',\n        color: tokens.colorNeutralForeground1\n    },\n    chartTitleLeft4pMargin: {\n        marginBottom: '4px'\n    },\n    chartTitleLeft5pMargin: {\n        marginBottom: '5px'\n    },\n    chartTitleRight: {\n        ...typographyStyles.body1Strong,\n        color: tokens.colorNeutralForeground1\n    },\n    chartDataTextDenominator: {\n        ...typographyStyles.body1,\n        color: tokens.colorNeutralForeground1\n    },\n    benchmarkContainer: {\n        position: 'relative',\n        height: '7px',\n        marginTop: '-3px',\n        marginBottom: '-1px'\n    },\n    triangle: {\n        width: '0',\n        height: '0',\n        ...shorthands.borderLeft('4px', 'solid', 'transparent'),\n        ...shorthands.borderRight('4px', 'solid', 'transparent'),\n        ...shorthands.borderTop('7px', 'solid'),\n        borderTopColor: tokens.colorPaletteBlueBorderActive,\n        marginBottom: tokens.spacingVerticalXS,\n        position: 'absolute'\n    },\n    barLabel: {\n        ...typographyStyles.caption1Strong,\n        fill: tokens.colorNeutralForeground1,\n        forcedColorAdjust: 'none'\n    },\n    chartWrapper40ppadding: {\n        paddingRight: '40p'\n    },\n    chartWrapper0ppadding: {\n        paddingRight: tokens.spacingHorizontalNone\n    },\n    legendContainer: {\n        paddingTop: tokens.spacingVerticalL\n    }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useHorizontalBarChartStyles = (props)=>{\n    var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6, _props_styles7, _props_styles8, _props_styles9, _props_styles10, _props_styles11, _props_styles12;\n    const { className, showTriangle, variant, hideLabels } = props; // ToDo - width, barHeight is non enumerable. Need to be used inline.\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(hbcClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        items: mergeClasses(hbcClassNames.items, showTriangle || variant === HorizontalBarChartVariant.AbsoluteScale ? baseStyles.items16pMargin : baseStyles.items10pMargin, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.items),\n        chart: mergeClasses(hbcClassNames.chart, baseStyles.chart, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.chart),\n        chartTitle: mergeClasses(hbcClassNames.chartTitle, baseStyles.chartTitle, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chartTitle),\n        barWrapper: mergeClasses(hbcClassNames.barWrapper, baseStyles.barWrapper, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.barWrapper),\n        chartTitleLeft: mergeClasses(hbcClassNames.chartTitleLeft, baseStyles.chartTitleLeft, variant === HorizontalBarChartVariant.AbsoluteScale ? baseStyles.chartTitleLeft4pMargin : baseStyles.chartTitleLeft5pMargin, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.chartTitleLeft),\n        chartTitleRight: mergeClasses(hbcClassNames.chartTitleRight, baseStyles.chartTitleRight, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.chartTitleRight),\n        chartDataTextDenominator: mergeClasses(hbcClassNames.chartDataTextDenominator, baseStyles.chartDataTextDenominator, (_props_styles7 = props.styles) === null || _props_styles7 === void 0 ? void 0 : _props_styles7.chartDataTextDenominator),\n        benchmarkContainer: mergeClasses(hbcClassNames.benchmarkContainer, baseStyles.benchmarkContainer, (_props_styles8 = props.styles) === null || _props_styles8 === void 0 ? void 0 : _props_styles8.benchmarkContainer),\n        triangle: mergeClasses(hbcClassNames.triangle, baseStyles.triangle, (_props_styles9 = props.styles) === null || _props_styles9 === void 0 ? void 0 : _props_styles9.triangle),\n        barLabel: mergeClasses(hbcClassNames.barLabel, baseStyles.barLabel, (_props_styles10 = props.styles) === null || _props_styles10 === void 0 ? void 0 : _props_styles10.barLabel),\n        chartWrapper: mergeClasses(hbcClassNames.chartWrapper, variant === HorizontalBarChartVariant.AbsoluteScale && !hideLabels ? baseStyles.chartWrapper40ppadding : baseStyles.chartWrapper0ppadding, (_props_styles11 = props.styles) === null || _props_styles11 === void 0 ? void 0 : _props_styles11.chartWrapper),\n        legendContainer: mergeClasses(hbcClassNames.legendContainer, baseStyles.legendContainer, (_props_styles12 = props.styles) === null || _props_styles12 === void 0 ? void 0 : _props_styles12.legendContainer)\n    };\n};\n"],"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","HorizontalBarChartVariant","hbcClassNames","root","items","chart","chartTitle","barWrapper","chartTitleLeft","chartTitleRight","chartDataTextDenominator","benchmarkContainer","triangle","barLabel","chartWrapper","legendContainer","useStyles","mc9l5x","Beiy3e4","a9b677","items10pMargin","jrapky","items16pMargin","Bqenvij","B68tc82","Bmxbyg5","Bpg54ce","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Brf1p80","ygn44y","Huce71","sj55zd","chartTitleLeft4pMargin","chartTitleLeft5pMargin","qhf8xq","B6of3ja","ibv6hh","wvpqe5","zhjwy3","Bekrc4i","vrafjx","h3c5rm","B4j52fo","icvyot","g2u3we","Bkfmm31","Bvjb7m6","chartWrapper40ppadding","z189sj","chartWrapper0ppadding","z8tnut","d","p","useHorizontalBarChartStyles","props","_props_styles","_props_styles1","_props_styles2","_props_styles3","_props_styles4","_props_styles5","_props_styles6","_props_styles7","_props_styles8","_props_styles9","_props_styles10","_props_styles11","_props_styles12","className","showTriangle","variant","hideLabels","baseStyles","styles","AbsoluteScale"],"mappings":"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"}

package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js

@@ -189,7 +189,13 @@ const HorizontalBarChartWithAxis = /*#__PURE__*/ _react.forwardRef((props, forwa
         setPopoverOpen(false);
     }
     // eslint-disable-next-line @typescript-eslint/no-shadow
-    function _onBarFocus(point, refArrayIndexNumber, color) {
+    function _onBarFocus(event, point, refArrayIndexNumber, color) {
+        let cx = 0;
+        let cy = 0;
+        const targetRect = event.target.getBoundingClientRect();
+        cx = targetRect.left + targetRect.width / 2;
+        cy = targetRect.top + targetRect.height / 2;
+        _updatePosition(cx, cy);
         if ((isLegendSelected === false || _isLegendHighlighted(point.legend)) && _calloutAnchorPoint !== point) {
             // eslint-disable-next-line @typescript-eslint/no-shadow
             _refArray.forEach((obj, index)=>{
@@ -328,7 +334,7 @@ const HorizontalBarChartWithAxis = /*#__PURE__*/ _react.forwardRef((props, forwa
                 role: "img",
                 "aria-labelledby": `toolTip${_calloutId}`,
                 onMouseLeave: _onBarLeave,
-                onFocus: ()=>_onBarFocus(point, index, startColor),
+                onFocus: (event)=>_onBarFocus(event, point, index, startColor),
                 onBlur: _onBarLeave,
                 fill: startColor,
                 opacity: shouldHighlight ? 1 : 0.1,
@@ -460,7 +466,7 @@ const HorizontalBarChartWithAxis = /*#__PURE__*/ _react.forwardRef((props, forwa
                 onBlur: _onBarLeave,
                 "data-is-focusable": shouldHighlight,
                 opacity: shouldHighlight ? 1 : 0.1,
-                onFocus: ()=>_onBarFocus(point, index, startColor),
+                onFocus: (event)=>_onBarFocus(event, point, index, startColor),
                 fill: startColor,
                 tabIndex: point.legend !== '' ? 0 : undefined
             }));