@oliasoft-open-source/charts-library 4.3.0-beta-1 → 4.3.0-beta-2

package/dist/index.js

@@ -11,7 +11,7 @@ import { produce } from "immer";
 import { round as round$2, displayNumber, isCloseTo, roundByMagnitude } from "@oliasoft-open-source/units";
 import cx from "classnames";
 import { Icon, Tooltip as Tooltip$2, Button, Flex, Text, Menu, Popover, Field, InputGroup, NumberInput, InputGroupAddon, Select, ButtonGroup, Spacer, Portal } from "@oliasoft-open-source/react-ui-library";
-import { isEmpty, isArray as isArray$2, some, has, cloneDeep, defaultTo, findIndex, set as set$2, debounce as debounce$3, map as map$3, find, get as get$1, values } from "lodash";
+import { isEmpty, isArray as isArray$2, some, has, cloneDeep, defaultTo, findIndex, set as set$2, debounce as debounce$3, isNil, map as map$3, find, get as get$1, values } from "lodash";
 import { roundNumberToPrecision } from "@oliasoft-open-source/units/dist/rounding/rounding";
 /*!
  * @kurkle/color v0.3.2
@@ -25195,21 +25195,25 @@ const annotationEnter = (element, chart2) => {
     }
   }
   element.options.borderWidth = BORDER_WIDTH.HOVERED;
+  chart2.hoveredAnnotationId = element.options.id || null;
   if (element.options.label) {
     element.label.options.display = true;
     element.options.label.enabled = true;
   }
   chart2.draw();
+  chart2.update();
   chart2.canvas.style.cursor = CursorStyle.Pointer;
   return true;
 };
 const annotationLeave = (element, chart2) => {
   element.options.borderWidth = BORDER_WIDTH.INITIAL;
+  chart2.hoveredAnnotationId = null;
   if (element.options.label) {
     element.label.options.display = false;
     element.options.label.enabled = false;
   }
   chart2.draw();
+  chart2.update();
   chart2.canvas.style.cursor = CursorStyle.Initial;
   return true;
 };
@@ -25838,31 +25842,18 @@ const getMousePositionInCoordinates = (event, canvas2, scales) => {
   const yValue = ((_b2 = scales == null ? void 0 : scales.y) == null ? void 0 : _b2.getValueForPixel(y2)) ?? -1;
   return { x: xValue, y: yValue };
 };
-const getActiveAnnotation = (x2, y2, annotations) => {
-  var _a2;
-  return ((_a2 = Object.values(annotations)) == null ? void 0 : _a2.find((annotation2) => {
-    const { xMin, xMax, yMin, yMax, xValue, yValue } = annotation2 ?? {};
-    let condtion;
-    if (xMin && xMax && yMin && yMax && (annotation2 == null ? void 0 : annotation2.type) === AnnotationType.BOX) {
-      condtion = x2 >= xMin && x2 <= xMax && y2 >= yMin && y2 <= yMax;
-    } else if (xValue && yValue && (annotation2 == null ? void 0 : annotation2.type) === AnnotationType.POINT) {
-      condtion = x2 >= xValue - 2 && x2 <= xValue + 2 && y2 >= yValue - 2 && y2 <= yValue + 2;
-    }
-    return condtion;
-  })) ?? {};
-};
 const calculateAnnotationMetricsInValues = (annotation2) => {
   const { xMin, xMax, yMin, yMax, xValue, yValue, type } = annotation2 ?? {};
   let centerX;
   let centerY;
   let width;
   let height;
-  if (xMin && xMax && yMin && yMax && type === AnnotationType.BOX) {
+  if (!isNil(xMin) && !isNil(xMax) && !isNil(yMin) && !isNil(yMax) && type === AnnotationType.BOX) {
     centerX = (xMin + xMax) / 2;
     centerY = (yMin + yMax) / 2;
     width = xMax - xMin;
     height = yMax - yMin;
-  } else if (xValue && yValue && type === AnnotationType.POINT) {
+  } else if (!isNil(xValue) && !isNil(yValue) && type === AnnotationType.POINT) {
     centerX = xValue;
     centerY = yValue;
     width = 0;
@@ -25876,14 +25867,13 @@ const calculateAnnotationMetricsInValues = (annotation2) => {
   };
 };
 const calculateAnnotationMetricsInValuesInPixels = (annotation2, scales) => {
-  var _a2, _b2, _c2, _d2;
   const { xMin, xMax, yMin, yMax, xValue, yValue, type } = annotation2 ?? {};
   const { x: x2, y: y2 } = scales ?? {};
   let centerX;
   let centerY;
   let width;
   let height;
-  if (xMin && xMax && yMin && yMax && type === AnnotationType.BOX) {
+  if (!isNil(xMin) && !isNil(xMax) && !isNil(yMin) && !isNil(yMax) && type === AnnotationType.BOX) {
     const xCenterValue = (xMin + xMax) / 2;
     const yCenterValue = (yMin + yMax) / 2;
     const xMinValue = (x2 == null ? void 0 : x2.getPixelForValue(xMin)) ?? 0;
@@ -25892,13 +25882,13 @@ const calculateAnnotationMetricsInValuesInPixels = (annotation2, scales) => {
     const yMaxValue = (y2 == null ? void 0 : y2.getPixelForValue(yMax)) ?? 0;
     width = xMinValue - xMaxValue;
     height = yMinValue - yMaxValue;
-    centerX = ((_a2 = scales == null ? void 0 : scales.x) == null ? void 0 : _a2.getPixelForValue(xCenterValue)) ?? -1;
-    centerY = ((_b2 = scales == null ? void 0 : scales.y) == null ? void 0 : _b2.getPixelForValue(yCenterValue)) ?? -1;
-  } else if (xValue && yValue && type === AnnotationType.POINT) {
+    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 = ((_c2 = scales == null ? void 0 : scales.x) == null ? void 0 : _c2.getPixelForValue(xValue)) ?? -1;
-    centerY = ((_d2 = scales == null ? void 0 : scales.y) == null ? void 0 : _d2.getPixelForValue(yValue)) ?? -1;
+    centerX = (x2 == null ? void 0 : x2.getPixelForValue(xValue)) ?? -1;
+    centerY = (y2 == null ? void 0 : y2.getPixelForValue(yValue)) ?? -1;
   }
   return {
     centerX,
@@ -25907,12 +25897,12 @@ const calculateAnnotationMetricsInValuesInPixels = (annotation2, scales) => {
     height
   };
 };
-const handleAnnotationMouseDown = (event, canvas2, scales, annotations, setDraggingState) => {
+const handleAnnotationMouseDown = (event, canvas2, scales, annotations, setDraggingState, hoveredAnnotationId) => {
   const { x: x2, y: y2 } = getMousePositionInCoordinates(event, canvas2, scales);
-  const annotation2 = getActiveAnnotation(x2, y2, annotations);
+  const annotation2 = hoveredAnnotationId ? annotations == null ? void 0 : annotations[hoveredAnnotationId] : null;
+  if (!annotation2)
+    return;
   const metrics = calculateAnnotationMetricsInValues(annotation2);
-  console.log(cloneDeep(annotations));
-  console.log(metrics);
   if (annotation2 && annotation2.enableDrag && metrics.centerY && metrics.centerX) {
     const dragStartX = x2 - metrics.centerX;
     const dragStartY = y2 - metrics.centerY;
@@ -25985,7 +25975,7 @@ const annotationDraggerPlugin = {
   id: "annotationDraggerPlugin",
   afterUpdate(chart2) {
     var _a2, _b2, _c2, _d2;
-    const { canvas: canvas2, scales } = chart2;
+    const { canvas: canvas2, scales, hoveredAnnotationId } = chart2;
     const pluginOptions = ((_b2 = (_a2 = chart2 == null ? void 0 : chart2.options) == null ? void 0 : _a2.plugins) == null ? void 0 : _b2.annotationDraggerPlugin) || {
       enabled: false
     };
@@ -26004,14 +25994,15 @@ const annotationDraggerPlugin = {
         dragStartY = startY;
       }
     };
-    if (!canvas2.dataset.annotationDraggerInitialized && pluginOptions.enabled) {
+    if (!canvas2.dataset.annotationDraggerInitialized && pluginOptions.enabled && hoveredAnnotationId) {
       canvas2.addEventListener(MouseEvents.MOUSEDOWN, (event) => {
         handleAnnotationMouseDown(
           event,
           canvas2,
           typedScales,
           annotations,
-          setDraggingState
+          setDraggingState,
+          chart2.hoveredAnnotationId
         );
       });
       canvas2.addEventListener(MouseEvents.MOUSEMOVE, (event) => {