molstar 3.3.1 → 3.4.0

package/lib/commonjs/mol-plugin-ui/structure/generic.js

@@ -10,7 +10,7 @@ var common_1 = require("../controls/common");
 var update_transform_1 = require("../state/update-transform");
 var icons_1 = require("../controls/icons");
 var GenericEntryListControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(GenericEntryListControls, _super);
+    tslib_1.__extends(GenericEntryListControls, _super);
     function GenericEntryListControls() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
@@ -40,7 +40,7 @@ var GenericEntryListControls = /** @class */ (function (_super) {
             }
             if (refs.length === 0)
                 return null;
-            return (0, jsx_runtime_1.jsx)(GenericEntry, { refs: refs, labelMultiple: 'Unit Cells' }, void 0);
+            return (0, jsx_runtime_1.jsx)(GenericEntry, { refs: refs, labelMultiple: 'Unit Cells' });
         },
         enumerable: false,
         configurable: true
@@ -52,7 +52,7 @@ var GenericEntryListControls = /** @class */ (function (_super) {
             this.plugin.genericRepresentationControls.forEach(function (provider, key) {
                 var _a = provider(_this.plugin.managers.structure.hierarchy.selection), refs = _a[0], labelMultiple = _a[1];
                 if (refs.length > 0) {
-                    controls.push((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(GenericEntry, { refs: refs, labelMultiple: labelMultiple }, void 0) }, key));
+                    controls.push((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(GenericEntry, { refs: refs, labelMultiple: labelMultiple }) }, key));
                 }
             });
             return controls.length > 0 ? controls : null;
@@ -61,13 +61,13 @@ var GenericEntryListControls = /** @class */ (function (_super) {
         configurable: true
     });
     GenericEntryListControls.prototype.render = function () {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ style: { marginTop: '6px' } }, { children: [this.unitcell, this.customControls] }), void 0) }, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ style: { marginTop: '6px' } }, { children: [this.unitcell, this.customControls] })) });
     };
     return GenericEntryListControls;
 }(base_1.PurePluginUIComponent));
 exports.GenericEntryListControls = GenericEntryListControls;
 var GenericEntry = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(GenericEntry, _super);
+    tslib_1.__extends(GenericEntry, _super);
     function GenericEntry() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.state = { showOptions: false };
@@ -147,7 +147,7 @@ var GenericEntry = /** @class */ (function (_super) {
         else {
             label = "".concat(refs.length, " ").concat(labelMultiple || 'Objects');
         }
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsxs)("button", (0, tslib_1.__assign)({ className: 'msp-form-control msp-control-button-label', title: "".concat(label, ". Click to focus."), onClick: this.focus, onMouseEnter: this.highlight, onMouseLeave: this.clearHighlight, style: { textAlign: 'left' } }, { children: [label, " ", (0, jsx_runtime_1.jsx)("small", { children: description }, void 0)] }), void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: pivot.cell.state.isHidden ? icons_1.VisibilityOffOutlinedSvg : icons_1.VisibilityOutlinedSvg, toggleState: false, className: 'msp-form-control', onClick: this.toggleVisibility, title: "".concat(pivot.cell.state.isHidden ? 'Show' : 'Hide'), small: true, flex: true }, void 0), refs.length === 1 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.MoreHorizSvg, className: 'msp-form-control', onClick: this.toggleOptions, title: 'Options', toggleState: this.state.showOptions, flex: true }, void 0)] }), void 0), (refs.length === 1 && this.state.showOptions && pivot.cell.parent) && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-control-offset' }, { children: (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: pivot.cell.parent, transform: pivot.cell.transform, customHeader: 'none', autoHideApply: true }, void 0) }), void 0) }, void 0)] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsxs)("button", tslib_1.__assign({ className: 'msp-form-control msp-control-button-label', title: "".concat(label, ". Click to focus."), onClick: this.focus, onMouseEnter: this.highlight, onMouseLeave: this.clearHighlight, style: { textAlign: 'left' } }, { children: [label, " ", (0, jsx_runtime_1.jsx)("small", { children: description })] })), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: pivot.cell.state.isHidden ? icons_1.VisibilityOffOutlinedSvg : icons_1.VisibilityOutlinedSvg, toggleState: false, className: 'msp-form-control', onClick: this.toggleVisibility, title: "".concat(pivot.cell.state.isHidden ? 'Show' : 'Hide'), small: true, flex: true }), refs.length === 1 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.MoreHorizSvg, className: 'msp-form-control', onClick: this.toggleOptions, title: 'Options', toggleState: this.state.showOptions, flex: true })] })), (refs.length === 1 && this.state.showOptions && pivot.cell.parent) && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-control-offset' }, { children: (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: pivot.cell.parent, transform: pivot.cell.transform, customHeader: 'none', autoHideApply: true }) })) })] });
     };
     return GenericEntry;
 }(base_1.PurePluginUIComponent));

package/lib/commonjs/mol-plugin-ui/structure/measurements.js

@@ -16,7 +16,7 @@ var update_transform_1 = require("../state/update-transform");
 var selection_1 = require("./selection");
 // TODO details, options (e.g. change text for labels)
 var StructureMeasurementsControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(StructureMeasurementsControls, _super);
+    tslib_1.__extends(StructureMeasurementsControls, _super);
     function StructureMeasurementsControls() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
@@ -28,13 +28,13 @@ var StructureMeasurementsControls = /** @class */ (function (_super) {
         };
     };
     StructureMeasurementsControls.prototype.renderControls = function () {
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(MeasurementControls, {}, void 0), (0, jsx_runtime_1.jsx)(MeasurementList, {}, void 0)] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(MeasurementControls, {}), (0, jsx_runtime_1.jsx)(MeasurementList, {})] });
     };
     return StructureMeasurementsControls;
 }(base_1.CollapsableControls));
 exports.StructureMeasurementsControls = StructureMeasurementsControls;
 var MeasurementList = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(MeasurementList, _super);
+    tslib_1.__extends(MeasurementList, _super);
     function MeasurementList() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
