@complat/react-spectra-editor 1.5.4 → 1.6.0

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.
@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
7
  exports.default = void 0;
8
- var _react = _interopRequireDefault(require("react"));
8
+ var _react = _interopRequireWildcard(require("react"));
9
9
  var _propTypes = _interopRequireDefault(require("prop-types"));
10
10
  var _classnames = _interopRequireDefault(require("classnames"));
11
11
  var _reactRedux = require("react-redux");
12
12
  var _redux = require("redux");
13
+ var _ExpandLess = _interopRequireDefault(require("@mui/icons-material/ExpandLess"));
13
14
  var _ExpandMore = _interopRequireDefault(require("@mui/icons-material/ExpandMore"));
14
15
  var _AddCircleOutline = _interopRequireDefault(require("@mui/icons-material/AddCircleOutline"));
15
16
  var _RemoveCircle = _interopRequireDefault(require("@mui/icons-material/RemoveCircle"));
@@ -23,30 +24,73 @@ var _list_ui = require("../../constants/list_ui");
23
24
  var _chem = require("../../helpers/chem");
24
25
  var _format = _interopRequireDefault(require("../../helpers/format"));
25
26
  var _jsxRuntime = require("react/jsx-runtime");
27
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
26
28
  /* eslint-disable function-paren-newline, react/require-default-props,
27
29
  react/no-unused-prop-types, react/jsx-closing-tag-location, max-len, react/jsx-one-expression-per-line,
28
30
  react/jsx-indent, react/no-unescaped-entities, react/jsx-wrap-multilines, camelcase, no-shadow,
29
31
  arrow-body-style, react/function-component-definition */
30
32
 
