@complat/react-spectra-editor 1.0.0-rc2 → 1.0.0-rc20.patch-1

package/dist/components/panel/multiplicity.js

@@ -10,8 +10,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _reactRedux = require("react-redux");
 var _redux = require("redux");
-var _ExpansionPanel = _interopRequireDefault(require("@material-ui/core/ExpansionPanel"));
-var _ExpansionPanelSummary = _interopRequireDefault(require("@material-ui/core/ExpansionPanelSummary"));
+var _core = require("@material-ui/core");
 var _ExpandMore = _interopRequireDefault(require("@material-ui/icons/ExpandMore"));
 var _Divider = _interopRequireDefault(require("@material-ui/core/Divider"));
 var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
@@ -32,161 +31,155 @@ var _multiplicity_calc = require("../../helpers/multiplicity_calc");
 /* eslint-disable function-paren-newline,
 function-call-argument-newline, react/function-component-definition */
 
-var styles = function styles(theme) {
-  return {
-    panel: {
-      backgroundColor: '#eee',
-      display: 'table-row'
-    },
-    panelSummary: {
-      backgroundColor: '#eee',
-      height: 32
-    },
-    txtBadge: {},
-    panelDetail: {
-      backgroundColor: '#fff',
-      maxHeight: 'calc(90vh - 220px)',
-      // ROI
-      overflow: 'auto'
-    },
-    table: {
-      width: '100%'
-    },
-    tRowHeadPos: {
-      backgroundColor: '#2196f3',
-      height: 32
-    },
-    tRowHeadNeg: {
-      backgroundColor: '#fa004f',
-      height: 32
-    },
-    tTxtHead: {
-      color: 'white',
-      padding: '4px 0 4px 5px'
-    },
-    tTxtHeadXY: {
-      color: 'white',
-      padding: '4px 0 4px 90px'
-    },
-    tTxt: {
-      padding: 0
-    },
-    tRow: {
-      height: 28,
-      '&:nth-of-type(even)': {
-        backgroundColor: theme.palette.background.default
-      }
-    },
-    rmBtn: {
-      color: 'red',
-      '&:hover': {
-        borderRadius: 12,
-        backgroundColor: 'red',
-        color: 'white'
-      }
-    },
-    moCard: {
-      textAlign: 'left'
-    },
-    moCardHead: {
-      backgroundColor: '#999',
-      color: 'white'
-    },
-    moExtId: {
-      border: '2px solid white',
+const styles = theme => ({
+  panel: {
+    backgroundColor: '#eee',
+    display: 'table-row'
+  },
+  panelSummary: {
+    backgroundColor: '#eee',
+    height: 32
+  },
+  txtBadge: {},
+  panelDetail: {
+    backgroundColor: '#fff',
+    maxHeight: 'calc(90vh - 220px)',
+    // ROI
+    overflow: 'auto'
+  },
+  table: {
+    width: '100%'
+  },
+  tRowHeadPos: {
+    backgroundColor: '#2196f3',
+    height: 32
+  },
+  tRowHeadNeg: {
+    backgroundColor: '#fa004f',
+    height: 32
+  },
+  tTxtHead: {
+    color: 'white',
+    padding: '4px 0 4px 5px'
+  },
+  tTxtHeadXY: {
+    color: 'white',
+    padding: '4px 0 4px 90px'
+  },
+  tTxt: {
+    padding: 0
+  },
+  tRow: {
+    height: 28,
+    '&:nth-of-type(even)': {
+      backgroundColor: theme.palette.background.default
+    }
+  },
+  rmBtn: {
+    color: 'red',
+    '&:hover': {
       borderRadius: 12,
-      color: 'white',
-      margin: '0 5px 0 5px',
-      padding: '0 5px 0 5px'
-    },
-    moExtTxt: {
-      margin: '0 5px 0 5x',
-      fontSize: '0.8rem',
-      fontFamily: 'Helvetica'
-    },
-    moSelect: {
-      margin: '0 5x 0 5px',
-      fontSize: '0.8rem',
-      fontFamily: 'Helvetica'
-    },
-    moCBox: {
-      marginLeft: 24,
-      padding: '4px 0 4px 4px'
-    },
-    btnRf: {
-      color: '#fff',
-      float: 'right',
-      minWidth: 40,
-      right: 15
+      backgroundColor: 'red',
+      color: 'white'
     }
-  };
-};
-var cBoxStyle = function cBoxStyle() {
-  return {
-    root: {
-      color: 'white',
-      '&$checked': {
-        color: 'white'
-      }
-    },
-    checked: {}
-  };
-};
-var MUCheckbox = (0, _styles.withStyles)(cBoxStyle)(_Checkbox.default);
-var createData = function createData(idx, xExtent, peaks, shift, smExtext, mpyType, js, onClick, onRefresh) {
-  return {
-    idx: idx + 1,
-    xExtent: xExtent,
-    onClick: onClick,
-    onRefresh: onRefresh,
-    peaks: peaks,
-    center: (0, _multiplicity_calc.calcMpyCenter)(peaks, shift, mpyType),
-    jStr: (0, _multiplicity_calc.calcMpyJStr)(js),
-    mpyType: mpyType,
-    isCheck: smExtext.xL === xExtent.xL && smExtext.xU === xExtent.xU
-  };
-};
-var pkList = function pkList(classes, row, shift, digits, rmMpyPeakByPanelAct) {
-  return row.peaks.map(function (pk) {
-    var xExtent = row.xExtent;
-    var cb = function cb() {
-      return rmMpyPeakByPanelAct({
-        peak: pk,
-        xExtent: xExtent
-      });
-    };
-    var rmBtn = /*#__PURE__*/_react.default.createElement(_HighlightOff.default, {
-      onClick: cb,
-      className: classes.rmBtn
-    });
-    return /*#__PURE__*/_react.default.createElement(_TableRow.default, {
-      key: pk.x,
-      className: classes.tRow,
-      hover: true
-    }, /*#__PURE__*/_react.default.createElement(_TableCell.default, {
-      align: "right",
-      className: (0, _classnames.default)(classes.tTxt, 'txt-sv-panel-txt')
-    }, "(".concat((pk.x - shift).toFixed(digits), ", ").concat(pk.y.toExponential(2), ")")), /*#__PURE__*/_react.default.createElement(_TableCell.default, {
-      align: "right",
-      className: (0, _classnames.default)(classes.tTxt, 'txt-sv-panel-txt')
-    }, rmBtn));
+  },
+  moCard: {
+    textAlign: 'left'
+  },
+  moCardHead: {
+    backgroundColor: '#999',
+    color: 'white'
+  },
+  moExtId: {
+    border: '2px solid white',
+    borderRadius: 12,
+    color: 'white',
+    margin: '0 5px 0 5px',
+    padding: '0 5px 0 5px'
+  },
+  moExtTxt: {
+    margin: '0 5px 0 5x',
+    fontSize: '0.8rem',
+    fontFamily: 'Helvetica'
+  },
+  moSelect: {
+    margin: '0 5x 0 5px',
+    fontSize: '0.8rem',
+    fontFamily: 'Helvetica'
+  },
+  moCBox: {
+    marginLeft: 24,
+    padding: '4px 0 4px 4px'
+  },
+  btnRf: {
+    color: '#fff',
+    float: 'right',
+    minWidth: 40,
+    right: 15
+  }
+});
+const cBoxStyle = () => ({
+  root: {
+    color: 'white',
+    '&$checked': {
+      color: 'white'
+    }
+  },
+  checked: {}
+});
+const MUCheckbox = (0, _styles.withStyles)(cBoxStyle)(_Checkbox.default);
+const createData = (idx, xExtent, peaks, shift, smExtext, mpyType, js, onClick, onRefresh) => ({
+  idx: idx + 1,
+  xExtent,
+  onClick,
+  onRefresh,
+  peaks,
+  center: (0, _multiplicity_calc.calcMpyCenter)(peaks, shift, mpyType),
+  jStr: (0, _multiplicity_calc.calcMpyJStr)(js),
+  mpyType,
+  isCheck: smExtext.xL === xExtent.xL && smExtext.xU === xExtent.xU
+});
+const pkList = (classes, row, shift, digits, rmMpyPeakByPanelAct) => row.peaks.map(pk => {
+  const {
+    xExtent
+  } = row;
+  const cb = () => rmMpyPeakByPanelAct({
+    peak: pk,
+    xExtent
   });
-};
-var refreshBtn = function refreshBtn(classes, onRefresh) {
-  return /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-    placement: "left",
-    title: /*#__PURE__*/_react.default.createElement("span", {
-      className: "txt-sv-tp"
-    }, "Calculate Multiplicity")
-  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    className: classes.btnRf,
-    onClick: onRefresh
-  }, /*#__PURE__*/_react.default.createElement(_RefreshOutlined.default, null)));
-};
-var mpyList = function mpyList(classes, digits, multiplicitySt, curveSt, clickMpyOneAct, rmMpyPeakByPanelAct, resetMpyOneAct) {
-  var curveIdx = curveSt.curveIdx;
-  var multiplicities = multiplicitySt.multiplicities;
-  var selectedMulti = multiplicities[curveIdx];
+  const rmBtn = /*#__PURE__*/_react.default.createElement(_HighlightOff.default, {
+    onClick: cb,
+    className: classes.rmBtn
+  });
+  return /*#__PURE__*/_react.default.createElement(_TableRow.default, {
+    key: pk.x,
+    className: classes.tRow,
+    hover: true
+  }, /*#__PURE__*/_react.default.createElement(_TableCell.default, {
+    align: "right",
+    className: (0, _classnames.default)(classes.tTxt, 'txt-sv-panel-txt')
+  }, `(${(pk.x - shift).toFixed(digits)}, ${pk.y.toExponential(2)})`), /*#__PURE__*/_react.default.createElement(_TableCell.default, {
+    align: "right",
+    className: (0, _classnames.default)(classes.tTxt, 'txt-sv-panel-txt')
+  }, rmBtn));
+});
+const refreshBtn = (classes, onRefresh) => /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+  placement: "left",
+  title: /*#__PURE__*/_react.default.createElement("span", {
+    className: "txt-sv-tp"
+  }, "Calculate Multiplicity")
+}, /*#__PURE__*/_react.default.createElement(_Button.default, {
+  className: classes.btnRf,
+  onClick: onRefresh
+}, /*#__PURE__*/_react.default.createElement(_RefreshOutlined.default, null)));
+const mpyList = (classes, digits, multiplicitySt, curveSt, clickMpyOneAct, rmMpyPeakByPanelAct, resetMpyOneAct) => {
+  const {
+    curveIdx
+  } = curveSt;
+  const {
+    multiplicities
+  } = multiplicitySt;
+  let selectedMulti = multiplicities[curveIdx];
   if (selectedMulti === undefined) {
     selectedMulti = {
       stack: [],
@@ -195,68 +188,73 @@ var mpyList = function mpyList(classes, digits, multiplicitySt, curveSt, clickMp
       edited: false
     };
   }
-  var _selectedMulti = selectedMulti,
-    stack = _selectedMulti.stack,
-    shift = _selectedMulti.shift,
-    smExtext = _selectedMulti.smExtext;
-  var rows = stack.map(function (k, idx) {
-    var peaks = k.peaks,
-      xExtent = k.xExtent,
-      mpyType = k.mpyType,
-      js = k.js;
-    var onRefresh = function onRefresh() {
-      return resetMpyOneAct(xExtent);
-    };
-    var onClick = function onClick(e) {
+  const {
+    stack,
+    shift,
+    smExtext
+  } = selectedMulti;
+  const rows = stack.map((k, idx) => {
+    const {
+      peaks,
+      xExtent,
+      mpyType,
+      js
+    } = k;
+    const onRefresh = () => resetMpyOneAct(xExtent);
+    const onClick = e => {
       e.stopPropagation();
       e.preventDefault();
-      clickMpyOneAct(xExtent);
+      const payload = {
+        curveIdx,
+        payloadData: xExtent
+      };
+      clickMpyOneAct(payload);
     };
     return createData(idx, xExtent, peaks, shift, smExtext, mpyType, js, onClick, onRefresh);
   });
-  return /*#__PURE__*/_react.default.createElement("div", null, rows.map(function (row) {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: classes.moCard,
-      key: row.idx
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: classes.moCardHead
-    }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(MUCheckbox, {
-      className: classes.moCBox,
-      checked: row.isCheck,
-      onChange: row.onClick
-    }), /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)(classes.moExtTxt, classes.moExtId, 'txt-sv-panel-head')
-    }, row.idx), /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)(classes.moExtTxt, 'txt-sv-panel-head')
-    }, "".concat(row.center.toFixed(3), " (ppm)")), /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)(classes.moSelect, 'txt-sv-panel-head')
-    }, /*#__PURE__*/_react.default.createElement(_multiplicity_select.default, {
-      target: row
-    })), refreshBtn(classes, row.onRefresh)), /*#__PURE__*/_react.default.createElement(_multiplicity_coupling.default, {
-      row: row
-    })), /*#__PURE__*/_react.default.createElement(_Table.default, {
-      className: classes.table
-    }, /*#__PURE__*/_react.default.createElement(_TableBody.default, null, pkList(classes, row, shift, digits, rmMpyPeakByPanelAct))));
-  }));
+  return /*#__PURE__*/_react.default.createElement("div", null, rows.map(row => /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.moCard,
+    key: row.idx
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.moCardHead
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(MUCheckbox, {
+    className: classes.moCBox,
+    checked: row.isCheck,
+    onChange: row.onClick
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _classnames.default)(classes.moExtTxt, classes.moExtId, 'txt-sv-panel-head')
+  }, row.idx), /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _classnames.default)(classes.moExtTxt, 'txt-sv-panel-head')
+  }, `${row.center.toFixed(3)} (ppm)`), /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _classnames.default)(classes.moSelect, 'txt-sv-panel-head')
+  }, /*#__PURE__*/_react.default.createElement(_multiplicity_select.default, {
+    target: row
+  })), refreshBtn(classes, row.onRefresh)), /*#__PURE__*/_react.default.createElement(_multiplicity_coupling.default, {
+    row: row
+  })), /*#__PURE__*/_react.default.createElement(_Table.default, {
+    className: classes.table
+  }, /*#__PURE__*/_react.default.createElement(_TableBody.default, null, pkList(classes, row, shift, digits, rmMpyPeakByPanelAct))))));
 };
