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

package/dist/components/panel/graph_selection.js

@@ -1,12 +1,10 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
@@ -18,95 +16,114 @@ var _Typography = _interopRequireDefault(require("@material-ui/core/Typography")
 var _styles = require("@material-ui/core/styles");
 var _core = require("@material-ui/core");
 var _curve = require("../../actions/curve");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var _list_layout = require("../../constants/list_layout");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+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 react/function-component-definition, function-paren-newline,
 react/require-default-props, react/no-unused-prop-types */
 
-var styles = function styles() {
-  return {
-    panelSummary: {
-      backgroundColor: '#eee',
-      height: 22
-    },
-    curve: {
-      width: '100%'
-    },
-    line: {
-      height: '2px',
-      borderWidth: '0',
-      margin: '0'
-    },
-    curveDefault: {
-      backgroundColor: '#fff',
-      fontSize: '0.8em',
-      margin: '0',
-      padding: '10px 2px 2px 10px'
-    },
-    curveSelected: {
-      backgroundColor: '#2196f3',
-      fontSize: '0.8em',
-      color: '#fff',
-      padding: '10px 2px 2px 10px'
-    }
-  };
-};
-var GraphSelectionPanel = function GraphSelectionPanel(_ref) {
-  var classes = _ref.classes,
-    curveSt = _ref.curveSt,
-    selectCurveAct = _ref.selectCurveAct,
-    entityFileNames = _ref.entityFileNames,
-    subLayoutsInfo = _ref.subLayoutsInfo;
-  var subLayoutValues = [];
+const styles = () => ({
+  panelSummary: {
+    backgroundColor: '#eee',
+    height: 22
+  },
+  curve: {
+    width: '100%'
+  },
+  line: {
+    height: '2px',
+    borderWidth: '0',
+    margin: '0'
+  },
+  curveDefault: {
+    backgroundColor: '#fff',
+    fontSize: '0.8em',
+    margin: '0',
+    padding: '10px 2px 2px 10px',
+    maxWidth: '95%',
+    overflowWrap: 'anywhere'
+  },
+  curveSelected: {
+    backgroundColor: '#2196f3',
+    fontSize: '0.8em',
+    color: '#fff',
+    padding: '10px 2px 2px 10px',
+    maxWidth: '95%',
+    overflowWrap: 'anywhere'
+  }
+});
+const GraphSelectionPanel = _ref => {
+  let {
+    classes,
+    curveSt,
+    entityFileNames,
+    subLayoutsInfo,
+    layoutSt,
+    selectCurveAct,
+    toggleShowAllCurveAct
+  } = _ref;
+  let subLayoutValues = [];
   if (subLayoutsInfo !== undefined && subLayoutsInfo !== null) {
     subLayoutValues = Object.keys(subLayoutsInfo);
   }
-  var _useState = (0, _react.useState)(subLayoutValues[0]),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    selectedSubLayout = _useState2[0],
-    setSelectedSublayout = _useState2[1];
+  const [selectedSubLayout, setSelectedSublayout] = (0, _react.useState)(subLayoutValues[0]);
   if (!curveSt) {
     return /*#__PURE__*/_react.default.createElement("span", null);
   }
-  var curveIdx = curveSt.curveIdx,
-    listCurves = curveSt.listCurves;
+  const {
+    curveIdx,
+    listCurves,
+    isShowAllCurve
+  } = curveSt;
   if (!listCurves) {
     return /*#__PURE__*/_react.default.createElement("span", null);
   }
-  var onChange = function onChange(idx) {
+  const onChange = idx => {
     selectCurveAct(idx);
   };
-  var onChangeTabSubLayout = function onChangeTabSubLayout(event, newValue) {
+  const onChangeTabSubLayout = (event, newValue) => {
     setSelectedSublayout(newValue);
   };
-  var itemsSubLayout = [];
+  const onChangeSwitch = event => {
+    toggleShowAllCurveAct(event.target.checked);
+  };
+  let itemsSubLayout = [];
   if (selectedSubLayout && subLayoutValues.length > 1) {
-    var subLayout = subLayoutsInfo[selectedSubLayout];
-    itemsSubLayout = subLayout.map(function (spectra, idx) {
-      var color = spectra.color;
-      var filename = '';
-      if (entityFileNames && curveIdx < entityFileNames.length) {
-        filename = entityFileNames[curveIdx];
-      }
-      return {
-        name: "".concat(idx + 1, "."),
-        idx: curveIdx,
-        color: color,
-        filename: filename
-      };
-    });
+    const subLayout = subLayoutsInfo[selectedSubLayout];
+    try {
+      itemsSubLayout = subLayout.map((spectra, idx) => {
+        const spectraIdx = spectra.curveIdx;
+        const {
+          color
+        } = spectra;
+        let filename = '';
+        if (entityFileNames && spectraIdx < entityFileNames.length) {
+          filename = entityFileNames[spectraIdx];
+        }
+        return {
+          name: `${idx + 1}.`,
+          idx: spectraIdx,
+          color,
+          filename
+        };
+      });
+    } catch (e) {
+      console.log(e);
+    }
   }
-  var items = listCurves.map(function (spectra, idx) {
-    var color = spectra.color;
-    var filename = '';
+  const items = listCurves.map((spectra, idx) => {
+    const {
+      color
+    } = spectra;
+    let filename = '';
     if (entityFileNames && idx < entityFileNames.length) {
       filename = entityFileNames[idx];
     }
     return {
-      name: "".concat(idx + 1, "."),
-      idx: idx,
-      color: color,
-      filename: filename
+      name: `${idx + 1}.`,
+      idx,
+      color,
+      filename
     };
   });
   return /*#__PURE__*/_react.default.createElement(_core.Accordion, {
@@ -118,11 +135,17 @@ var GraphSelectionPanel = function GraphSelectionPanel(_ref) {
     className: "txt-panel-header"
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _classnames.default)(classes.txtBadge, 'txt-sv-panel-title')
-  }, "Graph selection"))), /*#__PURE__*/_react.default.createElement(_Divider.default, null), subLayoutValues && subLayoutValues.length > 1 ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_core.Tabs, {
+  }, "Graph selection"))), /*#__PURE__*/_react.default.createElement(_Divider.default, null), layoutSt === _list_layout.LIST_LAYOUT.AIF ? /*#__PURE__*/_react.default.createElement(_core.FormControlLabel, {
+    control: /*#__PURE__*/_react.default.createElement(_core.Switch, {
+      checked: isShowAllCurve,
+      onChange: onChangeSwitch
+    }),
+    label: "Show all curves"
+  }) : null, subLayoutValues && subLayoutValues.length > 1 ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_core.Tabs, {
     value: selectedSubLayout,
     onChange: onChangeTabSubLayout
-  }, subLayoutValues.map(function (subLayout, i) {
-    var subLayoutName = '';
+  }, subLayoutValues.map((subLayout, i) => {
+    let subLayoutName = '';
     switch (subLayout) {
       case 'G/MOL':
         subLayoutName = 'MWD';
@@ -138,65 +161,53 @@ var GraphSelectionPanel = function GraphSelectionPanel(_ref) {
       value: subLayout,
       label: subLayoutName
     });
-  })), /*#__PURE__*/_react.default.createElement(_core.List, null, itemsSubLayout.map(function (item) {
-    return /*#__PURE__*/_react.default.createElement(_core.ListItem, {
-      key: item.idx,
-      onClick: function onClick() {
-        return onChange(item.idx);
-      },
-      className: (0, _classnames.default)(item.idx === curveIdx ? classes.curveSelected : classes.curveDefault) // eslint-disable-line
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)(classes.curve)
-    }, /*#__PURE__*/_react.default.createElement("i", null, item.name), /*#__PURE__*/_react.default.createElement("span", {
-      style: {
-        float: 'right',
-        width: '95%'
-      }
-    }, /*#__PURE__*/_react.default.createElement("hr", {
-      className: (0, _classnames.default)(classes.line),
-      style: {
-        backgroundColor: item.color
-      }
-    }), item.filename !== '' ? /*#__PURE__*/_react.default.createElement("span", null, "File: ", item.filename) : null // eslint-disable-line
-    )));
-  }))) : /*#__PURE__*/_react.default.createElement(_core.List, null, items.map(function (item) {
-    return /*#__PURE__*/_react.default.createElement(_core.ListItem, {
-      key: item.idx,
-      onClick: function onClick() {
-        return onChange(item.idx);
-      },
-      className: (0, _classnames.default)(item.idx === curveIdx ? classes.curveSelected : classes.curveDefault) // eslint-disable-line
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      className: (0, _classnames.default)(classes.curve)
-    }, /*#__PURE__*/_react.default.createElement("i", null, item.name), /*#__PURE__*/_react.default.createElement("span", {
-      style: {
-        float: 'right',
-        width: '95%'
-      }
-    }, /*#__PURE__*/_react.default.createElement("hr", {
-      className: (0, _classnames.default)(classes.line),
-      style: {
-        backgroundColor: item.color
-      }
-    }), item.filename !== '' ? /*#__PURE__*/_react.default.createElement("span", null, "File: ", item.filename) : null // eslint-disable-line
-    )));
-  })));
-};
-
-var mapStateToProps = function mapStateToProps(state, props) {
-  return (
-    // eslint-disable-line
-    {
-      layoutSt: state.layout,
-      curveSt: state.curve
+  })), /*#__PURE__*/_react.default.createElement(_core.List, null, itemsSubLayout.map(item => /*#__PURE__*/_react.default.createElement(_core.ListItem, {
+    key: item.idx,
+    onClick: () => onChange(item.idx),
+    className: (0, _classnames.default)(item.idx === curveIdx ? classes.curveSelected : classes.curveDefault) // eslint-disable-line
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _classnames.default)(classes.curve)
+  }, /*#__PURE__*/_react.default.createElement("i", null, item.name), /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      float: 'right',
+      width: '95%'
     }
-  );
-};
-var mapDispatchToProps = function mapDispatchToProps(dispatch) {
-  return (0, _redux.bindActionCreators)({
-    selectCurveAct: _curve.selectCurve
-  }, dispatch);
+  }, /*#__PURE__*/_react.default.createElement("hr", {
+    className: (0, _classnames.default)(classes.line),
+    style: {
+      backgroundColor: item.color
+    }
+  }), item.filename !== '' ? /*#__PURE__*/_react.default.createElement("span", null, "File: ", item.filename) : null // eslint-disable-line
+  )))))) : /*#__PURE__*/_react.default.createElement(_core.List, null, items.map(item => /*#__PURE__*/_react.default.createElement(_core.ListItem, {
+    key: item.idx,
+    onClick: () => onChange(item.idx),
+    className: (0, _classnames.default)(item.idx === curveIdx ? classes.curveSelected : classes.curveDefault) // eslint-disable-line
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _classnames.default)(classes.curve)
+  }, /*#__PURE__*/_react.default.createElement("i", null, item.name), /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      float: 'right',
+      width: '95%'
+    }
+  }, /*#__PURE__*/_react.default.createElement("hr", {
+    className: (0, _classnames.default)(classes.line),
+    style: {
+      backgroundColor: item.color
+    }
+  }), item.filename !== '' ? /*#__PURE__*/_react.default.createElement("span", null, "File: ", item.filename) : null // eslint-disable-line
+  ))))));
 };