33
+ const MAX_VISIBLE_ROWS = 6;
34
+ const ROW_HEIGHT_PX = 28;
35
+ const HEADER_HEIGHT_PX = 24;
36
+ const EXPANDED_HEIGHT = HEADER_HEIGHT_PX + MAX_VISIBLE_ROWS * ROW_HEIGHT_PX;
31
37
  const styles = () => ({
32
38
  panel: {
33
- backgroundColor: '#eee',
34
- display: 'table-row'
39
+ backgroundColor: '#f7f7f7',
40
+ border: '1px solid #e6e6e6',
41
+ borderRadius: 8,
42
+ overflow: 'hidden'
35
43
  },
36
- panelSummary: {
44
+ panelHeader: {
37
45
  backgroundColor: '#eee',
38
- height: 32
46
+ padding: '4px 8px',
47
+ display: 'flex',
48
+ alignItems: 'center'
39
49
  },
40
- panelDetail: {
41
- backgroundColor: '#fff',
42
- maxHeight: 'calc(90vh - 220px)',
43
- // ROI
44
- overflow: 'auto'
50
+ panelActions: {
51
+ marginLeft: 'auto',
52
+ display: 'flex',
53
+ alignItems: 'center',
54
+ gap: 8
55
+ },
56
+ howToWrap: {
57
+ display: 'inline-flex',
58
+ alignItems: 'center',
59
+ gap: 4
60
+ },
61
+ toggleBtn: {
62
+ padding: 0
45
63
  },
46
64
  table: {
47
65
  width: '100%',
48
66
  overflowWrap: 'anywhere',
49
- fontSize: '14px !important'
67
+ fontSize: '11px !important'
68
+ },
69
+ tableWrap: {
70
+ padding: '3px 6px 5px',
71
+ height: 'auto',
72
+ maxHeight: EXPANDED_HEIGHT,
73
+ overflowY: 'auto',
74
+ overflowX: 'hidden',
75
+ transition: 'max-height 200ms ease'
76
+ },
77
+ tableWrapCollapsed: {
78
+ maxHeight: 0,
79
+ padding: '0 5px',
80
+ overflow: 'hidden'
81
+ },
82
+ tableHeadRow: {
83
+ backgroundColor: '#f5f5f5'
84
+ },
85
+ tableHeadCell: {
86
+ fontWeight: 600,
87
+ color: '#333',
88
+ fontSize: '11px !important'
89
+ },
90
+ tableBodyRow: {
91
+ '&:nth-of-type(even)': {
92
+ backgroundColor: '#fafafa'
93
+ }
50
94
  },
51
95
  td: {
52
96
  wordWrap: 'break-all',
@@ -55,7 +99,7 @@ const styles = () => ({
55
99
  cellSelected: {
56
100
  backgroundColor: '#2196f3',
57
101
  color: '#fff',
58
- fontSize: '14px !important'
102
+ fontSize: '13px !important'
59
103
  },
60
104
  btnRemove: {
61
105
  color: 'red'
@@ -64,7 +108,10 @@ const styles = () => ({
64
108
  color: 'green'
65
109
  },
66
110
  tTxt: {
67
- padding: 5
111
+ padding: '5px 2px',
112
+ lineHeight: 1.2,
113
+ verticalAlign: 'top',
114
+ fontSize: '11px !important'
68
115
  },
69
116
  infoIcon: {
70
117
  width: '15px',
@@ -75,22 +122,22 @@ const styles = () => ({
75
122
  fontSize: '14px !important'
76
123
  },
77
124
  rowRoot: {
78
- border: '1px solid #eee',
79
- height: 36,
80
- lineHeight: '36px',
81
- overflow: 'hidden',
82
- paddingLeft: 24,
125
+ border: '1px solid #e6e6e6',
126
+ borderRadius: 6,
127
+ minHeight: 40,
128
+ lineHeight: 1.4,
129
+ padding: '10px 16px',
83
130
  textAlign: 'left'
84
131
  },
85
132
  rowOdd: {
86
133
  backgroundColor: '#fff',
87
- textOverflow: 'ellipsis',
88
- whiteSpace: 'nowrap'
134
+ textOverflow: 'clip',
135
+ whiteSpace: 'normal'
89
136
  },
90
137
  rowEven: {
91
138
  backgroundColor: '#fafafa',
92
- textOverflow: 'ellipsis',
93
- whiteSpace: 'nowrap'
139
+ textOverflow: 'clip',
140
+ whiteSpace: 'normal'
94
141
  }
95
142
  });
96
143
  const CyclicVoltammetryPanel = ({
@@ -107,6 +154,7 @@ const CyclicVoltammetryPanel = ({
107
154
  jcampIdx,
108
155
  userManualLink
109
156
  }) => {
157
+ const [isExpanded, setIsExpanded] = (0, _react.useState)(false);
110
158
  const {
111
159
  spectraList
112
160
  } = cyclicVotaSt;
@@ -115,6 +163,24 @@ const CyclicVoltammetryPanel = ({
115
163
  if (spectra !== undefined) {
116
164
  list = spectra.list;
117
165
  }
166
+ const formatCurrent = (y, feature, cyclicVotaSt) => {
167
+ const baseY = feature && feature.yUnit ? String(feature.yUnit) : 'A';
168
+ const isMilli = /mA/i.test(baseY);
169
+ const useDensity = cyclicVotaSt && cyclicVotaSt.useCurrentDensity;
170
+ const rawArea = (cyclicVotaSt && cyclicVotaSt.areaValue === '' ? 1.0 : cyclicVotaSt?.areaValue) || 1.0;
171
+ const areaUnit = cyclicVotaSt && cyclicVotaSt.areaUnit ? cyclicVotaSt.areaUnit : 'cm²';
172
+ const safeArea = rawArea > 0 ? rawArea : 1.0;
173
+ let val = y;
174
+ let unit = isMilli ? 'mA' : 'A';
175
+ if (useDensity) {
176
+ val = y / safeArea;
177
+ unit = `${unit}/${areaUnit}`;
178
+ }
179
+ if (isMilli) {
180
+ val *= 1000.0;
181
+ }
182
+ return `${parseFloat(val).toExponential(2)} ${unit}`;
183
+ };
118
184
  const selectCell = (idx, isMax) => {
119
185
  setWorkWithMaxPeakAct({
120
186
  isMax,
@@ -156,9 +222,9 @@ const CyclicVoltammetryPanel = ({
156
222
  };
157
223
  const rows = list.map((o, idx) => ({
158
224
  idx,
159
- max: o.max ? `E: ${_format.default.strNumberFixedLength(parseFloat(o.max.x), 3)} V,\nI: ${parseFloat(o.max.y * 1000).toExponential(2)} mA` : 'nd',
160
- min: o.min ? `E: ${_format.default.strNumberFixedLength(parseFloat(o.min.x), 3)} V,\nI: ${parseFloat(o.min.y * 1000).toExponential(2)} mA` : 'nd',
161
- pecker: o.pecker ? `${parseFloat(o.pecker.y * 1000).toExponential(2)} mA` : 'nd',
225
+ max: o.max ? `E: ${_format.default.strNumberFixedLength(parseFloat(o.max.x), 3)} V,\nI: ${formatCurrent(o.max.y, feature, cyclicVotaSt)}` : 'nd',
226
+ min: o.min ? `E: ${_format.default.strNumberFixedLength(parseFloat(o.min.x), 3)} V,\nI: ${formatCurrent(o.min.y, feature, cyclicVotaSt)}` : 'nd',
227
+ pecker: o.pecker ? `${formatCurrent(o.pecker.y, feature, cyclicVotaSt)}` : 'nd',
162
228
  delta: `${getDelta(o)} mV`,
163
229
  ratio: getRatio(feature, o),
164
230
  e12: typeof o.e12 === 'number' ? `${_format.default.strNumberFixedLength(o.e12, 3)} V` : 'nd',
@@ -171,168 +237,189 @@ const CyclicVoltammetryPanel = ({
171
237
  }),
172
238
  onCheckRefChanged: e => changeCheckRefPeaks(idx, e)
173
239
  }));
174
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Accordion, {
240
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
241
+ className: classes.panel,
175
242
  "data-testid": "PanelVoltammetry",
176
- disableGutters: true,
177
- sx: {
178
- '&.MuiAccordion-root.Mui-expanded': {
179
- margin: 0
243
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
244
+ className: classes.panelHeader,
245
+ role: "button",
246
+ tabIndex: 0,
247
+ onClick: () => setIsExpanded(prev => !prev),
248
+ onKeyDown: event => {
249
+ if (event.key === 'Enter' || event.key === ' ') {
250
+ event.preventDefault();
251
+ setIsExpanded(prev => !prev);
252
+ }
180
253
  },
181
- '&:before': {
182
- display: 'none'
183
- }
184
- },
185
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.AccordionSummary, {
186
- expandIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandMore.default, {}),
187
- className: (0, _classnames.default)(classes.panelSummary),
188
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
254
+ "aria-expanded": isExpanded,
255
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
189
256
  className: "txt-panel-header",
190
257
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
191
258
  className: (0, _classnames.default)(classes.txtBadge, 'txt-sv-panel-title'),
192
259
  children: "Voltammetry data"
193
260
  })
194
- })
195
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Table, {
196
- className: classes.table,
197
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableHead, {
198
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableRow, {
199
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
200
- align: "left",
201
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
202
- children: "Ref"
203
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
204
- align: "left",
205
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
206
- children: "Anodic"
207
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
208
- align: "left",
209
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
210
- children: "Cathodic"
211
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
212
- align: "left",
213
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
214
- children: ["I ", /*#__PURE__*/(0, _jsxRuntime.jsx)("sub", {
215
- children: "\u03BB0"
216
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
217
- title: /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
218
- className: (0, _classnames.default)(classes.txtToolTip),
219
- children: ["Baseline correction value for I ratio ", /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), "(a.k.a y value of pecker)"]
220
- }),
221
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Info.default, {
222
- className: (0, _classnames.default)(classes.infoIcon)
223
- })
261
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
262
+ className: classes.panelActions,
263
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
264
+ title: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
265
+ className: (0, _classnames.default)(classes.txtToolTip),
266
+ children: "Click here to open the User manual document"
267
+ }),
268
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
269
+ className: classes.howToWrap,
270
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
271
+ target: "_blank",
272
+ rel: "noopener noreferrer",
273
+ href: userManualLink,
274
+ children: "How-To"
275
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Help.default, {
276
+ className: (0, _classnames.default)(classes.infoIcon)
224
277
  })]
225
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
226
- align: "left",
227
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
228
- children: ["I ratio", /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
229
- title: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
230
- className: (0, _classnames.default)(classes.txtToolTip),
231
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
232
- children: "Nicholson's method"
233
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
234
- children: "NICHOLSON, Rl S. Semiempirical Procedure for Measuring with Stationary Electrode Polarography Rates of Chemical Reactions Involving the Product of Electron Transfer. Analytical Chemistry, 1966, 38. Jg., Nr. 10, S. 1406-1406. https://doi.org/10.1021/ac60242a030"
235
- })]
236
- }),
237
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Info.default, {
238
- className: (0, _classnames.default)(classes.infoIcon)
278
+ })
279
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
280
+ size: "small",
281
+ className: classes.toggleBtn,
282
+ onClick: event => {
283
+ event.stopPropagation();
284
+ setIsExpanded(prev => !prev);
285
+ },
286
+ "aria-label": isExpanded ? 'Collapse table' : 'Expand table',
287
+ children: isExpanded ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandLess.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandMore.default, {})
288
+ })]
289
+ })]
290
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
291
+ className: (0, _classnames.default)(classes.tableWrap, !isExpanded && classes.tableWrapCollapsed),
292
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Table, {
293
+ className: classes.table,
294
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableHead, {
295
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableRow, {
296
+ className: classes.tableHeadRow,
297
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
298
+ align: "left",
299
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
300
+ children: "Ref"
301
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
302
+ align: "left",
303
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
304
+ children: "Anodic"
305
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
306
+ align: "left",
307
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
308
+ children: "Cathodic"
309
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
310
+ align: "left",
311
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
312
+ children: ["I ", /*#__PURE__*/(0, _jsxRuntime.jsx)("sub", {
313
+ children: "\u03BB0"
314
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
315
+ title: /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
316
+ className: (0, _classnames.default)(classes.txtToolTip),
317
+ children: ["Baseline correction value for I ratio ", /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), "(a.k.a y value of pecker)"]
318
+ }),
319
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Info.default, {
320
+ className: (0, _classnames.default)(classes.infoIcon)
321
+ })
322
+ })]
323
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
324
+ align: "left",
325
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
326
+ children: ["I ratio", /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
327
+ title: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
328
+ className: (0, _classnames.default)(classes.txtToolTip),
329
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
330
+ children: "Nicholson's method"
331
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
332
+ children: "NICHOLSON, Rl S. Semiempirical Procedure for Measuring with Stationary Electrode Polarography Rates of Chemical Reactions Involving the Product of Electron Transfer. Analytical Chemistry, 1966, 38. Jg., Nr. 10, S. 1406-1406. https://doi.org/10.1021/ac60242a030"
333
+ })]
334
+ }),
335
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Info.default, {
336
+ className: (0, _classnames.default)(classes.infoIcon)
337
+ })
338
+ })]
339
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
340
+ align: "left",
341
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
342
+ children: ["E", /*#__PURE__*/(0, _jsxRuntime.jsx)("sub", {
343
+ children: "1/2"
344
+ })]
345
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
346
+ align: "left",
347
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
348
+ children: ["\u0394E", /*#__PURE__*/(0, _jsxRuntime.jsx)("sub", {
349
+ children: "p"
350
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
351
+ title: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
352
+ className: (0, _classnames.default)(classes.txtToolTip),
353
+ children: "| Epa - Epc |"
354
+ }),
355
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Info.default, {
356
+ className: (0, _classnames.default)(classes.infoIcon)
357
+ })
358
+ })]
359
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
360
+ align: "left",
361
+ className: (0, _classnames.default)(classes.tTxt, classes.tableHeadCell, classes.square, 'txt-sv-panel-txt'),
362
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AddCircleOutline.default, {
363
+ onClick: () => addNewPairPeakAct(jcampIdx),
364
+ className: (0, _classnames.default)(classes.btnAddRow)
239
365
  })