@@ -51,17 +51,17 @@ var MeasurementList = /** @class */ (function (_super) {
             if (cell.obj)
                 group.push((0, jsx_runtime_1.jsx)(MeasurementEntry, { cell: cell }, cell.obj.id));
         }
-        return group.length ? (0, jsx_runtime_1.jsx)(common_1.ExpandGroup, (0, tslib_1.__assign)({ header: header, initiallyExpanded: true }, { children: group }), void 0) : null;
+        return group.length ? (0, jsx_runtime_1.jsx)(common_1.ExpandGroup, tslib_1.__assign({ header: header, initiallyExpanded: true }, { children: group })) : null;
     };
     MeasurementList.prototype.render = function () {
         var measurements = this.plugin.managers.structure.measurement.state;
-        return (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ style: { marginTop: '6px' } }, { children: [this.renderGroup(measurements.labels, 'Labels'), this.renderGroup(measurements.distances, 'Distances'), this.renderGroup(measurements.angles, 'Angles'), this.renderGroup(measurements.dihedrals, 'Dihedrals'), this.renderGroup(measurements.orientations, 'Orientations'), this.renderGroup(measurements.planes, 'Planes')] }), void 0);
+        return (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ style: { marginTop: '6px' } }, { children: [this.renderGroup(measurements.labels, 'Labels'), this.renderGroup(measurements.distances, 'Distances'), this.renderGroup(measurements.angles, 'Angles'), this.renderGroup(measurements.dihedrals, 'Dihedrals'), this.renderGroup(measurements.orientations, 'Orientations'), this.renderGroup(measurements.planes, 'Planes')] }));
     };
     return MeasurementList;
 }(base_1.PurePluginUIComponent));
 exports.MeasurementList = MeasurementList;
 var MeasurementControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(MeasurementControls, _super);
+    tslib_1.__extends(MeasurementControls, _super);
     function MeasurementControls() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.state = { isBusy: false, action: void 0 };
@@ -172,7 +172,7 @@ var MeasurementControls = /** @class */ (function (_super) {
     MeasurementControls.prototype.historyEntry = function (e, idx) {
         var _this = this;
         var history = this.plugin.managers.structure.selection.additionsHistory;
-        return (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row', onMouseEnter: function () { return _this.highlight(e.loci); }, onMouseLeave: function () { return _this.plugin.managers.interactivity.lociHighlights.clearHighlights(); } }, { children: [(0, jsx_runtime_1.jsxs)(common_1.Button, (0, tslib_1.__assign)({ noOverflow: true, title: 'Click to focus. Hover to highlight.', onClick: function () { return _this.focusLoci(e.loci); }, style: { width: 'auto', textAlign: 'left' } }, { children: [idx, ". ", (0, jsx_runtime_1.jsx)("span", { dangerouslySetInnerHTML: { __html: e.label } }, void 0)] }), void 0), history.length > 1 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.ArrowUpwardSvg, small: true, className: 'msp-form-control', onClick: function () { return _this.moveHistory(e, 'up'); }, flex: '20px', title: 'Move up' }, void 0), history.length > 1 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.ArrowDownwardSvg, small: true, className: 'msp-form-control', onClick: function () { return _this.moveHistory(e, 'down'); }, flex: '20px', title: 'Move down' }, void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.DeleteOutlinedSvg, small: true, className: 'msp-form-control', onClick: function () { return _this.plugin.managers.structure.selection.modifyHistory(e, 'remove'); }, flex: true, title: 'Remove' }, void 0)] }), e.id);
+        return (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row', onMouseEnter: function () { return _this.highlight(e.loci); }, onMouseLeave: function () { return _this.plugin.managers.interactivity.lociHighlights.clearHighlights(); } }, { children: [(0, jsx_runtime_1.jsxs)(common_1.Button, tslib_1.__assign({ noOverflow: true, title: 'Click to focus. Hover to highlight.', onClick: function () { return _this.focusLoci(e.loci); }, style: { width: 'auto', textAlign: 'left' } }, { children: [idx, ". ", (0, jsx_runtime_1.jsx)("span", { dangerouslySetInnerHTML: { __html: e.label } })] })), history.length > 1 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.ArrowUpwardSvg, small: true, className: 'msp-form-control', onClick: function () { return _this.moveHistory(e, 'up'); }, flex: '20px', title: 'Move up' }), history.length > 1 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.ArrowDownwardSvg, small: true, className: 'msp-form-control', onClick: function () { return _this.moveHistory(e, 'down'); }, flex: '20px', title: 'Move down' }), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.DeleteOutlinedSvg, small: true, className: 'msp-form-control', onClick: function () { return _this.plugin.managers.structure.selection.modifyHistory(e, 'remove'); }, flex: true, title: 'Remove' })] }), e.id);
     };
     MeasurementControls.prototype.add = function () {
         var history = this.plugin.managers.structure.selection.additionsHistory;
@@ -180,16 +180,16 @@ var MeasurementControls = /** @class */ (function (_super) {
         for (var i = 0, _i = Math.min(history.length, 4); i < _i; i++) {
             entries.push(this.historyEntry(history[i], i + 1));
         }
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.actions, onSelect: this.selectAction }, void 0), entries.length > 0 && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-control-offset' }, { children: entries }), void 0), entries.length === 0 && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-control-offset msp-help-text' }, { children: (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-help-description' }, { children: [(0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.HelpOutlineSvg, inline: true }, void 0), "Add one or more selections (toggle ", (0, jsx_runtime_1.jsx)(selection_1.ToggleSelectionModeButton, { inline: true }, void 0), " mode)"] }), void 0) }), void 0)] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.actions, onSelect: this.selectAction }), entries.length > 0 && (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-control-offset' }, { children: entries })), entries.length === 0 && (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-control-offset msp-help-text' }, { children: (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-help-description' }, { children: [(0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.HelpOutlineSvg, inline: true }), "Add one or more selections (toggle ", (0, jsx_runtime_1.jsx)(selection_1.ToggleSelectionModeButton, { inline: true }), " mode)"] })) }))] });
     };
     MeasurementControls.prototype.render = function () {
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.AddSvg, label: 'Add', toggle: this.toggleAdd, isSelected: this.state.action === 'add', disabled: this.state.isBusy, className: 'msp-btn-apply-simple' }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.TuneSvg, label: '', title: 'Options', toggle: this.toggleOptions, isSelected: this.state.action === 'options', disabled: this.state.isBusy, style: { flex: '0 0 40px', padding: 0 } }, void 0)] }), void 0), this.state.action === 'add' && this.add(), this.state.action === 'options' && (0, jsx_runtime_1.jsx)(MeasurementsOptions, {}, void 0)] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.AddSvg, label: 'Add', toggle: this.toggleAdd, isSelected: this.state.action === 'add', disabled: this.state.isBusy, className: 'msp-btn-apply-simple' }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.TuneSvg, label: '', title: 'Options', toggle: this.toggleOptions, isSelected: this.state.action === 'options', disabled: this.state.isBusy, style: { flex: '0 0 40px', padding: 0 } })] })), this.state.action === 'add' && this.add(), this.state.action === 'options' && (0, jsx_runtime_1.jsx)(MeasurementsOptions, {})] });
     };
     return MeasurementControls;
 }(base_1.PurePluginUIComponent));
 exports.MeasurementControls = MeasurementControls;
 var MeasurementsOptions = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(MeasurementsOptions, _super);
