@fluentui/react-charts 9.3.1 → 9.3.3

package/lib/components/FunnelChart/FunnelChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/FunnelChart/FunnelChart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { useRtl } from '../../utilities/index';\nimport { FunnelChartDataPoint, FunnelChartProps } from './FunnelChart.types';\nimport { Legend, Legends, LegendContainer } from '../Legends/index';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { getContrastTextColor } from '../../utilities/colors';\nimport { useFunnelChartStyles } from './useFunnelChartStyles.styles';\nimport {\n  getHorizontalFunnelSegmentGeometry,\n  getVerticalFunnelSegmentGeometry,\n  getSegmentTextProps,\n  getStackedHorizontalFunnelSegmentGeometry,\n  getStackedVerticalFunnelSegmentGeometry,\n} from './funnelGeometry';\nimport { ChartPopoverProps, ImageExportOptions } from '../../index';\nimport { toImage } from '../../utilities/image-export-utils';\n\nexport const FunnelChart: React.FunctionComponent<FunnelChartProps> = React.forwardRef<\n  HTMLDivElement,\n  FunnelChartProps\n>((props, forwardedRef) => {\n  const _emptyChartId: string = useId('_FunnelChart_empty');\n  const isRTL = useRtl();\n\n  const [hoveredStage, setHoveredStage] = React.useState<string | null>(null);\n  const [calloutData, setCalloutData] = React.useState<FunnelChartDataPoint | null>(null);\n  const [selectedLegends, setSelectedLegends] = React.useState<string[]>([]);\n  const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n  const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n  const chartContainerRef = React.useRef<HTMLDivElement | null>(null);\n  const isStacked = isStackedFunnelData(props.data);\n  const _legendsRef = React.useRef<LegendContainer>(null);\n\n  React.useEffect(() => {\n    if (props.legendProps?.selectedLegends) {\n      setSelectedLegends(props.legendProps.selectedLegends);\n    }\n  }, [props.legendProps?.selectedLegends]);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      toImage: (opts?: ImageExportOptions): Promise<string> => {\n        return toImage(chartContainerRef.current, _legendsRef.current?.toSVG, isRTL, opts);\n      },\n    }),\n    [],\n  );\n\n  function _handleHover(data: FunnelChartDataPoint, mouseEvent: React.MouseEvent<SVGElement>) {\n    mouseEvent?.persist();\n    updatePosition(mouseEvent.clientX, mouseEvent.clientY);\n    setCalloutData(data);\n    setPopoverOpen(true);\n  }\n\n  function _handleFocus(data: FunnelChartDataPoint, focusEvent: React.FocusEvent<SVGPathElement>) {\n    focusEvent?.persist();\n    let x = 0;\n    let y = 0;\n    const targetRect = (focusEvent.target as SVGPathElement).getBoundingClientRect();\n    x = targetRect.left + targetRect.width / 2;\n    y = targetRect.top + targetRect.height / 2;\n\n    updatePosition(x, y);\n    setCalloutData(data);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedHover(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    mouseEvent: React.MouseEvent<SVGElement>,\n  ) {\n    mouseEvent?.persist();\n    updatePosition(mouseEvent.clientX, mouseEvent.clientY);\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedFocus(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    focusEvent: React.FocusEvent<SVGPathElement>,\n  ) {\n    focusEvent?.persist();\n    let x = 0;\n    let y = 0;\n    const targetRect = (focusEvent.target as SVGPathElement).getBoundingClientRect();\n    x = targetRect.left + targetRect.width / 2;\n    y = targetRect.top + targetRect.height / 2;\n\n    updatePosition(x, y);\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setPopoverOpen(true);\n  }\n\n  function _handleMouseOut() {\n    setHoveredStage(null);\n    setPopoverOpen(false);\n    setCalloutData(null);\n  }\n\n  function _onLegendSelectionChange(\n    legendsSelected: string[],\n    event: React.MouseEvent<HTMLButtonElement>,\n    currentLegend?: Legend,\n  ): void {\n    if (props.legendProps?.canSelectMultipleLegends) {\n      setSelectedLegends(legendsSelected);\n    } else {\n      setSelectedLegends(legendsSelected.slice(-1));\n    }\n\n    if (props.legendProps?.onChange) {\n      props.legendProps.onChange(legendsSelected, event, currentLegend);\n    }\n  }\n\n  const _onLegendSelectionChangeCallback = React.useCallback(_onLegendSelectionChange, [props.legendProps]);\n\n  function getHighlightedLegend(): string[] {\n    return selectedLegends.length > 0 ? selectedLegends : hoveredStage ? [hoveredStage] : [];\n  }\n\n  function legendHighlighted(legend: string): boolean {\n    return getHighlightedLegend().includes(legend);\n  }\n\n  function noLegendHighlighted(): boolean {\n    return getHighlightedLegend().length === 0;\n  }\n\n  function _getEventHandlerProps(\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } },\n    opacity?: number,\n  ) {\n    if ('subValue' in data) {\n      return {\n        culture: props.culture,\n        onMouseOver:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) => _handleStackedHover(data.stage, data.subValue, event)\n            : undefined,\n        onMouseMove:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) => _handleStackedHover(data.stage, data.subValue, event)\n            : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) => _handleStackedFocus(data.stage, data.subValue, event),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    } else {\n      return {\n        culture: props.culture,\n        onMouseOver: opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event) : undefined,\n        onMouseMove: opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event) : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) => _handleFocus(data, event),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    }\n  }\n\n  function _renderSegmentText({\n    show,\n    x,\n    y,\n    value,\n    textColor,\n    opacity,\n  }: {\n    show: boolean;\n    x: number;\n    y: number;\n    value: number;\n    textColor: string;\n    opacity: number;\n  }) {\n    if (!show) {\n      return null;\n    }\n\n    const textElement = (\n      <text\n        x={isRTL ? funnelWidth - x : x}\n        y={y}\n        opacity={opacity}\n        textAnchor=\"middle\"\n        alignmentBaseline=\"middle\"\n        fill={textColor}\n      >\n        {formatToLocaleString(value.toString(), props.culture) as React.ReactNode}\n      </text>\n    );\n\n    if (isRTL) {\n      return <g transform={`scale(-1,1) translate(${-funnelWidth},0)`}>{textElement}</g>;\n    }\n    return textElement;\n  }\n\n  function _renderFunnelSegment({\n    key,\n    pathD,\n    fill,\n    opacity,\n    textProps,\n    data,\n    tabIndex,\n  }: {\n    key: string | number;\n    pathD: string;\n    fill: string;\n    opacity: number;\n    textProps?: {\n      show: boolean;\n      x: number;\n      y: number;\n      value: number;\n    };\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } };\n    tabIndex?: number;\n  }) {\n    const eventHandlers = _getEventHandlerProps(data, opacity);\n    const textColor = getContrastTextColor(fill);\n\n    return (\n      <g key={key}>\n        <path d={pathD} fill={fill} opacity={opacity} {...eventHandlers} tabIndex={tabIndex} />\n        {textProps && <g {...eventHandlers}>{_renderSegmentText({ ...textProps, textColor, opacity })}</g>}\n      </g>\n    );\n  }\n\n  function _createFunnel(\n    containerHeight: number,\n    containerWidth: number,\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement[] {\n    const { data } = props;\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    return data.map((d, i) => {\n      const geometryProps =\n        props.orientation === 'vertical'\n          ? getVerticalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL })\n          : getHorizontalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL });\n\n      const { pathD, textX, textY, availableWidth } = geometryProps;\n      const minTextWidth = 16;\n      const eventHandlerProps = _getEventHandlerProps(d);\n      const textProps = getSegmentTextProps({\n        availableWidth,\n        minTextWidth,\n        textX,\n        textY,\n        value: d.value!,\n        ...eventHandlerProps,\n      });\n\n      return _renderFunnelSegment({\n        key: i,\n        pathD,\n        fill: d.color!,\n        opacity: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 1 : 0.1,\n        textProps,\n        data: d,\n        tabIndex: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 0 : undefined,\n      });\n    });\n  }\n\n  function isStackedFunnelData(data: FunnelChartDataPoint[]): boolean {\n    return Array.isArray(data) && data.every(stage => Array.isArray(stage.subValues));\n  }\n\n  function _renderStackedSegment(\n    stage: FunnelChartDataPoint,\n    subValue: { value: number; color: string; category: string },\n    stageIndex: number,\n    subValueIndex: number,\n    geometryParams: {\n      stages: FunnelChartDataPoint[];\n      totals: number[];\n      maxTotal: number;\n      funnelWidth: number;\n      funnelHeight: number;\n      isRTL: boolean;\n    },\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement {\n    // Ensure stages have subValues for geometry functions\n    const stagesWithSubValues = geometryParams.stages.map(s => ({\n      ...s,\n      subValues: s.subValues || [],\n    }));\n    const geom =\n      props.orientation === 'vertical'\n        ? getStackedVerticalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          })\n        : getStackedHorizontalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          });\n\n    const minTextWidth = 16;\n    const eventHandlerProps = _getEventHandlerProps({ stage: stage.stage as string, subValue });\n    const textProps = getSegmentTextProps({\n      availableWidth: geom.availableWidth,\n      minTextWidth,\n      textX: geom.textX,\n      textY: geom.textY,\n      value: subValue.value,\n      ...eventHandlerProps,\n    });\n\n    return _renderFunnelSegment({\n      key: `${stageIndex}-${subValueIndex}`,\n      pathD: geom.pathD,\n      fill: subValue.color,\n      opacity:\n        (isStackedFunnelData(props.data) && legendHighlighted(subValue.category)) || noLegendHighlighted() ? 1 : 0.1,\n      textProps,\n      data: { stage: stage.stage as string, subValue },\n      tabIndex: legendHighlighted(subValue.category) || noLegendHighlighted() ? 0 : undefined,\n    });\n  }\n\n  function _createStackedFunnel(\n    containerHeight: number,\n    containerWidth: number,\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement[] {\n    const { data } = props;\n\n    const stages = data;\n    const totals = stages.map(s => s?.subValues?.reduce((sum, subValue) => sum + subValue.value, 0) ?? 0);\n    const maxTotal = Math.max(...totals);\n\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    const paths: JSXElement[] = [];\n\n    const geometryParams = {\n      stages,\n      totals,\n      maxTotal,\n      funnelWidth,\n      funnelHeight,\n      isRTL,\n    };\n\n    for (let i = 0; i < stages.length; i++) {\n      const cur = stages[i];\n      for (let k = 0; k < (cur.subValues ?? []).length; k++) {\n        const v = cur.subValues?.[k];\n        if (!v) {\n          continue;\n        }\n        paths.push(_renderStackedSegment(cur, v, i, k, geometryParams));\n      }\n    }\n    return paths;\n  }\n\n  function _renderLegends(): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement {\n    if (props.hideLegend) {\n      return <></>;\n    }\n    let legends: Legend[];\n\n    if (isStacked) {\n      // Collect unique categories and their color\n      const categoryMap: Record<string, string> = {};\n      props.data.forEach((stage: FunnelChartDataPoint) => {\n        (stage.subValues || []).forEach(sub => {\n          if (!(sub.category in categoryMap)) {\n            categoryMap[sub.category] = sub.color;\n          }\n        });\n      });\n      legends = Object.entries(categoryMap).map(([category, color]) => ({\n        title: category,\n        color,\n        hoverAction: () => setHoveredStage(category),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    } else {\n      legends = props.data.map((d: FunnelChartDataPoint) => ({\n        title: d.stage as string,\n        color: d.color!,\n        hoverAction: () => setHoveredStage(d.stage as string),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    }\n\n    return (\n      <div style={{ display: 'flex', justifyContent: 'center' }}>\n        <Legends\n          legends={legends}\n          centerLegends={true}\n          onChange={_onLegendSelectionChangeCallback}\n          {...props.legendProps}\n          legendRef={_legendsRef}\n        />\n      </div>\n    );\n  }\n\n  function _isChartEmpty(): boolean {\n    return !(props.data && props.data.length > 0);\n  }\n\n  function updatePosition(newX: number, newY: number) {\n    const threshold = 1; // Set a threshold for movement\n    const { x, y } = clickPosition;\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  const classes = useFunnelChartStyles(props);\n\n  const calloutProps: ChartPopoverProps = {\n    ...props.calloutProps,\n    color: calloutData?.color,\n    hoverXValue: calloutData?.stage,\n    YValue: calloutData?.value,\n  };\n\n  const width = props.width || 350;\n  const height = props.height || 500;\n\n  const funnelMarginTop = 40;\n  const funnelWidth = width * 0.8;\n  const funnelOffsetX = (width - funnelWidth) / 2;\n  const focusAttributes = useFocusableGroup();\n\n  return !_isChartEmpty() ? (\n    <div ref={chartContainerRef} className={classes.root} {...focusAttributes} style={{ width, height }}>\n      <svg width={width} height={height} className={classes.chart} role={'img'} aria-label={props.chartTitle}>\n        <g\n          transform={\n            isRTL\n              ? `translate(${funnelOffsetX + funnelWidth}, ${funnelMarginTop}) scale(-1,1)`\n              : `translate(${funnelOffsetX}, ${funnelMarginTop})`\n          }\n        >\n          {isStacked\n            ? _createStackedFunnel(height - funnelMarginTop, funnelWidth)\n            : _createFunnel(height - funnelMarginTop, funnelWidth)}\n        </g>\n      </svg>\n      {isPopoverOpen && (\n        <ChartPopover\n          {...props.calloutProps}\n          XValue={calloutProps?.hoverXValue as string}\n          yCalloutValue={calloutProps?.YValue as string}\n          culture={props.culture}\n          clickPosition={clickPosition}\n          isPopoverOpen={isPopoverOpen}\n          color={calloutProps?.color}\n          isCartesian={false}\n        />\n      )}\n      {_renderLegends()}\n    </div>\n  ) : (\n    <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n  );\n});\nFunnelChart.displayName = 'FunnelChart';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nFunnelChart.defaultProps = {\n  orientation: 'vertical',\n};\n"],"names":["React","useId","useRtl","Legends","useFocusableGroup","ChartPopover","formatToLocaleString","getContrastTextColor","useFunnelChartStyles","getHorizontalFunnelSegmentGeometry","getVerticalFunnelSegmentGeometry","getSegmentTextProps","getStackedHorizontalFunnelSegmentGeometry","getStackedVerticalFunnelSegmentGeometry","toImage","FunnelChart","forwardRef","props","forwardedRef","_emptyChartId","isRTL","hoveredStage","setHoveredStage","useState","calloutData","setCalloutData","selectedLegends","setSelectedLegends","clickPosition","setClickPosition","x","y","isPopoverOpen","setPopoverOpen","chartContainerRef","useRef","isStacked","isStackedFunnelData","data","_legendsRef","useEffect","legendProps","useImperativeHandle","componentRef","opts","current","toSVG","_handleHover","mouseEvent","persist","updatePosition","clientX","clientY","_handleFocus","focusEvent","targetRect","target","getBoundingClientRect","left","width","top","height","_handleStackedHover","stage","subValue","value","color","category","_handleStackedFocus","_handleMouseOut","_onLegendSelectionChange","legendsSelected","event","currentLegend","canSelectMultipleLegends","slice","onChange","_onLegendSelectionChangeCallback","useCallback","getHighlightedLegend","length","legendHighlighted","legend","includes","noLegendHighlighted","_getEventHandlerProps","opacity","culture","onMouseOver","undefined","onMouseMove","onFocus","onBlur","onMouseOut","_renderSegmentText","show","textColor","textElement","text","funnelWidth","textAnchor","alignmentBaseline","fill","toString","g","transform","_renderFunnelSegment","key","pathD","textProps","tabIndex","eventHandlers","path","d","_createFunnel","containerHeight","containerWidth","funnelHeight","map","i","geometryProps","orientation","textX","textY","availableWidth","minTextWidth","eventHandlerProps","Array","isArray","every","subValues","_renderStackedSegment","stageIndex","subValueIndex","geometryParams","stagesWithSubValues","stages","s","geom","k","_createStackedFunnel","totals","reduce","sum","maxTotal","Math","max","paths","cur","v","push","_renderLegends","hideLegend","legends","categoryMap","forEach","sub","Object","entries","title","hoverAction","onMouseOutAction","div","style","display","justifyContent","centerLegends","legendRef","_isChartEmpty","newX","newY","threshold","distance","sqrt","pow","classes","calloutProps","hoverXValue","YValue","funnelMarginTop","funnelOffsetX","focusAttributes","ref","className","root","svg","chart","role","aria-label","chartTitle","XValue","yCalloutValue","isCartesian","id","displayName","defaultProps"],"mappings":"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"}
+{"version":3,"sources":["../src/components/FunnelChart/FunnelChart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { useRtl } from '../../utilities/index';\nimport { FunnelChartDataPoint, FunnelChartProps } from './FunnelChart.types';\nimport { Legend, Legends, LegendContainer } from '../Legends/index';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { getContrastTextColor } from '../../utilities/colors';\nimport { useFunnelChartStyles } from './useFunnelChartStyles.styles';\nimport {\n  getHorizontalFunnelSegmentGeometry,\n  getVerticalFunnelSegmentGeometry,\n  getSegmentTextProps,\n  getStackedHorizontalFunnelSegmentGeometry,\n  getStackedVerticalFunnelSegmentGeometry,\n} from './funnelGeometry';\nimport { ChartPopoverProps, ImageExportOptions } from '../../index';\nimport { toImage } from '../../utilities/image-export-utils';\n\nexport const FunnelChart: React.FunctionComponent<FunnelChartProps> = React.forwardRef<\n  HTMLDivElement,\n  FunnelChartProps\n>((props, forwardedRef) => {\n  const _emptyChartId: string = useId('_FunnelChart_empty');\n  const isRTL = useRtl();\n\n  const [hoveredStage, setHoveredStage] = React.useState<string | null>(null);\n  const [calloutData, setCalloutData] = React.useState<FunnelChartDataPoint | null>(null);\n  const [selectedLegends, setSelectedLegends] = React.useState<string[]>([]);\n  const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n  const [refSelected, setRefSelected] = React.useState<HTMLElement | null>(null);\n  const chartContainerRef = React.useRef<HTMLDivElement | null>(null);\n  const isStacked = isStackedFunnelData(props.data);\n  const _legendsRef = React.useRef<LegendContainer>(null);\n\n  React.useEffect(() => {\n    if (props.legendProps?.selectedLegends) {\n      setSelectedLegends(props.legendProps.selectedLegends);\n    }\n  }, [props.legendProps?.selectedLegends]);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      toImage: (opts?: ImageExportOptions): Promise<string> => {\n        return toImage(chartContainerRef.current, _legendsRef.current?.toSVG, isRTL, opts);\n      },\n    }),\n    [],\n  );\n\n  function _handleHover(\n    data: FunnelChartDataPoint,\n    mouseEvent: React.MouseEvent<SVGElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    mouseEvent?.persist();\n    setCalloutData(data);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleFocus(\n    data: FunnelChartDataPoint,\n    focusEvent: React.FocusEvent<SVGPathElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    focusEvent?.persist();\n    setCalloutData(data);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedHover(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    mouseEvent: React.MouseEvent<SVGElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    mouseEvent?.persist();\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedFocus(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    focusEvent: React.FocusEvent<SVGPathElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    focusEvent?.persist();\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleMouseOut() {\n    setHoveredStage(null);\n    setPopoverOpen(false);\n    setCalloutData(null);\n  }\n\n  function _onLegendSelectionChange(\n    legendsSelected: string[],\n    event: React.MouseEvent<HTMLButtonElement>,\n    currentLegend?: Legend,\n  ): void {\n    if (props.legendProps?.canSelectMultipleLegends) {\n      setSelectedLegends(legendsSelected);\n    } else {\n      setSelectedLegends(legendsSelected.slice(-1));\n    }\n\n    if (props.legendProps?.onChange) {\n      props.legendProps.onChange(legendsSelected, event, currentLegend);\n    }\n  }\n\n  const _onLegendSelectionChangeCallback = React.useCallback(_onLegendSelectionChange, [props.legendProps]);\n\n  function getHighlightedLegend(): string[] {\n    return selectedLegends.length > 0 ? selectedLegends : hoveredStage ? [hoveredStage] : [];\n  }\n\n  function legendHighlighted(legend: string): boolean {\n    return getHighlightedLegend().includes(legend);\n  }\n\n  function noLegendHighlighted(): boolean {\n    return getHighlightedLegend().length === 0;\n  }\n\n  function _getEventHandlerProps(\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } },\n    opacity?: number,\n    segmentId?: string,\n  ) {\n    const targetElement = document.getElementById(segmentId!);\n    if ('subValue' in data) {\n      return {\n        culture: props.culture,\n        onMouseOver:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) =>\n                _handleStackedHover(data.stage, data.subValue, event, targetElement)\n            : undefined,\n        onMouseMove:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) =>\n                _handleStackedHover(data.stage, data.subValue, event, targetElement)\n            : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) =>\n          _handleStackedFocus(data.stage, data.subValue, event, targetElement),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    } else {\n      return {\n        culture: props.culture,\n        onMouseOver:\n          opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event, targetElement) : undefined,\n        onMouseMove:\n          opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event, targetElement) : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) => _handleFocus(data, event, targetElement),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    }\n  }\n\n  function _renderSegmentText({\n    show,\n    x,\n    y,\n    value,\n    textColor,\n    opacity,\n  }: {\n    show: boolean;\n    x: number;\n    y: number;\n    value: number;\n    textColor: string;\n    opacity: number;\n  }) {\n    if (!show) {\n      return null;\n    }\n\n    const textElement = (\n      <text\n        x={isRTL ? funnelWidth - x : x}\n        y={y}\n        opacity={opacity}\n        textAnchor=\"middle\"\n        alignmentBaseline=\"middle\"\n        fill={textColor}\n      >\n        {formatToLocaleString(value.toString(), props.culture) as React.ReactNode}\n      </text>\n    );\n\n    if (isRTL) {\n      return <g transform={`scale(-1,1) translate(${-funnelWidth},0)`}>{textElement}</g>;\n    }\n    return textElement;\n  }\n\n  function _renderFunnelSegment({\n    key,\n    pathD,\n    fill,\n    opacity,\n    textProps,\n    data,\n    tabIndex,\n  }: {\n    key: string | number;\n    pathD: string;\n    fill: string;\n    opacity: number;\n    textProps?: {\n      show: boolean;\n      x: number;\n      y: number;\n      value: number;\n    };\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } };\n    tabIndex?: number;\n  }) {\n    const segmentId = `funnel-segment-${key}`;\n    const eventHandlers = _getEventHandlerProps(data, opacity, segmentId);\n    const textColor = getContrastTextColor(fill);\n    return (\n      <g key={key}>\n        <path id={segmentId} d={pathD} fill={fill} opacity={opacity} {...eventHandlers} tabIndex={tabIndex} />\n        {textProps && <g {...eventHandlers}>{_renderSegmentText({ ...textProps, textColor, opacity })}</g>}\n      </g>\n    );\n  }\n\n  function _createFunnel(\n    containerHeight: number,\n    containerWidth: number,\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement[] {\n    const { data } = props;\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    return data.map((d, i) => {\n      const geometryProps =\n        props.orientation === 'vertical'\n          ? getVerticalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL })\n          : getHorizontalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL });\n\n      const { pathD, textX, textY, availableWidth } = geometryProps;\n      const minTextWidth = 16;\n      const eventHandlerProps = _getEventHandlerProps(d);\n      const textProps = getSegmentTextProps({\n        availableWidth,\n        minTextWidth,\n        textX,\n        textY,\n        value: d.value!,\n        ...eventHandlerProps,\n      });\n\n      return _renderFunnelSegment({\n        key: i,\n        pathD,\n        fill: d.color!,\n        opacity: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 1 : 0.1,\n        textProps,\n        data: d,\n        tabIndex: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 0 : undefined,\n      });\n    });\n  }\n\n  function isStackedFunnelData(data: FunnelChartDataPoint[]): boolean {\n    return Array.isArray(data) && data.every(stage => Array.isArray(stage.subValues));\n  }\n\n  function _renderStackedSegment(\n    stage: FunnelChartDataPoint,\n    subValue: { value: number; color: string; category: string },\n    stageIndex: number,\n    subValueIndex: number,\n    geometryParams: {\n      stages: FunnelChartDataPoint[];\n      totals: number[];\n      maxTotal: number;\n      funnelWidth: number;\n      funnelHeight: number;\n      isRTL: boolean;\n    },\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement {\n    // Ensure stages have subValues for geometry functions\n    const stagesWithSubValues = geometryParams.stages.map(s => ({\n      ...s,\n      subValues: s.subValues || [],\n    }));\n    const geom =\n      props.orientation === 'vertical'\n        ? getStackedVerticalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          })\n        : getStackedHorizontalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          });\n\n    const minTextWidth = 16;\n    const eventHandlerProps = _getEventHandlerProps({ stage: stage.stage as string, subValue });\n    const textProps = getSegmentTextProps({\n      availableWidth: geom.availableWidth,\n      minTextWidth,\n      textX: geom.textX,\n      textY: geom.textY,\n      value: subValue.value,\n      ...eventHandlerProps,\n    });\n\n    return _renderFunnelSegment({\n      key: `${stageIndex}-${subValueIndex}`,\n      pathD: geom.pathD,\n      fill: subValue.color,\n      opacity:\n        (isStackedFunnelData(props.data) && legendHighlighted(subValue.category)) || noLegendHighlighted() ? 1 : 0.1,\n      textProps,\n      data: { stage: stage.stage as string, subValue },\n      tabIndex: legendHighlighted(subValue.category) || noLegendHighlighted() ? 0 : undefined,\n    });\n  }\n\n  function _createStackedFunnel(\n    containerHeight: number,\n    containerWidth: number,\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement[] {\n    const { data } = props;\n\n    const stages = data;\n    const totals = stages.map(s => s?.subValues?.reduce((sum, subValue) => sum + subValue.value, 0) ?? 0);\n    const maxTotal = Math.max(...totals);\n\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    const paths: JSXElement[] = [];\n\n    const geometryParams = {\n      stages,\n      totals,\n      maxTotal,\n      funnelWidth,\n      funnelHeight,\n      isRTL,\n    };\n\n    for (let i = 0; i < stages.length; i++) {\n      const cur = stages[i];\n      for (let k = 0; k < (cur.subValues ?? []).length; k++) {\n        const v = cur.subValues?.[k];\n        if (!v) {\n          continue;\n        }\n        paths.push(_renderStackedSegment(cur, v, i, k, geometryParams));\n      }\n    }\n    return paths;\n  }\n\n  function _renderLegends(): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement {\n    if (props.hideLegend) {\n      return <></>;\n    }\n    let legends: Legend[];\n\n    if (isStacked) {\n      // Collect unique categories and their color\n      const categoryMap: Record<string, string> = {};\n      props.data.forEach((stage: FunnelChartDataPoint) => {\n        (stage.subValues || []).forEach(sub => {\n          if (!(sub.category in categoryMap)) {\n            categoryMap[sub.category] = sub.color;\n          }\n        });\n      });\n      legends = Object.entries(categoryMap).map(([category, color]) => ({\n        title: category,\n        color,\n        hoverAction: () => setHoveredStage(category),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    } else {\n      legends = props.data.map((d: FunnelChartDataPoint) => ({\n        title: d.stage as string,\n        color: d.color!,\n        hoverAction: () => setHoveredStage(d.stage as string),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    }\n\n    return (\n      <div style={{ display: 'flex', justifyContent: 'center' }}>\n        <Legends\n          legends={legends}\n          centerLegends={true}\n          onChange={_onLegendSelectionChangeCallback}\n          {...props.legendProps}\n          legendRef={_legendsRef}\n        />\n      </div>\n    );\n  }\n\n  function _isChartEmpty(): boolean {\n    return !(props.data && props.data.length > 0);\n  }\n\n  const classes = useFunnelChartStyles(props);\n\n  const calloutProps: ChartPopoverProps = {\n    ...props.calloutProps,\n    color: calloutData?.color,\n    hoverXValue: calloutData?.stage,\n    YValue: calloutData?.value,\n  };\n\n  const width = props.width || 350;\n  const height = props.height || 500;\n\n  const funnelMarginTop = 40;\n  const funnelWidth = width * 0.8;\n  const funnelOffsetX = (width - funnelWidth) / 2;\n  const focusAttributes = useFocusableGroup();\n\n  return !_isChartEmpty() ? (\n    <div ref={chartContainerRef} className={classes.root} {...focusAttributes} style={{ width, height }}>\n      <svg width={width} height={height} className={classes.chart} role={'img'} aria-label={props.chartTitle}>\n        <g\n          transform={\n            isRTL\n              ? `translate(${funnelOffsetX + funnelWidth}, ${funnelMarginTop}) scale(-1,1)`\n              : `translate(${funnelOffsetX}, ${funnelMarginTop})`\n          }\n        >\n          {isStacked\n            ? _createStackedFunnel(height - funnelMarginTop, funnelWidth)\n            : _createFunnel(height - funnelMarginTop, funnelWidth)}\n        </g>\n      </svg>\n      {isPopoverOpen && (\n        <ChartPopover\n          {...props.calloutProps}\n          XValue={calloutProps?.hoverXValue as string}\n          yCalloutValue={calloutProps?.YValue as string}\n          culture={props.culture}\n          positioning={{\n            target: refSelected,\n          }}\n          isPopoverOpen={isPopoverOpen}\n          color={calloutProps?.color}\n          isCartesian={false}\n        />\n      )}\n      {_renderLegends()}\n    </div>\n  ) : (\n    <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n  );\n});\nFunnelChart.displayName = 'FunnelChart';\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nFunnelChart.defaultProps = {\n  orientation: 'vertical',\n};\n"],"names":["React","useId","useRtl","Legends","useFocusableGroup","ChartPopover","formatToLocaleString","getContrastTextColor","useFunnelChartStyles","getHorizontalFunnelSegmentGeometry","getVerticalFunnelSegmentGeometry","getSegmentTextProps","getStackedHorizontalFunnelSegmentGeometry","getStackedVerticalFunnelSegmentGeometry","toImage","FunnelChart","forwardRef","props","forwardedRef","_emptyChartId","isRTL","hoveredStage","setHoveredStage","useState","calloutData","setCalloutData","selectedLegends","setSelectedLegends","isPopoverOpen","setPopoverOpen","refSelected","setRefSelected","chartContainerRef","useRef","isStacked","isStackedFunnelData","data","_legendsRef","useEffect","legendProps","useImperativeHandle","componentRef","opts","current","toSVG","_handleHover","mouseEvent","targetElement","persist","_handleFocus","focusEvent","_handleStackedHover","stage","subValue","value","color","category","_handleStackedFocus","_handleMouseOut","_onLegendSelectionChange","legendsSelected","event","currentLegend","canSelectMultipleLegends","slice","onChange","_onLegendSelectionChangeCallback","useCallback","getHighlightedLegend","length","legendHighlighted","legend","includes","noLegendHighlighted","_getEventHandlerProps","opacity","segmentId","document","getElementById","culture","onMouseOver","undefined","onMouseMove","onFocus","onBlur","onMouseOut","_renderSegmentText","show","x","y","textColor","textElement","text","funnelWidth","textAnchor","alignmentBaseline","fill","toString","g","transform","_renderFunnelSegment","key","pathD","textProps","tabIndex","eventHandlers","path","id","d","_createFunnel","containerHeight","containerWidth","funnelHeight","map","i","geometryProps","orientation","textX","textY","availableWidth","minTextWidth","eventHandlerProps","Array","isArray","every","subValues","_renderStackedSegment","stageIndex","subValueIndex","geometryParams","stagesWithSubValues","stages","s","geom","k","_createStackedFunnel","totals","reduce","sum","maxTotal","Math","max","paths","cur","v","push","_renderLegends","hideLegend","legends","categoryMap","forEach","sub","Object","entries","title","hoverAction","onMouseOutAction","div","style","display","justifyContent","centerLegends","legendRef","_isChartEmpty","classes","calloutProps","hoverXValue","YValue","width","height","funnelMarginTop","funnelOffsetX","focusAttributes","ref","className","root","svg","chart","role","aria-label","chartTitle","XValue","yCalloutValue","positioning","target","isCartesian","displayName","defaultProps"],"mappings":"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"}