240
366
  })]
241
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
242
- align: "left",
243
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
244
- children: ["E", /*#__PURE__*/(0, _jsxRuntime.jsx)("sub", {
245
- children: "1/2"
246
- })]
247
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableCell, {
248
- align: "left",
249
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
250
- children: ["\u0394E", /*#__PURE__*/(0, _jsxRuntime.jsx)("sub", {
251
- children: "p"
252
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
253
- title: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
254
- className: (0, _classnames.default)(classes.txtToolTip),
255
- children: "| Epa - Epc |"
256
- }),
257
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Info.default, {
258
- className: (0, _classnames.default)(classes.infoIcon)
367
+ })
368
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableBody, {
369
+ children: rows.map(row => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableRow, {
370
+ className: classes.tableBodyRow,
371
+ hover: true,
372
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
373
+ align: "left",
374
+ className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
375
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Checkbox, {
376
+ size: "small",
377
+ checked: row.isRef,
378
+ onChange: row.onCheckRefChanged,
379
+ sx: {
380
+ padding: 0
381
+ }
382
+ })
383
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
384
+ align: "left",
385
+ className: (0, _classnames.default)(classes.tTxt, classes.square, spectra.isWorkMaxPeak && spectra.selectedIdx === row.idx ? classes.cellSelected : 'txt-sv-panel-txt'),
386
+ onClick: row.onClickMax,
387
+ children: row.max.split('\n').map((s, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
388
+ children: [s, /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {})]
389
+ }, index))
390
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
391
+ align: "left",
392
+ className: (0, _classnames.default)(classes.tTxt, classes.square, !spectra.isWorkMaxPeak && spectra.selectedIdx === row.idx ? classes.cellSelected : 'txt-sv-panel-txt'),
393
+ onClick: row.onClickMin,
394
+ children: row.min.split('\n').map((s, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
395
+ children: [s, /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {})]
396
+ }, index))
397
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
398
+ align: "left",
399
+ className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
400
+ children: row.pecker
401
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
402
+ align: "left",
403
+ className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
404
+ children: row.ratio
405
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
406
+ align: "left",
407
+ className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
408
+ children: row.e12
409
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
410
+ align: "left",
411
+ className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
412
+ children: row.delta
413
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
414
+ align: "left",
415
+ className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
416
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RemoveCircle.default, {
417
+ className: (0, _classnames.default)(classes.btnRemove),
418
+ onClick: row.remove
259
419
  })