+    tslib_1.__extends(MeasurementsOptions, _super);
     function MeasurementsOptions() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.state = { isDisabled: false };
@@ -209,12 +209,12 @@ var MeasurementsOptions = /** @class */ (function (_super) {
     };
     MeasurementsOptions.prototype.render = function () {
         var measurements = this.plugin.managers.structure.measurement.state;
-        return (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-control-offset' }, { children: (0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: measurement_1.StructureMeasurementParams, values: measurements.options, onChangeValues: this.changed, isDisabled: this.state.isDisabled }, void 0) }), void 0);
+        return (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-control-offset' }, { children: (0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: measurement_1.StructureMeasurementParams, values: measurements.options, onChangeValues: this.changed, isDisabled: this.state.isDisabled }) }));
     };
     return MeasurementsOptions;
 }(base_1.PurePluginUIComponent));
 var MeasurementEntry = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(MeasurementEntry, _super);
+    tslib_1.__extends(MeasurementEntry, _super);
     function MeasurementEntry() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.state = { showUpdate: false };
@@ -327,7 +327,7 @@ var MeasurementEntry = /** @class */ (function (_super) {
         var obj = cell.obj;
         if (!obj)
             return null;
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row', onMouseEnter: this.highlight, onMouseLeave: this.clearHighlight }, { children: [(0, jsx_runtime_1.jsx)("button", (0, tslib_1.__assign)({ className: 'msp-form-control msp-control-button-label msp-no-overflow', title: 'Click to focus. Hover to highlight.', onClick: this.focus, style: { width: 'auto', textAlign: 'left' } }, { children: (0, jsx_runtime_1.jsx)("span", { dangerouslySetInnerHTML: { __html: this.label } }, void 0) }), void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: cell.state.isHidden ? icons_1.VisibilityOffOutlinedSvg : icons_1.VisibilityOutlinedSvg, toggleState: false, small: true, className: 'msp-form-control', onClick: this.toggleVisibility, flex: true, title: cell.state.isHidden ? 'Show' : 'Hide' }, void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.DeleteOutlinedSvg, small: true, className: 'msp-form-control', onClick: this.delete, flex: true, title: 'Delete', toggleState: false }, void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.MoreHorizSvg, className: 'msp-form-control', onClick: this.toggleUpdate, flex: true, title: 'Actions', toggleState: this.state.showUpdate }, void 0)] }), obj.id), this.state.showUpdate && cell.parent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-accent-offset' }, { children: [(0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.actions, onSelect: this.selectAction, noOffset: true }, void 0), (0, jsx_runtime_1.jsx)(common_1.ExpandGroup, (0, tslib_1.__assign)({ header: 'Options', noOffset: true }, { children: (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: cell.parent, transform: cell.transform, customHeader: 'none', autoHideApply: true }, void 0) }), void 0)] }), void 0) }, void 0)] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row', onMouseEnter: this.highlight, onMouseLeave: this.clearHighlight }, { children: [(0, jsx_runtime_1.jsx)("button", tslib_1.__assign({ className: 'msp-form-control msp-control-button-label msp-no-overflow', title: 'Click to focus. Hover to highlight.', onClick: this.focus, style: { width: 'auto', textAlign: 'left' } }, { children: (0, jsx_runtime_1.jsx)("span", { dangerouslySetInnerHTML: { __html: this.label } }) })), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: cell.state.isHidden ? icons_1.VisibilityOffOutlinedSvg : icons_1.VisibilityOutlinedSvg, toggleState: false, small: true, className: 'msp-form-control', onClick: this.toggleVisibility, flex: true, title: cell.state.isHidden ? 'Show' : 'Hide' }), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.DeleteOutlinedSvg, small: true, className: 'msp-form-control', onClick: this.delete, flex: true, title: 'Delete', toggleState: false }), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.MoreHorizSvg, className: 'msp-form-control', onClick: this.toggleUpdate, flex: true, title: 'Actions', toggleState: this.state.showUpdate })] }), obj.id), this.state.showUpdate && cell.parent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-accent-offset' }, { children: [(0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.actions, onSelect: this.selectAction, noOffset: true }), (0, jsx_runtime_1.jsx)(common_1.ExpandGroup, tslib_1.__assign({ header: 'Options', noOffset: true }, { children: (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: cell.parent, transform: cell.transform, customHeader: 'none', autoHideApply: true }) }))] })) })] });
     };
     return MeasurementEntry;
 }(base_1.PurePluginUIComponent));

package/lib/commonjs/mol-plugin-ui/structure/quick-styles.js

@@ -18,7 +18,7 @@ var postprocessing_1 = require("../../mol-canvas3d/passes/postprocessing");
 var config_1 = require("../../mol-plugin/config");
 var component_1 = require("../../mol-plugin-state/manager/structure/component");
 var StructureQuickStylesControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(StructureQuickStylesControls, _super);
+    tslib_1.__extends(StructureQuickStylesControls, _super);
     function StructureQuickStylesControls() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
@@ -30,20 +30,20 @@ var StructureQuickStylesControls = /** @class */ (function (_super) {
         };
     };
     StructureQuickStylesControls.prototype.renderControls = function () {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(QuickStyles, {}, void 0) }, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(QuickStyles, {}) });
     };
     return StructureQuickStylesControls;
 }(base_1.CollapsableControls));
 exports.StructureQuickStylesControls = StructureQuickStylesControls;
 var QuickStyles = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(QuickStyles, _super);
