@jbrowse/core 4.2.1 → 5.0.0-beta.1

package/esm/ui/theme.d.ts

@@ -1,58 +1,372 @@
+import type { AlignmentFill, StringColors } from './palette.ts';
 import type { PaletteColor, PaletteColorOptions, Theme, ThemeOptions } from '@mui/material/styles';
-type MaybePaletteColor = PaletteColor | undefined;
-type Frames = [
+type FrameTuple<T> = [
     null,
-    MaybePaletteColor,
-    MaybePaletteColor,
-    MaybePaletteColor,
-    MaybePaletteColor,
-    MaybePaletteColor,
-    MaybePaletteColor
+    T | undefined,
+    T | undefined,
+    T | undefined,
+    T | undefined,
+    T | undefined,
+    T | undefined
 ];
+type Frames = FrameTuple<PaletteColor>;
+type FramesOptions = FrameTuple<PaletteColorOptions>;
 declare module '@mui/material/styles' {
-    interface Palette {
+    interface Palette extends StringColors {
+        /** Accordion headers and some toolbar chrome */
         tertiary: PaletteColor;
+        /** Secondary floating-action-button background */
         quaternary: PaletteColor;
+        /** Selection highlights */
         highlight: PaletteColor;
-        stopCodon: string;
-        startCodon: string;
-        insertion: string;
-        softclip: string;
-        skip: string;
-        hardclip: string;
-        deletion: string;
+        /** Text-match highlight behind search hits */
+        textHighlight: PaletteColor;
+        /** Per-base colors for sequence and SNP rendering */
         bases: {
+            /** Adenine */
             A: PaletteColor;
+            /** Cytosine */
             C: PaletteColor;
+            /** Guanine */
             G: PaletteColor;
+            /** Thymine */
             T: PaletteColor;
+            /** N / ambiguous base */
+            N: PaletteColor;
         };
+        /** Reading-frame coloring outside CDS, indexed 1..3 and -1..-3 */
         frames: Frames;
+        /** Reading-frame coloring within CDS, indexed 1..3 and -1..-3 */
         framesCDS: Frames;
+        /** Read fill by pair orientation, when coloring alignments by pair */
+        alignmentFill: AlignmentFill;
     }
-    interface PaletteOptions {
+    interface PaletteOptions extends Partial<StringColors> {
         tertiary?: PaletteColorOptions;
         quaternary?: PaletteColorOptions;
         highlight?: PaletteColorOptions;
-        stopCodon?: string;
-        startCodon?: string;
-        hardclip?: string;
-        softclip?: string;
-        insertion?: string;
-        skip?: string;
-        deletion?: string;
+        textHighlight?: PaletteColorOptions;
         bases?: {
             A?: PaletteColorOptions;
             C?: PaletteColorOptions;
             G?: PaletteColorOptions;
             T?: PaletteColorOptions;
+            N?: PaletteColorOptions;
         };
-        framesCDS?: Frames;
-        frames?: Frames;
+        framesCDS?: FramesOptions;
+        frames?: FramesOptions;
+        alignmentFill?: Partial<AlignmentFill>;
     }
 }
-export declare const defaultThemes: ThemeMap;
+export { colorFwdStrand, colorInterchrom, colorLongInsert, colorLongreadInv, colorNeutralRead, colorPairLL, colorPairLR, colorPairLRDark, colorPairRL, colorPairRR, colorRevStrand, colorShortInsert, colorSplitReadInversion, colorSupplementary, colorUnmappedMate, colorUnmappedMateDark, methylated5hmC, methylated5mC, tagColorPalette, unmethylated5mC, } from './palette.ts';
+export type { JBrowsePalette } from './palette.ts';
+/**
+ * The structurally-serializable inputs that fully describe a session's active
+ * theme. A created MUI `Theme` carries functions (e.g. `breakpoints.up`) and
+ * cannot cross the RPC worker boundary; these args can, and
+ * {@link createJBrowseThemeFromArgs} rebuilds the identical theme on the other
+ * side. A worker that only needs colors should call `resolvePalette` with these
+ * instead, which skips Material UI entirely.
+ */
+export interface SerializableThemeArgs {
+    configTheme?: ThemeOptions;
+    themeName?: string;
+    extraThemes?: ThemeMap;
+}
+export declare const defaultThemes: {
+    default: {
+        palette: {
+            stopCodon?: string | undefined;
+            startCodon?: string | undefined;
+            codonNonsynonymous?: string | undefined;
+            codonSynonymous?: string | undefined;
+            codonStop?: string | undefined;
+            coverage?: string | undefined;
+            insertion?: string | undefined;
+            softclip?: string | undefined;
+            skip?: string | undefined;
+            hardclip?: string | undefined;
+            deletion?: string | undefined;
+            readOverlap?: string | undefined;
+            modificationFwd?: string | undefined;
+            modificationRev?: string | undefined;
+            mutedSnpBase?: string | undefined;
+            missingData?: string | undefined;
+            gridlineMinor?: string | undefined;
+            gridlineMajor?: string | undefined;
+            plotGridlineMinor?: string | undefined;
+            plotGridlineMajor?: string | undefined;
+            regionBoundary?: string | undefined;
+            featureHover?: string | undefined;
+            featureHoverStrong?: string | undefined;
+            featureSelected?: string | undefined;
+            featureDescription?: string | undefined;
+            mode?: 'light' | 'dark';
+            primary?: import("./palette.ts").ShadeInput;
+            secondary?: import("./palette.ts").ShadeInput;
+            tertiary?: import("./palette.ts").ShadeInput;
+            quaternary?: import("./palette.ts").ShadeInput;
+            highlight?: import("./palette.ts").ShadeInput;
+            textHighlight?: import("./palette.ts").ShadeInput;
+            error?: import("./palette.ts").ShadeInput;
+            warning?: import("./palette.ts").ShadeInput;
+            info?: import("./palette.ts").ShadeInput;
+            success?: import("./palette.ts").ShadeInput;
+            bases?: Partial<Record<import("./palette.ts").BaseKey, import("./palette.ts").ShadeInput>>;
+            frames?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            framesCDS?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            alignmentFill?: Partial<AlignmentFill>;
+            text?: Partial<import("./palette.ts").NeutralTokens['text']>;
+            background?: Partial<import("./palette.ts").NeutralTokens['background']>;
+            divider?: string;
+            common?: Partial<import("./palette.ts").NeutralTokens['common']>;
+            grey?: Partial<import("./palette.ts").NeutralTokens['grey']>;
+            action?: Partial<import("./palette.ts").NeutralTokens['action']>;
+        };
+        name: string;
+    };
+    lightStock: {
+        palette: {
+            stopCodon?: string | undefined;
+            startCodon?: string | undefined;
+            codonNonsynonymous?: string | undefined;
+            codonSynonymous?: string | undefined;
+            codonStop?: string | undefined;
+            coverage?: string | undefined;
+            insertion?: string | undefined;
+            softclip?: string | undefined;
+            skip?: string | undefined;
+            hardclip?: string | undefined;
+            deletion?: string | undefined;
+            readOverlap?: string | undefined;
+            modificationFwd?: string | undefined;
+            modificationRev?: string | undefined;
+            mutedSnpBase?: string | undefined;
+            missingData?: string | undefined;
+            gridlineMinor?: string | undefined;
+            gridlineMajor?: string | undefined;
+            plotGridlineMinor?: string | undefined;
+            plotGridlineMajor?: string | undefined;
+            regionBoundary?: string | undefined;
+            featureHover?: string | undefined;
+            featureHoverStrong?: string | undefined;
+            featureSelected?: string | undefined;
+            featureDescription?: string | undefined;
+            mode?: 'light' | 'dark';
+            primary?: import("./palette.ts").ShadeInput;
+            secondary?: import("./palette.ts").ShadeInput;
+            tertiary?: import("./palette.ts").ShadeInput;
+            quaternary?: import("./palette.ts").ShadeInput;
+            highlight?: import("./palette.ts").ShadeInput;
+            textHighlight?: import("./palette.ts").ShadeInput;
+            error?: import("./palette.ts").ShadeInput;
+            warning?: import("./palette.ts").ShadeInput;
+            info?: import("./palette.ts").ShadeInput;
+            success?: import("./palette.ts").ShadeInput;
+            bases?: Partial<Record<import("./palette.ts").BaseKey, import("./palette.ts").ShadeInput>>;
+            frames?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            framesCDS?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            alignmentFill?: Partial<AlignmentFill>;
+            text?: Partial<import("./palette.ts").NeutralTokens['text']>;
+            background?: Partial<import("./palette.ts").NeutralTokens['background']>;
+            divider?: string;
+            common?: Partial<import("./palette.ts").NeutralTokens['common']>;
+            grey?: Partial<import("./palette.ts").NeutralTokens['grey']>;
+            action?: Partial<import("./palette.ts").NeutralTokens['action']>;
+        };
+        name: string;
+    };
+    lightMinimal: {
+        name: string;
+        palette: {
+            stopCodon?: string | undefined;
+            startCodon?: string | undefined;
+            codonNonsynonymous?: string | undefined;
+            codonSynonymous?: string | undefined;
+            codonStop?: string | undefined;
+            coverage?: string | undefined;
+            insertion?: string | undefined;
+            softclip?: string | undefined;
+            skip?: string | undefined;
+            hardclip?: string | undefined;
+            deletion?: string | undefined;
+            readOverlap?: string | undefined;
+            modificationFwd?: string | undefined;
+            modificationRev?: string | undefined;
+            mutedSnpBase?: string | undefined;
+            missingData?: string | undefined;
+            gridlineMinor?: string | undefined;
+            gridlineMajor?: string | undefined;
+            plotGridlineMinor?: string | undefined;
+            plotGridlineMajor?: string | undefined;
+            regionBoundary?: string | undefined;
+            featureHover?: string | undefined;
+            featureHoverStrong?: string | undefined;
+            featureSelected?: string | undefined;
+            featureDescription?: string | undefined;
+            mode?: 'light' | 'dark';
+            quaternary?: import("./palette.ts").ShadeInput;
+            highlight?: import("./palette.ts").ShadeInput;
+            textHighlight?: import("./palette.ts").ShadeInput;
+            error?: import("./palette.ts").ShadeInput;
+            warning?: import("./palette.ts").ShadeInput;
+            info?: import("./palette.ts").ShadeInput;
+            success?: import("./palette.ts").ShadeInput;
+            bases?: Partial<Record<import("./palette.ts").BaseKey, import("./palette.ts").ShadeInput>>;
+            frames?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            framesCDS?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            alignmentFill?: Partial<AlignmentFill>;
+            text?: Partial<import("./palette.ts").NeutralTokens['text']>;
+            background?: Partial<import("./palette.ts").NeutralTokens['background']>;
+            divider?: string;
+            common?: Partial<import("./palette.ts").NeutralTokens['common']>;
+            grey?: Partial<import("./palette.ts").NeutralTokens['grey']>;
+            action?: Partial<import("./palette.ts").NeutralTokens['action']>;
+            primary: {
+                main: string;
+            };
+            secondary: {
+                main: string;
+            };
+            tertiary: {
+                main: string;
+            };
+        };
+    };
+    darkMinimal: {
+        name: string;
+        palette: {
+            stopCodon?: string | undefined;
+            startCodon?: string | undefined;
+            codonNonsynonymous?: string | undefined;
+            codonSynonymous?: string | undefined;
+            codonStop?: string | undefined;
+            coverage?: string | undefined;
+            insertion?: string | undefined;
+            softclip?: string | undefined;
+            skip?: string | undefined;
+            hardclip?: string | undefined;
+            deletion?: string | undefined;
+            readOverlap?: string | undefined;
+            modificationFwd?: string | undefined;
+            modificationRev?: string | undefined;
+            mutedSnpBase?: string | undefined;
+            missingData?: string | undefined;
+            gridlineMinor?: string | undefined;
+            gridlineMajor?: string | undefined;
+            plotGridlineMinor?: string | undefined;
+            plotGridlineMajor?: string | undefined;
+            regionBoundary?: string | undefined;
+            featureHover?: string | undefined;
+            featureHoverStrong?: string | undefined;
+            featureSelected?: string | undefined;
+            featureDescription?: string | undefined;
+            quaternary?: import("./palette.ts").ShadeInput;
+            highlight?: import("./palette.ts").ShadeInput;
+            textHighlight?: import("./palette.ts").ShadeInput;
+            error?: import("./palette.ts").ShadeInput;
+            warning?: import("./palette.ts").ShadeInput;
+            info?: import("./palette.ts").ShadeInput;
+            success?: import("./palette.ts").ShadeInput;
+            bases?: Partial<Record<import("./palette.ts").BaseKey, import("./palette.ts").ShadeInput>>;
+            frames?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            framesCDS?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            alignmentFill?: Partial<AlignmentFill>;
+            text?: Partial<import("./palette.ts").NeutralTokens['text']>;
+            background?: Partial<import("./palette.ts").NeutralTokens['background']>;
+            divider?: string;
+            common?: Partial<import("./palette.ts").NeutralTokens['common']>;
+            grey?: Partial<import("./palette.ts").NeutralTokens['grey']>;
+            action?: Partial<import("./palette.ts").NeutralTokens['action']>;
+            mode: "dark";
+            primary: {
+                main: string;
+            };
+            secondary: {
+                main: string;
+            };
+            tertiary: {
+                main: string;
+            };
+        };
+    };
+    darkStock: {
+        name: string;
+        palette: {
+            stopCodon?: string | undefined;
+            startCodon?: string | undefined;
+            codonNonsynonymous?: string | undefined;
+            codonSynonymous?: string | undefined;
+            codonStop?: string | undefined;
+            coverage?: string | undefined;
+            insertion?: string | undefined;
+            softclip?: string | undefined;
+            skip?: string | undefined;
+            hardclip?: string | undefined;
+            deletion?: string | undefined;
+            readOverlap?: string | undefined;
+            modificationFwd?: string | undefined;
+            modificationRev?: string | undefined;
+            mutedSnpBase?: string | undefined;
+            missingData?: string | undefined;
+            gridlineMinor?: string | undefined;
+            gridlineMajor?: string | undefined;
+            plotGridlineMinor?: string | undefined;
+            plotGridlineMajor?: string | undefined;
+            regionBoundary?: string | undefined;
+            featureHover?: string | undefined;
+            featureHoverStrong?: string | undefined;
+            featureSelected?: string | undefined;
+            featureDescription?: string | undefined;
+            primary?: import("./palette.ts").ShadeInput;
+            secondary?: import("./palette.ts").ShadeInput;
+            tertiary?: import("./palette.ts").ShadeInput;
+            quaternary?: import("./palette.ts").ShadeInput;
+            highlight?: import("./palette.ts").ShadeInput;
+            textHighlight?: import("./palette.ts").ShadeInput;
+            error?: import("./palette.ts").ShadeInput;
+            warning?: import("./palette.ts").ShadeInput;
+            info?: import("./palette.ts").ShadeInput;
+            success?: import("./palette.ts").ShadeInput;
+            bases?: Partial<Record<import("./palette.ts").BaseKey, import("./palette.ts").ShadeInput>>;
+            frames?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            framesCDS?: import("./palette.ts").FrameTuple<import("./palette.ts").ShadeInput>;
+            alignmentFill?: Partial<AlignmentFill>;
+            text?: Partial<import("./palette.ts").NeutralTokens['text']>;
+            background?: Partial<import("./palette.ts").NeutralTokens['background']>;
+            divider?: string;
+            common?: Partial<import("./palette.ts").NeutralTokens['common']>;
+            grey?: Partial<import("./palette.ts").NeutralTokens['grey']>;
+            action?: Partial<import("./palette.ts").NeutralTokens['action']>;
+            mode: "dark";
+        };
+        components: {
+            MuiAppBar: {
+                defaultProps: {
+                    enableColorOnDark: true;
+                };
+            };
+        };
+    };
+};
 export declare function createJBrowseBaseTheme(theme?: ThemeOptions): ThemeOptions;
-type ThemeMap = Record<string, ThemeOptions>;
+export type ThemeMap = Record<string, ThemeOptions & {
+    name?: string;
+}>;
+/**
+ * Rebuild a JBrowse theme from {@link SerializableThemeArgs}, the inverse of
+ * passing those args across RPC. Mirrors a session's `theme` getter so the main
+ * thread and a worker resolve to the same colors.
+ */
+export declare function createJBrowseThemeFromArgs(args?: SerializableThemeArgs): Theme;
+/**
+ * Build the Material UI theme for a set of theme inputs.
+ *
+ * The colors are `resolvePalette`'s, spliced in already resolved, so this and
+ * every renderer read the same values by construction rather than by keeping
+ * two lists in step. What this adds on top is the Material UI half: the
+ * component defaults and style overrides in `baseThemeOptions`, plus whatever
+ * non-palette options the selected theme or the config theme declares.
+ */
 export declare function createJBrowseTheme(configTheme?: ThemeOptions, themes?: ThemeMap, themeName?: string): Theme;
-export {};
+export type JBrowseTheme = Theme;