260
420
  })]
261
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
262
- align: "left",
263
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
264
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AddCircleOutline.default, {
265
- onClick: () => addNewPairPeakAct(jcampIdx),
266
- className: (0, _classnames.default)(classes.btnAddRow)
267
- })
268
- })]
269
- })
270
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableBody, {
271
- children: rows.map(row => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableRow, {
272
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
273
- align: "left",
274
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
275
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Checkbox, {
276
- checked: row.isRef,
277
- onChange: row.onCheckRefChanged
278
- })
279
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
280
- align: "left",
281
- className: (0, _classnames.default)(classes.tTxt, classes.square, spectra.isWorkMaxPeak && spectra.selectedIdx === row.idx ? classes.cellSelected : 'txt-sv-panel-txt'),
282
- onClick: row.onClickMax,
283
- children: row.max.split('\n').map((s, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
284
- children: [s, /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {})]
285
- }, index))
286
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
287
- align: "left",
288
- className: (0, _classnames.default)(classes.tTxt, classes.square, !spectra.isWorkMaxPeak && spectra.selectedIdx === row.idx ? classes.cellSelected : 'txt-sv-panel-txt'),
289
- onClick: row.onClickMin,
290
- children: row.min.split('\n').map((s, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
291
- children: [s, /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {})]
292
- }, index))
293
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
294
- align: "left",
295
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
296
- children: row.pecker
297
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
298
- align: "left",
299
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
300
- children: row.ratio
301
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
302
- align: "left",
303
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
304
- children: row.e12
305
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
306
- align: "left",
307
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
308
- children: row.delta
309
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
310
- align: "left",
311
- className: (0, _classnames.default)(classes.tTxt, classes.square, 'txt-sv-panel-txt'),
312
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RemoveCircle.default, {
313
- className: (0, _classnames.default)(classes.btnRemove),
314
- onClick: row.remove
315
- })
316
- })]
317
- }, row.idx))
318
- })]
319
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
320
- className: (0, _classnames.default)(classes.rowRoot, classes.rowEven),
321
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
322
- title: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
323
- className: (0, _classnames.default)(classes.txtToolTip),
324
- children: "Click here to open the User manual document"
325
- }),
326
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
327
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
328
- target: "_blank",
329
- rel: "noopener noreferrer",
330
- href: userManualLink,
331
- children: "How-To "
332
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Help.default, {
333
- className: (0, _classnames.default)(classes.infoIcon)
334
- })]
335
- })
421
+ }, row.idx))
422
+ })]
336
423
  })