+    tslib_1.__extends(QuickStyles, _super);
     function QuickStyles() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     QuickStyles.prototype.default = function () {
-        return (0, tslib_1.__awaiter)(this, void 0, void 0, function () {
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
             var structures, preset, provider, p;
-            return (0, tslib_1.__generator)(this, function (_a) {
+            return tslib_1.__generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         structures = this.plugin.managers.structure.hierarchy.selection.structures;
@@ -65,9 +65,9 @@ var QuickStyles = /** @class */ (function (_super) {
         });
     };
     QuickStyles.prototype.illustrative = function () {
-        return (0, tslib_1.__awaiter)(this, void 0, void 0, function () {
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
             var structures;
-            return (0, tslib_1.__generator)(this, function (_a) {
+            return tslib_1.__generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         structures = this.plugin.managers.structure.hierarchy.selection.structures;
@@ -94,10 +94,10 @@ var QuickStyles = /** @class */ (function (_super) {
         });
     };
     QuickStyles.prototype.stylized = function () {
-        return (0, tslib_1.__awaiter)(this, void 0, void 0, function () {
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
             var pp;
-            return (0, tslib_1.__generator)(this, function (_a) {
-                this.plugin.managers.structure.component.setOptions((0, tslib_1.__assign)((0, tslib_1.__assign)({}, this.plugin.managers.structure.component.state.options), { ignoreLight: true }));
+            return tslib_1.__generator(this, function (_a) {
+                this.plugin.managers.structure.component.setOptions(tslib_1.__assign(tslib_1.__assign({}, this.plugin.managers.structure.component.state.options), { ignoreLight: true }));
                 if (this.plugin.canvas3d) {
                     pp = this.plugin.canvas3d.props.postprocessing;
                     this.plugin.canvas3d.setProps({
@@ -123,7 +123,7 @@ var QuickStyles = /** @class */ (function (_super) {
     };
     QuickStyles.prototype.render = function () {
         var _this = this;
-        return (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsx)(common_1.Button, (0, tslib_1.__assign)({ noOverflow: true, title: 'Applies default representation preset. Set outline and occlusion effects to defaults.', onClick: function () { return _this.default(); }, style: { width: 'auto' } }, { children: "Default" }), void 0), (0, jsx_runtime_1.jsx)(common_1.Button, (0, tslib_1.__assign)({ noOverflow: true, title: 'Applies no representation preset. Enables outline and occlusion effects. Enables ignore-light representation parameter.', onClick: function () { return _this.stylized(); }, style: { width: 'auto' } }, { children: "Stylized" }), void 0), (0, jsx_runtime_1.jsx)(common_1.Button, (0, tslib_1.__assign)({ noOverflow: true, title: 'Applies illustrative representation preset. Enables outline and occlusion effects. Enables ignore-light parameter.', onClick: function () { return _this.illustrative(); }, style: { width: 'auto' } }, { children: "Illustrative" }), void 0)] }), void 0);
+        return (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsx)(common_1.Button, tslib_1.__assign({ noOverflow: true, title: 'Applies default representation preset. Set outline and occlusion effects to defaults.', onClick: function () { return _this.default(); }, style: { width: 'auto' } }, { children: "Default" })), (0, jsx_runtime_1.jsx)(common_1.Button, tslib_1.__assign({ noOverflow: true, title: 'Applies no representation preset. Enables outline and occlusion effects. Enables ignore-light representation parameter.', onClick: function () { return _this.stylized(); }, style: { width: 'auto' } }, { children: "Stylized" })), (0, jsx_runtime_1.jsx)(common_1.Button, tslib_1.__assign({ noOverflow: true, title: 'Applies illustrative representation preset. Enables outline and occlusion effects. Enables ignore-light parameter.', onClick: function () { return _this.illustrative(); }, style: { width: 'auto' } }, { children: "Illustrative" }))] }));
     };
     return QuickStyles;
 }(base_1.PurePluginUIComponent));

package/lib/commonjs/mol-plugin-ui/structure/selection.js

@@ -9,7 +9,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  * @author David Sehnal <david.sehnal@gmail.com>
  */
-var React = (0, tslib_1.__importStar)(require("react"));
+var React = tslib_1.__importStar(require("react"));
 var structure_selection_query_1 = require("../../mol-plugin-state/helpers/structure-selection-query");
 var interactivity_1 = require("../../mol-plugin-state/manager/interactivity");
 var component_1 = require("../../mol-plugin-state/manager/structure/component");
@@ -25,7 +25,7 @@ var parameters_1 = require("../controls/parameters");
 var help_1 = require("../viewport/help");
 var components_1 = require("./components");
 var ToggleSelectionModeButton = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(ToggleSelectionModeButton, _super);
+    tslib_1.__extends(ToggleSelectionModeButton, _super);
     function ToggleSelectionModeButton() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this._toggleSelMode = function () {
@@ -43,7 +43,7 @@ var ToggleSelectionModeButton = /** @class */ (function (_super) {
         var style = this.props.inline
             ? { background: 'transparent', width: 'auto', height: 'auto', lineHeight: 'unset' }
             : { background: 'transparent' };
-        return (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.SelectionModeSvg, onClick: this._toggleSelMode, title: 'Toggle Selection Mode', style: style, toggleState: this.plugin.selectionMode }, void 0);
+        return (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.SelectionModeSvg, onClick: this._toggleSelMode, title: 'Toggle Selection Mode', style: style, toggleState: this.plugin.selectionMode });
     };
     return ToggleSelectionModeButton;
 }(base_1.PurePluginUIComponent));
@@ -58,7 +58,7 @@ var ActionHeader = new Map([
     ['set', 'Set Selection']
 ]);
 var StructureSelectionActionsControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(StructureSelectionActionsControls, _super);
+    tslib_1.__extends(StructureSelectionActionsControls, _super);
     function StructureSelectionActionsControls() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.state = {
@@ -176,7 +176,7 @@ var StructureSelectionActionsControls = /** @class */ (function (_super) {
             var registry = this.plugin.query.structure.registry;
             if (registry.version !== this.queriesVersion) {
                 var structures = this.structures;
-                var queries = (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], registry.list, true), (0, structure_selection_query_1.getPolymerAndBranchedEntityQueries)(structures), true), (0, structure_selection_query_1.getNonStandardResidueQueries)(structures), true), (0, structure_selection_query_1.getElementQueries)(structures), true).sort(function (a, b) { return b.priority - a.priority; });
+                var queries = tslib_1.__spreadArray(tslib_1.__spreadArray(tslib_1.__spreadArray(tslib_1.__spreadArray([], registry.list, true), (0, structure_selection_query_1.getPolymerAndBranchedEntityQueries)(structures), true), (0, structure_selection_query_1.getNonStandardResidueQueries)(structures), true), (0, structure_selection_query_1.getElementQueries)(structures), true).sort(function (a, b) { return b.priority - a.priority; });
                 this.queriesItems = action_menu_1.ActionMenu.createItems(queries, {
                     filter: function (q) { return q !== structure_selection_query_1.StructureSelectionQueries.current && !q.isHidden; },
                     label: function (q) { return q.label; },
@@ -222,19 +222,19 @@ var StructureSelectionActionsControls = /** @class */ (function (_super) {
             : 'Some mistakes of the past can be undone.';
         var children = void 0;
         if (this.state.action && !this.state.helper) {
-            children = (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(this.state.action && this.state.action !== 'theme' && this.state.action !== 'add-component' && this.state.action !== 'help') && (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-selection-viewport-controls-actions' }, { children: [(0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { header: ActionHeader.get(this.state.action), title: 'Click to close.', items: this.queries, onSelect: this.selectQuery, noOffset: true }, void 0), (0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.helpers, onSelect: this.selectHelper, noOffset: true }, void 0)] }), void 0), this.state.action === 'theme' && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsx)(common_1.ControlGroup, (0, tslib_1.__assign)({ header: 'Theme', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: this.toggleTheme, topRightIcon: icons_1.CloseSvg }, { children: (0, jsx_runtime_1.jsx)(ApplyThemeControls, { onApply: this.toggleTheme }, void 0) }), void 0) }), void 0), this.state.action === 'add-component' && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsx)(common_1.ControlGroup, (0, tslib_1.__assign)({ header: 'Add Component', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: this.toggleAddComponent, topRightIcon: icons_1.CloseSvg }, { children: (0, jsx_runtime_1.jsx)(components_1.AddComponentControls, { onApply: this.toggleAddComponent, forSelection: true }, void 0) }), void 0) }), void 0), this.state.action === 'help' && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsxs)(common_1.ControlGroup, (0, tslib_1.__assign)({ header: 'Help', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: this.toggleHelp, topRightIcon: icons_1.CloseSvg, maxHeight: '300px' }, { children: [(0, jsx_runtime_1.jsx)(help_1.HelpGroup, (0, tslib_1.__assign)({ header: 'Selection Operations' }, { children: (0, jsx_runtime_1.jsxs)(help_1.HelpText, { children: ["Use ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.UnionSvg, inline: true }, void 0), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.SubtractSvg, inline: true }, void 0), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.IntersectSvg, inline: true }, void 0), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.SetSvg, inline: true }, void 0), " to modify the selection."] }, void 0) }), void 0), (0, jsx_runtime_1.jsx)(help_1.HelpGroup, (0, tslib_1.__assign)({ header: 'Representation Operations' }, { children: (0, jsx_runtime_1.jsxs)(help_1.HelpText, { children: ["Use ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.BrushSvg, inline: true }, void 0), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.CubeOutlineSvg, inline: true }, void 0), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.RemoveSvg, inline: true }, void 0), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.RestoreSvg, inline: true }, void 0), " to color, create components, remove from components, or undo actions."] }, void 0) }), void 0), (0, jsx_runtime_1.jsx)(help_1.ViewportHelpContent, { selectOnly: true }, void 0)] }), void 0) }), void 0)] }, void 0);
+            children = (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(this.state.action && this.state.action !== 'theme' && this.state.action !== 'add-component' && this.state.action !== 'help') && (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-selection-viewport-controls-actions' }, { children: [(0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { header: ActionHeader.get(this.state.action), title: 'Click to close.', items: this.queries, onSelect: this.selectQuery, noOffset: true }), (0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.helpers, onSelect: this.selectHelper, noOffset: true })] })), this.state.action === 'theme' && (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsx)(common_1.ControlGroup, tslib_1.__assign({ header: 'Theme', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: this.toggleTheme, topRightIcon: icons_1.CloseSvg }, { children: (0, jsx_runtime_1.jsx)(ApplyThemeControls, { onApply: this.toggleTheme }) })) })), this.state.action === 'add-component' && (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsx)(common_1.ControlGroup, tslib_1.__assign({ header: 'Add Component', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: this.toggleAddComponent, topRightIcon: icons_1.CloseSvg }, { children: (0, jsx_runtime_1.jsx)(components_1.AddComponentControls, { onApply: this.toggleAddComponent, forSelection: true }) })) })), this.state.action === 'help' && (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsxs)(common_1.ControlGroup, tslib_1.__assign({ header: 'Help', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: this.toggleHelp, topRightIcon: icons_1.CloseSvg, maxHeight: '300px' }, { children: [(0, jsx_runtime_1.jsx)(help_1.HelpGroup, tslib_1.__assign({ header: 'Selection Operations' }, { children: (0, jsx_runtime_1.jsxs)(help_1.HelpText, { children: ["Use ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.UnionSvg, inline: true }), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.SubtractSvg, inline: true }), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.IntersectSvg, inline: true }), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.SetSvg, inline: true }), " to modify the selection."] }) })), (0, jsx_runtime_1.jsx)(help_1.HelpGroup, tslib_1.__assign({ header: 'Representation Operations' }, { children: (0, jsx_runtime_1.jsxs)(help_1.HelpText, { children: ["Use ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.BrushSvg, inline: true }), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.CubeOutlineSvg, inline: true }), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.RemoveSvg, inline: true }), " ", (0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: icons_1.RestoreSvg, inline: true }), " to color, create components, remove from components, or undo actions."] }) })), (0, jsx_runtime_1.jsx)(help_1.ViewportHelpContent, { selectOnly: true })] })) }))] });
         }
         else if (ActionHeader.has(this.state.action) && this.state.helper === 'residue-list') {
             var close_1 = function () { return _this.setState({ action: void 0, helper: void 0 }); };
-            children = (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsx)(common_1.ControlGroup, (0, tslib_1.__assign)({ header: 'Atom/Residue Identifier List', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: close_1, topRightIcon: icons_1.CloseSvg }, { children: (0, jsx_runtime_1.jsx)(ResidueListSelectionHelper, { modifier: this.state.action, plugin: this.plugin, close: close_1 }, void 0) }), void 0) }), void 0);
+            children = (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-selection-viewport-controls-actions' }, { children: (0, jsx_runtime_1.jsx)(common_1.ControlGroup, tslib_1.__assign({ header: 'Atom/Residue Identifier List', title: 'Click to close.', initialExpanded: true, hideExpander: true, hideOffset: true, onHeaderClick: close_1, topRightIcon: icons_1.CloseSvg }, { children: (0, jsx_runtime_1.jsx)(ResidueListSelectionHelper, { modifier: this.state.action, plugin: this.plugin, close: close_1 }) })) }));
         }
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row', style: { background: 'none' } }, { children: [(0, jsx_runtime_1.jsx)(parameters_1.PureSelectControl, { title: "Picking Level for selecting and highlighting", param: StructureSelectionParams.granularity, name: 'granularity', value: granularity, onChange: this.setGranuality, isDisabled: this.isDisabled }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.UnionSvg, title: "".concat(ActionHeader.get('add'), ". Hold shift key to keep menu open."), toggle: this.toggleAdd, isSelected: this.state.action === 'add', disabled: this.isDisabled }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.SubtractSvg, title: "".concat(ActionHeader.get('remove'), ". Hold shift key to keep menu open."), toggle: this.toggleRemove, isSelected: this.state.action === 'remove', disabled: this.isDisabled }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.IntersectSvg, title: "".concat(ActionHeader.get('intersect'), ". Hold shift key to keep menu open."), toggle: this.toggleIntersect, isSelected: this.state.action === 'intersect', disabled: this.isDisabled }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.SetSvg, title: "".concat(ActionHeader.get('set'), ". Hold shift key to keep menu open."), toggle: this.toggleSet, isSelected: this.state.action === 'set', disabled: this.isDisabled }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.BrushSvg, title: 'Apply Theme to Selection', toggle: this.toggleTheme, isSelected: this.state.action === 'theme', disabled: this.isDisabled, style: { marginLeft: '10px' } }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.CubeOutlineSvg, title: 'Create Component of Selection with Representation', toggle: this.toggleAddComponent, isSelected: this.state.action === 'add-component', disabled: this.isDisabled }, void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.RemoveSvg, title: 'Remove/subtract Selection from all Components', onClick: this.subtract, disabled: this.isDisabled }, void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.RestoreSvg, onClick: this.undo, disabled: !this.state.canUndo || this.isDisabled, title: undoTitle }, void 0), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.HelpOutlineSvg, title: 'Show/hide help', toggle: this.toggleHelp, style: { marginLeft: '10px' }, isSelected: this.state.action === 'help' }, void 0), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.CancelOutlinedSvg, title: 'Turn selection mode off', onClick: this.turnOff }, void 0)] }), void 0), children] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row', style: { background: 'none' } }, { children: [(0, jsx_runtime_1.jsx)(parameters_1.PureSelectControl, { title: "Picking Level for selecting and highlighting", param: StructureSelectionParams.granularity, name: 'granularity', value: granularity, onChange: this.setGranuality, isDisabled: this.isDisabled }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.UnionSvg, title: "".concat(ActionHeader.get('add'), ". Hold shift key to keep menu open."), toggle: this.toggleAdd, isSelected: this.state.action === 'add', disabled: this.isDisabled }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.SubtractSvg, title: "".concat(ActionHeader.get('remove'), ". Hold shift key to keep menu open."), toggle: this.toggleRemove, isSelected: this.state.action === 'remove', disabled: this.isDisabled }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.IntersectSvg, title: "".concat(ActionHeader.get('intersect'), ". Hold shift key to keep menu open."), toggle: this.toggleIntersect, isSelected: this.state.action === 'intersect', disabled: this.isDisabled }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.SetSvg, title: "".concat(ActionHeader.get('set'), ". Hold shift key to keep menu open."), toggle: this.toggleSet, isSelected: this.state.action === 'set', disabled: this.isDisabled }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.BrushSvg, title: 'Apply Theme to Selection', toggle: this.toggleTheme, isSelected: this.state.action === 'theme', disabled: this.isDisabled, style: { marginLeft: '10px' } }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.CubeOutlineSvg, title: 'Create Component of Selection with Representation', toggle: this.toggleAddComponent, isSelected: this.state.action === 'add-component', disabled: this.isDisabled }), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.RemoveSvg, title: 'Remove/subtract Selection from all Components', onClick: this.subtract, disabled: this.isDisabled }), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.RestoreSvg, onClick: this.undo, disabled: !this.state.canUndo || this.isDisabled, title: undoTitle }), (0, jsx_runtime_1.jsx)(common_1.ToggleButton, { icon: icons_1.HelpOutlineSvg, title: 'Show/hide help', toggle: this.toggleHelp, style: { marginLeft: '10px' }, isSelected: this.state.action === 'help' }), (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.CancelOutlinedSvg, title: 'Turn selection mode off', onClick: this.turnOff })] })), children] });
     };
     return StructureSelectionActionsControls;
 }(base_1.PluginUIComponent));
 exports.StructureSelectionActionsControls = StructureSelectionActionsControls;
 var StructureSelectionStatsControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(StructureSelectionStatsControls, _super);
