@complat/react-spectra-editor 1.7.1 → 1.8.0

package/dist/helpers/compass.js

@@ -4,9 +4,18 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TfRescale = exports.MouseMove = exports.MountCompass = exports.ClickCompass = void 0;
+exports.getCurvePointFromEvent = exports.clearIntegrationPreview = exports.TfRescale = exports.MouseMove = exports.MountCompass = exports.ClickCompass = void 0;
 var _format = _interopRequireDefault(require("./format"));
 var _chem = require("./chem");
+var _list_ui = require("../constants/list_ui");
+var _cfg = _interopRequireDefault(require("./cfg"));
+var _sweep = require("./sweep.js");
+var _integration_draft = require("./integration_draft.js");
+var _integration_split = require("./integration_split");
+// eslint-disable-line import/extensions
+
+// eslint-disable-line import/extensions
+
 const d3 = require('d3');
 const TfRescale = focus => {
   const xt = focus.scales.x;
@@ -18,25 +27,16 @@ const TfRescale = focus => {
 };
 exports.TfRescale = TfRescale;
 const fetchPt = (event, focus, xt) => {
-  // const rawMouseX = focus.isFirefox // WORKAROUND d3.mouse firefox compatibility
-  //   ? d3.event.offsetX
-  //   : d3.mouse(focus.root.node())[0];
   const rawMouseX = d3.pointer(event, focus.root.node())[0];
   const mouseX = xt.invert(rawMouseX);
   const bisectDate = d3.bisector(d => +d.x).left;
   const dt = focus.data;
   const ls = dt.length;
-  const sortData = ls > 0 && dt[0].x > dt[ls - 1].x ? dt.reverse() : dt;
+  const sortData = ls > 0 && dt[0].x > dt[ls - 1].x ? [...dt].reverse() : dt;
   const idx = bisectDate(sortData, +mouseX);
-  return sortData[idx];
+  return sortData[Math.min(idx, ls - 1)];
 };
 const fetchFreePt = (event, focus, xt, yt) => {
-  // const rawMouseX = focus.isFirefox // WORKAROUND d3.mouse firefox compatibility
-  //   ? d3.event.offsetX
-  //   : d3.mouse(focus.root.node())[0];
-  // const rawMouseY = focus.isFirefox // WORKAROUND d3.mouse firefox compatibility
-  //   ? d3.event.offsetY
-  //   : d3.mouse(focus.root.node())[1];
   const rawMouseX = d3.pointer(event, focus.root.node())[0];
   const rawMouseY = d3.pointer(event, focus.root.node())[1];
   const mouseX = xt.invert(rawMouseX);
@@ -58,6 +58,69 @@ const fetchFreePt = (event, focus, xt, yt) => {
   });
   return selectPoint;
 };
