@oliasoft-open-source/charts-library 5.0.2 → 5.0.3-beta-2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/assets/{Color-YHDXOIA2-DvkV04os.js → Color-YHDXOIA2-DdP7eK5i.js} +1 -1
  2. package/dist/assets/{DocsRenderer-CFRXHY34-cMkmi-tX.js → DocsRenderer-CFRXHY34-D5tFcMOW.js} +3 -3
  3. package/dist/assets/{bar-chart.stories-Eq_jQ19D.js → bar-chart.stories-BMExUqt4.js} +1 -1
  4. package/dist/assets/{entry-preview-Cgd6khWs.js → entry-preview-FiUJlA3m.js} +1 -1
  5. package/dist/assets/{get-draggableData-CQpLHCdg.js → get-draggableData-DS0HhINp.js} +1 -1
  6. package/dist/assets/{iframe-Bj1sRZW3.js → iframe-uMLayeIE.js} +2 -2
  7. package/dist/assets/{legend-krJw8Ykb.js → legend-CD8XU7nW.js} +1 -1
  8. package/dist/assets/line-chart-CO0E8gEH.js +1 -0
  9. package/dist/assets/line-chart.stories-DeZuwimt.js +1155 -0
  10. package/dist/assets/line-chart.test-case.stories-1ubn_r6M.js +428 -0
  11. package/dist/assets/{preview-BNebtty_.js → preview-C-6F1PUr.js} +2 -2
  12. package/dist/assets/{preview-CASZ8WNA.js → preview-CvzUewvo.js} +1 -1
  13. package/dist/assets/{scatter-chart.stories-BCbRBdJY.js → scatter-chart.stories-sl5FPoGH.js} +1 -1
  14. package/dist/iframe.html +1 -1
  15. package/dist/index.js.js +63 -34
  16. package/dist/index.js.js.map +1 -1
  17. package/dist/index.json +1 -1
  18. package/dist/line-chart/controls/axes-options/axes-options-interfaces.d.ts +1 -0
  19. package/dist/line-chart/hooks/use-chart-functions.d.ts +2 -1
  20. package/dist/line-chart/state/action-types.d.ts +1 -0
  21. package/dist/line-chart/state/state.interfaces.d.ts +1 -0
  22. package/dist/project.json +1 -1
  23. package/dist/src/components/line-chart/controls/axes-options/axes-options-interfaces.d.ts +1 -0
  24. package/dist/src/components/line-chart/hooks/use-chart-functions.d.ts +1 -0
  25. package/dist/src/components/line-chart/state/action-types.d.ts +1 -0
  26. package/dist/src/components/line-chart/state/state.interfaces.d.ts +1 -0
  27. package/package.json +1 -1
  28. package/dist/assets/line-chart-TEIxShHM.js +0 -1
  29. package/dist/assets/line-chart.stories-CRpxf_tv.js +0 -1130
  30. package/dist/assets/line-chart.test-case.stories-Cb2jns7e.js +0 -142
package/dist/index.js.js CHANGED
@@ -22803,6 +22803,7 @@ const UPDATE_AXES_RANGES = "UPDATE_AXES_RANGES";
22803
22803
  const TOGGLE_DRAG_POINTS = "TOGGLE_DRAG_POINTS";
22804
22804
  const TOGGLE_DRAG_ANNOTATION = "TOGGLE_DRAG_ANNOTATION";
22805
22805
  const DISABLE_DRAG_OPTIONS = "DISABLE_DRAG_OPTIONS";
22806
+ const UPDATE_EDITED = "UPDATE_EDITED";
22806
22807
  const reducer = (state, action) => {
22807
22808
  return produce(state, (draft) => {
22808
22809
  switch (action.type) {
@@ -22890,6 +22891,10 @@ const reducer = (state, action) => {
22890
22891
  }
22891
22892
  break;
22892
22893
  }
22894
+ case UPDATE_EDITED: {
22895
+ draft.edited = action.payload;
22896
+ break;
22897
+ }
22893
22898
  }
22894
22899
  });
22895
22900
  };
@@ -22964,7 +22969,8 @@ const initialState = ({ options, persistenceId }) => {
22964
22969
  axes: [],
22965
22970
  showTable: false,
22966
22971
  enableDragPoints: (dragData == null ? void 0 : dragData.enableDragData) && enableDragPoints,
22967
- enableDragAnnotation: enableDragAnnotation ?? enableDragAnnotationStorage
22972
+ enableDragAnnotation: enableDragAnnotation ?? enableDragAnnotationStorage,
22973
+ edited: false
22968
22974
  };