-var MultiplicityPanel = function MultiplicityPanel(_ref) {
-  var classes = _ref.classes,
-    expand = _ref.expand,
-    onExapnd = _ref.onExapnd,
-    multiplicitySt = _ref.multiplicitySt,
-    curveSt = _ref.curveSt,
-    clickMpyOneAct = _ref.clickMpyOneAct,
-    rmMpyPeakByPanelAct = _ref.rmMpyPeakByPanelAct,
-    resetMpyOneAct = _ref.resetMpyOneAct;
-  var digits = 4;
-  return /*#__PURE__*/_react.default.createElement(_ExpansionPanel.default, {
+const MultiplicityPanel = _ref => {
+  let {
+    classes,
+    expand,
+    onExapnd,
+    multiplicitySt,
+    curveSt,
+    clickMpyOneAct,
+    rmMpyPeakByPanelAct,
+    resetMpyOneAct
+  } = _ref;
+  const digits = 4;
+  return /*#__PURE__*/_react.default.createElement(_core.Accordion, {
     expanded: expand,
     onChange: onExapnd,
     className: (0, _classnames.default)(classes.panel),
     TransitionProps: {
       unmountOnExit: true
     } // increase ExpansionPanel performance
-  }, /*#__PURE__*/_react.default.createElement(_ExpansionPanelSummary.default, {
+  }, /*#__PURE__*/_react.default.createElement(_core.AccordionSummary, {
     expandIcon: /*#__PURE__*/_react.default.createElement(_ExpandMore.default, null),
     className: (0, _classnames.default)(classes.panelSummary)
   }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
@@ -267,23 +265,18 @@ var MultiplicityPanel = function MultiplicityPanel(_ref) {
     className: (0, _classnames.default)(classes.panelDetail)
   }, mpyList(classes, digits, multiplicitySt, curveSt, clickMpyOneAct, rmMpyPeakByPanelAct, resetMpyOneAct)));
 };
-var mapStateToProps = function mapStateToProps(state, props) {
-  return (
-    // eslint-disable-line
-    {
-      integrationSt: state.integration.present,
-      multiplicitySt: state.multiplicity.present,
-      curveSt: state.curve
-    }
-  );
-};
-var mapDispatchToProps = function mapDispatchToProps(dispatch) {
-  return (0, _redux.bindActionCreators)({
-    clickMpyOneAct: _multiplicity.clickMpyOne,
-    rmMpyPeakByPanelAct: _multiplicity.rmMpyPeakByPanel,
-    resetMpyOneAct: _multiplicity.resetMpyOne
-  }, dispatch);
-};
+const mapStateToProps = (state, props) => (
+// eslint-disable-line
+{
+  integrationSt: state.integration.present,
+  multiplicitySt: state.multiplicity.present,
+  curveSt: state.curve
+});
+const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({
+  clickMpyOneAct: _multiplicity.clickMpyOne,
+  rmMpyPeakByPanelAct: _multiplicity.rmMpyPeakByPanel,
+  resetMpyOneAct: _multiplicity.resetMpyOne
+}, dispatch);
 MultiplicityPanel.propTypes = {
   classes: _propTypes.default.object.isRequired,
   expand: _propTypes.default.bool.isRequired,
@@ -294,5 +287,4 @@ MultiplicityPanel.propTypes = {
   resetMpyOneAct: _propTypes.default.func.isRequired,
   curveSt: _propTypes.default.object.isRequired
 };
-var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)((0, _styles.withStyles)(styles)(MultiplicityPanel));
-exports.default = _default;
+var _default = exports.default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)((0, _styles.withStyles)(styles)(MultiplicityPanel));