@oliasoft-open-source/charts-library 3.6.2 → 3.6.4

package/dist/index.js

@@ -11,7 +11,7 @@ import { round as round$2, displayNumber, isCloseTo, roundByMagnitude, toNum } f
 import cx from "classnames";
 import { produce } from "immer";
 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 { debounce as debounce$3, isEqual } from "lodash";
+import { isEmpty, isArray as isArray$2, some, has, debounce as debounce$3, isEqual } from "lodash";
 import { roundNumberToPrecision } from "@oliasoft-open-source/units/dist/rounding/rounding";
 /*!
  * @kurkle/color v0.3.2
@@ -22877,7 +22877,8 @@ const LineOptions = ({
   onToggleLine,
   onTogglePoints,
   pointsEnabled,
-  translations
+  translations,
+  hasCustomOpt
 }) => {
   const options = [
     {
@@ -22907,17 +22908,26 @@ const LineOptions = ({
     }
   ];
   const selectedOption = options.find((option) => option.selected);
-  return /* @__PURE__ */ jsx(Tooltip$2, { text: selectedOption == null ? void 0 : selectedOption.label, placement: "bottom", children: /* @__PURE__ */ jsx(
-    Button,
+  return /* @__PURE__ */ jsx(
+    Tooltip$2,
     {
-      small: true,
-      basic: true,
-      colored: "muted",
-      round: true,
-      icon: selectedOption == null ? void 0 : selectedOption.icon,
-      onClick: selectedOption == null ? void 0 : selectedOption.onClick
+      text: selectedOption == null ? void 0 : selectedOption.label,
+      placement: "bottom",
+      enabled: !hasCustomOpt,
+      children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          small: true,
+          basic: true,
+          colored: "muted",
+          round: true,
+          icon: selectedOption == null ? void 0 : selectedOption.icon,
+          onClick: selectedOption == null ? void 0 : selectedOption.onClick,
+          disabled: hasCustomOpt
+        }
+      )
     }
-  ) });
+  );
 };
 function TbHandStop(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M8 13v-7.5a1.5 1.5 0 0 1 3 0v6.5" } }, { "tag": "path", "attr": { "d": "M11 5.5v-2a1.5 1.5 0 1 1 3 0v8.5" } }, { "tag": "path", "attr": { "d": "M14 5.5a1.5 1.5 0 0 1 3 0v6.5" } }, { "tag": "path", "attr": { "d": "M17 7.5a1.5 1.5 0 0 1 3 0v8.5a6 6 0 0 1 -6 6h-2h.208a6 6 0 0 1 -5.012 -2.7a69.74 69.74 0 0 1 -.196 -.3c-.312 -.479 -1.407 -2.388 -3.286 -5.728a1.5 1.5 0 0 1 .536 -2.022a1.867 1.867 0 0 1 2.28 .28l1.47 1.47" } }] })(props);
@@ -24489,6 +24499,27 @@ const ControlsPortal = ({
   }
   return children;
 };
+const checkCustomOption = (data, customOptions) => {
+  if (isEmpty(data) || isEmpty(customOptions))
+    return false;
+  const checkOption = (dataset) => {
+    if (typeof customOptions === "string") {
+      return has(dataset, customOptions);
+    } else if (isArray$2(customOptions)) {
+      return some(customOptions, (option) => has(dataset, option));
+    } else {
+      return some(
+        Object.values(customOptions),
+        (option) => has(dataset, option)
+      );
+    }
+  };
+  if (isArray$2(data)) {
+    return some(data, (dataset) => checkOption(dataset));
+  } else {
+    return checkOption(data);
+  }
+};
 const Controls = ({
   headerComponent,
   subheaderComponent,
@@ -24533,6 +24564,7 @@ const Controls = ({
     dispatch,
     generatedDatasets
   });
+  const hasCustomOpt = checkCustomOption(generatedDatasets, "hasCustomOpt");
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("div", { className: styles$3.controls, children: [
       !!options.title && /* @__PURE__ */ jsx(Text, { bold: true, children: options.title }),
@@ -24558,7 +24590,8 @@ const Controls = ({
               pointsEnabled,
               onToggleLine,
               onTogglePoints,
-              translations
+              translations,
+              hasCustomOpt
             }
           ),
           /* @__PURE__ */ jsx(
@@ -25135,6 +25168,11 @@ const INIT_KEYS = {
 };
 const LOWER_BOUND = 1e-4;
 const UPPER_BOUND = 1e7;
+var CUSTOM_OPTION = /* @__PURE__ */ ((CUSTOM_OPTION2) => {
+  CUSTOM_OPTION2["showLine"] = "showLine";
+  CUSTOM_OPTION2["showPoints"] = "showPoints";
+  return CUSTOM_OPTION2;
+})(CUSTOM_OPTION || {});
 const generateLineChartDatasets = (datasets, state, options, { label }) => {
   const copyDataset = [...datasets];
   const { annotations, graph } = options;
@@ -25176,7 +25214,9 @@ const generateLineChartDatasets = (datasets, state, options, { label }) => {
       borderColor,
       backgroundColor,
       pointBackgroundColor,
-      borderDash
+      borderDash,
+      showPoints = true,
+      showLine
     } = line ?? {};
     const { lineEnabled, pointsEnabled, axes = [] } = state ?? {};
     const { lineTension, spanGaps } = graph ?? {};
@@ -25194,14 +25234,15 @@ const generateLineChartDatasets = (datasets, state, options, { label }) => {
     const filteredData = data.filter(Boolean) || [];
     const isSinglePoint = (filteredData == null ? void 0 : filteredData.length) === 1;
     const linePointRadius = parseFloat(pointRadiusProp) || DEFAULT_POINT_RADIUS;
-    const pointRadius = pointsEnabled || isSinglePoint ? linePointRadius : 0;
+    const pointRadius = (pointsEnabled || isSinglePoint) && showPoints ? linePointRadius : 0;
     const hoverRadius = parseFloat(pointHoverRadius) || DEFAULT_HOVER_RADIUS;
     const indexedColor = COLORS[i2];
+    const hasCustomOpt = checkCustomOption(line, CUSTOM_OPTION);
     return {
       ...line,
       label: line.label || `${label} ${i2 + 1}`,
       data: filteredData,
-      showLine: lineEnabled,
+      showLine: showLine ?? lineEnabled,
       lineTension,
       spanGaps,
       borderWidth: parseFloat(borderWidth) || DEFAULT_BORDER_WIDTH,
@@ -25212,7 +25253,8 @@ const generateLineChartDatasets = (datasets, state, options, { label }) => {
       pointBackgroundColor: pointBackgroundColor ?? indexedColor ?? generateRandomColor(COLORS),
       pointRadius,
       pointHoverRadius: hoverRadius,
-      pointHitRadius: line.pointHitRadius ?? hoverRadius
+      pointHitRadius: line.pointHitRadius ?? hoverRadius,
+      ...hasCustomOpt ? { hasCustomOpt } : {}
     };
   });
 };
@@ -25502,23 +25544,29 @@ const getLineChartDataLabels = (options) => {
     formatter: (_value, context) => context.dataset.data[context.dataIndex].label || ""
   } : { display: false };
 };
-const annotationEnter = ({ element }, { chart: chart2 }) => {
+const annotationEnter = (element, chart2) => {
   var _a2;
   if ((_a2 = element.options.scaleID) == null ? void 0 : _a2.includes(AxisType.X)) {
     element.options.label.xAdjust = chart2.chartArea.left;
   }
   element.options.borderWidth = BORDER_WIDTH.HOVERED;
-  if (element.options.label)
+  if (element.options.label) {
+    element.label.options.display = true;
     element.options.label.enabled = true;
+  }
   chart2.draw();
   chart2.canvas.style.cursor = CursorStyle.Pointer;
+  return true;
 };
-const annotationLeave = ({ element }, { chart: chart2 }) => {
+const annotationLeave = (element, chart2) => {
   element.options.borderWidth = BORDER_WIDTH.INITIAL;
-  if (element.options.label)
+  if (element.options.label) {
+    element.label.options.display = false;
     element.options.label.enabled = false;
+  }
   chart2.draw();
   chart2.canvas.style.cursor = CursorStyle.Initial;
+  return true;
 };
 const generateAnnotations = (options, state) => {
   const { annotationsData } = (options == null ? void 0 : options.annotations) || {};
@@ -25537,22 +25585,22 @@ const generateAnnotations = (options, state) => {
     const label = type === "line" ? {
       backgroundColor: color2,
       content: curr == null ? void 0 : curr.label,
-      enabled: false,
+      display: false,
       position: Position.Top
     } : {
       content: curr == null ? void 0 : curr.label,
-      enabled: true,
+      display: true,
       font: { weight: "normal" }
     };
-    const enter = (context, event) => {
+    const enter = ({ element }, { chart: chart2 }) => {
       if (type !== "line")
         return;
-      annotationEnter(context, event);
+      annotationEnter(element, chart2);
     };
-    const leave = (context, event) => {
+    const leave = ({ element }, { chart: chart2 }) => {
       if (type !== "line")
         return;
-      annotationLeave(context, event);
+      annotationLeave(element, chart2);
     };
     const annotation2 = {
       ...curr,