@complat/react-spectra-editor 1.7.0 → 1.8.0

package/dist/__tests__/units/features/lc-ms/submit/peaks.test.js

@@ -0,0 +1,310 @@
+"use strict";
+
+var _peaks = require("../../../../../features/lc-ms/submit/peaks");
+describe('lc-ms/submit peaks — backend payload shape', () => {
+  describe('formatLcmsPeaksForBackend', () => {
+    it('returns empty array when state is missing or has no spectraList', () => {
+      expect((0, _peaks.formatLcmsPeaksForBackend)(null)).toEqual([]);
+      expect((0, _peaks.formatLcmsPeaksForBackend)({})).toEqual([]);
+      expect((0, _peaks.formatLcmsPeaksForBackend)({
+        uvvis: {}
+      })).toEqual([]);
+      expect((0, _peaks.formatLcmsPeaksForBackend)({
+        uvvis: {
+          spectraList: null
+        }
+      })).toEqual([]);
+    });
+    it('adds wavelength from spectrum pageValue to each peak (single channel)', () => {
+      const hplcMsSt = {
+        uvvis: {
+          spectraList: [{
+            pageValue: 254,
+            peaks: [{
+              x: 1.2,
+              y: 10,
+              _meta: 'a'
+            }, {
+              x: 3.4,
+              y: 20
+            }]
+          }]
+        }
+      };
+      const out = (0, _peaks.formatLcmsPeaksForBackend)(hplcMsSt);
+      expect(out).toEqual([{
+        x: 1.2,
+        y: 10,
+        _meta: 'a',
+        wavelength: 254
+      }, {
+        x: 3.4,
+        y: 20,
+        wavelength: 254
+      }]);
+    });
+    it('flattens peaks from multiple UV channels with distinct wavelengths', () => {
+      const hplcMsSt = {
+        uvvis: {
+          spectraList: [{
+            pageValue: 230,
+            peaks: [{
+              x: 0.1,
+              y: 1
+            }]
+          }, {
+            pageValue: 280,
+            peaks: [{
+              x: 0.2,
+              y: 2
+            }, {
+              x: 0.3,
+              y: 3
+            }]
+          }, {
+            pageValue: 210,
+            peaks: []
+          }]
+        }
+      };
+      const out = (0, _peaks.formatLcmsPeaksForBackend)(hplcMsSt);
+      expect(out).toHaveLength(3);
+      expect(out[0]).toMatchObject({
+        x: 0.1,
+        wavelength: 230
+      });
+      expect(out[1]).toMatchObject({
+        x: 0.2,
+        wavelength: 280
+      });
+      expect(out[2]).toMatchObject({
+        x: 0.3,
+        wavelength: 280
+      });
+    });
+    it('ignores spectra with no peaks', () => {
+      const hplcMsSt = {
+        uvvis: {
+          spectraList: [{
+            pageValue: 254,
+            peaks: []
+          }, {
+            pageValue: 230,
+            peaks: [{
+              x: 1,
+              y: 1
+            }]
+          }]
+        }
+      };
+      expect((0, _peaks.formatLcmsPeaksForBackend)(hplcMsSt)).toEqual([{
+        x: 1,
+        y: 1,
+        wavelength: 230
+      }]);
+    });
+  });
+  describe('formatLcmsIntegralsForBackend', () => {
+    it('returns empty when no integrals', () => {
+      expect((0, _peaks.formatLcmsIntegralsForBackend)(null)).toEqual([]);
+      expect((0, _peaks.formatLcmsIntegralsForBackend)({
+        uvvis: {
+          spectraList: []
+        }
+      })).toEqual([]);
+    });
+    it('maps integration fields to backend keys (from, to, value, integral, wavelength)', () => {
+      const hplcMsSt = {
+        uvvis: {
+          spectraList: [{
+            pageValue: 254,
+            integrations: [{
+              xL: 1,
+              xU: 2,
+              area: 100,
+              absoluteArea: 1000
+            }, {
+              xL: 3,
+              xU: 4,
+              area: 50,
+              absoluteArea: 500
+            }]
+          }]
+        }
+      };
+      expect((0, _peaks.formatLcmsIntegralsForBackend)(hplcMsSt)).toEqual([{
+        from: 1,
+        to: 2,
+        value: 100,
+        integral: 1000,
+        wavelength: 254
+      }, {
+        from: 3,
+        to: 4,
+        value: 50,
+        integral: 500,
+        wavelength: 254
+      }]);
+    });
+  });
+  describe('getLcmsMzPageData', () => {
+    it('returns null when tic or ms is missing', () => {
+      expect((0, _peaks.getLcmsMzPageData)(null)).toBeNull();
+      expect((0, _peaks.getLcmsMzPageData)({})).toBeNull();
+      expect((0, _peaks.getLcmsMzPageData)({
+        tic: {}
+      })).toBeNull();
+      expect((0, _peaks.getLcmsMzPageData)({
+        ms: {}
+      })).toBeNull();
+    });
+    it('returns null when TIC x axis is missing or currentPageValue is not finite', () => {
+      const base = {
+        tic: {
+          polarity: 'positive',
+          currentPageValue: 0.5,
+          positive: {
+            data: {}
+          }
+        },
+        ms: {
+          positive: {
+            pageValues: [0.5],
+            peaks: [[{
+              x: 100,
+              y: 1
+            }]]
+          }
+        }
+      };
+      expect((0, _peaks.getLcmsMzPageData)({
+        ...base,
+        tic: {
+          ...base.tic,
+          currentPageValue: NaN
+        }
+      })).toBeNull();
+    });
+    it('returns null when RT does not match any TIC point or page value', () => {
+      const hplcMsSt = {
+        tic: {
+          polarity: 'positive',
+          currentPageValue: 0.99,
+          positive: {
+            data: {
+              x: [0.1, 0.2]
+            }
+          }
+        },
+        ms: {
+          positive: {
+            pageValues: [0.1, 0.2],
+            peaks: [[{
+              x: 50,
+              y: 1
+            }], [{
+              x: 60,
+              y: 2
+            }]]
+          }
+        }
+      };
+      expect((0, _peaks.getLcmsMzPageData)(hplcMsSt)).toBeNull();
+    });
+    it('resolves MS peak array for positive polarity via pageValues', () => {
+      const peakRow = [{
+        x: 120.1,
+        y: 999
+      }, {
+        x: 121,
+        y: 1
+      }];
+      const hplcMsSt = {
+        tic: {
+          polarity: 'positive',
+          currentPageValue: 0.5,
+          positive: {
+            data: {
+              x: [0.4, 0.5, 0.6]
+            }
+          }
+        },
+        ms: {
+          positive: {
+            pageValues: [0.4, 0.5, 0.6],
+            peaks: [[], peakRow, []]
+          }
+        }
+      };
+      expect((0, _peaks.getLcmsMzPageData)(hplcMsSt)).toEqual(peakRow);
+    });
+    it('uses negative polarity and matching pageValues', () => {
+      const peakRow = [{
+        x: 200,
+        y: 1
+      }];
+      const hplcMsSt = {
+        tic: {
+          polarity: 'negative',
+          currentPageValue: 1.0,
+          negative: {
+            data: {
+              x: [1.0]
+            }
+          }
+        },
+        ms: {
+          negative: {
+            pageValues: [1.0],
+            peaks: [peakRow]
+          }
+        }
+      };
+      expect((0, _peaks.getLcmsMzPageData)(hplcMsSt)).toEqual(peakRow);
+    });
+    it('falls back to TIC x index when pageValues does not list the RT', () => {
+      const peakRow = [{
+        x: 300,
+        y: 1
+      }];
+      const hplcMsSt = {
+        tic: {
+          polarity: 'positive',
+          currentPageValue: 0.5,
+          positive: {
+            data: {
+              x: [0.3, 0.5, 0.7]
+            }
+          }
+        },
+        ms: {
+          positive: {
+            pageValues: null,
+            peaks: [[], peakRow, []]
+          }
+        }
+      };
+      expect((0, _peaks.getLcmsMzPageData)(hplcMsSt)).toEqual(peakRow);
+    });
+    it('returns null when peaks slot is not an array', () => {
+      const hplcMsSt = {
+        tic: {
+          polarity: 'positive',
+          currentPageValue: 0.5,
+          positive: {
+            data: {
+              x: [0.5]
+            }
+          }
+        },
+        ms: {
+          positive: {
+            pageValues: [0.5],
+            peaks: [null]
+          }
+        }
+      };
+      expect((0, _peaks.getLcmsMzPageData)(hplcMsSt)).toBeNull();
+    });
+  });
+});