337
424
  })]
338
425
  });
@@ -340,7 +427,6 @@ const CyclicVoltammetryPanel = ({
340
427
  const mapStateToProps = (state, props) => (
341
428
  // eslint-disable-line
342
429
  {
343
- layoutSt: state.layout,
344
430
  cyclicVotaSt: state.cyclicvolta,
345
431
  sweepTypeSt: state.ui.sweepType
346
432
  });
@@ -354,11 +440,7 @@ const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({
354
440
  }, dispatch);
355
441
  CyclicVoltammetryPanel.propTypes = {
356
442
  classes: _propTypes.default.object.isRequired,
357
- expand: _propTypes.default.bool.isRequired,
358
443
  feature: _propTypes.default.object.isRequired,
359
- molSvg: _propTypes.default.string.isRequired,
360
- layoutSt: _propTypes.default.string.isRequired,
361
- onExapnd: _propTypes.default.func.isRequired,
362
444
  cyclicVotaSt: _propTypes.default.object.isRequired,
363
445
  addNewPairPeakAct: _propTypes.default.func.isRequired,
364
446
  setWorkWithMaxPeakAct: _propTypes.default.func.isRequired,
@@ -86,7 +86,8 @@ class PanelViewer extends _react.default.Component {
86
86
  curveSt,
87
87
  userManualLink,
88
88
  subLayoutsInfo,
89
- exactMass
89
+ exactMass,
90
+ hideCyclicVolta
90
91
  } = this.props;
91
92
  const onExapndInfo = () => this.onExapnd('info');
92
93
  const onExapndPeak = () => this.onExapnd('peak');
@@ -130,7 +131,7 @@ class PanelViewer extends _react.default.Component {
130
131
  }), _cfg.default.hidePanelCompare(layoutSt) || listCurves.length > 1 ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_compare.default, {
131
132
  expand: expand === 'compare',
132
133
  onExapnd: onExapndCompare
133
- }), _cfg.default.hidePanelCyclicVolta(layoutSt) ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_cyclic_voltamery_data.default, {
134
+ }), _cfg.default.hidePanelCyclicVolta(layoutSt) || hideCyclicVolta ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_cyclic_voltamery_data.default, {
134
135
  jcampIdx: jcampIdx,
135
136
  feature: feature,
136
137
  expand: expand === 'cyclicvolta',
@@ -163,7 +164,8 @@ PanelViewer.propTypes = {
163
164
  userManualLink: _propTypes.default.object,
164
165
  curveSt: _propTypes.default.object.isRequired,
165
166
  subLayoutsInfo: _propTypes.default.object,
166
- exactMass: _propTypes.default.string
167
+ exactMass: _propTypes.default.string,
168
+ hideCyclicVolta: _propTypes.default.bool
167
169
  };
168
170
  var _default = exports.default = (0, _reactRedux.connect)(
169
171
  // eslint-disable-line
@@ -134,7 +134,10 @@ const CYCLIC_VOLTA_METRY = exports.CYCLIC_VOLTA_METRY = {
134
134
  RESETALL: 'RESETALL_VOLTA_METRY',
135
135
  SET_REF: 'VOLTA_METRY_SET_REF',
136
136
  SELECT_REF_PEAK: 'SELECT_REF_PEAK',
137
- SET_FACTOR: 'CYCLIC_VOLTA_METRY_SET_FACTOR'
137
+ SET_FACTOR: 'CYCLIC_VOLTA_METRY_SET_FACTOR',
138
+ SET_AREA_VALUE: 'CYCLIC_VOLTA_METRY_SET_AREA_VALUE',
139
+ SET_AREA_UNIT: 'CYCLIC_VOLTA_METRY_SET_AREA_UNIT',
140
+ TOGGLE_DENSITY: 'CYCLIC_VOLTA_METRY_TOGGLE_DENSITY'
138
141
  };
139
142
  const CURVE = exports.CURVE = {
140
143
  SELECT_WORKING_CURVE: 'SELECT_WORKING_CURVE',
@@ -515,7 +515,10 @@ const buildPeakFeature = (jcamp, layout, peakUp, s, thresRef, upperThres = false
515
515
  upperThres,
516
516
  lowerThres,
517
517
  volammetryData: extractVoltammetryData(jcamp),
518
- scanRate: +info.$CSSCANRATE || 0.1
518
+ scanRate: +info.$CSSCANRATE || 0.1,
519
+ weAreaValue: info.$CSWEAREAVALUE || '',
520
+ weAreaUnit: info.$CSWEAREAUNIT || '',
521
+ currentMode: info.$CSCURRENTMODE || ''
519
522
  }, s);
520
523
  };
521
524
  const maxArray = arr => {
@@ -819,7 +822,7 @@ const extractTemperature = jcamp => {
819
822
  const ExtractJcamp = source => {
820
823
  const jcamp = _jcampconverter.default.convert(source, {
821
824
  xy: true,
822
- keepRecordsRegExp: /(\$CSTHRESHOLD|\$CSSCANAUTOTARGET|\$CSSCANEDITTARGET|\$CSSCANCOUNT|\$CSSOLVENTNAME|\$CSSOLVENTVALUE|\$CSSOLVENTX|\$CSCATEGORY|\$CSITAREA|\$CSITFACTOR|\$OBSERVEDINTEGRALS|\$OBSERVEDMULTIPLETS|\$OBSERVEDMULTIPLETSPEAKS|\.SOLVENTNAME|\.OBSERVEFREQUENCY|\$CSSIMULATIONPEAKS|\$CSUPPERTHRESHOLD|\$CSLOWERTHRESHOLD|\$CSCYCLICVOLTAMMETRYDATA|UNITS|SYMBOL|CSAUTOMETADATA|\$DETECTOR|MN|MW|D|MP|MELTINGPOINT|TG|\$CSSCANRATE|\$CSSPECTRUMDIRECTION)/ // eslint-disable-line
825
+ keepRecordsRegExp: /(\$CSTHRESHOLD|\$CSSCANAUTOTARGET|\$CSSCANEDITTARGET|\$CSSCANCOUNT|\$CSSOLVENTNAME|\$CSSOLVENTVALUE|\$CSSOLVENTX|\$CSCATEGORY|\$CSITAREA|\$CSITFACTOR|\$OBSERVEDINTEGRALS|\$OBSERVEDMULTIPLETS|\$OBSERVEDMULTIPLETSPEAKS|\.SOLVENTNAME|\.OBSERVEFREQUENCY|\$CSSIMULATIONPEAKS|\$CSUPPERTHRESHOLD|\$CSLOWERTHRESHOLD|\$CSCYCLICVOLTAMMETRYDATA|UNITS|SYMBOL|\$CSAUTOMETADATA|\$DETECTOR|MN|MW|D|MP|MELTINGPOINT|TG|\$CSSCANRATE|\$CSSPECTRUMDIRECTION|\$CSWEAREAVALUE|\$CSWEAREAUNIT|\$CSCURRENTMODE)/ // eslint-disable-line
823
826
  });
824
827
  const layout = readLayout(jcamp);
825
828
  const peakUp = !_format.default.isIrLayout(layout);
@@ -45,22 +45,23 @@ const tpStyle = () => {
45
45
  const style = stBorder + stBorderRadius + stBackground + stColor + stPadding + stOpacity + stPadding + stZindex + stFontFamily;
46
46
  return style;
47
47
  };
48
- const tpDiv = (d, digits) => `
48
+ const tpDiv = (d, digits, yFactor = 1) => `
49
49
  <div
50
50
  class="peak-tp"
51
51
  style="${tpStyle()}"
52
52
  >
53
53
  <span> x: ${_format.default.fixDigit(d.x, digits)}</span>
54
54
  <br/>
55
- <span> y: ${d3.format('.2~e')(d.y)}</span>
55
+ <span> y: ${d3.format('.2~e')(d.y * (yFactor || 1))}</span>
56
56
  <div>
57
57
  `;
58
58
  const InitTip = () => {
59
59
  d3.select('.peak-tp').remove();
60
60
  const tip = (0, _d3Tip.default)().attr('class', 'd3-tip').html(({
61
61
  d,
62
- layout
63
- }) => tpDiv(d, _format.default.spectraDigit(layout)));
62
+ layout,
63
+ yFactor
64
+ }) => tpDiv(d, _format.default.spectraDigit(layout), yFactor || 1));
64
65
  return tip;
65
66
  };
66
67
  exports.InitTip = InitTip;