package/lib/components/GaugeChart/GaugeChart.js

@@ -96,14 +96,10 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
     const [hoveredLegend, setHoveredLegend] = React.useState('');
     const [selectedLegends, setSelectedLegends] = React.useState(((_props_legendProps = props.legendProps) === null || _props_legendProps === void 0 ? void 0 : _props_legendProps.selectedLegends) || []);
     const [focusedElement, setFocusedElement] = React.useState('');
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const [clickPosition, setClickPosition] = React.useState({
-        x: 0,
-        y: 0
-    });
     const [isPopoverOpen, setPopoverOpen] = React.useState(false);
     const [hoverXValue, setHoverXValue] = React.useState('');
     const [hoverYValues, setHoverYValues] = React.useState([]);
+    const [refSelected, setRefSelected] = React.useState(null);
     const prevPropsRef = React.useRef(null);
     const _width = props.width || width;
     const _height = props.height || height;
@@ -214,6 +210,7 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
         const strokeWidth = 2;
         const halfStrokeWidth = strokeWidth / 2;
         const needleLength = _outerRadius - _innerRadius + EXTRA_NEEDLE_LENGTH;
+        const needleId = `gauge-chart-needle`;
         return /*#__PURE__*/ React.createElement("g", {
             transform: `rotate(${rtlSafeNeedleRotation}, 0, 0)`
         }, /*#__PURE__*/ React.createElement("path", {
@@ -224,14 +221,15 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
             L 0,${halfStrokeWidth + 3}
             A ${halfStrokeWidth + 3},${halfStrokeWidth + 3},0,0,0,0,${-halfStrokeWidth - 3}
           `,
+            id: needleId,
             strokeWidth: strokeWidth,
             className: classes.needle,
             transform: `translate(${-_innerRadius + EXTRA_NEEDLE_LENGTH / 2})`,
             "data-is-focusable": true,
-            onFocus: (e)=>_handleFocus(e, 'Needle'),
+            onFocus: (e)=>_handleFocus(e, 'Needle', needleId),
             onBlur: _handleBlur,
-            onMouseEnter: (e)=>_handleMouseOver(e, 'Needle'),
-            onMouseMove: (e)=>_handleMouseOver(e, 'Needle'),
+            onMouseEnter: (e)=>_handleMouseOver(e, 'Needle', needleId),
+            onMouseMove: (e)=>_handleMouseOver(e, 'Needle', needleId),
             role: "img",
             "aria-label": 'Current value: ' + getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat)
         }));
@@ -295,14 +293,14 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
         ] : [];
     }
     // eslint-disable-next-line @typescript-eslint/no-shadow
-    function _handleFocus(focusEvent, focusedElement) {
-        _showCallout(focusEvent, focusedElement, true);
+    function _handleFocus(focusEvent, focusedElement, elementId) {
+        _showCallout(focusEvent, focusedElement, true, elementId);
     }
     function _handleBlur() {
         _hideCallout(true);
     }
-    function _handleMouseOver(mouseEvent, hoveredElement) {
-        _showCallout(mouseEvent, hoveredElement, false);
+    function _handleMouseOver(mouseEvent, hoveredElement, elementId) {
+        _showCallout(mouseEvent, hoveredElement, false, elementId);
     }
     function _handleMouseOut() {
         _hideCallout(false);
@@ -311,24 +309,11 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
         _hideCallout(false);
     }
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    function _showCallout(event, legend, isFocusEvent) {
+    function _showCallout(event, legend, isFocusEvent, elementId) {
         if (_calloutAnchor === legend) {
             return;
         }
-        let clientX = 0;
-        let clientY = 0;
-        if ('clientX' in event) {
-            clientX = event.clientX;
-            clientY = event.clientY;
-        } else {
-            // eslint-disable-next-line @typescript-eslint/no-shadow
-            const target = event.currentTarget;
-            if (target && 'getBoundingClientRect' in target) {
-                const boundingRect = target.getBoundingClientRect();
-                clientX = boundingRect.left + boundingRect.width / 2;
-                clientY = boundingRect.top + boundingRect.height / 2;
-            }
-        }
+        const targetElement = document.getElementById(elementId);
         _calloutAnchor = legend;
         // eslint-disable-next-line @typescript-eslint/no-shadow
         const hoverXValue = 'Current value is ' + getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat, true);
@@ -341,11 +326,11 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
             };
             return yValue;
         });
-        _updatePosition(clientX, clientY);
         setPopoverOpen([
             'Needle',
             'Chart value'
         ].includes(legend) || _noLegendHighlighted() || _legendHighlighted(legend));
+        setRefSelected(targetElement);
         setHoverXValue(hoverXValue);
         setHoverYValues(hoverYValues);
         if (isFocusEvent) {
@@ -481,20 +466,6 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
             }));
         }
     }
-    function _updatePosition(newX, newY) {
-        const threshold = 1; // Set a threshold for movement
-        const { x, y } = clickPosition;
-        // Calculate the distance moved
-        const distance = Math.sqrt(Math.pow(newX - x, 2) + Math.pow(newY - y, 2));
-        // Update the position only if the distance moved is greater than the threshold
-        if (distance > threshold) {
-            setClickPosition({
-                x: newX,
-                y: newY
-            });
-            setPopoverOpen(true);
-        }
-    }
     function _getChartTitle() {
         const { chartTitle } = props;
         return (chartTitle ? `${chartTitle}. ` : '') + `Gauge chart with ${_segments.length} segments. `;
@@ -538,10 +509,12 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
         "aria-label": `Max value: ${_maxValue}`
     }, formatScientificLimitWidth(_maxValue))), arcs.map((arc, index)=>{
         const segment = _segments[arc.segmentIndex];
+        const arcId = `gauge-chart-arc-${index}`;
         return /*#__PURE__*/ React.createElement(React.Fragment, {
             key: index
         }, /*#__PURE__*/ React.createElement("path", {
             d: arc.d,
+            id: arcId,
             strokeWidth: focusedElement === segment.legend ? ARC_PADDING : 0,
             className: classes.segment,
             fill: segment.color,
@@ -550,11 +523,11 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
                 ariaLabel: getSegmentLabel(segment, _minValue, _maxValue, props.variant, true),
                 ...segment.accessibilityData
             }, 'img', true),
-            onFocus: (e)=>_handleFocus(e, segment.legend),
+            onFocus: (e)=>_handleFocus(e, segment.legend, arcId),
             onBlur: _handleBlur,
-            onMouseEnter: (e)=>_handleMouseOver(e, segment.legend),
+            onMouseEnter: (e)=>_handleMouseOver(e, segment.legend, arcId),
             onMouseLeave: (e)=>_handleCalloutDismiss(),
-            onMouseMove: (e)=>_handleMouseOver(e, segment.legend),
+            onMouseMove: (e)=>_handleMouseOver(e, segment.legend, arcId),
             tabIndex: _legendHighlighted(segment.legend) || _noLegendHighlighted() ? 0 : undefined
         }));
     }), _renderNeedle(), /*#__PURE__*/ React.createElement("g", {
@@ -585,7 +558,9 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
         wrapContent: _wrapContent
     })))), _renderLegends(), !props.hideTooltip && isPopoverOpen && /*#__PURE__*/ React.createElement(ChartPopover, {
         ...props.calloutProps,
-        clickPosition: clickPosition,
+        positioning: {
+            target: refSelected
+        },
         isPopoverOpen: isPopoverOpen,
         customCallout: {
             customizedCallout: _multiValueCallout({

package/lib/components/GaugeChart/GaugeChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/GaugeChart/GaugeChart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useGaugeChartStyles } from './useGaugeChartStyles.styles';\nimport { select as d3Select } from 'd3-selection';\nimport { arc as d3Arc } from 'd3-shape';\nimport { YValueHover } from '../../index';\nimport {\n  Points,\n  areArraysEqual,\n  formatScientificLimitWidth,\n  getAccessibleDataObject,\n  getColorFromToken,\n  getNextColor,\n  pointTypes,\n  useRtl,\n} from '../../utilities/index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { SVGTooltipText } from '../../utilities/SVGTooltipText';\nimport { Legend, LegendShape, Legends, Shape, LegendContainer } from '../Legends/index';\nimport { GaugeChartVariant, GaugeValueFormat, GaugeChartProps, GaugeChartSegment } from './GaugeChart.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { ImageExportOptions } from '../../types/index';\nimport { toImage } from '../../utilities/image-export-utils';\n\nconst GAUGE_MARGIN = 16;\nconst LABEL_WIDTH = 36;\nconst LABEL_HEIGHT = 16;\nconst LABEL_OFFSET = 4;\nconst TITLE_OFFSET = 11;\nconst EXTRA_NEEDLE_LENGTH = 4;\nexport const ARC_PADDING = 2;\nexport const BREAKPOINTS = [\n  { minRadius: 52, arcWidth: 12, fontSize: 20 },\n  { minRadius: 70, arcWidth: 16, fontSize: 24 },\n  { minRadius: 88, arcWidth: 20, fontSize: 32 },\n  { minRadius: 106, arcWidth: 24, fontSize: 32 },\n  { minRadius: 124, arcWidth: 28, fontSize: 40 },\n  { minRadius: 142, arcWidth: 32, fontSize: 40 },\n];\n\nexport const calcNeedleRotation = (chartValue: number, minValue: number, maxValue: number): number => {\n  let needleRotation = ((chartValue - minValue) / (maxValue - minValue)) * 180;\n  if (needleRotation < 0) {\n    needleRotation = 0;\n  } else if (needleRotation > 180) {\n    needleRotation = 180;\n  }\n\n  return needleRotation;\n};\n\nexport const getSegmentLabel = (\n  segment: ExtendedSegment,\n  minValue: number,\n  maxValue: number,\n  variant?: GaugeChartVariant,\n  isAriaLabel: boolean = false,\n): string => {\n  if (isAriaLabel) {\n    return minValue === 0 && variant === 'single-segment'\n      ? `${segment.legend}, ${segment.size} out of ${maxValue} or ${((segment.size / maxValue) * 100).toFixed()}%`\n      : `${segment.legend}, ${segment.start} to ${segment.end}`;\n  }\n\n  return minValue === 0 && variant === 'single-segment'\n    ? `${segment.size} (${((segment.size / maxValue) * 100).toFixed()}%)`\n    : `${segment.start} - ${segment.end}`;\n};\n\nexport const getChartValueLabel = (\n  chartValue: number,\n  minValue: number,\n  maxValue: number,\n  chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string),\n  forCallout: boolean = false,\n): string => {\n  if (forCallout) {\n    // When displaying the chart value as a percentage, use fractions in the callout, and vice versa.\n    // This helps clarify the actual value and avoid repetition.\n    return minValue !== 0\n      ? chartValue.toString()\n      : chartValueFormat === 'fraction'\n      ? `${((chartValue / maxValue) * 100).toFixed()}%`\n      : `${chartValue}/${maxValue}`;\n  }\n\n  return typeof chartValueFormat === 'function'\n    ? chartValueFormat([chartValue - minValue, maxValue - minValue])\n    : minValue !== 0\n    ? chartValue.toString()\n    : chartValueFormat === 'fraction'\n    ? `${chartValue}/${maxValue}`\n    : `${((chartValue / maxValue) * 100).toFixed()}%`;\n};\n\ninterface YValue extends Omit<YValueHover, 'y'> {\n  y?: string | number;\n}\nexport interface ExtendedSegment extends GaugeChartSegment {\n  start: number;\n  end: number;\n}\n\nexport const GaugeChart: React.FunctionComponent<GaugeChartProps> = React.forwardRef<HTMLDivElement, GaugeChartProps>(\n  (props, forwardedRef) => {\n    const _legendsRef = React.useRef<LegendContainer>(null);\n    const _getMargins = () => {\n      const { hideMinMax, chartTitle, sublabel } = props;\n      return {\n        left: (!hideMinMax ? LABEL_OFFSET + LABEL_WIDTH : 0) + GAUGE_MARGIN,\n        right: (!hideMinMax ? LABEL_OFFSET + LABEL_WIDTH : 0) + GAUGE_MARGIN,\n        top: (chartTitle ? TITLE_OFFSET + LABEL_HEIGHT : EXTRA_NEEDLE_LENGTH / 2) + GAUGE_MARGIN,\n        bottom: (sublabel ? LABEL_OFFSET + LABEL_HEIGHT : 0) + GAUGE_MARGIN,\n      };\n    };\n    const _margins: { left: number; right: number; top: number; bottom: number } = _getMargins();\n    const _legendsHeight: number = !props.hideLegend ? 32 : 0;\n    const _rootElem = React.useRef<HTMLDivElement | null>(null);\n    const _isRTL: boolean = useRtl();\n    const [width, setWidth] = React.useState<number>(140 + _getMargins().left + _getMargins().right);\n    const [height, setHeight] = React.useState<number>(70 + _getMargins().top + _getMargins().bottom + _legendsHeight);\n    const [hoveredLegend, setHoveredLegend] = React.useState<string>('');\n    const [selectedLegends, setSelectedLegends] = React.useState<string[]>(props.legendProps?.selectedLegends || []);\n    const [focusedElement, setFocusedElement] = React.useState<string | undefined>('');\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n    const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n    const [hoverXValue, setHoverXValue] = React.useState<string | number>('');\n    const [hoverYValues, setHoverYValues] = React.useState<YValue[]>([]);\n    const prevPropsRef = React.useRef<GaugeChartProps | null>(null);\n    const _width = props.width || width;\n    const _height = props.height || height;\n    const _outerRadius: number = Math.min(\n      (_width - (_margins.left + _margins.right)) / 2,\n      _height - (_margins.top + _margins.bottom + _legendsHeight),\n    );\n    const { arcWidth, chartValueSize } = _getStylesBasedOnBreakpoint();\n    const _innerRadius: number = _outerRadius - arcWidth;\n    let _minValue!: number;\n    let _maxValue!: number;\n    let _segments!: ExtendedSegment[];\n    let _calloutAnchor: string = '';\n\n    React.useEffect(() => {\n      if (_rootElem.current) {\n        setWidth(_rootElem.current.clientWidth);\n        setHeight(_rootElem.current.clientHeight);\n      }\n    }, []);\n\n    React.useEffect(() => {\n      if (prevPropsRef.current) {\n        const prevProps = prevPropsRef.current;\n        if (!areArraysEqual(prevProps.legendProps?.selectedLegends, props.legendProps?.selectedLegends)) {\n          setSelectedLegends(props.legendProps?.selectedLegends || []);\n        }\n      }\n      prevPropsRef.current = props;\n    }, [props]);\n\n    React.useImperativeHandle(\n      props.componentRef,\n      () => ({\n        chartContainer: _rootElem.current,\n        toImage: (opts?: ImageExportOptions): Promise<string> => {\n          return toImage(_rootElem.current, _legendsRef.current?.toSVG, _isRTL, opts);\n        },\n      }),\n      [],\n    );\n\n    const classes = useGaugeChartStyles(props);\n    function _getStylesBasedOnBreakpoint() {\n      for (let index = BREAKPOINTS.length - 1; index >= 0; index -= 1) {\n        if (_outerRadius >= BREAKPOINTS[index].minRadius) {\n          return {\n            arcWidth: BREAKPOINTS[index].arcWidth,\n            chartValueSize: BREAKPOINTS[index].fontSize,\n          };\n        }\n      }\n      return {\n        arcWidth: BREAKPOINTS[0].arcWidth,\n        chartValueSize: BREAKPOINTS[0].fontSize,\n      };\n    }\n\n    function _processProps() {\n      const { minValue = 0, maxValue, segments, roundCorners } = props;\n\n      let total = minValue;\n      const processedSegments: ExtendedSegment[] = segments.map(\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        (segment: { size: number; legend: any; color: string; accessibilityData: any }, index: number) => {\n          const size = Math.max(segment.size, 0);\n          total += size;\n          return {\n            legend: segment.legend,\n            size,\n            color:\n              typeof segment.color !== 'undefined'\n                ? getColorFromToken(segment.color, false)\n                : getNextColor(index, 0, false),\n            accessibilityData: segment.accessibilityData,\n            start: total - size,\n            end: total,\n          };\n        },\n      );\n      if (typeof maxValue !== 'undefined' && total < maxValue) {\n        processedSegments.push({\n          legend: 'Unknown',\n          size: maxValue - total,\n          color: 'neutralLight',\n          start: total,\n          end: maxValue,\n        });\n        total = maxValue;\n      }\n\n      const arcGenerator = d3Arc()\n        .cornerRadius(roundCorners ? 3 : 0)\n        .padAngle(ARC_PADDING / _outerRadius)\n        .padRadius(_outerRadius);\n      const rtlSafeSegments = _isRTL ? Array.from(processedSegments).reverse() : processedSegments;\n      let prevAngle = -Math.PI / 2;\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      const arcs = rtlSafeSegments.map((segment, index) => {\n        const endAngle = prevAngle + (segment.size / (total - minValue)) * Math.PI;\n        const d = arcGenerator({\n          innerRadius: _innerRadius,\n          outerRadius: _outerRadius,\n          startAngle: prevAngle,\n          endAngle,\n        })!;\n        prevAngle = endAngle;\n        return {\n          d,\n          segmentIndex: _isRTL ? processedSegments.length - 1 - index : index,\n          startAngle: prevAngle - (segment.size / (total - minValue)) * Math.PI,\n          endAngle,\n        };\n      });\n\n      _minValue = minValue;\n      _maxValue = total;\n      _segments = processedSegments;\n\n      return {\n        arcs,\n      };\n    }\n\n    function _renderNeedle() {\n      const needleRotation = calcNeedleRotation(props.chartValue, _minValue, _maxValue);\n      const rtlSafeNeedleRotation = _isRTL ? 180 - needleRotation : needleRotation;\n      const strokeWidth = 2;\n      const halfStrokeWidth = strokeWidth / 2;\n      const needleLength = _outerRadius - _innerRadius + EXTRA_NEEDLE_LENGTH;\n\n      return (\n        <g transform={`rotate(${rtlSafeNeedleRotation}, 0, 0)`}>\n          <path\n            d={`\n            M 0,${-halfStrokeWidth - 3}\n            L ${-needleLength},${-halfStrokeWidth - 1}\n            A ${halfStrokeWidth + 1},${halfStrokeWidth + 1},0,0,0,${-needleLength},${halfStrokeWidth + 1}\n            L 0,${halfStrokeWidth + 3}\n            A ${halfStrokeWidth + 3},${halfStrokeWidth + 3},0,0,0,0,${-halfStrokeWidth - 3}\n          `}\n            strokeWidth={strokeWidth}\n            className={classes.needle}\n            transform={`translate(${-_innerRadius + EXTRA_NEEDLE_LENGTH / 2})`}\n            data-is-focusable={true}\n            onFocus={e => _handleFocus(e, 'Needle')}\n            onBlur={_handleBlur}\n            onMouseEnter={e => _handleMouseOver(e, 'Needle')}\n            onMouseMove={e => _handleMouseOver(e, 'Needle')}\n            role=\"img\"\n            aria-label={\n              'Current value: ' + getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat)\n            }\n          />\n        </g>\n      );\n    }\n\n    function _renderLegends() {\n      if (props.hideLegend) {\n        return null;\n      }\n\n      const legends: Legend[] = _segments.map((segment, index) => {\n        const color: string = segment.color || getNextColor(index, 0, false);\n\n        return {\n          title: segment.legend,\n          color,\n          hoverAction: () => {\n            setHoveredLegend(segment.legend);\n          },\n          onMouseOutAction: () => {\n            setHoveredLegend('');\n          },\n        };\n      });\n\n      return (\n        <div className={classes.legendsContainer}>\n          <Legends\n            legends={legends}\n            centerLegends\n            {...props.legendProps}\n            // eslint-disable-next-line react/jsx-no-bind\n            onChange={_onLegendSelectionChange}\n            legendRef={_legendsRef}\n          />\n        </div>\n      );\n    }\n\n    function _onLegendSelectionChange(\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      selectedLegends: string[],\n      event: React.MouseEvent<HTMLButtonElement>,\n      currentLegend?: Legend,\n    ): void {\n      if (props.legendProps?.canSelectMultipleLegends) {\n        setSelectedLegends(selectedLegends);\n      } else {\n        setSelectedLegends(selectedLegends.slice(-1));\n      }\n      if (props.legendProps?.onChange) {\n        props.legendProps.onChange(selectedLegends, event, currentLegend);\n      }\n    }\n\n    /**\n     * This function checks if the given legend is highlighted or not.\n     * A legend can be highlighted in 2 ways:\n     * 1. selection: if the user clicks on it\n     * 2. hovering: if there is no selected legend and the user hovers over it\n     */\n    function _legendHighlighted(legend: string) {\n      return _getHighlightedLegend().includes(legend!);\n    }\n\n    /**\n     * This function checks if none of the legends is selected or hovered.\n     */\n    function _noLegendHighlighted() {\n      return _getHighlightedLegend().length === 0;\n    }\n\n    function _getHighlightedLegend() {\n      return selectedLegends.length > 0 ? selectedLegends : hoveredLegend ? [hoveredLegend] : [];\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-shadow\n    function _handleFocus(focusEvent: React.FocusEvent<SVGElement>, focusedElement: string) {\n      _showCallout(focusEvent, focusedElement, true);\n    }\n\n    function _handleBlur() {\n      _hideCallout(true);\n    }\n\n    function _handleMouseOver(mouseEvent: React.MouseEvent<SVGElement>, hoveredElement: string) {\n      _showCallout(mouseEvent, hoveredElement, false);\n    }\n\n    function _handleMouseOut() {\n      _hideCallout(false);\n    }\n\n    function _handleCalloutDismiss() {\n      _hideCallout(false);\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    function _showCallout(\n      event: React.MouseEvent<SVGElement, MouseEvent> | React.FocusEvent<SVGElement, Element>,\n      legend: string,\n      isFocusEvent: boolean,\n    ) {\n      if (_calloutAnchor === legend) {\n        return;\n      }\n      let clientX = 0;\n      let clientY = 0;\n      if ('clientX' in event) {\n        clientX = event.clientX;\n        clientY = event.clientY;\n      } else {\n        // eslint-disable-next-line @typescript-eslint/no-shadow\n        const target = event.currentTarget as HTMLElement | SVGElement;\n        if (target && 'getBoundingClientRect' in target) {\n          const boundingRect = target.getBoundingClientRect();\n          clientX = boundingRect.left + boundingRect.width / 2;\n          clientY = boundingRect.top + boundingRect.height / 2;\n        }\n      }\n      _calloutAnchor = legend;\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      const hoverXValue: string =\n        'Current value is ' + getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat, true);\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      const hoverYValues: YValue[] = _segments.map(segment => {\n        const yValue: YValue = {\n          legend: segment.legend,\n          y: getSegmentLabel(segment, _minValue, _maxValue, props.variant),\n          color: segment.color,\n        };\n        return yValue;\n      });\n      _updatePosition(clientX, clientY);\n      setPopoverOpen(\n        ['Needle', 'Chart value'].includes(legend) || _noLegendHighlighted() || _legendHighlighted(legend),\n      );\n      setHoverXValue(hoverXValue);\n      setHoverYValues(hoverYValues);\n      if (isFocusEvent) {\n        setFocusedElement(legend);\n      }\n    }\n\n    function _hideCallout(isBlurEvent?: boolean) {\n      _calloutAnchor = '';\n      setPopoverOpen(false);\n      setHoverXValue('');\n      setHoverYValues([]);\n      if (isBlurEvent) {\n        setFocusedElement('');\n      }\n    }\n\n    function _wrapContent(content: string, id: string, maxWidth: number) {\n      const textElement = d3Select<SVGTextElement, {}>(`#${id}`);\n      textElement.text(content);\n      if (!textElement.node()) {\n        return false;\n      }\n\n      let isOverflowing = false;\n      let textLength = textElement.node()!.getComputedTextLength();\n      while (textLength > maxWidth && content.length > 0) {\n        content = content.slice(0, -1);\n        textElement.text(content + '...');\n        isOverflowing = true;\n        textLength = textElement.node()!.getComputedTextLength();\n      }\n      return isOverflowing;\n    }\n\n    // TO DO: Write a common functional component for Multi value callout and divide sub count method\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    function _multiValueCallout(calloutProps: any) {\n      const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(calloutProps.YValueHover);\n      return (\n        <div className={classes.calloutContentRoot}>\n          <div\n            className={classes.calloutDateTimeContainer}\n            style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n          >\n            <div\n              className={classes.calloutContentX}\n              {...getAccessibleDataObject(calloutProps!.xAxisCalloutAccessibilityData, 'text', false)}\n            >\n              {formatToLocaleString(calloutProps!.hoverXValue, props.culture) as React.ReactNode}\n            </div>\n          </div>\n          <div className={classes.calloutInfoContainer} style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n            {calloutProps!.YValueHover &&\n              calloutProps!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n                const isLast: boolean = index + 1 === yValues.length;\n                const { shouldDrawBorderBottom = false } = yValue;\n                return (\n                  <div\n                    {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                    key={`callout-content-${index}`}\n                    style={\n                      yValueHoverSubCountsExists\n                        ? {\n                            display: 'inline-block',\n                            ...(shouldDrawBorderBottom && {\n                              paddingBottom: '10px',\n                            }),\n                          }\n                        : {\n                            ...(shouldDrawBorderBottom && {\n                              paddingBottom: '10px',\n                            }),\n                          }\n                    }\n                  >\n                    {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                  </div>\n                );\n              })}\n            {!!calloutProps.descriptionMessage && (\n              <div className={classes.descriptionMessage}>{calloutProps.descriptionMessage}</div>\n            )}\n          </div>\n        </div>\n      );\n    }\n\n    function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]) {\n      if (yValueHover) {\n        return yValueHover.some(\n          (yValue: {\n            legend?: string;\n            y?: number;\n            color?: string;\n            yAxisCalloutData?: string | { [id: string]: number };\n          }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n        );\n      }\n      return false;\n    }\n\n    function _getCalloutContent(\n      xValue: YValueHover,\n      index: number,\n      yValueHoverSubCountsExists: boolean,\n      isLast: boolean,\n    ): React.ReactNode {\n      const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n      const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n      const { culture } = props;\n      const yValue = formatToLocaleString(xValue.y, culture) as React.ReactNode;\n      if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n        return (\n          <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n            {yValueHoverSubCountsExists && (\n              <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n                {xValue.legend!} ({yValue})\n              </div>\n            )}\n            <div\n              id={`${index}_${xValue.y}`}\n              className={classes.calloutBlockContainer}\n              style={{ borderInlineStart: `4px solid ${xValue.color}` }}\n            >\n              {toDrawShape && (\n                <Shape\n                  svgProps={{\n                    className: classes.shapeStyles,\n                  }}\n                  pathProps={{ fill: xValue.color }}\n                  shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n                  style={{ display: 'flex' }}\n                />\n              )}\n              <div>\n                <div className={classes.calloutlegendText}> {xValue.legend}</div>\n                <div className={classes.calloutContentY}>\n                  {\n                    formatToLocaleString(\n                      xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y || xValue.data,\n                      culture,\n                    ) as React.ReactNode\n                  }\n                </div>\n              </div>\n            </div>\n          </div>\n        );\n      } else {\n        const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n        return (\n          <div style={marginStyle}>\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n            {Object.keys(subcounts).map((subcountName: string) => {\n              return (\n                <div key={subcountName} className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>\n                    {' '}\n                    {formatToLocaleString(subcountName, culture) as React.ReactNode}\n                  </div>\n                  <div className={classes.calloutContentY}>\n                    {formatToLocaleString(subcounts[subcountName], culture) as React.ReactNode}\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        );\n      }\n    }\n\n    function _updatePosition(newX: number, newY: number) {\n      const threshold = 1; // Set a threshold for movement\n      const { x, y } = clickPosition;\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    function _getChartTitle(): string {\n      const { chartTitle } = props;\n      return (chartTitle ? `${chartTitle}. ` : '') + `Gauge chart with ${_segments.length} segments. `;\n    }\n    const { arcs } = _processProps();\n    const focusAttributes = useFocusableGroup();\n    return (\n      <div className={classes.root} ref={el => (_rootElem.current = el)}>\n        <div className={classes.chartWrapper} {...focusAttributes}>\n          <svg\n            className={classes.chart}\n            width={_width}\n            height={_height - _legendsHeight}\n            role=\"region\"\n            aria-label={_getChartTitle()}\n            onMouseLeave={_handleMouseOut}\n          >\n            <g transform={`translate(${_width / 2}, ${_height - (_margins.bottom + _legendsHeight)})`}>\n              {props.chartTitle && (\n                <text\n                  x={0}\n                  y={-(_outerRadius + TITLE_OFFSET)}\n                  textAnchor=\"middle\"\n                  className={classes.chartTitle}\n                  aria-hidden={true}\n                >\n                  {props.chartTitle}\n                </text>\n              )}\n              {!props.hideMinMax && (\n                <>\n                  <text\n                    x={(_isRTL ? 1 : -1) * (_outerRadius + LABEL_OFFSET)}\n                    y={0}\n                    textAnchor=\"end\"\n                    className={classes.limits}\n                    role=\"img\"\n                    aria-label={`Min value: ${_minValue}`}\n                  >\n                    {formatScientificLimitWidth(_minValue)}\n                  </text>\n                  <text\n                    x={(_isRTL ? -1 : 1) * (_outerRadius + LABEL_OFFSET)}\n                    y={0}\n                    textAnchor=\"start\"\n                    className={classes.limits}\n                    role=\"img\"\n                    aria-label={`Max value: ${_maxValue}`}\n                  >\n                    {formatScientificLimitWidth(_maxValue)}\n                  </text>\n                </>\n              )}\n              {arcs.map((arc, index) => {\n                const segment = _segments[arc.segmentIndex];\n                return (\n                  <React.Fragment key={index}>\n                    <path\n                      d={arc.d}\n                      strokeWidth={focusedElement === segment.legend ? ARC_PADDING : 0}\n                      className={classes.segment}\n                      fill={segment.color}\n                      opacity={_legendHighlighted(segment.legend) || _noLegendHighlighted() ? 1 : 0.1}\n                      {...getAccessibleDataObject(\n                        {\n                          ariaLabel: getSegmentLabel(segment, _minValue, _maxValue, props.variant, true),\n                          ...segment.accessibilityData,\n                        },\n                        'img',\n                        true,\n                      )}\n                      onFocus={e => _handleFocus(e, segment.legend)}\n                      onBlur={_handleBlur}\n                      onMouseEnter={e => _handleMouseOver(e, segment.legend)}\n                      onMouseLeave={e => _handleCalloutDismiss()}\n                      onMouseMove={e => _handleMouseOver(e, segment.legend)}\n                      tabIndex={_legendHighlighted(segment.legend) || _noLegendHighlighted() ? 0 : undefined}\n                    />\n                  </React.Fragment>\n                );\n              })}\n              {_renderNeedle()}\n              <g\n                onMouseEnter={e => _handleMouseOver(e, 'Chart value')}\n                onMouseMove={e => _handleMouseOver(e, 'Chart value')}\n              >\n                <SVGTooltipText\n                  content={getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat)}\n                  textProps={{\n                    x: 0,\n                    y: 0,\n                    textAnchor: 'middle',\n                    className: classes.chartValue,\n                    fontSize: chartValueSize,\n                    'aria-hidden': 'true',\n                  }}\n                  maxWidth={_innerRadius * 2 - 24}\n                  wrapContent={_wrapContent}\n                />\n              </g>\n              {props.sublabel && (\n                <SVGTooltipText\n                  content={props.sublabel}\n                  textProps={{\n                    x: 0,\n                    y: 4,\n                    textAnchor: 'middle',\n                    dominantBaseline: 'hanging',\n                    className: classes.sublabel,\n                  }}\n                  maxWidth={_innerRadius * 2}\n                  wrapContent={_wrapContent}\n                />\n              )}\n            </g>\n          </svg>\n        </div>\n        {_renderLegends()}\n        {!props.hideTooltip && isPopoverOpen && (\n          <ChartPopover\n            {...props.calloutProps}\n            clickPosition={clickPosition}\n            isPopoverOpen={isPopoverOpen}\n            customCallout={{\n              customizedCallout: _multiValueCallout({ hoverXValue: hoverXValue, YValueHover: hoverYValues }),\n            }}\n          />\n        )}\n      </div>\n    );\n  },\n);\nGaugeChart.displayName = 'GaugeChart';\n"],"names":["React","useGaugeChartStyles","select","d3Select","arc","d3Arc","Points","areArraysEqual","formatScientificLimitWidth","getAccessibleDataObject","getColorFromToken","getNextColor","pointTypes","useRtl","formatToLocaleString","SVGTooltipText","Legends","Shape","useFocusableGroup","ChartPopover","toImage","GAUGE_MARGIN","LABEL_WIDTH","LABEL_HEIGHT","LABEL_OFFSET","TITLE_OFFSET","EXTRA_NEEDLE_LENGTH","ARC_PADDING","BREAKPOINTS","minRadius","arcWidth","fontSize","calcNeedleRotation","chartValue","minValue","maxValue","needleRotation","getSegmentLabel","segment","variant","isAriaLabel","legend","size","toFixed","start","end","getChartValueLabel","chartValueFormat","forCallout","toString","GaugeChart","forwardRef","props","forwardedRef","_legendsRef","useRef","_getMargins","hideMinMax","chartTitle","sublabel","left","right","top","bottom","_margins","_legendsHeight","hideLegend","_rootElem","_isRTL","width","setWidth","useState","height","setHeight","hoveredLegend","setHoveredLegend","selectedLegends","setSelectedLegends","legendProps","focusedElement","setFocusedElement","clickPosition","setClickPosition","x","y","isPopoverOpen","setPopoverOpen","hoverXValue","setHoverXValue","hoverYValues","setHoverYValues","prevPropsRef","_width","_height","_outerRadius","Math","min","chartValueSize","_getStylesBasedOnBreakpoint","_innerRadius","_minValue","_maxValue","_segments","_calloutAnchor","useEffect","current","clientWidth","clientHeight","prevProps","useImperativeHandle","componentRef","chartContainer","opts","toSVG","classes","index","length","_processProps","segments","roundCorners","total","processedSegments","map","max","color","accessibilityData","push","arcGenerator","cornerRadius","padAngle","padRadius","rtlSafeSegments","Array","from","reverse","prevAngle","PI","arcs","endAngle","d","innerRadius","outerRadius","startAngle","segmentIndex","_renderNeedle","rtlSafeNeedleRotation","strokeWidth","halfStrokeWidth","needleLength","g","transform","path","className","needle","data-is-focusable","onFocus","e","_handleFocus","onBlur","_handleBlur","onMouseEnter","_handleMouseOver","onMouseMove","role","aria-label","_renderLegends","legends","title","hoverAction","onMouseOutAction","div","legendsContainer","centerLegends","onChange","_onLegendSelectionChange","legendRef","event","currentLegend","canSelectMultipleLegends","slice","_legendHighlighted","_getHighlightedLegend","includes","_noLegendHighlighted","focusEvent","_showCallout","_hideCallout","mouseEvent","hoveredElement","_handleMouseOut","_handleCalloutDismiss","isFocusEvent","clientX","clientY","target","currentTarget","boundingRect","getBoundingClientRect","yValue","_updatePosition","isBlurEvent","_wrapContent","content","id","maxWidth","textElement","text","node","isOverflowing","textLength","getComputedTextLength","_multiValueCallout","calloutProps","yValueHoverSubCountsExists","_yValueHoverSubCountsExists","YValueHover","calloutContentRoot","calloutDateTimeContainer","style","marginBottom","calloutContentX","xAxisCalloutAccessibilityData","culture","calloutInfoContainer","display","yValues","isLast","shouldDrawBorderBottom","callOutAccessibilityData","key","paddingBottom","_getCalloutContent","descriptionMessage","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","calloutBlockContainer","borderInlineStart","svgProps","shapeStyles","pathProps","fill","shape","Object","keys","calloutlegendText","calloutContentY","data","subcounts","subcountName","newX","newY","threshold","distance","sqrt","pow","_getChartTitle","focusAttributes","root","ref","el","chartWrapper","svg","chart","onMouseLeave","textAnchor","aria-hidden","limits","Fragment","opacity","ariaLabel","tabIndex","textProps","wrapContent","dominantBaseline","hideTooltip","customCallout","customizedCallout","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/GaugeChart/GaugeChart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useGaugeChartStyles } from './useGaugeChartStyles.styles';\nimport { select as d3Select } from 'd3-selection';\nimport { arc as d3Arc } from 'd3-shape';\nimport { YValueHover } from '../../index';\nimport {\n  Points,\n  areArraysEqual,\n  formatScientificLimitWidth,\n  getAccessibleDataObject,\n  getColorFromToken,\n  getNextColor,\n  pointTypes,\n  useRtl,\n} from '../../utilities/index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { SVGTooltipText } from '../../utilities/SVGTooltipText';\nimport { Legend, LegendShape, Legends, Shape, LegendContainer } from '../Legends/index';\nimport { GaugeChartVariant, GaugeValueFormat, GaugeChartProps, GaugeChartSegment } from './GaugeChart.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { ImageExportOptions } from '../../types/index';\nimport { toImage } from '../../utilities/image-export-utils';\n\nconst GAUGE_MARGIN = 16;\nconst LABEL_WIDTH = 36;\nconst LABEL_HEIGHT = 16;\nconst LABEL_OFFSET = 4;\nconst TITLE_OFFSET = 11;\nconst EXTRA_NEEDLE_LENGTH = 4;\nexport const ARC_PADDING = 2;\nexport const BREAKPOINTS = [\n  { minRadius: 52, arcWidth: 12, fontSize: 20 },\n  { minRadius: 70, arcWidth: 16, fontSize: 24 },\n  { minRadius: 88, arcWidth: 20, fontSize: 32 },\n  { minRadius: 106, arcWidth: 24, fontSize: 32 },\n  { minRadius: 124, arcWidth: 28, fontSize: 40 },\n  { minRadius: 142, arcWidth: 32, fontSize: 40 },\n];\n\nexport const calcNeedleRotation = (chartValue: number, minValue: number, maxValue: number): number => {\n  let needleRotation = ((chartValue - minValue) / (maxValue - minValue)) * 180;\n  if (needleRotation < 0) {\n    needleRotation = 0;\n  } else if (needleRotation > 180) {\n    needleRotation = 180;\n  }\n\n  return needleRotation;\n};\n\nexport const getSegmentLabel = (\n  segment: ExtendedSegment,\n  minValue: number,\n  maxValue: number,\n  variant?: GaugeChartVariant,\n  isAriaLabel: boolean = false,\n): string => {\n  if (isAriaLabel) {\n    return minValue === 0 && variant === 'single-segment'\n      ? `${segment.legend}, ${segment.size} out of ${maxValue} or ${((segment.size / maxValue) * 100).toFixed()}%`\n      : `${segment.legend}, ${segment.start} to ${segment.end}`;\n  }\n\n  return minValue === 0 && variant === 'single-segment'\n    ? `${segment.size} (${((segment.size / maxValue) * 100).toFixed()}%)`\n    : `${segment.start} - ${segment.end}`;\n};\n\nexport const getChartValueLabel = (\n  chartValue: number,\n  minValue: number,\n  maxValue: number,\n  chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string),\n  forCallout: boolean = false,\n): string => {\n  if (forCallout) {\n    // When displaying the chart value as a percentage, use fractions in the callout, and vice versa.\n    // This helps clarify the actual value and avoid repetition.\n    return minValue !== 0\n      ? chartValue.toString()\n      : chartValueFormat === 'fraction'\n      ? `${((chartValue / maxValue) * 100).toFixed()}%`\n      : `${chartValue}/${maxValue}`;\n  }\n\n  return typeof chartValueFormat === 'function'\n    ? chartValueFormat([chartValue - minValue, maxValue - minValue])\n    : minValue !== 0\n    ? chartValue.toString()\n    : chartValueFormat === 'fraction'\n    ? `${chartValue}/${maxValue}`\n    : `${((chartValue / maxValue) * 100).toFixed()}%`;\n};\n\ninterface YValue extends Omit<YValueHover, 'y'> {\n  y?: string | number;\n}\nexport interface ExtendedSegment extends GaugeChartSegment {\n  start: number;\n  end: number;\n}\n\nexport const GaugeChart: React.FunctionComponent<GaugeChartProps> = React.forwardRef<HTMLDivElement, GaugeChartProps>(\n  (props, forwardedRef) => {\n    const _legendsRef = React.useRef<LegendContainer>(null);\n    const _getMargins = () => {\n      const { hideMinMax, chartTitle, sublabel } = props;\n      return {\n        left: (!hideMinMax ? LABEL_OFFSET + LABEL_WIDTH : 0) + GAUGE_MARGIN,\n        right: (!hideMinMax ? LABEL_OFFSET + LABEL_WIDTH : 0) + GAUGE_MARGIN,\n        top: (chartTitle ? TITLE_OFFSET + LABEL_HEIGHT : EXTRA_NEEDLE_LENGTH / 2) + GAUGE_MARGIN,\n        bottom: (sublabel ? LABEL_OFFSET + LABEL_HEIGHT : 0) + GAUGE_MARGIN,\n      };\n    };\n    const _margins: { left: number; right: number; top: number; bottom: number } = _getMargins();\n    const _legendsHeight: number = !props.hideLegend ? 32 : 0;\n    const _rootElem = React.useRef<HTMLDivElement | null>(null);\n    const _isRTL: boolean = useRtl();\n    const [width, setWidth] = React.useState<number>(140 + _getMargins().left + _getMargins().right);\n    const [height, setHeight] = React.useState<number>(70 + _getMargins().top + _getMargins().bottom + _legendsHeight);\n    const [hoveredLegend, setHoveredLegend] = React.useState<string>('');\n    const [selectedLegends, setSelectedLegends] = React.useState<string[]>(props.legendProps?.selectedLegends || []);\n    const [focusedElement, setFocusedElement] = React.useState<string | undefined>('');\n    const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n    const [hoverXValue, setHoverXValue] = React.useState<string | number>('');\n    const [hoverYValues, setHoverYValues] = React.useState<YValue[]>([]);\n    const [refSelected, setRefSelected] = React.useState<HTMLElement | null>(null);\n    const prevPropsRef = React.useRef<GaugeChartProps | null>(null);\n    const _width = props.width || width;\n    const _height = props.height || height;\n    const _outerRadius: number = Math.min(\n      (_width - (_margins.left + _margins.right)) / 2,\n      _height - (_margins.top + _margins.bottom + _legendsHeight),\n    );\n    const { arcWidth, chartValueSize } = _getStylesBasedOnBreakpoint();\n    const _innerRadius: number = _outerRadius - arcWidth;\n    let _minValue!: number;\n    let _maxValue!: number;\n    let _segments!: ExtendedSegment[];\n    let _calloutAnchor: string = '';\n\n    React.useEffect(() => {\n      if (_rootElem.current) {\n        setWidth(_rootElem.current.clientWidth);\n        setHeight(_rootElem.current.clientHeight);\n      }\n    }, []);\n\n    React.useEffect(() => {\n      if (prevPropsRef.current) {\n        const prevProps = prevPropsRef.current;\n        if (!areArraysEqual(prevProps.legendProps?.selectedLegends, props.legendProps?.selectedLegends)) {\n          setSelectedLegends(props.legendProps?.selectedLegends || []);\n        }\n      }\n      prevPropsRef.current = props;\n    }, [props]);\n\n    React.useImperativeHandle(\n      props.componentRef,\n      () => ({\n        chartContainer: _rootElem.current,\n        toImage: (opts?: ImageExportOptions): Promise<string> => {\n          return toImage(_rootElem.current, _legendsRef.current?.toSVG, _isRTL, opts);\n        },\n      }),\n      [],\n    );\n\n    const classes = useGaugeChartStyles(props);\n    function _getStylesBasedOnBreakpoint() {\n      for (let index = BREAKPOINTS.length - 1; index >= 0; index -= 1) {\n        if (_outerRadius >= BREAKPOINTS[index].minRadius) {\n          return {\n            arcWidth: BREAKPOINTS[index].arcWidth,\n            chartValueSize: BREAKPOINTS[index].fontSize,\n          };\n        }\n      }\n      return {\n        arcWidth: BREAKPOINTS[0].arcWidth,\n        chartValueSize: BREAKPOINTS[0].fontSize,\n      };\n    }\n\n    function _processProps() {\n      const { minValue = 0, maxValue, segments, roundCorners } = props;\n\n      let total = minValue;\n      const processedSegments: ExtendedSegment[] = segments.map(\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        (segment: { size: number; legend: any; color: string; accessibilityData: any }, index: number) => {\n          const size = Math.max(segment.size, 0);\n          total += size;\n          return {\n            legend: segment.legend,\n            size,\n            color:\n              typeof segment.color !== 'undefined'\n                ? getColorFromToken(segment.color, false)\n                : getNextColor(index, 0, false),\n            accessibilityData: segment.accessibilityData,\n            start: total - size,\n            end: total,\n          };\n        },\n      );\n      if (typeof maxValue !== 'undefined' && total < maxValue) {\n        processedSegments.push({\n          legend: 'Unknown',\n          size: maxValue - total,\n          color: 'neutralLight',\n          start: total,\n          end: maxValue,\n        });\n        total = maxValue;\n      }\n\n      const arcGenerator = d3Arc()\n        .cornerRadius(roundCorners ? 3 : 0)\n        .padAngle(ARC_PADDING / _outerRadius)\n        .padRadius(_outerRadius);\n      const rtlSafeSegments = _isRTL ? Array.from(processedSegments).reverse() : processedSegments;\n      let prevAngle = -Math.PI / 2;\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      const arcs = rtlSafeSegments.map((segment, index) => {\n        const endAngle = prevAngle + (segment.size / (total - minValue)) * Math.PI;\n        const d = arcGenerator({\n          innerRadius: _innerRadius,\n          outerRadius: _outerRadius,\n          startAngle: prevAngle,\n          endAngle,\n        })!;\n        prevAngle = endAngle;\n        return {\n          d,\n          segmentIndex: _isRTL ? processedSegments.length - 1 - index : index,\n          startAngle: prevAngle - (segment.size / (total - minValue)) * Math.PI,\n          endAngle,\n        };\n      });\n\n      _minValue = minValue;\n      _maxValue = total;\n      _segments = processedSegments;\n\n      return {\n        arcs,\n      };\n    }\n\n    function _renderNeedle() {\n      const needleRotation = calcNeedleRotation(props.chartValue, _minValue, _maxValue);\n      const rtlSafeNeedleRotation = _isRTL ? 180 - needleRotation : needleRotation;\n      const strokeWidth = 2;\n      const halfStrokeWidth = strokeWidth / 2;\n      const needleLength = _outerRadius - _innerRadius + EXTRA_NEEDLE_LENGTH;\n      const needleId = `gauge-chart-needle`;\n      return (\n        <g transform={`rotate(${rtlSafeNeedleRotation}, 0, 0)`}>\n          <path\n            d={`\n            M 0,${-halfStrokeWidth - 3}\n            L ${-needleLength},${-halfStrokeWidth - 1}\n            A ${halfStrokeWidth + 1},${halfStrokeWidth + 1},0,0,0,${-needleLength},${halfStrokeWidth + 1}\n            L 0,${halfStrokeWidth + 3}\n            A ${halfStrokeWidth + 3},${halfStrokeWidth + 3},0,0,0,0,${-halfStrokeWidth - 3}\n          `}\n            id={needleId}\n            strokeWidth={strokeWidth}\n            className={classes.needle}\n            transform={`translate(${-_innerRadius + EXTRA_NEEDLE_LENGTH / 2})`}\n            data-is-focusable={true}\n            onFocus={e => _handleFocus(e, 'Needle', needleId)}\n            onBlur={_handleBlur}\n            onMouseEnter={e => _handleMouseOver(e, 'Needle', needleId)}\n            onMouseMove={e => _handleMouseOver(e, 'Needle', needleId)}\n            role=\"img\"\n            aria-label={\n              'Current value: ' + getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat)\n            }\n          />\n        </g>\n      );\n    }\n\n    function _renderLegends() {\n      if (props.hideLegend) {\n        return null;\n      }\n\n      const legends: Legend[] = _segments.map((segment, index) => {\n        const color: string = segment.color || getNextColor(index, 0, false);\n\n        return {\n          title: segment.legend,\n          color,\n          hoverAction: () => {\n            setHoveredLegend(segment.legend);\n          },\n          onMouseOutAction: () => {\n            setHoveredLegend('');\n          },\n        };\n      });\n\n      return (\n        <div className={classes.legendsContainer}>\n          <Legends\n            legends={legends}\n            centerLegends\n            {...props.legendProps}\n            // eslint-disable-next-line react/jsx-no-bind\n            onChange={_onLegendSelectionChange}\n            legendRef={_legendsRef}\n          />\n        </div>\n      );\n    }\n\n    function _onLegendSelectionChange(\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      selectedLegends: string[],\n      event: React.MouseEvent<HTMLButtonElement>,\n      currentLegend?: Legend,\n    ): void {\n      if (props.legendProps?.canSelectMultipleLegends) {\n        setSelectedLegends(selectedLegends);\n      } else {\n        setSelectedLegends(selectedLegends.slice(-1));\n      }\n      if (props.legendProps?.onChange) {\n        props.legendProps.onChange(selectedLegends, event, currentLegend);\n      }\n    }\n\n    /**\n     * This function checks if the given legend is highlighted or not.\n     * A legend can be highlighted in 2 ways:\n     * 1. selection: if the user clicks on it\n     * 2. hovering: if there is no selected legend and the user hovers over it\n     */\n    function _legendHighlighted(legend: string) {\n      return _getHighlightedLegend().includes(legend!);\n    }\n\n    /**\n     * This function checks if none of the legends is selected or hovered.\n     */\n    function _noLegendHighlighted() {\n      return _getHighlightedLegend().length === 0;\n    }\n\n    function _getHighlightedLegend() {\n      return selectedLegends.length > 0 ? selectedLegends : hoveredLegend ? [hoveredLegend] : [];\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-shadow\n    function _handleFocus(focusEvent: React.FocusEvent<SVGElement>, focusedElement: string, elementId?: string) {\n      _showCallout(focusEvent, focusedElement, true, elementId);\n    }\n\n    function _handleBlur() {\n      _hideCallout(true);\n    }\n\n    function _handleMouseOver(mouseEvent: React.MouseEvent<SVGElement>, hoveredElement: string, elementId?: string) {\n      _showCallout(mouseEvent, hoveredElement, false, elementId);\n    }\n\n    function _handleMouseOut() {\n      _hideCallout(false);\n    }\n\n    function _handleCalloutDismiss() {\n      _hideCallout(false);\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    function _showCallout(\n      event: React.MouseEvent<SVGElement, MouseEvent> | React.FocusEvent<SVGElement, Element>,\n      legend: string,\n      isFocusEvent: boolean,\n      elementId?: string,\n    ) {\n      if (_calloutAnchor === legend) {\n        return;\n      }\n      const targetElement = document.getElementById(elementId!);\n      _calloutAnchor = legend;\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      const hoverXValue: string =\n        'Current value is ' + getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat, true);\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      const hoverYValues: YValue[] = _segments.map(segment => {\n        const yValue: YValue = {\n          legend: segment.legend,\n          y: getSegmentLabel(segment, _minValue, _maxValue, props.variant),\n          color: segment.color,\n        };\n        return yValue;\n      });\n      setPopoverOpen(\n        ['Needle', 'Chart value'].includes(legend) || _noLegendHighlighted() || _legendHighlighted(legend),\n      );\n      setRefSelected(targetElement);\n      setHoverXValue(hoverXValue);\n      setHoverYValues(hoverYValues);\n      if (isFocusEvent) {\n        setFocusedElement(legend);\n      }\n    }\n\n    function _hideCallout(isBlurEvent?: boolean) {\n      _calloutAnchor = '';\n      setPopoverOpen(false);\n      setHoverXValue('');\n      setHoverYValues([]);\n      if (isBlurEvent) {\n        setFocusedElement('');\n      }\n    }\n\n    function _wrapContent(content: string, id: string, maxWidth: number) {\n      const textElement = d3Select<SVGTextElement, {}>(`#${id}`);\n      textElement.text(content);\n      if (!textElement.node()) {\n        return false;\n      }\n\n      let isOverflowing = false;\n      let textLength = textElement.node()!.getComputedTextLength();\n      while (textLength > maxWidth && content.length > 0) {\n        content = content.slice(0, -1);\n        textElement.text(content + '...');\n        isOverflowing = true;\n        textLength = textElement.node()!.getComputedTextLength();\n      }\n      return isOverflowing;\n    }\n\n    // TO DO: Write a common functional component for Multi value callout and divide sub count method\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    function _multiValueCallout(calloutProps: any) {\n      const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(calloutProps.YValueHover);\n      return (\n        <div className={classes.calloutContentRoot}>\n          <div\n            className={classes.calloutDateTimeContainer}\n            style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n          >\n            <div\n              className={classes.calloutContentX}\n              {...getAccessibleDataObject(calloutProps!.xAxisCalloutAccessibilityData, 'text', false)}\n            >\n              {formatToLocaleString(calloutProps!.hoverXValue, props.culture) as React.ReactNode}\n            </div>\n          </div>\n          <div className={classes.calloutInfoContainer} style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n            {calloutProps!.YValueHover &&\n              calloutProps!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n                const isLast: boolean = index + 1 === yValues.length;\n                const { shouldDrawBorderBottom = false } = yValue;\n                return (\n                  <div\n                    {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                    key={`callout-content-${index}`}\n                    style={\n                      yValueHoverSubCountsExists\n                        ? {\n                            display: 'inline-block',\n                            ...(shouldDrawBorderBottom && {\n                              paddingBottom: '10px',\n                            }),\n                          }\n                        : {\n                            ...(shouldDrawBorderBottom && {\n                              paddingBottom: '10px',\n                            }),\n                          }\n                    }\n                  >\n                    {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                  </div>\n                );\n              })}\n            {!!calloutProps.descriptionMessage && (\n              <div className={classes.descriptionMessage}>{calloutProps.descriptionMessage}</div>\n            )}\n          </div>\n        </div>\n      );\n    }\n\n    function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]) {\n      if (yValueHover) {\n        return yValueHover.some(\n          (yValue: {\n            legend?: string;\n            y?: number;\n            color?: string;\n            yAxisCalloutData?: string | { [id: string]: number };\n          }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n        );\n      }\n      return false;\n    }\n\n    function _getCalloutContent(\n      xValue: YValueHover,\n      index: number,\n      yValueHoverSubCountsExists: boolean,\n      isLast: boolean,\n    ): React.ReactNode {\n      const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n      const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n      const { culture } = props;\n      const yValue = formatToLocaleString(xValue.y, culture) as React.ReactNode;\n      if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n        return (\n          <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n            {yValueHoverSubCountsExists && (\n              <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n                {xValue.legend!} ({yValue})\n              </div>\n            )}\n            <div\n              id={`${index}_${xValue.y}`}\n              className={classes.calloutBlockContainer}\n              style={{ borderInlineStart: `4px solid ${xValue.color}` }}\n            >\n              {toDrawShape && (\n                <Shape\n                  svgProps={{\n                    className: classes.shapeStyles,\n                  }}\n                  pathProps={{ fill: xValue.color }}\n                  shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n                  style={{ display: 'flex' }}\n                />\n              )}\n              <div>\n                <div className={classes.calloutlegendText}> {xValue.legend}</div>\n                <div className={classes.calloutContentY}>\n                  {\n                    formatToLocaleString(\n                      xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y || xValue.data,\n                      culture,\n                    ) as React.ReactNode\n                  }\n                </div>\n              </div>\n            </div>\n          </div>\n        );\n      } else {\n        const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n        return (\n          <div style={marginStyle}>\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n            {Object.keys(subcounts).map((subcountName: string) => {\n              return (\n                <div key={subcountName} className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>\n                    {' '}\n                    {formatToLocaleString(subcountName, culture) as React.ReactNode}\n                  </div>\n                  <div className={classes.calloutContentY}>\n                    {formatToLocaleString(subcounts[subcountName], culture) as React.ReactNode}\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        );\n      }\n    }\n\n    function _getChartTitle(): string {\n      const { chartTitle } = props;\n      return (chartTitle ? `${chartTitle}. ` : '') + `Gauge chart with ${_segments.length} segments. `;\n    }\n    const { arcs } = _processProps();\n    const focusAttributes = useFocusableGroup();\n    return (\n      <div className={classes.root} ref={el => (_rootElem.current = el)}>\n        <div className={classes.chartWrapper} {...focusAttributes}>\n          <svg\n            className={classes.chart}\n            width={_width}\n            height={_height - _legendsHeight}\n            role=\"region\"\n            aria-label={_getChartTitle()}\n            onMouseLeave={_handleMouseOut}\n          >\n            <g transform={`translate(${_width / 2}, ${_height - (_margins.bottom + _legendsHeight)})`}>\n              {props.chartTitle && (\n                <text\n                  x={0}\n                  y={-(_outerRadius + TITLE_OFFSET)}\n                  textAnchor=\"middle\"\n                  className={classes.chartTitle}\n                  aria-hidden={true}\n                >\n                  {props.chartTitle}\n                </text>\n              )}\n              {!props.hideMinMax && (\n                <>\n                  <text\n                    x={(_isRTL ? 1 : -1) * (_outerRadius + LABEL_OFFSET)}\n                    y={0}\n                    textAnchor=\"end\"\n                    className={classes.limits}\n                    role=\"img\"\n                    aria-label={`Min value: ${_minValue}`}\n                  >\n                    {formatScientificLimitWidth(_minValue)}\n                  </text>\n                  <text\n                    x={(_isRTL ? -1 : 1) * (_outerRadius + LABEL_OFFSET)}\n                    y={0}\n                    textAnchor=\"start\"\n                    className={classes.limits}\n                    role=\"img\"\n                    aria-label={`Max value: ${_maxValue}`}\n                  >\n                    {formatScientificLimitWidth(_maxValue)}\n                  </text>\n                </>\n              )}\n              {arcs.map((arc, index) => {\n                const segment = _segments[arc.segmentIndex];\n                const arcId = `gauge-chart-arc-${index}`;\n                return (\n                  <React.Fragment key={index}>\n                    <path\n                      d={arc.d}\n                      id={arcId}\n                      strokeWidth={focusedElement === segment.legend ? ARC_PADDING : 0}\n                      className={classes.segment}\n                      fill={segment.color}\n                      opacity={_legendHighlighted(segment.legend) || _noLegendHighlighted() ? 1 : 0.1}\n                      {...getAccessibleDataObject(\n                        {\n                          ariaLabel: getSegmentLabel(segment, _minValue, _maxValue, props.variant, true),\n                          ...segment.accessibilityData,\n                        },\n                        'img',\n                        true,\n                      )}\n                      onFocus={e => _handleFocus(e, segment.legend, arcId)}\n                      onBlur={_handleBlur}\n                      onMouseEnter={e => _handleMouseOver(e, segment.legend, arcId)}\n                      onMouseLeave={e => _handleCalloutDismiss()}\n                      onMouseMove={e => _handleMouseOver(e, segment.legend, arcId)}\n                      tabIndex={_legendHighlighted(segment.legend) || _noLegendHighlighted() ? 0 : undefined}\n                    />\n                  </React.Fragment>\n                );\n              })}\n              {_renderNeedle()}\n              <g\n                onMouseEnter={e => _handleMouseOver(e, 'Chart value')}\n                onMouseMove={e => _handleMouseOver(e, 'Chart value')}\n              >\n                <SVGTooltipText\n                  content={getChartValueLabel(props.chartValue, _minValue, _maxValue, props.chartValueFormat)}\n                  textProps={{\n                    x: 0,\n                    y: 0,\n                    textAnchor: 'middle',\n                    className: classes.chartValue,\n                    fontSize: chartValueSize,\n                    'aria-hidden': 'true',\n                  }}\n                  maxWidth={_innerRadius * 2 - 24}\n                  wrapContent={_wrapContent}\n                />\n              </g>\n              {props.sublabel && (\n                <SVGTooltipText\n                  content={props.sublabel}\n                  textProps={{\n                    x: 0,\n                    y: 4,\n                    textAnchor: 'middle',\n                    dominantBaseline: 'hanging',\n                    className: classes.sublabel,\n                  }}\n                  maxWidth={_innerRadius * 2}\n                  wrapContent={_wrapContent}\n                />\n              )}\n            </g>\n          </svg>\n        </div>\n        {_renderLegends()}\n        {!props.hideTooltip && isPopoverOpen && (\n          <ChartPopover\n            {...props.calloutProps}\n            positioning={{\n              target: refSelected,\n            }}\n            isPopoverOpen={isPopoverOpen}\n            customCallout={{\n              customizedCallout: _multiValueCallout({ hoverXValue: hoverXValue, YValueHover: hoverYValues }),\n            }}\n          />\n        )}\n      </div>\n    );\n  },\n);\nGaugeChart.displayName = 'GaugeChart';\n"],"names":["React","useGaugeChartStyles","select","d3Select","arc","d3Arc","Points","areArraysEqual","formatScientificLimitWidth","getAccessibleDataObject","getColorFromToken","getNextColor","pointTypes","useRtl","formatToLocaleString","SVGTooltipText","Legends","Shape","useFocusableGroup","ChartPopover","toImage","GAUGE_MARGIN","LABEL_WIDTH","LABEL_HEIGHT","LABEL_OFFSET","TITLE_OFFSET","EXTRA_NEEDLE_LENGTH","ARC_PADDING","BREAKPOINTS","minRadius","arcWidth","fontSize","calcNeedleRotation","chartValue","minValue","maxValue","needleRotation","getSegmentLabel","segment","variant","isAriaLabel","legend","size","toFixed","start","end","getChartValueLabel","chartValueFormat","forCallout","toString","GaugeChart","forwardRef","props","forwardedRef","_legendsRef","useRef","_getMargins","hideMinMax","chartTitle","sublabel","left","right","top","bottom","_margins","_legendsHeight","hideLegend","_rootElem","_isRTL","width","setWidth","useState","height","setHeight","hoveredLegend","setHoveredLegend","selectedLegends","setSelectedLegends","legendProps","focusedElement","setFocusedElement","isPopoverOpen","setPopoverOpen","hoverXValue","setHoverXValue","hoverYValues","setHoverYValues","refSelected","setRefSelected","prevPropsRef","_width","_height","_outerRadius","Math","min","chartValueSize","_getStylesBasedOnBreakpoint","_innerRadius","_minValue","_maxValue","_segments","_calloutAnchor","useEffect","current","clientWidth","clientHeight","prevProps","useImperativeHandle","componentRef","chartContainer","opts","toSVG","classes","index","length","_processProps","segments","roundCorners","total","processedSegments","map","max","color","accessibilityData","push","arcGenerator","cornerRadius","padAngle","padRadius","rtlSafeSegments","Array","from","reverse","prevAngle","PI","arcs","endAngle","d","innerRadius","outerRadius","startAngle","segmentIndex","_renderNeedle","rtlSafeNeedleRotation","strokeWidth","halfStrokeWidth","needleLength","needleId","g","transform","path","id","className","needle","data-is-focusable","onFocus","e","_handleFocus","onBlur","_handleBlur","onMouseEnter","_handleMouseOver","onMouseMove","role","aria-label","_renderLegends","legends","title","hoverAction","onMouseOutAction","div","legendsContainer","centerLegends","onChange","_onLegendSelectionChange","legendRef","event","currentLegend","canSelectMultipleLegends","slice","_legendHighlighted","_getHighlightedLegend","includes","_noLegendHighlighted","focusEvent","elementId","_showCallout","_hideCallout","mouseEvent","hoveredElement","_handleMouseOut","_handleCalloutDismiss","isFocusEvent","targetElement","document","getElementById","yValue","y","isBlurEvent","_wrapContent","content","maxWidth","textElement","text","node","isOverflowing","textLength","getComputedTextLength","_multiValueCallout","calloutProps","yValueHoverSubCountsExists","_yValueHoverSubCountsExists","YValueHover","calloutContentRoot","calloutDateTimeContainer","style","marginBottom","calloutContentX","xAxisCalloutAccessibilityData","culture","calloutInfoContainer","display","yValues","isLast","shouldDrawBorderBottom","callOutAccessibilityData","key","paddingBottom","_getCalloutContent","descriptionMessage","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","calloutBlockContainer","borderInlineStart","svgProps","shapeStyles","pathProps","fill","shape","Object","keys","calloutlegendText","calloutContentY","data","subcounts","subcountName","_getChartTitle","focusAttributes","root","ref","el","chartWrapper","svg","chart","onMouseLeave","x","textAnchor","aria-hidden","limits","arcId","Fragment","opacity","ariaLabel","tabIndex","textProps","wrapContent","dominantBaseline","hideTooltip","positioning","target","customCallout","customizedCallout","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,mBAAmB,QAAQ,+BAA+B;AACnE,SAASC,UAAUC,QAAQ,QAAQ,eAAe;AAClD,SAASC,OAAOC,KAAK,QAAQ,WAAW;AAExC,SACEC,MAAM,EACNC,cAAc,EACdC,0BAA0B,EAC1BC,uBAAuB,EACvBC,iBAAiB,EACjBC,YAAY,EACZC,UAAU,EACVC,MAAM,QACD,wBAAwB;AAC/B,SAASC,oBAAoB,QAAQ,4BAA4B;AACjE,SAASC,cAAc,QAAQ,iCAAiC;AAChE,SAA8BC,OAAO,EAAEC,KAAK,QAAyB,mBAAmB;AAExF,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,YAAY,QAAQ,mCAAmC;AAEhE,SAASC,OAAO,QAAQ,qCAAqC;AAE7D,MAAMC,eAAe;AACrB,MAAMC,cAAc;AACpB,MAAMC,eAAe;AACrB,MAAMC,eAAe;AACrB,MAAMC,eAAe;AACrB,MAAMC,sBAAsB;AAC5B,OAAO,MAAMC,cAAc,EAAE;AAC7B,OAAO,MAAMC,cAAc;IACzB;QAAEC,WAAW;QAAIC,UAAU;QAAIC,UAAU;IAAG;IAC5C;QAAEF,WAAW;QAAIC,UAAU;QAAIC,UAAU;IAAG;IAC5C;QAAEF,WAAW;QAAIC,UAAU;QAAIC,UAAU;IAAG;IAC5C;QAAEF,WAAW;QAAKC,UAAU;QAAIC,UAAU;IAAG;IAC7C;QAAEF,WAAW;QAAKC,UAAU;QAAIC,UAAU;IAAG;IAC7C;QAAEF,WAAW;QAAKC,UAAU;QAAIC,UAAU;IAAG;CAC9C,CAAC;AAEF,OAAO,MAAMC,qBAAqB,CAACC,YAAoBC,UAAkBC;IACvE,IAAIC,iBAAiB,AAAEH,CAAAA,aAAaC,QAAO,IAAMC,CAAAA,WAAWD,QAAO,IAAM;IACzE,IAAIE,iBAAiB,GAAG;QACtBA,iBAAiB;IACnB,OAAO,IAAIA,iBAAiB,KAAK;QAC/BA,iBAAiB;IACnB;IAEA,OAAOA;AACT,EAAE;AAEF,OAAO,MAAMC,kBAAkB,CAC7BC,SACAJ,UACAC,UACAI,SACAC,cAAuB,KAAK;IAE5B,IAAIA,aAAa;QACf,OAAON,aAAa,KAAKK,YAAY,mBACjC,GAAGD,QAAQG,MAAM,CAAC,EAAE,EAAEH,QAAQI,IAAI,CAAC,QAAQ,EAAEP,SAAS,IAAI,EAAE,AAAC,CAAA,AAACG,QAAQI,IAAI,GAAGP,WAAY,GAAE,EAAGQ,OAAO,GAAG,CAAC,CAAC,GAC1G,GAAGL,QAAQG,MAAM,CAAC,EAAE,EAAEH,QAAQM,KAAK,CAAC,IAAI,EAAEN,QAAQO,GAAG,EAAE;IAC7D;IAEA,OAAOX,aAAa,KAAKK,YAAY,mBACjC,GAAGD,QAAQI,IAAI,CAAC,EAAE,EAAE,AAAC,CAAA,AAACJ,QAAQI,IAAI,GAAGP,WAAY,GAAE,EAAGQ,OAAO,GAAG,EAAE,CAAC,GACnE,GAAGL,QAAQM,KAAK,CAAC,GAAG,EAAEN,QAAQO,GAAG,EAAE;AACzC,EAAE;AAEF,OAAO,MAAMC,qBAAqB,CAChCb,YACAC,UACAC,UACAY,kBACAC,aAAsB,KAAK;IAE3B,IAAIA,YAAY;QACd,iGAAiG;QACjG,4DAA4D;QAC5D,OAAOd,aAAa,IAChBD,WAAWgB,QAAQ,KACnBF,qBAAqB,aACrB,GAAG,AAAC,CAAA,AAACd,aAAaE,WAAY,GAAE,EAAGQ,OAAO,GAAG,CAAC,CAAC,GAC/C,GAAGV,WAAW,CAAC,EAAEE,UAAU;IACjC;IAEA,OAAO,OAAOY,qBAAqB,aAC/BA,iBAAiB;QAACd,aAAaC;QAAUC,WAAWD;KAAS,IAC7DA,aAAa,IACbD,WAAWgB,QAAQ,KACnBF,qBAAqB,aACrB,GAAGd,WAAW,CAAC,EAAEE,UAAU,GAC3B,GAAG,AAAC,CAAA,AAACF,aAAaE,WAAY,GAAE,EAAGQ,OAAO,GAAG,CAAC,CAAC;AACrD,EAAE;AAUF,OAAO,MAAMO,2BAAuDlD,MAAMmD,UAAU,CAClF,CAACC,OAAOC;QAkBiED;IAjBvE,MAAME,cAActD,MAAMuD,MAAM,CAAkB;IAClD,MAAMC,cAAc;QAClB,MAAM,EAAEC,UAAU,EAAEC,UAAU,EAAEC,QAAQ,EAAE,GAAGP;QAC7C,OAAO;YACLQ,MAAM,AAAC,CAAA,CAACH,aAAajC,eAAeF,cAAc,CAAA,IAAKD;YACvDwC,OAAO,AAAC,CAAA,CAACJ,aAAajC,eAAeF,cAAc,CAAA,IAAKD;YACxDyC,KAAK,AAACJ,CAAAA,aAAajC,eAAeF,eAAeG,sBAAsB,CAAA,IAAKL;YAC5E0C,QAAQ,AAACJ,CAAAA,WAAWnC,eAAeD,eAAe,CAAA,IAAKF;QACzD;IACF;IACA,MAAM2C,WAAyER;IAC/E,MAAMS,iBAAyB,CAACb,MAAMc,UAAU,GAAG,KAAK;IACxD,MAAMC,YAAYnE,MAAMuD,MAAM,CAAwB;IACtD,MAAMa,SAAkBvD;IACxB,MAAM,CAACwD,OAAOC,SAAS,GAAGtE,MAAMuE,QAAQ,CAAS,MAAMf,cAAcI,IAAI,GAAGJ,cAAcK,KAAK;IAC/F,MAAM,CAACW,QAAQC,UAAU,GAAGzE,MAAMuE,QAAQ,CAAS,KAAKf,cAAcM,GAAG,GAAGN,cAAcO,MAAM,GAAGE;IACnG,MAAM,CAACS,eAAeC,iBAAiB,GAAG3E,MAAMuE,QAAQ,CAAS;IACjE,MAAM,CAACK,iBAAiBC,mBAAmB,GAAG7E,MAAMuE,QAAQ,CAAWnB,EAAAA,qBAAAA,MAAM0B,WAAW,cAAjB1B,yCAAAA,mBAAmBwB,eAAe,KAAI,EAAE;IAC/G,MAAM,CAACG,gBAAgBC,kBAAkB,GAAGhF,MAAMuE,QAAQ,CAAqB;IAC/E,MAAM,CAACU,eAAeC,eAAe,GAAGlF,MAAMuE,QAAQ,CAAC;IACvD,MAAM,CAACY,aAAaC,eAAe,GAAGpF,MAAMuE,QAAQ,CAAkB;IACtE,MAAM,CAACc,cAAcC,gBAAgB,GAAGtF,MAAMuE,QAAQ,CAAW,EAAE;IACnE,MAAM,CAACgB,aAAaC,eAAe,GAAGxF,MAAMuE,QAAQ,CAAqB;IACzE,MAAMkB,eAAezF,MAAMuD,MAAM,CAAyB;IAC1D,MAAMmC,SAAStC,MAAMiB,KAAK,IAAIA;IAC9B,MAAMsB,UAAUvC,MAAMoB,MAAM,IAAIA;IAChC,MAAMoB,eAAuBC,KAAKC,GAAG,CACnC,AAACJ,CAAAA,SAAU1B,CAAAA,SAASJ,IAAI,GAAGI,SAASH,KAAK,AAAD,CAAC,IAAK,GAC9C8B,UAAW3B,CAAAA,SAASF,GAAG,GAAGE,SAASD,MAAM,GAAGE,cAAa;IAE3D,MAAM,EAAEnC,QAAQ,EAAEiE,cAAc,EAAE,GAAGC;IACrC,MAAMC,eAAuBL,eAAe9D;IAC5C,IAAIoE;IACJ,IAAIC;IACJ,IAAIC;IACJ,IAAIC,iBAAyB;IAE7BrG,MAAMsG,SAAS,CAAC;QACd,IAAInC,UAAUoC,OAAO,EAAE;YACrBjC,SAASH,UAAUoC,OAAO,CAACC,WAAW;YACtC/B,UAAUN,UAAUoC,OAAO,CAACE,YAAY;QAC1C;IACF,GAAG,EAAE;IAELzG,MAAMsG,SAAS,CAAC;QACd,IAAIb,aAAac,OAAO,EAAE;gBAEJG,wBAAwCtD;YAD5D,MAAMsD,YAAYjB,aAAac,OAAO;YACtC,IAAI,CAAChG,gBAAemG,yBAAAA,UAAU5B,WAAW,cAArB4B,6CAAAA,uBAAuB9B,eAAe,GAAExB,qBAAAA,MAAM0B,WAAW,cAAjB1B,yCAAAA,mBAAmBwB,eAAe,GAAG;oBAC5ExB;gBAAnByB,mBAAmBzB,EAAAA,sBAAAA,MAAM0B,WAAW,cAAjB1B,0CAAAA,oBAAmBwB,eAAe,KAAI,EAAE;YAC7D;QACF;QACAa,aAAac,OAAO,GAAGnD;IACzB,GAAG;QAACA;KAAM;IAEVpD,MAAM2G,mBAAmB,CACvBvD,MAAMwD,YAAY,EAClB,IAAO,CAAA;YACLC,gBAAgB1C,UAAUoC,OAAO;YACjCnF,SAAS,CAAC0F;oBAC0BxD;gBAAlC,OAAOlC,QAAQ+C,UAAUoC,OAAO,GAAEjD,sBAAAA,YAAYiD,OAAO,cAAnBjD,0CAAAA,oBAAqByD,KAAK,EAAE3C,QAAQ0C;YACxE;QACF,CAAA,GACA,EAAE;IAGJ,MAAME,UAAU/G,oBAAoBmD;IACpC,SAAS4C;QACP,IAAK,IAAIiB,QAAQrF,YAAYsF,MAAM,GAAG,GAAGD,SAAS,GAAGA,SAAS,EAAG;YAC/D,IAAIrB,gBAAgBhE,WAAW,CAACqF,MAAM,CAACpF,SAAS,EAAE;gBAChD,OAAO;oBACLC,UAAUF,WAAW,CAACqF,MAAM,CAACnF,QAAQ;oBACrCiE,gBAAgBnE,WAAW,CAACqF,MAAM,CAAClF,QAAQ;gBAC7C;YACF;QACF;QACA,OAAO;YACLD,UAAUF,WAAW,CAAC,EAAE,CAACE,QAAQ;YACjCiE,gBAAgBnE,WAAW,CAAC,EAAE,CAACG,QAAQ;QACzC;IACF;IAEA,SAASoF;QACP,MAAM,EAAEjF,WAAW,CAAC,EAAEC,QAAQ,EAAEiF,QAAQ,EAAEC,YAAY,EAAE,GAAGjE;QAE3D,IAAIkE,QAAQpF;QACZ,MAAMqF,oBAAuCH,SAASI,GAAG,CACvD,8DAA8D;QAC9D,CAAClF,SAA+E2E;YAC9E,MAAMvE,OAAOmD,KAAK4B,GAAG,CAACnF,QAAQI,IAAI,EAAE;YACpC4E,SAAS5E;YACT,OAAO;gBACLD,QAAQH,QAAQG,MAAM;gBACtBC;gBACAgF,OACE,OAAOpF,QAAQoF,KAAK,KAAK,cACrBhH,kBAAkB4B,QAAQoF,KAAK,EAAE,SACjC/G,aAAasG,OAAO,GAAG;gBAC7BU,mBAAmBrF,QAAQqF,iBAAiB;gBAC5C/E,OAAO0E,QAAQ5E;gBACfG,KAAKyE;YACP;QACF;QAEF,IAAI,OAAOnF,aAAa,eAAemF,QAAQnF,UAAU;YACvDoF,kBAAkBK,IAAI,CAAC;gBACrBnF,QAAQ;gBACRC,MAAMP,WAAWmF;gBACjBI,OAAO;gBACP9E,OAAO0E;gBACPzE,KAAKV;YACP;YACAmF,QAAQnF;QACV;QAEA,MAAM0F,eAAexH,QAClByH,YAAY,CAACT,eAAe,IAAI,GAChCU,QAAQ,CAACpG,cAAciE,cACvBoC,SAAS,CAACpC;QACb,MAAMqC,kBAAkB7D,SAAS8D,MAAMC,IAAI,CAACZ,mBAAmBa,OAAO,KAAKb;QAC3E,IAAIc,YAAY,CAACxC,KAAKyC,EAAE,GAAG;QAC3B,wDAAwD;QACxD,MAAMC,OAAON,gBAAgBT,GAAG,CAAC,CAAClF,SAAS2E;YACzC,MAAMuB,WAAWH,YAAY,AAAC/F,QAAQI,IAAI,GAAI4E,CAAAA,QAAQpF,QAAO,IAAM2D,KAAKyC,EAAE;YAC1E,MAAMG,IAAIZ,aAAa;gBACrBa,aAAazC;gBACb0C,aAAa/C;gBACbgD,YAAYP;gBACZG;YACF;YACAH,YAAYG;YACZ,OAAO;gBACLC;gBACAI,cAAczE,SAASmD,kBAAkBL,MAAM,GAAG,IAAID,QAAQA;gBAC9D2B,YAAYP,YAAY,AAAC/F,QAAQI,IAAI,GAAI4E,CAAAA,QAAQpF,QAAO,IAAM2D,KAAKyC,EAAE;gBACrEE;YACF;QACF;QAEAtC,YAAYhE;QACZiE,YAAYmB;QACZlB,YAAYmB;QAEZ,OAAO;YACLgB;QACF;IACF;IAEA,SAASO;QACP,MAAM1G,iBAAiBJ,mBAAmBoB,MAAMnB,UAAU,EAAEiE,WAAWC;QACvE,MAAM4C,wBAAwB3E,SAAS,MAAMhC,iBAAiBA;QAC9D,MAAM4G,cAAc;QACpB,MAAMC,kBAAkBD,cAAc;QACtC,MAAME,eAAetD,eAAeK,eAAevE;QACnD,MAAMyH,WAAW,CAAC,kBAAkB,CAAC;QACrC,qBACE,oBAACC;YAAEC,WAAW,CAAC,OAAO,EAAEN,sBAAsB,OAAO,CAAC;yBACpD,oBAACO;YACCb,GAAG,CAAC;gBACA,EAAE,CAACQ,kBAAkB,EAAE;cACzB,EAAE,CAACC,aAAa,CAAC,EAAE,CAACD,kBAAkB,EAAE;cACxC,EAAEA,kBAAkB,EAAE,CAAC,EAAEA,kBAAkB,EAAE,OAAO,EAAE,CAACC,aAAa,CAAC,EAAED,kBAAkB,EAAE;gBACzF,EAAEA,kBAAkB,EAAE;cACxB,EAAEA,kBAAkB,EAAE,CAAC,EAAEA,kBAAkB,EAAE,SAAS,EAAE,CAACA,kBAAkB,EAAE;UACjF,CAAC;YACCM,IAAIJ;YACJH,aAAaA;YACbQ,WAAWxC,QAAQyC,MAAM;YACzBJ,WAAW,CAAC,UAAU,EAAE,CAACpD,eAAevE,sBAAsB,EAAE,CAAC,CAAC;YAClEgI,qBAAmB;YACnBC,SAASC,CAAAA,IAAKC,aAAaD,GAAG,UAAUT;YACxCW,QAAQC;YACRC,cAAcJ,CAAAA,IAAKK,iBAAiBL,GAAG,UAAUT;YACjDe,aAAaN,CAAAA,IAAKK,iBAAiBL,GAAG,UAAUT;YAChDgB,MAAK;YACLC,cACE,oBAAoBtH,mBAAmBM,MAAMnB,UAAU,EAAEiE,WAAWC,WAAW/C,MAAML,gBAAgB;;IAK/G;IAEA,SAASsH;QACP,IAAIjH,MAAMc,UAAU,EAAE;YACpB,OAAO;QACT;QAEA,MAAMoG,UAAoBlE,UAAUoB,GAAG,CAAC,CAAClF,SAAS2E;YAChD,MAAMS,QAAgBpF,QAAQoF,KAAK,IAAI/G,aAAasG,OAAO,GAAG;YAE9D,OAAO;gBACLsD,OAAOjI,QAAQG,MAAM;gBACrBiF;gBACA8C,aAAa;oBACX7F,iBAAiBrC,QAAQG,MAAM;gBACjC;gBACAgI,kBAAkB;oBAChB9F,iBAAiB;gBACnB;YACF;QACF;QAEA,qBACE,oBAAC+F;YAAIlB,WAAWxC,QAAQ2D,gBAAgB;yBACtC,oBAAC3J;YACCsJ,SAASA;YACTM,eAAAA;YACC,GAAGxH,MAAM0B,WAAW;YACrB,6CAA6C;YAC7C+F,UAAUC;YACVC,WAAWzH;;IAInB;IAEA,SAASwH,yBACP,wDAAwD;IACxDlG,eAAyB,EACzBoG,KAA0C,EAC1CC,aAAsB;YAElB7H,oBAKAA;QALJ,KAAIA,qBAAAA,MAAM0B,WAAW,cAAjB1B,yCAAAA,mBAAmB8H,wBAAwB,EAAE;YAC/CrG,mBAAmBD;QACrB,OAAO;YACLC,mBAAmBD,gBAAgBuG,KAAK,CAAC,CAAC;QAC5C;QACA,KAAI/H,sBAAAA,MAAM0B,WAAW,cAAjB1B,0CAAAA,oBAAmByH,QAAQ,EAAE;YAC/BzH,MAAM0B,WAAW,CAAC+F,QAAQ,CAACjG,iBAAiBoG,OAAOC;QACrD;IACF;IAEA;;;;;KAKC,GACD,SAASG,mBAAmB3I,MAAc;QACxC,OAAO4I,wBAAwBC,QAAQ,CAAC7I;IAC1C;IAEA;;KAEC,GACD,SAAS8I;QACP,OAAOF,wBAAwBnE,MAAM,KAAK;IAC5C;IAEA,SAASmE;QACP,OAAOzG,gBAAgBsC,MAAM,GAAG,IAAItC,kBAAkBF,gBAAgB;YAACA;SAAc,GAAG,EAAE;IAC5F;IAEA,wDAAwD;IACxD,SAASmF,aAAa2B,UAAwC,EAAEzG,cAAsB,EAAE0G,SAAkB;QACxGC,aAAaF,YAAYzG,gBAAgB,MAAM0G;IACjD;IAEA,SAAS1B;QACP4B,aAAa;IACf;IAEA,SAAS1B,iBAAiB2B,UAAwC,EAAEC,cAAsB,EAAEJ,SAAkB;QAC5GC,aAAaE,YAAYC,gBAAgB,OAAOJ;IAClD;IAEA,SAASK;QACPH,aAAa;IACf;IAEA,SAASI;QACPJ,aAAa;IACf;IAEA,8DAA8D;IAC9D,SAASD,aACPV,KAAuF,EACvFvI,MAAc,EACduJ,YAAqB,EACrBP,SAAkB;QAElB,IAAIpF,mBAAmB5D,QAAQ;YAC7B;QACF;QACA,MAAMwJ,gBAAgBC,SAASC,cAAc,CAACV;QAC9CpF,iBAAiB5D;QACjB,wDAAwD;QACxD,MAAM0C,cACJ,sBAAsBrC,mBAAmBM,MAAMnB,UAAU,EAAEiE,WAAWC,WAAW/C,MAAML,gBAAgB,EAAE;QAC3G,wDAAwD;QACxD,MAAMsC,eAAyBe,UAAUoB,GAAG,CAAClF,CAAAA;YAC3C,MAAM8J,SAAiB;gBACrB3J,QAAQH,QAAQG,MAAM;gBACtB4J,GAAGhK,gBAAgBC,SAAS4D,WAAWC,WAAW/C,MAAMb,OAAO;gBAC/DmF,OAAOpF,QAAQoF,KAAK;YACtB;YACA,OAAO0E;QACT;QACAlH,eACE;YAAC;YAAU;SAAc,CAACoG,QAAQ,CAAC7I,WAAW8I,0BAA0BH,mBAAmB3I;QAE7F+C,eAAeyG;QACf7G,eAAeD;QACfG,gBAAgBD;QAChB,IAAI2G,cAAc;YAChBhH,kBAAkBvC;QACpB;IACF;IAEA,SAASkJ,aAAaW,WAAqB;QACzCjG,iBAAiB;QACjBnB,eAAe;QACfE,eAAe;QACfE,gBAAgB,EAAE;QAClB,IAAIgH,aAAa;YACftH,kBAAkB;QACpB;IACF;IAEA,SAASuH,aAAaC,OAAe,EAAEjD,EAAU,EAAEkD,QAAgB;QACjE,MAAMC,cAAcvM,SAA6B,CAAC,CAAC,EAAEoJ,IAAI;QACzDmD,YAAYC,IAAI,CAACH;QACjB,IAAI,CAACE,YAAYE,IAAI,IAAI;YACvB,OAAO;QACT;QAEA,IAAIC,gBAAgB;QACpB,IAAIC,aAAaJ,YAAYE,IAAI,GAAIG,qBAAqB;QAC1D,MAAOD,aAAaL,YAAYD,QAAQtF,MAAM,GAAG,EAAG;YAClDsF,UAAUA,QAAQrB,KAAK,CAAC,GAAG,CAAC;YAC5BuB,YAAYC,IAAI,CAACH,UAAU;YAC3BK,gBAAgB;YAChBC,aAAaJ,YAAYE,IAAI,GAAIG,qBAAqB;QACxD;QACA,OAAOF;IACT;IAEA,iGAAiG;IACjG,8DAA8D;IAC9D,SAASG,mBAAmBC,YAAiB;QAC3C,MAAMC,6BAAsCC,4BAA4BF,aAAaG,WAAW;QAChG,qBACE,oBAAC1C;YAAIlB,WAAWxC,QAAQqG,kBAAkB;yBACxC,oBAAC3C;YACClB,WAAWxC,QAAQsG,wBAAwB;YAC3CC,OAAOL,6BAA6B;gBAAEM,cAAc;YAAO,IAAI,CAAC;yBAEhE,oBAAC9C;YACClB,WAAWxC,QAAQyG,eAAe;YACjC,GAAGhN,wBAAwBwM,aAAcS,6BAA6B,EAAE,QAAQ,MAAM;WAEtF5M,qBAAqBmM,aAAc9H,WAAW,EAAE/B,MAAMuK,OAAO,mBAGlE,oBAACjD;YAAIlB,WAAWxC,QAAQ4G,oBAAoB;YAAEL,OAAOL,6BAA6B;gBAAEW,SAAS;YAAO,IAAI,CAAC;WACtGZ,aAAcG,WAAW,IACxBH,aAAcG,WAAW,CAAC5F,GAAG,CAAC,CAAC4E,QAAqBnF,OAAe6G;YACjE,MAAMC,SAAkB9G,QAAQ,MAAM6G,QAAQ5G,MAAM;YACpD,MAAM,EAAE8G,yBAAyB,KAAK,EAAE,GAAG5B;YAC3C,qBACE,oBAAC1B;gBACE,GAAGjK,wBAAwB2L,OAAO6B,wBAAwB,EAAE,QAAQ,MAAM;gBAC3EC,KAAK,CAAC,gBAAgB,EAAEjH,OAAO;gBAC/BsG,OACEL,6BACI;oBACEW,SAAS;oBACT,GAAIG,0BAA0B;wBAC5BG,eAAe;oBACjB,CAAC;gBACH,IACA;oBACE,GAAIH,0BAA0B;wBAC5BG,eAAe;oBACjB,CAAC;gBACH;eAGLC,mBAAmBhC,QAAQnF,OAAOiG,4BAA4Ba;QAGrE,IACD,CAAC,CAACd,aAAaoB,kBAAkB,kBAChC,oBAAC3D;YAAIlB,WAAWxC,QAAQqH,kBAAkB;WAAGpB,aAAaoB,kBAAkB;IAKtF;IAEA,SAASlB,4BAA4BmB,WAA2B;QAC9D,IAAIA,aAAa;YACf,OAAOA,YAAYC,IAAI,CACrB,CAACnC,SAKKA,OAAOoC,gBAAgB,IAAI,OAAOpC,OAAOoC,gBAAgB,KAAK;QAExE;QACA,OAAO;IACT;IAEA,SAASJ,mBACPK,MAAmB,EACnBxH,KAAa,EACbiG,0BAAmC,EACnCa,MAAe;QAEf,MAAMW,cAAmCX,SAAS,CAAC,IAAI;YAAEY,aAAa;QAAO;QAC7E,MAAMC,cAAcH,OAAOxH,KAAK,KAAK4H,aAAaJ,OAAOxH,KAAK,KAAK,CAAC;QACpE,MAAM,EAAE0G,OAAO,EAAE,GAAGvK;QACpB,MAAMgJ,SAAStL,qBAAqB2N,OAAOpC,CAAC,EAAEsB;QAC9C,IAAI,CAACc,OAAOD,gBAAgB,IAAI,OAAOC,OAAOD,gBAAgB,KAAK,UAAU;YAC3E,qBACE,oBAAC9D;gBAAI6C,OAAOL,6BAA6BwB,cAAc,CAAC;eACrDxB,4CACC,oBAACxC;gBAAIlB,WAAU;gBAAyB+D,OAAO;oBAAExL,UAAU;gBAAO;eAC/D0M,OAAOhM,MAAM,EAAE,MAAG2J,QAAO,oBAG9B,oBAAC1B;gBACCnB,IAAI,GAAGtC,MAAM,CAAC,EAAEwH,OAAOpC,CAAC,EAAE;gBAC1B7C,WAAWxC,QAAQ8H,qBAAqB;gBACxCvB,OAAO;oBAAEwB,mBAAmB,CAAC,UAAU,EAAEN,OAAO/G,KAAK,EAAE;gBAAC;eAEvDkH,6BACC,oBAAC3N;gBACC+N,UAAU;oBACRxF,WAAWxC,QAAQiI,WAAW;gBAChC;gBACAC,WAAW;oBAAEC,MAAMV,OAAO/G,KAAK;gBAAC;gBAChC0H,OAAO9O,MAAM,CAACmO,OAAOxH,KAAK,GAAIoI,OAAOC,IAAI,CAAC1O,YAAYsG,MAAM,CAAC;gBAC7DqG,OAAO;oBAAEM,SAAS;gBAAO;8BAG7B,oBAACnD,2BACC,oBAACA;gBAAIlB,WAAWxC,QAAQuI,iBAAiB;eAAE,KAAEd,OAAOhM,MAAM,iBAC1D,oBAACiI;gBAAIlB,WAAWxC,QAAQwI,eAAe;eAEnC1O,qBACE2N,OAAOD,gBAAgB,GAAGC,OAAOD,gBAAgB,GAAGC,OAAOpC,CAAC,IAAIoC,OAAOgB,IAAI,EAC3E9B;QAQhB,OAAO;YACL,MAAM+B,YAAsCjB,OAAOD,gBAAgB;YACnE,qBACE,oBAAC9D;gBAAI6C,OAAOmB;6BACV,oBAAChE;gBAAIlB,WAAU;gBAAyB+D,OAAO;oBAAExL,UAAU;gBAAO;eAC/D0M,OAAOhM,MAAM,EAAE,MAAG2J,QAAO,MAE3BiD,OAAOC,IAAI,CAACI,WAAWlI,GAAG,CAAC,CAACmI;gBAC3B,qBACE,oBAACjF;oBAAIwD,KAAKyB;oBAAcnG,WAAWxC,QAAQ8H,qBAAqB;iCAC9D,oBAACpE;oBAAIlB,WAAWxC,QAAQuI,iBAAiB;mBACtC,KACAzO,qBAAqB6O,cAAchC,yBAEtC,oBAACjD;oBAAIlB,WAAWxC,QAAQwI,eAAe;mBACpC1O,qBAAqB4O,SAAS,CAACC,aAAa,EAAEhC;YAIvD;QAGN;IACF;IAEA,SAASiC;QACP,MAAM,EAAElM,UAAU,EAAE,GAAGN;QACvB,OAAO,AAACM,CAAAA,aAAa,GAAGA,WAAW,EAAE,CAAC,GAAG,EAAC,IAAK,CAAC,iBAAiB,EAAE0C,UAAUc,MAAM,CAAC,WAAW,CAAC;IAClG;IACA,MAAM,EAAEqB,IAAI,EAAE,GAAGpB;IACjB,MAAM0I,kBAAkB3O;IACxB,qBACE,oBAACwJ;QAAIlB,WAAWxC,QAAQ8I,IAAI;QAAEC,KAAKC,CAAAA,KAAO7L,UAAUoC,OAAO,GAAGyJ;qBAC5D,oBAACtF;QAAIlB,WAAWxC,QAAQiJ,YAAY;QAAG,GAAGJ,eAAe;qBACvD,oBAACK;QACC1G,WAAWxC,QAAQmJ,KAAK;QACxB9L,OAAOqB;QACPlB,QAAQmB,UAAU1B;QAClBkG,MAAK;QACLC,cAAYwF;QACZQ,cAActE;qBAEd,oBAAC1C;QAAEC,WAAW,CAAC,UAAU,EAAE3D,SAAS,EAAE,EAAE,EAAEC,UAAW3B,CAAAA,SAASD,MAAM,GAAGE,cAAa,EAAG,CAAC,CAAC;OACtFb,MAAMM,UAAU,kBACf,oBAACiJ;QACC0D,GAAG;QACHhE,GAAG,CAAEzG,CAAAA,eAAenE,YAAW;QAC/B6O,YAAW;QACX9G,WAAWxC,QAAQtD,UAAU;QAC7B6M,eAAa;OAEZnN,MAAMM,UAAU,GAGpB,CAACN,MAAMK,UAAU,kBAChB,wDACE,oBAACkJ;QACC0D,GAAG,AAACjM,CAAAA,SAAS,IAAI,CAAC,CAAA,IAAMwB,CAAAA,eAAepE,YAAW;QAClD6K,GAAG;QACHiE,YAAW;QACX9G,WAAWxC,QAAQwJ,MAAM;QACzBrG,MAAK;QACLC,cAAY,CAAC,WAAW,EAAElE,WAAW;OAEpC1F,2BAA2B0F,2BAE9B,oBAACyG;QACC0D,GAAG,AAACjM,CAAAA,SAAS,CAAC,IAAI,CAAA,IAAMwB,CAAAA,eAAepE,YAAW;QAClD6K,GAAG;QACHiE,YAAW;QACX9G,WAAWxC,QAAQwJ,MAAM;QACzBrG,MAAK;QACLC,cAAY,CAAC,WAAW,EAAEjE,WAAW;OAEpC3F,2BAA2B2F,cAIjCoC,KAAKf,GAAG,CAAC,CAACpH,KAAK6G;QACd,MAAM3E,UAAU8D,SAAS,CAAChG,IAAIyI,YAAY,CAAC;QAC3C,MAAM4H,QAAQ,CAAC,gBAAgB,EAAExJ,OAAO;QACxC,qBACE,oBAACjH,MAAM0Q,QAAQ;YAACxC,KAAKjH;yBACnB,oBAACqC;YACCb,GAAGrI,IAAIqI,CAAC;YACRc,IAAIkH;YACJzH,aAAajE,mBAAmBzC,QAAQG,MAAM,GAAGd,cAAc;YAC/D6H,WAAWxC,QAAQ1E,OAAO;YAC1B6M,MAAM7M,QAAQoF,KAAK;YACnBiJ,SAASvF,mBAAmB9I,QAAQG,MAAM,KAAK8I,yBAAyB,IAAI;YAC3E,GAAG9K,wBACF;gBACEmQ,WAAWvO,gBAAgBC,SAAS4D,WAAWC,WAAW/C,MAAMb,OAAO,EAAE;gBACzE,GAAGD,QAAQqF,iBAAiB;YAC9B,GACA,OACA,KACD;YACDgC,SAASC,CAAAA,IAAKC,aAAaD,GAAGtH,QAAQG,MAAM,EAAEgO;YAC9C3G,QAAQC;YACRC,cAAcJ,CAAAA,IAAKK,iBAAiBL,GAAGtH,QAAQG,MAAM,EAAEgO;YACvDL,cAAcxG,CAAAA,IAAKmC;YACnB7B,aAAaN,CAAAA,IAAKK,iBAAiBL,GAAGtH,QAAQG,MAAM,EAAEgO;YACtDI,UAAUzF,mBAAmB9I,QAAQG,MAAM,KAAK8I,yBAAyB,IAAIsD;;IAIrF,IACC/F,+BACD,oBAACM;QACCY,cAAcJ,CAAAA,IAAKK,iBAAiBL,GAAG;QACvCM,aAAaN,CAAAA,IAAKK,iBAAiBL,GAAG;qBAEtC,oBAAC7I;QACCyL,SAAS1J,mBAAmBM,MAAMnB,UAAU,EAAEiE,WAAWC,WAAW/C,MAAML,gBAAgB;QAC1F+N,WAAW;YACTT,GAAG;YACHhE,GAAG;YACHiE,YAAY;YACZ9G,WAAWxC,QAAQ/E,UAAU;YAC7BF,UAAUgE;YACV,eAAe;QACjB;QACA0G,UAAUxG,eAAe,IAAI;QAC7B8K,aAAaxE;SAGhBnJ,MAAMO,QAAQ,kBACb,oBAAC5C;QACCyL,SAASpJ,MAAMO,QAAQ;QACvBmN,WAAW;YACTT,GAAG;YACHhE,GAAG;YACHiE,YAAY;YACZU,kBAAkB;YAClBxH,WAAWxC,QAAQrD,QAAQ;QAC7B;QACA8I,UAAUxG,eAAe;QACzB8K,aAAaxE;WAMtBlC,kBACA,CAACjH,MAAM6N,WAAW,IAAIhM,+BACrB,oBAAC9D;QACE,GAAGiC,MAAM6J,YAAY;QACtBiE,aAAa;YACXC,QAAQ5L;QACV;QACAN,eAAeA;QACfmM,eAAe;YACbC,mBAAmBrE,mBAAmB;gBAAE7H,aAAaA;gBAAaiI,aAAa/H;YAAa;QAC9F;;AAKV,GACA;AACFnC,WAAWoO,WAAW,GAAG"}