@fluentui/react-charts 9.0.5 → 9.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -7
- package/dist/index.d.ts +1 -1
- package/lib/components/CommonComponents/CartesianChart.js +3 -0
- package/lib/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib/components/CommonComponents/ChartPopover.js +10 -10
- package/lib/components/CommonComponents/ChartPopover.js.map +1 -1
- package/lib/components/DeclarativeChart/DeclarativeChart.js +7 -2
- package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +7 -4
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/DonutChart/Arc/Arc.js +2 -2
- package/lib/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.js +2 -2
- package/lib/components/DonutChart/DonutChart.js.map +1 -1
- package/lib/components/GaugeChart/GaugeChart.js +9 -9
- package/lib/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +2 -2
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
- package/lib/components/HeatMapChart/HeatMapChart.js +3 -2
- package/lib/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.js +8 -8
- package/lib/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.js +2 -2
- package/lib/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js +2 -2
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib/utilities/utilities.js +232 -53
- package/lib/utilities/utilities.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.js +3 -0
- package/lib-commonjs/components/CommonComponents/CartesianChart.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/ChartPopover.js +10 -10
- package/lib-commonjs/components/CommonComponents/ChartPopover.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +6 -1
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +6 -3
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/Arc.js +1 -1
- package/lib-commonjs/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.js +2 -2
- package/lib-commonjs/components/DonutChart/DonutChart.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/GaugeChart.js +8 -8
- package/lib-commonjs/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js +2 -1
- package/lib-commonjs/components/HeatMapChart/HeatMapChart.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js +7 -7
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
- package/lib-commonjs/utilities/utilities.js +236 -61
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/package.json +9 -9
- package/lib/utilities/locale-util.js +0 -15
- package/lib/utilities/locale-util.js.map +0 -1
- package/lib-commonjs/utilities/locale-util.js +0 -25
- package/lib-commonjs/utilities/locale-util.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["DonutChart.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-bind */\nimport * as React from 'react';\nimport { Pie } from './Pie/index';\nimport { DonutChartProps } from './DonutChart.types';\nimport { useDonutChartStyles } from './useDonutChartStyles.styles';\nimport { ChartDataPoint } from '../../DonutChart';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport { getColorFromToken, getNextColor } from '../../utilities/index';\nimport { Legend, Legends } from '../../index';\nimport { useId } from '@fluentui/react-utilities';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\n\nconst MIN_LEGEND_CONTAINER_HEIGHT = 40;\n\n// Create a DonutChart variant which uses these default styles and this styled subcomponent.\n/**\n * Donutchart component.\n * {@docCategory DonutChart}\n */\nexport const DonutChart: React.FunctionComponent<DonutChartProps> = React.forwardRef<HTMLDivElement, DonutChartProps>(\n (props, forwardedRef) => {\n const _rootElem = React.useRef<HTMLDivElement | null>(null);\n const _uniqText: string = useId('_Pie_');\n /* eslint-disable @typescript-eslint/no-explicit-any */\n let _calloutAnchorPoint: ChartDataPoint | null;\n let _emptyChartId: string | null;\n const legendContainer = React.useRef<HTMLDivElement | null>(null);\n const prevSize = React.useRef<{ width?: number; height?: number }>({});\n\n const [value, setValue] = React.useState<string | undefined>('');\n const [legend, setLegend] = React.useState<string | undefined>('');\n const [_width, setWidth] = React.useState<number | undefined>(props.width || 200);\n const [_height, setHeight] = React.useState<number | undefined>(props.height || 200);\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n const [color, setColor] = React.useState<string | undefined>('');\n const [xCalloutValue, setXCalloutValue] = React.useState<string>('');\n const [yCalloutValue, setYCalloutValue] = React.useState<string>('');\n const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n const [focusedArcId, setFocusedArcId] = React.useState<string>('');\n const [dataPointCalloutProps, setDataPointCalloutProps] = React.useState<ChartDataPoint | undefined>();\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n\n React.useEffect(() => {\n _fitParentContainer();\n }, []);\n\n React.useEffect(() => {\n if (prevSize.current.height !== props.height || prevSize.current.width !== props.width) {\n _fitParentContainer();\n }\n prevSize.current.height = props.height;\n prevSize.current.width = props.width;\n }, [props.width, props.height]);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: _rootElem.current,\n }),\n [],\n );\n\n function _elevateToMinimums(data: ChartDataPoint[]) {\n let sumOfData = 0;\n const minPercent = 0.01;\n const elevatedData: ChartDataPoint[] = [];\n data.forEach(item => {\n sumOfData += item.data!;\n });\n data.forEach(item => {\n elevatedData.push(\n minPercent * sumOfData > item.data! && item.data! > 0\n ? {\n ...item,\n data: minPercent * sumOfData,\n yAxisCalloutData:\n item.yAxisCalloutData === undefined ? item.data!.toLocaleString() : item.yAxisCalloutData,\n }\n : item,\n );\n });\n return elevatedData;\n }\n function _createLegends(chartData: ChartDataPoint[]): JSX.Element {\n const legendDataItems = chartData.map((point: ChartDataPoint, index: number) => {\n const color: string = point.color!;\n // mapping data to the format Legends component needs\n const legend: Legend = {\n title: point.legend!,\n color,\n action: () => {\n if (selectedLegend === point.legend) {\n setSelectedLegend('');\n } else {\n setSelectedLegend(point.legend!);\n }\n },\n hoverAction: () => {\n _handleChartMouseLeave();\n setActiveLegend(point.legend!);\n },\n onMouseOutAction: () => {\n setActiveLegend('');\n },\n };\n return legend;\n });\n const legends = (\n <Legends\n legends={legendDataItems}\n centerLegends\n overflowText={props.legendsOverflowText}\n {...props.legendProps}\n />\n );\n return legends;\n }\n\n function _focusCallback(data: ChartDataPoint, id: string, element: SVGPathElement): void {\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setValue(data.data!.toString());\n setLegend(data.legend);\n setColor(data.color!);\n setXCalloutValue(data.xAxisCalloutData!);\n setYCalloutValue(data.yAxisCalloutData!);\n setFocusedArcId(id);\n setDataPointCalloutProps(data);\n }\n\n function _hoverCallback(data: ChartDataPoint, e: React.MouseEvent<SVGPathElement>): void {\n if (_calloutAnchorPoint !== data) {\n _calloutAnchorPoint = data;\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setValue(data.data!.toString());\n setLegend(data.legend);\n setColor(data.color!);\n setXCalloutValue(data.xAxisCalloutData!);\n setYCalloutValue(data.yAxisCalloutData!);\n setDataPointCalloutProps(data);\n updatePosition(e.clientX, e.clientY);\n }\n }\n function _onBlur(): void {\n setFocusedArcId('');\n }\n\n function _hoverLeave(): void {\n /**/\n }\n\n function _handleChartMouseLeave() {\n _calloutAnchorPoint = null;\n setPopoverOpen(false);\n }\n\n function _valueInsideDonut(valueInsideDonut: string | number | undefined, data: ChartDataPoint[]) {\n const highlightedLegend = _getHighlightedLegend();\n if (valueInsideDonut !== undefined && (highlightedLegend !== '' || isPopoverOpen)) {\n let legendValue = valueInsideDonut;\n data!.map((point: ChartDataPoint, index: number) => {\n if (point.legend === highlightedLegend || (isPopoverOpen && point.legend === legend)) {\n legendValue = point.yAxisCalloutData ? point.yAxisCalloutData : point.data!;\n }\n return;\n });\n return legendValue;\n } else {\n return valueInsideDonut;\n }\n }\n\n function _toLocaleString(data: string | number | undefined) {\n const localeString = convertToLocaleString(data, props.culture);\n if (!localeString) {\n return data;\n }\n return localeString?.toString();\n }\n\n /**\n * This function returns\n * the selected legend if there is one\n * or the hovered legend if none of the legends is selected.\n * Note: This won't work in case of multiple legends selection.\n */\n function _getHighlightedLegend() {\n return selectedLegend || activeLegend;\n }\n\n function _isChartEmpty(): boolean {\n return !(\n props.data &&\n props.data.chartData &&\n props.data.chartData!.filter((d: ChartDataPoint) => d.data! > 0).length > 0\n );\n }\n\n function _addDefaultColors(donutChartDataPoint?: ChartDataPoint[]): ChartDataPoint[] {\n return donutChartDataPoint\n ? donutChartDataPoint.map((item, index) => {\n let defaultColor: string;\n if (typeof item.color === 'undefined') {\n defaultColor = getNextColor(index, 0);\n } else {\n defaultColor = getColorFromToken(item.color);\n }\n return { ...item, defaultColor };\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 /**\n * When screen resizes, along with screen, chart also auto adjusted.\n * This method used to adjust height and width of the charts.\n */\n function _fitParentContainer(): void {\n //_reqID = requestAnimationFrame(() => {\n let legendContainerHeight;\n if (props.hideLegend) {\n // If there is no legend, need not to allocate some space from total chart space.\n legendContainerHeight = 0;\n } else {\n const legendContainerComputedStyles = legendContainer.current && getComputedStyle(legendContainer.current);\n legendContainerHeight =\n ((legendContainer.current && legendContainer.current.getBoundingClientRect().height) ||\n MIN_LEGEND_CONTAINER_HEIGHT) +\n parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginTop) || '0') +\n parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginBottom) || '0');\n }\n if (props.parentRef || _rootElem.current) {\n const container = props.parentRef ? props.parentRef : _rootElem.current!;\n const currentContainerWidth = container.getBoundingClientRect().width;\n const currentContainerHeight =\n container.getBoundingClientRect().height > legendContainerHeight\n ? container.getBoundingClientRect().height\n : 200;\n const shouldResize =\n _width !== currentContainerWidth || _height !== currentContainerHeight - legendContainerHeight;\n if (shouldResize) {\n setWidth(currentContainerWidth);\n setHeight(currentContainerHeight - legendContainerHeight);\n }\n }\n //});\n }\n\n const { data, hideLegend = false } = props;\n const points = _addDefaultColors(data?.chartData);\n\n const classes = useDonutChartStyles(props);\n\n const legendBars = _createLegends(points);\n const donutMarginHorizontal = props.hideLabels ? 0 : 80;\n const donutMarginVertical = props.hideLabels ? 0 : 40;\n const outerRadius = Math.min(_width! - donutMarginHorizontal, _height! - donutMarginVertical) / 2;\n const chartData = _elevateToMinimums(points.filter((d: ChartDataPoint) => d.data! >= 0));\n const valueInsideDonut = props.innerRadius !== 0 ? _valueInsideDonut(props.valueInsideDonut!, chartData!) : '';\n const focusAttributes = useFocusableGroup();\n return !_isChartEmpty() ? (\n <div\n className={classes.root}\n ref={(rootElem: HTMLDivElement | null) => (_rootElem.current = rootElem)}\n onMouseLeave={_handleChartMouseLeave}\n >\n <div className={classes.chartWrapper} {...focusAttributes}>\n <svg className={classes.chart} aria-label={data?.chartTitle} width={_width} height={_height}>\n <Pie\n width={_width!}\n height={_height!}\n outerRadius={outerRadius}\n innerRadius={props.innerRadius!}\n data={chartData!}\n onFocusCallback={_focusCallback}\n hoverOnCallback={_hoverCallback}\n hoverLeaveCallback={_hoverLeave}\n uniqText={_uniqText}\n onBlurCallback={_onBlur}\n activeArc={_getHighlightedLegend()}\n focusedArcId={focusedArcId || ''}\n href={props.href!}\n valueInsideDonut={_toLocaleString(valueInsideDonut)}\n showLabelsInPercent={props.showLabelsInPercent}\n hideLabels={props.hideLabels}\n />\n </svg>\n </div>\n <ChartPopover\n xCalloutValue={xCalloutValue}\n yCalloutValue={yCalloutValue}\n culture={props.culture ?? 'en-us'}\n clickPosition={clickPosition}\n isPopoverOpen={!props.hideTooltip && isPopoverOpen}\n legend={legend!}\n YValue={value!}\n color={color}\n isCalloutForStack={false}\n customCallout={{\n customizedCallout: props.onRenderCalloutPerDataPoint\n ? props.onRenderCalloutPerDataPoint(dataPointCalloutProps!)\n : undefined,\n customCalloutProps: props.calloutPropsPerDataPoint\n ? props.calloutPropsPerDataPoint(dataPointCalloutProps!)\n : undefined,\n }}\n isCartesian={false}\n />\n {!hideLegend && (\n <div ref={(e: HTMLDivElement) => (legendContainer.current = e)} className={classes.legendContainer}>\n {legendBars}\n </div>\n )}\n </div>\n ) : (\n <div id={_emptyChartId!} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n },\n);\n\nDonutChart.displayName = 'DonutChart';\nDonutChart.defaultProps = {\n innerRadius: 0,\n hideLabels: true,\n};\n"],"names":["React","Pie","useDonutChartStyles","convertToLocaleString","getColorFromToken","getNextColor","Legends","useId","useFocusableGroup","ChartPopover","MIN_LEGEND_CONTAINER_HEIGHT","DonutChart","forwardRef","props","forwardedRef","_rootElem","useRef","_uniqText","_calloutAnchorPoint","_emptyChartId","legendContainer","prevSize","value","setValue","useState","legend","setLegend","_width","setWidth","width","_height","setHeight","height","activeLegend","setActiveLegend","color","setColor","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","selectedLegend","setSelectedLegend","focusedArcId","setFocusedArcId","dataPointCalloutProps","setDataPointCalloutProps","clickPosition","setClickPosition","x","y","isPopoverOpen","setPopoverOpen","useEffect","_fitParentContainer","current","useImperativeHandle","componentRef","chartContainer","_elevateToMinimums","data","sumOfData","minPercent","elevatedData","forEach","item","push","yAxisCalloutData","undefined","toLocaleString","_createLegends","chartData","legendDataItems","map","point","index","title","action","hoverAction","_handleChartMouseLeave","onMouseOutAction","legends","centerLegends","overflowText","legendsOverflowText","legendProps","_focusCallback","id","element","toString","xAxisCalloutData","_hoverCallback","e","updatePosition","clientX","clientY","_onBlur","_hoverLeave","_valueInsideDonut","valueInsideDonut","highlightedLegend","_getHighlightedLegend","legendValue","_toLocaleString","localeString","culture","_isChartEmpty","filter","d","length","_addDefaultColors","donutChartDataPoint","defaultColor","newX","newY","threshold","distance","Math","sqrt","pow","legendContainerHeight","hideLegend","legendContainerComputedStyles","getComputedStyle","getBoundingClientRect","parseFloat","marginTop","marginBottom","parentRef","container","currentContainerWidth","currentContainerHeight","shouldResize","points","classes","legendBars","donutMarginHorizontal","hideLabels","donutMarginVertical","outerRadius","min","innerRadius","focusAttributes","div","className","root","ref","rootElem","onMouseLeave","chartWrapper","svg","chart","aria-label","chartTitle","onFocusCallback","hoverOnCallback","hoverLeaveCallback","uniqText","onBlurCallback","activeArc","href","showLabelsInPercent","hideTooltip","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerDataPoint","customCalloutProps","calloutPropsPerDataPoint","isCartesian","role","style","opacity","displayName","defaultProps"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["DonutChart.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-bind */\nimport * as React from 'react';\nimport { Pie } from './Pie/index';\nimport { DonutChartProps } from './DonutChart.types';\nimport { useDonutChartStyles } from './useDonutChartStyles.styles';\nimport { ChartDataPoint } from '../../DonutChart';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { getColorFromToken, getNextColor } from '../../utilities/index';\nimport { Legend, Legends } from '../../index';\nimport { useId } from '@fluentui/react-utilities';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\n\nconst MIN_LEGEND_CONTAINER_HEIGHT = 40;\n\n// Create a DonutChart variant which uses these default styles and this styled subcomponent.\n/**\n * Donutchart component.\n * {@docCategory DonutChart}\n */\nexport const DonutChart: React.FunctionComponent<DonutChartProps> = React.forwardRef<HTMLDivElement, DonutChartProps>(\n (props, forwardedRef) => {\n const _rootElem = React.useRef<HTMLDivElement | null>(null);\n const _uniqText: string = useId('_Pie_');\n /* eslint-disable @typescript-eslint/no-explicit-any */\n let _calloutAnchorPoint: ChartDataPoint | null;\n let _emptyChartId: string | null;\n const legendContainer = React.useRef<HTMLDivElement | null>(null);\n const prevSize = React.useRef<{ width?: number; height?: number }>({});\n\n const [value, setValue] = React.useState<string | undefined>('');\n const [legend, setLegend] = React.useState<string | undefined>('');\n const [_width, setWidth] = React.useState<number | undefined>(props.width || 200);\n const [_height, setHeight] = React.useState<number | undefined>(props.height || 200);\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n const [color, setColor] = React.useState<string | undefined>('');\n const [xCalloutValue, setXCalloutValue] = React.useState<string>('');\n const [yCalloutValue, setYCalloutValue] = React.useState<string>('');\n const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n const [focusedArcId, setFocusedArcId] = React.useState<string>('');\n const [dataPointCalloutProps, setDataPointCalloutProps] = React.useState<ChartDataPoint | undefined>();\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n\n React.useEffect(() => {\n _fitParentContainer();\n }, []);\n\n React.useEffect(() => {\n if (prevSize.current.height !== props.height || prevSize.current.width !== props.width) {\n _fitParentContainer();\n }\n prevSize.current.height = props.height;\n prevSize.current.width = props.width;\n }, [props.width, props.height]);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: _rootElem.current,\n }),\n [],\n );\n\n function _elevateToMinimums(data: ChartDataPoint[]) {\n let sumOfData = 0;\n const minPercent = 0.01;\n const elevatedData: ChartDataPoint[] = [];\n data.forEach(item => {\n sumOfData += item.data!;\n });\n data.forEach(item => {\n elevatedData.push(\n minPercent * sumOfData > item.data! && item.data! > 0\n ? {\n ...item,\n data: minPercent * sumOfData,\n yAxisCalloutData:\n item.yAxisCalloutData === undefined ? item.data!.toLocaleString() : item.yAxisCalloutData,\n }\n : item,\n );\n });\n return elevatedData;\n }\n function _createLegends(chartData: ChartDataPoint[]): JSX.Element {\n const legendDataItems = chartData.map((point: ChartDataPoint, index: number) => {\n const color: string = point.color!;\n // mapping data to the format Legends component needs\n const legend: Legend = {\n title: point.legend!,\n color,\n action: () => {\n if (selectedLegend === point.legend) {\n setSelectedLegend('');\n } else {\n setSelectedLegend(point.legend!);\n }\n },\n hoverAction: () => {\n _handleChartMouseLeave();\n setActiveLegend(point.legend!);\n },\n onMouseOutAction: () => {\n setActiveLegend('');\n },\n };\n return legend;\n });\n const legends = (\n <Legends\n legends={legendDataItems}\n centerLegends\n overflowText={props.legendsOverflowText}\n {...props.legendProps}\n />\n );\n return legends;\n }\n\n function _focusCallback(data: ChartDataPoint, id: string, element: SVGPathElement): void {\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setValue(data.data!.toString());\n setLegend(data.legend);\n setColor(data.color!);\n setXCalloutValue(data.xAxisCalloutData!);\n setYCalloutValue(data.yAxisCalloutData!);\n setFocusedArcId(id);\n setDataPointCalloutProps(data);\n }\n\n function _hoverCallback(data: ChartDataPoint, e: React.MouseEvent<SVGPathElement>): void {\n if (_calloutAnchorPoint !== data) {\n _calloutAnchorPoint = data;\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setValue(data.data!.toString());\n setLegend(data.legend);\n setColor(data.color!);\n setXCalloutValue(data.xAxisCalloutData!);\n setYCalloutValue(data.yAxisCalloutData!);\n setDataPointCalloutProps(data);\n updatePosition(e.clientX, e.clientY);\n }\n }\n function _onBlur(): void {\n setFocusedArcId('');\n }\n\n function _hoverLeave(): void {\n /**/\n }\n\n function _handleChartMouseLeave() {\n _calloutAnchorPoint = null;\n setPopoverOpen(false);\n }\n\n function _valueInsideDonut(valueInsideDonut: string | number | undefined, data: ChartDataPoint[]) {\n const highlightedLegend = _getHighlightedLegend();\n if (valueInsideDonut !== undefined && (highlightedLegend !== '' || isPopoverOpen)) {\n let legendValue = valueInsideDonut;\n data!.map((point: ChartDataPoint, index: number) => {\n if (point.legend === highlightedLegend || (isPopoverOpen && point.legend === legend)) {\n legendValue = point.yAxisCalloutData ? point.yAxisCalloutData : point.data!;\n }\n return;\n });\n return legendValue;\n } else {\n return valueInsideDonut;\n }\n }\n\n function _toLocaleString(data: string | number | undefined) {\n const localeString = formatToLocaleString(data, props.culture);\n if (!localeString) {\n return data;\n }\n return localeString?.toString();\n }\n\n /**\n * This function returns\n * the selected legend if there is one\n * or the hovered legend if none of the legends is selected.\n * Note: This won't work in case of multiple legends selection.\n */\n function _getHighlightedLegend() {\n return selectedLegend || activeLegend;\n }\n\n function _isChartEmpty(): boolean {\n return !(\n props.data &&\n props.data.chartData &&\n props.data.chartData!.filter((d: ChartDataPoint) => d.data! > 0).length > 0\n );\n }\n\n function _addDefaultColors(donutChartDataPoint?: ChartDataPoint[]): ChartDataPoint[] {\n return donutChartDataPoint\n ? donutChartDataPoint.map((item, index) => {\n let defaultColor: string;\n if (typeof item.color === 'undefined') {\n defaultColor = getNextColor(index, 0);\n } else {\n defaultColor = getColorFromToken(item.color);\n }\n return { ...item, defaultColor };\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 /**\n * When screen resizes, along with screen, chart also auto adjusted.\n * This method used to adjust height and width of the charts.\n */\n function _fitParentContainer(): void {\n //_reqID = requestAnimationFrame(() => {\n let legendContainerHeight;\n if (props.hideLegend) {\n // If there is no legend, need not to allocate some space from total chart space.\n legendContainerHeight = 0;\n } else {\n const legendContainerComputedStyles = legendContainer.current && getComputedStyle(legendContainer.current);\n legendContainerHeight =\n ((legendContainer.current && legendContainer.current.getBoundingClientRect().height) ||\n MIN_LEGEND_CONTAINER_HEIGHT) +\n parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginTop) || '0') +\n parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginBottom) || '0');\n }\n if (props.parentRef || _rootElem.current) {\n const container = props.parentRef ? props.parentRef : _rootElem.current!;\n const currentContainerWidth = container.getBoundingClientRect().width;\n const currentContainerHeight =\n container.getBoundingClientRect().height > legendContainerHeight\n ? container.getBoundingClientRect().height\n : 200;\n const shouldResize =\n _width !== currentContainerWidth || _height !== currentContainerHeight - legendContainerHeight;\n if (shouldResize) {\n setWidth(currentContainerWidth);\n setHeight(currentContainerHeight - legendContainerHeight);\n }\n }\n //});\n }\n\n const { data, hideLegend = false } = props;\n const points = _addDefaultColors(data?.chartData);\n\n const classes = useDonutChartStyles(props);\n\n const legendBars = _createLegends(points);\n const donutMarginHorizontal = props.hideLabels ? 0 : 80;\n const donutMarginVertical = props.hideLabels ? 0 : 40;\n const outerRadius = Math.min(_width! - donutMarginHorizontal, _height! - donutMarginVertical) / 2;\n const chartData = _elevateToMinimums(points.filter((d: ChartDataPoint) => d.data! >= 0));\n const valueInsideDonut = props.innerRadius !== 0 ? _valueInsideDonut(props.valueInsideDonut!, chartData!) : '';\n const focusAttributes = useFocusableGroup();\n return !_isChartEmpty() ? (\n <div\n className={classes.root}\n ref={(rootElem: HTMLDivElement | null) => (_rootElem.current = rootElem)}\n onMouseLeave={_handleChartMouseLeave}\n >\n <div className={classes.chartWrapper} {...focusAttributes}>\n <svg className={classes.chart} aria-label={data?.chartTitle} width={_width} height={_height}>\n <Pie\n width={_width!}\n height={_height!}\n outerRadius={outerRadius}\n innerRadius={props.innerRadius!}\n data={chartData!}\n onFocusCallback={_focusCallback}\n hoverOnCallback={_hoverCallback}\n hoverLeaveCallback={_hoverLeave}\n uniqText={_uniqText}\n onBlurCallback={_onBlur}\n activeArc={_getHighlightedLegend()}\n focusedArcId={focusedArcId || ''}\n href={props.href!}\n valueInsideDonut={_toLocaleString(valueInsideDonut)}\n showLabelsInPercent={props.showLabelsInPercent}\n hideLabels={props.hideLabels}\n />\n </svg>\n </div>\n <ChartPopover\n xCalloutValue={xCalloutValue}\n yCalloutValue={yCalloutValue}\n culture={props.culture ?? 'en-us'}\n clickPosition={clickPosition}\n isPopoverOpen={!props.hideTooltip && isPopoverOpen}\n legend={legend!}\n YValue={value!}\n color={color}\n isCalloutForStack={false}\n customCallout={{\n customizedCallout: props.onRenderCalloutPerDataPoint\n ? props.onRenderCalloutPerDataPoint(dataPointCalloutProps!)\n : undefined,\n customCalloutProps: props.calloutPropsPerDataPoint\n ? props.calloutPropsPerDataPoint(dataPointCalloutProps!)\n : undefined,\n }}\n isCartesian={false}\n />\n {!hideLegend && (\n <div ref={(e: HTMLDivElement) => (legendContainer.current = e)} className={classes.legendContainer}>\n {legendBars}\n </div>\n )}\n </div>\n ) : (\n <div id={_emptyChartId!} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n },\n);\n\nDonutChart.displayName = 'DonutChart';\nDonutChart.defaultProps = {\n innerRadius: 0,\n hideLabels: true,\n};\n"],"names":["React","Pie","useDonutChartStyles","formatToLocaleString","getColorFromToken","getNextColor","Legends","useId","useFocusableGroup","ChartPopover","MIN_LEGEND_CONTAINER_HEIGHT","DonutChart","forwardRef","props","forwardedRef","_rootElem","useRef","_uniqText","_calloutAnchorPoint","_emptyChartId","legendContainer","prevSize","value","setValue","useState","legend","setLegend","_width","setWidth","width","_height","setHeight","height","activeLegend","setActiveLegend","color","setColor","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","selectedLegend","setSelectedLegend","focusedArcId","setFocusedArcId","dataPointCalloutProps","setDataPointCalloutProps","clickPosition","setClickPosition","x","y","isPopoverOpen","setPopoverOpen","useEffect","_fitParentContainer","current","useImperativeHandle","componentRef","chartContainer","_elevateToMinimums","data","sumOfData","minPercent","elevatedData","forEach","item","push","yAxisCalloutData","undefined","toLocaleString","_createLegends","chartData","legendDataItems","map","point","index","title","action","hoverAction","_handleChartMouseLeave","onMouseOutAction","legends","centerLegends","overflowText","legendsOverflowText","legendProps","_focusCallback","id","element","toString","xAxisCalloutData","_hoverCallback","e","updatePosition","clientX","clientY","_onBlur","_hoverLeave","_valueInsideDonut","valueInsideDonut","highlightedLegend","_getHighlightedLegend","legendValue","_toLocaleString","localeString","culture","_isChartEmpty","filter","d","length","_addDefaultColors","donutChartDataPoint","defaultColor","newX","newY","threshold","distance","Math","sqrt","pow","legendContainerHeight","hideLegend","legendContainerComputedStyles","getComputedStyle","getBoundingClientRect","parseFloat","marginTop","marginBottom","parentRef","container","currentContainerWidth","currentContainerHeight","shouldResize","points","classes","legendBars","donutMarginHorizontal","hideLabels","donutMarginVertical","outerRadius","min","innerRadius","focusAttributes","div","className","root","ref","rootElem","onMouseLeave","chartWrapper","svg","chart","aria-label","chartTitle","onFocusCallback","hoverOnCallback","hoverLeaveCallback","uniqText","onBlurCallback","activeArc","href","showLabelsInPercent","hideTooltip","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerDataPoint","customCalloutProps","calloutPropsPerDataPoint","isCartesian","role","style","opacity","displayName","defaultProps"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -2,8 +2,8 @@ import * as React from 'react';
|
|
|
2
2
|
import { useGaugeChartStyles } from './useGaugeChartStyles.styles';
|
|
3
3
|
import { select as d3Select } from 'd3-selection';
|
|
4
4
|
import { arc as d3Arc } from 'd3-shape';
|
|
5
|
-
import { Points, areArraysEqual,
|
|
6
|
-
import {
|
|
5
|
+
import { Points, areArraysEqual, formatScientificLimitWidth, getAccessibleDataObject, getColorFromToken, getNextColor, pointTypes, useRtl } from '../../utilities/index';
|
|
6
|
+
import { formatToLocaleString } from '@fluentui/chart-utilities';
|
|
7
7
|
import { SVGTooltipText } from '../../utilities/SVGTooltipText';
|
|
8
8
|
import { Legends, Shape } from '../Legends/index';
|
|
9
9
|
import { useFocusableGroup } from '@fluentui/react-tabster';
|
|
@@ -384,7 +384,7 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
|
|
|
384
384
|
}, /*#__PURE__*/ React.createElement("div", {
|
|
385
385
|
className: classes.calloutContentX,
|
|
386
386
|
...getAccessibleDataObject(calloutProps.xAxisCalloutAccessibilityData, 'text', false)
|
|
387
|
-
},
|
|
387
|
+
}, formatToLocaleString(calloutProps.hoverXValue, props.culture))), /*#__PURE__*/ React.createElement("div", {
|
|
388
388
|
className: classes.calloutInfoContainer,
|
|
389
389
|
style: yValueHoverSubCountsExists ? {
|
|
390
390
|
display: 'flex'
|
|
@@ -422,7 +422,7 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
|
|
|
422
422
|
};
|
|
423
423
|
const toDrawShape = xValue.index !== undefined && xValue.index !== -1;
|
|
424
424
|
const { culture } = props;
|
|
425
|
-
const yValue =
|
|
425
|
+
const yValue = formatToLocaleString(xValue.y, culture);
|
|
426
426
|
if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {
|
|
427
427
|
return /*#__PURE__*/ React.createElement("div", {
|
|
428
428
|
style: yValueHoverSubCountsExists ? marginStyle : {}
|
|
@@ -452,7 +452,7 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
|
|
|
452
452
|
className: classes.calloutlegendText
|
|
453
453
|
}, " ", xValue.legend), /*#__PURE__*/ React.createElement("div", {
|
|
454
454
|
className: classes.calloutContentY
|
|
455
|
-
},
|
|
455
|
+
}, formatToLocaleString(xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y || xValue.data, culture)))));
|
|
456
456
|
} else {
|
|
457
457
|
const subcounts = xValue.yAxisCalloutData;
|
|
458
458
|
return /*#__PURE__*/ React.createElement("div", {
|
|
@@ -468,9 +468,9 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
|
|
|
468
468
|
className: classes.calloutBlockContainer
|
|
469
469
|
}, /*#__PURE__*/ React.createElement("div", {
|
|
470
470
|
className: classes.calloutlegendText
|
|
471
|
-
}, " ",
|
|
471
|
+
}, " ", formatToLocaleString(subcountName, culture)), /*#__PURE__*/ React.createElement("div", {
|
|
472
472
|
className: classes.calloutContentY
|
|
473
|
-
},
|
|
473
|
+
}, formatToLocaleString(subcounts[subcountName], culture)));
|
|
474
474
|
}));
|
|
475
475
|
}
|
|
476
476
|
}
|
|
@@ -522,14 +522,14 @@ export const GaugeChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>
|
|
|
522
522
|
className: classes.limits,
|
|
523
523
|
role: "img",
|
|
524
524
|
"aria-label": `Min value: ${_minValue}`
|
|
525
|
-
},
|
|
525
|
+
}, formatScientificLimitWidth(_minValue)), /*#__PURE__*/ React.createElement("text", {
|
|
526
526
|
x: (_isRTL ? -1 : 1) * (_outerRadius + LABEL_OFFSET),
|
|
527
527
|
y: 0,
|
|
528
528
|
textAnchor: "start",
|
|
529
529
|
className: classes.limits,
|
|
530
530
|
role: "img",
|
|
531
531
|
"aria-label": `Max value: ${_maxValue}`
|
|
532
|
-
},
|
|
532
|
+
}, formatScientificLimitWidth(_maxValue))), arcs.map((arc, index)=>{
|
|
533
533
|
const segment = _segments[arc.segmentIndex];
|
|
534
534
|
return /*#__PURE__*/ React.createElement(React.Fragment, {
|
|
535
535
|
key: index
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["GaugeChart.tsx"],"sourcesContent":["import * 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 formatValueWithSIPrefix,\n getAccessibleDataObject,\n getColorFromToken,\n getNextColor,\n pointTypes,\n useRtl,\n} from '../../utilities/index';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport { SVGTooltipText } from '../../utilities/SVGTooltipText';\nimport { Legend, LegendShape, Legends, Shape } from '../Legends/index';\nimport { GaugeChartVariant, GaugeValueFormat, GaugeChartProps, GaugeChartSegment } from './GaugeChart.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\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) => {\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) => {\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 _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 ? 24 : 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 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 if (prevProps.height !== props.height || prevProps.width !== props.width) {\n setWidth(props.width!);\n setHeight(props.height!);\n }\n }\n prevPropsRef.current = props;\n }, [props]);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: _rootElem.current,\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} style={{ width: props.width }}>\n <Legends\n legends={legends}\n centerLegends\n {...props.legendProps}\n // eslint-disable-next-line react/jsx-no-bind\n onChange={_onLegendSelectionChange}\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 {convertToLocaleString(calloutProps!.hoverXValue, props.culture)}\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 = convertToLocaleString(xValue.y, culture);\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 {convertToLocaleString(\n xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y || xValue.data,\n culture,\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}> {convertToLocaleString(subcountName, culture)}</div>\n <div className={classes.calloutContentY}>\n {convertToLocaleString(subcounts[subcountName], culture)}\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)} {...focusAttributes}>\n <svg\n className={classes.chart}\n style={{ width: props.width, height: props.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 {formatValueWithSIPrefix(_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 {formatValueWithSIPrefix(_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 data-is-focusable={_legendHighlighted(segment.legend) || _noLegendHighlighted()}\n tabIndex={segment.legend !== '' ? 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 {_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","formatValueWithSIPrefix","getAccessibleDataObject","getColorFromToken","getNextColor","pointTypes","useRtl","convertToLocaleString","SVGTooltipText","Legends","Shape","useFocusableGroup","ChartPopover","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","_getMargins","hideMinMax","chartTitle","sublabel","left","right","top","bottom","_margins","_legendsHeight","hideLegend","_rootElem","useRef","_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","prevProps","useImperativeHandle","componentRef","chartContainer","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","style","centerLegends","onChange","_onLegendSelectionChange","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","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","svg","chart","onMouseLeave","textAnchor","aria-hidden","limits","Fragment","opacity","ariaLabel","tabIndex","textProps","wrapContent","dominantBaseline","hideTooltip","customCallout","customizedCallout","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["GaugeChart.tsx"],"sourcesContent":["import * 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 } from '../Legends/index';\nimport { GaugeChartVariant, GaugeValueFormat, GaugeChartProps, GaugeChartSegment } from './GaugeChart.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\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) => {\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) => {\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 _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 ? 24 : 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 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 if (prevProps.height !== props.height || prevProps.width !== props.width) {\n setWidth(props.width!);\n setHeight(props.height!);\n }\n }\n prevPropsRef.current = props;\n }, [props]);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: _rootElem.current,\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} style={{ width: props.width }}>\n <Legends\n legends={legends}\n centerLegends\n {...props.legendProps}\n // eslint-disable-next-line react/jsx-no-bind\n onChange={_onLegendSelectionChange}\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)}\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);\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 {formatToLocaleString(\n xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y || xValue.data,\n culture,\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}> {formatToLocaleString(subcountName, culture)}</div>\n <div className={classes.calloutContentY}>\n {formatToLocaleString(subcounts[subcountName], culture)}\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)} {...focusAttributes}>\n <svg\n className={classes.chart}\n style={{ width: props.width, height: props.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 data-is-focusable={_legendHighlighted(segment.legend) || _noLegendHighlighted()}\n tabIndex={segment.legend !== '' ? 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 {_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","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","_getMargins","hideMinMax","chartTitle","sublabel","left","right","top","bottom","_margins","_legendsHeight","hideLegend","_rootElem","useRef","_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","prevProps","useImperativeHandle","componentRef","chartContainer","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","style","centerLegends","onChange","_onLegendSelectionChange","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","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","svg","chart","onMouseLeave","textAnchor","aria-hidden","limits","Fragment","opacity","ariaLabel","tabIndex","textProps","wrapContent","dominantBaseline","hideTooltip","customCallout","customizedCallout","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import { max as d3Max } from 'd3-array';
|
|
|
4
4
|
import { select as d3Select } from 'd3-selection';
|
|
5
5
|
import { scaleBand as d3ScaleBand, scaleLinear as d3ScaleLinear } from 'd3-scale';
|
|
6
6
|
import { useId } from '@fluentui/react-utilities';
|
|
7
|
-
import { ChartTypes, getAccessibleDataObject, tooltipOfXAxislabels, XAxisTypes, getTypeOfAxis,
|
|
7
|
+
import { ChartTypes, getAccessibleDataObject, tooltipOfXAxislabels, XAxisTypes, getTypeOfAxis, formatScientificLimitWidth, getScalePadding, getBarWidth, isScalePaddingDefined, getNextColor, areArraysEqual, calculateLongestLabelWidth, useRtl } from '../../utilities/index';
|
|
8
8
|
import { CartesianChart, Legends, DataVizPalette, getColorFromToken } from '../../index';
|
|
9
9
|
const MIN_DOMAIN_MARGIN = 8;
|
|
10
10
|
const X1_INNER_PADDING = 0.1;
|
|
@@ -332,7 +332,7 @@ export const GroupedVerticalBarChart = /*#__PURE__*/ React.forwardRef((props = {
|
|
|
332
332
|
textAnchor: "middle",
|
|
333
333
|
className: classes.barLabel,
|
|
334
334
|
"aria-hidden": true
|
|
335
|
-
},
|
|
335
|
+
}, formatScientificLimitWidth(pointData.data)));
|
|
336
336
|
}
|
|
337
337
|
});
|
|
338
338
|
// Used to display tooltip at x axis labels.
|