+    tslib_1.__extends(StructureSelectionStatsControls, _super);
     function StructureSelectionStatsControls() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.state = {
@@ -299,13 +299,13 @@ var StructureSelectionStatsControls = /** @class */ (function (_super) {
         var empty = stats.structureCount === 0 || stats.elementCount === 0;
         if (empty && this.props.hideOnEmpty)
             return null;
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsx)(common_1.Button, (0, tslib_1.__assign)({ noOverflow: true, onClick: this.focus, title: 'Click to Focus Selection', disabled: empty, onMouseEnter: this.highlight, onMouseLeave: this.clearHighlight, style: { textAlignLast: !empty ? 'left' : void 0 } }, { children: this.stats }), void 0), !empty && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.CancelOutlinedSvg, onClick: this.clear, title: 'Clear', className: 'msp-form-control', flex: true }, void 0)] }), void 0) }, void 0);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row' }, { children: [(0, jsx_runtime_1.jsx)(common_1.Button, tslib_1.__assign({ noOverflow: true, onClick: this.focus, title: 'Click to Focus Selection', disabled: empty, onMouseEnter: this.highlight, onMouseLeave: this.clearHighlight, style: { textAlignLast: !empty ? 'left' : void 0 } }, { children: this.stats })), !empty && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.CancelOutlinedSvg, onClick: this.clear, title: 'Clear', className: 'msp-form-control', flex: true })] })) });
     };
     return StructureSelectionStatsControls;
 }(base_1.PluginUIComponent));
 exports.StructureSelectionStatsControls = StructureSelectionStatsControls;
 var ApplyThemeControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(ApplyThemeControls, _super);
