@oliasoft-open-source/charts-library 4.7.3-beta-2 → 4.7.3

package/dist/index.js

@@ -25236,7 +25236,6 @@ const getLineChartAxis = (options, axisType, state, currentScales, i2 = 0) => {
     return ticks;
   };
   return {
-    display: true,
     type: additionalAxesOptions.chartScaleType,
     position: axisData.position,
     beginAtZero: additionalAxesOptions.beginAtZero,
@@ -25281,15 +25280,15 @@ const getLineChartScales = (options, state) => {
 };
 const estimateDataSeriesHaveCloseValues = (generatedDatasets) => {
   var _a2;
-  if (!Array.isArray(generatedDatasets) || !generatedDatasets.length) {
+  if (!Array.isArray(generatedDatasets) || !(generatedDatasets == null ? void 0 : generatedDatasets.length)) {
     return false;
   }
-  const axesFirstLast = generatedDatasets.reduce((acc, dataset) => {
+  const axesFirstLast = generatedDatasets == null ? void 0 : generatedDatasets.reduce((acc, dataset) => {
     var _a3, _b2, _c2, _d2;
     const xAxisId = (dataset == null ? void 0 : dataset.xAxisID) ?? "defaultX";
     const yAxisId = (dataset == null ? void 0 : dataset.yAxisID) ?? "defaultY";
     const data = (dataset == null ? void 0 : dataset.data) ?? [];
-    if (data && data.length) {
+    if (data && (data == null ? void 0 : data.length)) {
       const { x: xFirstCurrent, y: yFirstCurrent } = (data == null ? void 0 : data[0]) ?? {};
       const { x: xLastCurrent = 0, y: yLastCurrent = 0 } = (data == null ? void 0 : data.at(-1)) ?? {};
       const xFirstAcc = ((_a3 = acc == null ? void 0 : acc[xAxisId]) == null ? void 0 : _a3.xFirst) ?? xFirstCurrent;
@@ -25334,7 +25333,7 @@ const getSuggestedAxisRange = ({
   );
   const isNegative = Math.sign(dataMin) === -1 || Math.sign(dataMax) === -1;
   const isCloseToZeroWithTolerance = isCloseTo(dataMin, 0, { absoluteDiff: MAX_DECIMAL_DIFF }) && isCloseTo(dataMax, 0, { absoluteDiff: MAX_DECIMAL_DIFF });
-  if (!data.length || isCloseToZeroWithTolerance) {
+  if (!(data == null ? void 0 : data.length) || isCloseToZeroWithTolerance) {
     return defaultRange;
   }
   if (isCloseTo(dataMin, dataMax, { absoluteDiff: MAX_DECIMAL_DIFF })) {
@@ -25859,7 +25858,7 @@ const useLegend = () => {
   return context;
 };
 const useLegendState = ({ chartRef, options }) => {
-  const { state, dispatch } = useLegend();
+  const { state, dispatch } = useLegend() ?? {};
   const {
     annotations,
     interactions: { onLegendClick },
@@ -25868,16 +25867,16 @@ const useLegendState = ({ chartRef, options }) => {
   const legendClick = useCallback(
     (_2, legendItem2) => {
       var _a2;
-      const { datasetIndex = -1 } = legendItem2;
+      const { datasetIndex = -1 } = legendItem2 ?? {};
       let annotationIndex = null;
       const chartInstance = chartRef == null ? void 0 : chartRef.current;
       const datasets = ((_a2 = chartInstance == null ? void 0 : chartInstance.data) == null ? void 0 : _a2.datasets) ?? [];
-      const dataset = datasets[datasetIndex] ?? {};
+      const dataset = (datasets == null ? void 0 : datasets[datasetIndex]) ?? {};
       if ((annotations == null ? void 0 : annotations.controlAnnotation) && (dataset == null ? void 0 : dataset.isAnnotation)) {
-        annotationIndex = dataset.annotationIndex ?? null;
+        annotationIndex = (dataset == null ? void 0 : dataset.annotationIndex) ?? null;
       }
       if (onLegendClick) {
-        const legendState = legendItem2.hidden ?? false;
+        const legendState = (legendItem2 == null ? void 0 : legendItem2.hidden) ?? false;
         onLegendClick(legendItem2 == null ? void 0 : legendItem2.text, legendState);
       }
       dispatch({
@@ -25912,7 +25911,7 @@ const useLegendState = ({ chartRef, options }) => {
   );
   return {
     legendClick,
-    annotation: state.annotation,
+    annotation: state == null ? void 0 : state.annotation,
     legend: legend2,
     customLegendPlugin
   };
@@ -25964,9 +25963,9 @@ const useChartOptions = ({
     dispatch,
     generatedDatasets
   });
-  const { legend: legend2, customLegendPlugin } = useLegendState({ chartRef, options });
-  const { state: legendState } = useLegend();
-  const { annotation: annotation2 } = legendState;
+  const { legend: legend2, customLegendPlugin } = useLegendState({ chartRef, options }) ?? {};
+  const { state: legendState } = useLegend() ?? {};
+  const { annotation: annotation2 } = legendState ?? {};
   const datalabels = getLineChartDataLabels(options);
   const tooltip = getLineChartToolTips(options);
   const scales = useMemo(
@@ -26006,7 +26005,7 @@ const useChartOptions = ({
   const plugins = {
     datalabels,
     annotationDraggerPlugin: {
-      enabled: state.enableDragAnnotation
+      enabled: state == null ? void 0 : state.enableDragAnnotation
     },
     annotation: toAnnotationObject(annotation2),
     zoom: { pan: panOptions, zoom: zoomOptions },
@@ -26030,32 +26029,35 @@ const useChartOptions = ({
     ...dragData
   };
   return useMemo(
-    () => ({
-      layout: {
-        padding: layoutPadding
-      },
-      onHover: onHover(hoveredPoint, setHoveredPoint),
-      maintainAspectRatio: options.chartStyling.maintainAspectRatio,
-      aspectRatio: options.chartStyling.squareAspectRatio ? 1 : 0,
-      animation: options.chartStyling.performanceMode ? false : {
-        duration: ANIMATION_DURATION.FAST,
-        onComplete: onAnimationComplete
-      },
-      hover: {
-        mode: ChartHoverMode.Nearest,
-        intersect: true
-      },
-      elements: {
-        line: {
-          pointStyle: PointStyle.Circle,
-          showLine: lineEnabled,
-          tension: 0
-        }
-      },
-      scales,
-      plugins,
-      events: Object.values(Events)
-    }),
+    () => {
+      var _a2, _b2, _c2;
+      return {
+        layout: {
+          padding: layoutPadding
+        },
+        onHover: onHover(hoveredPoint, setHoveredPoint),
+        maintainAspectRatio: (_a2 = options == null ? void 0 : options.chartStyling) == null ? void 0 : _a2.maintainAspectRatio,
+        aspectRatio: ((_b2 = options == null ? void 0 : options.chartStyling) == null ? void 0 : _b2.squareAspectRatio) ? 1 : 0,
+        animation: ((_c2 = options == null ? void 0 : options.chartStyling) == null ? void 0 : _c2.performanceMode) ? false : {
+          duration: ANIMATION_DURATION.FAST,
+          onComplete: onAnimationComplete
+        },
+        hover: {
+          mode: ChartHoverMode.Nearest,
+          intersect: true
+        },
+        elements: {
+          line: {
+            pointStyle: PointStyle.Circle,
+            showLine: lineEnabled,
+            tension: 0
+          }
+        },
+        scales,
+        plugins,
+        events: Object.values(Events)
+      };
+    },
     [state, options, chartRef]
   );
 };
@@ -26361,14 +26363,13 @@ const chartAreaTextPlugin = {
     });
   }
 };
-const getMousePositionInCoordinates = (event, canvas2, scales, xScaleID, yScaleID) => {
+const getMousePositionInCoordinates = (event, canvas2, scales) => {
+  var _a2, _b2;
   const rect = canvas2.getBoundingClientRect();
   const x2 = event.clientX - rect.left;
   const y2 = event.clientY - rect.top;
-  const xScale = scales[xScaleID];
-  const yScale = scales[yScaleID];
-  const xValue = (xScale == null ? void 0 : xScale.getValueForPixel(x2)) ?? -1;
-  const yValue = (yScale == null ? void 0 : yScale.getValueForPixel(y2)) ?? -1;
+  const xValue = ((_a2 = scales == null ? void 0 : scales.x) == null ? void 0 : _a2.getValueForPixel(x2)) ?? -1;
+  const yValue = ((_b2 = scales == null ? void 0 : scales.y) == null ? void 0 : _b2.getValueForPixel(y2)) ?? -1;
   return { x: xValue, y: yValue };
 };
 const calculateAnnotationMetricsInValues = (annotation2) => {
@@ -26395,30 +26396,29 @@ const calculateAnnotationMetricsInValues = (annotation2) => {
     height
   };
 };
-const calculateAnnotationMetricsInValuesInPixels = (annotation2, scales, xScaleID, yScaleID) => {
+const calculateAnnotationMetricsInValuesInPixels = (annotation2, scales) => {
   const { xMin, xMax, yMin, yMax, xValue, yValue, type } = annotation2 ?? {};
+  const { x: x2, y: y2 } = scales ?? {};
   let centerX;
   let centerY;
   let width;
   let height;
-  const xScale = scales[xScaleID];
-  const yScale = scales[yScaleID];
   if (!isNil(xMin) && !isNil(xMax) && !isNil(yMin) && !isNil(yMax) && type === AnnotationType.BOX) {
     const xCenterValue = (xMin + xMax) / 2;
     const yCenterValue = (yMin + yMax) / 2;
-    const xMinValue = (xScale == null ? void 0 : xScale.getPixelForValue(xMin)) ?? 0;
-    const xMaxValue = (xScale == null ? void 0 : xScale.getPixelForValue(xMax)) ?? 0;
-    const yMinValue = (yScale == null ? void 0 : yScale.getPixelForValue(yMin)) ?? 0;
-    const yMaxValue = (yScale == null ? void 0 : yScale.getPixelForValue(yMax)) ?? 0;
+    const xMinValue = (x2 == null ? void 0 : x2.getPixelForValue(xMin)) ?? 0;
+    const xMaxValue = (x2 == null ? void 0 : x2.getPixelForValue(xMax)) ?? 0;
+    const yMinValue = (y2 == null ? void 0 : y2.getPixelForValue(yMin)) ?? 0;
+    const yMaxValue = (y2 == null ? void 0 : y2.getPixelForValue(yMax)) ?? 0;
     width = xMinValue - xMaxValue;
     height = yMinValue - yMaxValue;
-    centerX = (xScale == null ? void 0 : xScale.getPixelForValue(xCenterValue)) ?? -1;
-    centerY = (yScale == null ? void 0 : yScale.getPixelForValue(yCenterValue)) ?? -1;
+    centerX = (x2 == null ? void 0 : x2.getPixelForValue(xCenterValue)) ?? -1;
+    centerY = (y2 == null ? void 0 : y2.getPixelForValue(yCenterValue)) ?? -1;
   } else if (!isNil(xValue) && !isNil(yValue) && type === AnnotationType.POINT) {
     width = 0;
     height = 0;
-    centerX = (xScale == null ? void 0 : xScale.getPixelForValue(xValue)) ?? -1;
-    centerY = (yScale == null ? void 0 : yScale.getPixelForValue(yValue)) ?? -1;
+    centerX = (x2 == null ? void 0 : x2.getPixelForValue(xValue)) ?? -1;
+    centerY = (y2 == null ? void 0 : y2.getPixelForValue(yValue)) ?? -1;
   }
   return {
     centerX,
@@ -26435,9 +26435,7 @@ const isWithinChartArea = ({
   metrics,
   resizable = false,
   dragRange,
-  annotationType,
-  xScaleID,
-  yScaleID
+  annotationType
 }) => {
   if (resizable && !dragRange) {
     return true;
@@ -26447,12 +26445,10 @@ const isWithinChartArea = ({
     const withinRangeY = y2 !== void 0 && dragRange.y ? y2 >= dragRange.y[0] && y2 <= dragRange.y[1] : true;
     return withinRangeX && withinRangeY;
   }
-  const xScale = scales[xScaleID];
-  const yScale = scales[yScaleID];
-  const minX = (xScale == null ? void 0 : xScale.getValueForPixel(chartArea.left)) ?? Number.NEGATIVE_INFINITY;
-  const maxX = (xScale == null ? void 0 : xScale.getValueForPixel(chartArea.right)) ?? Number.POSITIVE_INFINITY;
-  const minY = (yScale == null ? void 0 : yScale.getValueForPixel(chartArea.bottom)) ?? Number.NEGATIVE_INFINITY;
-  const maxY = (yScale == null ? void 0 : yScale.getValueForPixel(chartArea.top)) ?? Number.POSITIVE_INFINITY;
+  const minX = scales.x.getValueForPixel(chartArea.left) ?? Number.NEGATIVE_INFINITY;
+  const maxX = scales.x.getValueForPixel(chartArea.right) ?? Number.POSITIVE_INFINITY;
+  const minY = scales.y.getValueForPixel(chartArea.bottom) ?? Number.NEGATIVE_INFINITY;
+  const maxY = scales.y.getValueForPixel(chartArea.top) ?? Number.POSITIVE_INFINITY;
   if (annotationType === AnnotationType.POINT) {
     const withinX = x2 !== void 0 ? x2 >= minX && x2 <= maxX : true;
     const withinY = y2 !== void 0 ? y2 >= minY && y2 <= maxY : true;
@@ -26469,7 +26465,7 @@ const isWithinChartArea = ({
   }
   return true;
 };
-const updateAnnotationPositionWithinBounds = (axis, newPosition, activeAnnotation, chart2, scales, xScaleID, yScaleID, metrics) => {
+const updateAnnotationPositionWithinBounds = (axis, newPosition, activeAnnotation, chart2, scales, metrics) => {
   const { resizable, dragRange = null } = activeAnnotation ?? {};
   const checkArea = isWithinChartArea({
     [axis]: newPosition,
@@ -26478,9 +26474,7 @@ const updateAnnotationPositionWithinBounds = (axis, newPosition, activeAnnotatio
     resizable,
     dragRange,
     metrics: metrics || {},
-    annotationType: activeAnnotation.type,
-    xScaleID,
-    yScaleID
+    annotationType: activeAnnotation.type
   });
   if (!checkArea) return;
   if (activeAnnotation.type === AnnotationType.POINT) {
@@ -26509,16 +26503,9 @@ const setAnnotationBorderWidth = (chart2, annotationId, borderWidth) => {
   }
 };
 const handleAnnotationMouseDown = (event, canvas2, scales, annotations, setDraggingState, hoveredAnnotationId) => {
+  const { x: x2, y: y2 } = getMousePositionInCoordinates(event, canvas2, scales);
   const annotation2 = hoveredAnnotationId ? annotations == null ? void 0 : annotations[hoveredAnnotationId] : null;
   if (!annotation2) return;
-  const { xScaleID = "x", yScaleID = "y" } = annotation2;
-  const { x: x2, y: y2 } = getMousePositionInCoordinates(
-    event,
-    canvas2,
-    scales,
-    xScaleID,
-    yScaleID
-  );
   const metrics = calculateAnnotationMetricsInValues(annotation2);
   if (annotation2 && annotation2.enableDrag && !isNil(metrics.centerY) && !isNil(metrics.centerX)) {
     canvas2.style.cursor = CursorStyle.Move;
@@ -26536,17 +26523,8 @@ const handleAnnotationMouseMove = (event, canvas2, scales, isDragging2, activeAn
     const annotationId = activeAnnotation == null ? void 0 : activeAnnotation.id;
     setAnnotationBorderWidth(chart2, annotationId, BORDER_WIDTH.HOVERED);
     const dragAxis = (activeAnnotation == null ? void 0 : activeAnnotation.dragAxis) ?? DragAxis.Both;
-    const { xScaleID = "x", yScaleID = "y" } = activeAnnotation;
-    const { x: x2, y: y2 } = getMousePositionInCoordinates(
-      event,
-      canvas2,
-      scales,
-      xScaleID,
-      yScaleID
-    );
-    console.log("Mouse Coordinates:", x2, y2);
+    const { x: x2, y: y2 } = getMousePositionInCoordinates(event, canvas2, scales);
     const metrics = calculateAnnotationMetricsInValues(activeAnnotation);
-    console.log("Metrics:", metrics);
     let newCenterX = x2 - dragStartX;
     let newCenterY = y2 - dragStartY;
     if (dragAxis !== DragAxis.Y) {
@@ -26556,8 +26534,6 @@ const handleAnnotationMouseMove = (event, canvas2, scales, isDragging2, activeAn
         activeAnnotation,
         chart2,
         scales,
-        xScaleID,
-        yScaleID,
         metrics
       );
     }
@@ -26568,8 +26544,6 @@ const handleAnnotationMouseMove = (event, canvas2, scales, isDragging2, activeAn
         activeAnnotation,
         chart2,
         scales,
-        xScaleID,
-        yScaleID,
         metrics
       );
     }
@@ -26579,12 +26553,7 @@ const handleAnnotationMouseMove = (event, canvas2, scales, isDragging2, activeAn
     }
     const { ctx, width, height } = chart2;
     const { centerX, centerY } = calculateAnnotationMetricsInValues(activeAnnotation) ?? {};
-    const { centerX: xValue, centerY: yValue } = calculateAnnotationMetricsInValuesInPixels(
-      activeAnnotation,
-      scales,
-      xScaleID,
-      yScaleID
-    );
+    const { centerX: xValue, centerY: yValue } = calculateAnnotationMetricsInValuesInPixels(activeAnnotation, scales);
     if (!isNil(centerX) && !isNil(centerY) && !isNil(xValue) && !isNil(yValue)) {
       ctx.save();
       ctx.clearRect(0, 0, width, height);
@@ -26694,7 +26663,7 @@ const annotationDraggerPlugin = {
     const pluginOptions = ((_b2 = (_a2 = chart2 == null ? void 0 : chart2.options) == null ? void 0 : _a2.plugins) == null ? void 0 : _b2.annotationDraggerPlugin) || {
       enabled: false
     };
-    const typedScales = { ...scales, x: scales.x, y: scales.y };
+    const typedScales = { x: scales.x, y: scales.y };
     let annotations = ((_d2 = (_c2 = chart2.options.plugins) == null ? void 0 : _c2.annotation) == null ? void 0 : _d2.annotations) ?? {};
     if (!chart2 && !annotations) return;
     if (pluginOptions.enabled) {
@@ -26813,7 +26782,7 @@ const config = {
   [INIT_KEYS.TRANSLATIONS]: getTranslations(),
   [INIT_KEYS.LANGUAGE_KEY]: "en"
 };
-const getConfig = (key = "") => key ? config[key] : config;
+const getConfig = (key = "") => key ? config == null ? void 0 : config[key] : config;
 const setConfig = (key, newValue) => {
   config[key] = newValue;
 };
@@ -27265,7 +27234,7 @@ const LineChart = (props) => {
   var _a2, _b2;
   setDefaultTheme();
   const chartRef = useRef(null);
-  const { table: table2 } = props;
+  const { table: table2 } = props ?? {};
   const { translations, languageKey } = getConfig();
   const chart2 = getDefaultProps$3(props);
   const {
@@ -27275,7 +27244,7 @@ const LineChart = (props) => {
     persistenceId,
     controlsPortalId
   } = chart2;
-  const { annotations, axes, chartStyling, graph } = options;
+  const { annotations, axes, chartStyling, graph } = options ?? {};
   const showCustomLegend = !((_b2 = (_a2 = options == null ? void 0 : options.legend) == null ? void 0 : _a2.customLegend) == null ? void 0 : _b2.customLegendContainerID);
   const [state, dispatch] = useReducer(
     reducer$1,
@@ -27364,10 +27333,10 @@ const LineChart = (props) => {
       ]
     },
     generateKey([
-      state.enableDragPoints,
-      state.enableDragAnnotation,
-      state.zoomEnabled,
-      state.panEnabled,
+      state == null ? void 0 : state.enableDragPoints,
+      state == null ? void 0 : state.enableDragAnnotation,
+      state == null ? void 0 : state.zoomEnabled,
+      state == null ? void 0 : state.panEnabled,
       languageKey
     ])
   );
@@ -39992,8 +39961,8 @@ const Ht = { id: "dragdata", afterInit: function(t) {
 Chart.register(Ht);
 const useBarChartConfig = (chartRef, chart2) => {
   var _a2;
-  const { options } = chart2;
-  const { interactions } = options;
+  const { options } = chart2 ?? {};
+  const { interactions } = options ?? {};
   const [pointHover, setPointHover] = useState(false);
   const generateBarChartDatasets = ({
     datasets,
@@ -40005,29 +39974,30 @@ const useBarChartConfig = (chartRef, chart2) => {
     const annotationsDatasets = controlAnnotation && showAnnotations && (annotationsData == null ? void 0 : annotationsData.length) ? annotationsData.map(
       (annotation2, index2) => ({
         isAnnotation: true,
-        label: annotation2.label,
+        label: annotation2 == null ? void 0 : annotation2.label,
         annotationIndex: index2,
-        backgroundColor: annotation2.color || COLORS[index2],
-        borderColor: annotation2.color || COLORS[index2],
+        backgroundColor: (annotation2 == null ? void 0 : annotation2.color) || COLORS[index2],
+        borderColor: (annotation2 == null ? void 0 : annotation2.color) || COLORS[index2],
         data: [],
         type: ChartType$1.Bar
       })
     ) : [];
     const barDatasetsCopy = [...datasets, ...annotationsDatasets];
-    const generatedDatasets2 = barDatasetsCopy.map((barDataset, index2) => {
+    const generatedDatasets2 = barDatasetsCopy == null ? void 0 : barDatasetsCopy.map((barDataset, index2) => {
+      var _a3;
       const colorSchema = COLORS;
-      const colors2 = barDataset.data.map((_2) => {
-        const colorSelectionIndex = datasets.length > 1 ? index2 : 0;
-        return colorSchema[colorSelectionIndex] || generateRandomColor(COLORS);
+      const colors2 = (_a3 = barDataset == null ? void 0 : barDataset.data) == null ? void 0 : _a3.map((_2) => {
+        const colorSelectionIndex = (datasets == null ? void 0 : datasets.length) > 1 ? index2 : 0;
+        return (colorSchema == null ? void 0 : colorSchema[colorSelectionIndex]) || generateRandomColor(COLORS);
       });
-      const backgroundColors = barDataset.backgroundColor || colors2.map((color2) => color2 + ALPHA_CHANEL);
+      const backgroundColors = (barDataset == null ? void 0 : barDataset.backgroundColor) || (colors2 == null ? void 0 : colors2.map((color2) => color2 + ALPHA_CHANEL));
       const datasetWithBorderWidth = "borderWidth" in barDatasetsCopy ? {
-        borderWidth: parseFloat(String(barDatasetsCopy.borderWidth)) ?? 1
+        borderWidth: parseFloat(String(barDatasetsCopy == null ? void 0 : barDatasetsCopy.borderWidth)) ?? 1
       } : {};
       return {
         ...barDataset,
         ...datasetWithBorderWidth,
-        borderColor: barDataset.borderColor || colors2[index2],
+        borderColor: (barDataset == null ? void 0 : barDataset.borderColor) || (colors2 == null ? void 0 : colors2[index2]),
         backgroundColor: backgroundColors
       };
     });
@@ -40043,16 +40013,16 @@ const useBarChartConfig = (chartRef, chart2) => {
   const onHover = (evt, hoveredItems) => {
     if (pointHover && !(hoveredItems == null ? void 0 : hoveredItems.length)) {
       setPointHover(false);
-      if (interactions.onUnhover) {
-        interactions.onUnhover(evt);
+      if (interactions == null ? void 0 : interactions.onUnhover) {
+        interactions == null ? void 0 : interactions.onUnhover(evt);
       }
     }
     if (!pointHover && (hoveredItems == null ? void 0 : hoveredItems.length)) {
       setPointHover(true);
       if (interactions.onHover) {
-        const { index: index2, datasetIndex } = hoveredItems[0];
+        const { index: index2, datasetIndex } = (hoveredItems == null ? void 0 : hoveredItems[0]) ?? {};
         const generatedDataset = generatedDatasets;
-        interactions.onHover(evt, datasetIndex, index2, generatedDataset);
+        interactions == null ? void 0 : interactions.onHover(evt, datasetIndex, index2, generatedDataset);
       }
     }
   };