@jbrowse/core 3.0.5 → 3.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/package.json +2 -2
  2. package/pluggableElementTypes/models/BaseTrackModel.d.ts +2 -0
  3. package/pluggableElementTypes/models/BaseTrackModel.js +4 -0
  4. package/pluggableElementTypes/renderers/BoxRendererType.js +3 -1
  5. package/rpc/methods/CoreRender.js +4 -12
  6. package/tsconfig.build.tsbuildinfo +1 -1
  7. package/ui/index.d.ts +1 -0
  8. package/ui/index.js +2 -1
  9. package/ui/theme.d.ts +41 -52
  10. package/ui/theme.js +35 -38
package/ui/index.d.ts CHANGED
@@ -14,3 +14,4 @@ export { default as PrerenderedCanvas } from './PrerenderedCanvas';
14
14
  export { default as ResizeHandle } from './ResizeHandle';
15
15
  export { default as SanitizedHTML } from './SanitizedHTML';
16
16
  export * from './Menu';
17
+ export declare const VIEW_HEADER_HEIGHT = 28;
package/ui/index.js CHANGED
@@ -17,7 +17,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
17
17
  return (mod && mod.__esModule) ? mod : { "default": mod };
18
18
  };
19
19
  Object.defineProperty(exports, "__esModule", { value: true });
20
- exports.SanitizedHTML = exports.ResizeHandle = exports.PrerenderedCanvas = exports.Menu = exports.LoadingEllipses = exports.FileSelector = exports.FatalErrorDialog = exports.ErrorMessage = exports.EditableTypography = exports.Dialog = exports.CascadingMenuButton = exports.CascadingMenu = exports.AssemblySelector = exports.Logomark = exports.LogoFull = void 0;
20
+ exports.VIEW_HEADER_HEIGHT = exports.SanitizedHTML = exports.ResizeHandle = exports.PrerenderedCanvas = exports.Menu = exports.LoadingEllipses = exports.FileSelector = exports.FatalErrorDialog = exports.ErrorMessage = exports.EditableTypography = exports.Dialog = exports.CascadingMenuButton = exports.CascadingMenu = exports.AssemblySelector = exports.Logomark = exports.LogoFull = void 0;
21
21
  __exportStar(require("./theme"), exports);
22
22
  var Logo_1 = require("./Logo");
23
23
  Object.defineProperty(exports, "LogoFull", { enumerable: true, get: function () { return Logo_1.LogoFull; } });