+
+const mapStateToProps = (state, props) => (
+// eslint-disable-line
+{
+  layoutSt: state.layout,
+  curveSt: state.curve
+});
+const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({
+  selectCurveAct: _curve.selectCurve,
+  toggleShowAllCurveAct: _curve.toggleShowAllCurves
+}, dispatch);
 GraphSelectionPanel.propTypes = {
   classes: _propTypes.default.object.isRequired,
   expand: _propTypes.default.bool.isRequired,
@@ -205,7 +216,7 @@ GraphSelectionPanel.propTypes = {
   curveSt: _propTypes.default.object.isRequired,
   selectCurveAct: _propTypes.default.func.isRequired,
   entityFileNames: _propTypes.default.array.isRequired,
-  subLayoutsInfo: _propTypes.default.array
+  subLayoutsInfo: _propTypes.default.array,
+  toggleShowAllCurveAct: _propTypes.default.func.isRequired
 };
-var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)((0, _styles.withStyles)(styles)(GraphSelectionPanel));
-exports.default = _default;
+var _default = exports.default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)((0, _styles.withStyles)(styles)(GraphSelectionPanel));

package/dist/components/panel/index.js

@@ -5,12 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
@@ -24,149 +18,124 @@ var _multiplicity = _interopRequireDefault(require("./multiplicity"));
 var _cyclic_voltamery_data = _interopRequireDefault(require("./cyclic_voltamery_data"));
 var _graph_selection = _interopRequireDefault(require("./graph_selection"));
 var _cfg = _interopRequireDefault(require("../../helpers/cfg"));
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /* eslint-disable react/prop-types, react/require-default-props */
-var theme = (0, _styles.createMuiTheme)({
+/* eslint-disable react/prop-types, react/require-default-props */
+
+const theme = (0, _styles.createTheme)({
   typography: {
     useNextVariants: true
   }
 });
-var styles = function styles() {
-  return {
-    panels: {
-      maxHeight: 'calc(90vh - 220px)',
-      // ROI
-      display: 'table',
-      overflowX: 'hidden',
-      overflowY: 'auto',
-      margin: '5px 0 0 0',
-      padding: '0 0 0 0',
-      width: '100%'
-    }
-  };
-};
-var PanelViewer = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(PanelViewer, _React$Component);
-  var _super = _createSuper(PanelViewer);
-  function PanelViewer(props) {
-    var _this;
-    (0, _classCallCheck2.default)(this, PanelViewer);
-    _this = _super.call(this, props);
-    _this.state = {
+const styles = () => ({
+  panels: {
+    maxHeight: 'calc(90vh - 220px)',
+    // ROI
+    display: 'table',
+    overflowX: 'hidden',
+    overflowY: 'auto',
+    margin: '5px 0 0 0',
+    padding: '0 0 0 0',
+    width: '100%'
+  }
+});
+class PanelViewer extends _react.default.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
       expand: 'info'
     };
-    _this.onExapnd = _this.onExapnd.bind((0, _assertThisInitialized2.default)(_this));
-    _this.handleDescriptionChanged = _this.handleDescriptionChanged.bind((0, _assertThisInitialized2.default)(_this));
-    return _this;
+    this.onExapnd = this.onExapnd.bind(this);
+    this.handleDescriptionChanged = this.handleDescriptionChanged.bind(this);
   }
-  (0, _createClass2.default)(PanelViewer, [{
-    key: "handleDescriptionChanged",
-    value: function handleDescriptionChanged(content, delta, source, editor) {
-      if (source === 'user') {
-        var contentChanged = editor.getContents();
-        this.props.onDescriptionChanged(contentChanged); // eslint-disable-line
-      }
-    }
-  }, {
-    key: "onExapnd",
-    value: function onExapnd(input) {
-      var expand = this.state.expand;
-      var nextExpand = input === expand ? '' : input;
-      this.setState({
-        expand: nextExpand
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      var expand = this.state.expand;
-      var _this$props = this.props,
-        classes = _this$props.classes,
-        feature = _this$props.feature,
-        integration = _this$props.integration,
-        editorOnly = _this$props.editorOnly,
-        molSvg = _this$props.molSvg,
-        descriptions = _this$props.descriptions,
-        layoutSt = _this$props.layoutSt,
-        canChangeDescription = _this$props.canChangeDescription,
-        jcampIdx = _this$props.jcampIdx,
-        entityFileNames = _this$props.entityFileNames,
-        curveSt = _this$props.curveSt,
-        userManualLink = _this$props.userManualLink,
-        subLayoutsInfo = _this$props.subLayoutsInfo;
-      var onExapndInfo = function onExapndInfo() {
-        return _this2.onExapnd('info');
-      };
-      var onExapndPeak = function onExapndPeak() {
-        return _this2.onExapnd('peak');
-      };
-      var onExapndMpy = function onExapndMpy() {
-        return _this2.onExapnd('mpy');
-      };
-      var onExapndCompare = function onExapndCompare() {
-        return _this2.onExapnd('compare');
-      };
-      var onExapndCyclicVolta = function onExapndCyclicVolta() {
-        return _this2.onExapnd('cyclicvolta');
-      };
-      var onExapndGraphSelection = function onExapndGraphSelection() {
-        return _this2.onExapnd('graph');
-      };
-      var listCurves = curveSt.listCurves;
-      var hideGraphSelection = listCurves === false || listCurves === undefined;
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)(classes.panels)
-      }, /*#__PURE__*/_react.default.createElement(_styles.MuiThemeProvider, {
-        theme: theme
-      }, hideGraphSelection ? null : /*#__PURE__*/_react.default.createElement(_graph_selection.default, {
-        jcampIdx: jcampIdx,
-        entityFileNames: entityFileNames,
-        expand: expand === 'graph',
-        onExapnd: onExapndGraphSelection,
-        subLayoutsInfo: subLayoutsInfo
-      }), /*#__PURE__*/_react.default.createElement(_info.default, {
-        feature: feature,
-        integration: integration,
-        editorOnly: editorOnly,
-        expand: expand === 'info',
-        molSvg: molSvg,
-        onExapnd: onExapndInfo,
-        descriptions: descriptions,
-        canChangeDescription: canChangeDescription,
-        onDescriptionChanged: this.handleDescriptionChanged
-      }), _cfg.default.hidePanelPeak(layoutSt) ? null : /*#__PURE__*/_react.default.createElement(_peaks.default, {
-        expand: expand === 'peak',
-        onExapnd: onExapndPeak
-      }), _cfg.default.hidePanelMpy(layoutSt) ? null : /*#__PURE__*/_react.default.createElement(_multiplicity.default, {
-        expand: expand === 'mpy',
-        onExapnd: onExapndMpy
-      }), _cfg.default.hidePanelCompare(layoutSt) || listCurves.length > 1 ? null : /*#__PURE__*/_react.default.createElement(_compare.default, {
-        expand: expand === 'compare',
-        onExapnd: onExapndCompare
-      }), _cfg.default.hidePanelCyclicVolta(layoutSt) ? null : /*#__PURE__*/_react.default.createElement(_cyclic_voltamery_data.default, {
-        jcampIdx: jcampIdx,
-        feature: feature,
-        expand: expand === 'cyclicvolta',
-        onExapnd: onExapndCyclicVolta,
-        userManualLink: userManualLink ? userManualLink.cv : undefined
-      })));
-    }
-  }]);
-  return PanelViewer;
-}(_react.default.Component);
-var mapStateToProps = function mapStateToProps(state, _) {
-  return (
-    // eslint-disable-line
-    {
-      layoutSt: state.layout,
-      curveSt: state.curve
+  handleDescriptionChanged(content, delta, source, editor) {
+    if (source === 'user') {
+      const contentChanged = editor.getContents();
+      this.props.onDescriptionChanged(contentChanged); // eslint-disable-line
     }
-  );
-};
-var mapDispatchToProps = function mapDispatchToProps(dispatch) {
-  return (0, _redux.bindActionCreators)({}, dispatch);
-};
+  }
+
+  onExapnd(input) {
+    const {
+      expand
+    } = this.state;
+    const nextExpand = input === expand ? '' : input;
+    this.setState({
+      expand: nextExpand
+    });
+  }
+  render() {
+    const {
+      expand
+    } = this.state;
+    const {
+      classes,
+      feature,
+      integration,
+      editorOnly,
+      molSvg,
+      descriptions,
+      layoutSt,
+      canChangeDescription,
+      jcampIdx,
+      entityFileNames,
+      curveSt,
+      userManualLink,
+      subLayoutsInfo
+    } = this.props;
+    const onExapndInfo = () => this.onExapnd('info');
+    const onExapndPeak = () => this.onExapnd('peak');
+    const onExapndMpy = () => this.onExapnd('mpy');
+    const onExapndCompare = () => this.onExapnd('compare');
+    const onExapndCyclicVolta = () => this.onExapnd('cyclicvolta');
+    const onExapndGraphSelection = () => this.onExapnd('graph');
+    const {
+      listCurves
+    } = curveSt;
+    const hideGraphSelection = listCurves === false || listCurves === undefined;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)(classes.panels)
+    }, /*#__PURE__*/_react.default.createElement(_styles.MuiThemeProvider, {
+      theme: theme
+    }, hideGraphSelection ? null : /*#__PURE__*/_react.default.createElement(_graph_selection.default, {
+      jcampIdx: jcampIdx,
+      entityFileNames: entityFileNames,
+      expand: expand === 'graph',
+      onExapnd: onExapndGraphSelection,
+      subLayoutsInfo: subLayoutsInfo
+    }), /*#__PURE__*/_react.default.createElement(_info.default, {
+      feature: feature,
+      integration: integration,
+      editorOnly: editorOnly,
+      expand: expand === 'info',
+      molSvg: molSvg,
+      onExapnd: onExapndInfo,
+      descriptions: descriptions,
+      canChangeDescription: canChangeDescription,
+      onDescriptionChanged: this.handleDescriptionChanged
+    }), _cfg.default.hidePanelPeak(layoutSt) ? null : /*#__PURE__*/_react.default.createElement(_peaks.default, {
+      expand: expand === 'peak',
+      onExapnd: onExapndPeak
+    }), _cfg.default.hidePanelMpy(layoutSt) ? null : /*#__PURE__*/_react.default.createElement(_multiplicity.default, {
+      expand: expand === 'mpy',
+      onExapnd: onExapndMpy
+    }), _cfg.default.hidePanelCompare(layoutSt) || listCurves.length > 1 ? null : /*#__PURE__*/_react.default.createElement(_compare.default, {
+      expand: expand === 'compare',
+      onExapnd: onExapndCompare
+    }), _cfg.default.hidePanelCyclicVolta(layoutSt) ? null : /*#__PURE__*/_react.default.createElement(_cyclic_voltamery_data.default, {
+      jcampIdx: jcampIdx,
+      feature: feature,
+      expand: expand === 'cyclicvolta',
+      onExapnd: onExapndCyclicVolta,
+      userManualLink: userManualLink ? userManualLink.cv : undefined
+    })));
+  }
+}
+const mapStateToProps = (state, _) => (
+// eslint-disable-line
+{
+  layoutSt: state.layout,
+  curveSt: state.curve
+});
+const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({}, dispatch);
 PanelViewer.propTypes = {
   classes: _propTypes.default.object.isRequired,
   feature: _propTypes.default.object.isRequired,
@@ -182,7 +151,6 @@ PanelViewer.propTypes = {
   curveSt: _propTypes.default.object.isRequired,
   subLayoutsInfo: _propTypes.default.object
 };
-var _default = (0, _reactRedux.connect)(
+var _default = exports.default = (0, _reactRedux.connect)(
 // eslint-disable-line
-mapStateToProps, mapDispatchToProps)((0, _styles.withStyles)(styles)(PanelViewer)); // eslint-disable-line
-exports.default = _default;
+mapStateToProps, mapDispatchToProps)((0, _styles.withStyles)(styles)(PanelViewer)); // eslint-disable-line