@fluentui/react-charts 0.0.0-nightly-20250603-0406.1 → 0.0.0-nightly-20250605-0406.1
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 +15 -15
- 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 +13 -13
- 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":["GroupedVerticalBarChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useGroupedVerticalBarChartStyles_unstable } from './useGroupedVerticalBarChartStyles.styles';\nimport { max as d3Max } from 'd3-array';\nimport { select as d3Select } from 'd3-selection';\nimport { Axis as D3Axis } from 'd3-axis';\nimport { scaleBand as d3ScaleBand, scaleLinear as d3ScaleLinear } from 'd3-scale';\n\nimport { useId } from '@fluentui/react-utilities';\nimport {\n ChartTypes,\n IAxisData,\n getAccessibleDataObject,\n tooltipOfXAxislabels,\n XAxisTypes,\n getTypeOfAxis,\n formatValueWithSIPrefix,\n getScalePadding,\n getBarWidth,\n isScalePaddingDefined,\n getNextColor,\n areArraysEqual,\n calculateLongestLabelWidth,\n useRtl,\n} from '../../utilities/index';\n\nimport {\n AccessibilityProps,\n CartesianChart,\n Margins,\n Legend,\n RefArrayData,\n GroupedVerticalBarChartProps,\n GroupedVerticalBarChartData,\n GVBarChartSeriesPoint,\n Legends,\n YValueHover,\n DataVizPalette,\n getColorFromToken,\n ChartPopoverProps,\n Chart,\n} from '../../index';\n\ntype StringAxis = D3Axis<string>;\ntype NumericAxis = D3Axis<number | { valueOf(): number }>;\n\nconst MIN_DOMAIN_MARGIN = 8;\nconst X1_INNER_PADDING = 0.1;\n// x1_inner_padding = space_between_bars / (space_between_bars + bar_width)\n// => space_between_bars = (x1_inner_padding / (1 - x1_inner_padding)) * bar_width\n/** Rate at which the space between the bars in a group changes wrt the bar width */\nconst BAR_GAP_RATE = X1_INNER_PADDING / (1 - X1_INNER_PADDING);\n\n// This interface used for - While forming datapoints from given prop \"data\" in code\ninterface GVDataPoint {\n [key: string]: number | string;\n}\n\n// While forming datapoints from given prop \"data\" in code. These datapoints are used for to draw graph easily.\ninterface GVSingleDataPoint {\n [key: string]: GVDataPoint;\n}\n\nexport const GroupedVerticalBarChart: React.FC<GroupedVerticalBarChartProps> = React.forwardRef<\n HTMLDivElement,\n GroupedVerticalBarChartProps\n>((props = { maxBarWidth: 24 }, forwardedRef) => {\n const _tooltipId: string = useId('GVBCTooltipId_');\n const _emptyChartId: string = useId('_GVBC_empty');\n const _useRtl: boolean = useRtl();\n let _domainMargin: number = MIN_DOMAIN_MARGIN;\n let _dataset: GVDataPoint[] = [];\n let _keys: string[] = [];\n let _xAxisLabels: string[] = [];\n let _datasetForBars: any[] = [];\n let _margins: Margins = { top: 0, right: 0, bottom: 0, left: 0 };\n let _groupedVerticalBarGraph: JSX.Element[] = [];\n let _refArray: RefArrayData[] = [];\n let _yMax: number = 0;\n let _calloutAnchorPoint: GVBarChartSeriesPoint | null = null;\n let _barWidth: number = 0;\n let _groupWidth: number = 0;\n let _xAxisInnerPadding: number = 0;\n let _xAxisOuterPadding: number = 0;\n const cartesianChartRef = React.useRef<Chart>(null);\n\n const [color, setColor] = React.useState<string>('');\n const [dataForHoverCard, setDataForHoverCard] = React.useState<number>(0);\n const [selectedLegends, setSelectedLegends] = React.useState<string[]>(props.legendProps?.selectedLegends || []);\n const [xCalloutValue, setXCalloutValue] = React.useState<string>('');\n const [yCalloutValue, setYCalloutValue] = React.useState<string>('');\n const [YValueHover, setYValueHover] = React.useState<YValueHover[]>([]);\n const [hoverXValue, setHoverXValue] = React.useState<string>('');\n const [calloutLegend, setCalloutLegend] = React.useState<string>('');\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n const [callOutAccessibilityData, setCallOutAccessibilityData] = React.useState<AccessibilityProps | undefined>(\n undefined,\n );\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n const classes = useGroupedVerticalBarChartStyles_unstable(props);\n\n React.useEffect(() => {\n if (!areArraysEqual(props.legendProps?.selectedLegends, selectedLegends)) {\n setSelectedLegends(props.legendProps?.selectedLegends || []);\n }\n }, [props.legendProps?.selectedLegends]);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: cartesianChartRef.current?.chartContainer ?? null,\n }),\n [],\n );\n\n const _adjustProps = () => {\n _barWidth = getBarWidth(props.barWidth, props.maxBarWidth);\n // x0_inner_padding = space_between_groups / (space_between_groups + group_width)\n // space_between_groups = 2 * bar_width\n // group_width = keys.length * bar_width + (keys.length - 1) * space_between_bars\n _xAxisInnerPadding = getScalePadding(\n props.xAxisInnerPadding,\n undefined,\n 2 / (2 + keys.length + (keys.length - 1) * BAR_GAP_RATE),\n );\n _xAxisOuterPadding = getScalePadding(props.xAxisOuterPadding);\n };\n\n const _createDataset = (points: GroupedVerticalBarChartData[]) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const datasetForBars: any = [];\n const dataset: GVDataPoint[] = [];\n\n points.forEach((point: GroupedVerticalBarChartData, index: number) => {\n const singleDatasetPoint: GVDataPoint = {};\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const singleDatasetPointForBars: any = {};\n const singleDataSeries: GVBarChartSeriesPoint[] = [];\n\n point.series.forEach((seriesPoint: GVBarChartSeriesPoint, seriesIndex) => {\n singleDatasetPoint[seriesPoint.key] = seriesPoint.data;\n singleDatasetPointForBars[seriesPoint.key] = {\n ...seriesPoint,\n };\n singleDataSeries.push(seriesPoint);\n });\n\n singleDatasetPointForBars.xAxisPoint = point.name;\n singleDatasetPointForBars.indexNum = index;\n singleDatasetPointForBars.groupSeries = singleDataSeries;\n singleDatasetPointForBars.stackCallOutAccessibilityData = point.stackCallOutAccessibilityData;\n datasetForBars.push(singleDatasetPointForBars);\n dataset.push(singleDatasetPoint);\n });\n _dataset = dataset;\n return datasetForBars;\n };\n\n const _createDataSetOfGVBC = (points: GroupedVerticalBarChartData[]) => {\n const keys: string[] = [];\n const xAxisLabels: string[] = points.map(singlePoint => singlePoint.name);\n points[0].series.forEach((singleKey: GVBarChartSeriesPoint) => {\n keys.push(singleKey.key);\n });\n const datasetForBars = _createDataset(points);\n return {\n keys,\n xAxisLabels,\n datasetForBars,\n };\n };\n\n const onLegendSelectionChange = (\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 const _getLegendData = (points: GroupedVerticalBarChartData[]): JSX.Element => {\n const data = points;\n const defaultPalette: string[] = [\n getColorFromToken(DataVizPalette.color1),\n getColorFromToken(DataVizPalette.color2),\n getColorFromToken(DataVizPalette.color3),\n getColorFromToken(DataVizPalette.color4),\n getColorFromToken(DataVizPalette.color5),\n ];\n const actions: Legend[] = [];\n\n data.forEach((singleChartData: GroupedVerticalBarChartData) => {\n singleChartData.series.forEach((point: GVBarChartSeriesPoint) => {\n let color: string = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n const checkSimilarLegends = actions.filter((leg: Legend) => leg.title === point.legend && leg.color === color);\n if (checkSimilarLegends!.length > 0) {\n return;\n }\n const legend: Legend = {\n title: point.legend,\n color,\n hoverAction: () => {\n _handleChartMouseLeave();\n _onLegendHover(point.legend);\n },\n onMouseOutAction: () => {\n _onLegendLeave();\n },\n };\n\n actions.push(legend);\n });\n });\n return (\n <Legends\n legends={actions}\n enabledWrapLines={props.enabledLegendsWrapLines}\n overflowText={props.legendsOverflowText}\n {...props.legendProps}\n onChange={onLegendSelectionChange}\n />\n );\n };\n\n const points = props.data;\n const { keys, xAxisLabels, datasetForBars } = _createDataSetOfGVBC(points!);\n _keys = keys;\n _xAxisLabels = xAxisLabels;\n _datasetForBars = datasetForBars;\n const _xAxisType: XAxisTypes = getTypeOfAxis(points![0].name, true) as XAxisTypes;\n const legends: JSX.Element = _getLegendData(points!);\n _adjustProps();\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const yMax = d3Max(_dataset, (point: any) => d3Max(_keys, (key: string) => point[key]));\n _yMax = Math.max(yMax, props.yMaxValue || 0);\n\n const calloutProps: ChartPopoverProps = {\n clickPosition,\n isPopoverOpen,\n color,\n legend: calloutLegend,\n XValue: xCalloutValue,\n YValue: yCalloutValue ? yCalloutValue : dataForHoverCard,\n YValueHover,\n hoverXValue,\n culture: props.culture ?? 'en-us',\n isCartesian: true,\n ...props.calloutProps,\n ...getAccessibleDataObject(callOutAccessibilityData, 'text', false),\n };\n const tickParams = {\n tickValues: props.tickValues!,\n tickFormat: props.tickFormat!,\n };\n\n const _getGraphData = (\n xScale: StringAxis | NumericAxis,\n yScale: NumericAxis,\n containerHeight: number,\n containerWidth: number,\n xElement?: SVGElement | null,\n ) => {\n const xScale0 = _createX0Scale(containerWidth);\n\n // Setting the bar width here is safe because there are no dependencies earlier in the code\n // that rely on the width of bars in vertical bar charts with string x-axis.\n _barWidth = getBarWidth(\n props.barWidth,\n props.maxBarWidth,\n xScale0.bandwidth() / (_keys.length + (_keys.length - 1) * BAR_GAP_RATE),\n );\n _groupWidth = (_keys.length + (_keys.length - 1) * BAR_GAP_RATE) * _barWidth;\n\n const xScale1 = _createX1Scale();\n const allGroupsBars: JSX.Element[] = [];\n _datasetForBars.forEach((singleSet: GVSingleDataPoint) => {\n allGroupsBars.push(_buildGraph(singleSet, xScale0, xScale1, containerHeight, xElement!));\n });\n _groupedVerticalBarGraph = allGroupsBars;\n };\n\n const _getMargins = (margins: Margins) => {\n _margins = margins;\n };\n\n const _getOpacity = (legendTitle: string): string => {\n const opacity = _legendHighlighted(legendTitle) || _noLegendHighlighted() ? '' : '0.1';\n return opacity;\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 onBarHover = (\n pointData: GVBarChartSeriesPoint,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupData: any,\n mouseEvent: React.MouseEvent<SVGElement>,\n ): void => {\n mouseEvent.persist();\n if (_calloutAnchorPoint !== pointData) {\n _calloutAnchorPoint = pointData;\n updatePosition(mouseEvent.clientX, mouseEvent.clientY);\n setPopoverOpen(_noLegendHighlighted() || _legendHighlighted(pointData.legend));\n setCalloutLegend(pointData.legend);\n setDataForHoverCard(pointData.data);\n setColor(pointData.color);\n setXCalloutValue(pointData.xAxisCalloutData!);\n setYCalloutValue(pointData.yAxisCalloutData!);\n setCallOutAccessibilityData(\n props.isCalloutForStack ? groupData.stackCallOutAccessibilityData : pointData.callOutAccessibilityData,\n );\n setYValueHover(groupData.groupSeries);\n setHoverXValue(pointData.xAxisCalloutData!);\n }\n };\n\n const _onBarLeave = (): void => {\n /**/\n };\n\n const _handleChartMouseLeave = (): void => {\n _calloutAnchorPoint = null;\n setPopoverOpen(false);\n };\n\n const onBarFocus = (\n pointData: GVBarChartSeriesPoint,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupData: any,\n refArrayIndexNumber: number,\n ): void => {\n _refArray.forEach((obj: RefArrayData, index: number) => {\n if (obj.index === pointData.legend && refArrayIndexNumber === index) {\n setPopoverOpen(_noLegendHighlighted() || _legendHighlighted(pointData.legend));\n setCalloutLegend(pointData.legend);\n setDataForHoverCard(pointData.data);\n setColor(pointData.color);\n setXCalloutValue(pointData.xAxisCalloutData!);\n setYCalloutValue(pointData.yAxisCalloutData!);\n setCallOutAccessibilityData(\n props.isCalloutForStack ? groupData.stackCallOutAccessibilityData : pointData.callOutAccessibilityData,\n );\n setYValueHover(groupData.groupSeries);\n setHoverXValue(pointData.xAxisCalloutData!);\n }\n });\n };\n\n const _refCallback = (element: SVGRectElement, legendTitle: string, refIndexNumber: number): void => {\n _refArray[refIndexNumber] = { index: legendTitle, refElement: element };\n };\n\n const _buildGraph = (\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n singleSet: any,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n xScale0: any,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n xScale1: any,\n containerHeight: number,\n xElement: SVGElement,\n ): JSX.Element => {\n const singleGroup: JSX.Element[] = [];\n const barLabelsForGroup: JSX.Element[] = [];\n\n const yBarScale = d3ScaleLinear()\n .domain([0, yMax])\n .range([0, containerHeight! - _margins.bottom! - _margins.top!]);\n\n const tempDataSet = Object.keys(datasetForBars[0]).splice(0, keys.length);\n tempDataSet.forEach((datasetKey: string, index: number) => {\n const refIndexNumber = singleSet.indexNum * tempDataSet.length + index;\n const pointData = singleSet[datasetKey];\n // To align the centers of the generated bandwidth and the calculated one when they differ,\n // use the following addend.\n const xPoint = xScale1(datasetKey) + (xScale1.bandwidth() - _barWidth) / 2;\n const yPoint = Math.max(containerHeight! - _margins.bottom! - yBarScale(pointData.data), 0);\n const startColor = pointData.color ? pointData.color : getNextColor(index, 0);\n\n // Not rendering data with 0.\n pointData.data &&\n singleGroup.push(\n <React.Fragment key={`${singleSet.indexNum}-${index}`}>\n <rect\n className={classes.opacityChangeOnHover}\n height={Math.max(yBarScale(pointData.data), 0)}\n width={_barWidth}\n x={xPoint}\n y={yPoint}\n data-is-focusable={!props.hideTooltip && (_legendHighlighted(pointData.legend) || _noLegendHighlighted())}\n opacity={_getOpacity(pointData.legend)}\n ref={(e: SVGRectElement | null) => {\n _refCallback(e!, pointData.legend, refIndexNumber);\n }}\n fill={startColor}\n rx={0}\n onMouseOver={onBarHover.bind(null, pointData, singleSet)}\n onMouseMove={onBarHover.bind(null, pointData, singleSet)}\n onMouseOut={_onBarLeave}\n onFocus={onBarFocus.bind(null, pointData, singleSet, refIndexNumber)}\n onBlur={_onBarLeave}\n onClick={pointData.onClick}\n aria-label={getAriaLabel(pointData, singleSet.xAxisPoint)}\n tabIndex={pointData.legend !== '' ? 0 : undefined}\n role=\"img\"\n />\n </React.Fragment>,\n );\n if (\n pointData.data &&\n !props.hideLabels &&\n _barWidth >= 16 &&\n (_legendHighlighted(pointData.legend) || _noLegendHighlighted())\n ) {\n barLabelsForGroup.push(\n <text\n key={`${singleSet.indexNum}-${index}`}\n x={xPoint + _barWidth / 2}\n y={yPoint - 6}\n textAnchor=\"middle\"\n className={classes.barLabel}\n aria-hidden={true}\n >\n {formatValueWithSIPrefix(pointData.data)}\n </text>,\n );\n }\n });\n // Used to display tooltip at x axis labels.\n if (!props.wrapXAxisLables && props.showXAxisLablesTooltip) {\n const xAxisElement = d3Select(xElement).call(xScale0);\n try {\n document.getElementById(_tooltipId) && document.getElementById(_tooltipId)!.remove();\n // eslint-disable-next-line no-empty\n } catch (e) {}\n const tooltipProps = {\n tooltipCls: classes.tooltip!,\n id: _tooltipId,\n xAxis: xAxisElement,\n };\n xAxisElement && tooltipOfXAxislabels(tooltipProps);\n }\n return (\n <g\n key={singleSet.indexNum}\n transform={`translate(${xScale0(singleSet.xAxisPoint) + (xScale0.bandwidth() - _groupWidth) / 2}, 0)`}\n >\n {singleGroup}\n {barLabelsForGroup}\n </g>\n );\n };\n\n // For grouped vertical bar chart, First need to define total scale (from start to end)\n // From that need to define scale for single group of bars - done by createX1Scale\n const _createX0Scale = (containerWidth: number) => {\n const x0Axis = d3ScaleBand()\n .domain(xAxisLabels)\n .range(\n _useRtl\n ? [containerWidth! - _margins.right! - _domainMargin, _margins.left! + _domainMargin]\n : [_margins.left! + _domainMargin, containerWidth! - _margins.right! - _domainMargin],\n )\n .paddingInner(_xAxisInnerPadding)\n .paddingOuter(_xAxisOuterPadding);\n return x0Axis;\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _createX1Scale = (): any => {\n return (\n d3ScaleBand()\n .domain(keys)\n // When there is only one group, xScale0 adds padding around it,\n // causing the bandwidth to become smaller than the actual group width.\n // So to render bars in the group correctly, use groupWidth instead of the generated scale bandwidth.\n .range(_useRtl ? [_groupWidth, 0] : [0, _groupWidth])\n .paddingInner(X1_INNER_PADDING)\n );\n };\n\n const _onLegendHover = (legendTitle: string): void => {\n setActiveLegend(legendTitle);\n };\n\n const _onLegendLeave = (): void => {\n setActiveLegend('');\n };\n\n const _getAxisData = React.useCallback(\n (yAxisData: IAxisData) => {\n if (yAxisData && yAxisData.yAxisDomainValues.length) {\n const { yAxisDomainValues: domainValue } = yAxisData;\n _yMax = Math.max(domainValue[domainValue.length - 1], props.yMaxValue || 0);\n }\n },\n [props.yMaxValue],\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 const _legendHighlighted = (legendTitle: string) => {\n return _getHighlightedLegend().includes(legendTitle!);\n };\n\n /**\n * This function checks if none of the legends is selected or hovered.\n */\n const _noLegendHighlighted = () => {\n return _getHighlightedLegend().length === 0;\n };\n\n const _getHighlightedLegend = () => {\n return selectedLegends.length > 0 ? selectedLegends : activeLegend ? [activeLegend] : [];\n };\n\n const getAriaLabel = (point: GVBarChartSeriesPoint, xAxisPoint: string): string => {\n const xValue = point.xAxisCalloutData || xAxisPoint;\n const legend = point.legend;\n const yValue = point.yAxisCalloutData || point.data;\n return point.callOutAccessibilityData?.ariaLabel || `${xValue}. ${legend}, ${yValue}.`;\n };\n\n const _getDomainMargins = (containerWidth: number): Margins => {\n /** Total width available to render the bars */\n const totalWidth = containerWidth - (_margins.left! + MIN_DOMAIN_MARGIN) - (_margins.right! + MIN_DOMAIN_MARGIN);\n /** Rate at which the space between the groups changes wrt the group width */\n const groupGapRate = _xAxisInnerPadding / (1 - _xAxisInnerPadding);\n\n if (_xAxisType === XAxisTypes.StringAxis) {\n if (isScalePaddingDefined(props.xAxisOuterPadding)) {\n // Setting the domain margin for string x-axis to 0 because the xAxisOuterPadding prop is now available\n // to adjust the space before the first group and after the last group.\n _domainMargin = 0;\n } else if (props.barWidth !== 'auto') {\n // Update the bar width so that when CartesianChart rerenders,\n // the following calculations don't use the previous bar width.\n _barWidth = getBarWidth(props.barWidth, props.maxBarWidth);\n const groupWidth = (keys.length + (keys.length - 1) * BAR_GAP_RATE) * _barWidth;\n /** Total width required to render the groups. Directly proportional to group width */\n const reqWidth = (xAxisLabels.length + (xAxisLabels.length - 1) * groupGapRate) * groupWidth;\n\n if (totalWidth >= reqWidth) {\n // Center align the chart by setting equal left and right margins for domain\n _domainMargin = MIN_DOMAIN_MARGIN + (totalWidth - reqWidth) / 2;\n }\n } else if (props.mode === 'plotly' && xAxisLabels.length > 1) {\n // Calculate the remaining width after rendering groups at their maximum allowable width\n const groupBandwidth = totalWidth / (xAxisLabels.length + (xAxisLabels.length - 1) * groupGapRate);\n const barBandwidth = groupBandwidth / (keys.length + (keys.length - 1) * BAR_GAP_RATE);\n const barWidth = getBarWidth(props.barWidth, props.maxBarWidth, barBandwidth);\n const groupWidth = (keys.length + (keys.length - 1) * BAR_GAP_RATE) * barWidth;\n let reqWidth = (xAxisLabels.length + (xAxisLabels.length - 1) * groupGapRate) * groupWidth;\n const margin1 = (totalWidth - reqWidth) / 2;\n\n // Calculate the remaining width after accounting for the space required to render x-axis labels\n const step = calculateLongestLabelWidth(xAxisLabels) + 20;\n reqWidth = (xAxisLabels.length - _xAxisInnerPadding) * step;\n const margin2 = (totalWidth - reqWidth) / 2;\n\n _domainMargin = MIN_DOMAIN_MARGIN + Math.max(0, Math.min(margin1, margin2));\n }\n }\n\n return {\n ..._margins,\n left: _margins.left! + _domainMargin,\n right: _margins.right! + _domainMargin,\n };\n };\n\n const _isChartEmpty = (): boolean => {\n return !(\n props.data &&\n props.data.length > 0 &&\n props.data.filter((item: GroupedVerticalBarChartData) => item.series.length).length > 0\n );\n };\n\n const _getChartTitle = (): string => {\n return (\n (props.chartTitle ? `${props.chartTitle}. ` : '') +\n `Vertical bar chart with ${_xAxisLabels.length} groups of ${_keys.length} bars each. `\n );\n };\n\n return !_isChartEmpty() ? (\n <CartesianChart\n {...props}\n chartTitle={_getChartTitle()}\n points={_datasetForBars}\n chartType={ChartTypes.GroupedVerticalBarChart}\n calloutProps={calloutProps}\n legendBars={legends}\n xAxisType={_xAxisType}\n datasetForXAxisDomain={_xAxisLabels}\n tickParams={tickParams}\n tickPadding={props.tickPadding || 5}\n maxOfYVal={_yMax}\n getmargins={_getMargins}\n getGraphData={_getGraphData}\n getAxisData={_getAxisData}\n onChartMouseLeave={_handleChartMouseLeave}\n getDomainMargins={_getDomainMargins}\n {...(_xAxisType === XAxisTypes.StringAxis && {\n xAxisInnerPadding: _xAxisInnerPadding,\n xAxisOuterPadding: _xAxisOuterPadding,\n })}\n barwidth={_barWidth}\n componentRef={cartesianChartRef}\n /* eslint-disable react/jsx-no-bind */\n children={() => {\n return <g>{_groupedVerticalBarGraph}</g>;\n }}\n />\n ) : (\n <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n});\nGroupedVerticalBarChart.displayName = 'GroupedVerticalBarChart';\n"],"names":["React","useGroupedVerticalBarChartStyles_unstable","max","d3Max","select","d3Select","scaleBand","d3ScaleBand","scaleLinear","d3ScaleLinear","useId","ChartTypes","getAccessibleDataObject","tooltipOfXAxislabels","XAxisTypes","getTypeOfAxis","formatValueWithSIPrefix","getScalePadding","getBarWidth","isScalePaddingDefined","getNextColor","areArraysEqual","calculateLongestLabelWidth","useRtl","CartesianChart","Legends","DataVizPalette","getColorFromToken","MIN_DOMAIN_MARGIN","X1_INNER_PADDING","BAR_GAP_RATE","GroupedVerticalBarChart","forwardRef","props","maxBarWidth","forwardedRef","_tooltipId","_emptyChartId","_useRtl","_domainMargin","_dataset","_keys","_xAxisLabels","_datasetForBars","_margins","top","right","bottom","left","_groupedVerticalBarGraph","_refArray","_yMax","_calloutAnchorPoint","_barWidth","_groupWidth","_xAxisInnerPadding","_xAxisOuterPadding","cartesianChartRef","useRef","color","setColor","useState","dataForHoverCard","setDataForHoverCard","selectedLegends","setSelectedLegends","legendProps","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","YValueHover","setYValueHover","hoverXValue","setHoverXValue","calloutLegend","setCalloutLegend","activeLegend","setActiveLegend","callOutAccessibilityData","setCallOutAccessibilityData","undefined","clickPosition","setClickPosition","x","y","isPopoverOpen","setPopoverOpen","classes","useEffect","useImperativeHandle","componentRef","chartContainer","current","_adjustProps","barWidth","xAxisInnerPadding","keys","length","xAxisOuterPadding","_createDataset","points","datasetForBars","dataset","forEach","point","index","singleDatasetPoint","singleDatasetPointForBars","singleDataSeries","series","seriesPoint","seriesIndex","key","data","push","xAxisPoint","name","indexNum","groupSeries","stackCallOutAccessibilityData","_createDataSetOfGVBC","xAxisLabels","map","singlePoint","singleKey","onLegendSelectionChange","event","currentLegend","canSelectMultipleLegends","slice","onChange","_getLegendData","defaultPalette","color1","color2","color3","color4","color5","actions","singleChartData","Math","floor","random","checkSimilarLegends","filter","leg","title","legend","hoverAction","_handleChartMouseLeave","_onLegendHover","onMouseOutAction","_onLegendLeave","legends","enabledWrapLines","enabledLegendsWrapLines","overflowText","legendsOverflowText","_xAxisType","yMax","yMaxValue","calloutProps","XValue","YValue","culture","isCartesian","tickParams","tickValues","tickFormat","_getGraphData","xScale","yScale","containerHeight","containerWidth","xElement","xScale0","_createX0Scale","bandwidth","xScale1","_createX1Scale","allGroupsBars","singleSet","_buildGraph","_getMargins","margins","_getOpacity","legendTitle","opacity","_legendHighlighted","_noLegendHighlighted","updatePosition","newX","newY","threshold","distance","sqrt","pow","onBarHover","pointData","groupData","mouseEvent","persist","clientX","clientY","xAxisCalloutData","yAxisCalloutData","isCalloutForStack","_onBarLeave","onBarFocus","refArrayIndexNumber","obj","_refCallback","element","refIndexNumber","refElement","singleGroup","barLabelsForGroup","yBarScale","domain","range","tempDataSet","Object","splice","datasetKey","xPoint","yPoint","startColor","Fragment","rect","className","opacityChangeOnHover","height","width","data-is-focusable","hideTooltip","ref","e","fill","rx","onMouseOver","bind","onMouseMove","onMouseOut","onFocus","onBlur","onClick","aria-label","getAriaLabel","tabIndex","role","hideLabels","text","textAnchor","barLabel","aria-hidden","wrapXAxisLables","showXAxisLablesTooltip","xAxisElement","call","document","getElementById","remove","tooltipProps","tooltipCls","tooltip","id","xAxis","g","transform","x0Axis","paddingInner","paddingOuter","_getAxisData","useCallback","yAxisData","yAxisDomainValues","domainValue","_getHighlightedLegend","includes","xValue","yValue","ariaLabel","_getDomainMargins","totalWidth","groupGapRate","StringAxis","groupWidth","reqWidth","mode","groupBandwidth","barBandwidth","margin1","step","margin2","min","_isChartEmpty","item","_getChartTitle","chartTitle","chartType","legendBars","xAxisType","datasetForXAxisDomain","tickPadding","maxOfYVal","getmargins","getGraphData","getAxisData","onChartMouseLeave","getDomainMargins","barwidth","children","div","style","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["GroupedVerticalBarChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useGroupedVerticalBarChartStyles_unstable } from './useGroupedVerticalBarChartStyles.styles';\nimport { max as d3Max } from 'd3-array';\nimport { select as d3Select } from 'd3-selection';\nimport { Axis as D3Axis } from 'd3-axis';\nimport { scaleBand as d3ScaleBand, scaleLinear as d3ScaleLinear } from 'd3-scale';\n\nimport { useId } from '@fluentui/react-utilities';\nimport {\n ChartTypes,\n IAxisData,\n getAccessibleDataObject,\n tooltipOfXAxislabels,\n XAxisTypes,\n getTypeOfAxis,\n formatScientificLimitWidth,\n getScalePadding,\n getBarWidth,\n isScalePaddingDefined,\n getNextColor,\n areArraysEqual,\n calculateLongestLabelWidth,\n useRtl,\n} from '../../utilities/index';\n\nimport {\n AccessibilityProps,\n CartesianChart,\n Margins,\n Legend,\n RefArrayData,\n GroupedVerticalBarChartProps,\n GroupedVerticalBarChartData,\n GVBarChartSeriesPoint,\n Legends,\n YValueHover,\n DataVizPalette,\n getColorFromToken,\n ChartPopoverProps,\n Chart,\n} from '../../index';\n\ntype StringAxis = D3Axis<string>;\ntype NumericAxis = D3Axis<number | { valueOf(): number }>;\n\nconst MIN_DOMAIN_MARGIN = 8;\nconst X1_INNER_PADDING = 0.1;\n// x1_inner_padding = space_between_bars / (space_between_bars + bar_width)\n// => space_between_bars = (x1_inner_padding / (1 - x1_inner_padding)) * bar_width\n/** Rate at which the space between the bars in a group changes wrt the bar width */\nconst BAR_GAP_RATE = X1_INNER_PADDING / (1 - X1_INNER_PADDING);\n\n// This interface used for - While forming datapoints from given prop \"data\" in code\ninterface GVDataPoint {\n [key: string]: number | string;\n}\n\n// While forming datapoints from given prop \"data\" in code. These datapoints are used for to draw graph easily.\ninterface GVSingleDataPoint {\n [key: string]: GVDataPoint;\n}\n\nexport const GroupedVerticalBarChart: React.FC<GroupedVerticalBarChartProps> = React.forwardRef<\n HTMLDivElement,\n GroupedVerticalBarChartProps\n>((props = { maxBarWidth: 24 }, forwardedRef) => {\n const _tooltipId: string = useId('GVBCTooltipId_');\n const _emptyChartId: string = useId('_GVBC_empty');\n const _useRtl: boolean = useRtl();\n let _domainMargin: number = MIN_DOMAIN_MARGIN;\n let _dataset: GVDataPoint[] = [];\n let _keys: string[] = [];\n let _xAxisLabels: string[] = [];\n let _datasetForBars: any[] = [];\n let _margins: Margins = { top: 0, right: 0, bottom: 0, left: 0 };\n let _groupedVerticalBarGraph: JSX.Element[] = [];\n let _refArray: RefArrayData[] = [];\n let _yMax: number = 0;\n let _calloutAnchorPoint: GVBarChartSeriesPoint | null = null;\n let _barWidth: number = 0;\n let _groupWidth: number = 0;\n let _xAxisInnerPadding: number = 0;\n let _xAxisOuterPadding: number = 0;\n const cartesianChartRef = React.useRef<Chart>(null);\n\n const [color, setColor] = React.useState<string>('');\n const [dataForHoverCard, setDataForHoverCard] = React.useState<number>(0);\n const [selectedLegends, setSelectedLegends] = React.useState<string[]>(props.legendProps?.selectedLegends || []);\n const [xCalloutValue, setXCalloutValue] = React.useState<string>('');\n const [yCalloutValue, setYCalloutValue] = React.useState<string>('');\n const [YValueHover, setYValueHover] = React.useState<YValueHover[]>([]);\n const [hoverXValue, setHoverXValue] = React.useState<string>('');\n const [calloutLegend, setCalloutLegend] = React.useState<string>('');\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n const [callOutAccessibilityData, setCallOutAccessibilityData] = React.useState<AccessibilityProps | undefined>(\n undefined,\n );\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n const classes = useGroupedVerticalBarChartStyles_unstable(props);\n\n React.useEffect(() => {\n if (!areArraysEqual(props.legendProps?.selectedLegends, selectedLegends)) {\n setSelectedLegends(props.legendProps?.selectedLegends || []);\n }\n }, [props.legendProps?.selectedLegends]);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: cartesianChartRef.current?.chartContainer ?? null,\n }),\n [],\n );\n\n const _adjustProps = () => {\n _barWidth = getBarWidth(props.barWidth, props.maxBarWidth);\n // x0_inner_padding = space_between_groups / (space_between_groups + group_width)\n // space_between_groups = 2 * bar_width\n // group_width = keys.length * bar_width + (keys.length - 1) * space_between_bars\n _xAxisInnerPadding = getScalePadding(\n props.xAxisInnerPadding,\n undefined,\n 2 / (2 + keys.length + (keys.length - 1) * BAR_GAP_RATE),\n );\n _xAxisOuterPadding = getScalePadding(props.xAxisOuterPadding);\n };\n\n const _createDataset = (points: GroupedVerticalBarChartData[]) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const datasetForBars: any = [];\n const dataset: GVDataPoint[] = [];\n\n points.forEach((point: GroupedVerticalBarChartData, index: number) => {\n const singleDatasetPoint: GVDataPoint = {};\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const singleDatasetPointForBars: any = {};\n const singleDataSeries: GVBarChartSeriesPoint[] = [];\n\n point.series.forEach((seriesPoint: GVBarChartSeriesPoint, seriesIndex) => {\n singleDatasetPoint[seriesPoint.key] = seriesPoint.data;\n singleDatasetPointForBars[seriesPoint.key] = {\n ...seriesPoint,\n };\n singleDataSeries.push(seriesPoint);\n });\n\n singleDatasetPointForBars.xAxisPoint = point.name;\n singleDatasetPointForBars.indexNum = index;\n singleDatasetPointForBars.groupSeries = singleDataSeries;\n singleDatasetPointForBars.stackCallOutAccessibilityData = point.stackCallOutAccessibilityData;\n datasetForBars.push(singleDatasetPointForBars);\n dataset.push(singleDatasetPoint);\n });\n _dataset = dataset;\n return datasetForBars;\n };\n\n const _createDataSetOfGVBC = (points: GroupedVerticalBarChartData[]) => {\n const keys: string[] = [];\n const xAxisLabels: string[] = points.map(singlePoint => singlePoint.name);\n points[0].series.forEach((singleKey: GVBarChartSeriesPoint) => {\n keys.push(singleKey.key);\n });\n const datasetForBars = _createDataset(points);\n return {\n keys,\n xAxisLabels,\n datasetForBars,\n };\n };\n\n const onLegendSelectionChange = (\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 const _getLegendData = (points: GroupedVerticalBarChartData[]): JSX.Element => {\n const data = points;\n const defaultPalette: string[] = [\n getColorFromToken(DataVizPalette.color1),\n getColorFromToken(DataVizPalette.color2),\n getColorFromToken(DataVizPalette.color3),\n getColorFromToken(DataVizPalette.color4),\n getColorFromToken(DataVizPalette.color5),\n ];\n const actions: Legend[] = [];\n\n data.forEach((singleChartData: GroupedVerticalBarChartData) => {\n singleChartData.series.forEach((point: GVBarChartSeriesPoint) => {\n let color: string = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n const checkSimilarLegends = actions.filter((leg: Legend) => leg.title === point.legend && leg.color === color);\n if (checkSimilarLegends!.length > 0) {\n return;\n }\n const legend: Legend = {\n title: point.legend,\n color,\n hoverAction: () => {\n _handleChartMouseLeave();\n _onLegendHover(point.legend);\n },\n onMouseOutAction: () => {\n _onLegendLeave();\n },\n };\n\n actions.push(legend);\n });\n });\n return (\n <Legends\n legends={actions}\n enabledWrapLines={props.enabledLegendsWrapLines}\n overflowText={props.legendsOverflowText}\n {...props.legendProps}\n onChange={onLegendSelectionChange}\n />\n );\n };\n\n const points = props.data;\n const { keys, xAxisLabels, datasetForBars } = _createDataSetOfGVBC(points!);\n _keys = keys;\n _xAxisLabels = xAxisLabels;\n _datasetForBars = datasetForBars;\n const _xAxisType: XAxisTypes = getTypeOfAxis(points![0].name, true) as XAxisTypes;\n const legends: JSX.Element = _getLegendData(points!);\n _adjustProps();\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const yMax = d3Max(_dataset, (point: any) => d3Max(_keys, (key: string) => point[key]));\n _yMax = Math.max(yMax, props.yMaxValue || 0);\n\n const calloutProps: ChartPopoverProps = {\n clickPosition,\n isPopoverOpen,\n color,\n legend: calloutLegend,\n XValue: xCalloutValue,\n YValue: yCalloutValue ? yCalloutValue : dataForHoverCard,\n YValueHover,\n hoverXValue,\n culture: props.culture ?? 'en-us',\n isCartesian: true,\n ...props.calloutProps,\n ...getAccessibleDataObject(callOutAccessibilityData, 'text', false),\n };\n const tickParams = {\n tickValues: props.tickValues!,\n tickFormat: props.tickFormat!,\n };\n\n const _getGraphData = (\n xScale: StringAxis | NumericAxis,\n yScale: NumericAxis,\n containerHeight: number,\n containerWidth: number,\n xElement?: SVGElement | null,\n ) => {\n const xScale0 = _createX0Scale(containerWidth);\n\n // Setting the bar width here is safe because there are no dependencies earlier in the code\n // that rely on the width of bars in vertical bar charts with string x-axis.\n _barWidth = getBarWidth(\n props.barWidth,\n props.maxBarWidth,\n xScale0.bandwidth() / (_keys.length + (_keys.length - 1) * BAR_GAP_RATE),\n );\n _groupWidth = (_keys.length + (_keys.length - 1) * BAR_GAP_RATE) * _barWidth;\n\n const xScale1 = _createX1Scale();\n const allGroupsBars: JSX.Element[] = [];\n _datasetForBars.forEach((singleSet: GVSingleDataPoint) => {\n allGroupsBars.push(_buildGraph(singleSet, xScale0, xScale1, containerHeight, xElement!));\n });\n _groupedVerticalBarGraph = allGroupsBars;\n };\n\n const _getMargins = (margins: Margins) => {\n _margins = margins;\n };\n\n const _getOpacity = (legendTitle: string): string => {\n const opacity = _legendHighlighted(legendTitle) || _noLegendHighlighted() ? '' : '0.1';\n return opacity;\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 onBarHover = (\n pointData: GVBarChartSeriesPoint,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupData: any,\n mouseEvent: React.MouseEvent<SVGElement>,\n ): void => {\n mouseEvent.persist();\n if (_calloutAnchorPoint !== pointData) {\n _calloutAnchorPoint = pointData;\n updatePosition(mouseEvent.clientX, mouseEvent.clientY);\n setPopoverOpen(_noLegendHighlighted() || _legendHighlighted(pointData.legend));\n setCalloutLegend(pointData.legend);\n setDataForHoverCard(pointData.data);\n setColor(pointData.color);\n setXCalloutValue(pointData.xAxisCalloutData!);\n setYCalloutValue(pointData.yAxisCalloutData!);\n setCallOutAccessibilityData(\n props.isCalloutForStack ? groupData.stackCallOutAccessibilityData : pointData.callOutAccessibilityData,\n );\n setYValueHover(groupData.groupSeries);\n setHoverXValue(pointData.xAxisCalloutData!);\n }\n };\n\n const _onBarLeave = (): void => {\n /**/\n };\n\n const _handleChartMouseLeave = (): void => {\n _calloutAnchorPoint = null;\n setPopoverOpen(false);\n };\n\n const onBarFocus = (\n pointData: GVBarChartSeriesPoint,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupData: any,\n refArrayIndexNumber: number,\n ): void => {\n _refArray.forEach((obj: RefArrayData, index: number) => {\n if (obj.index === pointData.legend && refArrayIndexNumber === index) {\n setPopoverOpen(_noLegendHighlighted() || _legendHighlighted(pointData.legend));\n setCalloutLegend(pointData.legend);\n setDataForHoverCard(pointData.data);\n setColor(pointData.color);\n setXCalloutValue(pointData.xAxisCalloutData!);\n setYCalloutValue(pointData.yAxisCalloutData!);\n setCallOutAccessibilityData(\n props.isCalloutForStack ? groupData.stackCallOutAccessibilityData : pointData.callOutAccessibilityData,\n );\n setYValueHover(groupData.groupSeries);\n setHoverXValue(pointData.xAxisCalloutData!);\n }\n });\n };\n\n const _refCallback = (element: SVGRectElement, legendTitle: string, refIndexNumber: number): void => {\n _refArray[refIndexNumber] = { index: legendTitle, refElement: element };\n };\n\n const _buildGraph = (\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n singleSet: any,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n xScale0: any,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n xScale1: any,\n containerHeight: number,\n xElement: SVGElement,\n ): JSX.Element => {\n const singleGroup: JSX.Element[] = [];\n const barLabelsForGroup: JSX.Element[] = [];\n\n const yBarScale = d3ScaleLinear()\n .domain([0, yMax])\n .range([0, containerHeight! - _margins.bottom! - _margins.top!]);\n\n const tempDataSet = Object.keys(datasetForBars[0]).splice(0, keys.length);\n tempDataSet.forEach((datasetKey: string, index: number) => {\n const refIndexNumber = singleSet.indexNum * tempDataSet.length + index;\n const pointData = singleSet[datasetKey];\n // To align the centers of the generated bandwidth and the calculated one when they differ,\n // use the following addend.\n const xPoint = xScale1(datasetKey) + (xScale1.bandwidth() - _barWidth) / 2;\n const yPoint = Math.max(containerHeight! - _margins.bottom! - yBarScale(pointData.data), 0);\n const startColor = pointData.color ? pointData.color : getNextColor(index, 0);\n\n // Not rendering data with 0.\n pointData.data &&\n singleGroup.push(\n <React.Fragment key={`${singleSet.indexNum}-${index}`}>\n <rect\n className={classes.opacityChangeOnHover}\n height={Math.max(yBarScale(pointData.data), 0)}\n width={_barWidth}\n x={xPoint}\n y={yPoint}\n data-is-focusable={!props.hideTooltip && (_legendHighlighted(pointData.legend) || _noLegendHighlighted())}\n opacity={_getOpacity(pointData.legend)}\n ref={(e: SVGRectElement | null) => {\n _refCallback(e!, pointData.legend, refIndexNumber);\n }}\n fill={startColor}\n rx={0}\n onMouseOver={onBarHover.bind(null, pointData, singleSet)}\n onMouseMove={onBarHover.bind(null, pointData, singleSet)}\n onMouseOut={_onBarLeave}\n onFocus={onBarFocus.bind(null, pointData, singleSet, refIndexNumber)}\n onBlur={_onBarLeave}\n onClick={pointData.onClick}\n aria-label={getAriaLabel(pointData, singleSet.xAxisPoint)}\n tabIndex={pointData.legend !== '' ? 0 : undefined}\n role=\"img\"\n />\n </React.Fragment>,\n );\n if (\n pointData.data &&\n !props.hideLabels &&\n _barWidth >= 16 &&\n (_legendHighlighted(pointData.legend) || _noLegendHighlighted())\n ) {\n barLabelsForGroup.push(\n <text\n key={`${singleSet.indexNum}-${index}`}\n x={xPoint + _barWidth / 2}\n y={yPoint - 6}\n textAnchor=\"middle\"\n className={classes.barLabel}\n aria-hidden={true}\n >\n {formatScientificLimitWidth(pointData.data)}\n </text>,\n );\n }\n });\n // Used to display tooltip at x axis labels.\n if (!props.wrapXAxisLables && props.showXAxisLablesTooltip) {\n const xAxisElement = d3Select(xElement).call(xScale0);\n try {\n document.getElementById(_tooltipId) && document.getElementById(_tooltipId)!.remove();\n // eslint-disable-next-line no-empty\n } catch (e) {}\n const tooltipProps = {\n tooltipCls: classes.tooltip!,\n id: _tooltipId,\n xAxis: xAxisElement,\n };\n xAxisElement && tooltipOfXAxislabels(tooltipProps);\n }\n return (\n <g\n key={singleSet.indexNum}\n transform={`translate(${xScale0(singleSet.xAxisPoint) + (xScale0.bandwidth() - _groupWidth) / 2}, 0)`}\n >\n {singleGroup}\n {barLabelsForGroup}\n </g>\n );\n };\n\n // For grouped vertical bar chart, First need to define total scale (from start to end)\n // From that need to define scale for single group of bars - done by createX1Scale\n const _createX0Scale = (containerWidth: number) => {\n const x0Axis = d3ScaleBand()\n .domain(xAxisLabels)\n .range(\n _useRtl\n ? [containerWidth! - _margins.right! - _domainMargin, _margins.left! + _domainMargin]\n : [_margins.left! + _domainMargin, containerWidth! - _margins.right! - _domainMargin],\n )\n .paddingInner(_xAxisInnerPadding)\n .paddingOuter(_xAxisOuterPadding);\n return x0Axis;\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _createX1Scale = (): any => {\n return (\n d3ScaleBand()\n .domain(keys)\n // When there is only one group, xScale0 adds padding around it,\n // causing the bandwidth to become smaller than the actual group width.\n // So to render bars in the group correctly, use groupWidth instead of the generated scale bandwidth.\n .range(_useRtl ? [_groupWidth, 0] : [0, _groupWidth])\n .paddingInner(X1_INNER_PADDING)\n );\n };\n\n const _onLegendHover = (legendTitle: string): void => {\n setActiveLegend(legendTitle);\n };\n\n const _onLegendLeave = (): void => {\n setActiveLegend('');\n };\n\n const _getAxisData = React.useCallback(\n (yAxisData: IAxisData) => {\n if (yAxisData && yAxisData.yAxisDomainValues.length) {\n const { yAxisDomainValues: domainValue } = yAxisData;\n _yMax = Math.max(domainValue[domainValue.length - 1], props.yMaxValue || 0);\n }\n },\n [props.yMaxValue],\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 const _legendHighlighted = (legendTitle: string) => {\n return _getHighlightedLegend().includes(legendTitle!);\n };\n\n /**\n * This function checks if none of the legends is selected or hovered.\n */\n const _noLegendHighlighted = () => {\n return _getHighlightedLegend().length === 0;\n };\n\n const _getHighlightedLegend = () => {\n return selectedLegends.length > 0 ? selectedLegends : activeLegend ? [activeLegend] : [];\n };\n\n const getAriaLabel = (point: GVBarChartSeriesPoint, xAxisPoint: string): string => {\n const xValue = point.xAxisCalloutData || xAxisPoint;\n const legend = point.legend;\n const yValue = point.yAxisCalloutData || point.data;\n return point.callOutAccessibilityData?.ariaLabel || `${xValue}. ${legend}, ${yValue}.`;\n };\n\n const _getDomainMargins = (containerWidth: number): Margins => {\n /** Total width available to render the bars */\n const totalWidth = containerWidth - (_margins.left! + MIN_DOMAIN_MARGIN) - (_margins.right! + MIN_DOMAIN_MARGIN);\n /** Rate at which the space between the groups changes wrt the group width */\n const groupGapRate = _xAxisInnerPadding / (1 - _xAxisInnerPadding);\n\n if (_xAxisType === XAxisTypes.StringAxis) {\n if (isScalePaddingDefined(props.xAxisOuterPadding)) {\n // Setting the domain margin for string x-axis to 0 because the xAxisOuterPadding prop is now available\n // to adjust the space before the first group and after the last group.\n _domainMargin = 0;\n } else if (props.barWidth !== 'auto') {\n // Update the bar width so that when CartesianChart rerenders,\n // the following calculations don't use the previous bar width.\n _barWidth = getBarWidth(props.barWidth, props.maxBarWidth);\n const groupWidth = (keys.length + (keys.length - 1) * BAR_GAP_RATE) * _barWidth;\n /** Total width required to render the groups. Directly proportional to group width */\n const reqWidth = (xAxisLabels.length + (xAxisLabels.length - 1) * groupGapRate) * groupWidth;\n\n if (totalWidth >= reqWidth) {\n // Center align the chart by setting equal left and right margins for domain\n _domainMargin = MIN_DOMAIN_MARGIN + (totalWidth - reqWidth) / 2;\n }\n } else if (props.mode === 'plotly' && xAxisLabels.length > 1) {\n // Calculate the remaining width after rendering groups at their maximum allowable width\n const groupBandwidth = totalWidth / (xAxisLabels.length + (xAxisLabels.length - 1) * groupGapRate);\n const barBandwidth = groupBandwidth / (keys.length + (keys.length - 1) * BAR_GAP_RATE);\n const barWidth = getBarWidth(props.barWidth, props.maxBarWidth, barBandwidth);\n const groupWidth = (keys.length + (keys.length - 1) * BAR_GAP_RATE) * barWidth;\n let reqWidth = (xAxisLabels.length + (xAxisLabels.length - 1) * groupGapRate) * groupWidth;\n const margin1 = (totalWidth - reqWidth) / 2;\n\n // Calculate the remaining width after accounting for the space required to render x-axis labels\n const step = calculateLongestLabelWidth(xAxisLabels) + 20;\n reqWidth = (xAxisLabels.length - _xAxisInnerPadding) * step;\n const margin2 = (totalWidth - reqWidth) / 2;\n\n _domainMargin = MIN_DOMAIN_MARGIN + Math.max(0, Math.min(margin1, margin2));\n }\n }\n\n return {\n ..._margins,\n left: _margins.left! + _domainMargin,\n right: _margins.right! + _domainMargin,\n };\n };\n\n const _isChartEmpty = (): boolean => {\n return !(\n props.data &&\n props.data.length > 0 &&\n props.data.filter((item: GroupedVerticalBarChartData) => item.series.length).length > 0\n );\n };\n\n const _getChartTitle = (): string => {\n return (\n (props.chartTitle ? `${props.chartTitle}. ` : '') +\n `Vertical bar chart with ${_xAxisLabels.length} groups of ${_keys.length} bars each. `\n );\n };\n\n return !_isChartEmpty() ? (\n <CartesianChart\n {...props}\n chartTitle={_getChartTitle()}\n points={_datasetForBars}\n chartType={ChartTypes.GroupedVerticalBarChart}\n calloutProps={calloutProps}\n legendBars={legends}\n xAxisType={_xAxisType}\n datasetForXAxisDomain={_xAxisLabels}\n tickParams={tickParams}\n tickPadding={props.tickPadding || 5}\n maxOfYVal={_yMax}\n getmargins={_getMargins}\n getGraphData={_getGraphData}\n getAxisData={_getAxisData}\n onChartMouseLeave={_handleChartMouseLeave}\n getDomainMargins={_getDomainMargins}\n {...(_xAxisType === XAxisTypes.StringAxis && {\n xAxisInnerPadding: _xAxisInnerPadding,\n xAxisOuterPadding: _xAxisOuterPadding,\n })}\n barwidth={_barWidth}\n componentRef={cartesianChartRef}\n /* eslint-disable react/jsx-no-bind */\n children={() => {\n return <g>{_groupedVerticalBarGraph}</g>;\n }}\n />\n ) : (\n <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n});\nGroupedVerticalBarChart.displayName = 'GroupedVerticalBarChart';\n"],"names":["React","useGroupedVerticalBarChartStyles_unstable","max","d3Max","select","d3Select","scaleBand","d3ScaleBand","scaleLinear","d3ScaleLinear","useId","ChartTypes","getAccessibleDataObject","tooltipOfXAxislabels","XAxisTypes","getTypeOfAxis","formatScientificLimitWidth","getScalePadding","getBarWidth","isScalePaddingDefined","getNextColor","areArraysEqual","calculateLongestLabelWidth","useRtl","CartesianChart","Legends","DataVizPalette","getColorFromToken","MIN_DOMAIN_MARGIN","X1_INNER_PADDING","BAR_GAP_RATE","GroupedVerticalBarChart","forwardRef","props","maxBarWidth","forwardedRef","_tooltipId","_emptyChartId","_useRtl","_domainMargin","_dataset","_keys","_xAxisLabels","_datasetForBars","_margins","top","right","bottom","left","_groupedVerticalBarGraph","_refArray","_yMax","_calloutAnchorPoint","_barWidth","_groupWidth","_xAxisInnerPadding","_xAxisOuterPadding","cartesianChartRef","useRef","color","setColor","useState","dataForHoverCard","setDataForHoverCard","selectedLegends","setSelectedLegends","legendProps","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","YValueHover","setYValueHover","hoverXValue","setHoverXValue","calloutLegend","setCalloutLegend","activeLegend","setActiveLegend","callOutAccessibilityData","setCallOutAccessibilityData","undefined","clickPosition","setClickPosition","x","y","isPopoverOpen","setPopoverOpen","classes","useEffect","useImperativeHandle","componentRef","chartContainer","current","_adjustProps","barWidth","xAxisInnerPadding","keys","length","xAxisOuterPadding","_createDataset","points","datasetForBars","dataset","forEach","point","index","singleDatasetPoint","singleDatasetPointForBars","singleDataSeries","series","seriesPoint","seriesIndex","key","data","push","xAxisPoint","name","indexNum","groupSeries","stackCallOutAccessibilityData","_createDataSetOfGVBC","xAxisLabels","map","singlePoint","singleKey","onLegendSelectionChange","event","currentLegend","canSelectMultipleLegends","slice","onChange","_getLegendData","defaultPalette","color1","color2","color3","color4","color5","actions","singleChartData","Math","floor","random","checkSimilarLegends","filter","leg","title","legend","hoverAction","_handleChartMouseLeave","_onLegendHover","onMouseOutAction","_onLegendLeave","legends","enabledWrapLines","enabledLegendsWrapLines","overflowText","legendsOverflowText","_xAxisType","yMax","yMaxValue","calloutProps","XValue","YValue","culture","isCartesian","tickParams","tickValues","tickFormat","_getGraphData","xScale","yScale","containerHeight","containerWidth","xElement","xScale0","_createX0Scale","bandwidth","xScale1","_createX1Scale","allGroupsBars","singleSet","_buildGraph","_getMargins","margins","_getOpacity","legendTitle","opacity","_legendHighlighted","_noLegendHighlighted","updatePosition","newX","newY","threshold","distance","sqrt","pow","onBarHover","pointData","groupData","mouseEvent","persist","clientX","clientY","xAxisCalloutData","yAxisCalloutData","isCalloutForStack","_onBarLeave","onBarFocus","refArrayIndexNumber","obj","_refCallback","element","refIndexNumber","refElement","singleGroup","barLabelsForGroup","yBarScale","domain","range","tempDataSet","Object","splice","datasetKey","xPoint","yPoint","startColor","Fragment","rect","className","opacityChangeOnHover","height","width","data-is-focusable","hideTooltip","ref","e","fill","rx","onMouseOver","bind","onMouseMove","onMouseOut","onFocus","onBlur","onClick","aria-label","getAriaLabel","tabIndex","role","hideLabels","text","textAnchor","barLabel","aria-hidden","wrapXAxisLables","showXAxisLablesTooltip","xAxisElement","call","document","getElementById","remove","tooltipProps","tooltipCls","tooltip","id","xAxis","g","transform","x0Axis","paddingInner","paddingOuter","_getAxisData","useCallback","yAxisData","yAxisDomainValues","domainValue","_getHighlightedLegend","includes","xValue","yValue","ariaLabel","_getDomainMargins","totalWidth","groupGapRate","StringAxis","groupWidth","reqWidth","mode","groupBandwidth","barBandwidth","margin1","step","margin2","min","_isChartEmpty","item","_getChartTitle","chartTitle","chartType","legendBars","xAxisType","datasetForXAxisDomain","tickPadding","maxOfYVal","getmargins","getGraphData","getAxisData","onChartMouseLeave","getDomainMargins","barwidth","children","div","style","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yCAAyC,QAAQ,4CAA4C;AACtG,SAASC,OAAOC,KAAK,QAAQ,WAAW;AACxC,SAASC,UAAUC,QAAQ,QAAQ,eAAe;AAElD,SAASC,aAAaC,WAAW,EAAEC,eAAeC,aAAa,QAAQ,WAAW;AAElF,SAASC,KAAK,QAAQ,4BAA4B;AAClD,SACEC,UAAU,EAEVC,uBAAuB,EACvBC,oBAAoB,EACpBC,UAAU,EACVC,aAAa,EACbC,0BAA0B,EAC1BC,eAAe,EACfC,WAAW,EACXC,qBAAqB,EACrBC,YAAY,EACZC,cAAc,EACdC,0BAA0B,EAC1BC,MAAM,QACD,wBAAwB;AAE/B,SAEEC,cAAc,EAOdC,OAAO,EAEPC,cAAc,EACdC,iBAAiB,QAGZ,cAAc;AAKrB,MAAMC,oBAAoB;AAC1B,MAAMC,mBAAmB;AACzB,2EAA2E;AAC3E,kFAAkF;AAClF,kFAAkF,GAClF,MAAMC,eAAeD,mBAAoB,CAAA,IAAIA,gBAAe;AAY5D,OAAO,MAAME,wCAAkE/B,MAAMgC,UAAU,CAG7F,CAACC,QAAQ;IAAEC,aAAa;AAAG,CAAC,EAAEC;QAsByCF,oBAkBnEA;IAvCJ,MAAMG,aAAqB1B,MAAM;IACjC,MAAM2B,gBAAwB3B,MAAM;IACpC,MAAM4B,UAAmBf;IACzB,IAAIgB,gBAAwBX;IAC5B,IAAIY,WAA0B,EAAE;IAChC,IAAIC,QAAkB,EAAE;IACxB,IAAIC,eAAyB,EAAE;IAC/B,IAAIC,kBAAyB,EAAE;IAC/B,IAAIC,WAAoB;QAAEC,KAAK;QAAGC,OAAO;QAAGC,QAAQ;QAAGC,MAAM;IAAE;IAC/D,IAAIC,2BAA0C,EAAE;IAChD,IAAIC,YAA4B,EAAE;IAClC,IAAIC,QAAgB;IACpB,IAAIC,sBAAoD;IACxD,IAAIC,YAAoB;IACxB,IAAIC,cAAsB;IAC1B,IAAIC,qBAA6B;IACjC,IAAIC,qBAA6B;IACjC,MAAMC,oBAAoBzD,MAAM0D,MAAM,CAAQ;IAE9C,MAAM,CAACC,OAAOC,SAAS,GAAG5D,MAAM6D,QAAQ,CAAS;IACjD,MAAM,CAACC,kBAAkBC,oBAAoB,GAAG/D,MAAM6D,QAAQ,CAAS;IACvE,MAAM,CAACG,iBAAiBC,mBAAmB,GAAGjE,MAAM6D,QAAQ,CAAW5B,EAAAA,qBAAAA,MAAMiC,WAAW,cAAjBjC,yCAAAA,mBAAmB+B,eAAe,KAAI,EAAE;IAC/G,MAAM,CAACG,eAAeC,iBAAiB,GAAGpE,MAAM6D,QAAQ,CAAS;IACjE,MAAM,CAACQ,eAAeC,iBAAiB,GAAGtE,MAAM6D,QAAQ,CAAS;IACjE,MAAM,CAACU,aAAaC,eAAe,GAAGxE,MAAM6D,QAAQ,CAAgB,EAAE;IACtE,MAAM,CAACY,aAAaC,eAAe,GAAG1E,MAAM6D,QAAQ,CAAS;IAC7D,MAAM,CAACc,eAAeC,iBAAiB,GAAG5E,MAAM6D,QAAQ,CAAS;IACjE,MAAM,CAACgB,cAAcC,gBAAgB,GAAG9E,MAAM6D,QAAQ,CAAS;IAC/D,MAAM,CAACkB,0BAA0BC,4BAA4B,GAAGhF,MAAM6D,QAAQ,CAC5EoB;IAEF,MAAM,CAACC,eAAeC,iBAAiB,GAAGnF,MAAM6D,QAAQ,CAAC;QAAEuB,GAAG;QAAGC,GAAG;IAAE;IACtE,MAAM,CAACC,eAAeC,eAAe,GAAGvF,MAAM6D,QAAQ,CAAU;IAChE,MAAM2B,UAAUvF,0CAA0CgC;IAE1DjC,MAAMyF,SAAS,CAAC;YACMxD;QAApB,IAAI,CAACZ,gBAAeY,qBAAAA,MAAMiC,WAAW,cAAjBjC,yCAAAA,mBAAmB+B,eAAe,EAAEA,kBAAkB;gBACrD/B;YAAnBgC,mBAAmBhC,EAAAA,sBAAAA,MAAMiC,WAAW,cAAjBjC,0CAAAA,oBAAmB+B,eAAe,KAAI,EAAE;QAC7D;IACF,GAAG;SAAC/B,sBAAAA,MAAMiC,WAAW,cAAjBjC,0CAAAA,oBAAmB+B,eAAe;KAAC;IAEvChE,MAAM0F,mBAAmB,CACvBzD,MAAM0D,YAAY,EAClB;YACkBlC;YAAAA;eADX;YACLmC,gBAAgBnC,CAAAA,6CAAAA,6BAAAA,kBAAkBoC,OAAO,cAAzBpC,iDAAAA,2BAA2BmC,cAAc,cAAzCnC,uDAAAA,4CAA6C;QAC/D;IAAA,GACA,EAAE;IAGJ,MAAMqC,eAAe;QACnBzC,YAAYnC,YAAYe,MAAM8D,QAAQ,EAAE9D,MAAMC,WAAW;QACzD,iFAAiF;QACjF,uCAAuC;QACvC,iFAAiF;QACjFqB,qBAAqBtC,gBACnBgB,MAAM+D,iBAAiB,EACvBf,WACA,IAAK,CAAA,IAAIgB,KAAKC,MAAM,GAAG,AAACD,CAAAA,KAAKC,MAAM,GAAG,CAAA,IAAKpE,YAAW;QAExD0B,qBAAqBvC,gBAAgBgB,MAAMkE,iBAAiB;IAC9D;IAEA,MAAMC,iBAAiB,CAACC;QACtB,8DAA8D;QAC9D,MAAMC,iBAAsB,EAAE;QAC9B,MAAMC,UAAyB,EAAE;QAEjCF,OAAOG,OAAO,CAAC,CAACC,OAAoCC;YAClD,MAAMC,qBAAkC,CAAC;YACzC,8DAA8D;YAC9D,MAAMC,4BAAiC,CAAC;YACxC,MAAMC,mBAA4C,EAAE;YAEpDJ,MAAMK,MAAM,CAACN,OAAO,CAAC,CAACO,aAAoCC;gBACxDL,kBAAkB,CAACI,YAAYE,GAAG,CAAC,GAAGF,YAAYG,IAAI;gBACtDN,yBAAyB,CAACG,YAAYE,GAAG,CAAC,GAAG;oBAC3C,GAAGF,WAAW;gBAChB;gBACAF,iBAAiBM,IAAI,CAACJ;YACxB;YAEAH,0BAA0BQ,UAAU,GAAGX,MAAMY,IAAI;YACjDT,0BAA0BU,QAAQ,GAAGZ;YACrCE,0BAA0BW,WAAW,GAAGV;YACxCD,0BAA0BY,6BAA6B,GAAGf,MAAMe,6BAA6B;YAC7FlB,eAAea,IAAI,CAACP;YACpBL,QAAQY,IAAI,CAACR;QACf;QACAnE,WAAW+D;QACX,OAAOD;IACT;IAEA,MAAMmB,uBAAuB,CAACpB;QAC5B,MAAMJ,OAAiB,EAAE;QACzB,MAAMyB,cAAwBrB,OAAOsB,GAAG,CAACC,CAAAA,cAAeA,YAAYP,IAAI;QACxEhB,MAAM,CAAC,EAAE,CAACS,MAAM,CAACN,OAAO,CAAC,CAACqB;YACxB5B,KAAKkB,IAAI,CAACU,UAAUZ,GAAG;QACzB;QACA,MAAMX,iBAAiBF,eAAeC;QACtC,OAAO;YACLJ;YACAyB;YACApB;QACF;IACF;IAEA,MAAMwB,0BAA0B,CAC9B9D,iBACA+D,OACAC;YAEI/F,oBAKAA;QALJ,KAAIA,qBAAAA,MAAMiC,WAAW,cAAjBjC,yCAAAA,mBAAmBgG,wBAAwB,EAAE;YAC/ChE,mBAAmBD;QACrB,OAAO;YACLC,mBAAmBD,gBAAgBkE,KAAK,CAAC,CAAC;QAC5C;QACA,KAAIjG,sBAAAA,MAAMiC,WAAW,cAAjBjC,0CAAAA,oBAAmBkG,QAAQ,EAAE;YAC/BlG,MAAMiC,WAAW,CAACiE,QAAQ,CAACnE,iBAAiB+D,OAAOC;QACrD;IACF;IAEA,MAAMI,iBAAiB,CAAC/B;QACtB,MAAMa,OAAOb;QACb,MAAMgC,iBAA2B;YAC/B1G,kBAAkBD,eAAe4G,MAAM;YACvC3G,kBAAkBD,eAAe6G,MAAM;YACvC5G,kBAAkBD,eAAe8G,MAAM;YACvC7G,kBAAkBD,eAAe+G,MAAM;YACvC9G,kBAAkBD,eAAegH,MAAM;SACxC;QACD,MAAMC,UAAoB,EAAE;QAE5BzB,KAAKV,OAAO,CAAC,CAACoC;YACZA,gBAAgB9B,MAAM,CAACN,OAAO,CAAC,CAACC;gBAC9B,IAAI9C,QAAgB8C,MAAM9C,KAAK,GAAG8C,MAAM9C,KAAK,GAAG0E,cAAc,CAACQ,KAAKC,KAAK,CAACD,KAAKE,MAAM,KAAK,IAAI,GAAG;gBACjG,MAAMC,sBAAsBL,QAAQM,MAAM,CAAC,CAACC,MAAgBA,IAAIC,KAAK,KAAK1C,MAAM2C,MAAM,IAAIF,IAAIvF,KAAK,KAAKA;gBACxG,IAAIqF,oBAAqB9C,MAAM,GAAG,GAAG;oBACnC;gBACF;gBACA,MAAMkD,SAAiB;oBACrBD,OAAO1C,MAAM2C,MAAM;oBACnBzF;oBACA0F,aAAa;wBACXC;wBACAC,eAAe9C,MAAM2C,MAAM;oBAC7B;oBACAI,kBAAkB;wBAChBC;oBACF;gBACF;gBAEAd,QAAQxB,IAAI,CAACiC;YACf;QACF;QACA,qBACE,oBAAC3H;YACCiI,SAASf;YACTgB,kBAAkB1H,MAAM2H,uBAAuB;YAC/CC,cAAc5H,MAAM6H,mBAAmB;YACtC,GAAG7H,MAAMiC,WAAW;YACrBiE,UAAUL;;IAGhB;IAEA,MAAMzB,SAASpE,MAAMiF,IAAI;IACzB,MAAM,EAAEjB,IAAI,EAAEyB,WAAW,EAAEpB,cAAc,EAAE,GAAGmB,qBAAqBpB;IACnE5D,QAAQwD;IACRvD,eAAegF;IACf/E,kBAAkB2D;IAClB,MAAMyD,aAAyBhJ,cAAcsF,MAAO,CAAC,EAAE,CAACgB,IAAI,EAAE;IAC9D,MAAMqC,UAAuBtB,eAAe/B;IAC5CP;IAEA,8DAA8D;IAC9D,MAAMkE,OAAO7J,MAAMqC,UAAU,CAACiE,QAAetG,MAAMsC,OAAO,CAACwE,MAAgBR,KAAK,CAACQ,IAAI;IACrF9D,QAAQ0F,KAAK3I,GAAG,CAAC8J,MAAM/H,MAAMgI,SAAS,IAAI;QAW/BhI;IATX,MAAMiI,eAAkC;QACtChF;QACAI;QACA3B;QACAyF,QAAQzE;QACRwF,QAAQhG;QACRiG,QAAQ/F,gBAAgBA,gBAAgBP;QACxCS;QACAE;QACA4F,SAASpI,CAAAA,iBAAAA,MAAMoI,OAAO,cAAbpI,4BAAAA,iBAAiB;QAC1BqI,aAAa;QACb,GAAGrI,MAAMiI,YAAY;QACrB,GAAGtJ,wBAAwBmE,0BAA0B,QAAQ,MAAM;IACrE;IACA,MAAMwF,aAAa;QACjBC,YAAYvI,MAAMuI,UAAU;QAC5BC,YAAYxI,MAAMwI,UAAU;IAC9B;IAEA,MAAMC,gBAAgB,CACpBC,QACAC,QACAC,iBACAC,gBACAC;QAEA,MAAMC,UAAUC,eAAeH;QAE/B,2FAA2F;QAC3F,4EAA4E;QAC5EzH,YAAYnC,YACVe,MAAM8D,QAAQ,EACd9D,MAAMC,WAAW,EACjB8I,QAAQE,SAAS,KAAMzI,CAAAA,MAAMyD,MAAM,GAAG,AAACzD,CAAAA,MAAMyD,MAAM,GAAG,CAAA,IAAKpE,YAAW;QAExEwB,cAAc,AAACb,CAAAA,MAAMyD,MAAM,GAAG,AAACzD,CAAAA,MAAMyD,MAAM,GAAG,CAAA,IAAKpE,YAAW,IAAKuB;QAEnE,MAAM8H,UAAUC;QAChB,MAAMC,gBAA+B,EAAE;QACvC1I,gBAAgB6D,OAAO,CAAC,CAAC8E;YACvBD,cAAclE,IAAI,CAACoE,YAAYD,WAAWN,SAASG,SAASN,iBAAiBE;QAC/E;QACA9H,2BAA2BoI;IAC7B;IAEA,MAAMG,cAAc,CAACC;QACnB7I,WAAW6I;IACb;IAEA,MAAMC,cAAc,CAACC;QACnB,MAAMC,UAAUC,mBAAmBF,gBAAgBG,yBAAyB,KAAK;QACjF,OAAOF;IACT;IAEA,SAASG,eAAeC,IAAY,EAAEC,IAAY;QAChD,MAAMC,YAAY,GAAG,+BAA+B;QACpD,MAAM,EAAE9G,CAAC,EAAEC,CAAC,EAAE,GAAGH;QACjB,+BAA+B;QAC/B,MAAMiH,WAAWtD,KAAKuD,IAAI,CAACvD,KAAKwD,GAAG,CAACL,OAAO5G,GAAG,KAAKyD,KAAKwD,GAAG,CAACJ,OAAO5G,GAAG;QACtE,+EAA+E;QAC/E,IAAI8G,WAAWD,WAAW;YACxB/G,iBAAiB;gBAAEC,GAAG4G;gBAAM3G,GAAG4G;YAAK;YACpC1G,eAAe;QACjB;IACF;IAEA,MAAM+G,aAAa,CACjBC,WACA,8DAA8D;IAC9DC,WACAC;QAEAA,WAAWC,OAAO;QAClB,IAAItJ,wBAAwBmJ,WAAW;YACrCnJ,sBAAsBmJ;YACtBR,eAAeU,WAAWE,OAAO,EAAEF,WAAWG,OAAO;YACrDrH,eAAeuG,0BAA0BD,mBAAmBU,UAAUnD,MAAM;YAC5ExE,iBAAiB2H,UAAUnD,MAAM;YACjCrF,oBAAoBwI,UAAUrF,IAAI;YAClCtD,SAAS2I,UAAU5I,KAAK;YACxBS,iBAAiBmI,UAAUM,gBAAgB;YAC3CvI,iBAAiBiI,UAAUO,gBAAgB;YAC3C9H,4BACE/C,MAAM8K,iBAAiB,GAAGP,UAAUhF,6BAA6B,GAAG+E,UAAUxH,wBAAwB;YAExGP,eAAegI,UAAUjF,WAAW;YACpC7C,eAAe6H,UAAUM,gBAAgB;QAC3C;IACF;IAEA,MAAMG,cAAc;IAClB,EAAE,GACJ;IAEA,MAAM1D,yBAAyB;QAC7BlG,sBAAsB;QACtBmC,eAAe;IACjB;IAEA,MAAM0H,aAAa,CACjBV,WACA,8DAA8D;IAC9DC,WACAU;QAEAhK,UAAUsD,OAAO,CAAC,CAAC2G,KAAmBzG;YACpC,IAAIyG,IAAIzG,KAAK,KAAK6F,UAAUnD,MAAM,IAAI8D,wBAAwBxG,OAAO;gBACnEnB,eAAeuG,0BAA0BD,mBAAmBU,UAAUnD,MAAM;gBAC5ExE,iBAAiB2H,UAAUnD,MAAM;gBACjCrF,oBAAoBwI,UAAUrF,IAAI;gBAClCtD,SAAS2I,UAAU5I,KAAK;gBACxBS,iBAAiBmI,UAAUM,gBAAgB;gBAC3CvI,iBAAiBiI,UAAUO,gBAAgB;gBAC3C9H,4BACE/C,MAAM8K,iBAAiB,GAAGP,UAAUhF,6BAA6B,GAAG+E,UAAUxH,wBAAwB;gBAExGP,eAAegI,UAAUjF,WAAW;gBACpC7C,eAAe6H,UAAUM,gBAAgB;YAC3C;QACF;IACF;IAEA,MAAMO,eAAe,CAACC,SAAyB1B,aAAqB2B;QAClEpK,SAAS,CAACoK,eAAe,GAAG;YAAE5G,OAAOiF;YAAa4B,YAAYF;QAAQ;IACxE;IAEA,MAAM9B,cAAc,CAClB,8DAA8D;IAC9DD,WACA,8DAA8D;IAC9DN,SACA,8DAA8D;IAC9DG,SACAN,iBACAE;QAEA,MAAMyC,cAA6B,EAAE;QACrC,MAAMC,oBAAmC,EAAE;QAE3C,MAAMC,YAAYjN,gBACfkN,MAAM,CAAC;YAAC;YAAG3D;SAAK,EAChB4D,KAAK,CAAC;YAAC;YAAG/C,kBAAmBjI,SAASG,MAAM,GAAIH,SAASC,GAAG;SAAE;QAEjE,MAAMgL,cAAcC,OAAO7H,IAAI,CAACK,cAAc,CAAC,EAAE,EAAEyH,MAAM,CAAC,GAAG9H,KAAKC,MAAM;QACxE2H,YAAYrH,OAAO,CAAC,CAACwH,YAAoBtH;YACvC,MAAM4G,iBAAiBhC,UAAUhE,QAAQ,GAAGuG,YAAY3H,MAAM,GAAGQ;YACjE,MAAM6F,YAAYjB,SAAS,CAAC0C,WAAW;YACvC,2FAA2F;YAC3F,4BAA4B;YAC5B,MAAMC,SAAS9C,QAAQ6C,cAAc,AAAC7C,CAAAA,QAAQD,SAAS,KAAK7H,SAAQ,IAAK;YACzE,MAAM6K,SAASrF,KAAK3I,GAAG,CAAC2K,kBAAmBjI,SAASG,MAAM,GAAI2K,UAAUnB,UAAUrF,IAAI,GAAG;YACzF,MAAMiH,aAAa5B,UAAU5I,KAAK,GAAG4I,UAAU5I,KAAK,GAAGvC,aAAasF,OAAO;YAE3E,6BAA6B;YAC7B6F,UAAUrF,IAAI,IACZsG,YAAYrG,IAAI,eACd,oBAACnH,MAAMoO,QAAQ;gBAACnH,KAAK,CAAC,EAAEqE,UAAUhE,QAAQ,CAAC,CAAC,EAAEZ,MAAM,CAAC;6BACnD,oBAAC2H;gBACCC,WAAW9I,QAAQ+I,oBAAoB;gBACvCC,QAAQ3F,KAAK3I,GAAG,CAACwN,UAAUnB,UAAUrF,IAAI,GAAG;gBAC5CuH,OAAOpL;gBACP+B,GAAG6I;gBACH5I,GAAG6I;gBACHQ,qBAAmB,CAACzM,MAAM0M,WAAW,IAAK9C,CAAAA,mBAAmBU,UAAUnD,MAAM,KAAK0C,sBAAqB;gBACvGF,SAASF,YAAYa,UAAUnD,MAAM;gBACrCwF,KAAK,CAACC;oBACJzB,aAAayB,GAAItC,UAAUnD,MAAM,EAAEkE;gBACrC;gBACAwB,MAAMX;gBACNY,IAAI;gBACJC,aAAa1C,WAAW2C,IAAI,CAAC,MAAM1C,WAAWjB;gBAC9C4D,aAAa5C,WAAW2C,IAAI,CAAC,MAAM1C,WAAWjB;gBAC9C6D,YAAYnC;gBACZoC,SAASnC,WAAWgC,IAAI,CAAC,MAAM1C,WAAWjB,WAAWgC;gBACrD+B,QAAQrC;gBACRsC,SAAS/C,UAAU+C,OAAO;gBAC1BC,cAAYC,aAAajD,WAAWjB,UAAUlE,UAAU;gBACxDqI,UAAUlD,UAAUnD,MAAM,KAAK,KAAK,IAAInE;gBACxCyK,MAAK;;YAIb,IACEnD,UAAUrF,IAAI,IACd,CAACjF,MAAM0N,UAAU,IACjBtM,aAAa,MACZwI,CAAAA,mBAAmBU,UAAUnD,MAAM,KAAK0C,sBAAqB,GAC9D;gBACA2B,kBAAkBtG,IAAI,eACpB,oBAACyI;oBACC3I,KAAK,CAAC,EAAEqE,UAAUhE,QAAQ,CAAC,CAAC,EAAEZ,MAAM,CAAC;oBACrCtB,GAAG6I,SAAS5K,YAAY;oBACxBgC,GAAG6I,SAAS;oBACZ2B,YAAW;oBACXvB,WAAW9I,QAAQsK,QAAQ;oBAC3BC,eAAa;mBAEZ/O,2BAA2BuL,UAAUrF,IAAI;YAGhD;QACF;QACA,4CAA4C;QAC5C,IAAI,CAACjF,MAAM+N,eAAe,IAAI/N,MAAMgO,sBAAsB,EAAE;YAC1D,MAAMC,eAAe7P,SAAS0K,UAAUoF,IAAI,CAACnF;YAC7C,IAAI;gBACFoF,SAASC,cAAc,CAACjO,eAAegO,SAASC,cAAc,CAACjO,YAAakO,MAAM;YAClF,oCAAoC;YACtC,EAAE,OAAOzB,GAAG,CAAC;YACb,MAAM0B,eAAe;gBACnBC,YAAYhL,QAAQiL,OAAO;gBAC3BC,IAAItO;gBACJuO,OAAOT;YACT;YACAA,gBAAgBrP,qBAAqB0P;QACvC;QACA,qBACE,oBAACK;YACC3J,KAAKqE,UAAUhE,QAAQ;YACvBuJ,WAAW,CAAC,UAAU,EAAE7F,QAAQM,UAAUlE,UAAU,IAAI,AAAC4D,CAAAA,QAAQE,SAAS,KAAK5H,WAAU,IAAK,EAAE,IAAI,CAAC;WAEpGkK,aACAC;IAGP;IAEA,uFAAuF;IACvF,kFAAkF;IAClF,MAAMxC,iBAAiB,CAACH;QACtB,MAAMgG,SAASvQ,cACZoN,MAAM,CAACjG,aACPkG,KAAK,CACJtL,UACI;YAACwI,iBAAkBlI,SAASE,KAAK,GAAIP;YAAeK,SAASI,IAAI,GAAIT;SAAc,GACnF;YAACK,SAASI,IAAI,GAAIT;YAAeuI,iBAAkBlI,SAASE,KAAK,GAAIP;SAAc,EAExFwO,YAAY,CAACxN,oBACbyN,YAAY,CAACxN;QAChB,OAAOsN;IACT;IAEA,8DAA8D;IAC9D,MAAM1F,iBAAiB;QACrB,OACE7K,cACGoN,MAAM,CAAC1H,KACR,gEAAgE;QAChE,uEAAuE;QACvE,qGAAqG;SACpG2H,KAAK,CAACtL,UAAU;YAACgB;YAAa;SAAE,GAAG;YAAC;YAAGA;SAAY,EACnDyN,YAAY,CAAClP;IAEpB;IAEA,MAAM0H,iBAAiB,CAACoC;QACtB7G,gBAAgB6G;IAClB;IAEA,MAAMlC,iBAAiB;QACrB3E,gBAAgB;IAClB;IAEA,MAAMmM,eAAejR,MAAMkR,WAAW,CACpC,CAACC;QACC,IAAIA,aAAaA,UAAUC,iBAAiB,CAAClL,MAAM,EAAE;YACnD,MAAM,EAAEkL,mBAAmBC,WAAW,EAAE,GAAGF;YAC3ChO,QAAQ0F,KAAK3I,GAAG,CAACmR,WAAW,CAACA,YAAYnL,MAAM,GAAG,EAAE,EAAEjE,MAAMgI,SAAS,IAAI;QAC3E;IACF,GACA;QAAChI,MAAMgI,SAAS;KAAC;IAGnB;;;;;GAKC,GACD,MAAM4B,qBAAqB,CAACF;QAC1B,OAAO2F,wBAAwBC,QAAQ,CAAC5F;IAC1C;IAEA;;GAEC,GACD,MAAMG,uBAAuB;QAC3B,OAAOwF,wBAAwBpL,MAAM,KAAK;IAC5C;IAEA,MAAMoL,wBAAwB;QAC5B,OAAOtN,gBAAgBkC,MAAM,GAAG,IAAIlC,kBAAkBa,eAAe;YAACA;SAAa,GAAG,EAAE;IAC1F;IAEA,MAAM2K,eAAe,CAAC/I,OAA8BW;YAI3CX;QAHP,MAAM+K,SAAS/K,MAAMoG,gBAAgB,IAAIzF;QACzC,MAAMgC,SAAS3C,MAAM2C,MAAM;QAC3B,MAAMqI,SAAShL,MAAMqG,gBAAgB,IAAIrG,MAAMS,IAAI;QACnD,OAAOT,EAAAA,kCAAAA,MAAM1B,wBAAwB,cAA9B0B,sDAAAA,gCAAgCiL,SAAS,KAAI,CAAC,EAAEF,OAAO,EAAE,EAAEpI,OAAO,EAAE,EAAEqI,OAAO,CAAC,CAAC;IACxF;IAEA,MAAME,oBAAoB,CAAC7G;QACzB,6CAA6C,GAC7C,MAAM8G,aAAa9G,iBAAkBlI,CAAAA,SAASI,IAAI,GAAIpB,iBAAgB,IAAMgB,CAAAA,SAASE,KAAK,GAAIlB,iBAAgB;QAC9G,2EAA2E,GAC3E,MAAMiQ,eAAetO,qBAAsB,CAAA,IAAIA,kBAAiB;QAEhE,IAAIwG,eAAejJ,WAAWgR,UAAU,EAAE;YACxC,IAAI3Q,sBAAsBc,MAAMkE,iBAAiB,GAAG;gBAClD,uGAAuG;gBACvG,uEAAuE;gBACvE5D,gBAAgB;YAClB,OAAO,IAAIN,MAAM8D,QAAQ,KAAK,QAAQ;gBACpC,8DAA8D;gBAC9D,+DAA+D;gBAC/D1C,YAAYnC,YAAYe,MAAM8D,QAAQ,EAAE9D,MAAMC,WAAW;gBACzD,MAAM6P,aAAa,AAAC9L,CAAAA,KAAKC,MAAM,GAAG,AAACD,CAAAA,KAAKC,MAAM,GAAG,CAAA,IAAKpE,YAAW,IAAKuB;gBACtE,oFAAoF,GACpF,MAAM2O,WAAW,AAACtK,CAAAA,YAAYxB,MAAM,GAAG,AAACwB,CAAAA,YAAYxB,MAAM,GAAG,CAAA,IAAK2L,YAAW,IAAKE;gBAElF,IAAIH,cAAcI,UAAU;oBAC1B,4EAA4E;oBAC5EzP,gBAAgBX,oBAAoB,AAACgQ,CAAAA,aAAaI,QAAO,IAAK;gBAChE;YACF,OAAO,IAAI/P,MAAMgQ,IAAI,KAAK,YAAYvK,YAAYxB,MAAM,GAAG,GAAG;gBAC5D,wFAAwF;gBACxF,MAAMgM,iBAAiBN,aAAclK,CAAAA,YAAYxB,MAAM,GAAG,AAACwB,CAAAA,YAAYxB,MAAM,GAAG,CAAA,IAAK2L,YAAW;gBAChG,MAAMM,eAAeD,iBAAkBjM,CAAAA,KAAKC,MAAM,GAAG,AAACD,CAAAA,KAAKC,MAAM,GAAG,CAAA,IAAKpE,YAAW;gBACpF,MAAMiE,WAAW7E,YAAYe,MAAM8D,QAAQ,EAAE9D,MAAMC,WAAW,EAAEiQ;gBAChE,MAAMJ,aAAa,AAAC9L,CAAAA,KAAKC,MAAM,GAAG,AAACD,CAAAA,KAAKC,MAAM,GAAG,CAAA,IAAKpE,YAAW,IAAKiE;gBACtE,IAAIiM,WAAW,AAACtK,CAAAA,YAAYxB,MAAM,GAAG,AAACwB,CAAAA,YAAYxB,MAAM,GAAG,CAAA,IAAK2L,YAAW,IAAKE;gBAChF,MAAMK,UAAU,AAACR,CAAAA,aAAaI,QAAO,IAAK;gBAE1C,gGAAgG;gBAChG,MAAMK,OAAO/Q,2BAA2BoG,eAAe;gBACvDsK,WAAW,AAACtK,CAAAA,YAAYxB,MAAM,GAAG3C,kBAAiB,IAAK8O;gBACvD,MAAMC,UAAU,AAACV,CAAAA,aAAaI,QAAO,IAAK;gBAE1CzP,gBAAgBX,oBAAoBiH,KAAK3I,GAAG,CAAC,GAAG2I,KAAK0J,GAAG,CAACH,SAASE;YACpE;QACF;QAEA,OAAO;YACL,GAAG1P,QAAQ;YACXI,MAAMJ,SAASI,IAAI,GAAIT;YACvBO,OAAOF,SAASE,KAAK,GAAIP;QAC3B;IACF;IAEA,MAAMiQ,gBAAgB;QACpB,OAAO,CACLvQ,CAAAA,MAAMiF,IAAI,IACVjF,MAAMiF,IAAI,CAAChB,MAAM,GAAG,KACpBjE,MAAMiF,IAAI,CAAC+B,MAAM,CAAC,CAACwJ,OAAsCA,KAAK3L,MAAM,CAACZ,MAAM,EAAEA,MAAM,GAAG,CAAA;IAE1F;IAEA,MAAMwM,iBAAiB;QACrB,OACE,AAACzQ,CAAAA,MAAM0Q,UAAU,GAAG,CAAC,EAAE1Q,MAAM0Q,UAAU,CAAC,EAAE,CAAC,GAAG,EAAC,IAC/C,CAAC,wBAAwB,EAAEjQ,aAAawD,MAAM,CAAC,WAAW,EAAEzD,MAAMyD,MAAM,CAAC,YAAY,CAAC;IAE1F;IAEA,OAAO,CAACsM,gCACN,oBAAChR;QACE,GAAGS,KAAK;QACT0Q,YAAYD;QACZrM,QAAQ1D;QACRiQ,WAAWjS,WAAWoB,uBAAuB;QAC7CmI,cAAcA;QACd2I,YAAYnJ;QACZoJ,WAAW/I;QACXgJ,uBAAuBrQ;QACvB6H,YAAYA;QACZyI,aAAa/Q,MAAM+Q,WAAW,IAAI;QAClCC,WAAW9P;QACX+P,YAAY1H;QACZ2H,cAAczI;QACd0I,aAAanC;QACboC,mBAAmB/J;QACnBgK,kBAAkB3B;QACjB,GAAI5H,eAAejJ,WAAWgR,UAAU,IAAI;YAC3C9L,mBAAmBzC;YACnB4C,mBAAmB3C;QACrB,CAAC;QACD+P,UAAUlQ;QACVsC,cAAclC;QACd,oCAAoC,GACpC+P,UAAU;YACR,qBAAO,oBAAC5C,WAAG3N;QACb;uBAGF,oBAACwQ;QAAI/C,IAAIrO;QAAeqN,MAAM;QAASgE,OAAO;YAAE9H,SAAS;QAAI;QAAG2D,cAAY;;AAEhF,GAAG;AACHxN,wBAAwB4R,WAAW,GAAG"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { ChartTypes,
|
|
2
|
+
import { ChartTypes, getAccessibleDataObject, getColorContrast, getTypeOfAxis, resolveCSSVariables, XAxisTypes, YAxisType } from '../../utilities/index';
|
|
3
|
+
import { formatToLocaleString } from '@fluentui/chart-utilities';
|
|
3
4
|
import { CartesianChart } from '../CommonComponents/index';
|
|
4
5
|
import { useId } from '@fluentui/react-utilities';
|
|
5
6
|
import { tokens } from '@fluentui/react-theme';
|
|
@@ -159,7 +160,7 @@ export const HeatMapChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)
|
|
|
159
160
|
className: classes.text,
|
|
160
161
|
transform: `translate(${_xAxisScale.current.bandwidth() / 2}, ${_yAxisScale.current.bandwidth() / 2})`,
|
|
161
162
|
fill: foregroundColor
|
|
162
|
-
},
|
|
163
|
+
}, formatToLocaleString(dataPointObject.rectText, props.culture, props.useUTC)));
|
|
163
164
|
index++;
|
|
164
165
|
} else {
|
|
165
166
|
const dataPointObject = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["HeatMapChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HeatMapChartProps } from './HeatMapChart.types';\nimport { AccessibilityProps, Chart, HeatMapChartData, HeatMapChartDataPoint, Margins } from '../../types/index';\nimport {\n ChartTypes,\n convertToLocaleString,\n getAccessibleDataObject,\n getColorContrast,\n getTypeOfAxis,\n resolveCSSVariables,\n XAxisTypes,\n YAxisType,\n} from '../../utilities/index';\nimport { CartesianChart, ChartPopoverProps, ChildProps } from '../CommonComponents/index';\nimport { useId } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useHeatMapChartStyles } from './useHeatMapChartStyles.styles';\nimport { Legend, Legends } from '../Legends/index';\nimport { scaleLinear as d3ScaleLinear } from 'd3-scale';\nimport { format as d3Format } from 'd3-format';\nimport { timeFormat as d3TimeFormat } from 'd3-time-format';\n\ntype DataSet = {\n dataSet: RectanglesGraphData;\n yAxisPoints: string[];\n xAxisPoints: string[];\n};\ntype FlattenData = HeatMapChartDataPoint & {\n legend: string;\n};\ntype RectanglesGraphData = { [key: string]: FlattenData[] };\n\nexport const HeatMapChart: React.FunctionComponent<HeatMapChartProps> = React.forwardRef<\n HTMLDivElement,\n HeatMapChartProps\n>((props, forwardedRef) => {\n const classes = useHeatMapChartStyles(props);\n const _stringXAxisDataPoints = React.useRef<string[]>([]);\n const _stringYAxisDataPoints = React.useRef<string[]>([]);\n const _dataSet = React.useRef<RectanglesGraphData>({});\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _colorScale = React.useRef<any>();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _xAxisScale = React.useRef<any>();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _yAxisScale = React.useRef<any>();\n const _xAxisType = React.useRef<XAxisTypes>();\n const _yAxisType = React.useRef<YAxisType>();\n const _calloutAnchorPoint = React.useRef<FlattenData | null>(null);\n const _emptyChartId = useId('_HeatMap_empty');\n const _margins = React.useRef<Margins>({});\n const cartesianChartRef = React.useRef<Chart>(null);\n\n const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n const [calloutLegend, setCalloutLegend] = React.useState<string>('');\n const [calloutTextColor, setCalloutTextColor] = React.useState<string>('');\n const [calloutYValue, setCalloutYValue] = React.useState<string>('');\n const [ratio, setRatio] = React.useState<[number, number]>();\n const [descriptionMessage, setDescriptionMessage] = React.useState<string>('');\n const [callOutAccessibilityData, setCallOutAccessibilityData] = React.useState<AccessibilityProps>();\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: cartesianChartRef.current?.chartContainer ?? null,\n }),\n [],\n );\n\n const _getXandY = (): { x: string | Date | number; y: string | Date | number } => {\n let x: string | Date | number = '';\n let y: string | Date | number = '';\n props.data.forEach((item: HeatMapChartData) => {\n if (item.data && item.data.length > 0) {\n x = item.data[0].x;\n y = item.data[0].y;\n return { x, y };\n }\n });\n return { x, y };\n };\n\n const _getMargins = (margins: Margins) => {\n _margins.current = margins;\n };\n\n const _getOpacity = (legendTitle: string): string => {\n const opacity = _legendHighlighted(legendTitle) || _noLegendHighlighted() ? '1' : '0.1';\n return opacity;\n };\n\n const _onRectFocus = (id: string, data: FlattenData, focusEvent: React.FocusEvent<SVGGElement>): void => {\n const boundingRect = focusEvent.currentTarget.getBoundingClientRect();\n const clientX = boundingRect.left + boundingRect.width / 2;\n const clientY = boundingRect.top + boundingRect.height / 2;\n updatePosition(clientX, clientY);\n /** Show the callout if highlighted rectangle is focused and Hide it if unhighlighted rectangle is focused */\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setCalloutYValue(`${data.rectText}`);\n setCalloutTextColor(Number.isNaN(data.value) ? tokens.colorNeutralForeground1 : _colorScale.current(data.value));\n setCalloutLegend(data.legend);\n setRatio(data.ratio);\n setDescriptionMessage(data.descriptionMessage || '');\n setCallOutAccessibilityData(data.callOutAccessibilityData);\n };\n\n const _onRectMouseOver = (id: string, data: FlattenData, mouseEvent: React.MouseEvent<SVGGElement>): void => {\n mouseEvent.persist();\n if (_calloutAnchorPoint.current !== data) {\n _calloutAnchorPoint.current = data;\n updatePosition(mouseEvent.clientX, mouseEvent.clientY);\n /** Show the callout if highlighted rectangle is hovered and Hide it if unhighlighted rectangle is hovered */\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setCalloutYValue(`${data.rectText}`);\n setCalloutTextColor(Number.isNaN(data.value) ? tokens.colorNeutralForeground1 : _colorScale.current(data.value));\n setCalloutLegend(data.legend);\n setRatio(data.ratio);\n setDescriptionMessage(data.descriptionMessage || '');\n setCallOutAccessibilityData(data.callOutAccessibilityData);\n }\n };\n\n const _onRectBlurOrMouseOut = (): void => {\n /**/\n };\n\n const _handleChartMouseLeave = (): void => {\n _calloutAnchorPoint.current = null;\n setPopoverOpen(false);\n };\n\n const _getInvertedTextColor = (color: string): string => {\n return color === tokens.colorNeutralForeground1 ? tokens.colorNeutralBackground1 : tokens.colorNeutralForeground1;\n };\n\n /**\n * This is the function which is responsible for\n * drawing the rectangle in the graph and also\n * attaching dom events to that rectangles\n */\n const _createRectangles = (): React.ReactNode => {\n const rectangles: JSX.Element[] = [];\n const yAxisDataPoints = _stringYAxisDataPoints.current.slice().reverse();\n /**\n * yAxisDataPoint is noting but the DataPoint\n * which will be rendered on the y-axis\n */\n yAxisDataPoints.forEach((yAxisDataPoint: string) => {\n let index = 0;\n _stringXAxisDataPoints.current.forEach((xAxisDataPoint: string) => {\n let rectElement: JSX.Element;\n const id = `x${xAxisDataPoint}y${yAxisDataPoint}`;\n if (\n _dataSet.current[yAxisDataPoint][index]?.x === xAxisDataPoint &&\n typeof _dataSet.current[yAxisDataPoint][index]?.value === 'number'\n ) {\n /**\n * dataPointObject is an object where it contains information on single\n * data point such as x, y , value, rectText property of the rectangle\n */\n const dataPointObject = _dataSet.current[yAxisDataPoint][index];\n let styleRules = '';\n let foregroundColor = tokens.colorNeutralForeground1;\n if (cartesianChartRef.current?.chartContainer) {\n styleRules = resolveCSSVariables(cartesianChartRef.current.chartContainer, foregroundColor);\n }\n const contrastRatio = getColorContrast(styleRules, _colorScale.current(dataPointObject.value));\n if (contrastRatio < 3) {\n foregroundColor = _getInvertedTextColor(foregroundColor);\n }\n rectElement = (\n <g\n key={id}\n role=\"img\"\n aria-label={_getAriaLabel(dataPointObject)}\n tabIndex={_legendHighlighted(dataPointObject.legend) || _noLegendHighlighted() ? 0 : -1}\n fillOpacity={_getOpacity(dataPointObject.legend)}\n transform={`translate(${_xAxisScale.current(dataPointObject.x)}, ${_yAxisScale.current(\n dataPointObject.y,\n )})`}\n onFocus={e => _onRectFocus(id, dataPointObject, e)}\n onBlur={_onRectBlurOrMouseOut}\n onMouseOver={e => _onRectMouseOver(id, dataPointObject, e)}\n onMouseOut={_onRectBlurOrMouseOut}\n >\n <rect\n fill={_colorScale.current(dataPointObject.value)}\n width={_xAxisScale.current.bandwidth()}\n height={_yAxisScale.current.bandwidth()}\n onClick={dataPointObject.onClick}\n />\n <text\n dominantBaseline={'middle'}\n textAnchor={'middle'}\n className={classes.text}\n transform={`translate(${_xAxisScale.current.bandwidth() / 2}, ${_yAxisScale.current.bandwidth() / 2})`}\n fill={foregroundColor}\n >\n {convertToLocaleString(dataPointObject.rectText, props.culture)}\n </text>\n </g>\n );\n index++;\n } else {\n const dataPointObject: FlattenData = {\n x: xAxisDataPoint,\n y: yAxisDataPoint,\n value: NaN,\n rectText: 'No data available',\n legend: '',\n };\n rectElement = (\n <g\n key={id}\n role=\"img\"\n aria-label={_getAriaLabel(dataPointObject)}\n tabIndex={_noLegendHighlighted() ? 0 : -1}\n transform={`translate(${_xAxisScale.current(dataPointObject.x)}, ${_yAxisScale.current(\n dataPointObject.y,\n )})`}\n onFocus={e => _onRectFocus(id, dataPointObject, e)}\n onBlur={_onRectBlurOrMouseOut}\n onMouseOver={e => _onRectMouseOver(id, dataPointObject, e)}\n onMouseOut={_onRectBlurOrMouseOut}\n >\n <rect\n fill=\"transparent\"\n width={_xAxisScale.current.bandwidth()}\n height={_yAxisScale.current.bandwidth()}\n />\n </g>\n );\n }\n rectangles.push(rectElement);\n });\n });\n return rectangles;\n };\n /**\n * when the legend is hovered we need to highlight\n * all the rectangles which fall under that category\n * and un-highlight the rest of them\n * @param legendTitle\n */\n const _onLegendHover = (legendTitle: string): void => {\n setActiveLegend(legendTitle);\n };\n\n /**\n * when the mouse is out from the legend , we need\n * to show the graph in initial mode.\n */\n const _onLegendLeave = (): void => {\n setActiveLegend('');\n };\n /**\n * @param legendTitle\n * when the legend is clicked we need to highlight\n * all the rectangles which fall under that category\n * and un highlight the rest of them\n */\n const _onLegendClick = (legendTitle: string): void => {\n /**\n * check if the legend is already selceted,\n * if yes, un-select the legend, else\n * set the selected legend state to legendTitle\n */\n if (selectedLegend === legendTitle) {\n setSelectedLegend('');\n } else {\n setSelectedLegend(legendTitle);\n }\n };\n const _createLegendBars = (): JSX.Element => {\n const { data, legendProps } = props;\n const legends: Legend[] = [];\n data.forEach((item: HeatMapChartData) => {\n const legend: Legend = {\n title: item.legend,\n color: _colorScale.current(item.value),\n action: () => {\n _onLegendClick(item.legend);\n },\n hoverAction: () => {\n _handleChartMouseLeave();\n _onLegendHover(item.legend);\n },\n onMouseOutAction: () => {\n _onLegendLeave();\n },\n };\n legends.push(legend);\n });\n return <Legends {...legendProps} legends={legends} />;\n };\n\n const _getColorScale = () => {\n const { domainValuesForColorScale, rangeValuesForColorScale } = props;\n return d3ScaleLinear()\n .domain(domainValuesForColorScale)\n .range(rangeValuesForColorScale as unknown as number[]);\n };\n\n const _getXIndex = (value: string | Date | number): string => {\n if (_xAxisType.current === XAxisTypes.DateAxis) {\n return `${(value as Date).getTime()}`;\n } else if (_xAxisType.current === XAxisTypes.StringAxis) {\n return value as string;\n } else if (_xAxisType.current === XAxisTypes.NumericAxis) {\n return `${value}`;\n } else {\n return '';\n }\n };\n const _getYIndex = (value: string | Date | number): string => {\n if (_yAxisType.current === YAxisType.DateAxis) {\n return `${(value as Date).getTime()}`;\n } else if (_yAxisType.current === YAxisType.StringAxis) {\n return value as string;\n } else if (_yAxisType.current === YAxisType.NumericAxis) {\n return `${value}`;\n } else {\n return '';\n }\n };\n\n const { xAxisStringFormatter } = props;\n const _getFormattedLabelForXAxisDataPoint = React.useCallback(\n (point: string): string => {\n return xAxisStringFormatter ? xAxisStringFormatter(point) : point;\n },\n [xAxisStringFormatter],\n );\n\n const { yAxisStringFormatter } = props;\n const _getFormattedLabelForYAxisDataPoint = React.useCallback(\n (point: string): string => {\n return yAxisStringFormatter ? yAxisStringFormatter(point) : point;\n },\n [yAxisStringFormatter],\n );\n\n /**\n * This function will return the final sorted and formatted x-axis points\n * which will be rendered on the x-axis\n * @param points\n * @returns x-axis points\n */\n const _getXAxisDataPoints = React.useCallback(\n (points: { [key: string]: '1' }): string[] => {\n let xAxisPoints: string[] = [];\n const unFormattedXAxisDataPoints = Object.keys(points).sort((a: string, b: string) => {\n if (_xAxisType.current === XAxisTypes.DateAxis || _xAxisType.current === XAxisTypes.NumericAxis) {\n return +a - +b;\n } else {\n return props.sortOrder === 'none' ? 0 : a.toLowerCase() > b.toLowerCase() ? 1 : -1;\n }\n });\n xAxisPoints = unFormattedXAxisDataPoints.map((xPoint: string) => {\n if (_xAxisType.current === XAxisTypes.DateAxis) {\n return _getStringFormattedDate(xPoint, props.xAxisDateFormatString);\n } else if (_xAxisType.current === XAxisTypes.NumericAxis) {\n return _getStringFormattedNumber(xPoint, props.xAxisNumberFormatString);\n } else {\n return _getFormattedLabelForXAxisDataPoint(xPoint);\n }\n });\n\n return xAxisPoints;\n },\n [_getFormattedLabelForXAxisDataPoint, props.sortOrder, props.xAxisDateFormatString, props.xAxisNumberFormatString],\n );\n\n /**\n * This function will return the final sorted and formatted y-axis points\n * which will be rendered on the y-axis\n * @param points\n * @returns yaxis points\n */\n const _getYAxisDataPoints = React.useCallback(\n (points: { [key: string]: '1' }): string[] => {\n let yAxisPoints: string[] = [];\n const unFormattedYAxisDataPoints = Object.keys(points).sort((a: string, b: string) => {\n if (_yAxisType.current === YAxisType.DateAxis || _yAxisType.current === YAxisType.NumericAxis) {\n return +a - +b;\n } else {\n return props.sortOrder === 'none' ? 0 : a.toLowerCase() > b.toLowerCase() ? 1 : -1;\n }\n });\n yAxisPoints = unFormattedYAxisDataPoints.map((yPoint: string) => {\n if (_yAxisType.current === YAxisType.DateAxis) {\n return _getStringFormattedDate(yPoint, props.yAxisDateFormatString);\n } else if (_yAxisType.current === YAxisType.NumericAxis) {\n return _getStringFormattedNumber(yPoint, props.yAxisNumberFormatString);\n } else {\n return _getFormattedLabelForYAxisDataPoint(yPoint);\n }\n });\n\n return yAxisPoints;\n },\n [_getFormattedLabelForYAxisDataPoint, props.sortOrder, props.yAxisDateFormatString, props.yAxisNumberFormatString],\n );\n\n /**\n * This will create a new data set based on the prop\n * @data\n * We will be using This data set to contsruct our rectangles\n * in the chart, we use this data set becuase, when we loop in this\n * data and build the heat map, it will support accessibility as\n * specified in the figma\n */\n\n const _createNewDataSet = React.useCallback(\n (\n data: HeatMapChartData[],\n xAxisDateFormatString: string | undefined,\n xAxisNumberFormatString: string | undefined,\n yAxisDateFormatString: string | undefined,\n yAxisNumberFormatString: string | undefined,\n ): DataSet => {\n /**\n * please do not destructure any of the props here,\n * instead send them as parameter to this functions so that\n * this functions get called whenever the prop changes\n */\n const flattenData: FlattenData[] = [];\n /**\n * below for each loop will store all the datapoints in the one array.\n * basically it will flatten the nestesd array (data prop) into single array\n * of object. where each object contains x, y, rectText , value and legend propety of single\n * data point.\n */\n data.forEach((item: HeatMapChartData) => {\n item.data.forEach((point: HeatMapChartDataPoint) => {\n flattenData.push({ ...point, legend: item.legend });\n });\n });\n const yPoints: RectanglesGraphData = {};\n const uniqueYPoints: { [key: string]: '1' } = {};\n const uniqueXPoints: { [key: string]: '1' } = {};\n flattenData.forEach((item: FlattenData) => {\n const posX = _getXIndex(item.x);\n const posY = _getYIndex(item.y);\n\n uniqueXPoints[posX] = '1';\n uniqueYPoints[posY] = '1';\n /** we will check if the property(posY) is already there in object, if Yes,\n * then we will append the item in the Array related to the pos, if not\n * then we will simply append the item in the new Array and\n * assign that array to the property (posY) in the Object\n * and finally we will get the array of Objects associated to each\n * property (which is nothing but y data point) and object in the\n * array are noting but x data points associated to the property y\n */\n if (yPoints[posY]) {\n yPoints[posY] = [...yPoints[posY], item];\n } else {\n yPoints[posY] = [item];\n }\n });\n /**\n * we will now sort(ascending) the array's of y data point based on the x value\n * sorting is important to achive the accessibility order of the\n * rectangles and then format the x and y datapoints respectively\n */\n Object.keys(yPoints).forEach((item: string) => {\n yPoints[item]\n .sort((a: HeatMapChartDataPoint, b: HeatMapChartDataPoint) => {\n if (_xAxisType.current === XAxisTypes.StringAxis) {\n return props.sortOrder === 'none'\n ? 0\n : (a.x as string).toLowerCase() > (b.x as string).toLowerCase()\n ? 1\n : -1;\n } else if (_xAxisType.current === XAxisTypes.DateAxis) {\n return (a.x as Date).getTime() - (b.x as Date).getTime();\n } else if (_xAxisType.current === XAxisTypes.NumericAxis) {\n return +(a.x as string) > +(b.x as string) ? 1 : -1;\n } else {\n return a.x > b.x ? 1 : -1;\n }\n })\n .forEach((datapoint: HeatMapChartDataPoint) => {\n if (_xAxisType.current === XAxisTypes.DateAxis) {\n datapoint.x = _getStringFormattedDate(datapoint.x as string, xAxisDateFormatString);\n }\n if (_xAxisType.current === XAxisTypes.NumericAxis) {\n datapoint.x = _getStringFormattedNumber(datapoint.x as string, xAxisNumberFormatString);\n }\n if (_xAxisType.current === XAxisTypes.StringAxis) {\n datapoint.x = _getFormattedLabelForXAxisDataPoint(datapoint.x as string);\n }\n if (_yAxisType.current === YAxisType.DateAxis) {\n datapoint.y = _getStringFormattedDate(datapoint.y as string, yAxisDateFormatString);\n }\n if (_yAxisType.current === YAxisType.NumericAxis) {\n datapoint.y = _getStringFormattedNumber(datapoint.y as string, yAxisNumberFormatString);\n }\n if (_yAxisType.current === YAxisType.StringAxis) {\n datapoint.y = _getFormattedLabelForYAxisDataPoint(datapoint.y as string);\n }\n });\n });\n /**\n * if y-axis data points are of type date or number or if we have string formatter,\n * then we need to change data points to their respective string\n * format, becuase in the private variable this._stringYAxisDatapoints, points will be stored in\n * string format. and in here `yPoint` are not so we need to change, so that\n * function `this._createRectangles` should work perfetcly while looping, and if we don't change\n * then `this._createRectangles` will fail while looping, causing the error\n * Cannot read property 'forEach' of undefined\n */\n\n Object.keys(yPoints).forEach((yPoint: string) => {\n if (_yAxisType.current === YAxisType.DateAxis) {\n yPoints[_getStringFormattedDate(yPoint, yAxisDateFormatString)] = yPoints[yPoint];\n } else if (_yAxisType.current === YAxisType.NumericAxis) {\n yPoints[`${_getStringFormattedNumber(yPoint, yAxisNumberFormatString)}`] = yPoints[yPoint];\n } else {\n yPoints[_getFormattedLabelForYAxisDataPoint(yPoint)] = yPoints[yPoint];\n }\n });\n /**\n * assigning new data set\n */\n const dataSet = yPoints;\n /**\n * These are the Y axis data points which will get rendered in the\n * Y axis in graph\n */\n const yAxisPoints = _getYAxisDataPoints(uniqueYPoints);\n /**\n * These are the x axis data points which will get rendered in the\n * x axis in the graph\n */\n\n const xAxisPoints = _getXAxisDataPoints(uniqueXPoints);\n return {\n dataSet,\n yAxisPoints,\n xAxisPoints,\n };\n },\n [\n _getFormattedLabelForXAxisDataPoint,\n _getFormattedLabelForYAxisDataPoint,\n _getXAxisDataPoints,\n _getYAxisDataPoints,\n props.sortOrder,\n ],\n );\n\n const _getStringFormattedDate = (point: string, formatString?: string): string => {\n const date = new Date();\n date.setTime(+point);\n return d3TimeFormat(formatString || '%b/%d')(date);\n };\n\n const _getStringFormattedNumber = (point: string, formatString?: string): string => {\n return d3Format(formatString || '.2~s')(+point);\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 const _legendHighlighted = (legendTitle: string) => {\n return selectedLegend === legendTitle || (selectedLegend === '' && activeLegend === legendTitle);\n };\n\n /**\n * This function checks if none of the legends is selected or hovered.\n */\n const _noLegendHighlighted = () => {\n return selectedLegend === '' && activeLegend === '';\n };\n\n const _getAriaLabel = (point: FlattenData): string => {\n const xValue = point.x;\n const yValue = point.y;\n const legend = point.legend;\n const zValue = point.ratio ? `${point.ratio[0]}/${point.ratio[1]}` : point.rectText || point.value;\n const description = point.descriptionMessage;\n return (\n point.callOutAccessibilityData?.ariaLabel ||\n `${xValue}, ${yValue}. ${legend}, ${zValue}.` + (description ? ` ${description}.` : '')\n );\n };\n\n const _isChartEmpty = (): boolean => {\n return !(props.data && props.data.length > 0);\n };\n\n const _getChartTitle = (): string => {\n const { chartTitle } = props;\n const numDataPoints = props.data.reduce((acc, curr) => acc + curr.data.length, 0);\n return (chartTitle ? `${chartTitle}. ` : '') + `Heat map chart with ${numDataPoints} data points. `;\n };\n\n const 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 }\n };\n\n const { x, y } = _getXandY();\n _xAxisType.current = getTypeOfAxis(x, true) as XAxisTypes;\n _yAxisType.current = getTypeOfAxis(y, false) as YAxisType;\n const { data, xAxisDateFormatString, xAxisNumberFormatString, yAxisDateFormatString, yAxisNumberFormatString } =\n props;\n _colorScale.current = _getColorScale();\n const { dataSet, xAxisPoints, yAxisPoints } = React.useMemo(\n () =>\n _createNewDataSet(\n data,\n xAxisDateFormatString,\n xAxisNumberFormatString,\n yAxisDateFormatString,\n yAxisNumberFormatString,\n ),\n [\n _createNewDataSet,\n data,\n xAxisDateFormatString,\n xAxisNumberFormatString,\n yAxisDateFormatString,\n yAxisNumberFormatString,\n ],\n );\n _dataSet.current = dataSet;\n _stringYAxisDataPoints.current = yAxisPoints;\n _stringXAxisDataPoints.current = xAxisPoints;\n const calloutProps: ChartPopoverProps = {\n ...props.calloutProps,\n isPopoverOpen,\n YValue: calloutYValue,\n legend: calloutLegend,\n color: calloutTextColor,\n ratio,\n descriptionMessage,\n clickPosition,\n ...getAccessibleDataObject(callOutAccessibilityData, 'text', false),\n };\n const tickParams = {\n tickValues: props.tickValues,\n tickFormat: props.tickFormat,\n };\n return !_isChartEmpty() ? (\n <CartesianChart\n {...props}\n chartTitle={_getChartTitle()}\n points={data}\n chartType={ChartTypes.HeatMapChart}\n xAxisType={XAxisTypes.StringAxis}\n yAxisType={YAxisType.StringAxis}\n calloutProps={calloutProps}\n datasetForXAxisDomain={_stringXAxisDataPoints.current}\n stringDatasetForYAxisDomain={_stringYAxisDataPoints.current}\n getmargins={_getMargins}\n xAxisTickCount={_stringXAxisDataPoints.current.length}\n xAxistickSize={0}\n xAxisPadding={0.02}\n yAxisPadding={0.02}\n legendBars={_createLegendBars()}\n onChartMouseLeave={_handleChartMouseLeave}\n componentRef={cartesianChartRef}\n tickParams={tickParams}\n /* eslint-disable react/jsx-no-bind */\n children={(p: ChildProps) => {\n _xAxisScale.current = p.xScale;\n _yAxisScale.current = p.yScale;\n return _createRectangles();\n }}\n />\n ) : (\n <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n});\n"],"names":["React","ChartTypes","convertToLocaleString","getAccessibleDataObject","getColorContrast","getTypeOfAxis","resolveCSSVariables","XAxisTypes","YAxisType","CartesianChart","useId","tokens","useHeatMapChartStyles","Legends","scaleLinear","d3ScaleLinear","format","d3Format","timeFormat","d3TimeFormat","HeatMapChart","forwardRef","props","forwardedRef","classes","_stringXAxisDataPoints","useRef","_stringYAxisDataPoints","_dataSet","_colorScale","_xAxisScale","_yAxisScale","_xAxisType","_yAxisType","_calloutAnchorPoint","_emptyChartId","_margins","cartesianChartRef","selectedLegend","setSelectedLegend","useState","activeLegend","setActiveLegend","isPopoverOpen","setPopoverOpen","calloutLegend","setCalloutLegend","calloutTextColor","setCalloutTextColor","calloutYValue","setCalloutYValue","ratio","setRatio","descriptionMessage","setDescriptionMessage","callOutAccessibilityData","setCallOutAccessibilityData","clickPosition","setClickPosition","x","y","useImperativeHandle","componentRef","chartContainer","current","_getXandY","data","forEach","item","length","_getMargins","margins","_getOpacity","legendTitle","opacity","_legendHighlighted","_noLegendHighlighted","_onRectFocus","id","focusEvent","boundingRect","currentTarget","getBoundingClientRect","clientX","left","width","clientY","top","height","updatePosition","legend","rectText","Number","isNaN","value","colorNeutralForeground1","_onRectMouseOver","mouseEvent","persist","_onRectBlurOrMouseOut","_handleChartMouseLeave","_getInvertedTextColor","color","colorNeutralBackground1","_createRectangles","rectangles","yAxisDataPoints","slice","reverse","yAxisDataPoint","index","xAxisDataPoint","rectElement","dataPointObject","styleRules","foregroundColor","contrastRatio","g","key","role","aria-label","_getAriaLabel","tabIndex","fillOpacity","transform","onFocus","e","onBlur","onMouseOver","onMouseOut","rect","fill","bandwidth","onClick","text","dominantBaseline","textAnchor","className","culture","NaN","push","_onLegendHover","_onLegendLeave","_onLegendClick","_createLegendBars","legendProps","legends","title","action","hoverAction","onMouseOutAction","_getColorScale","domainValuesForColorScale","rangeValuesForColorScale","domain","range","_getXIndex","DateAxis","getTime","StringAxis","NumericAxis","_getYIndex","xAxisStringFormatter","_getFormattedLabelForXAxisDataPoint","useCallback","point","yAxisStringFormatter","_getFormattedLabelForYAxisDataPoint","_getXAxisDataPoints","points","xAxisPoints","unFormattedXAxisDataPoints","Object","keys","sort","a","b","sortOrder","toLowerCase","map","xPoint","_getStringFormattedDate","xAxisDateFormatString","_getStringFormattedNumber","xAxisNumberFormatString","_getYAxisDataPoints","yAxisPoints","unFormattedYAxisDataPoints","yPoint","yAxisDateFormatString","yAxisNumberFormatString","_createNewDataSet","flattenData","yPoints","uniqueYPoints","uniqueXPoints","posX","posY","datapoint","dataSet","formatString","date","Date","setTime","xValue","yValue","zValue","description","ariaLabel","_isChartEmpty","_getChartTitle","chartTitle","numDataPoints","reduce","acc","curr","newX","newY","threshold","distance","Math","sqrt","pow","useMemo","calloutProps","YValue","tickParams","tickValues","tickFormat","chartType","xAxisType","yAxisType","datasetForXAxisDomain","stringDatasetForYAxisDomain","getmargins","xAxisTickCount","xAxistickSize","xAxisPadding","yAxisPadding","legendBars","onChartMouseLeave","children","p","xScale","yScale","div","style"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["HeatMapChart.tsx"],"sourcesContent":["import * as React from 'react';\nimport { HeatMapChartProps } from './HeatMapChart.types';\nimport { AccessibilityProps, Chart, HeatMapChartData, HeatMapChartDataPoint, Margins } from '../../types/index';\nimport {\n ChartTypes,\n getAccessibleDataObject,\n getColorContrast,\n getTypeOfAxis,\n resolveCSSVariables,\n XAxisTypes,\n YAxisType,\n} from '../../utilities/index';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { CartesianChart, ChartPopoverProps, ChildProps } from '../CommonComponents/index';\nimport { useId } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { useHeatMapChartStyles } from './useHeatMapChartStyles.styles';\nimport { Legend, Legends } from '../Legends/index';\nimport { scaleLinear as d3ScaleLinear } from 'd3-scale';\nimport { format as d3Format } from 'd3-format';\nimport { timeFormat as d3TimeFormat } from 'd3-time-format';\n\ntype DataSet = {\n dataSet: RectanglesGraphData;\n yAxisPoints: string[];\n xAxisPoints: string[];\n};\ntype FlattenData = HeatMapChartDataPoint & {\n legend: string;\n};\ntype RectanglesGraphData = { [key: string]: FlattenData[] };\n\nexport const HeatMapChart: React.FunctionComponent<HeatMapChartProps> = React.forwardRef<\n HTMLDivElement,\n HeatMapChartProps\n>((props, forwardedRef) => {\n const classes = useHeatMapChartStyles(props);\n const _stringXAxisDataPoints = React.useRef<string[]>([]);\n const _stringYAxisDataPoints = React.useRef<string[]>([]);\n const _dataSet = React.useRef<RectanglesGraphData>({});\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _colorScale = React.useRef<any>();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _xAxisScale = React.useRef<any>();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const _yAxisScale = React.useRef<any>();\n const _xAxisType = React.useRef<XAxisTypes>();\n const _yAxisType = React.useRef<YAxisType>();\n const _calloutAnchorPoint = React.useRef<FlattenData | null>(null);\n const _emptyChartId = useId('_HeatMap_empty');\n const _margins = React.useRef<Margins>({});\n const cartesianChartRef = React.useRef<Chart>(null);\n\n const [selectedLegend, setSelectedLegend] = React.useState<string>('');\n const [activeLegend, setActiveLegend] = React.useState<string>('');\n const [isPopoverOpen, setPopoverOpen] = React.useState<boolean>(false);\n const [calloutLegend, setCalloutLegend] = React.useState<string>('');\n const [calloutTextColor, setCalloutTextColor] = React.useState<string>('');\n const [calloutYValue, setCalloutYValue] = React.useState<string>('');\n const [ratio, setRatio] = React.useState<[number, number]>();\n const [descriptionMessage, setDescriptionMessage] = React.useState<string>('');\n const [callOutAccessibilityData, setCallOutAccessibilityData] = React.useState<AccessibilityProps>();\n const [clickPosition, setClickPosition] = React.useState({ x: 0, y: 0 });\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: cartesianChartRef.current?.chartContainer ?? null,\n }),\n [],\n );\n\n const _getXandY = (): { x: string | Date | number; y: string | Date | number } => {\n let x: string | Date | number = '';\n let y: string | Date | number = '';\n props.data.forEach((item: HeatMapChartData) => {\n if (item.data && item.data.length > 0) {\n x = item.data[0].x;\n y = item.data[0].y;\n return { x, y };\n }\n });\n return { x, y };\n };\n\n const _getMargins = (margins: Margins) => {\n _margins.current = margins;\n };\n\n const _getOpacity = (legendTitle: string): string => {\n const opacity = _legendHighlighted(legendTitle) || _noLegendHighlighted() ? '1' : '0.1';\n return opacity;\n };\n\n const _onRectFocus = (id: string, data: FlattenData, focusEvent: React.FocusEvent<SVGGElement>): void => {\n const boundingRect = focusEvent.currentTarget.getBoundingClientRect();\n const clientX = boundingRect.left + boundingRect.width / 2;\n const clientY = boundingRect.top + boundingRect.height / 2;\n updatePosition(clientX, clientY);\n /** Show the callout if highlighted rectangle is focused and Hide it if unhighlighted rectangle is focused */\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setCalloutYValue(`${data.rectText}`);\n setCalloutTextColor(Number.isNaN(data.value) ? tokens.colorNeutralForeground1 : _colorScale.current(data.value));\n setCalloutLegend(data.legend);\n setRatio(data.ratio);\n setDescriptionMessage(data.descriptionMessage || '');\n setCallOutAccessibilityData(data.callOutAccessibilityData);\n };\n\n const _onRectMouseOver = (id: string, data: FlattenData, mouseEvent: React.MouseEvent<SVGGElement>): void => {\n mouseEvent.persist();\n if (_calloutAnchorPoint.current !== data) {\n _calloutAnchorPoint.current = data;\n updatePosition(mouseEvent.clientX, mouseEvent.clientY);\n /** Show the callout if highlighted rectangle is hovered and Hide it if unhighlighted rectangle is hovered */\n setPopoverOpen(selectedLegend === '' || selectedLegend === data.legend);\n setCalloutYValue(`${data.rectText}`);\n setCalloutTextColor(Number.isNaN(data.value) ? tokens.colorNeutralForeground1 : _colorScale.current(data.value));\n setCalloutLegend(data.legend);\n setRatio(data.ratio);\n setDescriptionMessage(data.descriptionMessage || '');\n setCallOutAccessibilityData(data.callOutAccessibilityData);\n }\n };\n\n const _onRectBlurOrMouseOut = (): void => {\n /**/\n };\n\n const _handleChartMouseLeave = (): void => {\n _calloutAnchorPoint.current = null;\n setPopoverOpen(false);\n };\n\n const _getInvertedTextColor = (color: string): string => {\n return color === tokens.colorNeutralForeground1 ? tokens.colorNeutralBackground1 : tokens.colorNeutralForeground1;\n };\n\n /**\n * This is the function which is responsible for\n * drawing the rectangle in the graph and also\n * attaching dom events to that rectangles\n */\n const _createRectangles = (): React.ReactNode => {\n const rectangles: JSX.Element[] = [];\n const yAxisDataPoints = _stringYAxisDataPoints.current.slice().reverse();\n /**\n * yAxisDataPoint is noting but the DataPoint\n * which will be rendered on the y-axis\n */\n yAxisDataPoints.forEach((yAxisDataPoint: string) => {\n let index = 0;\n _stringXAxisDataPoints.current.forEach((xAxisDataPoint: string) => {\n let rectElement: JSX.Element;\n const id = `x${xAxisDataPoint}y${yAxisDataPoint}`;\n if (\n _dataSet.current[yAxisDataPoint][index]?.x === xAxisDataPoint &&\n typeof _dataSet.current[yAxisDataPoint][index]?.value === 'number'\n ) {\n /**\n * dataPointObject is an object where it contains information on single\n * data point such as x, y , value, rectText property of the rectangle\n */\n const dataPointObject = _dataSet.current[yAxisDataPoint][index];\n let styleRules = '';\n let foregroundColor = tokens.colorNeutralForeground1;\n if (cartesianChartRef.current?.chartContainer) {\n styleRules = resolveCSSVariables(cartesianChartRef.current.chartContainer, foregroundColor);\n }\n const contrastRatio = getColorContrast(styleRules, _colorScale.current(dataPointObject.value));\n if (contrastRatio < 3) {\n foregroundColor = _getInvertedTextColor(foregroundColor);\n }\n rectElement = (\n <g\n key={id}\n role=\"img\"\n aria-label={_getAriaLabel(dataPointObject)}\n tabIndex={_legendHighlighted(dataPointObject.legend) || _noLegendHighlighted() ? 0 : -1}\n fillOpacity={_getOpacity(dataPointObject.legend)}\n transform={`translate(${_xAxisScale.current(dataPointObject.x)}, ${_yAxisScale.current(\n dataPointObject.y,\n )})`}\n onFocus={e => _onRectFocus(id, dataPointObject, e)}\n onBlur={_onRectBlurOrMouseOut}\n onMouseOver={e => _onRectMouseOver(id, dataPointObject, e)}\n onMouseOut={_onRectBlurOrMouseOut}\n >\n <rect\n fill={_colorScale.current(dataPointObject.value)}\n width={_xAxisScale.current.bandwidth()}\n height={_yAxisScale.current.bandwidth()}\n onClick={dataPointObject.onClick}\n />\n <text\n dominantBaseline={'middle'}\n textAnchor={'middle'}\n className={classes.text}\n transform={`translate(${_xAxisScale.current.bandwidth() / 2}, ${_yAxisScale.current.bandwidth() / 2})`}\n fill={foregroundColor}\n >\n {formatToLocaleString(dataPointObject.rectText, props.culture, props.useUTC)}\n </text>\n </g>\n );\n index++;\n } else {\n const dataPointObject: FlattenData = {\n x: xAxisDataPoint,\n y: yAxisDataPoint,\n value: NaN,\n rectText: 'No data available',\n legend: '',\n };\n rectElement = (\n <g\n key={id}\n role=\"img\"\n aria-label={_getAriaLabel(dataPointObject)}\n tabIndex={_noLegendHighlighted() ? 0 : -1}\n transform={`translate(${_xAxisScale.current(dataPointObject.x)}, ${_yAxisScale.current(\n dataPointObject.y,\n )})`}\n onFocus={e => _onRectFocus(id, dataPointObject, e)}\n onBlur={_onRectBlurOrMouseOut}\n onMouseOver={e => _onRectMouseOver(id, dataPointObject, e)}\n onMouseOut={_onRectBlurOrMouseOut}\n >\n <rect\n fill=\"transparent\"\n width={_xAxisScale.current.bandwidth()}\n height={_yAxisScale.current.bandwidth()}\n />\n </g>\n );\n }\n rectangles.push(rectElement);\n });\n });\n return rectangles;\n };\n /**\n * when the legend is hovered we need to highlight\n * all the rectangles which fall under that category\n * and un-highlight the rest of them\n * @param legendTitle\n */\n const _onLegendHover = (legendTitle: string): void => {\n setActiveLegend(legendTitle);\n };\n\n /**\n * when the mouse is out from the legend , we need\n * to show the graph in initial mode.\n */\n const _onLegendLeave = (): void => {\n setActiveLegend('');\n };\n /**\n * @param legendTitle\n * when the legend is clicked we need to highlight\n * all the rectangles which fall under that category\n * and un highlight the rest of them\n */\n const _onLegendClick = (legendTitle: string): void => {\n /**\n * check if the legend is already selceted,\n * if yes, un-select the legend, else\n * set the selected legend state to legendTitle\n */\n if (selectedLegend === legendTitle) {\n setSelectedLegend('');\n } else {\n setSelectedLegend(legendTitle);\n }\n };\n const _createLegendBars = (): JSX.Element => {\n const { data, legendProps } = props;\n const legends: Legend[] = [];\n data.forEach((item: HeatMapChartData) => {\n const legend: Legend = {\n title: item.legend,\n color: _colorScale.current(item.value),\n action: () => {\n _onLegendClick(item.legend);\n },\n hoverAction: () => {\n _handleChartMouseLeave();\n _onLegendHover(item.legend);\n },\n onMouseOutAction: () => {\n _onLegendLeave();\n },\n };\n legends.push(legend);\n });\n return <Legends {...legendProps} legends={legends} />;\n };\n\n const _getColorScale = () => {\n const { domainValuesForColorScale, rangeValuesForColorScale } = props;\n return d3ScaleLinear()\n .domain(domainValuesForColorScale)\n .range(rangeValuesForColorScale as unknown as number[]);\n };\n\n const _getXIndex = (value: string | Date | number): string => {\n if (_xAxisType.current === XAxisTypes.DateAxis) {\n return `${(value as Date).getTime()}`;\n } else if (_xAxisType.current === XAxisTypes.StringAxis) {\n return value as string;\n } else if (_xAxisType.current === XAxisTypes.NumericAxis) {\n return `${value}`;\n } else {\n return '';\n }\n };\n const _getYIndex = (value: string | Date | number): string => {\n if (_yAxisType.current === YAxisType.DateAxis) {\n return `${(value as Date).getTime()}`;\n } else if (_yAxisType.current === YAxisType.StringAxis) {\n return value as string;\n } else if (_yAxisType.current === YAxisType.NumericAxis) {\n return `${value}`;\n } else {\n return '';\n }\n };\n\n const { xAxisStringFormatter } = props;\n const _getFormattedLabelForXAxisDataPoint = React.useCallback(\n (point: string): string => {\n return xAxisStringFormatter ? xAxisStringFormatter(point) : point;\n },\n [xAxisStringFormatter],\n );\n\n const { yAxisStringFormatter } = props;\n const _getFormattedLabelForYAxisDataPoint = React.useCallback(\n (point: string): string => {\n return yAxisStringFormatter ? yAxisStringFormatter(point) : point;\n },\n [yAxisStringFormatter],\n );\n\n /**\n * This function will return the final sorted and formatted x-axis points\n * which will be rendered on the x-axis\n * @param points\n * @returns x-axis points\n */\n const _getXAxisDataPoints = React.useCallback(\n (points: { [key: string]: '1' }): string[] => {\n let xAxisPoints: string[] = [];\n const unFormattedXAxisDataPoints = Object.keys(points).sort((a: string, b: string) => {\n if (_xAxisType.current === XAxisTypes.DateAxis || _xAxisType.current === XAxisTypes.NumericAxis) {\n return +a - +b;\n } else {\n return props.sortOrder === 'none' ? 0 : a.toLowerCase() > b.toLowerCase() ? 1 : -1;\n }\n });\n xAxisPoints = unFormattedXAxisDataPoints.map((xPoint: string) => {\n if (_xAxisType.current === XAxisTypes.DateAxis) {\n return _getStringFormattedDate(xPoint, props.xAxisDateFormatString);\n } else if (_xAxisType.current === XAxisTypes.NumericAxis) {\n return _getStringFormattedNumber(xPoint, props.xAxisNumberFormatString);\n } else {\n return _getFormattedLabelForXAxisDataPoint(xPoint);\n }\n });\n\n return xAxisPoints;\n },\n [_getFormattedLabelForXAxisDataPoint, props.sortOrder, props.xAxisDateFormatString, props.xAxisNumberFormatString],\n );\n\n /**\n * This function will return the final sorted and formatted y-axis points\n * which will be rendered on the y-axis\n * @param points\n * @returns yaxis points\n */\n const _getYAxisDataPoints = React.useCallback(\n (points: { [key: string]: '1' }): string[] => {\n let yAxisPoints: string[] = [];\n const unFormattedYAxisDataPoints = Object.keys(points).sort((a: string, b: string) => {\n if (_yAxisType.current === YAxisType.DateAxis || _yAxisType.current === YAxisType.NumericAxis) {\n return +a - +b;\n } else {\n return props.sortOrder === 'none' ? 0 : a.toLowerCase() > b.toLowerCase() ? 1 : -1;\n }\n });\n yAxisPoints = unFormattedYAxisDataPoints.map((yPoint: string) => {\n if (_yAxisType.current === YAxisType.DateAxis) {\n return _getStringFormattedDate(yPoint, props.yAxisDateFormatString);\n } else if (_yAxisType.current === YAxisType.NumericAxis) {\n return _getStringFormattedNumber(yPoint, props.yAxisNumberFormatString);\n } else {\n return _getFormattedLabelForYAxisDataPoint(yPoint);\n }\n });\n\n return yAxisPoints;\n },\n [_getFormattedLabelForYAxisDataPoint, props.sortOrder, props.yAxisDateFormatString, props.yAxisNumberFormatString],\n );\n\n /**\n * This will create a new data set based on the prop\n * @data\n * We will be using This data set to contsruct our rectangles\n * in the chart, we use this data set becuase, when we loop in this\n * data and build the heat map, it will support accessibility as\n * specified in the figma\n */\n\n const _createNewDataSet = React.useCallback(\n (\n data: HeatMapChartData[],\n xAxisDateFormatString: string | undefined,\n xAxisNumberFormatString: string | undefined,\n yAxisDateFormatString: string | undefined,\n yAxisNumberFormatString: string | undefined,\n ): DataSet => {\n /**\n * please do not destructure any of the props here,\n * instead send them as parameter to this functions so that\n * this functions get called whenever the prop changes\n */\n const flattenData: FlattenData[] = [];\n /**\n * below for each loop will store all the datapoints in the one array.\n * basically it will flatten the nestesd array (data prop) into single array\n * of object. where each object contains x, y, rectText , value and legend propety of single\n * data point.\n */\n data.forEach((item: HeatMapChartData) => {\n item.data.forEach((point: HeatMapChartDataPoint) => {\n flattenData.push({ ...point, legend: item.legend });\n });\n });\n const yPoints: RectanglesGraphData = {};\n const uniqueYPoints: { [key: string]: '1' } = {};\n const uniqueXPoints: { [key: string]: '1' } = {};\n flattenData.forEach((item: FlattenData) => {\n const posX = _getXIndex(item.x);\n const posY = _getYIndex(item.y);\n\n uniqueXPoints[posX] = '1';\n uniqueYPoints[posY] = '1';\n /** we will check if the property(posY) is already there in object, if Yes,\n * then we will append the item in the Array related to the pos, if not\n * then we will simply append the item in the new Array and\n * assign that array to the property (posY) in the Object\n * and finally we will get the array of Objects associated to each\n * property (which is nothing but y data point) and object in the\n * array are noting but x data points associated to the property y\n */\n if (yPoints[posY]) {\n yPoints[posY] = [...yPoints[posY], item];\n } else {\n yPoints[posY] = [item];\n }\n });\n /**\n * we will now sort(ascending) the array's of y data point based on the x value\n * sorting is important to achive the accessibility order of the\n * rectangles and then format the x and y datapoints respectively\n */\n Object.keys(yPoints).forEach((item: string) => {\n yPoints[item]\n .sort((a: HeatMapChartDataPoint, b: HeatMapChartDataPoint) => {\n if (_xAxisType.current === XAxisTypes.StringAxis) {\n return props.sortOrder === 'none'\n ? 0\n : (a.x as string).toLowerCase() > (b.x as string).toLowerCase()\n ? 1\n : -1;\n } else if (_xAxisType.current === XAxisTypes.DateAxis) {\n return (a.x as Date).getTime() - (b.x as Date).getTime();\n } else if (_xAxisType.current === XAxisTypes.NumericAxis) {\n return +(a.x as string) > +(b.x as string) ? 1 : -1;\n } else {\n return a.x > b.x ? 1 : -1;\n }\n })\n .forEach((datapoint: HeatMapChartDataPoint) => {\n if (_xAxisType.current === XAxisTypes.DateAxis) {\n datapoint.x = _getStringFormattedDate(datapoint.x as string, xAxisDateFormatString);\n }\n if (_xAxisType.current === XAxisTypes.NumericAxis) {\n datapoint.x = _getStringFormattedNumber(datapoint.x as string, xAxisNumberFormatString);\n }\n if (_xAxisType.current === XAxisTypes.StringAxis) {\n datapoint.x = _getFormattedLabelForXAxisDataPoint(datapoint.x as string);\n }\n if (_yAxisType.current === YAxisType.DateAxis) {\n datapoint.y = _getStringFormattedDate(datapoint.y as string, yAxisDateFormatString);\n }\n if (_yAxisType.current === YAxisType.NumericAxis) {\n datapoint.y = _getStringFormattedNumber(datapoint.y as string, yAxisNumberFormatString);\n }\n if (_yAxisType.current === YAxisType.StringAxis) {\n datapoint.y = _getFormattedLabelForYAxisDataPoint(datapoint.y as string);\n }\n });\n });\n /**\n * if y-axis data points are of type date or number or if we have string formatter,\n * then we need to change data points to their respective string\n * format, becuase in the private variable this._stringYAxisDatapoints, points will be stored in\n * string format. and in here `yPoint` are not so we need to change, so that\n * function `this._createRectangles` should work perfetcly while looping, and if we don't change\n * then `this._createRectangles` will fail while looping, causing the error\n * Cannot read property 'forEach' of undefined\n */\n\n Object.keys(yPoints).forEach((yPoint: string) => {\n if (_yAxisType.current === YAxisType.DateAxis) {\n yPoints[_getStringFormattedDate(yPoint, yAxisDateFormatString)] = yPoints[yPoint];\n } else if (_yAxisType.current === YAxisType.NumericAxis) {\n yPoints[`${_getStringFormattedNumber(yPoint, yAxisNumberFormatString)}`] = yPoints[yPoint];\n } else {\n yPoints[_getFormattedLabelForYAxisDataPoint(yPoint)] = yPoints[yPoint];\n }\n });\n /**\n * assigning new data set\n */\n const dataSet = yPoints;\n /**\n * These are the Y axis data points which will get rendered in the\n * Y axis in graph\n */\n const yAxisPoints = _getYAxisDataPoints(uniqueYPoints);\n /**\n * These are the x axis data points which will get rendered in the\n * x axis in the graph\n */\n\n const xAxisPoints = _getXAxisDataPoints(uniqueXPoints);\n return {\n dataSet,\n yAxisPoints,\n xAxisPoints,\n };\n },\n [\n _getFormattedLabelForXAxisDataPoint,\n _getFormattedLabelForYAxisDataPoint,\n _getXAxisDataPoints,\n _getYAxisDataPoints,\n props.sortOrder,\n ],\n );\n\n const _getStringFormattedDate = (point: string, formatString?: string): string => {\n const date = new Date();\n date.setTime(+point);\n return d3TimeFormat(formatString || '%b/%d')(date);\n };\n\n const _getStringFormattedNumber = (point: string, formatString?: string): string => {\n return d3Format(formatString || '.2~s')(+point);\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 const _legendHighlighted = (legendTitle: string) => {\n return selectedLegend === legendTitle || (selectedLegend === '' && activeLegend === legendTitle);\n };\n\n /**\n * This function checks if none of the legends is selected or hovered.\n */\n const _noLegendHighlighted = () => {\n return selectedLegend === '' && activeLegend === '';\n };\n\n const _getAriaLabel = (point: FlattenData): string => {\n const xValue = point.x;\n const yValue = point.y;\n const legend = point.legend;\n const zValue = point.ratio ? `${point.ratio[0]}/${point.ratio[1]}` : point.rectText || point.value;\n const description = point.descriptionMessage;\n return (\n point.callOutAccessibilityData?.ariaLabel ||\n `${xValue}, ${yValue}. ${legend}, ${zValue}.` + (description ? ` ${description}.` : '')\n );\n };\n\n const _isChartEmpty = (): boolean => {\n return !(props.data && props.data.length > 0);\n };\n\n const _getChartTitle = (): string => {\n const { chartTitle } = props;\n const numDataPoints = props.data.reduce((acc, curr) => acc + curr.data.length, 0);\n return (chartTitle ? `${chartTitle}. ` : '') + `Heat map chart with ${numDataPoints} data points. `;\n };\n\n const 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 }\n };\n\n const { x, y } = _getXandY();\n _xAxisType.current = getTypeOfAxis(x, true) as XAxisTypes;\n _yAxisType.current = getTypeOfAxis(y, false) as YAxisType;\n const { data, xAxisDateFormatString, xAxisNumberFormatString, yAxisDateFormatString, yAxisNumberFormatString } =\n props;\n _colorScale.current = _getColorScale();\n const { dataSet, xAxisPoints, yAxisPoints } = React.useMemo(\n () =>\n _createNewDataSet(\n data,\n xAxisDateFormatString,\n xAxisNumberFormatString,\n yAxisDateFormatString,\n yAxisNumberFormatString,\n ),\n [\n _createNewDataSet,\n data,\n xAxisDateFormatString,\n xAxisNumberFormatString,\n yAxisDateFormatString,\n yAxisNumberFormatString,\n ],\n );\n _dataSet.current = dataSet;\n _stringYAxisDataPoints.current = yAxisPoints;\n _stringXAxisDataPoints.current = xAxisPoints;\n const calloutProps: ChartPopoverProps = {\n ...props.calloutProps,\n isPopoverOpen,\n YValue: calloutYValue,\n legend: calloutLegend,\n color: calloutTextColor,\n ratio,\n descriptionMessage,\n clickPosition,\n ...getAccessibleDataObject(callOutAccessibilityData, 'text', false),\n };\n const tickParams = {\n tickValues: props.tickValues,\n tickFormat: props.tickFormat,\n };\n return !_isChartEmpty() ? (\n <CartesianChart\n {...props}\n chartTitle={_getChartTitle()}\n points={data}\n chartType={ChartTypes.HeatMapChart}\n xAxisType={XAxisTypes.StringAxis}\n yAxisType={YAxisType.StringAxis}\n calloutProps={calloutProps}\n datasetForXAxisDomain={_stringXAxisDataPoints.current}\n stringDatasetForYAxisDomain={_stringYAxisDataPoints.current}\n getmargins={_getMargins}\n xAxisTickCount={_stringXAxisDataPoints.current.length}\n xAxistickSize={0}\n xAxisPadding={0.02}\n yAxisPadding={0.02}\n legendBars={_createLegendBars()}\n onChartMouseLeave={_handleChartMouseLeave}\n componentRef={cartesianChartRef}\n tickParams={tickParams}\n /* eslint-disable react/jsx-no-bind */\n children={(p: ChildProps) => {\n _xAxisScale.current = p.xScale;\n _yAxisScale.current = p.yScale;\n return _createRectangles();\n }}\n />\n ) : (\n <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n );\n});\n"],"names":["React","ChartTypes","getAccessibleDataObject","getColorContrast","getTypeOfAxis","resolveCSSVariables","XAxisTypes","YAxisType","formatToLocaleString","CartesianChart","useId","tokens","useHeatMapChartStyles","Legends","scaleLinear","d3ScaleLinear","format","d3Format","timeFormat","d3TimeFormat","HeatMapChart","forwardRef","props","forwardedRef","classes","_stringXAxisDataPoints","useRef","_stringYAxisDataPoints","_dataSet","_colorScale","_xAxisScale","_yAxisScale","_xAxisType","_yAxisType","_calloutAnchorPoint","_emptyChartId","_margins","cartesianChartRef","selectedLegend","setSelectedLegend","useState","activeLegend","setActiveLegend","isPopoverOpen","setPopoverOpen","calloutLegend","setCalloutLegend","calloutTextColor","setCalloutTextColor","calloutYValue","setCalloutYValue","ratio","setRatio","descriptionMessage","setDescriptionMessage","callOutAccessibilityData","setCallOutAccessibilityData","clickPosition","setClickPosition","x","y","useImperativeHandle","componentRef","chartContainer","current","_getXandY","data","forEach","item","length","_getMargins","margins","_getOpacity","legendTitle","opacity","_legendHighlighted","_noLegendHighlighted","_onRectFocus","id","focusEvent","boundingRect","currentTarget","getBoundingClientRect","clientX","left","width","clientY","top","height","updatePosition","legend","rectText","Number","isNaN","value","colorNeutralForeground1","_onRectMouseOver","mouseEvent","persist","_onRectBlurOrMouseOut","_handleChartMouseLeave","_getInvertedTextColor","color","colorNeutralBackground1","_createRectangles","rectangles","yAxisDataPoints","slice","reverse","yAxisDataPoint","index","xAxisDataPoint","rectElement","dataPointObject","styleRules","foregroundColor","contrastRatio","g","key","role","aria-label","_getAriaLabel","tabIndex","fillOpacity","transform","onFocus","e","onBlur","onMouseOver","onMouseOut","rect","fill","bandwidth","onClick","text","dominantBaseline","textAnchor","className","culture","useUTC","NaN","push","_onLegendHover","_onLegendLeave","_onLegendClick","_createLegendBars","legendProps","legends","title","action","hoverAction","onMouseOutAction","_getColorScale","domainValuesForColorScale","rangeValuesForColorScale","domain","range","_getXIndex","DateAxis","getTime","StringAxis","NumericAxis","_getYIndex","xAxisStringFormatter","_getFormattedLabelForXAxisDataPoint","useCallback","point","yAxisStringFormatter","_getFormattedLabelForYAxisDataPoint","_getXAxisDataPoints","points","xAxisPoints","unFormattedXAxisDataPoints","Object","keys","sort","a","b","sortOrder","toLowerCase","map","xPoint","_getStringFormattedDate","xAxisDateFormatString","_getStringFormattedNumber","xAxisNumberFormatString","_getYAxisDataPoints","yAxisPoints","unFormattedYAxisDataPoints","yPoint","yAxisDateFormatString","yAxisNumberFormatString","_createNewDataSet","flattenData","yPoints","uniqueYPoints","uniqueXPoints","posX","posY","datapoint","dataSet","formatString","date","Date","setTime","xValue","yValue","zValue","description","ariaLabel","_isChartEmpty","_getChartTitle","chartTitle","numDataPoints","reduce","acc","curr","newX","newY","threshold","distance","Math","sqrt","pow","useMemo","calloutProps","YValue","tickParams","tickValues","tickFormat","chartType","xAxisType","yAxisType","datasetForXAxisDomain","stringDatasetForYAxisDomain","getmargins","xAxisTickCount","xAxistickSize","xAxisPadding","yAxisPadding","legendBars","onChartMouseLeave","children","p","xScale","yScale","div","style"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { useHorizontalBarChartStyles } from './useHorizontalBarChartStyles.styles';
|
|
3
3
|
import { HorizontalBarChartVariant } from './index';
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
4
|
+
import { formatToLocaleString } from '@fluentui/chart-utilities';
|
|
5
|
+
import { formatScientificLimitWidth, getAccessibleDataObject, useRtl } from '../../utilities/index';
|
|
6
6
|
import { useId } from '@fluentui/react-utilities';
|
|
7
7
|
import { tokens } from '@fluentui/react-theme';
|
|
8
8
|
import { useFocusableGroup } from '@fluentui/react-tabster';
|
|
@@ -120,7 +120,7 @@ import { Legends } from '../../index';
|
|
|
120
120
|
return /*#__PURE__*/ React.createElement("div", {
|
|
121
121
|
className: classes.chartTitleRight,
|
|
122
122
|
...accessibilityData
|
|
123
|
-
},
|
|
123
|
+
}, formatToLocaleString(total, culture));
|
|
124
124
|
}
|
|
125
125
|
const chartDataMode = props.chartDataMode || 'default';
|
|
126
126
|
const chartData = data.chartData[0];
|
|
@@ -131,15 +131,15 @@ import { Legends } from '../../index';
|
|
|
131
131
|
return /*#__PURE__*/ React.createElement("div", {
|
|
132
132
|
className: classes.chartTitleRight,
|
|
133
133
|
...accessibilityData
|
|
134
|
-
},
|
|
134
|
+
}, formatToLocaleString(x, culture));
|
|
135
135
|
case 'fraction':
|
|
136
136
|
return /*#__PURE__*/ React.createElement("div", accessibilityData, /*#__PURE__*/ React.createElement("span", {
|
|
137
137
|
className: classes.chartTitleRight
|
|
138
|
-
},
|
|
138
|
+
}, formatToLocaleString(x, culture)), /*#__PURE__*/ React.createElement("span", {
|
|
139
139
|
className: classes.chartDataTextDenominator
|
|
140
|
-
}, ' / ' +
|
|
140
|
+
}, ' / ' + formatToLocaleString(y, culture)));
|
|
141
141
|
case 'percentage':
|
|
142
|
-
const dataRatioPercentage = `${
|
|
142
|
+
const dataRatioPercentage = `${formatToLocaleString(Math.round(x / y * 100), culture)}%`;
|
|
143
143
|
return /*#__PURE__*/ React.createElement("div", {
|
|
144
144
|
className: classes.chartTitleRight,
|
|
145
145
|
...accessibilityData
|
|
@@ -238,7 +238,7 @@ import { Legends } from '../../index';
|
|
|
238
238
|
transform: `translate(${_isRTL ? -4 : 4})`,
|
|
239
239
|
className: classes.barLabel,
|
|
240
240
|
"aria-hidden": true
|
|
241
|
-
},
|
|
241
|
+
}, formatScientificLimitWidth(barValue));
|
|
242
242
|
}
|
|
243
243
|
return /*#__PURE__*/ React.createElement("rect", {
|
|
244
244
|
key: index,
|