@complat/react-spectra-editor 1.0.1-beta.2 → 1.1.0

package/dist/helpers/brush.js

@@ -10,19 +10,19 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /* eslint-disable prefer-object-spread */
 
-const wheeled = focus => {
+const wheeled = (focus, event) => {
   const {
     currentExtent,
     scrollUiWheelAct
   } = focus;
   // WORKAROUND: firefox wheel compatibilty
-  const wheelEvent = focus.isFirefox ? -d3.event.deltaY : d3.event.wheelDelta; // eslint-disable-line
+  const wheelEvent = focus.isFirefox ? -event.deltaY : event.wheelDelta; // eslint-disable-line
   const direction = wheelEvent > 0;
   scrollUiWheelAct(Object.assign({}, currentExtent, {
     direction
   }));
 };
-const brushed = (focus, isUiAddIntgSt) => {
+const brushed = (focus, isUiAddIntgSt, event) => {
   const {
     selectUiSweepAct,
     data,
@@ -32,7 +32,7 @@ const brushed = (focus, isUiAddIntgSt) => {
     h,
     scales
   } = focus;
-  const selection = d3.event.selection && d3.event.selection.reverse();
+  const selection = event.selection && event.selection.reverse();
   if (!selection) return;
   let xes = [w, 0].map(scales.x.invert).sort((a, b) => a - b);
   let yes = [h, 0].map(scales.y.invert).sort((a, b) => a - b);
@@ -82,15 +82,15 @@ const MountBrush = (focus, isUiAddIntgSt, isUiNoBrushSt) => {
   } = focus;
   svg.selectAll('.brush').remove();
   svg.selectAll('.brushX').remove();
-  const brushedCb = () => brushed(focus, isUiAddIntgSt);
-  const wheeledCb = () => wheeled(focus);
+  const brushedCb = event => brushed(focus, isUiAddIntgSt, event);
+  const wheeledCb = event => wheeled(focus, event);
   if (isUiNoBrushSt) {
     const target = isUiAddIntgSt ? brushX : brush;
     target.handleSize(10).extent([[0, 0], [w, h]]).on('end', brushedCb);
 
     // append brush components
     const klass = isUiAddIntgSt ? 'brushX' : 'brush';
-    root.append('g').attr('class', klass).on('mousemove', () => (0, _compass.MouseMove)(focus)).call(target);
+    root.append('g').attr('class', klass).on('mousemove', event => (0, _compass.MouseMove)(event, focus)).call(target);
   }
   svg.on('wheel', wheeledCb);
 };

package/dist/helpers/chem.js

@@ -773,7 +773,10 @@ const extrFeaturesCylicVolta = (jcamp, layout, peakUp) => {
     const lowerThres = _format.default.isXRDLayout(layout) ? 100 : calcLowerThres(s);
     const cpo = buildPeakFeature(jcamp, layout, peakUp, s, 100, upperThres, lowerThres);
     const bnd = getBoundary(s);
-    return Object.assign({}, base, cpo, bnd);
+    const detector = _format.default.isSECLayout(layout) && jcamp.info.$DETECTOR ? jcamp.info.$DETECTOR : '';
+    return Object.assign({}, base, cpo, bnd, {
+      detector
+    });
   }).filter(r => r != null);
   return features;
 };
@@ -819,7 +822,7 @@ const extractTemperature = jcamp => {
 const ExtractJcamp = source => {
   const jcamp = _jcampconverter.default.convert(source, {
     xy: true,
-    keepRecordsRegExp: /(\$CSTHRESHOLD|\$CSSCANAUTOTARGET|\$CSSCANEDITTARGET|\$CSSCANCOUNT|\$CSSOLVENTNAME|\$CSSOLVENTVALUE|\$CSSOLVENTX|\$CSCATEGORY|\$CSITAREA|\$CSITFACTOR|\$OBSERVEDINTEGRALS|\$OBSERVEDMULTIPLETS|\$OBSERVEDMULTIPLETSPEAKS|\.SOLVENTNAME|\.OBSERVEFREQUENCY|\$CSSIMULATIONPEAKS|\$CSUPPERTHRESHOLD|\$CSLOWERTHRESHOLD|\$CSCYCLICVOLTAMMETRYDATA|UNITS|SYMBOL|CSAUTOMETADATA)/ // eslint-disable-line
+    keepRecordsRegExp: /(\$CSTHRESHOLD|\$CSSCANAUTOTARGET|\$CSSCANEDITTARGET|\$CSSCANCOUNT|\$CSSOLVENTNAME|\$CSSOLVENTVALUE|\$CSSOLVENTX|\$CSCATEGORY|\$CSITAREA|\$CSITFACTOR|\$OBSERVEDINTEGRALS|\$OBSERVEDMULTIPLETS|\$OBSERVEDMULTIPLETSPEAKS|\.SOLVENTNAME|\.OBSERVEFREQUENCY|\$CSSIMULATIONPEAKS|\$CSUPPERTHRESHOLD|\$CSLOWERTHRESHOLD|\$CSCYCLICVOLTAMMETRYDATA|UNITS|SYMBOL|CSAUTOMETADATA|\$DETECTOR)/ // eslint-disable-line
   });
   const layout = readLayout(jcamp);
   const peakUp = !_format.default.isIrLayout(layout);

package/dist/helpers/compass.js

@@ -19,11 +19,11 @@ const TfRescale = focus => {
   };
 };
 exports.TfRescale = TfRescale;
-const fetchPt = (focus, xt) => {
+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.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;
@@ -32,15 +32,15 @@ const fetchPt = (focus, xt) => {
   const idx = bisectDate(sortData, +mouseX);
   return sortData[idx];
 };
-const fetchFreePt = (focus, xt, yt) => {
+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.mouse(focus.root.node())[0];
-  const rawMouseY = 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);
   const mouseY = yt.invert(rawMouseY);
   const distance2 = (x1, x2, y1, y2) => {
@@ -60,7 +60,7 @@ const fetchFreePt = (focus, xt, yt) => {
   });
   return selectPoint;
 };
-const MouseMove = focus => {
+const MouseMove = (event, focus) => {
   const {
     xt,
     yt
@@ -71,7 +71,7 @@ const MouseMove = focus => {
     wavelength
   } = focus;
   if (_format.default.isCyclicVoltaLayout(layout)) {
-    const pt = fetchFreePt(focus, xt, yt);
+    const pt = fetchFreePt(event, focus, xt, yt);
     if (pt) {
       const tx = xt(pt.x);
       const ty = yt(pt.y);
@@ -85,7 +85,7 @@ const MouseMove = focus => {
       }
     }
   } else {
-    const pt = fetchPt(focus, xt);
+    const pt = fetchPt(event, focus, xt);
     if (pt) {
       const tx = xt(pt.x);
       const ty = yt(pt.y);
@@ -99,6 +99,8 @@ const MouseMove = focus => {
           dValue = (0, _chem.Convert2DValue)(pt.x).toExponential(2);
         }
         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)) {
+        focus.root.select('.cursor-txt').attr('transform', `translate(${tx},${10})`).text(`X: ${pt.x.toFixed(3)}, Y: ${pt.y.toFixed(3)}`);
       } else {
         focus.root.select('.cursor-txt').attr('transform', `translate(${tx},${10})`).text(pt.x.toFixed(3));
         if (freq) {
@@ -111,21 +113,21 @@ const MouseMove = focus => {
   }
 };
 exports.MouseMove = MouseMove;
-const ClickCompass = focus => {
-  d3.event.stopPropagation();
-  d3.event.preventDefault();
+const ClickCompass = (event, focus) => {
+  event.stopPropagation();
+  event.preventDefault();
   const {
     xt,
     yt
   } = TfRescale(focus);
-  let pt = fetchPt(focus, xt);
+  let pt = fetchPt(event, focus, xt);
   const {
     layout,
     cyclicvoltaSt,
     jcampIdx
   } = focus;
   if (_format.default.isCyclicVoltaLayout(layout)) {
-    pt = fetchFreePt(focus, xt, yt);
+    pt = fetchFreePt(event, focus, xt, yt);
     const onPeak = false;
     if (cyclicvoltaSt) {
       const {
@@ -155,6 +157,6 @@ const MountCompass = focus => {
   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');
-  overlay.on('mousemove', () => MouseMove(focus)).on('click', () => ClickCompass(focus));
+  overlay.on('mousemove', event => MouseMove(event, focus)).on('click', event => ClickCompass(event, focus));
 };
 exports.MountCompass = MountCompass;

package/dist/helpers/mount.js

@@ -45,13 +45,13 @@ const MountRef = target => {
 };
 exports.MountRef = MountRef;
 const MountPath = (target, color) => {
-  const path = target.root.append('g').attr('class', 'line-clip').attr('clip-path', 'url(#clip)').append('path').attr('class', 'line').style('fill', 'none').style('stroke', color).style('stroke-width', 1).on('click', () => (0, _compass.ClickCompass)(target));
+  const path = target.root.append('g').attr('class', 'line-clip').attr('clip-path', 'url(#clip)').append('path').attr('class', 'line').style('fill', 'none').style('stroke', color).style('stroke-width', 1).on('click', event => (0, _compass.ClickCompass)(event, target));
   return path;
 };
 exports.MountPath = MountPath;
 const MountComparePath = function (target, color, id) {
   let alpha = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
-  const path = target.root.append('g').attr('class', 'line-clip-compare').attr('id', id).attr('clip-path', 'url(#clip)').append('path').attr('class', 'line').style('fill', 'none').style('stroke', color).style('stroke-opacity', alpha).style('stroke-width', 1).style('stroke-dasharray', '30, 3').on('click', () => (0, _compass.ClickCompass)(target));
+  const path = target.root.append('g').attr('class', 'line-clip-compare').attr('id', id).attr('clip-path', 'url(#clip)').append('path').attr('class', 'line').style('fill', 'none').style('stroke', color).style('stroke-opacity', alpha).style('stroke-width', 1).style('stroke-dasharray', '30, 3').on('click', event => (0, _compass.ClickCompass)(event, target));
   return path;
 };
 exports.MountComparePath = MountComparePath;

package/dist/helpers/zoom.js

@@ -12,10 +12,10 @@ const resetZoom = main => {
   main.svg.selectAll('.brush').call(main.brush.move, null);
 };
 const MountZoom = (main, zoomed) => {
-  const zoomedCb = () => zoomed(main);
-  const resetZoomCb = () => {
-    d3.event.stopPropagation();
-    d3.event.preventDefault();
+  const zoomedCb = event => zoomed(event, main);
+  const resetZoomCb = event => {
+    event.stopPropagation();
+    event.preventDefault();
     resetZoom(main);
   };
   main.zoom.on('zoom', zoomedCb);

package/dist/index.js

@@ -604,30 +604,35 @@ class DemoWriteIr extends _react.default.Component {
       },
       onClick: this.onClick('raman')
     }, "RAMAN"), /*#__PURE__*/_react.default.createElement(_material.Button, {
+      id: "btn-uv-vis",
       variant: "contained",
       style: {
         margin: '0 10px 0 10px'
       },
       onClick: this.onClick('uv/vis')
     }, "UV/VIS"), /*#__PURE__*/_react.default.createElement(_material.Button, {
+      id: "btn-hplc",
       variant: "contained",
       style: {
         margin: '0 10px 0 10px'
       },
       onClick: this.onClick('hplc uv/vis')
     }, "HPLC UV/VIS"), /*#__PURE__*/_react.default.createElement(_material.Button, {
+      id: "btn-tga",
       variant: "contained",
       style: {
         margin: '0 10px 0 10px'
       },
       onClick: this.onClick('tga')
     }, "TGA"), /*#__PURE__*/_react.default.createElement(_material.Button, {
+      id: "btn-xrd",
       variant: "contained",
       style: {
         margin: '0 10px 0 10px'
       },
       onClick: this.onClick('xrd')
     }, "XRD"), /*#__PURE__*/_react.default.createElement(_material.Button, {
+      id: "btn-cv",
       variant: "contained",
       style: {
         margin: '0 10px 0 10px'
@@ -640,12 +645,14 @@ class DemoWriteIr extends _react.default.Component {
       },
       onClick: this.onClick('cds')
     }, "CDS"), /*#__PURE__*/_react.default.createElement(_material.Button, {
+      id: "btn-sec",
       variant: "contained",
       style: {
         margin: '0 10px 0 10px'
       },
       onClick: this.onClick('sec')
     }, "SEC"), /*#__PURE__*/_react.default.createElement(_material.Button, {
+      id: "btn-sod",
       variant: "contained",
       style: {
         margin: '0 10px 0 10px'

package/dist/layer_init.js

@@ -60,9 +60,11 @@ class LayerInit extends _react.default.Component {
       resetInitCommonAct,
       resetInitMsAct,
       resetInitNmrAct,
-      resetInitCommonWithIntergationAct
+      resetInitCommonWithIntergationAct,
+      resetDetectorAct
     } = this.props;
     resetInitCommonAct();
+    resetDetectorAct();
     const {
       layout,
       features
@@ -185,6 +187,7 @@ const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({
   resetInitNmrAct: _manager.resetInitNmr,
   resetInitMsAct: _manager.resetInitMs,
   resetInitCommonWithIntergationAct: _manager.resetInitCommonWithIntergation,
+  resetDetectorAct: _manager.resetDetector,
   updateOperationAct: _submit.updateOperation,
   updateMetaPeaksAct: _meta.updateMetaPeaks,
   addOthersAct: _jcamp.addOthers,
@@ -217,7 +220,9 @@ LayerInit.propTypes = {
   onDescriptionChanged: _propTypes.default.func,
   // eslint-disable-line
   setAllCurvesAct: _propTypes.default.func.isRequired,
-  userManualLink: _propTypes.default.object // eslint-disable-line
+  userManualLink: _propTypes.default.object,
+  // eslint-disable-line
+  resetDetectorAct: _propTypes.default.func.isRequired
 };
 var _default = exports.default = (0, _reactRedux.connect)(
 // eslint-disable-line

package/dist/reducers/index.js

@@ -25,6 +25,7 @@ var _reducer_wavelength = _interopRequireDefault(require("./reducer_wavelength")
 var _reducer_voltammetry = _interopRequireDefault(require("./reducer_voltammetry"));
 var _reducer_curve = _interopRequireDefault(require("./reducer_curve"));
 var _reducer_axes = _interopRequireDefault(require("./reducer_axes"));
+var _reducer_detector = _interopRequireDefault(require("./reducer_detector"));
 const rootReducer = (0, _redux.combineReducers)({
   threshold: _reducer_threshold.default,
   editPeak: _reducer_edit_peak.default,
@@ -44,6 +45,7 @@ const rootReducer = (0, _redux.combineReducers)({
   wavelength: _reducer_wavelength.default,
   cyclicvolta: _reducer_voltammetry.default,
   curve: _reducer_curve.default,
-  axesUnits: _reducer_axes.default
+  axesUnits: _reducer_axes.default,
+  detector: _reducer_detector.default
 });
 var _default = exports.default = rootReducer;

package/dist/reducers/reducer_detector.js

@@ -0,0 +1,52 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _action_type = require("../constants/action_type");
+/* eslint-disable no-case-declarations */
+/* eslint-disable default-param-last */
+
+const initialState = {
+  curves: [{
+    curveIdx: 0,
+    selectedDetector: ''
+  }]
+};
+const findCurveIndex = (curves, targetCurveIdx) => curves.findIndex(curve => curve.curveIdx === targetCurveIdx);
+const updateOrAppendCurve = (curves, targetCurveIdx, newCurve) => {
+  const existingCurveIndex = findCurveIndex(curves, targetCurveIdx);
+  if (existingCurveIndex !== -1) {
+    return curves.map((curve, index) => index === existingCurveIndex ? {
+      ...curve,
+      ...newCurve
+    } : curve);
+  }
+  return [...curves, newCurve];
+};
+const detectorReducer = function () {
+  let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialState;
+  let action = arguments.length > 1 ? arguments[1] : undefined;
+  switch (action.type) {
+    case _action_type.SEC.UPDATE_DETECTOR:
+      const {
+        curveIdx,
+        selectedDetector
+      } = action.payload;
+      // eslint-disable-next-line max-len
+      const updatedCurves = updateOrAppendCurve(state.curves, curveIdx, {
+        curveIdx,
+        selectedDetector
+      });
+      return {
+        ...state,
+        curves: updatedCurves
+      };
+    case _action_type.MANAGER.RESET_DETECTOR:
+      return initialState;
+    default:
+      return state;
+  }
+};
+var _default = exports.default = detectorReducer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@complat/react-spectra-editor",
-  "version": "1.0.1-beta.2",
+  "version": "1.1.0",
   "description": "An editor to View and Edit Chemical Spectra data (NMR, IR and MS, CV, UIVIS, XRD).",
   "repository": {
     "type": "git",
@@ -23,9 +23,7 @@
     "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "browserslist": "^4.21.5",
     "classnames": "^2.3.2",
-    "d3": "^5.16.0",
-    "d3-brush": "3.0.0",
-    "d3-selection": "^2.0.0",
+    "d3": "^7.8.5",
     "d3-tip": "^0.9.1",
     "jcampconverter": "4.1.0",
     "ml-savitzky-golay-generalized": "1.1.1",
@@ -48,7 +46,8 @@
     "test:coverage": "CI=true react-scripts test --env=jsdom --verbose --testPathIgnorePatterns=./src/__tests__/fixtures/ --coverage",
     "eject": "react-scripts eject",
     "storybook": "start-storybook -p 3001 -c .storybook",
-    "buildbook": "build-storybook -c .storybook -o .out"
+    "buildbook": "build-storybook -c .storybook -o .out",
+    "e2e": "cypress open"
   },
   "peerDependencies": {
     "react": "^17.0.2",
@@ -65,6 +64,7 @@
     "@types/enzyme": "^3.10.13",
     "@wojtekmaj/enzyme-adapter-react-17": "^0.8.0",
     "babel-loader": "8.2.5",
+    "cypress": "^13.6.2",
     "enzyme": "^3.11.0",
     "enzyme-to-json": "^3.6.2",
     "eslint-config-airbnb": "^19.0.4",
@@ -90,5 +90,10 @@
   ],
   "publishConfig": {
     "access": "public"
+  },
+  "jest": {
+    "transformIgnorePatterns": [
+      "/node_modules/(?!d3|d3-array|internmap|delaunator|robust-predicates)"
+    ]
   }
 }