22969
22975
  };
22970
22976
  const ControlsPortal = ({
@@ -23291,7 +23297,7 @@ const useToggleHandlers = (dispatch) => {
23291
23297
  },
23292
23298
  [dispatch]
23293
23299
  );
23294
- const toggleHandlers = {
23300
+ return {
23295
23301
  onToggleLegend: createToggleHandler(TOGGLE_LEGEND),
23296
23302
  onToggleLine: createToggleHandler(TOGGLE_LINE),
23297
23303
  onTogglePan: createToggleHandler(TOGGLE_PAN),
@@ -23302,7 +23308,6 @@ const useToggleHandlers = (dispatch) => {
23302
23308
  onToggleDragAnnotation: createToggleHandler(TOGGLE_DRAG_ANNOTATION),
23303
23309
  onDisableDragOptions: createToggleHandler(DISABLE_DRAG_OPTIONS)
23304
23310
  };
23305
- return toggleHandlers;
23306
23311
  };
23307
23312
  function resolveUrl(url, baseUrl) {
23308
23313
  if (url.match(/^[a-z]+:\/\//i)) {
@@ -24329,11 +24334,15 @@ const useChartFunctions = ({
24329
24334
  axes
24330
24335
  } = options;
24331
24336
  const resetZoom2 = useCallback(() => {
24337
+ var _a2, _b2;
24332
24338
  const chartInstance = chartRef == null ? void 0 : chartRef.current;
24333
- chartInstance == null ? void 0 : chartInstance.resetZoom();
24334
- chartInstance == null ? void 0 : chartInstance.reset();
24335
- dispatch({ type: "RESET_AXES_RANGES", payload: { axes: [] } });
24336
- }, [chartRef == null ? void 0 : chartRef.current, dispatch]);
24339
+ if (chartInstance && (state == null ? void 0 : state.edited)) {
24340
+ (_a2 = chartInstance == null ? void 0 : chartInstance.resetZoom) == null ? void 0 : _a2.call(chartInstance);
24341
+ (_b2 = chartInstance == null ? void 0 : chartInstance.reset) == null ? void 0 : _b2.call(chartInstance);
24342
+ dispatch({ type: RESET_AXES_RANGES, payload: { axes: [] } });
24343
+ dispatch({ type: UPDATE_EDITED, payload: false });
24344
+ }
24345
+ }, [chartRef == null ? void 0 : chartRef.current, dispatch, state]);
24337
24346
  const onHover = useCallback(
24338
24347
  (hoveredPoint, setHoveredPoint, datasets) => {
24339
24348
  return (evt, hoveredItems) => {
@@ -24433,14 +24442,24 @@ const useChartFunctions = ({
24433
24442
  });
24434
24443
  }, [axes]);
24435
24444
  const onResetAxes = useCallback(() => {
24445
+ var _a2, _b2;
24436
24446
  const chartInstance = chartRef == null ? void 0 : chartRef.current;
24437
- chartInstance == null ? void 0 : chartInstance.resetZoom();
24438
- chartInstance == null ? void 0 : chartInstance.reset();
24439
- dispatch({ type: RESET_AXES_RANGES, payload: { axes: [] } });
24447
+ if (chartInstance && state.edited) {
24448
+ (_a2 = chartInstance == null ? void 0 : chartInstance.resetZoom) == null ? void 0 : _a2.call(chartInstance);
24449
+ (_b2 = chartInstance == null ? void 0 : chartInstance.reset) == null ? void 0 : _b2.call(chartInstance);
24450
+ dispatch({ type: RESET_AXES_RANGES, payload: { axes: [] } });
24451
+ dispatch({ type: UPDATE_EDITED, payload: false });
24452
+ }
24440
24453
  }, [chartRef == null ? void 0 : chartRef.current]);
24441
24454
  const onUpdateAxes = useCallback(({ axes: axes2 }) => {
24442
24455
  dispatch({ type: UPDATE_AXES_RANGES, payload: { axes: axes2 } });
24443
24456
  }, []);
24457
+ const onUpdateEdited = useCallback(
24458
+ (edited) => {
24459
+ dispatch({ type: UPDATE_EDITED, payload: edited });
24460
+ },
24461
+ [state]
24462
+ );
24444
24463
  return {
24445
24464
  resetZoom: resetZoom2,
24446
24465
  onHover,
@@ -24450,7 +24469,8 @@ const useChartFunctions = ({
24450
24469
  controlsAxesLabels: getControlsAxesLabels(axes),
24451
24470
  updateAxesRangesFromChart,
24452
24471
  onResetAxes,
24453
- onUpdateAxes
24472
+ onUpdateAxes,
24473
+ onUpdateEdited
24454
24474
  };
24455
24475
  };
24456
24476
  const createErrorMessages = (value, compareTo, type) => {
@@ -24504,6 +24524,7 @@ const AxesOptionsPopover = (optionsPopover) => {
24504
24524
  controlsAxesLabels,
24505
24525
  onUpdateAxes,
24506
24526
  onResetAxes,
24527
+ onUpdateEdited,
24507
24528
  depthType,
24508
24529
  translations,
24509
24530
  close,
@@ -24512,7 +24533,7 @@ const AxesOptionsPopover = (optionsPopover) => {
24512
24533
  const [formState, setFormState] = useState({
24513
24534
  localAxes: getInitAxes({ chartRef, state }),
24514
24535
  depthType: depthType == null ? void 0 : depthType.selectedDepthType,
24515
- edited: false
24536
+ edited: state.edited
24516
24537
  });
24517
24538
  const { errors, valid } = validateAxes(formState.localAxes);
24518
24539
  const onEditValue = ({ name, value, id }) => {
@@ -24548,6 +24569,7 @@ const AxesOptionsPopover = (optionsPopover) => {
24548
24569
  if (depthType && (depthType == null ? void 0 : depthType.setSelectedDepthType)) {
24549
24570
  depthType == null ? void 0 : depthType.setSelectedDepthType(formState.depthType);
24550
24571
  }
24572
+ onUpdateEdited(formState.edited);
24551
24573
  };
24552
24574
  const onReset = () => {
24553
24575
  setFormState({
@@ -24556,6 +24578,7 @@ const AxesOptionsPopover = (optionsPopover) => {
24556
24578
  edited: false
24557
24579
  });
24558
24580
  onResetAxes();
24581
+ onUpdateEdited(false);
24559
24582
  close == null ? void 0 : close();
24560
24583
  };
24561
24584
  const handleInputFocus = (e2) => e2.target.select();
@@ -24624,11 +24647,13 @@ const AxesOptionsPopover = (optionsPopover) => {
24624
24647
  key: i2,
24625
24648
  label: depth
24626
24649
  })),
24627
- onSelected: (key) => setFormState((prevState) => ({
24628
- ...prevState,
24629
- depthType: depthType.options[key],
24630
- edited: true
24631
- })),
24650
+ onSelected: (key) => {
24651
+ setFormState((prevState) => ({
24652
+ ...prevState,
24653
+ depthType: depthType.options[key],
24654
+ edited: true
24655
+ }));
24656
+ },
24632
24657
  small: true,
24633
24658
  value: depthType.options.indexOf(formState.depthType)
24634
24659
  }
@@ -24710,7 +24735,13 @@ const Controls = ({
24710
24735
  onToggleDragAnnotation,
24711
24736
  onDisableDragOptions
24712
24737
  } = useToggleHandlers(dispatch);
24713
- const { handleDownload, controlsAxesLabels, onResetAxes, onUpdateAxes } = useChartFunctions({
24738
+ const {
24739
+ handleDownload,
24740
+ controlsAxesLabels,
24741
+ onResetAxes,
24742
+ onUpdateAxes,
24743
+ onUpdateEdited
24744
+ } = useChartFunctions({
24714
24745
  chartRef,
24715
24746
  state,
24716
24747
  options,
@@ -24771,6 +24802,7 @@ const Controls = ({
24771
24802
  controlsAxesLabels,
24772
24803
  onUpdateAxes,
24773
24804
  onResetAxes,
24805
+ onUpdateEdited,
24774
24806
  depthType,
24775
24807
  translations
24776
24808
  }
@@ -25080,19 +25112,20 @@ const generateLineChartDatasets = (datasets, state, options, { label }) => {
25080
25112
  } = line ?? {};
25081
25113
  const { lineEnabled, pointsEnabled, axes = [] } = state ?? {};
25082
25114
  const { lineTension, spanGaps } = graph ?? {};
25083
- if (formation) {
25115
+ const rawData = Array.isArray(data) ? data : [];
25116
+ if (formation && (rawData == null ? void 0 : rawData.length)) {
25084
25117
  const axesMin = Number((_a2 = axes[0]) == null ? void 0 : _a2.min);
25085
25118
  const axesMax = Number((_b2 = axes[0]) == null ? void 0 : _b2.max);
25086
- const [startPoint, endPoint] = data;
25119
+ const [startPoint, endPoint] = rawData;
25087
25120
  if (axesMin && (startPoint == null ? void 0 : startPoint.x)) {
25088
- data[0].x = Math.max(axesMin, startPoint.x);
25121
+ rawData[0].x = Math.max(axesMin, startPoint.x);
25089
25122
  }
25090
25123
  if (axesMax && (endPoint == null ? void 0 : endPoint.x)) {
25091
- data[2].x = Math.min(axesMax, endPoint.x);
25124
+ rawData[2].x = Math.min(axesMax, endPoint.x);
25092
25125
  }
25093
25126
  }
25094
25127
  const hasCustomOpt = checkCustomOption(line, CUSTOM_OPTION);
25095
- const filteredData = data.filter(Boolean) || [];
25128
+ const filteredData = (rawData == null ? void 0 : rawData.filter(Boolean)) || [];
25096
25129
  const isSinglePoint = (filteredData == null ? void 0 : filteredData.length) === 1;
25097
25130
  let pointState, lineState;
25098
25131
  if (customShowPoints !== void 0) {
@@ -25415,7 +25448,7 @@ const getAlignmentData = (context) => {
25415
25448
  const { chart: chart2, dataIndex = 0, datasetIndex = 0 } = context;
25416
25449
  const { chartArea } = chart2;
25417
25450
  const { left: left2 = null, right: right2 = null, bottom: bottom2 = null } = chartArea;
25418
- const meta = chart2.getDatasetMeta(datasetIndex);
25451
+ const meta = chart2 == null ? void 0 : chart2.getDatasetMeta(datasetIndex);
25419
25452
  const { x: x2 = null, y: y2 = null } = ((_a2 = meta == null ? void 0 : meta.data) == null ? void 0 : _a2[dataIndex]) || {};
25420
25453
  return {
25421
25454
  x: x2,
@@ -25937,7 +25970,7 @@ const useChartOptions = ({
25937
25970
  const [hoveredPoint, setHoveredPoint] = useState(
25938
25971
  null
25939
25972
  );
25940
- const { updateAxesRangesFromChart, onHover } = useChartFunctions({
25973
+ const { updateAxesRangesFromChart, onHover, onUpdateEdited } = useChartFunctions({
25941
25974
  chartRef,
25942
25975
  state,
25943
25976
  options,
@@ -25963,6 +25996,7 @@ const useChartOptions = ({
25963
25996
  mode: PanZoomMode.XY,
25964
25997
  onPanComplete() {
25965
25998
  updateAxesRangesFromChart();
25999
+ onUpdateEdited(true);
25966
26000
  }
25967
26001
  }),
25968
26002
  [panEnabled]
@@ -25979,6 +26013,7 @@ const useChartOptions = ({
25979
26013
  },
25980
26014
  onZoomComplete() {
25981
26015
  updateAxesRangesFromChart();
26016
+ onUpdateEdited(true);
25982
26017
  }
25983
26018
  }),
25984
26019
  [zoomEnabled]
@@ -26044,21 +26079,15 @@ const useChartOptions = ({
26044
26079
  };
26045
26080
  const useChartPlugins = ({ options, resetZoom: resetZoom2 }) => {
26046
26081
  const { graph, legend: legend2 } = options;
26047
- const debouncedResetZoom = useCallback(
26048
- debounce$3(() => {
26049
- resetZoom2();
26050
- }, 100),
26051
- // 100ms debounce delay
26052
- [resetZoom2]
26053
- );
26054
26082
  const handleDoubleClick = useCallback(
26055
26083
  (_2, args) => {
26056
26084
  const { event } = args;
26057
26085
  if (event.type === DOUBLE_CLICK) {
26058
- debouncedResetZoom();
26086
+ resetZoom2();
26087
+ return false;
26059
26088
  }
26060
26089
  },
26061
- [debouncedResetZoom]
26090
+ [resetZoom2]
26062
26091
  );
26063
26092
  return useMemo(() => {
26064
26093
  return [