@oliasoft-open-source/charts-library 4.7.3-beta-3 → 4.7.3
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/dist/index.js +95 -123
- package/dist/index.js.map +1 -1
- package/dist/src/components/common/common.interface.d.ts +0 -2
- package/dist/src/components/common/helpers/get-chart-annotation.d.ts +0 -2
- package/dist/src/components/common/plugins/annotation-dragger-plugin/annotation-dragger-plugin.d.ts +0 -1
- package/dist/src/components/common/plugins/annotation-dragger-plugin/helpers.d.ts +4 -6
- package/dist/src/components/line-chart/line-chart.stories.d.ts +15 -111
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -25236,7 +25236,6 @@ const getLineChartAxis = (options, axisType, state, currentScales, i2 = 0) => {
|
|
|
25236
25236
|
return ticks;
|
|
25237
25237
|
};
|
|
25238
25238
|
return {
|
|
25239
|
-
display: true,
|
|
25240
25239
|
type: additionalAxesOptions.chartScaleType,
|
|
25241
25240
|
position: axisData.position,
|
|
25242
25241
|
beginAtZero: additionalAxesOptions.beginAtZero,
|
|
@@ -25281,15 +25280,15 @@ const getLineChartScales = (options, state) => {
|
|
|
25281
25280
|
};
|
|
25282
25281
|
const estimateDataSeriesHaveCloseValues = (generatedDatasets) => {
|
|
25283
25282
|
var _a2;
|
|
25284
|
-
if (!Array.isArray(generatedDatasets) || !generatedDatasets.length) {
|
|
25283
|
+
if (!Array.isArray(generatedDatasets) || !(generatedDatasets == null ? void 0 : generatedDatasets.length)) {
|
|
25285
25284
|
return false;
|
|
25286
25285
|
}
|
|
25287
|
-
const axesFirstLast = generatedDatasets.reduce((acc, dataset) => {
|
|
25286
|
+
const axesFirstLast = generatedDatasets == null ? void 0 : generatedDatasets.reduce((acc, dataset) => {
|
|
25288
25287
|
var _a3, _b2, _c2, _d2;
|
|
25289
25288
|
const xAxisId = (dataset == null ? void 0 : dataset.xAxisID) ?? "defaultX";
|
|
25290
25289
|
const yAxisId = (dataset == null ? void 0 : dataset.yAxisID) ?? "defaultY";
|
|
25291
25290
|
const data = (dataset == null ? void 0 : dataset.data) ?? [];
|
|
25292
|
-
if (data && data.length) {
|
|
25291
|
+
if (data && (data == null ? void 0 : data.length)) {
|
|
25293
25292
|
const { x: xFirstCurrent, y: yFirstCurrent } = (data == null ? void 0 : data[0]) ?? {};
|
|
25294
25293
|
const { x: xLastCurrent = 0, y: yLastCurrent = 0 } = (data == null ? void 0 : data.at(-1)) ?? {};
|
|
25295
25294
|
const xFirstAcc = ((_a3 = acc == null ? void 0 : acc[xAxisId]) == null ? void 0 : _a3.xFirst) ?? xFirstCurrent;
|
|
@@ -25334,7 +25333,7 @@ const getSuggestedAxisRange = ({
|
|
|
25334
25333
|
);
|
|
25335
25334
|
const isNegative = Math.sign(dataMin) === -1 || Math.sign(dataMax) === -1;
|
|
25336
25335
|
const isCloseToZeroWithTolerance = isCloseTo(dataMin, 0, { absoluteDiff: MAX_DECIMAL_DIFF }) && isCloseTo(dataMax, 0, { absoluteDiff: MAX_DECIMAL_DIFF });
|
|
25337
|
-
if (!data.length || isCloseToZeroWithTolerance) {
|
|
25336
|
+
if (!(data == null ? void 0 : data.length) || isCloseToZeroWithTolerance) {
|
|
25338
25337
|
return defaultRange;
|
|
25339
25338
|
}
|
|
25340
25339
|
if (isCloseTo(dataMin, dataMax, { absoluteDiff: MAX_DECIMAL_DIFF })) {
|
|
@@ -25859,7 +25858,7 @@ const useLegend = () => {
|
|
|
25859
25858
|
return context;
|
|
25860
25859
|
};
|
|
25861
25860
|
const useLegendState = ({ chartRef, options }) => {
|
|
25862
|
-
const { state, dispatch } = useLegend();
|
|
25861
|
+
const { state, dispatch } = useLegend() ?? {};
|
|
25863
25862
|
const {
|
|
25864
25863
|
annotations,
|
|
25865
25864
|
interactions: { onLegendClick },
|
|
@@ -25868,16 +25867,16 @@ const useLegendState = ({ chartRef, options }) => {
|
|
|
25868
25867
|
const legendClick = useCallback(
|
|
25869
25868
|
(_2, legendItem2) => {
|
|
25870
25869
|
var _a2;
|
|
25871
|
-
const { datasetIndex = -1 } = legendItem2;
|
|
25870
|
+
const { datasetIndex = -1 } = legendItem2 ?? {};
|
|
25872
25871
|
let annotationIndex = null;
|
|
25873
25872
|
const chartInstance = chartRef == null ? void 0 : chartRef.current;
|
|
25874
25873
|
const datasets = ((_a2 = chartInstance == null ? void 0 : chartInstance.data) == null ? void 0 : _a2.datasets) ?? [];
|
|
25875
|
-
const dataset = datasets[datasetIndex] ?? {};
|
|
25874
|
+
const dataset = (datasets == null ? void 0 : datasets[datasetIndex]) ?? {};
|
|
25876
25875
|
if ((annotations == null ? void 0 : annotations.controlAnnotation) && (dataset == null ? void 0 : dataset.isAnnotation)) {
|
|
25877
|
-
annotationIndex = dataset.annotationIndex ?? null;
|
|
25876
|
+
annotationIndex = (dataset == null ? void 0 : dataset.annotationIndex) ?? null;
|
|
25878
25877
|
}
|
|
25879
25878
|
if (onLegendClick) {
|
|
25880
|
-
const legendState = legendItem2.hidden ?? false;
|
|
25879
|
+
const legendState = (legendItem2 == null ? void 0 : legendItem2.hidden) ?? false;
|
|
25881
25880
|
onLegendClick(legendItem2 == null ? void 0 : legendItem2.text, legendState);
|
|
25882
25881
|
}
|
|
25883
25882
|
dispatch({
|
|
@@ -25912,7 +25911,7 @@ const useLegendState = ({ chartRef, options }) => {
|
|
|
25912
25911
|
);
|
|
25913
25912
|
return {
|
|
25914
25913
|
legendClick,
|
|
25915
|
-
annotation: state.annotation,
|
|
25914
|
+
annotation: state == null ? void 0 : state.annotation,
|
|
25916
25915
|
legend: legend2,
|
|
25917
25916
|
customLegendPlugin
|
|
25918
25917
|
};
|
|
@@ -25964,9 +25963,9 @@ const useChartOptions = ({
|
|
|
25964
25963
|
dispatch,
|
|
25965
25964
|
generatedDatasets
|
|
25966
25965
|
});
|
|
25967
|
-
const { legend: legend2, customLegendPlugin } = useLegendState({ chartRef, options });
|
|
25968
|
-
const { state: legendState } = useLegend();
|
|
25969
|
-
const { annotation: annotation2 } = legendState;
|
|
25966
|
+
const { legend: legend2, customLegendPlugin } = useLegendState({ chartRef, options }) ?? {};
|
|
25967
|
+
const { state: legendState } = useLegend() ?? {};
|
|
25968
|
+
const { annotation: annotation2 } = legendState ?? {};
|
|
25970
25969
|
const datalabels = getLineChartDataLabels(options);
|
|
25971
25970
|
const tooltip = getLineChartToolTips(options);
|
|
25972
25971
|
const scales = useMemo(
|
|
@@ -26006,7 +26005,7 @@ const useChartOptions = ({
|
|
|
26006
26005
|
const plugins = {
|
|
26007
26006
|
datalabels,
|
|
26008
26007
|
annotationDraggerPlugin: {
|
|
26009
|
-
enabled: state.enableDragAnnotation
|
|
26008
|
+
enabled: state == null ? void 0 : state.enableDragAnnotation
|
|
26010
26009
|
},
|
|
26011
26010
|
annotation: toAnnotationObject(annotation2),
|
|
26012
26011
|
zoom: { pan: panOptions, zoom: zoomOptions },
|
|
@@ -26030,32 +26029,35 @@ const useChartOptions = ({
|
|
|
26030
26029
|
...dragData
|
|
26031
26030
|
};
|
|
26032
26031
|
return useMemo(
|
|
26033
|
-
() =>
|
|
26034
|
-
|
|
26035
|
-
|
|
26036
|
-
|
|
26037
|
-
|
|
26038
|
-
|
|
26039
|
-
|
|
26040
|
-
|
|
26041
|
-
|
|
26042
|
-
|
|
26043
|
-
|
|
26044
|
-
|
|
26045
|
-
|
|
26046
|
-
|
|
26047
|
-
|
|
26048
|
-
|
|
26049
|
-
|
|
26050
|
-
|
|
26051
|
-
|
|
26052
|
-
|
|
26053
|
-
|
|
26054
|
-
|
|
26055
|
-
|
|
26056
|
-
|
|
26057
|
-
|
|
26058
|
-
|
|
26032
|
+
() => {
|
|
26033
|
+
var _a2, _b2, _c2;
|
|
26034
|
+
return {
|
|
26035
|
+
layout: {
|
|
26036
|
+
padding: layoutPadding
|
|
26037
|
+
},
|
|
26038
|
+
onHover: onHover(hoveredPoint, setHoveredPoint),
|
|
26039
|
+
maintainAspectRatio: (_a2 = options == null ? void 0 : options.chartStyling) == null ? void 0 : _a2.maintainAspectRatio,
|
|
26040
|
+
aspectRatio: ((_b2 = options == null ? void 0 : options.chartStyling) == null ? void 0 : _b2.squareAspectRatio) ? 1 : 0,
|
|
26041
|
+
animation: ((_c2 = options == null ? void 0 : options.chartStyling) == null ? void 0 : _c2.performanceMode) ? false : {
|
|
26042
|
+
duration: ANIMATION_DURATION.FAST,
|
|
26043
|
+
onComplete: onAnimationComplete
|
|
26044
|
+
},
|
|
26045
|
+
hover: {
|
|
26046
|
+
mode: ChartHoverMode.Nearest,
|
|
26047
|
+
intersect: true
|
|
26048
|
+
},
|
|
26049
|
+
elements: {
|
|
26050
|
+
line: {
|
|
26051
|
+
pointStyle: PointStyle.Circle,
|
|
26052
|
+
showLine: lineEnabled,
|
|
26053
|
+
tension: 0
|
|
26054
|
+
}
|
|
26055
|
+
},
|
|
26056
|
+
scales,
|
|
26057
|
+
plugins,
|
|
26058
|
+
events: Object.values(Events)
|
|
26059
|
+
};
|
|
26060
|
+
},
|
|
26059
26061
|
[state, options, chartRef]
|
|
26060
26062
|
);
|
|
26061
26063
|
};
|
|
@@ -26361,14 +26363,13 @@ const chartAreaTextPlugin = {
|
|
|
26361
26363
|
});
|
|
26362
26364
|
}
|
|
26363
26365
|
};
|
|
26364
|
-
const getMousePositionInCoordinates = (event, canvas2, scales
|
|
26366
|
+
const getMousePositionInCoordinates = (event, canvas2, scales) => {
|
|
26367
|
+
var _a2, _b2;
|
|
26365
26368
|
const rect = canvas2.getBoundingClientRect();
|
|
26366
26369
|
const x2 = event.clientX - rect.left;
|
|
26367
26370
|
const y2 = event.clientY - rect.top;
|
|
26368
|
-
const
|
|
26369
|
-
const
|
|
26370
|
-
const xValue = (xScale == null ? void 0 : xScale.getValueForPixel(x2)) ?? -1;
|
|
26371
|
-
const yValue = (yScale == null ? void 0 : yScale.getValueForPixel(y2)) ?? -1;
|
|
26371
|
+
const xValue = ((_a2 = scales == null ? void 0 : scales.x) == null ? void 0 : _a2.getValueForPixel(x2)) ?? -1;
|
|
26372
|
+
const yValue = ((_b2 = scales == null ? void 0 : scales.y) == null ? void 0 : _b2.getValueForPixel(y2)) ?? -1;
|
|
26372
26373
|
return { x: xValue, y: yValue };
|
|
26373
26374
|
};
|
|
26374
26375
|
const calculateAnnotationMetricsInValues = (annotation2) => {
|
|
@@ -26395,30 +26396,29 @@ const calculateAnnotationMetricsInValues = (annotation2) => {
|
|
|
26395
26396
|
height
|
|
26396
26397
|
};
|
|
26397
26398
|
};
|
|
26398
|
-
const calculateAnnotationMetricsInValuesInPixels = (annotation2, scales
|
|
26399
|
+
const calculateAnnotationMetricsInValuesInPixels = (annotation2, scales) => {
|
|
26399
26400
|
const { xMin, xMax, yMin, yMax, xValue, yValue, type } = annotation2 ?? {};
|
|
26401
|
+
const { x: x2, y: y2 } = scales ?? {};
|
|
26400
26402
|
let centerX;
|
|
26401
26403
|
let centerY;
|
|
26402
26404
|
let width;
|
|
26403
26405
|
let height;
|
|
26404
|
-
const xScale = scales[xScaleID];
|
|
26405
|
-
const yScale = scales[yScaleID];
|
|
26406
26406
|
if (!isNil(xMin) && !isNil(xMax) && !isNil(yMin) && !isNil(yMax) && type === AnnotationType.BOX) {
|
|
26407
26407
|
const xCenterValue = (xMin + xMax) / 2;
|
|
26408
26408
|
const yCenterValue = (yMin + yMax) / 2;
|
|
26409
|
-
const xMinValue = (
|
|
26410
|
-
const xMaxValue = (
|
|
26411
|
-
const yMinValue = (
|
|
26412
|
-
const yMaxValue = (
|
|
26409
|
+
const xMinValue = (x2 == null ? void 0 : x2.getPixelForValue(xMin)) ?? 0;
|
|
26410
|
+
const xMaxValue = (x2 == null ? void 0 : x2.getPixelForValue(xMax)) ?? 0;
|
|
26411
|
+
const yMinValue = (y2 == null ? void 0 : y2.getPixelForValue(yMin)) ?? 0;
|
|
26412
|
+
const yMaxValue = (y2 == null ? void 0 : y2.getPixelForValue(yMax)) ?? 0;
|
|
26413
26413
|
width = xMinValue - xMaxValue;
|
|
26414
26414
|
height = yMinValue - yMaxValue;
|
|
26415
|
-
centerX = (
|
|
26416
|
-
centerY = (
|
|
26415
|
+
centerX = (x2 == null ? void 0 : x2.getPixelForValue(xCenterValue)) ?? -1;
|
|
26416
|
+
centerY = (y2 == null ? void 0 : y2.getPixelForValue(yCenterValue)) ?? -1;
|
|
26417
26417
|
} else if (!isNil(xValue) && !isNil(yValue) && type === AnnotationType.POINT) {
|
|
26418
26418
|
width = 0;
|
|
26419
26419
|
height = 0;
|
|
26420
|
-
centerX = (
|
|
26421
|
-
centerY = (
|
|
26420
|
+
centerX = (x2 == null ? void 0 : x2.getPixelForValue(xValue)) ?? -1;
|
|
26421
|
+
centerY = (y2 == null ? void 0 : y2.getPixelForValue(yValue)) ?? -1;
|
|
26422
26422
|
}
|
|
26423
26423
|
return {
|
|
26424
26424
|
centerX,
|
|
@@ -26435,9 +26435,7 @@ const isWithinChartArea = ({
|
|
|
26435
26435
|
metrics,
|
|
26436
26436
|
resizable = false,
|
|
26437
26437
|
dragRange,
|
|
26438
|
-
annotationType
|
|
26439
|
-
xScaleID,
|
|
26440
|
-
yScaleID
|
|
26438
|
+
annotationType
|
|
26441
26439
|
}) => {
|
|
26442
26440
|
if (resizable && !dragRange) {
|
|
26443
26441
|
return true;
|
|
@@ -26447,12 +26445,10 @@ const isWithinChartArea = ({
|
|
|
26447
26445
|
const withinRangeY = y2 !== void 0 && dragRange.y ? y2 >= dragRange.y[0] && y2 <= dragRange.y[1] : true;
|
|
26448
26446
|
return withinRangeX && withinRangeY;
|
|
26449
26447
|
}
|
|
26450
|
-
const
|
|
26451
|
-
const
|
|
26452
|
-
const
|
|
26453
|
-
const
|
|
26454
|
-
const minY = (yScale == null ? void 0 : yScale.getValueForPixel(chartArea.bottom)) ?? Number.NEGATIVE_INFINITY;
|
|
26455
|
-
const maxY = (yScale == null ? void 0 : yScale.getValueForPixel(chartArea.top)) ?? Number.POSITIVE_INFINITY;
|
|
26448
|
+
const minX = scales.x.getValueForPixel(chartArea.left) ?? Number.NEGATIVE_INFINITY;
|
|
26449
|
+
const maxX = scales.x.getValueForPixel(chartArea.right) ?? Number.POSITIVE_INFINITY;
|
|
26450
|
+
const minY = scales.y.getValueForPixel(chartArea.bottom) ?? Number.NEGATIVE_INFINITY;
|
|
26451
|
+
const maxY = scales.y.getValueForPixel(chartArea.top) ?? Number.POSITIVE_INFINITY;
|
|
26456
26452
|
if (annotationType === AnnotationType.POINT) {
|
|
26457
26453
|
const withinX = x2 !== void 0 ? x2 >= minX && x2 <= maxX : true;
|
|
26458
26454
|
const withinY = y2 !== void 0 ? y2 >= minY && y2 <= maxY : true;
|
|
@@ -26469,7 +26465,7 @@ const isWithinChartArea = ({
|
|
|
26469
26465
|
}
|
|
26470
26466
|
return true;
|
|
26471
26467
|
};
|
|
26472
|
-
const updateAnnotationPositionWithinBounds = (axis, newPosition, activeAnnotation, chart2, scales,
|
|
26468
|
+
const updateAnnotationPositionWithinBounds = (axis, newPosition, activeAnnotation, chart2, scales, metrics) => {
|
|
26473
26469
|
const { resizable, dragRange = null } = activeAnnotation ?? {};
|
|
26474
26470
|
const checkArea = isWithinChartArea({
|
|
26475
26471
|
[axis]: newPosition,
|
|
@@ -26478,9 +26474,7 @@ const updateAnnotationPositionWithinBounds = (axis, newPosition, activeAnnotatio
|
|
|
26478
26474
|
resizable,
|
|
26479
26475
|
dragRange,
|
|
26480
26476
|
metrics: metrics || {},
|
|
26481
|
-
annotationType: activeAnnotation.type
|
|
26482
|
-
xScaleID,
|
|
26483
|
-
yScaleID
|
|
26477
|
+
annotationType: activeAnnotation.type
|
|
26484
26478
|
});
|
|
26485
26479
|
if (!checkArea) return;
|
|
26486
26480
|
if (activeAnnotation.type === AnnotationType.POINT) {
|
|
@@ -26509,16 +26503,9 @@ const setAnnotationBorderWidth = (chart2, annotationId, borderWidth) => {
|
|
|
26509
26503
|
}
|
|
26510
26504
|
};
|
|
26511
26505
|
const handleAnnotationMouseDown = (event, canvas2, scales, annotations, setDraggingState, hoveredAnnotationId) => {
|
|
26506
|
+
const { x: x2, y: y2 } = getMousePositionInCoordinates(event, canvas2, scales);
|
|
26512
26507
|
const annotation2 = hoveredAnnotationId ? annotations == null ? void 0 : annotations[hoveredAnnotationId] : null;
|
|
26513
26508
|
if (!annotation2) return;
|
|
26514
|
-
const { xScaleID = "x", yScaleID = "y" } = annotation2;
|
|
26515
|
-
const { x: x2, y: y2 } = getMousePositionInCoordinates(
|
|
26516
|
-
event,
|
|
26517
|
-
canvas2,
|
|
26518
|
-
scales,
|
|
26519
|
-
xScaleID,
|
|
26520
|
-
yScaleID
|
|
26521
|
-
);
|
|
26522
26509
|
const metrics = calculateAnnotationMetricsInValues(annotation2);
|
|
26523
26510
|
if (annotation2 && annotation2.enableDrag && !isNil(metrics.centerY) && !isNil(metrics.centerX)) {
|
|
26524
26511
|
canvas2.style.cursor = CursorStyle.Move;
|
|
@@ -26526,7 +26513,7 @@ const handleAnnotationMouseDown = (event, canvas2, scales, annotations, setDragg
|
|
|
26526
26513
|
const dragStartY = y2 - metrics.centerY;
|
|
26527
26514
|
setDraggingState(true, annotation2, dragStartX, dragStartY);
|
|
26528
26515
|
if (annotation2 == null ? void 0 : annotation2.onDragStart) {
|
|
26529
|
-
annotation2.onDragStart({ x: x2, y: y2 }, annotation2);
|
|
26516
|
+
annotation2.onDragStart({ x: x2, y: y2 }, cloneDeep(annotation2));
|
|
26530
26517
|
}
|
|
26531
26518
|
}
|
|
26532
26519
|
};
|
|
@@ -26536,14 +26523,7 @@ const handleAnnotationMouseMove = (event, canvas2, scales, isDragging2, activeAn
|
|
|
26536
26523
|
const annotationId = activeAnnotation == null ? void 0 : activeAnnotation.id;
|
|
26537
26524
|
setAnnotationBorderWidth(chart2, annotationId, BORDER_WIDTH.HOVERED);
|
|
26538
26525
|
const dragAxis = (activeAnnotation == null ? void 0 : activeAnnotation.dragAxis) ?? DragAxis.Both;
|
|
26539
|
-
const {
|
|
26540
|
-
const { x: x2, y: y2 } = getMousePositionInCoordinates(
|
|
26541
|
-
event,
|
|
26542
|
-
canvas2,
|
|
26543
|
-
scales,
|
|
26544
|
-
xScaleID,
|
|
26545
|
-
yScaleID
|
|
26546
|
-
);
|
|
26526
|
+
const { x: x2, y: y2 } = getMousePositionInCoordinates(event, canvas2, scales);
|
|
26547
26527
|
const metrics = calculateAnnotationMetricsInValues(activeAnnotation);
|
|
26548
26528
|
let newCenterX = x2 - dragStartX;
|
|
26549
26529
|
let newCenterY = y2 - dragStartY;
|
|
@@ -26554,8 +26534,6 @@ const handleAnnotationMouseMove = (event, canvas2, scales, isDragging2, activeAn
|
|
|
26554
26534
|
activeAnnotation,
|
|
26555
26535
|
chart2,
|
|
26556
26536
|
scales,
|
|
26557
|
-
xScaleID,
|
|
26558
|
-
yScaleID,
|
|
26559
26537
|
metrics
|
|
26560
26538
|
);
|
|
26561
26539
|
}
|
|
@@ -26566,23 +26544,16 @@ const handleAnnotationMouseMove = (event, canvas2, scales, isDragging2, activeAn
|
|
|
26566
26544
|
activeAnnotation,
|
|
26567
26545
|
chart2,
|
|
26568
26546
|
scales,
|
|
26569
|
-
xScaleID,
|
|
26570
|
-
yScaleID,
|
|
26571
26547
|
metrics
|
|
26572
26548
|
);
|
|
26573
26549
|
}
|
|
26574
26550
|
chart2.update();
|
|
26575
26551
|
if (activeAnnotation == null ? void 0 : activeAnnotation.onDrag) {
|
|
26576
|
-
activeAnnotation.onDrag({ x: x2, y: y2 }, activeAnnotation);
|
|
26552
|
+
activeAnnotation.onDrag({ x: x2, y: y2 }, cloneDeep(activeAnnotation));
|
|
26577
26553
|
}
|
|
26578
26554
|
const { ctx, width, height } = chart2;
|
|
26579
26555
|
const { centerX, centerY } = calculateAnnotationMetricsInValues(activeAnnotation) ?? {};
|
|
26580
|
-
const { centerX: xValue, centerY: yValue } = calculateAnnotationMetricsInValuesInPixels(
|
|
26581
|
-
activeAnnotation,
|
|
26582
|
-
scales,
|
|
26583
|
-
xScaleID,
|
|
26584
|
-
yScaleID
|
|
26585
|
-
);
|
|
26556
|
+
const { centerX: xValue, centerY: yValue } = calculateAnnotationMetricsInValuesInPixels(activeAnnotation, scales);
|
|
26586
26557
|
if (!isNil(centerX) && !isNil(centerY) && !isNil(xValue) && !isNil(yValue)) {
|
|
26587
26558
|
ctx.save();
|
|
26588
26559
|
ctx.clearRect(0, 0, width, height);
|
|
@@ -26615,7 +26586,7 @@ const handleAnnotationMouseUp = (isDragging2, activeAnnotation, chart2, setDragg
|
|
|
26615
26586
|
if (activeAnnotation == null ? void 0 : activeAnnotation.onDragEnd) {
|
|
26616
26587
|
activeAnnotation.onDragEnd(
|
|
26617
26588
|
{ x: centerX, y: centerY },
|
|
26618
|
-
activeAnnotation
|
|
26589
|
+
cloneDeep(activeAnnotation)
|
|
26619
26590
|
);
|
|
26620
26591
|
}
|
|
26621
26592
|
chart2.canvas.style.cursor = CursorStyle.Pointer;
|
|
@@ -26692,7 +26663,7 @@ const annotationDraggerPlugin = {
|
|
|
26692
26663
|
const pluginOptions = ((_b2 = (_a2 = chart2 == null ? void 0 : chart2.options) == null ? void 0 : _a2.plugins) == null ? void 0 : _b2.annotationDraggerPlugin) || {
|
|
26693
26664
|
enabled: false
|
|
26694
26665
|
};
|
|
26695
|
-
const typedScales = {
|
|
26666
|
+
const typedScales = { x: scales.x, y: scales.y };
|
|
26696
26667
|
let annotations = ((_d2 = (_c2 = chart2.options.plugins) == null ? void 0 : _c2.annotation) == null ? void 0 : _d2.annotations) ?? {};
|
|
26697
26668
|
if (!chart2 && !annotations) return;
|
|
26698
26669
|
if (pluginOptions.enabled) {
|
|
@@ -26811,7 +26782,7 @@ const config = {
|
|
|
26811
26782
|
[INIT_KEYS.TRANSLATIONS]: getTranslations(),
|
|
26812
26783
|
[INIT_KEYS.LANGUAGE_KEY]: "en"
|
|
26813
26784
|
};
|
|
26814
|
-
const getConfig = (key = "") => key ? config[key] : config;
|
|
26785
|
+
const getConfig = (key = "") => key ? config == null ? void 0 : config[key] : config;
|
|
26815
26786
|
const setConfig = (key, newValue) => {
|
|
26816
26787
|
config[key] = newValue;
|
|
26817
26788
|
};
|
|
@@ -27263,7 +27234,7 @@ const LineChart = (props) => {
|
|
|
27263
27234
|
var _a2, _b2;
|
|
27264
27235
|
setDefaultTheme();
|
|
27265
27236
|
const chartRef = useRef(null);
|
|
27266
|
-
const { table: table2 } = props;
|
|
27237
|
+
const { table: table2 } = props ?? {};
|
|
27267
27238
|
const { translations, languageKey } = getConfig();
|
|
27268
27239
|
const chart2 = getDefaultProps$3(props);
|
|
27269
27240
|
const {
|
|
@@ -27273,7 +27244,7 @@ const LineChart = (props) => {
|
|
|
27273
27244
|
persistenceId,
|
|
27274
27245
|
controlsPortalId
|
|
27275
27246
|
} = chart2;
|
|
27276
|
-
const { annotations, axes, chartStyling, graph } = options;
|
|
27247
|
+
const { annotations, axes, chartStyling, graph } = options ?? {};
|
|
27277
27248
|
const showCustomLegend = !((_b2 = (_a2 = options == null ? void 0 : options.legend) == null ? void 0 : _a2.customLegend) == null ? void 0 : _b2.customLegendContainerID);
|
|
27278
27249
|
const [state, dispatch] = useReducer(
|
|
27279
27250
|
reducer$1,
|
|
@@ -27362,10 +27333,10 @@ const LineChart = (props) => {
|
|
|
27362
27333
|
]
|
|
27363
27334
|
},
|
|
27364
27335
|
generateKey([
|
|
27365
|
-
state.enableDragPoints,
|
|
27366
|
-
state.enableDragAnnotation,
|
|
27367
|
-
state.zoomEnabled,
|
|
27368
|
-
state.panEnabled,
|
|
27336
|
+
state == null ? void 0 : state.enableDragPoints,
|
|
27337
|
+
state == null ? void 0 : state.enableDragAnnotation,
|
|
27338
|
+
state == null ? void 0 : state.zoomEnabled,
|
|
27339
|
+
state == null ? void 0 : state.panEnabled,
|
|
27369
27340
|
languageKey
|
|
27370
27341
|
])
|
|
27371
27342
|
);
|
|
@@ -39990,8 +39961,8 @@ const Ht = { id: "dragdata", afterInit: function(t) {
|
|
|
39990
39961
|
Chart.register(Ht);
|
|
39991
39962
|
const useBarChartConfig = (chartRef, chart2) => {
|
|
39992
39963
|
var _a2;
|
|
39993
|
-
const { options } = chart2;
|
|
39994
|
-
const { interactions } = options;
|
|
39964
|
+
const { options } = chart2 ?? {};
|
|
39965
|
+
const { interactions } = options ?? {};
|
|
39995
39966
|
const [pointHover, setPointHover] = useState(false);
|
|
39996
39967
|
const generateBarChartDatasets = ({
|
|
39997
39968
|
datasets,
|
|
@@ -40003,29 +39974,30 @@ const useBarChartConfig = (chartRef, chart2) => {
|
|
|
40003
39974
|
const annotationsDatasets = controlAnnotation && showAnnotations && (annotationsData == null ? void 0 : annotationsData.length) ? annotationsData.map(
|
|
40004
39975
|
(annotation2, index2) => ({
|
|
40005
39976
|
isAnnotation: true,
|
|
40006
|
-
label: annotation2.label,
|
|
39977
|
+
label: annotation2 == null ? void 0 : annotation2.label,
|
|
40007
39978
|
annotationIndex: index2,
|
|
40008
|
-
backgroundColor: annotation2.color || COLORS[index2],
|
|
40009
|
-
borderColor: annotation2.color || COLORS[index2],
|
|
39979
|
+
backgroundColor: (annotation2 == null ? void 0 : annotation2.color) || COLORS[index2],
|
|
39980
|
+
borderColor: (annotation2 == null ? void 0 : annotation2.color) || COLORS[index2],
|
|
40010
39981
|
data: [],
|
|
40011
39982
|
type: ChartType$1.Bar
|
|
40012
39983
|
})
|
|
40013
39984
|
) : [];
|
|
40014
39985
|
const barDatasetsCopy = [...datasets, ...annotationsDatasets];
|
|
40015
|
-
const generatedDatasets2 = barDatasetsCopy.map((barDataset, index2) => {
|
|
39986
|
+
const generatedDatasets2 = barDatasetsCopy == null ? void 0 : barDatasetsCopy.map((barDataset, index2) => {
|
|
39987
|
+
var _a3;
|
|
40016
39988
|
const colorSchema = COLORS;
|
|
40017
|
-
const colors2 = barDataset.data.map((_2) => {
|
|
40018
|
-
const colorSelectionIndex = datasets.length > 1 ? index2 : 0;
|
|
40019
|
-
return colorSchema[colorSelectionIndex] || generateRandomColor(COLORS);
|
|
39989
|
+
const colors2 = (_a3 = barDataset == null ? void 0 : barDataset.data) == null ? void 0 : _a3.map((_2) => {
|
|
39990
|
+
const colorSelectionIndex = (datasets == null ? void 0 : datasets.length) > 1 ? index2 : 0;
|
|
39991
|
+
return (colorSchema == null ? void 0 : colorSchema[colorSelectionIndex]) || generateRandomColor(COLORS);
|
|
40020
39992
|
});
|
|
40021
|
-
const backgroundColors = barDataset.backgroundColor || colors2.map((color2) => color2 + ALPHA_CHANEL);
|
|
39993
|
+
const backgroundColors = (barDataset == null ? void 0 : barDataset.backgroundColor) || (colors2 == null ? void 0 : colors2.map((color2) => color2 + ALPHA_CHANEL));
|
|
40022
39994
|
const datasetWithBorderWidth = "borderWidth" in barDatasetsCopy ? {
|
|
40023
|
-
borderWidth: parseFloat(String(barDatasetsCopy.borderWidth)) ?? 1
|
|
39995
|
+
borderWidth: parseFloat(String(barDatasetsCopy == null ? void 0 : barDatasetsCopy.borderWidth)) ?? 1
|
|
40024
39996
|
} : {};
|
|
40025
39997
|
return {
|
|
40026
39998
|
...barDataset,
|
|
40027
39999
|
...datasetWithBorderWidth,
|
|
40028
|
-
borderColor: barDataset.borderColor || colors2[index2],
|
|
40000
|
+
borderColor: (barDataset == null ? void 0 : barDataset.borderColor) || (colors2 == null ? void 0 : colors2[index2]),
|
|
40029
40001
|
backgroundColor: backgroundColors
|
|
40030
40002
|
};
|
|
40031
40003
|
});
|
|
@@ -40041,16 +40013,16 @@ const useBarChartConfig = (chartRef, chart2) => {
|
|
|
40041
40013
|
const onHover = (evt, hoveredItems) => {
|
|
40042
40014
|
if (pointHover && !(hoveredItems == null ? void 0 : hoveredItems.length)) {
|
|
40043
40015
|
setPointHover(false);
|
|
40044
|
-
if (interactions.onUnhover) {
|
|
40045
|
-
interactions.onUnhover(evt);
|
|
40016
|
+
if (interactions == null ? void 0 : interactions.onUnhover) {
|
|
40017
|
+
interactions == null ? void 0 : interactions.onUnhover(evt);
|
|
40046
40018
|
}
|
|
40047
40019
|
}
|
|
40048
40020
|
if (!pointHover && (hoveredItems == null ? void 0 : hoveredItems.length)) {
|
|
40049
40021
|
setPointHover(true);
|
|
40050
40022
|
if (interactions.onHover) {
|
|
40051
|
-
const { index: index2, datasetIndex } = hoveredItems[0];
|
|
40023
|
+
const { index: index2, datasetIndex } = (hoveredItems == null ? void 0 : hoveredItems[0]) ?? {};
|
|
40052
40024
|
const generatedDataset = generatedDatasets;
|
|
40053
|
-
interactions.onHover(evt, datasetIndex, index2, generatedDataset);
|
|
40025
|
+
interactions == null ? void 0 : interactions.onHover(evt, datasetIndex, index2, generatedDataset);
|
|
40054
40026
|
}
|
|
40055
40027
|
}
|
|
40056
40028
|
};
|