+const clearIntegrationPreview = focus => {
+  if (!focus || !focus.root) return;
+  focus.root.select('.integration-preview-line').remove();
+};
+exports.clearIntegrationPreview = clearIntegrationPreview;
+const drawIntegrationPreview = (focus, firstPoint, nextPoint) => {
+  if (!firstPoint || !nextPoint) return;
+  const {
+    xt,
+    yt
+  } = TfRescale(focus);
+  const preview = focus.root.select('.integration-preview');
+  const line = preview.selectAll('.integration-preview-line').data([{
+    firstPoint,
+    nextPoint
+  }]);
+  line.enter().append('line').attr('class', 'integration-preview-line').attr('stroke', 'red').attr('stroke-width', 2).attr('stroke-dasharray', '4,3').style('pointer-events', 'none').merge(line).attr('x1', d => xt(d.firstPoint.x)).attr('y1', d => yt(d.firstPoint.y)).attr('x2', d => xt(d.nextPoint.x)).attr('y2', d => yt(d.nextPoint.y));
+};
+const getCurvePointFromEvent = (event, focus) => {
+  const {
+    xt,
+    yt
+  } = TfRescale(focus);
+  if (_format.default.isCyclicVoltaLayout(focus.layout)) {
+    return fetchFreePt(event, focus, xt, yt);
+  }
+  return fetchPt(event, focus, xt);
+};
+exports.getCurvePointFromEvent = getCurvePointFromEvent;
+const cancelIntegrationDraft = focus => {
+  Object.assign(focus, {
+    firstIntegrationPoint: null
+  });
+  clearIntegrationPreview(focus);
+  (0, _integration_draft.forgetPendingIntegrationDraft)();
+};
+const updateIntegrationPreview = (event, focus) => {
+  if (!focus.isUiAddIntgSt || !focus.firstIntegrationPoint) return;
+  if (!_cfg.default.showIntegSplitTools(focus.layout)) return;
+  const pt = getCurvePointFromEvent(event, focus);
+  if (!pt) return;
+  drawIntegrationPreview(focus, focus.firstIntegrationPoint, pt);
+};
+const updateIntegrationSplitPreview = (event, focus) => {
+  if (!focus.isUiSplitIntgSt && !focus.isUiVisualSplitIntgSt) return;
+  const {
+    splitX,
+    target
+  } = (0, _integration_split.getIntegrationSplitTargetFromEvent)(event, focus);
+  if (!target) {
+    (0, _integration_split.clearIntegrationSplitPreview)(focus);
+    return;
+  }
+  if (focus.isUiVisualSplitIntgSt && (0, _integration_split.isAlreadyVisuallySplit)(target)) {
+    (0, _integration_split.clearIntegrationSplitPreview)(focus);
+    return;
+  }
+  const {
+    shift = 0,
+    ignoreRef = false
+  } = focus.integrationSplitTargets || {};
+  (0, _integration_split.drawIntegrationSplitPreview)(focus, target, splitX, shift, ignoreRef);
+};
 const MouseMove = (event, focus) => {
   const {
     xt,
@@ -99,6 +162,13 @@ const MouseMove = (event, focus) => {
         focus.root.select('.cursor-txt-hz').attr('transform', `translate(${tx},${ty - 30})`).text(`2Theta: ${pt.x.toExponential(2)}, d-value: ${dValue}`);
       } else if (_format.default.isTGALayout(layout) || _format.default.isDSCLayout(layout)) {
         focus.root.select('.cursor-txt').attr('transform', `translate(${tx},${10})`).text(`X: ${pt.x.toFixed(3)}, Y: ${pt.y.toFixed(3)}`);
+      } else if (_format.default.isMsLayout(layout)) {
+        const maxY = d3.max(focus.data, row => row.y) || 0;
+        const relPct = maxY > 0 ? 100 * pt.y / maxY : 0;
+        const rel = maxY > 0 ? parseInt(relPct, 10) : 0;
+        const xPrecision = _format.default.clampDecimalPlaces(focus.decimal);
+        focus.root.select('.cursor-txt').attr('transform', `translate(${tx},${10})`).text(`${pt.x.toFixed(xPrecision)} (${rel})`);
+        focus.root.select('.cursor-txt-hz').text('');
       } else {
         focus.root.select('.cursor-txt').attr('transform', `translate(${tx},${10})`).text(pt.x.toFixed(3));
         if (freq) {
@@ -109,21 +179,111 @@ const MouseMove = (event, focus) => {
       }
     }
   }
+  updateIntegrationPreview(event, focus);
+  updateIntegrationSplitPreview(event, focus);
 };
 exports.MouseMove = MouseMove;
+const clickIntegrationPoint = (event, focus) => {
+  const pt = getCurvePointFromEvent(event, focus);
+  if (!pt) return;
+  const {
+    firstIntegrationPoint,
+    selectUiSweepAct
+  } = focus;
+  if (!firstIntegrationPoint) {
+    // Keep the draft local to D3; the second click emits the existing sweep payload.
+    const draftPoint = {
+      x: pt.x,
+      y: pt.y,
+      jcampIdx: focus.jcampIdx,
+      dataLength: focus.data.length
+    };
+    Object.assign(focus, {
+      firstIntegrationPoint: draftPoint
+    });
+    (0, _integration_draft.setPendingIntegrationDraft)({
+      jcampIdx: focus.jcampIdx,
+      dataLength: focus.data.length,
+      cancel: () => cancelIntegrationDraft(focus)
+    });
+    drawIntegrationPreview(focus, draftPoint, draftPoint);
+    return;
+  }
+  cancelIntegrationDraft(focus);
+  if (firstIntegrationPoint.x === pt.x) {
+    return;
+  }
+  selectUiSweepAct((0, _sweep.buildSweepPayloadFromXBounds)(focus, firstIntegrationPoint.x, pt.x));
+};
 const ClickCompass = (event, focus) => {
   event.stopPropagation();
   event.preventDefault();
-  const {
-    xt,
-    yt
-  } = TfRescale(focus);
-  let pt = fetchPt(event, focus, xt);
+  if (focus.isUiAddIntgSt && _cfg.default.showIntegSplitTools(focus.layout)) {
+    clickIntegrationPoint(event, focus);
+    return;
+  }
+  if (focus.isUiSplitIntgSt) {
+    const {
+      splitX,
+      target
+    } = (0, _integration_split.getIntegrationSplitTargetFromEvent)(event, focus);
+    if (!target) return;
+    (0, _integration_split.clearIntegrationSplitPreview)(focus);
+    focus.splitIntegrationAct({
+      curveIdx: focus.jcampIdx,
+      target,
+      splitX,
+      data: focus.data
+    });
+    return;
+  }
+  if (focus.isUiVisualSplitIntgSt) {
+    const {
+      splitX,
+      target
+    } = (0, _integration_split.getIntegrationSplitTargetFromEvent)(event, focus);
+    if (!target) return;
+    const {
+      stack = [],
+      shift = 0
+    } = focus.integrationSplitTargets || {};
+    const existingSplitX = (0, _integration_split.getVisualSplitLineAtX)(focus, stack, splitX, shift);
+    (0, _integration_split.clearIntegrationSplitPreview)(focus);
+    if (Number.isFinite(existingSplitX)) {
+      if (typeof focus.removeVisualSplitLineAct !== 'function') return;
+      focus.removeVisualSplitLineAct({
+        curveIdx: focus.jcampIdx,
+        splitX: existingSplitX,
+        data: focus.data
+      });
+      return;
+    }
+    if ((0, _integration_split.isAlreadyVisuallySplit)(target)) return;
+    if (typeof focus.addVisualSplitLineAct !== 'function') return;
+    focus.addVisualSplitLineAct({
+      curveIdx: focus.jcampIdx,
+      target,
+      splitX,
+      data: focus.data
+    });
+    return;
+  }
   const {
     layout,
     cyclicvoltaSt,
     jcampIdx
   } = focus;
+  const isPeakGroupSelect = focus.uiSt?.sweepType === _list_ui.LIST_UI_SWEEP_TYPE.PEAK_GROUP_SELECT;
+  const isMsGraph = focus.graphIndex === 2;
+  const isUvvisGraph = focus.graphIndex === 0;
+  const isLcmsTicGraph = _format.default.isLCMsLayout(layout) && focus.graphIndex === 1;
+  if (isPeakGroupSelect && isMsGraph) return;
+  if (isPeakGroupSelect && _format.default.isLCMsLayout(layout) && isUvvisGraph) return;
+  const {
+    xt,
+    yt
+  } = TfRescale(focus);
+  let pt = fetchPt(event, focus, xt);
   if (_format.default.isCyclicVoltaLayout(layout)) {
     pt = fetchFreePt(event, focus, xt, yt);
     const onPeak = false;
@@ -137,6 +297,8 @@ const ClickCompass = (event, focus) => {
     } else {
       focus.clickUiTargetAct(pt, onPeak);
     }
+  } else if (isLcmsTicGraph) {
+    focus.clickUiTargetAct(pt, false, false, jcampIdx, false, 'lcms_tic');
   } else {
     focus.clickUiTargetAct(pt, false);
   }
@@ -150,11 +312,13 @@ const MountCompass = focus => {
   } = focus;
   const compass = root.append('g').attr('class', 'compass');
   const cursor = root.append('g').attr('class', 'cursor');
+  const preview = root.append('g').attr('class', 'integration-preview').attr('clip-path', 'url(#clip)');
   const overlay = root.append('rect').attr('class', 'overlay-focus').attr('width', w).attr('height', h).attr('opacity', 0.0);
   compass.append('line').attr('class', 'x-hover-line hover-line').attr('stroke', '#777').attr('stroke-width', 1).attr('stroke-dasharray', 2, 2);
   compass.append('circle').attr('r', 4).attr('fill', 'none').attr('stroke', '#777').attr('stroke-width', 2);
   cursor.append('text').attr('class', 'cursor-txt').attr('font-family', 'Helvetica').style('font-size', '12px').style('text-anchor', 'middle');
   cursor.append('text').attr('class', 'cursor-txt-hz').attr('font-family', 'Helvetica').style('font-size', '12px').style('text-anchor', 'middle').style('fill', '#D68910');
+  preview.selectAll('*').remove();
   overlay.on('mousemove', event => MouseMove(event, focus)).on('click', event => ClickCompass(event, focus));
 };
 exports.MountCompass = MountCompass;

package/dist/helpers/extractEntityLCMS.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "getLcMsInfo", {
+  enumerable: true,
+  get: function get() {
+    return _extractEntityLCMS.getLcMsInfo;
+  }
+});
+Object.defineProperty(exports, "isLcMsGroup", {
+  enumerable: true,
+  get: function get() {
+    return _extractEntityLCMS.isLcMsGroup;
+  }
+});
+Object.defineProperty(exports, "splitAndReindexEntities", {
+  enumerable: true,
+  get: function get() {
+    return _extractEntityLCMS.splitAndReindexEntities;
+  }
+});
+var _extractEntityLCMS = require("../features/lc-ms/entities/extractEntityLCMS");

