molstar
Version:
A comprehensive macromolecular library.
104 lines (103 loc) • 5.17 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CollapsableControls = exports.PurePluginUIComponent = exports.PluginUIComponent = exports.PluginReactContext = void 0;
var tslib_1 = require("tslib");
var jsx_runtime_1 = require("react/jsx-runtime");
/**
* Copyright (c) 2018-2020 mol* contributors, licensed under MIT, See LICENSE file for more info.
*
* @author David Sehnal <david.sehnal@gmail.com>
* @author Alexander Rose <alexander.rose@weirdbyte.de>
*/
var React = tslib_1.__importStar(require("react"));
var common_1 = require("./controls/common");
var icons_1 = require("./controls/icons");
exports.PluginReactContext = React.createContext(void 0);
var PluginUIComponent = /** @class */ (function (_super) {
tslib_1.__extends(PluginUIComponent, _super);
function PluginUIComponent(props, context) {
var _this = _super.call(this, props) || this;
_this.subs = void 0;
_this.plugin = context;
if (_this.init)
_this.init();
return _this;
}
PluginUIComponent.prototype.subscribe = function (obs, action) {
if (typeof this.subs === 'undefined')
this.subs = [];
this.subs.push(obs.subscribe(action));
};
PluginUIComponent.prototype.componentWillUnmount = function () {
if (!this.subs)
return;
for (var _i = 0, _a = this.subs; _i < _a.length; _i++) {
var s = _a[_i];
s.unsubscribe();
}
this.subs = void 0;
};
PluginUIComponent.contextType = exports.PluginReactContext;
return PluginUIComponent;
}(React.Component));
exports.PluginUIComponent = PluginUIComponent;
var PurePluginUIComponent = /** @class */ (function (_super) {
tslib_1.__extends(PurePluginUIComponent, _super);
function PurePluginUIComponent(props, context) {
var _this = _super.call(this, props, context) || this;
_this.subs = void 0;
_this.plugin = context;
if (_this.init)
_this.init();
return _this;
}
PurePluginUIComponent.prototype.subscribe = function (obs, action) {
if (typeof this.subs === 'undefined')
this.subs = [];
this.subs.push(obs.subscribe(action));
};
PurePluginUIComponent.prototype.componentWillUnmount = function () {
if (!this.subs)
return;
for (var _i = 0, _a = this.subs; _i < _a.length; _i++) {
var s = _a[_i];
s.unsubscribe();
}
this.subs = void 0;
};
PurePluginUIComponent.contextType = exports.PluginReactContext;
return PurePluginUIComponent;
}(React.PureComponent));
exports.PurePluginUIComponent = PurePluginUIComponent;
var CollapsableControls = /** @class */ (function (_super) {
tslib_1.__extends(CollapsableControls, _super);
function CollapsableControls(props, context) {
var _this = _super.call(this, props, context) || this;
_this.toggleCollapsed = function () {
_this.setState({ isCollapsed: !_this.state.isCollapsed });
};
var state = _this.defaultState();
if (props.initiallyCollapsed !== undefined)
state.isCollapsed = props.initiallyCollapsed;
if (props.header !== undefined)
state.header = props.header;
_this.state = state;
return _this;
}
CollapsableControls.prototype.componentDidUpdate = function (prevProps) {
if (this.props.initiallyCollapsed !== undefined && prevProps.initiallyCollapsed !== this.props.initiallyCollapsed) {
this.setState({ isCollapsed: this.props.initiallyCollapsed });
}
};
CollapsableControls.prototype.render = function () {
var _a;
if (this.state.isHidden)
return null;
var wrapClass = this.state.isCollapsed
? 'msp-transform-wrapper msp-transform-wrapper-collapsed'
: 'msp-transform-wrapper';
return (0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: wrapClass }, { children: [(0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ className: 'msp-transform-header' }, { children: (0, jsx_runtime_1.jsxs)(common_1.Button, tslib_1.__assign({ icon: this.state.brand ? void 0 : this.state.isCollapsed ? icons_1.ArrowRightSvg : icons_1.ArrowDropDownSvg, noOverflow: true, onClick: this.toggleCollapsed, className: this.state.brand ? "msp-transform-header-brand msp-transform-header-brand-".concat(this.state.brand.accent) : void 0, title: "Click to ".concat(this.state.isCollapsed ? 'expand' : 'collapse') }, { children: [(0, jsx_runtime_1.jsx)(icons_1.Icon, { svg: (_a = this.state.brand) === null || _a === void 0 ? void 0 : _a.svg, inline: true }), this.state.header, (0, jsx_runtime_1.jsx)("small", tslib_1.__assign({ style: { margin: '0 6px' } }, { children: this.state.isCollapsed ? '' : this.state.description }))] })) })), !this.state.isCollapsed && this.renderControls()] }));
};
return CollapsableControls;
}(PluginUIComponent));
exports.CollapsableControls = CollapsableControls;