+    tslib_1.__extends(ApplyThemeControls, _super);
     function ApplyThemeControls() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this._params = (0, memoize_1.memoizeLatest)(function (pivot) { return component_1.StructureComponentManager.getThemeParams(_this.plugin, pivot); });
@@ -324,7 +324,7 @@ var ApplyThemeControls = /** @class */ (function (_super) {
         configurable: true
     });
     ApplyThemeControls.prototype.render = function () {
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: this.params, values: this.state.values, onChangeValues: this.paramsChanged }, void 0), (0, jsx_runtime_1.jsx)(common_1.Button, (0, tslib_1.__assign)({ icon: icons_1.BrushSvg, className: 'msp-btn-commit msp-btn-commit-on', onClick: this.apply, style: { marginTop: '1px' } }, { children: "Apply Theme" }), void 0)] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: this.params, values: this.state.values, onChangeValues: this.paramsChanged }), (0, jsx_runtime_1.jsx)(common_1.Button, tslib_1.__assign({ icon: icons_1.BrushSvg, className: 'msp-btn-commit msp-btn-commit-on', onClick: this.apply, style: { marginTop: '1px' } }, { children: "Apply Theme" }))] });
     };
     return ApplyThemeControls;
 }(base_1.PurePluginUIComponent));
@@ -349,5 +349,5 @@ function ResidueListSelectionHelper(_a) {
             plugin.log.error('Failed to create selection');
         }
     };