package/dist/helpers/extractParams.js

@@ -6,35 +6,33 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.extractParams = void 0;
 var _format = _interopRequireDefault(require("./format"));
-const getScanIdx = (entity, scanSt) => {
+var _extractEntityLCMS = require("./extractEntityLCMS");
+const getScanIdx = (entity, scanState) => {
   const {
     target,
     isAuto
-  } = scanSt;
+  } = scanState || {};
   const {
-    features,
-    spectra
-  } = entity;
-  const defaultFeat = features.editPeak || features.autoPeak || features[0];
-  const hasEdit = !!defaultFeat.scanEditTarget;
-  const defaultIdx = isAuto || !hasEdit ? defaultFeat.scanAutoTarget : defaultFeat.scanEditTarget;
+    features = {},
+    spectra = []
+  } = entity || {};
+  const defaultFeature = features.editPeak || features.autoPeak || features[0] || {};
+  const hasEdit = !!defaultFeature?.scanEditTarget;
+  const defaultIdx = isAuto || !hasEdit ? defaultFeature?.scanAutoTarget : defaultFeature?.scanEditTarget;
   const defaultCount = +spectra.length;
   let idx = +(target || defaultIdx || 0);
-  if (idx > defaultCount) {
-    idx = defaultCount;
-  }
-  return idx - 1;
+  if (idx > defaultCount) idx = defaultCount;
+  return Math.max(idx - 1, 0);
 };
