pdbe-molstar 3.2.1-beta.1 → 3.2.1-beta.3

package/lib/index(light).js

@@ -1,1237 +1,9 @@
 "use strict";
+/** Entrypoint for the bundler. If you want to import PDBeMolstarPlugin without CSS, import from ./viewer instead. */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PDBeMolstarPlugin = void 0;
 var tslib_1 = require("tslib");
-var geo_export_1 = require("Molstar/extensions/geo-export");
-var behavior_1 = require("Molstar/extensions/model-archive/quality-assessment/behavior");
-var mp4_export_1 = require("Molstar/extensions/mp4-export");
-var behavior_2 = require("Molstar/extensions/mvs/behavior");
-var custom_tooltips_prop_1 = require("Molstar/extensions/mvs/components/custom-tooltips-prop");
-var pdbe_1 = require("Molstar/extensions/pdbe");
-var behavior_3 = require("Molstar/extensions/rcsb/assembly-symmetry/behavior");
-var loci_1 = require("Molstar/mol-model/loci");
-var structure_1 = require("Molstar/mol-model/structure");
-var assembly_unwind_1 = require("Molstar/mol-plugin-state/animation/built-in/assembly-unwind");
-var camera_rock_1 = require("Molstar/mol-plugin-state/animation/built-in/camera-rock");
-var camera_spin_1 = require("Molstar/mol-plugin-state/animation/built-in/camera-spin");
-var model_index_1 = require("Molstar/mol-plugin-state/animation/built-in/model-index");
-var spin_structure_1 = require("Molstar/mol-plugin-state/animation/built-in/spin-structure");
-var state_interpolation_1 = require("Molstar/mol-plugin-state/animation/built-in/state-interpolation");
-var state_snapshots_1 = require("Molstar/mol-plugin-state/animation/built-in/state-snapshots");
-var structure_overpaint_1 = require("Molstar/mol-plugin-state/helpers/structure-overpaint");
-var structure_representation_params_1 = require("Molstar/mol-plugin-state/helpers/structure-representation-params");
-var objects_1 = require("Molstar/mol-plugin-state/objects");
-var transforms_1 = require("Molstar/mol-plugin-state/transforms");
-var model_1 = require("Molstar/mol-plugin-state/transforms/model");
-var representation_1 = require("Molstar/mol-plugin-state/transforms/representation");
-var react18_1 = require("Molstar/mol-plugin-ui/react18");
-var camera_1 = require("Molstar/mol-plugin/behavior/dynamic/camera");
-var representation_2 = require("Molstar/mol-plugin/behavior/dynamic/representation");
-var structure_focus_representation_1 = require("Molstar/mol-plugin/behavior/dynamic/selection/structure-focus-representation");
-var transformers_1 = require("Molstar/mol-plugin/behavior/dynamic/volume-streaming/transformers");
-var commands_1 = require("Molstar/mol-plugin/commands");
-var config_1 = require("Molstar/mol-plugin/config");
-var layout_1 = require("Molstar/mol-plugin/layout");
-var spec_1 = require("Molstar/mol-plugin/spec");
-var mol_state_1 = require("Molstar/mol-state");
-var element_symbol_1 = require("Molstar/mol-theme/color/element-symbol");
-var assets_1 = require("Molstar/mol-util/assets");
-var color_1 = require("Molstar/mol-util/color/color");
-var names_1 = require("Molstar/mol-util/color/names");
-var rx_event_helper_1 = require("Molstar/mol-util/rx-event-helper");
-var custom_events_1 = require("./custom-events");
-var behavior_4 = require("./domain-annotations/behavior");
-var Foldseek = tslib_1.__importStar(require("./extensions/foldseek"));
-var helpers_1 = require("./helpers");
-var overlay_1 = require("./overlay");
-var plugin_custom_state_1 = require("./plugin-custom-state");
-var spec_2 = require("./spec");
-var spec_from_html_1 = require("./spec-from-html");
-var subscribe_events_1 = require("./subscribe-events");
-var superposition_1 = require("./superposition");
-var superposition_focus_representation_1 = require("./superposition-focus-representation");
-var pdbe_left_panel_1 = require("./ui/pdbe-left-panel");
-var pdbe_structure_controls_1 = require("./ui/pdbe-structure-controls");
-var pdbe_viewport_controls_1 = require("./ui/pdbe-viewport-controls");
-var superposition_viewport_1 = require("./ui/superposition-viewport");
-require("Molstar/mol-plugin-ui/skin/light.scss");
-require("./overlay.scss");
-var PDBeMolstarPlugin = /** @class */ (function () {
-    function PDBeMolstarPlugin() {
-        var _this = this;
-        this._ev = rx_event_helper_1.RxEventHelper.create();
-        this.events = {
-            loadComplete: this._ev()
-        };
-        this.assemblyRef = '';
-        this.isHighlightColorUpdated = false;
-        this.isSelectedColorUpdated = false;
-        /** Keeps track of representations added by `.visual.select` for each structure. */
-        this.addedReprs = {};
-        /** Maps structure IDs (assigned when loading) to cell refs. */
-        this.structureRefMap = new Map();
-        this.applyVisualParams = function () {
-            var _a;
-            var componentGroups = _this.plugin.managers.structure.hierarchy.currentComponentGroups;
-            var _loop_1 = function (compGroup) {
-                var compRef = compGroup[compGroup.length - 1];
-                var tag = (_a = compRef.key) !== null && _a !== void 0 ? _a : '';
-                var remove = _this.initParams.hideStructure.some(function (type) { var _a; return (_a = helpers_1.StructureComponentTags[type]) === null || _a === void 0 ? void 0 : _a.includes(tag); });
-                if (remove) {
-                    _this.plugin.managers.structure.hierarchy.remove([compRef]);
-                }
-                if (!remove && _this.initParams.visualStyle) {
-                    if (compRef && compRef.representations) {
-                        compRef.representations.forEach(function (rep) {
-                            var currentParams = (0, structure_representation_params_1.createStructureRepresentationParams)(_this.plugin, void 0, { type: _this.initParams.visualStyle });
-                            _this.plugin.managers.structure.component.updateRepresentations([compRef], rep, currentParams);
-                        });
-                    }
-                }
-            };
-            for (var _i = 0, componentGroups_1 = componentGroups; _i < componentGroups_1.length; _i++) {
-                var compGroup = componentGroups_1[_i];
-                _loop_1(compGroup);
-            }
-        };
-        /** Helper methods related to canvas and layout */
-        this.canvas = {
-            /** Set canvas background color. */
-            setBgColor: function (color) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            if (!color)
-                                return [2 /*return*/];
-                            return [4 /*yield*/, this.canvas.applySettings({ color: color })];
-                        case 1:
-                            _a.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Set controls panel visibility. Without `isVisible` parameter, toggle controls panel visibility. */
-            toggleControls: function (isVisible) {
-                if (typeof isVisible === 'undefined')
-                    isVisible = !_this.plugin.layout.state.showControls;
-                commands_1.PluginCommands.Layout.Update(_this.plugin, { state: { showControls: isVisible } });
-            },
-            /** Set full-screen mode on or off. Without `isExpanded` parameter, toggle full-screen mode. */
-            toggleExpanded: function (isExpanded) {
-                if (typeof isExpanded === 'undefined')
-                    isExpanded = !_this.plugin.layout.state.isExpanded;
-                commands_1.PluginCommands.Layout.Update(_this.plugin, { state: { isExpanded: isExpanded } });
-            },
-            applySettings: function (settings) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var renderer;
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            if (!settings)
-                                return [2 /*return*/];
-                            if (!this.plugin.canvas3d)
-                                return [2 /*return*/];
-                            renderer = tslib_1.__assign({}, this.plugin.canvas3d.props.renderer);
-                            if (settings.color) {
-                                renderer.backgroundColor = color_1.Color.fromRgb(settings.color.r, settings.color.g, settings.color.b);
-                            }
-                            if (settings.lighting) {
-                                renderer.style = { name: settings.lighting }; // I don't think this does anything and I don't see how it could ever have worked
-                            }
-                            return [4 /*yield*/, commands_1.PluginCommands.Canvas3D.SetSettings(this.plugin, { settings: { renderer: renderer } })];
-                        case 1:
-                            _a.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-        };
-        /** Helper methods related to 3D visuals */
-        this.visual = {
-            /** Change the visibility of individual entity visuals */
-            visibility: function (data) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var _a, _b, _c, _i, visual, requiredVisibility, tags, _d, tags_1, tag, componentRef, compVisual, currentlyVisible;
-                var _e;
-                return tslib_1.__generator(this, function (_f) {
-                    switch (_f.label) {
-                        case 0:
-                            if (!data)
-                                return [2 /*return*/];
-                            _a = data;
-                            _b = [];
-                            for (_c in _a)
-                                _b.push(_c);
-                            _i = 0;
-                            _f.label = 1;
-                        case 1:
-                            if (!(_i < _b.length)) return [3 /*break*/, 6];
-                            _c = _b[_i];
-                            if (!(_c in _a)) return [3 /*break*/, 5];
-                            visual = _c;
-                            requiredVisibility = data[visual];
-                            if (requiredVisibility === undefined)
-                                return [3 /*break*/, 5];
-                            tags = (_e = helpers_1.StructureComponentTags[visual]) !== null && _e !== void 0 ? _e : [];
-                            _d = 0, tags_1 = tags;
-                            _f.label = 2;
-                        case 2:
-                            if (!(_d < tags_1.length)) return [3 /*break*/, 5];
-                            tag = tags_1[_d];
-                            componentRef = mol_state_1.StateSelection.findTagInSubtree(this.plugin.state.data.tree, mol_state_1.StateTransform.RootRef, tag);
-                            if (!componentRef) return [3 /*break*/, 4];
-                            compVisual = this.plugin.state.data.select(componentRef)[0];
-                            if (!(compVisual && compVisual.obj)) return [3 /*break*/, 4];
-                            currentlyVisible = !(compVisual.state && compVisual.state.isHidden);
-                            if (!(currentlyVisible !== requiredVisibility)) return [3 /*break*/, 4];
-                            return [4 /*yield*/, commands_1.PluginCommands.State.ToggleVisibility(this.plugin, { state: this.state, ref: componentRef })];
-                        case 3:
-                            _f.sent();
-                            _f.label = 4;
-                        case 4:
-                            _d++;
-                            return [3 /*break*/, 2];
-                        case 5:
-                            _i++;
-                            return [3 /*break*/, 1];
-                        case 6: return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Change the visibility of a structure.
-             * `structureNumberOrId` is either index (numbered from 1!) or the ID that was provided when loading the structure.
-             * If `visibility` is undefined, toggle current visibility state. */
-            structureVisibility: function (structureNumberOrId, visibility) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var struct, currentVisibility;
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            struct = this.getStructure(structureNumberOrId);
-                            if (!struct) {
-                                console.error("Cannot change visibility of structure ".concat(structureNumberOrId, ": structure not found."));
-                                return [2 /*return*/];
-                            }
-                            currentVisibility = !struct.cell.state.isHidden;
-                            if (!(visibility !== currentVisibility)) return [3 /*break*/, 2];
-                            return [4 /*yield*/, commands_1.PluginCommands.State.ToggleVisibility(this.plugin, { state: this.state, ref: struct.cell.transform.ref })];
-                        case 1:
-                            _a.sent();
-                            _a.label = 2;
-                        case 2: return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** With `isSpinning` parameter, switch visual rotation on or off. Without `isSpinning` parameter, toggle rotation. If `resetCamera`, also reset the camera zoom. */
-            toggleSpin: function (isSpinning, resetCamera) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var trackball, toggleSpinParam;
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            if (!this.plugin.canvas3d)
-                                return [2 /*return*/];
-                            trackball = this.plugin.canvas3d.props.trackball;
-                            toggleSpinParam = trackball.animate.name === 'spin' ? { name: 'off', params: {} } : { name: 'spin', params: { speed: 1 } };
-                            if (typeof isSpinning !== 'undefined') {
-                                toggleSpinParam = { name: 'off', params: {} };
-                                if (isSpinning)
-                                    toggleSpinParam = { name: 'spin', params: { speed: 1 } };
-                            }
-                            return [4 /*yield*/, commands_1.PluginCommands.Canvas3D.SetSettings(this.plugin, { settings: { trackball: tslib_1.__assign(tslib_1.__assign({}, trackball), { animate: toggleSpinParam }) } })];
-                        case 1:
-                            _a.sent();
-                            if (!resetCamera) return [3 /*break*/, 3];
-                            return [4 /*yield*/, commands_1.PluginCommands.Camera.Reset(this.plugin, {})];
-                        case 2:
-                            _a.sent();
-                            _a.label = 3;
-                        case 3: return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Focus (zoom) on the part of the structure defined by `selection`.
-             * If `selection` contains more items, focus on the union of those.
-             * If `structureNumber` is provided, use the specified structure (numbered from 1!); otherwise use the last added structure. */
-            focus: function (selection, structureNumber) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var loci;
-                return tslib_1.__generator(this, function (_a) {
-                    loci = this.getLociForParams(selection, structureNumber);
-                    this.plugin.managers.camera.focusLoci(loci);
-                    return [2 /*return*/];
-                });
-            }); },
-            /** Trigger highlight on the part of the structure defined by `data`
-             * (this will look the same as when the user hovers over a part of the structure).
-             * If `focus`, also zoom on the highlighted part.
-             * If `structureNumber` is provided, use the specified structure (numbered from 1!); otherwise use the last added structure. */
-            highlight: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var loci;
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            loci = this.getLociForParams(params.data, params.structureNumber);
-                            if (loci_1.Loci.isEmpty(loci))
-                                return [2 /*return*/];
-                            if (!params.color) return [3 /*break*/, 2];
-                            return [4 /*yield*/, this.visual.setColor({ highlight: params.color })];
-                        case 1:
-                            _a.sent();
-                            _a.label = 2;
-                        case 2:
-                            this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci });
-                            if (params.focus)
-                                this.plugin.managers.camera.focusLoci(loci);
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Remove any current highlight and reset the highlight color to its default value. */
-            clearHighlight: function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            this.plugin.managers.interactivity.lociHighlights.highlightOnly({ loci: loci_1.EmptyLoci });
-                            if (!this.isHighlightColorUpdated) return [3 /*break*/, 2];
-                            return [4 /*yield*/, this.visual.reset({ highlightColor: true })];
-                        case 1:
-                            _a.sent();
-                            _a.label = 2;
-                        case 2: return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Color the parts of the structure defined by `data`. Color the rest of the structure in `nonSelectedColor` if provided.
-             * If any items in `data` contain `focus`, zoom to the union of these items.
-             * If any items in `data` contain `sideChain` or `representation`, add extra representations to them (colored in `representationColor` if provided).
-             * If `structureNumber` is provided, apply to the specified structure (numbered from 1!); otherwise apply to all loaded structures.
-             * Remove any previously added coloring and extra representations, unless `keepColors` and/or `keepRepresentations` is set. */
-            select: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var structureNumberOrId, structures, addedReprParams, _i, _a, param, repr, DefaultSelectColor, focusLoci, _b, structures_1, struct, selections, _c, selections_1, selection, overpaintLayers, wholeStructBundle, _d, _e, _f, _g, repr, bundle, overpaintLayers_1;
-                var _this = this;
-                var _h, _j, _k, _l;
-                return tslib_1.__generator(this, function (_m) {
-                    switch (_m.label) {
-                        case 0:
-                            structureNumberOrId = (_h = params.structureId) !== null && _h !== void 0 ? _h : params.structureNumber;
-                            return [4 /*yield*/, this.visual.clearSelection(structureNumberOrId, { keepColors: params.keepColors, keepRepresentations: params.keepRepresentations })];
-                        case 1:
-                            _m.sent();
-                            structures = this.getStructures(structureNumberOrId);
-                            addedReprParams = {};
-                            for (_i = 0, _a = params.data; _i < _a.length; _i++) {
-                                param = _a[_i];
-                                repr = (_j = param.representation) !== null && _j !== void 0 ? _j : (param.sideChain ? 'ball-and-stick' : undefined);
-                                if (repr) {
-                                    ((_k = addedReprParams[repr]) !== null && _k !== void 0 ? _k : (addedReprParams[repr] = [])).push(param);
-                                }
-                            }
-                            DefaultSelectColor = color_1.Color.fromRgb(255, 112, 3);
-                            focusLoci = [];
-                            _b = 0, structures_1 = structures;
-                            _m.label = 2;
-                        case 2:
-                            if (!(_b < structures_1.length)) return [3 /*break*/, 8];
-                            struct = structures_1[_b];
-                            selections = this.getSelections(params.data, struct.number);
-                            for (_c = 0, selections_1 = selections; _c < selections_1.length; _c++) {
-                                selection = selections_1[_c];
-                                if (selection.param.focus) {
-                                    focusLoci.push(selection.loci);
-                                }
-                            }
-                            overpaintLayers = selections
-                                .filter(function (s) { return s.param.color !== null; })
-                                .map(function (s) { return ({
-                                bundle: s.bundle,
-                                color: s.param.color ? _this.normalizeColor(s.param.color) : DefaultSelectColor,
-                                clear: false,
-                            }); });
-                            if (params.nonSelectedColor) {
-                                wholeStructBundle = this.getBundle([{}], struct.number);
-                                if (wholeStructBundle) {
-                                    overpaintLayers.unshift({
-                                        bundle: wholeStructBundle,
-                                        color: this.normalizeColor(params.nonSelectedColor),
-                                        clear: false,
-                                    });
-                                }
-                            }
-                            return [4 /*yield*/, (0, helpers_1.applyOverpaint)(this.plugin, struct.structureRef, overpaintLayers)];
-                        case 3:
-                            _m.sent();
-                            _d = addedReprParams;
-                            _e = [];
-                            for (_f in _d)
-                                _e.push(_f);
-                            _g = 0;
-                            _m.label = 4;
-                        case 4:
-                            if (!(_g < _e.length)) return [3 /*break*/, 7];
-                            _f = _e[_g];
-                            if (!(_f in _d)) return [3 /*break*/, 6];
-                            repr = _f;
-                            bundle = this.getBundle(addedReprParams[repr], struct.number);
-                            if (!bundle)
-                                return [3 /*break*/, 6];
-                            overpaintLayers_1 = selections.filter(function (s) { return s.param.representationColor; }).map(function (s) { return ({
-                                bundle: s.bundle,
-                                color: _this.normalizeColor(s.param.representationColor),
-                                clear: false,
-                            }); });
-                            return [4 /*yield*/, this.plugin.build()
-                                    .to(struct.structureRef.cell)
-                                    .apply(model_1.StructureComponent, { type: { name: 'bundle', params: bundle }, label: repr }, { tags: helpers_1.Tags.AddedComponent })
-                                    .apply(representation_1.StructureRepresentation3D, (0, structure_representation_params_1.createStructureRepresentationParams)(this.plugin, (_l = struct.structureRef.cell.obj) === null || _l === void 0 ? void 0 : _l.data, { type: repr }))
-                                    .apply(transforms_1.StateTransforms.Representation.OverpaintStructureRepresentation3DFromBundle, { layers: overpaintLayers_1 }, { tags: helpers_1.Tags.Overpaint })
-                                    .commit()];
-                        case 5:
-                            _m.sent();
-                            // Track that reprs have been added (for later clearSelection)
-                            this.addedReprs[struct.number] = true;
-                            _m.label = 6;
-                        case 6:
-                            _g++;
-                            return [3 /*break*/, 4];
-                        case 7:
-                            _b++;
-                            return [3 /*break*/, 2];
-                        case 8:
-                            // Apply focus
-                            if (focusLoci.length > 0) {
-                                this.plugin.managers.camera.focusLoci(focusLoci);
-                            }
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Remove any coloring and extra representations previously added by the `select` method.
-             * If `structureNumber` is provided, apply to the specified structure (numbered from 1!); otherwise apply to all loaded structures.
-             * If `keepColors`, current residue coloring is preserved. If `keepRepresentations`, current added representations are preserved. */
-            clearSelection: function (structureNumberOrId, options) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var structures, _i, structures_2, struct, componentsToClear, componentsToDelete, update, _a, componentsToDelete_1, comp;
-                return tslib_1.__generator(this, function (_b) {
-                    switch (_b.label) {
-                        case 0:
-                            structures = this.getStructures(structureNumberOrId);
-                            _i = 0, structures_2 = structures;
-                            _b.label = 1;
-                        case 1:
-                            if (!(_i < structures_2.length)) return [3 /*break*/, 6];
-                            struct = structures_2[_i];
-                            if (!!(options === null || options === void 0 ? void 0 : options.keepColors)) return [3 /*break*/, 3];
-                            componentsToClear = struct.structureRef.components.filter(function (c) { var _a; return !((_a = c.cell.transform.tags) === null || _a === void 0 ? void 0 : _a.includes(helpers_1.Tags.AddedComponent)); });
-                            return [4 /*yield*/, (0, structure_overpaint_1.clearStructureOverpaint)(this.plugin, componentsToClear)];
-                        case 2:
-                            _b.sent();
-                            _b.label = 3;
-                        case 3:
-                            if (!!(options === null || options === void 0 ? void 0 : options.keepRepresentations)) return [3 /*break*/, 5];
-                            if (!this.addedReprs[struct.number]) return [3 /*break*/, 5];
-                            componentsToDelete = struct.structureRef.components.filter(function (comp) { var _a; return (_a = comp.cell.transform.tags) === null || _a === void 0 ? void 0 : _a.includes(helpers_1.Tags.AddedComponent); });
-                            update = this.plugin.build();
-                            for (_a = 0, componentsToDelete_1 = componentsToDelete; _a < componentsToDelete_1.length; _a++) {
-                                comp = componentsToDelete_1[_a];
-                                update.delete(comp.cell.transform.ref);
-                            }
-                            return [4 /*yield*/, update.commit()];
-                        case 4:
-                            _b.sent();
-                            delete this.addedReprs[struct.number];
-                            _b.label = 5;
-                        case 5:
-                            _i++;
-                            return [3 /*break*/, 1];
-                        case 6: return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Add interactive tooltips to parts of the structure. The added tooltips will be shown on a separate line in the tooltip box.
-             * Repeated call to this function removes any previously added tooltips.
-             * `structureNumber` counts from 1; if not provided, tooltips will be applied to all loaded structures.
-             * Example: `await this.visual.tooltips({ data: [{ struct_asym_id: 'A', tooltip: 'Chain A' }, { struct_asym_id: 'B', tooltip: 'Chain B' }] });`. */
-            tooltips: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var structures, _loop_2, this_1, _i, structures_3, struct;
-                var _a;
-                return tslib_1.__generator(this, function (_b) {
-                    switch (_b.label) {
-                        case 0:
-                            structures = this.getStructures((_a = params.structureId) !== null && _a !== void 0 ? _a : params.structureNumber);
-                            _loop_2 = function (struct) {
-                                var selections, customTooltipProps, structRef, customPropsCells;
-                                return tslib_1.__generator(this, function (_c) {
-                                    switch (_c.label) {
-                                        case 0:
-                                            selections = this_1.getSelections(params.data, struct.number);
-                                            customTooltipProps = {
-                                                tooltips: selections.map(function (s) { var _a; return ({ text: (_a = s.param.tooltip) !== null && _a !== void 0 ? _a : '', selector: { name: 'bundle', params: s.bundle } }); }),
-                                            };
-                                            structRef = struct.structureRef.cell.transform.ref;
-                                            customPropsCells = this_1.plugin.state.data.select(mol_state_1.StateSelection.Generators.ofTransformer(model_1.CustomStructureProperties, structRef));
-                                            if (!(customPropsCells.length === 0)) return [3 /*break*/, 2];
-                                            return [4 /*yield*/, this_1.plugin.build().to(structRef).apply(model_1.CustomStructureProperties).commit()];
-                                        case 1:
-                                            _c.sent();
-                                            customPropsCells = this_1.plugin.state.data.select(mol_state_1.StateSelection.Generators.ofTransformer(model_1.CustomStructureProperties, structRef));
-                                            _c.label = 2;
-                                        case 2: return [4 /*yield*/, this_1.plugin.build().to(customPropsCells[0]).update(function (old) {
-                                                var _a;
-                                                return ({
-                                                    properties: tslib_1.__assign(tslib_1.__assign({}, old.properties), (_a = {}, _a[custom_tooltips_prop_1.CustomTooltipsProvider.descriptor.name] = customTooltipProps, _a)),
-                                                    autoAttach: old.autoAttach.includes(custom_tooltips_prop_1.CustomTooltipsProvider.descriptor.name) ?
-                                                        old.autoAttach
-                                                        : tslib_1.__spreadArray(tslib_1.__spreadArray([], old.autoAttach, true), [custom_tooltips_prop_1.CustomTooltipsProvider.descriptor.name], false),
-                                                });
-                                            }).commit()];
-                                        case 3:
-                                            _c.sent();
-                                            return [2 /*return*/];
-                                    }
-                                });
-                            };
-                            this_1 = this;
-                            _i = 0, structures_3 = structures;
-                            _b.label = 1;
-                        case 1:
-                            if (!(_i < structures_3.length)) return [3 /*break*/, 4];
-                            struct = structures_3[_i];
-                            return [5 /*yield**/, _loop_2(struct)];
-                        case 2:
-                            _b.sent();
-                            _b.label = 3;
-                        case 3:
-                            _i++;
-                            return [3 /*break*/, 1];
-                        case 4: return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Remove any custom tooltips added by the `tooltips` method. */
-            clearTooltips: function (structureNumberOrId) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, this.visual.tooltips({ data: [], structureId: structureNumberOrId })];
-                        case 1:
-                            _a.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Set highlight and/or selection color.
-             * Highlight color is used when the user hovers over a part of the structure or when applying the `highlight` method.
-             * Selection color is used when creating selections with Selection Mode (the mouse cursor icon) and is not related to the color used by the `select` method. */
-            setColor: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var renderer, marking;
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            if (!this.plugin.canvas3d)
-                                return [2 /*return*/];
-                            if (!params.highlight && !params.select)
-                                return [2 /*return*/];
-                            renderer = tslib_1.__assign({}, this.plugin.canvas3d.props.renderer);
-                            marking = tslib_1.__assign({}, this.plugin.canvas3d.props.marking);
-                            if (params.highlight) {
-                                renderer.highlightColor = this.normalizeColor(params.highlight);
-                                marking.highlightEdgeColor = color_1.Color.darken(this.normalizeColor(params.highlight), 1);
-                                this.isHighlightColorUpdated = true;
-                            }
-                            if (params.select) {
-                                renderer.selectColor = this.normalizeColor(params.select);
-                                marking.selectEdgeColor = color_1.Color.darken(this.normalizeColor(params.select), 1);
-                                this.isSelectedColorUpdated = true;
-                            }
-                            return [4 /*yield*/, commands_1.PluginCommands.Canvas3D.SetSettings(this.plugin, { settings: { renderer: renderer, marking: marking } })];
-                        case 1:
-                            _a.sent();
-                            return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Reset various settings to defaults:
-             * `camera` resets camera position (i.e. zooms on the whole scene).
-             * `theme` resets color theme for visual representations.
-             * `highlightColor` and `selectColor` reset colors previously set by the `setColor` method. */
-            reset: function (params) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var defaultTheme, componentGroups, _i, componentGroups_2, compGrp, renderer, marking;
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            if (!params.camera) return [3 /*break*/, 2];
-                            return [4 /*yield*/, commands_1.PluginCommands.Camera.Reset(this.plugin, { durationMs: 250 })];
-                        case 1:
-                            _a.sent();
-                            _a.label = 2;
-                        case 2:
-                            if (!params.theme) return [3 /*break*/, 6];
-                            defaultTheme = { color: this.initParams.alphafoldView ? 'plddt-confidence' : 'default' };
-                            componentGroups = this.plugin.managers.structure.hierarchy.currentComponentGroups;
-                            _i = 0, componentGroups_2 = componentGroups;
-                            _a.label = 3;
-                        case 3:
-                            if (!(_i < componentGroups_2.length)) return [3 /*break*/, 6];
-                            compGrp = componentGroups_2[_i];
-                            return [4 /*yield*/, this.plugin.managers.structure.component.updateRepresentationsTheme(compGrp, defaultTheme)];
-                        case 4:
-                            _a.sent();
-                            _a.label = 5;
-                        case 5:
-                            _i++;
-                            return [3 /*break*/, 3];
-                        case 6:
-                            if (!(params.highlightColor || params.selectColor)) return [3 /*break*/, 8];
-                            if (!this.plugin.canvas3d)
-                                return [2 /*return*/];
-                            renderer = tslib_1.__assign({}, this.plugin.canvas3d.props.renderer);
-                            marking = tslib_1.__assign({}, this.plugin.canvas3d.props.marking);
-                            if (params.highlightColor) {
-                                renderer.highlightColor = this.defaultRendererProps.highlightColor;
-                                marking.highlightEdgeColor = this.defaultMarkingProps.highlightEdgeColor;
-                                this.isHighlightColorUpdated = false;
-                            }
-                            if (params.selectColor) {
-                                renderer.selectColor = this.defaultRendererProps.selectColor;
-                                marking.selectEdgeColor = this.defaultMarkingProps.selectEdgeColor;
-                                this.isSelectedColorUpdated = false;
-                            }
-                            return [4 /*yield*/, commands_1.PluginCommands.Canvas3D.SetSettings(this.plugin, { settings: { renderer: renderer, marking: marking } })];
-                        case 7:
-                            _a.sent();
-                            _a.label = 8;
-                        case 8: return [2 /*return*/];
-                    }
-                });
-            }); },
-            /** Change parameters of the plugin instance.
-             * Can be used to load a different structure.
-             * If `fullLoad`, remove currently loaded structure before loading the new one;
-             * otherwise add the new structure to existing structures. */
-            update: function (options, fullLoad) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                var validationIssues, dataSource;
-                return tslib_1.__generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            console.debug('Updating PDBeMolstarPlugin instance with options:', options);
-                            // Validate options
-                            if (!options) {
-                                console.error('Missing `options` argument to `PDBeMolstarPlugin.visual.update');
-                                return [2 /*return*/, false];
-                            }
-                            validationIssues = (0, spec_2.validateInitParams)(options);
-                            if (validationIssues) {
-                                console.error('Invalid PDBeMolstarPlugin options:', options);
-                                return [2 /*return*/, false];
-                            }
-                            this.initParams = (0, helpers_1.addDefaults)(options, spec_2.DefaultParams);
-                            if (!this.initParams.moleculeId && !this.initParams.customData)
-                                return [2 /*return*/, false];
-                            if (this.initParams.customData && this.initParams.customData.url && !this.initParams.customData.format)
-                                return [2 /*return*/, false];
-                            (0, plugin_custom_state_1.PluginCustomState)(this.plugin).initParams = this.initParams;
-                            // Show/hide buttons in the viewport control panel
-                            this.plugin.config.set(config_1.PluginConfig.Viewport.ShowExpand, !this.initParams.hideCanvasControls.includes('expand'));
-                            this.plugin.config.set(config_1.PluginConfig.Viewport.ShowSelectionMode, !this.initParams.hideCanvasControls.includes('selection'));
-                            this.plugin.config.set(config_1.PluginConfig.Viewport.ShowAnimation, !this.initParams.hideCanvasControls.includes('animation'));
-                            this.plugin.config.set(config_1.PluginConfig.Viewport.ShowControls, !this.initParams.hideCanvasControls.includes('controlToggle'));
-                            this.plugin.config.set(config_1.PluginConfig.Viewport.ShowSettings, !this.initParams.hideCanvasControls.includes('controlInfo'));
-                            if (!(this.initParams.bgColor || this.initParams.lighting)) return [3 /*break*/, 2];
-                            return [4 /*yield*/, this.canvas.applySettings({ color: this.initParams.bgColor, lighting: this.initParams.lighting })];
-                        case 1:
-                            _a.sent();
-                            _a.label = 2;
-                        case 2:
-                            dataSource = this.getMoleculeSrcUrl();
-                            if (!dataSource) return [3 /*break*/, 4];
-                            return [4 /*yield*/, this.load({ url: dataSource.url, format: dataSource.format, assemblyId: this.initParams.assemblyId, isBinary: dataSource.isBinary }, fullLoad)];
-                        case 3:
-                            _a.sent();
-                            _a.label = 4;
-                        case 4: return [2 /*return*/, true];
-                    }
-                });
-            }); },
-        };
-    }
-    /** Extract InitParams from attributes of an HTML element */
-    PDBeMolstarPlugin.initParamsFromHtmlAttributes = function (element) {
-        return (0, spec_from_html_1.initParamsFromHtmlAttributes)(element);
-    };
-    PDBeMolstarPlugin.prototype.render = function (target, options) {
-        var _a, _b, _c, _d, _e, _f;
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var validationIssues, pdbePluginSpec, _g, dataSource;
-            return tslib_1.__generator(this, function (_h) {
-                switch (_h.label) {
-                    case 0:
-                        console.debug('Rendering PDBeMolstarPlugin instance with options:', options);
-                        // Validate options
-                        if (!options) {
-                            console.error('Missing `options` argument to `PDBeMolstarPlugin.render');
-                            return [2 /*return*/];
-                        }
-                        validationIssues = (0, spec_2.validateInitParams)(options);
-                        if (validationIssues) {
-                            console.error('Invalid PDBeMolstarPlugin options:', options);
-                            return [2 /*return*/];
-                        }
-                        this.initParams = (0, helpers_1.addDefaults)(options, spec_2.DefaultParams);
-                        pdbePluginSpec = (0, spec_2.DefaultPluginUISpec)();
-                        (_a = pdbePluginSpec.config) !== null && _a !== void 0 ? _a : (pdbePluginSpec.config = []);
-                        pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(behavior_2.MolViewSpec));
-                        if (!this.initParams.ligandView && !this.initParams.superposition && this.initParams.selectInteraction) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(structure_focus_representation_1.StructureFocusRepresentation));
-                        }
-                        if (this.initParams.superposition) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(superposition_focus_representation_1.SuperpositionFocusRepresentation), spec_1.PluginSpec.Behavior(behavior_1.MAQualityAssessment, { autoAttach: true, showTooltip: true }));
-                        }
-                        // Add custom properties
-                        if (this.initParams.domainAnnotation) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(behavior_4.PDBeDomainAnnotations, { autoAttach: true, showTooltip: false }));
-                        }
-                        if (this.initParams.validationAnnotation) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(pdbe_1.PDBeStructureQualityReport, { autoAttach: true, showTooltip: false }));
-                        }
-                        if (this.initParams.symmetryAnnotation) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(behavior_3.RCSBAssemblySymmetry));
-                            pdbePluginSpec.config.push([behavior_3.RCSBAssemblySymmetryConfig.DefaultServerType, 'pdbe'], [behavior_3.RCSBAssemblySymmetryConfig.DefaultServerUrl, 'https://www.ebi.ac.uk/pdbe/aggregated-api/pdb/symmetry'], [behavior_3.RCSBAssemblySymmetryConfig.ApplyColors, false]);
-                        }
-                        pdbePluginSpec.layout = {
-                            initial: {
-                                isExpanded: this.initParams.expanded,
-                                showControls: !this.initParams.hideControls,
-                                regionState: {
-                                    left: 'full',
-                                    right: 'full',
-                                    top: this.initParams.sequencePanel ? 'full' : 'hidden',
-                                    bottom: 'full',
-                                },
-                                controlsDisplay: this.initParams.reactive ? 'reactive' : this.initParams.landscape ? 'landscape' : layout_1.PluginLayoutStateParams.controlsDisplay.defaultValue,
-                            }
-                        };
-                        pdbePluginSpec.components = {
-                            controls: {
-                                left: pdbe_left_panel_1.LeftPanelControls,
-                                // right: DefaultStructureTools,
-                                // top: 'none',
-                                bottom: 'none'
-                            },
-                            viewport: {
-                                controls: pdbe_viewport_controls_1.PDBeViewportControls,
-                                view: this.initParams.superposition ? superposition_viewport_1.SuperpostionViewport : void 0
-                            },
-                            remoteState: 'none',
-                            structureTools: this.initParams.superposition ? pdbe_structure_controls_1.PDBeSuperpositionStructureTools : this.initParams.ligandView ? pdbe_structure_controls_1.PDBeLigandViewStructureTools : pdbe_structure_controls_1.PDBeStructureTools
-                        };
-                        if (this.initParams.alphafoldView) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(behavior_1.MAQualityAssessment, { autoAttach: true, showTooltip: true }));
-                        }
-                        pdbePluginSpec.config.push([config_1.PluginConfig.Structure.DefaultRepresentationPresetParams, {
-                                theme: {
-                                    globalName: (this.initParams.alphafoldView) ? 'plddt-confidence' : undefined,
-                                    carbonColor: { name: 'element-symbol', params: {} },
-                                    focus: {
-                                        name: 'element-symbol',
-                                        params: { carbonColor: { name: 'element-symbol', params: {} } }
-                                    }
-                                }
-                            }]);
-                        element_symbol_1.ElementSymbolColorThemeParams.carbonColor.defaultValue = { name: 'element-symbol', params: {} };
-                        // Add animation props
-                        if (!this.initParams.ligandView && !this.initParams.superposition) {
-                            pdbePluginSpec.animations = [model_index_1.AnimateModelIndex, camera_spin_1.AnimateCameraSpin, camera_rock_1.AnimateCameraRock, state_snapshots_1.AnimateStateSnapshots, assembly_unwind_1.AnimateAssemblyUnwind, spin_structure_1.AnimateStructureSpin, state_interpolation_1.AnimateStateInterpolation];
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(mp4_export_1.Mp4Export));
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(geo_export_1.GeometryExport));
-                        }
-                        if (this.initParams.hideCanvasControls.includes('expand'))
-                            pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowExpand, false]);
-                        if (this.initParams.hideCanvasControls.includes('selection'))
-                            pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowSelectionMode, false]);
-                        if (this.initParams.hideCanvasControls.includes('animation'))
-                            pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowAnimation, false]);
-                        if (this.initParams.hideCanvasControls.includes('controlToggle'))
-                            pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowControls, false]);
-                        if (this.initParams.hideCanvasControls.includes('controlInfo'))
-                            pdbePluginSpec.config.push([config_1.PluginConfig.Viewport.ShowSettings, false]);
-                        // override default event bindings
-                        if (this.initParams.selectBindings) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(representation_2.SelectLoci, { bindings: this.initParams.selectBindings }));
-                        }
-                        if (this.initParams.focusBindings) {
-                            pdbePluginSpec.behaviors.push(spec_1.PluginSpec.Behavior(camera_1.FocusLoci, { bindings: this.initParams.focusBindings }));
-                        }
-                        this.targetElement = typeof target === 'string' ? document.getElementById(target) : target;
-                        this.targetElement.viewerInstance = this;
-                        // Create/ Initialise Plugin
-                        _g = this;
-                        return [4 /*yield*/, (0, react18_1.createPluginUI)(this.targetElement, pdbePluginSpec)];
-                    case 1:
-                        // Create/ Initialise Plugin
-                        _g.plugin = _h.sent();
-                        (0, plugin_custom_state_1.PluginCustomState)(this.plugin).initParams = tslib_1.__assign({}, this.initParams);
-                        (0, plugin_custom_state_1.PluginCustomState)(this.plugin).events = {
-                            segmentUpdate: this._ev(),
-                            superpositionInit: this._ev(),
-                            isBusy: this._ev()
-                        };
-                        // Set background colour
-                        if (this.initParams.bgColor || this.initParams.lighting) {
-                            this.canvas.applySettings({ color: this.initParams.bgColor, lighting: this.initParams.lighting });
-                        }
-                        // Set selection granularity
-                        if (this.initParams.granularity) {
-                            this.plugin.managers.interactivity.setProps({ granularity: this.initParams.granularity });
-                        }
-                        // Set default highlight and selection colors
-                        if (this.initParams.highlightColor || this.initParams.selectColor) {
-                            this.visual.setColor({ highlight: this.initParams.highlightColor, select: this.initParams.selectColor });
-                        }
-                        // Save renderer defaults
-                        this.defaultRendererProps = tslib_1.__assign({}, this.plugin.canvas3d.props.renderer);
-                        this.defaultMarkingProps = tslib_1.__assign({}, this.plugin.canvas3d.props.marking);
-                        if (this.initParams.superposition) {
-                            // Set left panel tab
-                            this.plugin.behaviors.layout.leftPanelTabName.next('segments');
-                            // Initialise superposition
-                            if (this.initParams.loadingOverlay) {
-                                new overlay_1.LoadingOverlay(this.targetElement, { resize: (_c = (_b = this.plugin) === null || _b === void 0 ? void 0 : _b.canvas3d) === null || _c === void 0 ? void 0 : _c.resized, hide: this.events.loadComplete }).show();
-                            }
-                            (0, superposition_1.initSuperposition)(this.plugin, this.events.loadComplete);
-                        }
-                        else {
-                            // Collapse left panel and set left panel tab to none
-                            commands_1.PluginCommands.Layout.Update(this.plugin, { state: { regionState: tslib_1.__assign(tslib_1.__assign({}, this.plugin.layout.state.regionState), { left: 'collapsed' }) } });
-                            this.plugin.behaviors.layout.leftPanelTabName.next('none');
-                            dataSource = this.getMoleculeSrcUrl();
-                            if (dataSource) {
-                                if (this.initParams.loadingOverlay) {
-                                    new overlay_1.LoadingOverlay(this.targetElement, { resize: (_e = (_d = this.plugin) === null || _d === void 0 ? void 0 : _d.canvas3d) === null || _e === void 0 ? void 0 : _e.resized, hide: this.events.loadComplete }).show();
-                                }
-                                this.load({
-                                    url: dataSource.url,
-                                    format: dataSource.format,
-                                    assemblyId: this.initParams.assemblyId,
-                                    isBinary: dataSource.isBinary,
-                                    progressMessage: "Loading ".concat((_f = this.initParams.moleculeId) !== null && _f !== void 0 ? _f : '', " ..."),
-                                    id: 'main',
-                                });
-                            }
-                            // Binding to other PDB Component events
-                            if (this.initParams.subscribeEvents) {
-                                (0, subscribe_events_1.subscribeToComponentEvents)(this);
-                            }
-                            // Event handling
-                            custom_events_1.CustomEvents.add(this.plugin, this.targetElement);
-                        }
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.getMoleculeSrcUrl = function () {
-        if (this.initParams.customData) {
-            var _a = this.initParams.customData, url = _a.url, format = _a.format, binary = _a.binary;
-            if (!url || !format) {
-                throw new Error("Provide all custom data parameters");
-            }
-            if (format === 'cif' || format === 'bcif')
-                format = 'mmcif';
-            // Validate supported format
-            var supportedFormats = ['mmcif', 'pdb', 'sdf'];
-            if (!supportedFormats.includes(format)) {
-                throw new Error("".concat(format, " not supported."));
-            }
-            return {
-                url: url,
-                format: format,
-                isBinary: binary,
-            };
-        }
-        if (this.initParams.moleculeId) {
-            var request = { pdbId: this.initParams.moleculeId, queryType: 'full', queryParams: {} };
-            if (this.initParams.ligandView) {
-                request.queryType = 'residueSurroundings';
-                request.queryParams['data_source'] = 'pdb-h';
-                if (!this.initParams.ligandView.label_comp_id_list) {
-                    request.queryParams['label_comp_id'] = this.initParams.ligandView.label_comp_id;
-                    request.queryParams['auth_seq_id'] = this.initParams.ligandView.auth_seq_id;
-                    request.queryParams['auth_asym_id'] = this.initParams.ligandView.auth_asym_id;
-                }
-            }
-            return {
-                url: (0, helpers_1.getStructureUrl)(this.initParams, request),
-                format: 'mmcif',
-                isBinary: this.initParams.encoding === 'bcif',
-            };
-        }
-        throw new Error("Mandatory parameters missing! (customData or moleculeId must be defined)");
-    };
-    Object.defineProperty(PDBeMolstarPlugin.prototype, "state", {
-        get: function () {
-            return this.plugin.state.data;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    PDBeMolstarPlugin.prototype.createLigandStructure = function (isBranched) {
-        var _a, e_1, _b, _c;
-        var _d, _e;
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var _f, _g, _h, comp, e_1_1, structure, ligandQuery, ligandVis, ligandSurr, ligRef, cell, repr, ligLoci, current;
-            return tslib_1.__generator(this, function (_j) {
-                switch (_j.label) {
-                    case 0:
-                        if (this.assemblyRef === '')
-                            return [2 /*return*/];
-                        _j.label = 1;
-                    case 1:
-                        _j.trys.push([1, 9, 10, 15]);
-                        _f = true, _g = tslib_1.__asyncValues(this.plugin.managers.structure.hierarchy.currentComponentGroups);
-                        _j.label = 2;
-                    case 2: return [4 /*yield*/, _g.next()];
-                    case 3:
-                        if (!(_h = _j.sent(), _a = _h.done, !_a)) return [3 /*break*/, 8];
-                        _c = _h.value;
-                        _f = false;
-                        _j.label = 4;
-                    case 4:
-                        _j.trys.push([4, , 6, 7]);
-                        comp = _c;
-                        return [4 /*yield*/, commands_1.PluginCommands.State.RemoveObject(this.plugin, { state: comp[0].cell.parent, ref: comp[0].cell.transform.ref, removeParentGhosts: true })];
-                    case 5:
-                        _j.sent();
-                        return [3 /*break*/, 7];
-                    case 6:
-                        _f = true;
-                        return [7 /*endfinally*/];
-                    case 7: return [3 /*break*/, 2];
-                    case 8: return [3 /*break*/, 15];
-                    case 9:
-                        e_1_1 = _j.sent();
-                        e_1 = { error: e_1_1 };
-                        return [3 /*break*/, 15];
-                    case 10:
-                        _j.trys.push([10, , 13, 14]);
-                        if (!(!_f && !_a && (_b = _g.return))) return [3 /*break*/, 12];
-                        return [4 /*yield*/, _b.call(_g)];
-                    case 11:
-                        _j.sent();
-                        _j.label = 12;
-                    case 12: return [3 /*break*/, 14];
-                    case 13:
-                        if (e_1) throw e_1.error;
-                        return [7 /*endfinally*/];
-                    case 14: return [7 /*endfinally*/];
-                    case 15:
-                        structure = this.state.select(this.assemblyRef)[0];
-                        if (isBranched) {
-                            ligandQuery = helpers_1.LigandView.branchedQuery((_d = this.initParams.ligandView) === null || _d === void 0 ? void 0 : _d.label_comp_id_list);
-                        }
-                        else {
-                            ligandQuery = helpers_1.LigandView.query(this.initParams.ligandView);
-                        }
-                        return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, ligandQuery.core, 'pivot', { label: 'Ligand' })];
-                    case 16:
-                        ligandVis = _j.sent();
-                        if (!ligandVis) return [3 /*break*/, 18];
-                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(ligandVis, { type: 'ball-and-stick', color: 'element-symbol', colorParams: { carbonColor: { name: 'element-symbol', params: {} } }, size: 'uniform', sizeParams: { value: 2.5 } }, { tag: 'ligand-vis' })];
-                    case 17:
-                        _j.sent();
-                        _j.label = 18;
-                    case 18: return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentFromExpression(structure, ligandQuery.surroundings, 'rest', { label: 'Surroundings' })];
-                    case 19:
-                        ligandSurr = _j.sent();
-                        if (!ligandSurr) return [3 /*break*/, 21];
-                        return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(ligandSurr, { type: 'ball-and-stick', color: 'element-symbol', colorParams: { carbonColor: { name: 'element-symbol', params: {} } }, size: 'uniform', sizeParams: { value: 0.8 } })];
-                    case 20:
-                        _j.sent();
-                        _j.label = 21;
-                    case 21:
-                        ligRef = mol_state_1.StateSelection.findTagInSubtree(this.plugin.state.data.tree, mol_state_1.StateTransform.RootRef, 'ligand-vis');
-                        if (!ligRef)
-                            return [2 /*return*/];
-                        cell = this.plugin.state.data.cells.get(ligRef);
-                        if (cell === null || cell === void 0 ? void 0 : cell.obj) {
-                            repr = cell.obj.data.repr;
-                            ligLoci = repr.getAllLoci()[0];
-                            this.plugin.managers.structure.focus.setFromLoci(ligLoci);
-                            current = (_e = this.plugin.managers.structure.focus.current) === null || _e === void 0 ? void 0 : _e.loci;
-                            if (current)
-                                this.plugin.managers.camera.focusLoci(current);
-                        }
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    PDBeMolstarPlugin.prototype.load = function (_a, fullLoad) {
-        var url = _a.url, _b = _a.format, format = _b === void 0 ? 'mmcif' : _b, _c = _a.isBinary, isBinary = _c === void 0 ? false : _c, _d = _a.assemblyId, assemblyId = _d === void 0 ? '' : _d, progressMessage = _a.progressMessage, id = _a.id;
-        if (fullLoad === void 0) { fullLoad = true; }
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var _this = this;
-            return tslib_1.__generator(this, function (_e) {
-                switch (_e.label) {
-                    case 0: return [4 /*yield*/, (0, helpers_1.runWithProgressMessage)(this.plugin, progressMessage, function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
-                            var success, isHetView, downloadOptions, isBranchedView, data_1, trajectory, structRef, model, structure, pivotIndex, pivot, asm, defaultMapParams, pdbeMapParams;
-                            return tslib_1.__generator(this, function (_a) {
-                                switch (_a.label) {
-                                    case 0:
-                                        success = false;
-                                        _a.label = 1;
-                                    case 1:
-                                        _a.trys.push([1, , 15, 16]);
-                                        if (!fullLoad) return [3 /*break*/, 3];
-                                        return [4 /*yield*/, this.clear()];
-                                    case 2:
-                                        _a.sent();
-                                        _a.label = 3;
-                                    case 3:
-                                        isHetView = this.initParams.ligandView ? true : false;
-                                        downloadOptions = void 0;
-                                        isBranchedView = false;
-                                        if (this.initParams.ligandView && this.initParams.ligandView.label_comp_id_list) {
-                                            isBranchedView = true;
-                                            downloadOptions = { body: JSON.stringify(this.initParams.ligandView.label_comp_id_list), headers: [['Content-type', 'application/json']] };
-                                        }
-                                        return [4 /*yield*/, this.plugin.builders.data.download({ url: assets_1.Asset.Url(url, downloadOptions), isBinary: isBinary }, { state: { isGhost: true } })];
-                                    case 4:
-                                        data_1 = _a.sent();
-                                        return [4 /*yield*/, this.plugin.builders.structure.parseTrajectory(data_1, format)];
-                                    case 5:
-                                        trajectory = _a.sent();
-                                        structRef = void 0;
-                                        if (!!isHetView) return [3 /*break*/, 7];
-                                        return [4 /*yield*/, this.plugin.builders.structure.hierarchy.applyPreset(trajectory, this.initParams.defaultPreset, {
-                                                structure: assemblyId ? (assemblyId === 'preferred') ? void 0 : { name: 'assembly', params: { id: assemblyId } } : { name: 'model', params: {} },
-                                                showUnitcell: false,
-                                                representationPreset: 'auto'
-                                            })];
-                                    case 6:
-                                        _a.sent();
-                                        structRef = this.plugin.state.data.selectQ(function (q) { return q.byRef(data_1.ref).subtree().ofType(objects_1.PluginStateObject.Molecule.Structure); })[0].transform.ref;
-                                        if (this.initParams.hideStructure.length > 0 || this.initParams.visualStyle) {
-                                            this.applyVisualParams();
-                                        }
-                                        return [3 /*break*/, 10];
-                                    case 7: return [4 /*yield*/, this.plugin.builders.structure.createModel(trajectory)];
-                                    case 8:
-                                        model = _a.sent();
-                                        return [4 /*yield*/, this.plugin.builders.structure.createStructure(model, { name: 'model', params: {} })];
-                                    case 9:
-                                        structure = _a.sent();
-                                        structRef = structure.ref;
-                                        _a.label = 10;
-                                    case 10:
-                                        if (id) {
-                                            this.structureRefMap.set(id, structRef);
-                                        }
-                                        // show selection if param is set
-                                        if (this.initParams.selection) {
-                                            this.visual.select(this.initParams.selection);
-                                        }
-                                        pivotIndex = this.plugin.managers.structure.hierarchy.selection.structures.length - 1;
-                                        pivot = this.plugin.managers.structure.hierarchy.selection.structures[pivotIndex];
-                                        if (pivot && pivot.cell.parent)
-                                            this.assemblyRef = pivot.cell.transform.ref;
-                                        if (!this.initParams.loadMaps) return [3 /*break*/, 12];
-                                        if (this.assemblyRef === '')
-                                            return [2 /*return*/];
-                                        asm = this.state.select(this.assemblyRef)[0].obj;
-                                        defaultMapParams = transformers_1.InitVolumeStreaming.createDefaultParams(asm, this.plugin);
-                                        pdbeMapParams = helpers_1.PDBeVolumes.mapParams(defaultMapParams, this.initParams.mapSettings, '');
-                                        if (!pdbeMapParams) return [3 /*break*/, 12];
-                                        return [4 /*yield*/, this.plugin.runTask(this.state.applyAction(transformers_1.InitVolumeStreaming, pdbeMapParams, this.assemblyRef))];
-                                    case 11:
-                                        _a.sent();
-                                        if (pdbeMapParams.method !== 'em' && !this.initParams.ligandView)
-                                            helpers_1.PDBeVolumes.displayUsibilityMessage(this.plugin);
-                                        _a.label = 12;
-                                    case 12:
-                                        if (!isHetView) return [3 /*break*/, 14];
-                                        return [4 /*yield*/, this.createLigandStructure(isBranchedView)];
-                                    case 13:
-                                        _a.sent();
-                                        _a.label = 14;
-                                    case 14:
-                                        success = true;
-                                        return [3 /*break*/, 16];
-                                    case 15:
-                                        this.events.loadComplete.next(success);
-                                        return [7 /*endfinally*/];
-                                    case 16: return [2 /*return*/];
-                                }
-                            });
-                        }); })];
-                    case 1:
-                        _e.sent();
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    /** Remove loaded structure(s).
-     * `structureNumberOrId` is either index (numbered from 1!) or the ID that was provided when loading the structure.
-     * If `structureNumberOrId` is undefined, remove all structures.
-     * You will likely need to call `await this.visual.reset({ camera: true })` afterwards. */
-    PDBeMolstarPlugin.prototype.deleteStructure = function (structureNumberOrId) {
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var structs, _loop_3, this_2, _i, structs_1, struct;
-            return tslib_1.__generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        structs = this.getStructures(structureNumberOrId);
-                        if (structureNumberOrId !== undefined && structs.length === 0) {
-                            console.error("Cannot delete structure: there is no structure with number or id ".concat(structureNumberOrId, "."));
-                        }
-                        _loop_3 = function (struct) {
-                            var dataNode;
-                            return tslib_1.__generator(this, function (_b) {
-                                switch (_b.label) {
-                                    case 0:
-                                        dataNode = this_2.plugin.state.data.selectQ(function (q) { return q.byRef(struct.structureRef.cell.transform.ref).ancestorOfType([objects_1.PluginStateObject.Data.String, objects_1.PluginStateObject.Data.Binary]); })[0];
-                                        if (!dataNode) return [3 /*break*/, 2];
-                                        return [4 /*yield*/, this_2.plugin.build().delete(dataNode).commit()];
-                                    case 1:
-                                        _b.sent();
-                                        _b.label = 2;
-                                    case 2: return [2 /*return*/];
-                                }
-                            });
-                        };
-                        this_2 = this;
-                        _i = 0, structs_1 = structs;
-                        _a.label = 1;
-                    case 1:
-                        if (!(_i < structs_1.length)) return [3 /*break*/, 4];
-                        struct = structs_1[_i];
-                        return [5 /*yield**/, _loop_3(struct)];
-                    case 2:
-                        _a.sent();
-                        _a.label = 3;
-                    case 3:
-                        _i++;
-                        return [3 /*break*/, 1];
-                    case 4: return [2 /*return*/];
-                }
-            });
-        });
-    };
-    /** Get loci corresponding to a selection within a structure.
-     * If `params` contains more items, return loci for the union of the selections.
-     * If `structureNumber` is provided, use the specified structure (numbered from 1!); otherwise use the last added structure. */
-    PDBeMolstarPlugin.prototype.getLociForParams = function (params, structureNumber) {
-        var assemblyRef = this.assemblyRef;
-        if (structureNumber) {
-            assemblyRef = this.plugin.managers.structure.hierarchy.current.structures[structureNumber - 1].cell.transform.ref;
-        }
-        if (assemblyRef === '')
-            return loci_1.EmptyLoci;
-        var data = this.plugin.state.data.select(assemblyRef)[0].obj.data;
-        if (!data)
-            return loci_1.EmptyLoci;
-        return helpers_1.QueryHelper.getInteractivityLoci(params, data);
-    };
-    PDBeMolstarPlugin.prototype.getLociByPLDDT = function (score, structureNumber) {
-        var assemblyRef = this.assemblyRef;
-        if (structureNumber) {
-            assemblyRef = this.plugin.managers.structure.hierarchy.current.structures[structureNumber - 1].cell.transform.ref;
-        }
-        if (assemblyRef === '')
-            return loci_1.EmptyLoci;
-        var data = this.plugin.state.data.select(assemblyRef)[0].obj.data;
-        if (!data)
-            return loci_1.EmptyLoci;
-        return helpers_1.AlphafoldView.getLociByPLDDT(score, data);
-    };
-    /** For each item in params, get loci and bundle */
-    PDBeMolstarPlugin.prototype.getSelections = function (params, structNumber) {
-        var result = [];
-        for (var _i = 0, params_1 = params; _i < params_1.length; _i++) {
-            var param = params_1[_i];
-            var loci = this.getLociForParams([param], structNumber);
-            if (loci_1.Loci.isEmpty(loci) || !structure_1.StructureElement.Loci.is(loci))
-                continue;
-            var bundle = structure_1.StructureElement.Bundle.fromLoci(loci);
-            result.push({ param: param, loci: loci, bundle: bundle });
-        }
-        return result;
-    };
-    PDBeMolstarPlugin.prototype.getBundle = function (params, structNumber) {
-        var loci = this.getLociForParams(params, structNumber);
-        if (loci_1.Loci.isEmpty(loci) || !structure_1.StructureElement.Loci.is(loci))
-            return undefined;
-        return structure_1.StructureElement.Bundle.fromLoci(loci);
-    };
-    PDBeMolstarPlugin.prototype.normalizeColor = function (colorVal, defaultColor) {
-        var _a, _b, _c;
-        if (defaultColor === void 0) { defaultColor = color_1.Color.fromRgb(170, 170, 170); }
-        try {
-            if (colorVal === undefined || colorVal === null)
-                return defaultColor;
-            if (typeof colorVal === 'number')
-                return (0, color_1.Color)(colorVal);
-            if (typeof colorVal === 'string' && colorVal[0] === '#')
-                return (0, color_1.Color)(Number("0x".concat(colorVal.substring(1))));
-            if (typeof colorVal === 'string' && colorVal in names_1.ColorNames)
-                return names_1.ColorNames[colorVal];
-            if (typeof colorVal === 'object')
-                return color_1.Color.fromRgb((_a = colorVal.r) !== null && _a !== void 0 ? _a : 0, (_b = colorVal.g) !== null && _b !== void 0 ? _b : 0, (_c = colorVal.b) !== null && _c !== void 0 ? _c : 0);
-        }
-        catch (_d) {
-            // do nothing
-        }
-        return defaultColor;
-    };
-    /** Get structure ref for a structure with given `structureNumberOrId`.
-     * `structureNumberOrId` is either index (numbered from 1!) or the ID that was provided when loading the structure.
-     * If `structureNumberOrId` is undefined, return refs for all loaded structures. */
-    PDBeMolstarPlugin.prototype.getStructures = function (structureNumberOrId) {
-        var allStructures = this.plugin.managers.structure.hierarchy.current.structures.map(function (structureRef, i) { return ({ structureRef: structureRef, number: i + 1 }); });
-        if (typeof structureNumberOrId === 'number') {
-            var theStructure = allStructures[structureNumberOrId - 1];
-            return theStructure ? [theStructure] : [];
-        }
-        else if (typeof structureNumberOrId === 'string') {
-            var structRef_1 = this.structureRefMap.get(structureNumberOrId);
-            if (structRef_1 === undefined) {
-                return [];
-            }
-            var found = allStructures.find(function (s) { return s.structureRef.cell.transform.ref === structRef_1; });
-            if (found) {
-                return [found];
-            }
-            else {
-                this.structureRefMap.delete(structureNumberOrId); // remove outdated record
-                return [];
-            }
-        }
-        else {
-            return allStructures;
-        }
-    };
-    /** Get StructureRef for a structure with given `structureNumberOrId`.
-     * `structureNumberOrId` is either index (numbered from 1!) or the ID that was provided when loading the structure. */
-    PDBeMolstarPlugin.prototype.getStructure = function (structureNumberOrId) {
-        var _a;
-        return (_a = this.getStructures(structureNumberOrId)[0]) === null || _a === void 0 ? void 0 : _a.structureRef;
-    };
-    PDBeMolstarPlugin.prototype.clear = function () {
-        return tslib_1.__awaiter(this, void 0, void 0, function () {
-            return tslib_1.__generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.plugin.clear()];
-                    case 1:
-                        _a.sent();
-                        this.assemblyRef = '';
-                        this.addedReprs = {};
-                        this.isHighlightColorUpdated = false;
-                        this.isSelectedColorUpdated = false;
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    /** Helper functions related to specific views or use cases */
-    PDBeMolstarPlugin.extensions = {
-        foldseek: Foldseek,
-    };
-    return PDBeMolstarPlugin;
-}());
-exports.PDBeMolstarPlugin = PDBeMolstarPlugin;
-window.PDBeMolstarPlugin = PDBeMolstarPlugin;
+tslib_1.__exportStar(require("./viewer"), exports);
+var viewer_1 = require("./viewer");
+require("molstar/lib/mol-plugin-ui/skin/light.scss");
+require("./styles/index.scss");
+window.PDBeMolstarPlugin = viewer_1.PDBeMolstarPlugin;