experimental sequence theme

src/mol-plugin-ui/context.ts

@@ -11,6 +11,7 @@ import { StateTransformParameters } from './state/common';
 
 export class PluginUIContext extends PluginContext {
     readonly customParamEditors = new Map<string, StateTransformParameters.Class>();
+    readonly customUIState: Record<string, any> = {};
 
     private initCustomParamEditors() {
         if (!this.spec.customParamEditors) return;

src/mol-plugin-ui/sequence.tsx

@@ -24,6 +24,8 @@ import { elementLabel } from '../mol-theme/label';
 import { Icon, HelpOutlineSvg } from './controls/icons';
 import { StructureSelectionManager } from '../mol-plugin-state/manager/structure/selection';
 import { arrayEqual } from '../mol-util/array';
+import { Observable } from 'rxjs';
+import { ThemeProvider } from '../mol-theme/theme';
 
 const MaxDisplaySequenceLength = 5000;
 // TODO: add virtualized Select controls (at best with a search box)?
@@ -244,6 +246,13 @@ export class SequenceView extends PluginUIComponent<{ defaultMode?: SequenceView
             }
         });
 
+        const experimentalSequenceTheme = this.plugin.customUIState.experimentalSequenceTheme as Observable<ThemeProvider<any, any> | undefined> | undefined;
+        if (experimentalSequenceTheme) {
+            this.subscribe(experimentalSequenceTheme as Observable<ThemeProvider<any, any>>, theme => {
+                // do stuff
+            });
+        }
+
         const modeOptions = this.plugin.spec.components?.sequenceViewer?.modeOptions;
         if (modeOptions) {
             const modeSet = new Set(modeOptions);