@fluentui/react-charts 0.0.0-nightly-20251009-0406.1 → 0.0.0-nightly-20251010-0407.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 +10 -0
- package/lib/components/CommonComponents/ChartPopover.js +2 -1
- package/lib/components/CommonComponents/ChartPopover.js.map +1 -1
- package/lib/components/CommonComponents/ChartPopover.types.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +5 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/DonutChart/Arc/Arc.js +8 -7
- package/lib/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.js +8 -28
- package/lib/components/DonutChart/DonutChart.js.map +1 -1
- package/lib/components/DonutChart/Pie/Pie.js +4 -4
- package/lib/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib/components/FunnelChart/FunnelChart.js +23 -45
- package/lib/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib/components/GaugeChart/GaugeChart.js +21 -46
- package/lib/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib/components/LineChart/LineChart.js +110 -73
- package/lib/components/LineChart/LineChart.js.map +1 -1
- package/lib/types/DataPoint.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/ChartPopover.js +2 -1
- package/lib-commonjs/components/CommonComponents/ChartPopover.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/ChartPopover.types.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +5 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/Arc.js +8 -7
- package/lib-commonjs/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.js +8 -28
- package/lib-commonjs/components/DonutChart/DonutChart.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/Pie.js +4 -4
- package/lib-commonjs/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib-commonjs/components/FunnelChart/FunnelChart.js +23 -45
- package/lib-commonjs/components/FunnelChart/FunnelChart.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/GaugeChart.js +21 -46
- package/lib-commonjs/components/GaugeChart/GaugeChart.js.map +1 -1
- package/lib-commonjs/components/LineChart/LineChart.js +110 -73
- package/lib-commonjs/components/LineChart/LineChart.js.map +1 -1
- package/lib-commonjs/types/DataPoint.js.map +1 -1
- package/package.json +12 -12
|
@@ -152,6 +152,7 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
152
152
|
const [YValue, setYValue] = _react.useState('');
|
|
153
153
|
const [legendVal, setLegendVal] = _react.useState('');
|
|
154
154
|
const [lineColor, setLineColor] = _react.useState('');
|
|
155
|
+
const [refSelected, setRefSelected] = _react.useState(null);
|
|
155
156
|
const pointsRef = _react.useRef([]);
|
|
156
157
|
const calloutPointsRef = _react.useRef([]);
|
|
157
158
|
const classes = (0, _useLineChartStylesstyles.useLineChartStyles)(props);
|
|
@@ -456,6 +457,7 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
456
457
|
const currentMarkerSize = _points[i].data[0].markerSize;
|
|
457
458
|
const supportsTextMode = (_points_i_lineOptions1 = _points[i].lineOptions) === null || _points_i_lineOptions1 === void 0 ? void 0 : (_points_i_lineOptions_mode = _points_i_lineOptions1.mode) === null || _points_i_lineOptions_mode === void 0 ? void 0 : _points_i_lineOptions_mode.includes('text');
|
|
458
459
|
const text = _points[i].data[0].text;
|
|
460
|
+
const targetElement = document.getElementById(circleId);
|
|
459
461
|
var _points_i_data__text;
|
|
460
462
|
pointsForLine.push(/*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement(_react.Fragment, {
|
|
461
463
|
key: `${circleId}_fragment`
|
|
@@ -468,8 +470,8 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
468
470
|
fill: activePoint === circleId ? _reacttheme.tokens.colorNeutralBackground1 : lineColor,
|
|
469
471
|
opacity: isLegendSelected ? 1 : 0.1,
|
|
470
472
|
tabIndex: isLegendSelected ? 0 : undefined,
|
|
471
|
-
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
472
|
-
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
473
|
+
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
474
|
+
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
473
475
|
onMouseOut: _handleMouseOut,
|
|
474
476
|
strokeWidth: activePoint === circleId ? DEFAULT_LINE_STROKE_SIZE : 0,
|
|
475
477
|
stroke: activePoint === circleId ? lineColor : '',
|
|
@@ -479,7 +481,7 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
479
481
|
ref: (e)=>{
|
|
480
482
|
_refCallback(e, circleId);
|
|
481
483
|
},
|
|
482
|
-
onFocus: (event)=>_handleFocus(event, circleId, x1, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData),
|
|
484
|
+
onFocus: (event)=>_handleFocus(event, circleId, x1, xAxisCalloutData, circleId, targetElement, xAxisCalloutAccessibilityData),
|
|
483
485
|
onBlur: _handleMouseOut,
|
|
484
486
|
..._getClickHandler(_points[i].data[0].onDataPointClick)
|
|
485
487
|
}), !_isScatterPolar && supportsTextMode && text && /*#__PURE__*/ _react.createElement("text", {
|
|
@@ -497,7 +499,7 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
497
499
|
const lineCurve = (_points_i_lineOptions = _points[i].lineOptions) === null || _points_i_lineOptions === void 0 ? void 0 : _points_i_lineOptions.curve;
|
|
498
500
|
// Use path rendering technique for larger datasets to optimize performance.
|
|
499
501
|
if ((props.optimizeLargeData || lineCurve) && _points[i].data.length > 1) {
|
|
500
|
-
var _points_i_lineOptions2;
|
|
502
|
+
var _points_i_lineOptions2, _points_i_lineOptions3;
|
|
501
503
|
const line = (0, _d3shape.line)() // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
502
504
|
.x((d)=>_xAxisScale(d[0])) // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
503
505
|
.y((d)=>yScale(d[1])).curve((0, _index1.getCurveFactory)(lineCurve)).defined((d)=>(0, _index1.isPlottable)(_xAxisScale(d[0]), yScale(d[1])));
|
|
@@ -512,20 +514,23 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
512
514
|
_points[i].data[k].y
|
|
513
515
|
]);
|
|
514
516
|
}
|
|
515
|
-
if
|
|
516
|
-
|
|
517
|
-
|
|
517
|
+
// Check if lines should be drawn based on mode
|
|
518
|
+
const lineMode = (_points_i_lineOptions3 = _points[i].lineOptions) === null || _points_i_lineOptions3 === void 0 ? void 0 : _points_i_lineOptions3.mode;
|
|
519
|
+
const shouldDrawLines = lineMode !== 'markers';
|
|
520
|
+
if (shouldDrawLines && isLegendSelected) {
|
|
521
|
+
var _points_i_lineOptions4, _points_i_lineOptions5, _points_i_lineOptions6;
|
|
522
|
+
const lineBorderWidth = ((_points_i_lineOptions4 = _points[i].lineOptions) === null || _points_i_lineOptions4 === void 0 ? void 0 : _points_i_lineOptions4.lineBorderWidth) ? Number.parseFloat(_points[i].lineOptions.lineBorderWidth.toString()) : 0;
|
|
518
523
|
if (lineBorderWidth > 0) {
|
|
519
|
-
var
|
|
524
|
+
var _points_i_lineOptions7, _points_i_lineOptions8;
|
|
520
525
|
var _points_i_lineOptions_strokeLinecap;
|
|
521
526
|
bordersForLine.push(/*#__PURE__*/ _react.createElement("path", {
|
|
522
527
|
id: borderId,
|
|
523
528
|
key: borderId,
|
|
524
529
|
d: line(lineData),
|
|
525
530
|
fill: "transparent",
|
|
526
|
-
strokeLinecap: (_points_i_lineOptions_strokeLinecap = (
|
|
531
|
+
strokeLinecap: (_points_i_lineOptions_strokeLinecap = (_points_i_lineOptions7 = _points[i].lineOptions) === null || _points_i_lineOptions7 === void 0 ? void 0 : _points_i_lineOptions7.strokeLinecap) !== null && _points_i_lineOptions_strokeLinecap !== void 0 ? _points_i_lineOptions_strokeLinecap : 'round',
|
|
527
532
|
strokeWidth: Number.parseFloat(strokeWidth.toString()) + lineBorderWidth,
|
|
528
|
-
stroke: ((
|
|
533
|
+
stroke: ((_points_i_lineOptions8 = _points[i].lineOptions) === null || _points_i_lineOptions8 === void 0 ? void 0 : _points_i_lineOptions8.lineBorderColor) || _reacttheme.tokens.colorNeutralBackground1,
|
|
529
534
|
opacity: 1
|
|
530
535
|
}));
|
|
531
536
|
}
|
|
@@ -538,8 +543,8 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
538
543
|
"data-is-focusable": true,
|
|
539
544
|
stroke: lineColor,
|
|
540
545
|
strokeWidth: strokeWidth,
|
|
541
|
-
strokeLinecap: (_points_i_lineOptions_strokeLinecap1 = (
|
|
542
|
-
strokeDasharray: (
|
|
546
|
+
strokeLinecap: (_points_i_lineOptions_strokeLinecap1 = (_points_i_lineOptions5 = _points[i].lineOptions) === null || _points_i_lineOptions5 === void 0 ? void 0 : _points_i_lineOptions5.strokeLinecap) !== null && _points_i_lineOptions_strokeLinecap1 !== void 0 ? _points_i_lineOptions_strokeLinecap1 : 'round',
|
|
547
|
+
strokeDasharray: (_points_i_lineOptions6 = _points[i].lineOptions) === null || _points_i_lineOptions6 === void 0 ? void 0 : _points_i_lineOptions6.strokeDasharray,
|
|
543
548
|
onMouseMove: (event)=>_onMouseOverLargeDataset(i, verticaLineHeight, event, yScale),
|
|
544
549
|
onMouseOver: (event)=>_onMouseOverLargeDataset(i, verticaLineHeight, event, yScale),
|
|
545
550
|
onMouseOut: _handleMouseOut,
|
|
@@ -547,8 +552,8 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
547
552
|
opacity: 1,
|
|
548
553
|
tabIndex: isLegendSelected ? 0 : undefined
|
|
549
554
|
}));
|
|
550
|
-
} else {
|
|
551
|
-
var
|
|
555
|
+
} else if (shouldDrawLines) {
|
|
556
|
+
var _points_i_lineOptions9, _points_i_lineOptions10;
|
|
552
557
|
var _points_i_lineOptions_strokeLinecap2;
|
|
553
558
|
linesForLine.push(/*#__PURE__*/ _react.createElement("path", {
|
|
554
559
|
id: lineId,
|
|
@@ -558,11 +563,12 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
558
563
|
"data-is-focusable": false,
|
|
559
564
|
stroke: lineColor,
|
|
560
565
|
strokeWidth: strokeWidth,
|
|
561
|
-
strokeLinecap: (_points_i_lineOptions_strokeLinecap2 = (
|
|
562
|
-
strokeDasharray: (
|
|
566
|
+
strokeLinecap: (_points_i_lineOptions_strokeLinecap2 = (_points_i_lineOptions9 = _points[i].lineOptions) === null || _points_i_lineOptions9 === void 0 ? void 0 : _points_i_lineOptions9.strokeLinecap) !== null && _points_i_lineOptions_strokeLinecap2 !== void 0 ? _points_i_lineOptions_strokeLinecap2 : 'round',
|
|
567
|
+
strokeDasharray: (_points_i_lineOptions10 = _points[i].lineOptions) === null || _points_i_lineOptions10 === void 0 ? void 0 : _points_i_lineOptions10.strokeDasharray,
|
|
563
568
|
opacity: 0.1
|
|
564
569
|
}));
|
|
565
570
|
}
|
|
571
|
+
// Always add the highlight circle for large dataset hover
|
|
566
572
|
pointsForLine.push(/*#__PURE__*/ _react.createElement("circle", {
|
|
567
573
|
id: `${_staticHighlightCircle}_${i}`,
|
|
568
574
|
key: `${_staticHighlightCircle}_${i}`,
|
|
@@ -577,9 +583,36 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
577
583
|
onMouseOver: (event)=>_onMouseOverLargeDataset(i, verticaLineHeight, event, yScale),
|
|
578
584
|
onMouseOut: _handleMouseOut
|
|
579
585
|
}));
|
|
586
|
+
// Add individual markers if mode includes 'markers'
|
|
587
|
+
const showMarkers = (lineMode === null || lineMode === void 0 ? void 0 : lineMode.includes('markers')) || !lineMode; // Show markers by default if no mode specified
|
|
588
|
+
if (showMarkers) {
|
|
589
|
+
for(let k = 0; k < _points[i].data.length; k++){
|
|
590
|
+
const { x, y } = _points[i].data[k];
|
|
591
|
+
const xPoint = _xAxisScale(x instanceof Date ? x.getTime() : x);
|
|
592
|
+
const yPoint = yScale(y);
|
|
593
|
+
if ((0, _index1.isPlottable)(xPoint, yPoint)) {
|
|
594
|
+
var _points_i_data_k, _points_i;
|
|
595
|
+
const markerSize = _points[i].data[k].markerSize;
|
|
596
|
+
const perPointColor = (_points_i_data_k = _points[i].data[k]) === null || _points_i_data_k === void 0 ? void 0 : _points_i_data_k.markerColor;
|
|
597
|
+
pointsForLine.push(/*#__PURE__*/ _react.createElement("circle", {
|
|
598
|
+
key: `${_circleId}_${i}_${k}_marker`,
|
|
599
|
+
r: markerSize ? markerSize * extraMaxPixels * 0.3 / maxMarkerSize : activePoint === _circleId ? 5.5 : 3.5,
|
|
600
|
+
cx: xPoint,
|
|
601
|
+
cy: yPoint,
|
|
602
|
+
fill: activePoint === _circleId ? _reacttheme.tokens.colorNeutralBackground1 : perPointColor || ((_points_i = _points[i]) === null || _points_i === void 0 ? void 0 : _points_i.color) || lineColor,
|
|
603
|
+
stroke: perPointColor || lineColor,
|
|
604
|
+
strokeWidth: 1,
|
|
605
|
+
opacity: isLegendSelected ? 1 : 0.1,
|
|
606
|
+
onMouseMove: _onMouseOverLargeDataset.bind(i, verticaLineHeight, yScale),
|
|
607
|
+
onMouseOver: _onMouseOverLargeDataset.bind(i, verticaLineHeight, yScale),
|
|
608
|
+
onMouseOut: _handleMouseOut
|
|
609
|
+
}));
|
|
610
|
+
}
|
|
611
|
+
}
|
|
612
|
+
}
|
|
580
613
|
} else if (!props.optimizeLargeData) {
|
|
581
614
|
for(let j = 1; j < _points[i].data.length; j++){
|
|
582
|
-
var
|
|
615
|
+
var _points_i_lineOptions11, _points_i_lineOptions_mode1, _points_i_lineOptions12, _points_i_lineOptions_mode2, _points_i_lineOptions13;
|
|
583
616
|
const gapResult = _checkInGap(j, gaps, gapIndex);
|
|
584
617
|
const isInGap = gapResult.isInGap;
|
|
585
618
|
gapIndex = gapResult.gapIndex;
|
|
@@ -592,32 +625,33 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
592
625
|
const yPoint1 = yScale(y1);
|
|
593
626
|
const xPoint2 = _xAxisScale(x2);
|
|
594
627
|
const yPoint2 = yScale(y2);
|
|
595
|
-
const strokeWidth = ((
|
|
628
|
+
const strokeWidth = ((_points_i_lineOptions11 = _points[i].lineOptions) === null || _points_i_lineOptions11 === void 0 ? void 0 : _points_i_lineOptions11.strokeWidth) || props.strokeWidth || DEFAULT_LINE_STROKE_SIZE;
|
|
596
629
|
const isLegendSelected = _legendHighlighted(legendVal) || _noLegendHighlighted() || isSelectedLegend;
|
|
597
630
|
const currentPointHidden = _points[i].hideNonActiveDots && activePoint !== circleId;
|
|
598
|
-
const supportsTextMode = (
|
|
631
|
+
const supportsTextMode = (_points_i_lineOptions12 = _points[i].lineOptions) === null || _points_i_lineOptions12 === void 0 ? void 0 : (_points_i_lineOptions_mode1 = _points_i_lineOptions12.mode) === null || _points_i_lineOptions_mode1 === void 0 ? void 0 : _points_i_lineOptions_mode1.includes('text');
|
|
599
632
|
const text = _points[i].data[j - 1].text;
|
|
600
633
|
let currentMarkerSize = _points[i].data[j - 1].markerSize;
|
|
601
634
|
if ((0, _index1.isPlottable)(xPoint1, yPoint1)) {
|
|
602
|
-
var _points_i_lineOptions_mode3,
|
|
635
|
+
var _points_i_lineOptions_mode3, _points_i_lineOptions14, _points_i_data_, _points_i_data_1, _points_i_data_2, _points_i_data_3;
|
|
603
636
|
const path = _getPath(xPoint1, yPoint1, circleId, j, false, _points[i].index);
|
|
637
|
+
const targetElement = document.getElementById(circleId);
|
|
604
638
|
var _points_i_data__text1;
|
|
605
|
-
pointsForLine.push(((
|
|
639
|
+
pointsForLine.push(((_points_i_lineOptions14 = _points[i].lineOptions) === null || _points_i_lineOptions14 === void 0 ? void 0 : (_points_i_lineOptions_mode3 = _points_i_lineOptions14.mode) === null || _points_i_lineOptions_mode3 === void 0 ? void 0 : _points_i_lineOptions_mode3.includes('markers')) || supportsTextMode ? /*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement("circle", {
|
|
606
640
|
id: circleId,
|
|
607
641
|
key: circleId,
|
|
608
642
|
r: currentMarkerSize ? currentMarkerSize * extraMaxPixels / maxMarkerSize : 4,
|
|
609
643
|
cx: xPoint1,
|
|
610
644
|
cy: yPoint1,
|
|
611
645
|
"data-is-focusable": isLegendSelected,
|
|
612
|
-
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
613
|
-
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
646
|
+
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
647
|
+
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
614
648
|
onMouseOut: _handleMouseOut,
|
|
615
|
-
onFocus: (event)=>_handleFocus(event, lineId, x1, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData),
|
|
649
|
+
onFocus: (event)=>_handleFocus(event, lineId, x1, xAxisCalloutData, circleId, targetElement, xAxisCalloutAccessibilityData),
|
|
616
650
|
onBlur: _handleMouseOut,
|
|
617
651
|
..._getClickHandler(_points[i].data[j - 1].onDataPointClick),
|
|
618
652
|
opacity: isLegendSelected && !currentPointHidden ? 1 : 0.01,
|
|
619
|
-
fill: _getPointFill(lineColor, circleId, j, false),
|
|
620
|
-
stroke: lineColor,
|
|
653
|
+
fill: ((_points_i_data_ = _points[i].data[j - 1]) === null || _points_i_data_ === void 0 ? void 0 : _points_i_data_.markerColor) || _getPointFill(lineColor, circleId, j, false),
|
|
654
|
+
stroke: ((_points_i_data_1 = _points[i].data[j - 1]) === null || _points_i_data_1 === void 0 ? void 0 : _points_i_data_1.markerColor) || lineColor,
|
|
621
655
|
strokeWidth: strokeWidth,
|
|
622
656
|
role: "img",
|
|
623
657
|
"aria-label": (_points_i_data__text1 = _points[i].data[j - 1].text) !== null && _points_i_data__text1 !== void 0 ? _points_i_data__text1 : _getAriaLabel(i, j - 1)
|
|
@@ -632,15 +666,15 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
632
666
|
key: circleId,
|
|
633
667
|
d: path,
|
|
634
668
|
"data-is-focusable": isLegendSelected,
|
|
635
|
-
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
636
|
-
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
669
|
+
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
670
|
+
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
637
671
|
onMouseOut: _handleMouseOut,
|
|
638
|
-
onFocus: (event)=>_handleFocus(event, lineId, x1, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData),
|
|
672
|
+
onFocus: (event)=>_handleFocus(event, lineId, x1, xAxisCalloutData, circleId, targetElement, xAxisCalloutAccessibilityData),
|
|
639
673
|
onBlur: _handleMouseOut,
|
|
640
674
|
..._getClickHandler(_points[i].data[j - 1].onDataPointClick),
|
|
641
675
|
opacity: isLegendSelected && !currentPointHidden ? 1 : 0.01,
|
|
642
|
-
fill: _getPointFill(lineColor, circleId, j, false),
|
|
643
|
-
stroke: lineColor,
|
|
676
|
+
fill: ((_points_i_data_2 = _points[i].data[j - 1]) === null || _points_i_data_2 === void 0 ? void 0 : _points_i_data_2.markerColor) || _getPointFill(lineColor, circleId, j, false),
|
|
677
|
+
stroke: ((_points_i_data_3 = _points[i].data[j - 1]) === null || _points_i_data_3 === void 0 ? void 0 : _points_i_data_3.markerColor) || lineColor,
|
|
644
678
|
strokeWidth: strokeWidth,
|
|
645
679
|
role: "img",
|
|
646
680
|
"aria-label": _getAriaLabel(i, j - 1),
|
|
@@ -648,32 +682,33 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
648
682
|
}));
|
|
649
683
|
}
|
|
650
684
|
if (j + 1 === _points[i].data.length) {
|
|
651
|
-
var _points_i_lineOptions_mode4,
|
|
685
|
+
var _points_i_lineOptions_mode4, _points_i_lineOptions15;
|
|
652
686
|
// If this is last point of the line segment.
|
|
653
687
|
const lastCircleId = `${circleId}${j}L`;
|
|
654
688
|
const hiddenHoverCircleId = `${circleId}${j}D`;
|
|
655
689
|
const lastPointHidden = _points[i].hideNonActiveDots && activePoint !== lastCircleId;
|
|
656
690
|
const { xAxisCalloutData: lastCirlceXCallout, xAxisCalloutAccessibilityData: lastCirlceXCalloutAccessibilityData } = _points[i].data[j];
|
|
657
691
|
currentMarkerSize = _points[i].data[j].markerSize;
|
|
658
|
-
const lastSupportsTextMode = (
|
|
692
|
+
const lastSupportsTextMode = (_points_i_lineOptions15 = _points[i].lineOptions) === null || _points_i_lineOptions15 === void 0 ? void 0 : (_points_i_lineOptions_mode4 = _points_i_lineOptions15.mode) === null || _points_i_lineOptions_mode4 === void 0 ? void 0 : _points_i_lineOptions_mode4.includes('text');
|
|
659
693
|
const lastText = _points[i].data[j].text;
|
|
660
694
|
if ((0, _index1.isPlottable)(xPoint2, yPoint2)) {
|
|
661
|
-
var _points_i_lineOptions_mode5,
|
|
695
|
+
var _points_i_lineOptions_mode5, _points_i_lineOptions16, _points_i_data_j, _points_i_data_j1;
|
|
662
696
|
const path = _getPath(xPoint2, yPoint2, lastCircleId, j, true, _points[i].index);
|
|
697
|
+
const targetElement = document.getElementById(lastCircleId);
|
|
663
698
|
var _points_i_data_j_text;
|
|
664
699
|
pointsForLine.push(/*#__PURE__*/ _react.createElement(_react.Fragment, {
|
|
665
700
|
key: `${lastCircleId}_container`
|
|
666
|
-
}, ((
|
|
701
|
+
}, ((_points_i_lineOptions16 = _points[i].lineOptions) === null || _points_i_lineOptions16 === void 0 ? void 0 : (_points_i_lineOptions_mode5 = _points_i_lineOptions16.mode) === null || _points_i_lineOptions_mode5 === void 0 ? void 0 : _points_i_lineOptions_mode5.includes('markers')) || lastSupportsTextMode ? /*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement("circle", {
|
|
667
702
|
id: lastCircleId,
|
|
668
703
|
key: lastCircleId,
|
|
669
704
|
r: currentMarkerSize ? currentMarkerSize * extraMaxPixels / maxMarkerSize : 4,
|
|
670
705
|
cx: xPoint2,
|
|
671
706
|
cy: yPoint2,
|
|
672
707
|
"data-is-focusable": isLegendSelected,
|
|
673
|
-
onMouseOver: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
674
|
-
onMouseMove: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
708
|
+
onMouseOver: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
709
|
+
onMouseMove: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
675
710
|
onMouseOut: _handleMouseOut,
|
|
676
|
-
onFocus: (event)=>_handleFocus(event, lineId, x2, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData),
|
|
711
|
+
onFocus: (event)=>_handleFocus(event, lineId, x2, lastCirlceXCallout, lastCircleId, targetElement, lastCirlceXCalloutAccessibilityData),
|
|
677
712
|
onBlur: _handleMouseOut,
|
|
678
713
|
..._getClickHandler(_points[i].data[j].onDataPointClick),
|
|
679
714
|
opacity: isLegendSelected && !lastPointHidden ? 1 : 0.01,
|
|
@@ -692,15 +727,15 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
692
727
|
key: lastCircleId,
|
|
693
728
|
d: path,
|
|
694
729
|
"data-is-focusable": isLegendSelected,
|
|
695
|
-
onMouseOver: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
696
|
-
onMouseMove: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
730
|
+
onMouseOver: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
731
|
+
onMouseMove: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
697
732
|
onMouseOut: _handleMouseOut,
|
|
698
|
-
onFocus: (event)=>_handleFocus(event, lineId, x2, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData),
|
|
733
|
+
onFocus: (event)=>_handleFocus(event, lineId, x2, lastCirlceXCallout, lastCircleId, targetElement, lastCirlceXCalloutAccessibilityData),
|
|
699
734
|
onBlur: _handleMouseOut,
|
|
700
735
|
..._getClickHandler(_points[i].data[j].onDataPointClick),
|
|
701
736
|
opacity: isLegendSelected && !lastPointHidden ? 1 : 0.01,
|
|
702
|
-
fill: _getPointFill(lineColor, lastCircleId, j, true),
|
|
703
|
-
stroke: lineColor,
|
|
737
|
+
fill: ((_points_i_data_j = _points[i].data[j]) === null || _points_i_data_j === void 0 ? void 0 : _points_i_data_j.markerColor) || _getPointFill(lineColor, lastCircleId, j, true),
|
|
738
|
+
stroke: ((_points_i_data_j1 = _points[i].data[j]) === null || _points_i_data_j1 === void 0 ? void 0 : _points_i_data_j1.markerColor) || lineColor,
|
|
704
739
|
strokeWidth: strokeWidth,
|
|
705
740
|
role: "img",
|
|
706
741
|
"aria-label": _getAriaLabel(i, j),
|
|
@@ -713,8 +748,8 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
713
748
|
cy: yPoint2,
|
|
714
749
|
opacity: 0,
|
|
715
750
|
width: 0,
|
|
716
|
-
onMouseOver: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
717
|
-
onMouseMove: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
751
|
+
onMouseOver: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
752
|
+
onMouseMove: (event)=>_handleHover(x2, y2, verticaLineHeight, lastCirlceXCallout, lastCircleId, lastCirlceXCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
718
753
|
onMouseOut: _handleMouseOut,
|
|
719
754
|
strokeWidth: 0,
|
|
720
755
|
focusable: false,
|
|
@@ -722,14 +757,15 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
722
757
|
})));
|
|
723
758
|
}
|
|
724
759
|
}
|
|
725
|
-
if ((0, _index1.isPlottable)(xPoint1, yPoint1) && (0, _index1.isPlottable)(xPoint2, yPoint2) && (!_hasMarkersMode || ((
|
|
760
|
+
if ((0, _index1.isPlottable)(xPoint1, yPoint1) && (0, _index1.isPlottable)(xPoint2, yPoint2) && (!_hasMarkersMode || ((_points_i_lineOptions13 = _points[i].lineOptions) === null || _points_i_lineOptions13 === void 0 ? void 0 : (_points_i_lineOptions_mode2 = _points_i_lineOptions13.mode) === null || _points_i_lineOptions_mode2 === void 0 ? void 0 : _points_i_lineOptions_mode2.includes('lines')))) {
|
|
726
761
|
if (isLegendSelected) {
|
|
727
762
|
// don't draw line if it is in a gap
|
|
728
763
|
if (!isInGap) {
|
|
729
|
-
var
|
|
730
|
-
const lineBorderWidth = ((
|
|
764
|
+
var _points_i_lineOptions17, _points_i_lineOptions18, _points_i_lineOptions19, _points_i_lineOptions20;
|
|
765
|
+
const lineBorderWidth = ((_points_i_lineOptions17 = _points[i].lineOptions) === null || _points_i_lineOptions17 === void 0 ? void 0 : _points_i_lineOptions17.lineBorderWidth) ? Number.parseFloat(_points[i].lineOptions.lineBorderWidth.toString()) : 0;
|
|
766
|
+
const targetElement = document.getElementById(circleId);
|
|
731
767
|
if (lineBorderWidth > 0) {
|
|
732
|
-
var
|
|
768
|
+
var _points_i_lineOptions21, _points_i_lineOptions22;
|
|
733
769
|
var _points_i_lineOptions_strokeLinecap3;
|
|
734
770
|
bordersForLine.push(/*#__PURE__*/ _react.createElement("line", {
|
|
735
771
|
id: borderId,
|
|
@@ -738,9 +774,9 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
738
774
|
y1: yPoint1,
|
|
739
775
|
x2: xPoint2,
|
|
740
776
|
y2: yPoint2,
|
|
741
|
-
strokeLinecap: (_points_i_lineOptions_strokeLinecap3 = (
|
|
777
|
+
strokeLinecap: (_points_i_lineOptions_strokeLinecap3 = (_points_i_lineOptions21 = _points[i].lineOptions) === null || _points_i_lineOptions21 === void 0 ? void 0 : _points_i_lineOptions21.strokeLinecap) !== null && _points_i_lineOptions_strokeLinecap3 !== void 0 ? _points_i_lineOptions_strokeLinecap3 : 'round',
|
|
742
778
|
strokeWidth: Number.parseFloat(strokeWidth.toString()) + lineBorderWidth,
|
|
743
|
-
stroke: ((
|
|
779
|
+
stroke: ((_points_i_lineOptions22 = _points[i].lineOptions) === null || _points_i_lineOptions22 === void 0 ? void 0 : _points_i_lineOptions22.lineBorderColor) || _reacttheme.tokens.colorNeutralBackground1,
|
|
744
780
|
opacity: 1
|
|
745
781
|
}));
|
|
746
782
|
}
|
|
@@ -756,20 +792,20 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
756
792
|
ref: (e)=>{
|
|
757
793
|
_refCallback(e, lineId);
|
|
758
794
|
},
|
|
759
|
-
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
760
|
-
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor),
|
|
795
|
+
onMouseOver: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
796
|
+
onMouseMove: (event)=>_handleHover(x1, y1, verticaLineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, event, yScale, legendVal, lineColor, targetElement),
|
|
761
797
|
onMouseOut: _handleMouseOut,
|
|
762
798
|
stroke: lineColor,
|
|
763
|
-
strokeLinecap: (_points_i_lineOptions_strokeLinecap4 = (
|
|
764
|
-
strokeDasharray: (
|
|
765
|
-
strokeDashoffset: (
|
|
799
|
+
strokeLinecap: (_points_i_lineOptions_strokeLinecap4 = (_points_i_lineOptions18 = _points[i].lineOptions) === null || _points_i_lineOptions18 === void 0 ? void 0 : _points_i_lineOptions18.strokeLinecap) !== null && _points_i_lineOptions_strokeLinecap4 !== void 0 ? _points_i_lineOptions_strokeLinecap4 : 'round',
|
|
800
|
+
strokeDasharray: (_points_i_lineOptions19 = _points[i].lineOptions) === null || _points_i_lineOptions19 === void 0 ? void 0 : _points_i_lineOptions19.strokeDasharray,
|
|
801
|
+
strokeDashoffset: (_points_i_lineOptions20 = _points[i].lineOptions) === null || _points_i_lineOptions20 === void 0 ? void 0 : _points_i_lineOptions20.strokeDashoffset,
|
|
766
802
|
opacity: 1,
|
|
767
803
|
..._getClickHandler(_points[i].onLineClick)
|
|
768
804
|
}));
|
|
769
805
|
}
|
|
770
806
|
} else {
|
|
771
807
|
if (!isInGap) {
|
|
772
|
-
var
|
|
808
|
+
var _points_i_lineOptions23, _points_i_lineOptions24, _points_i_lineOptions25;
|
|
773
809
|
var _points_i_lineOptions_strokeLinecap5;
|
|
774
810
|
linesForLine.push(/*#__PURE__*/ _react.createElement("line", {
|
|
775
811
|
id: lineId,
|
|
@@ -780,9 +816,9 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
780
816
|
y2: yPoint2,
|
|
781
817
|
strokeWidth: strokeWidth,
|
|
782
818
|
stroke: lineColor,
|
|
783
|
-
strokeLinecap: (_points_i_lineOptions_strokeLinecap5 = (
|
|
784
|
-
strokeDasharray: (
|
|
785
|
-
strokeDashoffset: (
|
|
819
|
+
strokeLinecap: (_points_i_lineOptions_strokeLinecap5 = (_points_i_lineOptions23 = _points[i].lineOptions) === null || _points_i_lineOptions23 === void 0 ? void 0 : _points_i_lineOptions23.strokeLinecap) !== null && _points_i_lineOptions_strokeLinecap5 !== void 0 ? _points_i_lineOptions_strokeLinecap5 : 'round',
|
|
820
|
+
strokeDasharray: (_points_i_lineOptions24 = _points[i].lineOptions) === null || _points_i_lineOptions24 === void 0 ? void 0 : _points_i_lineOptions24.strokeDasharray,
|
|
821
|
+
strokeDashoffset: (_points_i_lineOptions25 = _points[i].lineOptions) === null || _points_i_lineOptions25 === void 0 ? void 0 : _points_i_lineOptions25.strokeDashoffset,
|
|
786
822
|
opacity: 0.1
|
|
787
823
|
}));
|
|
788
824
|
}
|
|
@@ -791,12 +827,12 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
791
827
|
}
|
|
792
828
|
}
|
|
793
829
|
if (_isScatterPolar) {
|
|
794
|
-
var
|
|
830
|
+
var _points_i1;
|
|
795
831
|
pointsForLine.push(...(0, _scatterpolarutils.renderScatterPolarCategoryLabels)({
|
|
796
832
|
xAxisScale: _xAxisScale,
|
|
797
833
|
yAxisScale: yScale,
|
|
798
834
|
className: classes.markerLabel || '',
|
|
799
|
-
lineOptions: (
|
|
835
|
+
lineOptions: (_points_i1 = _points[i]) === null || _points_i1 === void 0 ? void 0 : _points_i1.lineOptions
|
|
800
836
|
}));
|
|
801
837
|
}
|
|
802
838
|
lines.push(/*#__PURE__*/ _react.createElement("g", {
|
|
@@ -954,8 +990,10 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
954
990
|
_uniqueCallOutID = `#${_staticHighlightCircle}_${linenumber}`;
|
|
955
991
|
(0, _d3selection.select)(`#${_staticHighlightCircle}_${linenumber}`).attr('cx', `${_xAxisScale(pointToHighlight.x)}`).attr('cy', `${yScale(pointToHighlight.y)}`).attr('visibility', 'visibility');
|
|
956
992
|
(0, _d3selection.select)(`#${_verticalLine}`).attr('transform', ()=>`translate(${_xAxisScale(pointToHighlight.x)}, ${yScale(pointToHighlight.y)})`).attr('visibility', 'visibility').attr('y2', `${lineHeight - 5 - yScale(pointToHighlight.y)}`);
|
|
993
|
+
const targetElement = document.getElementById(`${_staticHighlightCircle}_${linenumber}`);
|
|
994
|
+
const rect = targetElement.getBoundingClientRect();
|
|
957
995
|
setNearestCircleToHighlight(pointToHighlight);
|
|
958
|
-
updatePosition(
|
|
996
|
+
updatePosition(rect.x, rect.y);
|
|
959
997
|
setStackCalloutProps(found);
|
|
960
998
|
setYValueHover(found.values);
|
|
961
999
|
setDataPointCalloutProps(found);
|
|
@@ -968,13 +1006,7 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
968
1006
|
setActivePoint('');
|
|
969
1007
|
}
|
|
970
1008
|
};
|
|
971
|
-
function _handleFocus(event, lineId, x, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData) {
|
|
972
|
-
let cx = 0;
|
|
973
|
-
let cy = 0;
|
|
974
|
-
const targetRect = event.target.getBoundingClientRect();
|
|
975
|
-
cx = targetRect.left + targetRect.width / 2;
|
|
976
|
-
cy = targetRect.top + targetRect.height / 2;
|
|
977
|
-
updatePosition(cx, cy);
|
|
1009
|
+
function _handleFocus(event, lineId, x, xAxisCalloutData, circleId, targetElement, xAxisCalloutAccessibilityData) {
|
|
978
1010
|
_uniqueCallOutID = circleId;
|
|
979
1011
|
const formattedData = x instanceof Date ? (0, _chartutilities.formatDateToLocaleString)(x, props.culture, props.useUTC) : x;
|
|
980
1012
|
const xVal = x instanceof Date ? x.getTime() : x;
|
|
@@ -987,6 +1019,7 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
987
1019
|
setPopoverOpen(true);
|
|
988
1020
|
xAxisCalloutData ? setHoverXValue(xAxisCalloutData) : setHoverXValue('' + formattedData);
|
|
989
1021
|
setYValueHover(found.values);
|
|
1022
|
+
setRefSelected(targetElement);
|
|
990
1023
|
setStackCalloutProps(found);
|
|
991
1024
|
setDataPointCalloutProps(found);
|
|
992
1025
|
setActivePoint(circleId);
|
|
@@ -996,7 +1029,7 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
996
1029
|
setActivePoint(circleId);
|
|
997
1030
|
}
|
|
998
1031
|
}
|
|
999
|
-
function _handleHover(x, y, lineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, mouseEvent, yScale, legendVal, lineColor) {
|
|
1032
|
+
function _handleHover(x, y, lineHeight, xAxisCalloutData, circleId, xAxisCalloutAccessibilityData, mouseEvent, yScale, legendVal, lineColor, targetElement) {
|
|
1000
1033
|
mouseEvent === null || mouseEvent === void 0 ? void 0 : mouseEvent.persist();
|
|
1001
1034
|
const formattedData = x instanceof Date ? (0, _chartutilities.formatDateToLocaleString)(x, props.culture, props.useUTC) : x;
|
|
1002
1035
|
const xVal = x instanceof Date ? x.getTime() : x;
|
|
@@ -1019,7 +1052,8 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
1019
1052
|
(0, _d3selection.select)(`#${_verticalLine}`).attr('transform', ()=>`translate(${_xAxisScale(x)}, ${yScale(y)})`).attr('visibility', 'visibility').attr('y2', `${lineHeight - 5 - yScale(y)}`);
|
|
1020
1053
|
if (_uniqueCallOutID !== circleId) {
|
|
1021
1054
|
_uniqueCallOutID = circleId;
|
|
1022
|
-
|
|
1055
|
+
setRefSelected(targetElement);
|
|
1056
|
+
setPopoverOpen(true);
|
|
1023
1057
|
xAxisCalloutData ? setHoverXValue(xAxisCalloutData) : setHoverXValue('' + formattedData);
|
|
1024
1058
|
setYValueHover(found.values);
|
|
1025
1059
|
setYValue(yVal);
|
|
@@ -1179,8 +1213,11 @@ const LineChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
|
|
|
1179
1213
|
'data-is-focusable': true,
|
|
1180
1214
|
xAxisCalloutAccessibilityData: xAxisCalloutAccessibilityData,
|
|
1181
1215
|
...props.calloutProps,
|
|
1182
|
-
clickPosition: clickPosition,
|
|
1183
1216
|
isPopoverOpen: isPopoverOpen,
|
|
1217
|
+
clickPosition: clickPosition,
|
|
1218
|
+
positioning: {
|
|
1219
|
+
target: refSelected
|
|
1220
|
+
},
|
|
1184
1221
|
isCalloutForStack: props.isCalloutForStack,
|
|
1185
1222
|
culture: props.culture,
|
|
1186
1223
|
isCartesian: true,
|