molstar 3.0.0-dev.6 → 3.0.0

package/lib/mol-plugin-state/builder/structure/representation-preset.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2022 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>
@@ -13,6 +13,7 @@ import { PluginContext } from '../../../mol-plugin/context';
 import { StateObjectRef, StateObjectSelector } from '../../../mol-state';
 import { StaticStructureComponentType } from '../../helpers/structure-component';
 import { StructureSelectionQueries as Q } from '../../helpers/structure-selection-query';
+import { Color } from '../../../mol-util/color';
 export interface StructureRepresentationPresetProvider<P = any, S extends _Result = _Result> extends PresetProvider<PluginStateObject.Molecule.Structure, P, S> {
 }
 export declare function StructureRepresentationPresetProvider<P, S extends _Result>(repr: StructureRepresentationPresetProvider<P, S>): StructureRepresentationPresetProvider<P, S>;
@@ -31,9 +32,9 @@ export declare namespace StructureRepresentationPresetProvider {
         ignoreHydrogens: PD.Base<boolean | undefined>;
         quality: PD.Base<"auto" | "medium" | "high" | "low" | "custom" | "highest" | "higher" | "lower" | "lowest" | undefined>;
         theme: PD.Base<PD.Normalize<{
-            globalName: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "entity-id" | undefined;
+            globalName: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "entity-id" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "volume-value" | undefined;
             carbonColor: "element-symbol" | "chain-id" | "operator-name" | undefined;
-            symmetryColor: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "entity-id" | undefined;
+            symmetryColor: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "entity-id" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "volume-value" | undefined;
             focus: PD.Normalize<{
                 name: any;
                 params: any;
@@ -44,8 +45,8 @@ export declare namespace StructureRepresentationPresetProvider {
     function reprBuilder(plugin: PluginContext, params: CommonParams, structure?: Structure): {
         update: import("../../../mol-state/state/builder").StateBuilder.Root;
         builder: import("./representation").StructureRepresentationBuilder;
-        color: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "entity-id" | undefined;
-        symmetryColor: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "entity-id" | undefined;
+        color: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "entity-id" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "volume-value" | undefined;
+        symmetryColor: "uniform" | "occupancy" | "element-index" | "element-symbol" | "shape-group" | "uncertainty" | "carbohydrate-symbol" | "chain-id" | "operator-name" | "molecule-type" | "polymer-id" | "polymer-index" | "residue-name" | "secondary-structure" | "sequence-id" | "unit-index" | "entity-source" | "entity-id" | "illustrative" | "hydrophobicity" | "model-index" | "operator-hkl" | "partial-charge" | "atom-id" | "volume-value" | undefined;
         typeParams: {
             quality: "auto" | "medium" | "high" | "low" | "custom" | "highest" | "higher" | "lower" | "lowest";
             ignoreHydrogens: boolean;
@@ -77,6 +78,127 @@ export declare namespace StructureRepresentationPresetProvider {
             }>, "operator-name">>;
             saturation: PD.Numeric;
             lightness: PD.Numeric;
+            colors: PD.Mapped<PD.NamedParams<PD.Normalize<unknown>, "default"> | PD.NamedParams<PD.Normalize<{
+                H: Color;
+                D: Color;
+                T: Color;
+                HE: Color;
+                LI: Color;
+                BE: Color;
+                B: Color;
+                C: Color;
+                N: Color;
+                O: Color;
+                F: Color;
+                NE: Color;
+                NA: Color;
+                MG: Color;
+                AL: Color;
+                SI: Color;
+                P: Color;
+                S: Color;
+                CL: Color;
+                AR: Color;
+                K: Color;
+                CA: Color;
+                SC: Color;
+                TI: Color;
+                V: Color;
+                CR: Color;
+                MN: Color;
+                FE: Color;
+                CO: Color;
+                NI: Color;
+                CU: Color;
+                ZN: Color;
+                GA: Color;
+                GE: Color;
+                AS: Color;
+                SE: Color;
+                BR: Color;
+                KR: Color;
+                RB: Color;
+                SR: Color;
+                Y: Color;
+                ZR: Color;
+                NB: Color;
+                MO: Color;
+                TC: Color;
+                RU: Color;
+                RH: Color;
+                PD: Color;
+                AG: Color;
+                CD: Color;
+                IN: Color;
+                SN: Color;
+                SB: Color;
+                TE: Color;
+                I: Color;
+                XE: Color;
+                CS: Color;
+                BA: Color;
+                LA: Color;
+                CE: Color;
+                PR: Color;
+                ND: Color;
+                PM: Color;
+                SM: Color;
+                EU: Color;
+                GD: Color;
+                TB: Color;
+                DY: Color;
+                HO: Color;
+                ER: Color;
+                TM: Color;
+                YB: Color;
+                LU: Color;
+                HF: Color;
+                TA: Color;
+                W: Color;
+                RE: Color;
+                OS: Color;
+                IR: Color;
+                PT: Color;
+                AU: Color;
+                HG: Color;
+                TL: Color;
+                PB: Color;
+                BI: Color;
+                PO: Color;
+                AT: Color;
+                RN: Color;
+                FR: Color;
+                RA: Color;
+                AC: Color;
+                TH: Color;
+                PA: Color;
+                U: Color;
+                NP: Color;
+                PU: Color;
+                AM: Color;
+                CM: Color;
+                BK: Color;
+                CF: Color;
+                ES: Color;
+                FM: Color;
+                MD: Color;
+                NO: Color;
+                LR: Color;
+                RF: Color;
+                DB: Color;
+                SG: Color;
+                BH: Color;
+                HS: Color;
+                MT: Color;
+                DS: Color;
+                RG: Color;
+                CN: Color;
+                UUT: Color;
+                FL: Color;
+                UUP: Color;
+                LV: Color;
+                UUH: Color;
+            }>, "custom">>;
         }>>;
     };
     function updateFocusRepr<T extends ColorTheme.BuiltIn>(plugin: PluginContext, structure: Structure, themeName: T | undefined, themeParams: ColorTheme.BuiltInParams<T> | undefined): Promise<void>;
@@ -241,6 +363,28 @@ export declare const PresetStructureRepresentations: {
             lipid: StateObjectSelector<PluginStateObject.Molecule.Structure.Representation3D, import("../../../mol-state/transformer").StateTransformer<import("../../../mol-state/object").StateObject<any, import("../../../mol-state/object").StateObject.Type<any>>, import("../../../mol-state/object").StateObject<any, import("../../../mol-state/object").StateObject.Type<any>>, any>>;
         };
     }>;
+    illustrative: StructureRepresentationPresetProvider<{
+        showCarbohydrateSymbol: boolean;
+        ignoreHydrogens: boolean | undefined;
+        quality: "auto" | "medium" | "high" | "low" | "custom" | "highest" | "higher" | "lower" | "lowest" | undefined;
+        theme: PD.Normalize<{
+            globalName: any;
+            carbonColor: any;
+            symmetryColor: any;
+            focus: any;
+        }> | undefined;
+    }, {
+        components?: undefined;
+        representations?: undefined;
+    } | {
+        components: {
+            all: StateObjectSelector<PluginStateObject.Molecule.Structure, import("../../../mol-state/transformer").StateTransformer<import("../../../mol-state/object").StateObject<any, import("../../../mol-state/object").StateObject.Type<any>>, import("../../../mol-state/object").StateObject<any, import("../../../mol-state/object").StateObject.Type<any>>, any>> | undefined;
+            branched: undefined;
+        };
+        representations: {
+            all: StateObjectSelector<PluginStateObject.Molecule.Structure.Representation3D, import("../../../mol-state/transformer").StateTransformer<import("../../../mol-state/object").StateObject<any, import("../../../mol-state/object").StateObject.Type<any>>, import("../../../mol-state/object").StateObject<any, import("../../../mol-state/object").StateObject.Type<any>>, any>>;
+        };
+    }>;
 };
 export declare type PresetStructureRepresentations = typeof PresetStructureRepresentations;
 export {};

package/lib/mol-plugin-state/builder/structure/representation-preset.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2022 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>
@@ -18,6 +18,8 @@ import { OperatorNameColorThemeProvider } from '../../../mol-theme/color/operato
 import { IndexPairBonds } from '../../../mol-model-formats/structure/property/bonds/index-pair';
 import { StructConn } from '../../../mol-model-formats/structure/property/bonds/struct_conn';
 import { assertUnreachable } from '../../../mol-util/type-helpers';
+import { Color } from '../../../mol-util/color';
+import { PostprocessingParams } from '../../../mol-canvas3d/passes/postprocessing';
 export function StructureRepresentationPresetProvider(repr) { return repr; }
 (function (StructureRepresentationPresetProvider) {
     StructureRepresentationPresetProvider.CommonParams = {
@@ -77,6 +79,14 @@ export function StructureRepresentationPresetProvider(repr) { return repr; }
 var CommonParams = StructureRepresentationPresetProvider.CommonParams;
 var reprBuilder = StructureRepresentationPresetProvider.reprBuilder;
 var updateFocusRepr = StructureRepresentationPresetProvider.updateFocusRepr;
+function resetPostprocessingProps(plugin) {
+    if (plugin.canvas3d) {
+        var p = PD.getDefaultValues(PostprocessingParams);
+        plugin.canvas3d.setProps({
+            postprocessing: { outline: p.outline, occlusion: p.occlusion }
+        });
+    }
+}
 var auto = StructureRepresentationPresetProvider({
     id: 'preset-structure-representation-auto',
     display: {
@@ -116,6 +126,7 @@ var empty = StructureRepresentationPresetProvider({
     apply: function (ref, params, plugin) {
         return __awaiter(this, void 0, void 0, function () {
             return __generator(this, function (_a) {
+                resetPostprocessingProps(plugin);
                 return [2 /*return*/, {}];
             });
         });
@@ -190,6 +201,7 @@ var polymerAndLigand = StructureRepresentationPresetProvider({
                         return [4 /*yield*/, updateFocusRepr(plugin, structure, (_h = (_g = params.theme) === null || _g === void 0 ? void 0 : _g.focus) === null || _h === void 0 ? void 0 : _h.name, (_k = (_j = params.theme) === null || _j === void 0 ? void 0 : _j.focus) === null || _k === void 0 ? void 0 : _k.params)];
                     case 10:
                         _o.sent();
+                        resetPostprocessingProps(plugin);
                         return [2 /*return*/, { components: components, representations: representations }];
                 }
             });
@@ -241,6 +253,7 @@ var proteinAndNucleic = StructureRepresentationPresetProvider({
                         return [4 /*yield*/, updateFocusRepr(plugin, structure, (_b = (_a = params.theme) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.name, (_d = (_c = params.theme) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.params)];
                     case 4:
                         _g.sent();
+                        resetPostprocessingProps(plugin);
                         return [2 /*return*/, { components: components, representations: representations }];
                 }
             });
@@ -307,6 +320,7 @@ var coarseSurface = StructureRepresentationPresetProvider({
                         return [4 /*yield*/, updateFocusRepr(plugin, structure, (_b = (_a = params.theme) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.name, (_d = (_c = params.theme) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.params)];
                     case 4:
                         _g.sent();
+                        resetPostprocessingProps(plugin);
                         return [2 /*return*/, { components: components, representations: representations }];
                 }
             });
@@ -350,6 +364,7 @@ var polymerCartoon = StructureRepresentationPresetProvider({
                         return [4 /*yield*/, updateFocusRepr(plugin, structure, (_b = (_a = params.theme) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.name, (_d = (_c = params.theme) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.params)];
                     case 3:
                         _g.sent();
+                        resetPostprocessingProps(plugin);
                         return [2 /*return*/, { components: components, representations: representations }];
                 }
             });
@@ -427,6 +442,62 @@ var atomicDetail = StructureRepresentationPresetProvider({
                         return [4 /*yield*/, updateFocusRepr(plugin, structure, (_c = (_b = (_a = params.theme) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : color, (_f = (_e = (_d = params.theme) === null || _d === void 0 ? void 0 : _d.focus) === null || _e === void 0 ? void 0 : _e.params) !== null && _f !== void 0 ? _f : colorParams)];
                     case 5:
                         _o.sent();
+                        resetPostprocessingProps(plugin);
+                        return [2 /*return*/, { components: components, representations: representations }];
+                }
+            });
+        });
+    }
+});
+var illustrative = StructureRepresentationPresetProvider({
+    id: 'preset-structure-representation-illustrative',
+    display: {
+        name: 'Illustrative', group: 'Miscellaneous',
+        description: '...'
+    },
+    params: function () { return (__assign(__assign({}, CommonParams), { showCarbohydrateSymbol: PD.Boolean(false) })); },
+    apply: function (ref, params, plugin) {
+        var _a, _b, _c, _d, _e;
+        return __awaiter(this, void 0, void 0, function () {
+            var structureCell, components, structure, _f, update, builder, typeParams, color, representations;
+            var _g;
+            return __generator(this, function (_h) {
+                switch (_h.label) {
+                    case 0:
+                        structureCell = StateObjectRef.resolveAndCheck(plugin.state.data, ref);
+                        if (!structureCell)
+                            return [2 /*return*/, {}];
+                        _g = {};
+                        return [4 /*yield*/, presetStaticComponent(plugin, structureCell, 'all')];
+                    case 1:
+                        components = (_g.all = _h.sent(),
+                            _g.branched = undefined,
+                            _g);
+                        structure = structureCell.obj.data;
+                        _f = reprBuilder(plugin, params, structure), update = _f.update, builder = _f.builder, typeParams = _f.typeParams, color = _f.color;
+                        representations = {
+                            all: builder.buildRepresentation(update, components.all, { type: 'spacefill', typeParams: __assign(__assign({}, typeParams), { ignoreLight: true }), color: 'illustrative' }, { tag: 'all' }),
+                        };
+                        return [4 /*yield*/, update.commit({ revertOnError: true })];
+                    case 2:
+                        _h.sent();
+                        return [4 /*yield*/, updateFocusRepr(plugin, structure, (_c = (_b = (_a = params.theme) === null || _a === void 0 ? void 0 : _a.focus) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : color, (_e = (_d = params.theme) === null || _d === void 0 ? void 0 : _d.focus) === null || _e === void 0 ? void 0 : _e.params)];
+                    case 3:
+                        _h.sent();
+                        if (plugin.canvas3d) {
+                            plugin.canvas3d.setProps({
+                                postprocessing: {
+                                    outline: {
+                                        name: 'on',
+                                        params: { scale: 1, color: Color(0x000000), threshold: 0.25 }
+                                    },
+                                    occlusion: {
+                                        name: 'on',
+                                        params: { bias: 0.9, blurKernelSize: 15, radius: 5, samples: 32 }
+                                    },
+                                }
+                            });
+                        }
                         return [2 /*return*/, { components: components, representations: representations }];
                 }
             });
@@ -446,6 +517,7 @@ export var PresetStructureRepresentations = {
     'polymer-cartoon': polymerCartoon,
     'polymer-and-ligand': polymerAndLigand,
     'protein-and-nucleic': proteinAndNucleic,
-    'coarse-surface': coarseSurface
+    'coarse-surface': coarseSurface,
+    'illustrative': illustrative,
 };
 //# sourceMappingURL=representation-preset.js.map

package/lib/mol-plugin-state/helpers/structure-clipping.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019-2020 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
  *
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  * @author David Sehnal <david.sehnal@gmail.com>

package/lib/mol-plugin-state/helpers/structure-clipping.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019-2020 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
  *
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  * @author David Sehnal <david.sehnal@gmail.com>

package/lib/mol-plugin-state/manager/animation.d.ts

@@ -29,7 +29,7 @@ declare class PluginAnimationManager extends StatefulPluginComponent<PluginAnima
     updateCurrentParams(values: any): void;
     register(animation: PluginStateAnimation): void;
     play<P>(animation: PluginStateAnimation<P>, params: P): Promise<void>;
-    tick(t: number, isSynchronous?: boolean): Promise<void>;
+    tick(t: number, isSynchronous?: boolean, animation?: PluginAnimationManager.AnimationInfo): Promise<void>;
     private isStopped;
     private isApplying;
     start(): Promise<void>;
@@ -43,6 +43,10 @@ declare class PluginAnimationManager extends StatefulPluginComponent<PluginAnima
     constructor(context: PluginContext);
 }
 declare namespace PluginAnimationManager {
+    interface AnimationInfo {
+        currentFrame: number;
+        frameCount: number;
+    }
     interface Current {
         anim: PluginStateAnimation;
         params: PD.Params;

package/lib/mol-plugin-state/manager/animation.js

@@ -113,7 +113,7 @@ var PluginAnimationManager = /** @class */ (function (_super) {
             });
         });
     };
-    PluginAnimationManager.prototype.tick = function (t, isSynchronous) {
+    PluginAnimationManager.prototype.tick = function (t, isSynchronous, animation) {
         return __awaiter(this, void 0, void 0, function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
@@ -121,8 +121,8 @@ var PluginAnimationManager = /** @class */ (function (_super) {
                         this.currentTime = t;
                         if (this.isStopped)
                             return [2 /*return*/];
-                        if (!isSynchronous) return [3 /*break*/, 2];
-                        return [4 /*yield*/, this.applyFrame()];
+                        if (!(isSynchronous || animation)) return [3 /*break*/, 2];
+                        return [4 /*yield*/, this.applyFrame(animation)];
                     case 1:
                         _a.sent();
                         return [3 /*break*/, 3];
@@ -221,7 +221,7 @@ var PluginAnimationManager = /** @class */ (function (_super) {
             });
         });
     };
-    PluginAnimationManager.prototype.applyFrame = function () {
+    PluginAnimationManager.prototype.applyFrame = function (animation) {
         return __awaiter(this, void 0, void 0, function () {
             var t, newState;
             return __generator(this, function (_a) {
@@ -230,7 +230,7 @@ var PluginAnimationManager = /** @class */ (function (_super) {
                         t = this.currentTime;
                         if (this._current.startedTime < 0)
                             this._current.startedTime = t;
-                        return [4 /*yield*/, this._current.anim.apply(this._current.state, { lastApplied: this._current.lastTime, current: t - this._current.startedTime }, { params: this._current.paramValues, plugin: this.context })];
+                        return [4 /*yield*/, this._current.anim.apply(this._current.state, { lastApplied: this._current.lastTime, current: t - this._current.startedTime, animation: animation }, { params: this._current.paramValues, plugin: this.context })];
                     case 1:
                         newState = _a.sent();
                         if (newState.kind === 'finished') {

package/lib/mol-plugin-state/manager/structure/component.d.ts

@@ -1,7 +1,8 @@
 /**
- * Copyright (c) 2019-2020 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2021 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>
  */
 import { PluginContext } from '../../../mol-plugin/context';
 import { StateTransformer } from '../../../mol-state';
@@ -13,6 +14,7 @@ import { StatefulPluginComponent } from '../../component';
 import { StructureSelectionQuery } from '../../helpers/structure-selection-query';
 import { StructureRepresentation3D } from '../../transforms/representation';
 import { StructureHierarchyRef, StructureComponentRef, StructureRef, StructureRepresentationRef } from './hierarchy-state';
+import { Clip } from '../../../mol-util/clip';
 export { StructureComponentManager };
 interface StructureComponentManagerState {
     options: StructureComponentManager.Options;
@@ -63,6 +65,16 @@ declare namespace StructureComponentManager {
             roughness: number;
             bumpiness: number;
         }>>;
+        clipObjects: PD.Group<PD.Normalize<{
+            variant: Clip.Variant;
+            objects: PD.Normalize<{
+                type: any;
+                invert: any;
+                position: any;
+                rotation: any;
+                scale: any;
+            }>[];
+        }>>;
         interactions: PD.Group<PD.Normalize<{
             providers: PD.Normalize<{
                 ionic: any;

package/lib/mol-plugin-state/manager/structure/component.js

@@ -1,7 +1,8 @@
 /**
- * Copyright (c) 2019-2020 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2021 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>
  */
 import { __assign, __awaiter, __extends, __generator, __spreadArray } from "tslib";
 import { VisualQualityOptions } from '../../../mol-geo/geometry/base';
@@ -25,6 +26,7 @@ import { setStructureTransparency } from '../../helpers/structure-transparency';
 import { StructureFocusRepresentation } from '../../../mol-plugin/behavior/dynamic/selection/structure-focus-representation';
 import { setStructureSubstance } from '../../helpers/structure-substance';
 import { Material } from '../../../mol-util/material';
+import { Clip } from '../../../mol-util/clip';
 export { StructureComponentManager };
 var StructureComponentManager = /** @class */ (function (_super) {
     __extends(StructureComponentManager, _super);
@@ -75,6 +77,7 @@ var StructureComponentManager = /** @class */ (function (_super) {
                                     return [4 /*yield*/, this.plugin.state.updateBehavior(StructureFocusRepresentation, function (p) {
                                             p.ignoreHydrogens = !options.showHydrogens;
                                             p.material = options.materialStyle;
+                                            p.clip = options.clipObjects;
                                         })];
                                 case 2:
                                     _a.sent();
@@ -91,18 +94,19 @@ var StructureComponentManager = /** @class */ (function (_super) {
         });
     };
     StructureComponentManager.prototype.updateReprParams = function (update, component) {
-        var _a = this.state.options, showHydrogens = _a.showHydrogens, quality = _a.visualQuality, material = _a.materialStyle;
+        var _a = this.state.options, showHydrogens = _a.showHydrogens, quality = _a.visualQuality, material = _a.materialStyle, clip = _a.clipObjects;
         var ignoreHydrogens = !showHydrogens;
         for (var _i = 0, _b = component.representations; _i < _b.length; _i++) {
             var r = _b[_i];
             if (r.cell.transform.transformer !== StructureRepresentation3D)
                 continue;
             var params = r.cell.transform.params;
-            if (!!params.type.params.ignoreHydrogens !== ignoreHydrogens || params.type.params.quality !== quality || !shallowEqual(params.type.params.material, material)) {
+            if (!!params.type.params.ignoreHydrogens !== ignoreHydrogens || params.type.params.quality !== quality || !shallowEqual(params.type.params.material, material) || !PD.areEqual(Clip.Params, params.type.params.clip, clip)) {
                 update.to(r.cell).update(function (old) {
                     old.type.params.ignoreHydrogens = ignoreHydrogens;
                     old.type.params.quality = quality;
                     old.type.params.material = material;
+                    old.type.params.clip = clip;
                 });
             }
         }
@@ -374,9 +378,9 @@ var StructureComponentManager = /** @class */ (function (_super) {
         var _this = this;
         if (components.length === 0)
             return;
-        var _a = this.state.options, showHydrogens = _a.showHydrogens, quality = _a.visualQuality, material = _a.materialStyle;
+        var _a = this.state.options, showHydrogens = _a.showHydrogens, quality = _a.visualQuality, material = _a.materialStyle, clip = _a.clipObjects;
         var ignoreHydrogens = !showHydrogens;
-        var typeParams = { ignoreHydrogens: ignoreHydrogens, quality: quality, material: material };
+        var typeParams = { ignoreHydrogens: ignoreHydrogens, quality: quality, material: material, clip: clip };
         return this.plugin.dataTransaction(function () { return __awaiter(_this, void 0, void 0, function () {
             var _i, components_9, component;
             return __generator(this, function (_a) {
@@ -437,16 +441,16 @@ var StructureComponentManager = /** @class */ (function (_super) {
             var _this = this;
             return __generator(this, function (_a) {
                 return [2 /*return*/, this.plugin.dataTransaction(function () { return __awaiter(_this, void 0, void 0, function () {
-                        var xs, _a, showHydrogens, quality, material, ignoreHydrogens, typeParams, componentKey, _i, xs_1, s, component;
+                        var xs, _a, showHydrogens, quality, material, clip, ignoreHydrogens, typeParams, componentKey, _i, xs_1, s, component;
                         return __generator(this, function (_b) {
                             switch (_b.label) {
                                 case 0:
                                     xs = structures || this.currentStructures;
                                     if (xs.length === 0)
                                         return [2 /*return*/];
-                                    _a = this.state.options, showHydrogens = _a.showHydrogens, quality = _a.visualQuality, material = _a.materialStyle;
+                                    _a = this.state.options, showHydrogens = _a.showHydrogens, quality = _a.visualQuality, material = _a.materialStyle, clip = _a.clipObjects;
                                     ignoreHydrogens = !showHydrogens;
-                                    typeParams = { ignoreHydrogens: ignoreHydrogens, quality: quality, material: material };
+                                    typeParams = { ignoreHydrogens: ignoreHydrogens, quality: quality, material: material, clip: clip };
                                     componentKey = UUID.create22();
                                     _i = 0, xs_1 = xs;
                                     _b.label = 1;
@@ -622,6 +626,7 @@ var StructureComponentManager = /** @class */ (function (_super) {
         showHydrogens: PD.Boolean(true, { description: 'Toggle display of hydrogen atoms in representations' }),
         visualQuality: PD.Select('auto', VisualQualityOptions, { description: 'Control the visual/rendering quality of representations' }),
         materialStyle: Material.getParam(),
+        clipObjects: PD.Group(Clip.Params),
         interactions: PD.Group(InteractionsProvider.defaultParams, { label: 'Non-covalent Interactions' }),
     };
     function getAddParams(plugin, params) {

package/lib/mol-plugin-state/manager/structure/selection.js

@@ -247,7 +247,9 @@ var StructureSelectionManager = /** @class */ (function (_super) {
         var cell = this.plugin.helpers.substructureParent.get(obj.data, true);
         if (!cell)
             return;
-        ref = cell.transform.ref;
+        // only need to update the root
+        if (ref !== cell.transform.ref)
+            return;
         if (!this.entries.has(ref))
             return;
         // use structure from last decorator as reference

package/lib/mol-plugin-state/transforms/representation.d.ts

@@ -159,6 +159,10 @@ declare const ModelUnitcell3D: StateTransformer<SO.Molecule.Model, SO.Shape.Repr
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
 }>>;
 export { StructureBoundingBox3D };
 declare type StructureBoundingBox3D = typeof StructureBoundingBox3D;
@@ -177,6 +181,10 @@ declare const StructureBoundingBox3D: StateTransformer<SO.Molecule.Structure, SO
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
     radius: number;
     color: Color;
 }>>;
@@ -214,6 +222,10 @@ declare const StructureSelectionsDistance3D: StateTransformer<SO.Molecule.Struct
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
     lineSizeAttenuation: boolean;
     linesColor: Color;
     linesSize: number;
@@ -252,6 +264,10 @@ declare const StructureSelectionsAngle3D: StateTransformer<SO.Molecule.Structure
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
     ignoreLight: boolean;
     sectorOpacity: number;
     color: Color;
@@ -299,6 +315,10 @@ declare const StructureSelectionsDihedral3D: StateTransformer<SO.Molecule.Struct
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
     ignoreLight: boolean;
     sectorOpacity: number;
     color: Color;
@@ -347,6 +367,10 @@ declare const StructureSelectionsLabel3D: StateTransformer<SO.Molecule.Structure
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
 }>>;
 export { StructureSelectionsOrientation3D };
 declare type StructureSelectionsOrientation3D = typeof StructureSelectionsOrientation3D;
@@ -369,6 +393,10 @@ declare const StructureSelectionsOrientation3D: StateTransformer<SO.Molecule.Str
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
 }>>;
 export { StructureSelectionsPlane3D };
 declare type StructureSelectionsPlane3D = typeof StructureSelectionsPlane3D;
@@ -390,4 +418,8 @@ declare const StructureSelectionsPlane3D: StateTransformer<SO.Molecule.Structure
         roughness: number;
         bumpiness: number;
     }>;
+    clip: PD.Normalize<{
+        variant: any;
+        objects: any;
+    }>;
 }>>;

package/lib/mol-plugin-state/transforms/representation.js

@@ -85,7 +85,7 @@ var StructureRepresentation3D = PluginStateTransform.BuiltIn({
         return ({
             type: PD.Mapped(registry.default.name, registry.getApplicableTypes(a.data), function (name) { return PD.Group(registry.get(name).getParams(themeCtx, a.data)); }),
             colorTheme: PD.Mapped(type.defaultColorTheme.name, themeCtx.colorThemeRegistry.getApplicableTypes(dataCtx), function (name) { return PD.Group(themeCtx.colorThemeRegistry.get(name).getParams(dataCtx)); }, colorThemeInfo),
-            sizeTheme: PD.Mapped(type.defaultSizeTheme.name, themeCtx.sizeThemeRegistry.types, function (name) { return PD.Group(themeCtx.sizeThemeRegistry.get(name).getParams(dataCtx)); })
+            sizeTheme: PD.Mapped(type.defaultSizeTheme.name, themeCtx.sizeThemeRegistry.getApplicableTypes(dataCtx), function (name) { return PD.Group(themeCtx.sizeThemeRegistry.get(name).getParams(dataCtx)); })
         });
     }
 })({
@@ -799,7 +799,7 @@ var VolumeRepresentation3D = PluginStateTransform.BuiltIn({
         return ({
             type: PD.Mapped(registry.default.name, registry.types, function (name) { return PD.Group(registry.get(name).getParams(themeCtx, a.data)); }),
             colorTheme: PD.Mapped(type.defaultColorTheme.name, themeCtx.colorThemeRegistry.getApplicableTypes(dataCtx), function (name) { return PD.Group(themeCtx.colorThemeRegistry.get(name).getParams(dataCtx)); }),
-            sizeTheme: PD.Mapped(type.defaultSizeTheme.name, themeCtx.sizeThemeRegistry.types, function (name) { return PD.Group(themeCtx.sizeThemeRegistry.get(name).getParams(dataCtx)); })
+            sizeTheme: PD.Mapped(type.defaultSizeTheme.name, themeCtx.sizeThemeRegistry.getApplicableTypes(dataCtx), function (name) { return PD.Group(themeCtx.sizeThemeRegistry.get(name).getParams(dataCtx)); })
         });
     }
 })({