@@ -49,3 +49,4 @@ Object.defineProperty(exports, "ResizeHandle", { enumerable: true, get: function
49
49
  var SanitizedHTML_1 = require("./SanitizedHTML");
50
50
  Object.defineProperty(exports, "SanitizedHTML", { enumerable: true, get: function () { return __importDefault(SanitizedHTML_1).default; } });
51
51
  __exportStar(require("./Menu"), exports);
52
+ exports.VIEW_HEADER_HEIGHT = 28;
package/ui/theme.d.ts CHANGED
@@ -1,66 +1,55 @@
1
1
  import type { ThemeOptions } from '@mui/material/styles';
2
+ import type { PaletteColor } from '@mui/material/styles/createPalette';
3
+ type MaybePaletteColor = PaletteColor | undefined;
4
+ type Frames = [
5
+ null,
6
+ MaybePaletteColor,
7
+ MaybePaletteColor,
8
+ MaybePaletteColor,
9
+ MaybePaletteColor,
10
+ MaybePaletteColor,
11
+ MaybePaletteColor
12
+ ];
2
13
  declare module '@mui/material/styles/createPalette' {
3
14
  interface Palette {
4
- tertiary: Palette['primary'];
5
- quaternary: Palette['primary'];
6
- highlight: Palette['primary'];
7
- stopCodon?: string;
8
- startCodon?: string;
15
+ tertiary: PaletteColor;
16
+ quaternary: PaletteColor;
17
+ highlight: PaletteColor;
18
+ stopCodon: string;
19
+ startCodon: string;
20
+ insertion: string;
21
+ softclip: string;
22
+ skip: string;
23
+ hardclip: string;
24
+ deletion: string;
9
25
  bases: {
10
- A: Palette['primary'];
11
- C: Palette['primary'];
12
- G: Palette['primary'];
13
- T: Palette['primary'];
26
+ A: PaletteColor;
27
+ C: PaletteColor;
28
+ G: PaletteColor;
29
+ T: PaletteColor;
14
30
  };
15
- frames: [
16
- null,
17
- Palette['primary'] | undefined,
18
- Palette['primary'] | undefined,
19
- Palette['primary'] | undefined,
20
- Palette['primary'] | undefined,
21
- Palette['primary'] | undefined,
22
- Palette['primary'] | undefined
23
- ];
24
- framesCDS: [
25
- null,
26
- Palette['primary'] | undefined,
27
- Palette['primary'] | undefined,
28
- Palette['primary'] | undefined,
29
- Palette['primary'] | undefined,
30
- Palette['primary'] | undefined,
31
- Palette['primary'] | undefined
32
- ];
31
+ frames: Frames;
32
+ framesCDS: Frames;
33
33
  }
34
34
  interface PaletteOptions {
35
- tertiary?: PaletteOptions['primary'];
36
- quaternary?: PaletteOptions['primary'];
37
- highlight?: PaletteOptions['primary'];
35
+ tertiary?: PaletteColorOptions;
36
+ quaternary?: PaletteColorOptions;
37
+ highlight?: PaletteColorOptions;
38
38
  stopCodon?: string;
39
39
  startCodon?: string;
40
+ hardclip?: string;
41
+ softclip?: string;
42
+ insertion?: string;
43
+ skip?: string;
44
+ deletion?: string;
40
45
  bases?: {
41
- A?: PaletteOptions['primary'];
42
- C?: PaletteOptions['primary'];
43
- G?: PaletteOptions['primary'];
44
- T?: PaletteOptions['primary'];
46
+ A?: PaletteColorOptions;
47
+ C?: PaletteColorOptions;
48
+ G?: PaletteColorOptions;
49
+ T?: PaletteColorOptions;
45
50
  };
46
- framesCDS?: [
47
- null,
48
- Palette['primary'] | undefined,
49
- Palette['primary'] | undefined,
50
- Palette['primary'] | undefined,
51
- Palette['primary'] | undefined,
52
- Palette['primary'] | undefined,
53
- Palette['primary'] | undefined
54
- ];
55
- frames?: [
56
- null,
57
- Palette['primary'] | undefined,
58
- Palette['primary'] | undefined,
59
- Palette['primary'] | undefined,
60
- Palette['primary'] | undefined,
61
- Palette['primary'] | undefined,
62
- Palette['primary'] | undefined
63
- ];
51
+ framesCDS?: Frames;
52
+ frames?: Frames;
64
53
  }
65
54
  }
66
55
  export declare const defaultThemes: ThemeMap;
package/ui/theme.js CHANGED
@@ -41,20 +41,33 @@ const frames = [
41
41
  ];
42
42
  const stopCodon = '#e22';
43
43
  const startCodon = '#3e3';
44
+ const insertion = '#800080';
45
+ const deletion = '#808080';
46
+ const hardclip = '#f00';
47
+ const softclip = '#00f';
48
+ const skip = '#97b8c9';
49
+ const defaults = {
50
+ quaternary: mandarin,
51
+ highlight: mandarin,
52
+ stopCodon,
53
+ startCodon,
54
+ insertion,
55
+ deletion,
56
+ softclip,
57
+ hardclip,
58
+ bases,
59
+ frames,
60
+ framesCDS,
61
+ skip,
62
+ };
44
63
  function stockTheme() {
45
64
  return {
46
65
  palette: {
66
+ ...defaults,
47
67
  mode: undefined,
48
68
  primary: { main: midnight },
49
69
  secondary: { main: grape },
50
70
  tertiary: forest,
51
- quaternary: mandarin,
52
- highlight: mandarin,
53
- stopCodon,
54
- startCodon,
55
- bases,
56
- frames,
57
- framesCDS,
58
71
  },
59
72
  components: {
60
73
  MuiLink: {
@@ -83,17 +96,8 @@ function getDarkStockTheme() {
83
96
  return {
84
97
  name: 'Dark (stock)',
85
98
  palette: {
99
+ ...defaults,
86
100
  mode: 'dark',
87
- primary: { main: midnight },
88
- secondary: { main: grape },
89
- tertiary: forest,
90
- quaternary: mandarin,
91
- highlight: mandarin,
92
- stopCodon,
93
- startCodon,
94
- bases,
95
- frames,
96
- framesCDS,
97
101
  },
98
102
  components: {
99
103
  MuiAppBar: {
@@ -101,9 +105,7 @@ function getDarkStockTheme() {
101
105
  enableColorOnDark: true,
102
106
  },
103
107
  styleOverrides: {
104
- root: ({ theme }) => {
105
- return theme.palette.primary.main;
106
- },
108
+ root: ({ theme }) => theme.palette.primary.main,
107
109
  },
108
110
  },
109
111
  },
@@ -113,17 +115,11 @@ function getDarkMinimalTheme() {
113
115
  return {
114
116
  name: 'Dark (minimal)',
115
117
  palette: {
118
+ ...defaults,
116
119
  mode: 'dark',
117
120
  primary: { main: colors_1.grey[700] },
118
121
  secondary: { main: colors_1.grey[800] },
119
122
  tertiary: refTheme.palette.augmentColor({ color: { main: colors_1.grey[900] } }),
120
- quaternary: mandarin,
121
- highlight: mandarin,
122
- stopCodon,
123
- startCodon,
124
- bases,
125
- frames,
126
- framesCDS,
127
123
  },
128
124
  };
129
125
  }
@@ -131,16 +127,10 @@ function getMinimalTheme() {
131
127
  return {
132
128
  name: 'Light (minimal)',
133
129
  palette: {
130
+ ...defaults,
134
131
  primary: { main: colors_1.grey[900] },
135
132
  secondary: { main: colors_1.grey[800] },
136
133
  tertiary: refTheme.palette.augmentColor({ color: { main: colors_1.grey[900] } }),
137
- quaternary: mandarin,
138
- highlight: mandarin,
139
- stopCodon,
140
- startCodon,
141
- bases,
142
- frames,
143
- framesCDS,
144
134
  },
145
135
  };
146
136
  }
@@ -365,12 +355,19 @@ function augmentThemeColors(theme = {}) {
365
355
  return theme;
366
356
  }
367
357
  function addMissingColors(theme = {}) {
368
- var _a, _b, _c;
358
+ const { palette } = theme;
369
359
  return augmentThemeColors((0, deepmerge_1.default)(theme, {
370
360
  palette: {
371
- quaternary: ((_a = theme.palette) === null || _a === void 0 ? void 0 : _a.quaternary) || lightgrey,
372
- tertiary: ((_b = theme.palette) === null || _b === void 0 ? void 0 : _b.tertiary) || lightgrey,
373
- highlight: ((_c = theme.palette) === null || _c === void 0 ? void 0 : _c.highlight) || mandarin,
361
+ quaternary: (palette === null || palette === void 0 ? void 0 : palette.quaternary) || lightgrey,
362
+ tertiary: (palette === null || palette === void 0 ? void 0 : palette.tertiary) || lightgrey,
363
+ highlight: (palette === null || palette === void 0 ? void 0 : palette.highlight) || mandarin,
364
+ insertion: (palette === null || palette === void 0 ? void 0 : palette.insertion) || insertion,
365
+ softclip: (palette === null || palette === void 0 ? void 0 : palette.softclip) || softclip,
366
+ skip: (palette === null || palette === void 0 ? void 0 : palette.skip) || skip,
367
+ hardclip: (palette === null || palette === void 0 ? void 0 : palette.hardclip) || hardclip,
368
+ deletion: (palette === null || palette === void 0 ? void 0 : palette.deletion) || deletion,
369
+ startCodon: (palette === null || palette === void 0 ? void 0 : palette.startCodon) || startCodon,
370
+ stopCodon: (palette === null || palette === void 0 ? void 0 : palette.stopCodon) || stopCodon,
374
371
  },
375
372
  }));
376
373
  }