package/dist/actions/curve.js

@@ -10,9 +10,12 @@ const selectCurve = payload => ({
   payload
 });
 exports.selectCurve = selectCurve;
-const setAllCurves = payload => ({
+const setAllCurves = (payload, meta) => ({
   type: _action_type.CURVE.SET_ALL_CURVES,
-  payload
+  payload,
+  ...(meta && typeof meta === 'object' ? {
+    meta
+  } : {})
 });
 exports.setAllCurves = setAllCurves;
 const toggleShowAllCurves = payload => ({

package/dist/actions/hplc_ms.js

@@ -0,0 +1,66 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.uvvisUndo = exports.uvvisRedo = exports.updateCurrentPageValue = exports.setLcmsIntegrationsExport = exports.selectWavelength = exports.clearIntegrationAllHplcMs = exports.clearHplcMsState = exports.clearAllPeaksHplcMs = exports.changeTic = void 0;
+var _action_type = require("../constants/action_type");
+const normalizeTicPolarity = value => {
+  if (value === 0 || value === '0') return 'positive';
+  if (value === 1 || value === '1') return 'negative';
+  if (value === 2 || value === '2') return 'neutral';
+  if (value === 'positive' || value === 'negative' || value === 'neutral') return value;
+  return 'positive';
+};
+const setLcmsIntegrationsExport = lcmsIntegrationsExport => ({
+  type: _action_type.HPLC_MS.SET_LCMS_INTEGRATIONS_EXPORT,
+  payload: {
+    lcmsIntegrationsExport
+  }
+});
+exports.setLcmsIntegrationsExport = setLcmsIntegrationsExport;
+const selectWavelength = payload => ({
+  type: _action_type.HPLC_MS.UPDATE_UVVIS_WAVE_LENGTH,
+  payload
+});
+exports.selectWavelength = selectWavelength;
+const changeTic = payload => {
+  const rawValue = payload?.target?.value ?? payload?.polarity ?? 'positive';
+  const polarity = normalizeTicPolarity(rawValue);
+  return {
+    type: _action_type.HPLC_MS.SELECT_TIC_CURVE,
+    payload: {
+      polarity
+    }
+  };
+};
+exports.changeTic = changeTic;
+const updateCurrentPageValue = currentPageValue => ({
+  type: _action_type.HPLC_MS.UPDATE_CURRENT_PAGE_VALUE,
+  payload: {
+    currentPageValue
+  }
+});
+exports.updateCurrentPageValue = updateCurrentPageValue;
+const uvvisUndo = () => ({
+  type: _action_type.HPLC_MS.UVVIS_UNDO
+});
+exports.uvvisUndo = uvvisUndo;
+const uvvisRedo = () => ({
+  type: _action_type.HPLC_MS.UVVIS_REDO
+});
+exports.uvvisRedo = uvvisRedo;
+const clearIntegrationAllHplcMs = payload => ({
+  type: _action_type.HPLC_MS.CLEAR_INTEGRATION_ALL_HPLCMS,
+  payload
+});
+exports.clearIntegrationAllHplcMs = clearIntegrationAllHplcMs;
+const clearAllPeaksHplcMs = payload => ({
+  type: _action_type.HPLC_MS.CLEAR_ALL_PEAKS_HPLCMS,
+  payload
+});
+exports.clearAllPeaksHplcMs = clearAllPeaksHplcMs;
+const clearHplcMsState = () => ({
+  type: _action_type.HPLC_MS.CLEAR_STATE
+});
+exports.clearHplcMsState = clearHplcMsState;

package/dist/actions/integration.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.sweepIntegration = exports.setIntegrationFkr = exports.clearIntegrationAll = void 0;
+exports.sweepIntegration = exports.splitIntegration = exports.setIntegrationFkr = exports.removeVisualSplitLine = exports.clearIntegrationAll = exports.addVisualSplitLine = void 0;
 var _action_type = require("../constants/action_type");
 const sweepIntegration = payload => ({
   type: _action_type.INTEGRATION.SWEEP,
@@ -19,6 +19,21 @@ const clearIntegrationAll = payload => ({
   type: _action_type.INTEGRATION.CLEAR_ALL,
   payload
 });
+exports.clearIntegrationAll = clearIntegrationAll;
+const splitIntegration = payload => ({
+  type: _action_type.INTEGRATION.SPLIT,
+  payload
+});
+exports.splitIntegration = splitIntegration;
+const addVisualSplitLine = payload => ({
+  type: _action_type.INTEGRATION.ADD_VISUAL_SPLIT,
+  payload
+});
+exports.addVisualSplitLine = addVisualSplitLine;
+const removeVisualSplitLine = payload => ({
+  type: _action_type.INTEGRATION.RM_VISUAL_SPLIT,
+  payload
+});
 
 // eslint-disable-line
-exports.clearIntegrationAll = clearIntegrationAll;
+exports.removeVisualSplitLine = removeVisualSplitLine;

package/dist/actions/ui.js

@@ -3,18 +3,37 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.setUiViewerType = exports.setUiSweepType = exports.selectUiSweep = exports.scrollUiWheel = exports.clickUiTarget = void 0;
+exports.setUiViewerType = exports.setUiSweepType = exports.selectUiSweep = exports.scrollUiWheel = exports.displaySubViewerAt = exports.clickUiTarget = void 0;
 var _action_type = require("../constants/action_type");
-const setUiViewerType = payload => ({
-  type: _action_type.UI.VIEWER.SET_TYPE,
-  payload
-});
-exports.setUiViewerType = setUiViewerType;
-const setUiSweepType = (payload, jcampIdx = 0) => ({
+var _list_ui = require("../constants/list_ui");
+var _integration_draft = require("../helpers/integration_draft.js");
+// eslint-disable-line import/extensions
+
+const keepIntegrationMode = (jcampIdx = 0) => ({
   type: _action_type.UI.SWEEP.SET_TYPE,
-  payload,
+  payload: _list_ui.LIST_UI_SWEEP_TYPE.INTEGRATION_ADD,
   jcampIdx
 });
+const setUiViewerType = payload => {
+  if (!(0, _integration_draft.confirmCancelPendingIntegration)()) {
+    return keepIntegrationMode();
+  }
+  return {
+    type: _action_type.UI.VIEWER.SET_TYPE,
+    payload
+  };
+};
+exports.setUiViewerType = setUiViewerType;
+const setUiSweepType = (payload, jcampIdx = 0) => {
+  if (payload !== _list_ui.LIST_UI_SWEEP_TYPE.INTEGRATION_ADD && !(0, _integration_draft.confirmCancelPendingIntegration)()) {
+    return keepIntegrationMode(jcampIdx);
+  }
+  return {
+    type: _action_type.UI.SWEEP.SET_TYPE,
+    payload,
+    jcampIdx
+  };
+};
 exports.setUiSweepType = setUiSweepType;
 const selectUiSweep = payload => ({
   type: _action_type.UI.SWEEP.SELECT,
@@ -26,12 +45,21 @@ const scrollUiWheel = payload => ({
   payload
 });
 exports.scrollUiWheel = scrollUiWheel;
-const clickUiTarget = (payload, onPeak, voltammetryPeakIdx = 0, jcampIdx = 0, onPecker = false) => ({
+const clickUiTarget = (payload, onPeak, voltammetryPeakIdx = 0, jcampIdx = 0, onPecker = false, sourceHint = null) => ({
   type: _action_type.UI.CLICK_TARGET,
   payload,
   onPeak,
   voltammetryPeakIdx,
   jcampIdx,
-  onPecker
+  onPecker,
+  sourceHint
+});
+exports.clickUiTarget = clickUiTarget;
+const displaySubViewerAt = payload => ({
+  type: _action_type.UI.SUB_VIEWER.DISPLAY_VIEWER_AT,
+  payload: payload == null ? {
+    x: null,
+    y: null
+  } : payload
 });
-exports.clickUiTarget = clickUiTarget;
+exports.displaySubViewerAt = displaySubViewerAt;

package/dist/app.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "FN", {
     return _fn.default;
   }
 });
-exports.SpectraEditor = void 0;
+exports.store = exports.SpectraEditor = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactRedux = require("react-redux");
 var _redux = require("redux");
@@ -33,8 +33,13 @@ var _jsxRuntime = require("react/jsx-runtime");
 const sagaMiddleware = (0, _reduxSaga.default)();
 const middlewares = [sagaMiddleware]; // logger
 
-const store = (0, _redux.compose)((0, _redux.applyMiddleware)(...middlewares))(_redux.createStore)(_index.default);
-sagaMiddleware.run(_index2.default);
+const store = exports.store = (0, _redux.compose)((0, _redux.applyMiddleware)(...middlewares))(_redux.createStore)(_index.default);
+try {
+  sagaMiddleware.run(_index2.default);
+} catch (error) {
+  // Keep startup failure visible without crashing silently.
+  console.error('[SpectraEditor] Failed to start sagas', error); // eslint-disable-line no-console
+}
 
 // - - - helper - - -
 const ensureQuillDelta = descs => {
@@ -45,6 +50,10 @@ const ensureQuillDelta = descs => {
 };
 
 // - - - React - - -
+// LC/MS: when `onLcmsPageRequest` is set, the host (e.g. ELN) must reload `multiEntities`
+// with MS data for the requested RT/polarity. Triggers include `user_click`, `initial`,
+// and `tic_polarity` (TIC polarity dropdown). The standalone demo in `src/index.js`
+// implements a local mock via `buildLcmsStandaloneMultiEntities`.
 const SpectraEditor = ({
   entity,
   others,
@@ -62,7 +71,8 @@ const SpectraEditor = ({
   multiEntities,
   multiMolSvgs,
   entityFileNames,
-  userManualLink
+  userManualLink,
+  onLcmsPageRequest
 }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRedux.Provider, {
   store: store,
   children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.StyledEngineProvider, {
@@ -84,7 +94,8 @@ const SpectraEditor = ({
       editorOnly: editorOnly,
       exactMass: exactMass,
       canChangeDescription: canChangeDescription,
-      onDescriptionChanged: onDescriptionChanged
+      onDescriptionChanged: onDescriptionChanged,
+      onLcmsPageRequest: onLcmsPageRequest
     })
   })
 });
@@ -105,6 +116,7 @@ SpectraEditor.propTypes = {
   editorOnly: _propTypes.default.bool,
   canChangeDescription: _propTypes.default.bool,
   onDescriptionChanged: _propTypes.default.func,
+  onLcmsPageRequest: _propTypes.default.func,
   userManualLink: _propTypes.default.object,
   exactMass: _propTypes.default.string
 };
@@ -113,8 +125,8 @@ SpectraEditor.defaultProps = {
     others: [],
     addOthersCb: false
   },
-  multiEntities: false,
-  entityFileNames: false,
+  multiEntities: [],
+  entityFileNames: [],
   cLabel: '',
   xLabel: '',
   yLabel: '',
@@ -126,5 +138,6 @@ SpectraEditor.defaultProps = {
   multiMolSvgs: [],
   editorOnly: false,
   canChangeDescription: false,
-  userManualLink: {}
+  userManualLink: {},
+  onLcmsPageRequest: null
 };

package/dist/components/cmd_bar/01_viewer.js

@@ -40,11 +40,13 @@ const Viewer = ({
         className: "txt-sv-tp",
         children: "Spectrum Viewer"
       }),
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.MuButton, {
-        className: (0, _classnames.default)((0, _common.focusStyle)(isfocusSpectrumSt, classes), 'btn-sv-bar-spctrum'),
-        onClick: onViewSpectrum,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TimelineOutlined.default, {
-          className: classes.icon
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.MuButton, {
+          className: (0, _classnames.default)((0, _common.focusStyle)(isfocusSpectrumSt, classes), 'btn-sv-bar-spctrum'),
+          onClick: onViewSpectrum,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TimelineOutlined.default, {
+            className: classes.icon
+          })
         })
       })
     }), hideCmdAnaViewerSt ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
@@ -52,12 +54,14 @@ const Viewer = ({
         className: "txt-sv-tp",
         children: "Analysis Viewer"
       }),
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.MuButton, {
-        className: (0, _classnames.default)((0, _common.focusStyle)(isfocusAnalysisSt, classes), 'btn-sv-bar-analysis'),
-        disabled: disableCmdAnaViewerSt,
-        onClick: onViewAnalysis,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SpellcheckOutlined.default, {
-          className: classes.icon
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_common.MuButton, {
+          className: (0, _classnames.default)((0, _common.focusStyle)(isfocusAnalysisSt, classes), 'btn-sv-bar-analysis'),
+          disabled: disableCmdAnaViewerSt,
+          onClick: onViewAnalysis,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SpellcheckOutlined.default, {
+            className: classes.icon
+          })
         })
       })
     })]