@oliasoft-open-source/charts-library 3.6.7 → 3.6.8

package/dist/index.js

@@ -24774,7 +24774,28 @@ const useLegendState = ({
     legend: { customLegend }
   } = options;
   const { legendEnabled } = state;
-  const [hiddenStates, setHiddenStates] = useState({});
+  const [hiddenStates, setHiddenStates] = useState([]);
+  const upsertHiddenState = ({ label, datasetIndex, hidden }) => {
+    setHiddenStates((prevStates) => {
+      const existingIndex = prevStates.findIndex(
+        (state2) => state2.label === label
+      );
+      const newStates = [...prevStates];
+      const newState = { label, datasetIndex, hidden };
+      if (existingIndex !== -1) {
+        newStates[existingIndex] = newState;
+      } else {
+        newStates.push(newState);
+      }
+      return newStates;
+    });
+  };
+  const clearNonExistentDatasets = (datasets) => {
+    const existingLabels = datasets.map((ds) => ds.label);
+    setHiddenStates(
+      (prevStates) => prevStates.filter((state2) => existingLabels.includes(state2.label))
+    );
+  };
   const legendClick = useCallback(
     (_e2, legendItem2) => {
       const { datasetIndex } = legendItem2;
@@ -24782,21 +24803,16 @@ const useLegendState = ({
       const { datasets } = (chartInstance == null ? void 0 : chartInstance.data) || {};
       const dataset = datasets == null ? void 0 : datasets[datasetIndex];
       const meta = chartInstance == null ? void 0 : chartInstance.getDatasetMeta(datasetIndex);
-      const newHiddenState = !hiddenStates[datasetIndex];
-      setHiddenStates((prevHiddenStates) => ({
-        ...prevHiddenStates,
-        [datasetIndex]: newHiddenState
-      }));
-      if (meta) {
-        if (meta.hidden === null) {
-          meta.hidden = !(dataset == null ? void 0 : dataset.hidden);
-        } else {
-          meta.hidden = null;
-        }
-      }
+      const isDatasetVisible = (chartInstance == null ? void 0 : chartInstance.isDatasetVisible(datasetIndex)) ?? true;
+      upsertHiddenState({
+        label: dataset.label,
+        datasetIndex,
+        hidden: isDatasetVisible
+      });
+      chartInstance == null ? void 0 : chartInstance.setDatasetVisibility(datasetIndex, !isDatasetVisible);
       if (annotations.controlAnnotation && (dataset == null ? void 0 : dataset.isAnnotation)) {
         const { annotationIndex } = dataset;
-        dispatch({ type: "TOGGLE_ANNOTATION", payload: { annotationIndex } });
+        dispatch({ type: TOGGLE_ANNOTATION, payload: { annotationIndex } });
       }
       if (dataset.displayGroup) {
         datasets == null ? void 0 : datasets.forEach((ds, ix) => {
@@ -24830,7 +24846,9 @@ const useLegendState = ({
     legendClick,
     hiddenStates,
     legend: legend2,
-    customLegendPlugin
+    customLegendPlugin,
+    upsertHiddenState,
+    clearNonExistentDatasets
   };
 };
 const LEGEND_MARGIN = 4;
@@ -24862,6 +24880,24 @@ const useGeneratedLabels = (chartRef, generatedDatasets) => {
   }, [generatedDatasets, chartRef]);
   return items;
 };
+const LegendItems = ({
+  items,
+  hiddenStates,
+  datasets,
+  legendClick
+}) => /* @__PURE__ */ jsx("div", { className: styles$2.legendItems, children: items.map((item) => {
+  var _a2;
+  const hiddenState = ((_a2 = hiddenStates.find((state) => state.label === item.text)) == null ? void 0 : _a2.hidden) ?? false;
+  return /* @__PURE__ */ jsx(
+    LegendItem,
+    {
+      hidden: hiddenState,
+      dataset: datasets[item.datasetIndex],
+      handleClick: (event) => legendClick(event, item)
+    },
+    `${item.datasetIndex}-hidden-${item.hidden}`
+  );
+}) });
 const LegendPanel = forwardRef((props, ref) => {
   const {
     legendPosition,
@@ -24879,7 +24915,7 @@ const LegendPanel = forwardRef((props, ref) => {
   const {
     data: { datasets }
   } = chart2;
-  const { legendClick, hiddenStates } = useLegendState({
+  const { legendClick, hiddenStates, clearNonExistentDatasets } = useLegendState({
     chartRef,
     options,
     state,
@@ -24888,6 +24924,9 @@ const LegendPanel = forwardRef((props, ref) => {
   const { onToggleLegend } = useToggleHandlers(dispatch);
   const items = useGeneratedLabels(chartRef, generatedDatasets);
   const style = createLegendStyle(legendPosition, chart2);
+  useEffect(() => {
+    clearNonExistentDatasets(generatedDatasets);
+  }, [generatedDatasets]);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -24908,15 +24947,15 @@ const LegendPanel = forwardRef((props, ref) => {
             icon: legendEnabled ? /* @__PURE__ */ jsx(TbX, {}) : /* @__PURE__ */ jsx(TbList, {})
           }
         ) }),
-        /* @__PURE__ */ jsx("div", { className: styles$2.legendItems, children: items.map((item, idx) => /* @__PURE__ */ jsx(
-          LegendItem,
+        /* @__PURE__ */ jsx(
+          LegendItems,
           {
-            hidden: hiddenStates[idx],
-            dataset: datasets[item.datasetIndex],
-            handleClick: (event) => legendClick(event, item)
-          },
-          `${item.datasetIndex}-hidden-${item.hidden}`
-        )) })
+            items,
+            hiddenStates,
+            datasets,
+            legendClick
+          }
+        )
       ]
     }
   );
@@ -39169,7 +39208,7 @@ const defaultInteractions = (interactions) => ({
   onUnhover: interactions == null ? void 0 : interactions.onUnhover
 });
 const defaultDragData = (dragData) => ({
-  enableDragData: (dragData == null ? void 0 : dragData.enableDragData) || false,
+  enableDragData: (dragData == null ? void 0 : dragData.enableDragData) ?? false,
   showTooltip: (dragData == null ? void 0 : dragData.showTooltip) ?? true,
   roundPoints: (dragData == null ? void 0 : dragData.roundPoints) ?? true,
   dragX: (dragData == null ? void 0 : dragData.dragX) ?? true,
@@ -39431,7 +39470,7 @@ const BarChart = (props) => {
   const [pointHover, setPointHover] = useState(false);
   const chart2 = getDefaultProps(props);
   const { options, testId } = chart2;
-  const { annotations, chartStyling, interactions, graph } = chart2.options;
+  const { annotations, chartStyling, interactions, graph, dragData } = chart2.options;
   const [visibleAnnotationsIndices, setVisibleAnnotationsIndices] = useState(
     setAnnotations(annotations.annotationsData)
   );
@@ -39571,7 +39610,7 @@ const BarChart = (props) => {
               chartAreaBorder: {
                 borderColor: BORDER_COLOR
               },
-              dragData: getDraggableData(options)
+              dragData: (dragData == null ? void 0 : dragData.enableDragData) && getDraggableData(options)
             }
           },
           plugins: getPlugins(graph, options.legend)