-const extrShare = (entity, thresSt, scanIdx = 0) => {
+const extractSharedParams = (entity, thresholdState, scanIdx = 0) => {
   const {
-    spectra,
-    features
-  } = entity;
-  // const { autoPeak, editPeak } = features; // TBD
-  const autoPeak = features.autoPeak || features[scanIdx] || features[0];
-  const editPeak = features.editPeak || features[scanIdx] || features[0];
-  const hasEdit = editPeak && editPeak.data ? editPeak.data[0].x.length > 0 : false;
-  const feature = hasEdit && thresSt.isEdit ? editPeak : autoPeak;
+    spectra = [],
+    features = {}
+  } = entity || {};
+  const autoPeak = features.autoPeak || features[scanIdx] || features[0] || {};
+  const editPeak = features.editPeak || features[scanIdx] || features[0] || {};
+  const hasEdit = !!editPeak?.data?.[0]?.x?.length;
+  const feature = hasEdit && thresholdState?.isEdit ? editPeak : autoPeak;
   const {
     integration,
     multiplicity
@@ -47,21 +45,99 @@ const extrShare = (entity, thresSt, scanIdx = 0) => {
     multiplicity
   };
 };
-const extrMs = (entity, thresSt, scanSt) => {
-  const scanIdx = getScanIdx(entity, scanSt);
+const extractLcmsParams = entity => {
+  const {
+    features,
+    layout
+  } = entity;
+  let topicX = [];
+  let topicY = [];
+  const entityInfo = (0, _extractEntityLCMS.getLcMsInfo)(entity);
+  let featuresArray = [];
+  if (Array.isArray(features)) {
+    featuresArray = features;
+  } else if (features && typeof features === 'object') {
+    featuresArray = Object.values(features);
+  }
+  if (entityInfo.kind === 'tic') {
+    const ticFeature = featuresArray.find(spectrum => spectrum?.data?.[0]?.x?.length > 0);
+    if (ticFeature?.data?.[0]) {
+      const {
+        x,
+        y
+      } = ticFeature.data[0];
+      topicX = x;
+      topicY = y;
+    }
+  } else {
+    featuresArray.forEach(spectrum => {
+      if (!spectrum?.data?.[0]) return;
+      const {
+        y
+      } = spectrum.data[0];
+      const {
+        pageValue
+      } = spectrum;
+      topicX.push(pageValue);
+      topicY.push(Math.max(...y));
+    });
+  }
+  return {
+    topic: {
+      x: topicX,
+      y: topicY
+    },
+    feature: {
+      maxY: topicY.length ? Math.max(...topicY) : 0,
+      operation: {
+        layout
+      },
+      data: [{
+        x: topicX,
+        y: topicY
+      }],
+      isPeaktable: false
+    }
+  };
+};
+const extractMsParams = (entity, thresholdState, scanState, forceLcms = false) => {
+  const {
+    layout
+  } = entity;
+  if (_format.default.isMsLayout(layout) && !forceLcms) {
+    const scanIdx = getScanIdx(entity, scanState);
+    const {
+      spectra,
+      feature,
+      hasEdit
+    } = extractSharedParams(entity, thresholdState, scanIdx);
+    const topic = spectra?.[scanIdx]?.data?.[0] || {
+      x: [],
+      y: []
+    };
+    return {
+      topic,
+      feature,
+      hasEdit
+    };
+  }
   const {
     spectra,
-    feature,
-    hasEdit
-  } = extrShare(entity, thresSt, scanIdx);
-  const topic = spectra[scanIdx].data[0];
+    features
+  } = entity;
+  const {
+    topic,
+    feature
+  } = extractLcmsParams(entity);
   return {
+    entity,
+    spectra,
+    features,
     topic,
-    feature,
-    hasEdit
+    feature
   };
 };
-const extrNi = (entity, thresSt) => {
+const extractNonMsParams = (entity, thresholdState) => {
   const scanIdx = 0;
   const {
     spectra,
@@ -69,8 +145,11 @@ const extrNi = (entity, thresSt) => {
     hasEdit,
     integration,
     multiplicity
-  } = extrShare(entity, thresSt, scanIdx);
-  const topic = spectra[0].data[0];
+  } = extractSharedParams(entity, thresholdState, scanIdx);
+  const topic = spectra?.[0]?.data?.[0] || {
+    x: [],
+    y: []
+  };
   return {
     topic,
     feature,
@@ -79,7 +158,13 @@ const extrNi = (entity, thresSt) => {
     multiplicity
   };
 };
-const extractParams = (entity, thresSt, scanSt) => _format.default.isMsLayout(entity.layout) ? extrMs(entity, thresSt, scanSt) : extrNi(entity, thresSt);
+const extractParams = (entity, thresholdState, scanState, options = {}) => {
+  const {
+    forceLcms = false
+  } = options;
+  const shouldUseLcmsPath = forceLcms || _format.default.isLCMsLayout(entity.layout);
+  return _format.default.isMsLayout(entity.layout) || shouldUseLcmsPath ? extractMsParams(entity, thresholdState, scanState, shouldUseLcmsPath) : extractNonMsParams(entity, thresholdState);
+};
 
 // eslint-disable-line
 exports.extractParams = extractParams;

package/dist/helpers/extractPeaksEdit.js

@@ -5,11 +5,32 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.extractPeaksEdit = exports.extractAutoPeaks = exports.extractAreaUnderCurve = void 0;
-var _converter = require("./converter");
+Object.defineProperty(exports, "formatLcmsIntegralsForBackend", {
+  enumerable: true,
+  get: function get() {
+    return _submit.formatLcmsIntegralsForBackend;
+  }
+});
+Object.defineProperty(exports, "formatLcmsPeaksForBackend", {
+  enumerable: true,
+  get: function get() {
+    return _submit.formatLcmsPeaksForBackend;
+  }
+});
+Object.defineProperty(exports, "getLcmsMzPageData", {
+  enumerable: true,
+  get: function get() {
+    return _submit.getLcmsMzPageData;
+  }
+});
 var _chem = require("./chem");
+var _converter = require("./converter");
 var _shift = require("./shift");
 var _format = _interopRequireDefault(require("./format"));
 var _integration = require("./integration");
+var _submit = require("../features/lc-ms/submit");
+/* eslint-disable max-len */
+
 const niOffset = (shiftSt, atIndex = 0) => {
   const {
     shifts
@@ -26,19 +47,18 @@ const niOffset = (shiftSt, atIndex = 0) => {
   return offset;
 };
 const msOffset = () => 0;
-const extractPeaksEdit = (feature, editPeakSt, thresSt, shiftSt, layoutSt, atIndex = 0) => {
-  const offset = _format.default.isMsLayout(layoutSt) ? msOffset() : niOffset(shiftSt, atIndex);
-  const peaks = (0, _chem.Convert2Peak)(feature, thresSt.value, offset);
-  const peaksEdit = (0, _converter.PksEdit)(peaks, editPeakSt);
-  return peaksEdit;
-};
-exports.extractPeaksEdit = extractPeaksEdit;
 const extractAutoPeaks = (feature, thresSt, shiftSt, layoutSt, atIndex = 0) => {
-  const offset = _format.default.isMsLayout(layoutSt) ? msOffset() : niOffset(shiftSt, atIndex);
+  const offset = _format.default.isMsLayout(layoutSt) || _format.default.isLCMsLayout(layoutSt) ? msOffset() : niOffset(shiftSt, atIndex);
   const peaks = (0, _chem.Convert2Peak)(feature, thresSt.value, offset);
   return peaks;
 };
 exports.extractAutoPeaks = extractAutoPeaks;
+const extractPeaksEdit = (feature, editPeakSt, thresSt, shiftSt, layoutSt, atIndex = 0) => {
+  if (_format.default.isLCMsLayout(layoutSt)) return [];
+  const peaks = extractAutoPeaks(feature, thresSt, shiftSt, layoutSt, atIndex);
+  return (0, _converter.PksEdit)(peaks, editPeakSt);
+};
+exports.extractPeaksEdit = extractPeaksEdit;
 const getAUCValue = (integrationSt, layoutSt) => {
   const {
     refArea,