@jbrowse/core 1.5.2 → 1.5.6

package/BaseFeatureWidget/BaseFeatureDetail.d.ts

@@ -4,19 +4,21 @@ import { BaseCardProps, BaseProps } from './types';
 import { SimpleFeatureSerialized } from '../util/simpleFeature';
 export declare const useStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"expandIcon" | "expansionPanelDetails" | "field" | "fieldDescription" | "fieldName" | "fieldValue" | "fieldSubvalue">;
 export declare function BaseCard({ children, title, defaultExpanded, }: BaseCardProps): JSX.Element;
-export declare const FieldName: ({ description, name, prefix, }: {
+export declare const FieldName: ({ description, name, prefix, width, }: {
     description?: React.ReactNode;
     name: string;
     prefix?: string[] | undefined;
+    width?: number | undefined;
 }) => JSX.Element;
 export declare const BasicValue: ({ value }: {
     value: string | React.ReactNode;
 }) => JSX.Element;
-export declare const SimpleValue: ({ name, value, description, prefix, }: {
+export declare const SimpleValue: ({ name, value, description, prefix, width, }: {
     description?: React.ReactNode;
     name: string;
     value: any;
     prefix?: string[] | undefined;
+    width?: number | undefined;
 }) => JSX.Element | null;
 export declare const BaseCoreDetails: (props: BaseProps) => JSX.Element;
 interface AttributeProps {

package/BaseFeatureWidget/BaseFeatureDetail.js

@@ -1,25 +1,23 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("/home/ubuntu/jbrowse-components/node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"];
 
-var _typeof = require("@babel/runtime/helpers/typeof");
+var _interopRequireWildcard = require("/home/ubuntu/jbrowse-components/node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"];
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.BaseAttributes = exports.Attributes = void 0;
 exports.BaseCard = BaseCard;
-exports.useStyles = exports.default = exports.SimpleValue = exports.FieldName = exports.FeatureDetails = exports.BasicValue = exports.BaseCoreDetails = void 0;
+exports.useStyles = exports["default"] = exports.SimpleValue = exports.FieldName = exports.FeatureDetails = exports.BasicValue = exports.BaseCoreDetails = void 0;
 
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("/home/ubuntu/jbrowse-components/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js"));
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectSpread2 = _interopRequireDefault(require("/home/ubuntu/jbrowse-components/node_modules/@babel/runtime/helpers/esm/objectSpread2.js"));
 
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _toConsumableArray2 = _interopRequireDefault(require("/home/ubuntu/jbrowse-components/node_modules/@babel/runtime/helpers/esm/toConsumableArray.js"));
 
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _slicedToArray2 = _interopRequireDefault(require("/home/ubuntu/jbrowse-components/node_modules/@babel/runtime/helpers/esm/slicedToArray.js"));
 
 var _react = _interopRequireWildcard(require("react"));
 
@@ -50,16 +48,8 @@ var _SequenceFeatureDetails = _interopRequireDefault(require("./SequenceFeatureD
 var _util2 = require("./util");
 
 var _excluded = ["id"];
+var MAX_FIELD_NAME_WIDTH = 170; // these are always omitted as too detailed
 
-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; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-// these are always omitted as too detailed
 var globalOmit = ['length', 'position', 'subfeatures', 'uniqueId', 'exonFrames', 'parentId', 'thickStart', 'thickEnd']; // coreDetails are omitted in some circumstances
 
 var coreDetails = ['name', 'start', 'end', 'strand', 'refName', 'description', 'type'];
@@ -84,7 +74,6 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
     fieldName: {
       wordBreak: 'break-all',
       minWidth: '90px',
-      maxWidth: '150px',
       borderBottom: '1px solid #0003',
       background: theme.palette.grey[200],
       marginRight: theme.spacing(1),
@@ -117,11 +106,11 @@ function BaseCard(_ref) {
   var classes = useStyles();
 
   var _useState = (0, _react.useState)(defaultExpanded),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
       expanded = _useState2[0],
       setExpanded = _useState2[1];
 
-  return /*#__PURE__*/_react.default.createElement(_core.Accordion, {
+  return /*#__PURE__*/_react["default"].createElement(_core.Accordion, {
     expanded: expanded,
     onChange: function onChange() {
       return setExpanded(function (s) {
@@ -131,13 +120,13 @@ function BaseCard(_ref) {
     TransitionProps: {
       unmountOnExit: true
     }
-  }, /*#__PURE__*/_react.default.createElement(_core.AccordionSummary, {
-    expandIcon: /*#__PURE__*/_react.default.createElement(_ExpandMore.default, {
+  }, /*#__PURE__*/_react["default"].createElement(_core.AccordionSummary, {
+    expandIcon: /*#__PURE__*/_react["default"].createElement(_ExpandMore["default"], {
       className: classes.expandIcon
     })
-  }, /*#__PURE__*/_react.default.createElement(_core.Typography, {
+  }, /*#__PURE__*/_react["default"].createElement(_core.Typography, {
     variant: "button"
-  }, " ", title)), /*#__PURE__*/_react.default.createElement(_core.AccordionDetails, {
+  }, " ", title)), /*#__PURE__*/_react["default"].createElement(_core.AccordionDetails, {
     className: classes.expansionPanelDetails
   }, children));
 }
@@ -146,16 +135,20 @@ var FieldName = function FieldName(_ref2) {
   var description = _ref2.description,
       name = _ref2.name,
       _ref2$prefix = _ref2.prefix,
-      prefix = _ref2$prefix === void 0 ? [] : _ref2$prefix;
+      prefix = _ref2$prefix === void 0 ? [] : _ref2$prefix,
+      width = _ref2.width;
   var classes = useStyles();
-  var val = [].concat((0, _toConsumableArray2.default)(prefix), [name]).join('.');
-  return description ? /*#__PURE__*/_react.default.createElement(_core.Tooltip, {
+  var val = [].concat((0, _toConsumableArray2["default"])(prefix), [name]).join('.');
+  return description ? /*#__PURE__*/_react["default"].createElement(_core.Tooltip, {
     title: description,
     placement: "left"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _clsx.default)(classes.fieldDescription, classes.fieldName)
-  }, val)) : /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.fieldName
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _clsx["default"])(classes.fieldDescription, classes.fieldName)
+  }, val)) : /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.fieldName,
+    style: {
+      width: width
+    }
   }, val);
 };
 
@@ -164,10 +157,10 @@ exports.FieldName = FieldName;
 var BasicValue = function BasicValue(_ref3) {
   var value = _ref3.value;
   var classes = useStyles();
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.fieldValue
-  }, /*#__PURE__*/_react.default.isValidElement(value) ? value : /*#__PURE__*/_react.default.createElement(_SanitizedHTML.default, {
-    html: (0, _isObject.default)(value) ? JSON.stringify(value) : String(value)
+  }, /*#__PURE__*/_react["default"].isValidElement(value) ? value : /*#__PURE__*/_react["default"].createElement(_SanitizedHTML["default"], {
+    html: (0, _isObject["default"])(value) ? JSON.stringify(value) : String(value)
   }));
 };
 
@@ -177,15 +170,17 @@ var SimpleValue = function SimpleValue(_ref4) {
   var name = _ref4.name,
       value = _ref4.value,
       description = _ref4.description,
-      prefix = _ref4.prefix;
+      prefix = _ref4.prefix,
+      width = _ref4.width;
   var classes = useStyles();
-  return value !== null && value !== undefined ? /*#__PURE__*/_react.default.createElement("div", {
+  return value !== null && value !== undefined ? /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.field
-  }, /*#__PURE__*/_react.default.createElement(FieldName, {
+  }, /*#__PURE__*/_react["default"].createElement(FieldName, {
     prefix: prefix,
     description: description,
-    name: name
-  }), /*#__PURE__*/_react.default.createElement(BasicValue, {
+    name: name,
+    width: width
+  }), /*#__PURE__*/_react["default"].createElement(BasicValue, {
     value: value
   })) : null;
 };
@@ -199,36 +194,36 @@ var ArrayValue = function ArrayValue(_ref5) {
       _ref5$prefix = _ref5.prefix,
       prefix = _ref5$prefix === void 0 ? [] : _ref5$prefix;
   var classes = useStyles();
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, value.length === 1 ? (0, _isObject.default)(value[0]) ? /*#__PURE__*/_react.default.createElement(Attributes, {
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, value.length === 1 ? (0, _isObject["default"])(value[0]) ? /*#__PURE__*/_react["default"].createElement(Attributes, {
     attributes: value[0],
-    prefix: [].concat((0, _toConsumableArray2.default)(prefix), [name])
-  }) : /*#__PURE__*/_react.default.createElement("div", {
+    prefix: [].concat((0, _toConsumableArray2["default"])(prefix), [name])
+  }) : /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.field
-  }, /*#__PURE__*/_react.default.createElement(FieldName, {
+  }, /*#__PURE__*/_react["default"].createElement(FieldName, {
     prefix: prefix,
     description: description,
     name: name
-  }), /*#__PURE__*/_react.default.createElement(BasicValue, {
+  }), /*#__PURE__*/_react["default"].createElement(BasicValue, {
     value: value[0]
   })) : value.every(function (val) {
-    return (0, _isObject.default)(val);
+    return (0, _isObject["default"])(val);
   }) ? value.map(function (val, i) {
-    return /*#__PURE__*/_react.default.createElement(Attributes, {
+    return /*#__PURE__*/_react["default"].createElement(Attributes, {
       key: JSON.stringify(val) + '-' + i,
       attributes: val,
-      prefix: [].concat((0, _toConsumableArray2.default)(prefix), [name + '-' + i])
+      prefix: [].concat((0, _toConsumableArray2["default"])(prefix), [name + '-' + i])
     });
-  }) : /*#__PURE__*/_react.default.createElement("div", {
+  }) : /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.field
-  }, /*#__PURE__*/_react.default.createElement(FieldName, {
+  }, /*#__PURE__*/_react["default"].createElement(FieldName, {
     prefix: prefix,
     description: description,
     name: name
   }), value.map(function (val, i) {
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/_react["default"].createElement("div", {
       key: JSON.stringify(val) + '-' + i,
       className: classes.fieldSubvalue
-    }, /*#__PURE__*/_react.default.createElement(BasicValue, {
+    }, /*#__PURE__*/_react["default"].createElement(BasicValue, {
       value: val
     }));
   })));
@@ -250,26 +245,24 @@ function CoreDetails(props) {
   var displayStart = (start + 1).toLocaleString('en-US');
   var displayEnd = end.toLocaleString('en-US');
   var displayRef = refName ? "".concat(refName, ":") : '';
-
-  var displayedDetails = _objectSpread(_objectSpread({}, feature), {}, {
+  var displayedDetails = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, feature), {}, {
     length: (end - start).toLocaleString('en-US'),
     position: "".concat(displayRef).concat(displayStart, "..").concat(displayEnd, " ").concat(strandStr)
   });
-
   var coreRenderedDetails = ['Position', 'Description', 'Name', 'Length', 'Type'];
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, coreRenderedDetails.map(function (key) {
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, coreRenderedDetails.map(function (key) {
     return [key, displayedDetails[key.toLowerCase()]];
   }).filter(function (_ref7) {
-    var _ref8 = (0, _slicedToArray2.default)(_ref7, 2),
+    var _ref8 = (0, _slicedToArray2["default"])(_ref7, 2),
         value = _ref8[1];
 
     return value !== null && value !== undefined;
   }).map(function (_ref9) {
-    var _ref10 = (0, _slicedToArray2.default)(_ref9, 2),
+    var _ref10 = (0, _slicedToArray2["default"])(_ref9, 2),
         key = _ref10[0],
         value = _ref10[1];
 
-    return /*#__PURE__*/_react.default.createElement(SimpleValue, {
+    return /*#__PURE__*/_react["default"].createElement(SimpleValue, {
       key: key,
       name: key,
       value: value
@@ -278,9 +271,9 @@ function CoreDetails(props) {
 }
 
 var BaseCoreDetails = function BaseCoreDetails(props) {
-  return /*#__PURE__*/_react.default.createElement(BaseCard, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/_react["default"].createElement(BaseCard, Object.assign({}, props, {
     title: "Primary data"
-  }), /*#__PURE__*/_react.default.createElement(CoreDetails, props));
+  }), /*#__PURE__*/_react["default"].createElement(CoreDetails, props));
 };
 
 exports.BaseCoreDetails = BaseCoreDetails;
@@ -300,13 +293,13 @@ var DataGridDetails = function DataGridDetails(_ref11) {
   if (unionKeys.size < keys.length + 5) {
     // avoids key 'id' from being used in row data
     var rows = Object.entries(value).map(function (_ref12) {
-      var _ref13 = (0, _slicedToArray2.default)(_ref12, 2),
+      var _ref13 = (0, _slicedToArray2["default"])(_ref12, 2),
           k = _ref13[0],
           val = _ref13[1];
 
       var id = val.id,
-          rest = (0, _objectWithoutProperties2.default)(val, _excluded);
-      return _objectSpread({
+          rest = (0, _objectWithoutProperties2["default"])(val, _excluded);
+      return (0, _objectSpread2["default"])({
         id: k,
         // used by material UI
         identifier: id
@@ -317,16 +310,16 @@ var DataGridDetails = function DataGridDetails(_ref11) {
     var colNames;
 
     if (unionKeys.has('id')) {
-      unionKeys.delete('id');
-      colNames = ['identifier'].concat((0, _toConsumableArray2.default)(unionKeys));
+      unionKeys["delete"]('id');
+      colNames = ['identifier'].concat((0, _toConsumableArray2["default"])(unionKeys));
     } else {
-      colNames = (0, _toConsumableArray2.default)(unionKeys);
+      colNames = (0, _toConsumableArray2["default"])(unionKeys);
     }
 
     var columns = colNames.map(function (val) {
       return {
         field: val,
-        width: Math.max.apply(Math, (0, _toConsumableArray2.default)(rows.map(function (row) {
+        width: Math.max.apply(Math, (0, _toConsumableArray2["default"])(rows.map(function (row) {
           var result = String(row[val]);
           return Math.min(Math.max((0, _util.measureText)(result, 14) + 50, 80), 1000);
         })))
@@ -334,15 +327,15 @@ var DataGridDetails = function DataGridDetails(_ref11) {
     }); // disableSelection on click helps avoid
     // https://github.com/mui-org/material-ui-x/issues/1197
 
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(FieldName, {
+    return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(FieldName, {
       prefix: prefix,
       name: name
-    }), /*#__PURE__*/_react.default.createElement("div", {
+    }), /*#__PURE__*/_react["default"].createElement("div", {
       style: {
         height: Math.min(rows.length, 100) * 20 + 50 + (rows.length < 100 ? 0 : 50),
         width: '100%'
       }
-    }, /*#__PURE__*/_react.default.createElement(_xDataGrid.DataGrid, {
+    }, /*#__PURE__*/_react["default"].createElement(_xDataGrid.DataGrid, {
       disableSelectionOnClick: true,
       rowHeight: 20,
       headerHeight: 25,
@@ -371,6 +364,17 @@ function accessNested(arr) {
   return typeof obj === 'string' ? obj : typeof ((_obj = obj) === null || _obj === void 0 ? void 0 : _obj.Description) === 'string' ? obj.Description : undefined;
 }
 
+function generateMaxWidth(array, prefix) {
+  // @ts-ignore
+  var arr = [];
+  array.forEach(function (key, value) {
+    var val = [].concat((0, _toConsumableArray2["default"])(prefix), [key[0]]).join('.');
+    arr.push((0, _util.measureText)(val, 12));
+  }); // @ts-ignore
+
+  return Math.ceil(Math.max.apply(Math, arr)) + 10;
+}
+
 var Attributes = function Attributes(props) {
   var attributes = props.attributes,
       _props$omit = props.omit,
@@ -382,22 +386,30 @@ var Attributes = function Attributes(props) {
   } : _props$formatter,
       _props$prefix = props.prefix,
       prefix = _props$prefix === void 0 ? [] : _props$prefix;
-  var omits = [].concat((0, _toConsumableArray2.default)(omit), globalOmit);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, Object.entries(attributes).filter(function (_ref14) {
-    var _ref15 = (0, _slicedToArray2.default)(_ref14, 2),
+  var omits = [].concat((0, _toConsumableArray2["default"])(omit), globalOmit);
+  var maxLabelWidth = generateMaxWidth(Object.entries(attributes).filter(function (_ref14) {
+    var _ref15 = (0, _slicedToArray2["default"])(_ref14, 2),
         k = _ref15[0],
         v = _ref15[1];
 
     return v !== undefined && !omits.includes(k);
-  }).map(function (_ref16) {
-    var _ref17 = (0, _slicedToArray2.default)(_ref16, 2),
-        key = _ref17[0],
-        value = _ref17[1];
+  }), prefix);
+  var labelWidth = maxLabelWidth <= MAX_FIELD_NAME_WIDTH ? maxLabelWidth : MAX_FIELD_NAME_WIDTH;
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, Object.entries(attributes).filter(function (_ref16) {
+    var _ref17 = (0, _slicedToArray2["default"])(_ref16, 2),
+        k = _ref17[0],
+        v = _ref17[1];
+
+    return v !== undefined && !omits.includes(k);
+  }).map(function (_ref18) {
+    var _ref19 = (0, _slicedToArray2["default"])(_ref18, 2),
+        key = _ref19[0],
+        value = _ref19[1];
 
     if (Array.isArray(value) && value.length > 2 && value.every(function (val) {
-      return (0, _isObject.default)(val);
+      return (0, _isObject["default"])(val);
     })) {
-      return /*#__PURE__*/_react.default.createElement(DataGridDetails, {
+      return /*#__PURE__*/_react["default"].createElement(DataGridDetails, {
         key: key,
         prefix: prefix,
         name: key,
@@ -405,10 +417,10 @@ var Attributes = function Attributes(props) {
       });
     }
 
-    var description = accessNested([].concat((0, _toConsumableArray2.default)(prefix), [key]), descriptions);
+    var description = accessNested([].concat((0, _toConsumableArray2["default"])(prefix), [key]), descriptions);
 
     if (Array.isArray(value)) {
-      return /*#__PURE__*/_react.default.createElement(ArrayValue, {
+      return /*#__PURE__*/_react["default"].createElement(ArrayValue, {
         key: key,
         name: key,
         value: value,
@@ -417,22 +429,23 @@ var Attributes = function Attributes(props) {
       });
     }
 
-    if ((0, _isObject.default)(value)) {
-      return /*#__PURE__*/_react.default.createElement(Attributes, {
+    if ((0, _isObject["default"])(value)) {
+      return /*#__PURE__*/_react["default"].createElement(Attributes, {
         omit: omits,
         key: key,
         attributes: value,
         descriptions: descriptions,
-        prefix: [].concat((0, _toConsumableArray2.default)(prefix), [key])
+        prefix: [].concat((0, _toConsumableArray2["default"])(prefix), [key])
       });
     }
 
-    return /*#__PURE__*/_react.default.createElement(SimpleValue, {
+    return /*#__PURE__*/_react["default"].createElement(SimpleValue, {
       key: key,
       name: key,
       value: formatter(value, key),
       description: description,
-      prefix: prefix
+      prefix: prefix,
+      width: labelWidth
     });
   }));
 };
@@ -441,9 +454,9 @@ exports.Attributes = Attributes;
 
 var BaseAttributes = function BaseAttributes(props) {
   var feature = props.feature;
-  return /*#__PURE__*/_react.default.createElement(BaseCard, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/_react["default"].createElement(BaseCard, Object.assign({}, props, {
     title: "Attributes"
-  }), /*#__PURE__*/_react.default.createElement(Attributes, (0, _extends2.default)({}, props, {
+  }), /*#__PURE__*/_react["default"].createElement(Attributes, Object.assign({}, props, {
     attributes: feature
   })));
 };
@@ -471,26 +484,26 @@ var FeatureDetails = function FeatureDetails(props) {
   var session = (0, _util.getSession)(model);
   var defaultSeqTypes = ['mRNA', 'transcript'];
   var sequenceTypes = (0, _configuration.getConf)(session, ['featureDetails', 'sequenceTypes']) || defaultSeqTypes;
-  return /*#__PURE__*/_react.default.createElement(BaseCard, {
+  return /*#__PURE__*/_react["default"].createElement(BaseCard, {
     title: [(0, _util2.ellipses)(name || id), type].filter(function (f) {
       return !!f;
     }).join(' - ')
-  }, /*#__PURE__*/_react.default.createElement(_core.Typography, null, "Core details"), /*#__PURE__*/_react.default.createElement(CoreDetails, props), /*#__PURE__*/_react.default.createElement(_core.Divider, null), /*#__PURE__*/_react.default.createElement(_core.Typography, null, "Attributes"), /*#__PURE__*/_react.default.createElement(Attributes, (0, _extends2.default)({
+  }, /*#__PURE__*/_react["default"].createElement(_core.Typography, null, "Core details"), /*#__PURE__*/_react["default"].createElement(CoreDetails, props), /*#__PURE__*/_react["default"].createElement(_core.Divider, null), /*#__PURE__*/_react["default"].createElement(_core.Typography, null, "Attributes"), /*#__PURE__*/_react["default"].createElement(Attributes, Object.assign({
     attributes: feature
   }, props, {
-    omit: [].concat((0, _toConsumableArray2.default)(omit), coreDetails)
-  })), sequenceTypes.includes(feature.type) ? /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
-    FallbackComponent: function FallbackComponent(_ref18) {
-      var error = _ref18.error;
-      return /*#__PURE__*/_react.default.createElement(_core.Typography, {
+    omit: [].concat((0, _toConsumableArray2["default"])(omit), coreDetails)
+  })), sequenceTypes.includes(feature.type) ? /*#__PURE__*/_react["default"].createElement(_reactErrorBoundary.ErrorBoundary, {
+    FallbackComponent: function FallbackComponent(_ref20) {
+      var error = _ref20.error;
+      return /*#__PURE__*/_react["default"].createElement(_core.Typography, {
         color: "error"
       }, "Failed to fetch sequence for feature: ", "".concat(error));
     }
-  }, /*#__PURE__*/_react.default.createElement(_SequenceFeatureDetails.default, props)) : null, subfeatures !== null && subfeatures !== void 0 && subfeatures.length ? /*#__PURE__*/_react.default.createElement(BaseCard, {
+  }, /*#__PURE__*/_react["default"].createElement(_SequenceFeatureDetails["default"], props)) : null, subfeatures !== null && subfeatures !== void 0 && subfeatures.length ? /*#__PURE__*/_react["default"].createElement(BaseCard, {
     title: "Subfeatures",
     defaultExpanded: !sequenceTypes.includes(feature.type)
   }, subfeatures.map(function (sub) {
-    return /*#__PURE__*/_react.default.createElement(FeatureDetails, {
+    return /*#__PURE__*/_react["default"].createElement(FeatureDetails, {
       key: JSON.stringify(sub),
       feature: sub,
       model: model,
@@ -514,10 +527,10 @@ var BaseFeatureDetails = (0, _mobxReact.observer)(function (props) {
     return null;
   }
 
-  return /*#__PURE__*/_react.default.createElement(FeatureDetails, {
+  return /*#__PURE__*/_react["default"].createElement(FeatureDetails, {
     model: model,
     feature: feature
   });
 });
 var _default = BaseFeatureDetails;
-exports.default = _default;
+exports["default"] = _default;