@oliasoft-open-source/charts-library 4.7.0-beta-4 → 4.7.0-beta-6

package/dist/index.js

@@ -11,7 +11,7 @@ import React__default, { forwardRef, useRef, useEffect, createContext as createC
 import { produce } from "immer";
 import { round as round$2, displayNumber, isCloseTo, roundByMagnitude } from "@oliasoft-open-source/units";
 import cx from "classnames";
-import { Portal, Icon, Menu, Tooltip as Tooltip$2, Button, Flex, Text, Popover, Field, InputGroup, NumberInput, InputGroupAddon, Select, ButtonGroup, Spacer } from "@oliasoft-open-source/react-ui-library";
+import { Portal, Icon, Menu, Tooltip as Tooltip$2, Button, Popover, Field, InputGroup, NumberInput, InputGroupAddon, Select, ButtonGroup, Spacer, Flex, Text } 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, isNil, map as map$3, find, get as get$1 } from "lodash";
 /*!
  * @kurkle/color v0.3.2
@@ -22892,20 +22892,7 @@ function getLineOptions({
     }
   ];
 }
-const LineOptions = ({
-  lineEnabled,
-  onToggleLine,
-  onTogglePoints,
-  pointsEnabled,
-  translations
-}) => {
-  const options = getLineOptions({
-    lineEnabled,
-    onToggleLine,
-    onTogglePoints,
-    pointsEnabled,
-    translations
-  });
+const LineOptions = ({ options }) => {
   const [menuOpen, setMenuOpen] = useState(false);
   const selectedOption = options.find((option) => option.selected);
   return /* @__PURE__ */ jsx(
@@ -23055,7 +23042,6 @@ function getDragOptions({
     dragToZoom,
     doubleClickToReset,
     dragToPan,
-    orDoubleClickToCanvas,
     dragToMovePoints,
     dragDisabled,
     dragToMoveAnnotation
@@ -23063,24 +23049,26 @@ function getDragOptions({
 }) {
   return [
     {
-      buttonLabel: dragToZoom,
-      label: /* @__PURE__ */ jsxs(Flex, { direction: "column", children: [
-        /* @__PURE__ */ jsx(Text, { children: "Drag to zoom" }),
-        /* @__PURE__ */ jsx(Text, { small: true, muted: true, children: doubleClickToReset })
-      ] }),
+      label: dragToZoom,
+      description: doubleClickToReset,
       icon: /* @__PURE__ */ jsx(TbZoomIn, {}),
       selected: zoomEnabled,
-      onClick: onToggleZoom
+      type: "Option",
+      onClick: () => {
+        if (!zoomEnabled)
+          onToggleZoom();
+      }
     },
     {
-      buttonLabel: dragToPan,
-      label: /* @__PURE__ */ jsxs(Flex, { direction: "column", children: [
-        /* @__PURE__ */ jsx(Text, { children: "Drag to pan" }),
-        /* @__PURE__ */ jsx(Text, { small: true, muted: true, children: orDoubleClickToCanvas })
-      ] }),
+      label: dragToPan,
+      description: doubleClickToReset,
       icon: /* @__PURE__ */ jsx(TbArrowsMove, {}),
       selected: panEnabled,
-      onClick: onTogglePan
+      type: "Option",
+      onClick: () => {
+        if (!panEnabled)
+          onTogglePan();
+      }
     },
     ...isDragDataAllowed ? [
       {
@@ -23088,7 +23076,10 @@ function getDragOptions({
         icon: /* @__PURE__ */ jsx(TbHandStop, {}),
         selected: enableDragPoints,
         type: "Option",
-        onClick: onToggleDragPoints
+        onClick: () => {
+          if (!enableDragPoints)
+            onToggleDragPoints();
+        }
       }
     ] : [],
     ...isDragAnnotationAllowed ? [
@@ -23097,79 +23088,28 @@ function getDragOptions({
         icon: /* @__PURE__ */ jsx(TbHandStop, {}),
         selected: enableDragAnnotation,
         type: "Option",
-        onClick: onToggleDragAnnotation
+        onClick: () => {
+          if (!enableDragAnnotation)
+            onToggleDragAnnotation();
+        }
       }
     ] : [],
     {
       label: dragDisabled,
       icon: /* @__PURE__ */ jsx(TbBan, {}),
       selected: !zoomEnabled && !panEnabled && !enableDragPoints && !enableDragAnnotation,
+      type: "Option",
       onClick: onDisableDragOptions
     }
   ];
 }
-const DragOptions = ({
-  onTogglePan,
-  onToggleZoom,
-  panEnabled,
-  zoomEnabled,
-  enableDragPoints,
-  enableDragAnnotation,
-  isDragDataAllowed,
-  isDragAnnotationAllowed,
-  onToggleDragAnnotation,
-  onToggleDragPoints,
-  onDisableDragOptions,
-  translations: {
-    dragToZoom,
-    doubleClickToReset,
-    dragToPan,
-    orDoubleClickToCanvas,
-    dragToMovePoints,
-    dragDisabled,
-    dragToMoveAnnotation
-  }
-}) => {
-  const options = useMemo(
-    () => getDragOptions({
-      onTogglePan,
-      onToggleZoom,
-      panEnabled,
-      zoomEnabled,
-      enableDragPoints,
-      enableDragAnnotation,
-      isDragDataAllowed,
-      isDragAnnotationAllowed,
-      onToggleDragAnnotation,
-      onToggleDragPoints,
-      onDisableDragOptions,
-      translations: {
-        dragToZoom,
-        doubleClickToReset,
-        dragToPan,
-        orDoubleClickToCanvas,
-        dragToMovePoints,
-        dragDisabled,
-        dragToMoveAnnotation
-      }
-    }),
-    [zoomEnabled, panEnabled, enableDragPoints, isDragDataAllowed]
-  );
+const DragOptions = ({ options }) => {
   const selectedOption = options.find((option) => option.selected);
-  const optionsWithDragPoints = options.map(
-    ({ icon, label, onClick, selected }) => ({
-      icon,
-      label,
-      type: "Option",
-      onClick,
-      disabled: selected
-    })
-  );
   return /* @__PURE__ */ jsx(
     Menu,
     {
       menu: {
-        sections: optionsWithDragPoints,
+        sections: options,
         trigger: "Component",
         component: /* @__PURE__ */ jsx(
           Button,
@@ -23177,7 +23117,7 @@ const DragOptions = ({
             colored: "muted",
             basic: true,
             small: true,
-            label: (selectedOption == null ? void 0 : selectedOption.buttonLabel) || (selectedOption == null ? void 0 : selectedOption.label),
+            label: selectedOption == null ? void 0 : selectedOption.label,
             icon: selectedOption == null ? void 0 : selectedOption.icon
           }
         )
@@ -24641,6 +24581,39 @@ const Controls = ({
   });
   const [measureRef, { width }] = useMeasure$1();
   const isNarrow = width < 200;
+  const lineOptions = useMemo(
+    () => getLineOptions({
+      lineEnabled,
+      onToggleLine,
+      onTogglePoints,
+      pointsEnabled,
+      translations
+    }),
+    [lineEnabled, pointsEnabled]
+  );
+  const dragOptions = useMemo(
+    () => getDragOptions({
+      onTogglePan,
+      onToggleZoom,
+      panEnabled,
+      zoomEnabled,
+      enableDragPoints,
+      enableDragAnnotation,
+      isDragDataAllowed: dragData == null ? void 0 : dragData.enableDragData,
+      isDragAnnotationAllowed: annotations == null ? void 0 : annotations.enableDragAnnotation,
+      onToggleDragAnnotation,
+      onToggleDragPoints,
+      onDisableDragOptions,
+      translations
+    }),
+    [
+      zoomEnabled,
+      panEnabled,
+      enableDragPoints,
+      dragData == null ? void 0 : dragData.enableDragData,
+      annotations == null ? void 0 : annotations.enableDragAnnotation
+    ]
+  );
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("div", { className: styles$4.controls, children: [
       !!options.title && /* @__PURE__ */ jsx(Text, { bold: true, children: options.title }),
@@ -24670,36 +24643,11 @@ const Controls = ({
                   menu: {
                     placement: "bottom-end",
                     sections: [
-                      ...getLineOptions({
-                        lineEnabled,
-                        onToggleLine,
-                        onTogglePoints,
-                        pointsEnabled,
-                        translations
-                      }).map((option) => ({
-                        ...option,
-                        type: "Option"
-                      })),
+                      ...lineOptions,
                       {
                         type: "Divider"
                       },
-                      ...getDragOptions({
-                        onTogglePan,
-                        onToggleZoom,
-                        panEnabled,
-                        zoomEnabled,
-                        enableDragPoints,
-                        enableDragAnnotation,
-                        isDragDataAllowed: dragData == null ? void 0 : dragData.enableDragData,
-                        isDragAnnotationAllowed: annotations == null ? void 0 : annotations.enableDragAnnotation,
-                        onToggleDragAnnotation,
-                        onToggleDragPoints,
-                        onDisableDragOptions,
-                        translations
-                      }).map((option) => ({
-                        ...option,
-                        type: "Option"
-                      })),
+                      ...dragOptions,
                       {
                         type: "Divider"
                       },
@@ -24715,16 +24663,7 @@ const Controls = ({
                   }
                 }
               ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(
-                  LineOptions,
-                  {
-                    lineEnabled,
-                    pointsEnabled,
-                    onToggleLine,
-                    onTogglePoints,
-                    translations
-                  }
-                ),
+                /* @__PURE__ */ jsx(LineOptions, { options: lineOptions }),
                 /* @__PURE__ */ jsx(
                   Tooltip$2,
                   {
@@ -24744,23 +24683,7 @@ const Controls = ({
                     )
                   }
                 ),
-                /* @__PURE__ */ jsx(
-                  DragOptions,
-                  {
-                    panEnabled,
-                    zoomEnabled,
-                    onTogglePan,
-                    onToggleZoom,
-                    enableDragPoints,
-                    enableDragAnnotation,
-                    isDragDataAllowed: dragData == null ? void 0 : dragData.enableDragData,
-                    isDragAnnotationAllowed: annotations == null ? void 0 : annotations.enableDragAnnotation,
-                    onToggleDragAnnotation,
-                    onToggleDragPoints,
-                    onDisableDragOptions,
-                    translations
-                  }
-                )
+                /* @__PURE__ */ jsx(DragOptions, { options: dragOptions })
               ] })
             ] }),
             table2 ? /* @__PURE__ */ jsx(