-    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: ResidueListIdTypeParams, values: state, onChangeValues: setState, onEnter: apply }, void 0), (0, jsx_runtime_1.jsxs)(common_1.Button, (0, tslib_1.__assign)({ className: 'msp-btn-commit msp-btn-commit-on', disabled: state.identifiers.trim().length === 0, onClick: apply, style: { marginTop: '1px' } }, { children: [(0, string_1.capitalize)(modifier), " Selection"] }), void 0)] }, void 0);
+    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: ResidueListIdTypeParams, values: state, onChangeValues: setState, onEnter: apply }), (0, jsx_runtime_1.jsxs)(common_1.Button, tslib_1.__assign({ className: 'msp-btn-commit msp-btn-commit-on', disabled: state.identifiers.trim().length === 0, onClick: apply, style: { marginTop: '1px' } }, { children: [(0, string_1.capitalize)(modifier), " Selection"] }))] });
 }

package/lib/commonjs/mol-plugin-ui/structure/source.js

@@ -21,7 +21,7 @@ var update_transform_1 = require("../state/update-transform");
 var focus_1 = require("./focus");
 var selection_1 = require("./selection");
 var StructureSourceControls = /** @class */ (function (_super) {
-    (0, tslib_1.__extends)(StructureSourceControls, _super);
+    tslib_1.__extends(StructureSourceControls, _super);
     function StructureSourceControls() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.item = function (ref) {
@@ -63,7 +63,7 @@ var StructureSourceControls = /** @class */ (function (_super) {
             var _a;
             if (t.models.length === 0)
                 return _this.item(t);
-            return (0, tslib_1.__spreadArray)([action_menu_1.ActionMenu.Header((_a = t.cell.obj) === null || _a === void 0 ? void 0 : _a.label)], t.models.map(_this.getModelItems), true);
+            return tslib_1.__spreadArray([action_menu_1.ActionMenu.Header((_a = t.cell.obj) === null || _a === void 0 ? void 0 : _a.label)], t.models.map(_this.getModelItems), true);
         };
         _this.getModelItems = function (m) {
             var _a, _b, _c;
@@ -74,7 +74,7 @@ var StructureSourceControls = /** @class */ (function (_super) {
                 var ref = m.structures[0];
                 return { label: "".concat((_a = m.cell.obj) === null || _a === void 0 ? void 0 : _a.label, " | ").concat((_b = ref.cell.obj) === null || _b === void 0 ? void 0 : _b.label), selected: selected.has(ref.cell.transform.ref), value: [m, ref] };
             }
-            return (0, tslib_1.__spreadArray)([action_menu_1.ActionMenu.Header((_c = m.cell.obj) === null || _c === void 0 ? void 0 : _c.label)], m.structures.map(_this.item), true);
+            return tslib_1.__spreadArray([action_menu_1.ActionMenu.Header((_c = m.cell.obj) === null || _c === void 0 ? void 0 : _c.label)], m.structures.map(_this.item), true);
         };
         _this.selectHierarchy = function (items) {
             if (!items || items.length === 0)
@@ -133,12 +133,12 @@ var StructureSourceControls = /** @class */ (function (_super) {
             var current = mng.current;
             var ret = [];
             if (current.trajectories.length > 1) {
-                ret.push((0, tslib_1.__spreadArray)([
+                ret.push(tslib_1.__spreadArray([
                     action_menu_1.ActionMenu.Header('Trajectories')
                 ], current.trajectories.map(this.item), true));
             }
             if (current.models.length > 1 || current.trajectories.length > 1) {
-                ret.push((0, tslib_1.__spreadArray)([
+                ret.push(tslib_1.__spreadArray([
                     action_menu_1.ActionMenu.Header('Models')
                 ], current.models.map(this.item), true));
             }
@@ -146,7 +146,7 @@ var StructureSourceControls = /** @class */ (function (_super) {
                 ret.push.apply(ret, current.structures.map(this.item));
             }
             else if (current.structures.length > 0) {
-                ret.push((0, tslib_1.__spreadArray)([
+                ret.push(tslib_1.__spreadArray([
                     action_menu_1.ActionMenu.Header('Structures')
                 ], current.structures.map(this.item), true));
             }
@@ -250,9 +250,9 @@ var StructureSourceControls = /** @class */ (function (_super) {
         configurable: true
     });
     StructureSourceControls.prototype._updateStructureModel = function () {
-        return (0, tslib_1.__awaiter)(this, void 0, void 0, function () {
+        return tslib_1.__awaiter(this, void 0, void 0, function () {
             var params, selection, m;
-            return (0, tslib_1.__generator)(this, function (_a) {
+            return tslib_1.__generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         if (!this.updateModelQueueParams || this.isUpdatingModel)
@@ -292,7 +292,7 @@ var StructureSourceControls = /** @class */ (function (_super) {
             var params = (_a = m.cell.params) === null || _a === void 0 ? void 0 : _a.definition;
             if (!params)
                 return null;
-            return (0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: params, values: (_b = m.cell.params) === null || _b === void 0 ? void 0 : _b.values, onChangeValues: this.updateStructureModel, isDisabled: this.state.isBusy }, void 0);
+            return (0, jsx_runtime_1.jsx)(parameters_1.ParameterControls, { params: params, values: (_b = m.cell.params) === null || _b === void 0 ? void 0 : _b.values, onChangeValues: this.updateStructureModel, isDisabled: this.state.isBusy });
         },
         enumerable: false,
         configurable: true
@@ -307,7 +307,7 @@ var StructureSourceControls = /** @class */ (function (_super) {
             var params = (_a = s.cell.params) === null || _a === void 0 ? void 0 : _a.definition;
             if (!params || !s.cell.parent)
                 return null;
-            return (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: s.cell.parent, transform: s.cell.transform, customHeader: 'none', customUpdate: this.updateStructure, noMargin: true, autoHideApply: true }, void 0);
+            return (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: s.cell.parent, transform: s.cell.transform, customHeader: 'none', customUpdate: this.updateStructure, noMargin: true, autoHideApply: true });
         },
         enumerable: false,
         configurable: true
@@ -323,7 +323,7 @@ var StructureSourceControls = /** @class */ (function (_super) {
             var t = mol_state_1.StateSelection.tryFindDecorator(this.plugin.state.data, pivot.cell.transform.ref, transforms_1.StateTransforms.Model.TransformStructureConformation);
             if (!t)
                 return;
-            return (0, jsx_runtime_1.jsx)(common_1.ExpandGroup, (0, tslib_1.__assign)({ header: "Conformation Transform" }, { children: (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: t.parent, transform: t.transform, customHeader: 'none', noMargin: true, autoHideApply: true }, void 0) }), void 0);
+            return (0, jsx_runtime_1.jsx)(common_1.ExpandGroup, tslib_1.__assign({ header: "Conformation Transform" }, { children: (0, jsx_runtime_1.jsx)(update_transform_1.UpdateTransformControl, { state: t.parent, transform: t.transform, customHeader: 'none', noMargin: true, autoHideApply: true }) }));
         },
         enumerable: false,
         configurable: true
@@ -332,7 +332,7 @@ var StructureSourceControls = /** @class */ (function (_super) {
         var disabled = this.state.isBusy || this.isEmpty;
         var presets = this.presetActions;
         var label = this.label;
-        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'msp-flex-row', style: { marginTop: '1px' } }, { children: [(0, jsx_runtime_1.jsx)(common_1.Button, (0, tslib_1.__assign)({ noOverflow: true, flex: true, onClick: this.toggleHierarchy, disabled: disabled, title: label }, { children: label }), void 0), presets.length > 0 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.BookmarksOutlinedSvg, className: 'msp-form-control', flex: '40px', onClick: this.togglePreset, title: 'Apply a structure presets to the current hierarchy.', toggleState: this.state.show === 'presets', disabled: disabled }, void 0)] }), void 0), this.state.show === 'hierarchy' && (0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.hierarchyItems, onSelect: this.selectHierarchy, multiselect: true }, void 0), this.state.show === 'presets' && (0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: presets, onSelect: this.applyPreset }, void 0), this.modelIndex, this.structureType, this.transform, (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ style: { marginTop: '6px' } }, { children: [(0, jsx_runtime_1.jsx)(focus_1.StructureFocusControls, {}, void 0), (0, jsx_runtime_1.jsx)(selection_1.StructureSelectionStatsControls, { hideOnEmpty: true }, void 0)] }), void 0)] }, void 0);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: 'msp-flex-row', style: { marginTop: '1px' } }, { children: [(0, jsx_runtime_1.jsx)(common_1.Button, tslib_1.__assign({ noOverflow: true, flex: true, onClick: this.toggleHierarchy, disabled: disabled, title: label }, { children: label })), presets.length > 0 && (0, jsx_runtime_1.jsx)(common_1.IconButton, { svg: icons_1.BookmarksOutlinedSvg, className: 'msp-form-control', flex: '40px', onClick: this.togglePreset, title: 'Apply a structure presets to the current hierarchy.', toggleState: this.state.show === 'presets', disabled: disabled })] })), this.state.show === 'hierarchy' && (0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: this.hierarchyItems, onSelect: this.selectHierarchy, multiselect: true }), this.state.show === 'presets' && (0, jsx_runtime_1.jsx)(action_menu_1.ActionMenu, { items: presets, onSelect: this.applyPreset }), this.modelIndex, this.structureType, this.transform, (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ style: { marginTop: '6px' } }, { children: [(0, jsx_runtime_1.jsx)(focus_1.StructureFocusControls, {}), (0, jsx_runtime_1.jsx)(selection_1.StructureSelectionStatsControls, { hideOnEmpty: true })] }))] });
     };
     return StructureSourceControls;
 }(base_1.CollapsableControls));